feat--文本栏文本、滚动文本、表格被联动

qianming 2 years ago
parent 07a930ff66
commit db13276b94

@ -7,6 +7,8 @@
</template> </template>
<script> <script>
import {targetWidgetLinkageLogic} from "@/views/bigscreenDesigner/designer/linkageLogic";
export default { export default {
name: "WidgetMarquee", name: "WidgetMarquee",
components: {}, components: {},
@ -16,7 +18,8 @@ export default {
}, },
data() { data() {
return { return {
options: {} options: {},
flagInter: null,
}; };
}, },
computed: { computed: {
@ -42,6 +45,9 @@ export default {
styleColor: this.transStyle.marqueeQuit styleColor: this.transStyle.marqueeQuit
}; };
}, },
allComponentLinkage() {
return this.$store.state.designer.allComponentLinkage;
},
isBehavior() { isBehavior() {
return this.styleColor.marqueeSet ? "start()" : "stop()"; return this.styleColor.marqueeSet ? "start()" : "stop()";
} }
@ -51,6 +57,7 @@ export default {
handler(val) { handler(val) {
this.options = val; this.options = val;
this.optionsData = val.data; this.optionsData = val.data;
targetWidgetLinkageLogic(this); // -
this.setOptionsData(); this.setOptionsData();
}, },
deep: true deep: true
@ -63,8 +70,25 @@ export default {
}, },
methods: { methods: {
// //
setOptionsData() { setOptionsData(e, paramsConfig) {
const optionsData = this.optionsData; // or const optionsData = this.optionsData; // or
//
optionsData.dynamicData = optionsData.dynamicData || {}; // dynamicData undefined
const myDynamicData = optionsData.dynamicData;
clearInterval(this.flagInter); //
if (
e &&
optionsData.dataType !== "staticData" &&
Object.keys(myDynamicData.contextData).length
) {
const keyArr = Object.keys(myDynamicData.contextData);
paramsConfig.forEach((conf) => {
if (keyArr.includes(conf.targetKey)) {
myDynamicData.contextData[conf.targetKey] = e[conf.originKey];
}
});
}
//
if (optionsData.dataType == "dynamicData") { if (optionsData.dataType == "dynamicData") {
this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime); this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
} else {}; } else {};

@ -40,12 +40,15 @@
<script> <script>
import vue from "vue"; import vue from "vue";
import VueSuperSlide from "vue-superslide"; import VueSuperSlide from "vue-superslide";
import { targetWidgetLinkageLogic } from "@/views/bigscreenDesigner/designer/linkageLogic";
vue.use(VueSuperSlide); vue.use(VueSuperSlide);
export default { export default {
name: 'widgetTable',
components: {},
props: { props: {
value: Object, value: Object,
ispreview: Boolean ispreview: Boolean,
}, },
data() { data() {
return { return {
@ -64,7 +67,8 @@ export default {
list: [], list: [],
optionsSetUp: {}, optionsSetUp: {},
optionsPosition: {}, optionsPosition: {},
optionsData: {} optionsData: {},
flagInter: null,
}; };
}, },
computed: { computed: {
@ -80,6 +84,9 @@ export default {
background: this.optionsSetUp.tableBgColor background: this.optionsSetUp.tableBgColor
}; };
}, },
allComponentLinkage() {
return this.$store.state.designer.allComponentLinkage;
},
headerTableStlye() { headerTableStlye() {
const headStyle = this.optionsSetUp; const headStyle = this.optionsSetUp;
return { return {
@ -122,12 +129,13 @@ export default {
this.optionsPosition = this.value.position; this.optionsPosition = this.value.position;
this.optionsData = this.value.data; this.optionsData = this.value.data;
this.initData(); this.initData();
targetWidgetLinkageLogic(this); // -
}, },
methods: { methods: {
initData() { initData() {
this.handlerRollFn(); this.handlerRollFn();
this.handlerHead(); this.handlerHead();
this.handlerData(); this.setOptionsData();
this.visConfig(); this.visConfig();
}, },
visConfig() { visConfig() {
@ -148,8 +156,25 @@ export default {
const head = this.optionsSetUp.dynamicAddTable; const head = this.optionsSetUp.dynamicAddTable;
this.header = head; this.header = head;
}, },
handlerData() { setOptionsData(e, paramsConfig) {
const tableData = this.optionsData; const tableData = this.optionsData;
tableData.dynamicData = tableData.dynamicData || {}; // dynamicData undefined
const myDynamicData = tableData.dynamicData;
clearInterval(this.flagInter); //
if (
e &&
tableData.dataType !== "staticData" &&
Object.keys(myDynamicData.contextData).length
) {
const keyArr = Object.keys(myDynamicData.contextData);
paramsConfig.forEach((conf) => {
if (keyArr.includes(conf.targetKey)) {
myDynamicData.contextData[conf.targetKey] = e[conf.originKey];
}
});
}
tableData.dataType == "staticData" tableData.dataType == "staticData"
? this.handlerStaticData(tableData.staticData) ? this.handlerStaticData(tableData.staticData)
: this.handlerDynamicData(tableData.dynamicData, tableData.refreshTime); : this.handlerDynamicData(tableData.dynamicData, tableData.refreshTime);

@ -7,8 +7,9 @@
<template> <template>
<div class="text" :style="styleColor">{{ styleColor.text }}</div> <div class="text" :style="styleColor">{{ styleColor.text }}</div>
</template> </template>
<script> <script>
import {targetWidgetLinkageLogic} from "@/views/bigscreenDesigner/designer/linkageLogic";
export default { export default {
name: "WidgetText", name: "WidgetText",
components: {}, components: {},
@ -19,7 +20,8 @@ export default {
data() { data() {
return { return {
options: {}, options: {},
optionsData: {} optionsData: {},
flagInter: null,
}; };
}, },
computed: { computed: {
@ -43,7 +45,10 @@ export default {
right: this.transStyle.right + "px", right: this.transStyle.right + "px",
whiteSpace: this.transStyle.whiteSpace ? "pre-line": "normal" whiteSpace: this.transStyle.whiteSpace ? "pre-line": "normal"
}; };
} },
allComponentLinkage() {
return this.$store.state.designer.allComponentLinkage;
},
}, },
watch: { watch: {
value: { value: {
@ -58,12 +63,30 @@ export default {
mounted() { mounted() {
this.options = this.value; this.options = this.value;
this.optionsData = this.value.data; this.optionsData = this.value.data;
targetWidgetLinkageLogic(this); // -
this.setOptionsData(); this.setOptionsData();
}, },
methods: { methods: {
// //
setOptionsData() { setOptionsData(e, paramsConfig) {
const optionsData = this.optionsData; // or const optionsData = this.optionsData; // or
//
optionsData.dynamicData = optionsData.dynamicData || {}; // dynamicData undefined
const myDynamicData = optionsData.dynamicData;
clearInterval(this.flagInter); //
if (
e &&
optionsData.dataType !== "staticData" &&
Object.keys(myDynamicData.contextData).length
) {
const keyArr = Object.keys(myDynamicData.contextData);
paramsConfig.forEach((conf) => {
if (keyArr.includes(conf.targetKey)) {
myDynamicData.contextData[conf.targetKey] = e[conf.originKey];
}
});
}
//
if (optionsData.dataType == "dynamicData") { if (optionsData.dataType == "dynamicData") {
this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime); this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
} else {}; } else {};

Loading…
Cancel
Save