修改左上方工具

chenzeping

2021-03-12 2366e25dea648aa39dd4ba21205bcc67ee85dc5d

 src/components/panel/bounced/TextBounced.vue

@@ -10,13 +10,13 @@
      <li>

        <form action="" class="bounced-box-content">

          <h6>内容：</h6>

          <div><textarea v-model='bouncedText'></textarea></div>

          <div><textarea v-model='bouncedText' @blur="ChangeText"></textarea></div>

        </form>

      </li>

      <li class="bounced-box-choose">

        <span>颜色：</span>

        <select v-model='bouncedSelect' @click="changeLabelTextSelect()">

          <option v-for="(item,index) in selectOptions" :key="index" :value="item">{{ item }}</option>

          <option v-for="(item,index) in selectOptions" :key="index" :value="item.value">{{ item.text }}</option>

        </select>

      </li>

    </ul>

@@ -24,13 +24,29 @@
</template>



<script>



import MakeTation from '@components/plugin/MakeTation'



export default {

  name: 'TextBounced',

  data () {

    return {

      bouncedText: '',

      bouncedSelect: '红色',

      selectOptions: ['红色', '蓝色', '黄色']

      bouncedSelect: 'red',

      selectOptions: [

        {

          value: 'red',

          text: '红色'

        },

        {

          value: 'blue',

          text: '蓝色'

        },

        {

          value: 'yellow',

          text: '黄色'

        }

      ]

    }

  },

  methods: {

@@ -40,6 +56,11 @@
    changeLabelTextSelect () {

      // this.bouncedSelect = item

      console.log('获取颜色')

      MakeTation.setContentColor(this.bouncedSelect)

    },

    ChangeText () {

      MakeTation.setContentText(this.bouncedText)

      console.log(this.bouncedText)

    }

  }

}

@@ -63,7 +84,7 @@
    margin: 0;



    li {

      margin: 0.5rem 0;

      margin: 1rem 0;

    }



    .bounced-box-title {