|
@@ -10,9 +10,9 @@
|
|
|
<div class="cololorSelect">
|
|
|
<el-color-picker
|
|
|
show-alpha
|
|
|
- @change="changeColor"
|
|
|
+ @change="changeStrokeColor"
|
|
|
class="fix-box-1"
|
|
|
- v-model="color"
|
|
|
+ v-model="strokecolor"
|
|
|
></el-color-picker>
|
|
|
</div>
|
|
|
<span>颜色</span>
|
|
@@ -25,7 +25,7 @@
|
|
|
@change="changeFontSize"
|
|
|
size="mini"
|
|
|
:min="1"
|
|
|
- :max="20"
|
|
|
+ :max="60"
|
|
|
:maxlength="100"
|
|
|
></el-input-number>
|
|
|
<span>字号</span>
|
|
@@ -52,19 +52,35 @@
|
|
|
></el-input>
|
|
|
<span>文本</span>
|
|
|
</li>
|
|
|
+ <li>
|
|
|
+ <div class="property" style="justify-content:flex-start">
|
|
|
+ <div class="color-box">
|
|
|
+ <div class="cololorSelect">
|
|
|
+ <el-color-picker
|
|
|
+ show-alpha
|
|
|
+ @change="changeColor"
|
|
|
+ class="fix-box-1"
|
|
|
+ v-model="color"
|
|
|
+ ></el-color-picker>
|
|
|
+ </div>
|
|
|
+ <span>文本颜色</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import bus from "@/bus/bus";
|
|
|
export default {
|
|
|
- props: ["strokeColor", "fontSize", "backgroundColor", "textMsg"],
|
|
|
+ props: ["strokeColor", "fontSize", "backgroundColor", "textMsg", "fontColor"],
|
|
|
data() {
|
|
|
return {
|
|
|
size: 0, //font-size
|
|
|
text: "", //文本
|
|
|
- color: "",
|
|
|
+ color: "", // 文本颜色
|
|
|
backgroundcolor: "",
|
|
|
+ strokecolor: '', // 边框颜色
|
|
|
borderLineOption: [
|
|
|
{
|
|
|
id: "solid",
|
|
@@ -87,9 +103,9 @@ export default {
|
|
|
changeText(val) {
|
|
|
bus.$emit("updateStyle", "text", val);
|
|
|
},
|
|
|
- // 改变颜色
|
|
|
+ // 改变字体颜色
|
|
|
changeColor(val) {
|
|
|
- bus.$emit("updateStyle", "strokeColor", val);
|
|
|
+ bus.$emit("updateStyle", "color", val);
|
|
|
},
|
|
|
// 改变背景颜色
|
|
|
changeBackground(val) {
|
|
@@ -99,13 +115,17 @@ export default {
|
|
|
changeFontSize(val) {
|
|
|
bus.$emit("updateStyle", "font", val);
|
|
|
},
|
|
|
+ // 改变边框颜色
|
|
|
+ changeStrokeColor(val) {
|
|
|
+ bus.$emit("updateStyle", "strokeColor", val);
|
|
|
+ }
|
|
|
},
|
|
|
mounted() {
|
|
|
// console.log(Select)
|
|
|
},
|
|
|
watch: {
|
|
|
strokeColor(val) {
|
|
|
- this.color = val;
|
|
|
+ this.strokecolor = val;
|
|
|
},
|
|
|
fontSize(val) {
|
|
|
this.size = val;
|
|
@@ -113,10 +133,12 @@ export default {
|
|
|
backgroundColor(val) {
|
|
|
this.backgroundcolor = val;
|
|
|
},
|
|
|
-
|
|
|
textMsg(val) {
|
|
|
this.text = val;
|
|
|
},
|
|
|
+ fontColor(val) {
|
|
|
+ this.color = val;
|
|
|
+ }
|
|
|
},
|
|
|
};
|
|
|
</script>
|