From 6aac0dd9c6d6bd3de148f3d6e123f9c91b1aab4b Mon Sep 17 00:00:00 2001 From: user1 <10901603+no-distractions1@user.noreply.gitee.com> Date: 星期二, 02 七月 2024 09:31:04 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/components/graffiti/components/brushSize.vue | 36 +++++++++++++++++++++++++++++++++--- 1 files changed, 33 insertions(+), 3 deletions(-) diff --git a/src/components/graffiti/components/brushSize.vue b/src/components/graffiti/components/brushSize.vue index 9c47a7c..ec5043a 100644 --- a/src/components/graffiti/components/brushSize.vue +++ b/src/components/graffiti/components/brushSize.vue @@ -1,14 +1,23 @@ <template> - <div class="wrap-range"> + <div class="brushSize"> <!-- 涓轰簡涓嶅湪瀛愮粍浠朵腑鍙樻洿鍊硷紝涓嶇敤v-model --> - <input + <div class="wrap-range"> + <input type="range" :value="brushSize" min="1" max="30" title="璋冩暣绗斿埛绮楃粏" + class="input-brush" @change="(event) => $emit('change-size', +event.target.value)" /> + </div> + + <!-- <el-color-picker v-model="checkColor" @change="onChangeColor"></el-color-picker> --> + <div> + <input type="color" v-model="checkColor" @input="onChangeColor"> + </div> + </div> </template> @@ -24,12 +33,33 @@ brushSize() { return this.size } + }, + data() { + return { + checkColor:"#000000" + } + }, + methods:{ + onChangeColor(e) { + this.$emit("change-color", e.srcElement.value); + }, } }; // const brushSize = computed(() => props.size); </script> -<style scoped> +<style lang="less" scoped> +.brushSize { + display: flex; +} +.wrap-range { + display: flex; + align-items: center; + margin-right: 10px; + .el-color-picker { + margin-left: 20px; + } +} .wrap-range input { width: 150px; height: 20px; -- Gitblit v1.9.1