|
|
@ -1,11 +1,12 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div :style="styleObj">
|
|
|
|
<div :style="styleObj">
|
|
|
|
<v-chart :options="options" autoresize/>
|
|
|
|
<v-chart ref="myVChart" :options="options" autoresize/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
import echarts from "echarts";
|
|
|
|
import echarts from "echarts";
|
|
|
|
|
|
|
|
import {targetWidgetLinkageLogic} from "@/views/bigscreenDesigner/designer/linkageLogic";
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
export default {
|
|
|
|
name: "WidgetGauge",
|
|
|
|
name: "WidgetGauge",
|
|
|
@ -13,6 +14,7 @@ export default {
|
|
|
|
props: {
|
|
|
|
props: {
|
|
|
|
value: Object,
|
|
|
|
value: Object,
|
|
|
|
ispreview: Boolean,
|
|
|
|
ispreview: Boolean,
|
|
|
|
|
|
|
|
flagInter: null,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
@ -139,6 +141,9 @@ export default {
|
|
|
|
background: this.optionsSetup.background,
|
|
|
|
background: this.optionsSetup.background,
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
allComponentLinkage() {
|
|
|
|
|
|
|
|
return this.$store.state.designer.allComponentLinkage;
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
watch: {
|
|
|
|
value: {
|
|
|
|
value: {
|
|
|
@ -159,6 +164,9 @@ export default {
|
|
|
|
this.optionsSetup = this.value.setup;
|
|
|
|
this.optionsSetup = this.value.setup;
|
|
|
|
this.editorOptions();
|
|
|
|
this.editorOptions();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
mounted() {
|
|
|
|
|
|
|
|
targetWidgetLinkageLogic(this);
|
|
|
|
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
editorOptions() {
|
|
|
|
editorOptions() {
|
|
|
|
this.setOptions();
|
|
|
|
this.setOptions();
|
|
|
@ -268,8 +276,25 @@ export default {
|
|
|
|
series[0].detail = detail;
|
|
|
|
series[0].detail = detail;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
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];
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
optionsData.dataType == "staticData"
|
|
|
|
optionsData.dataType == "staticData"
|
|
|
|
? this.staticDataFn(optionsData.staticData)
|
|
|
|
? this.staticDataFn(optionsData.staticData)
|
|
|
|
: this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
|
|
|
|
: this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
|
|
|
|