20230222
This commit is contained in:
commit
a0e97c56ee
|
|
@ -67,8 +67,8 @@ export default {
|
||||||
// const host = 'ws://49.234.27.18:10087/'; // 一个测试用url,改成给的,ws://broker.emqx.io:8083/mqtt
|
// const host = 'ws://49.234.27.18:10087/'; // 一个测试用url,改成给的,ws://broker.emqx.io:8083/mqtt
|
||||||
var ip = window.location.host.split(":")[0];
|
var ip = window.location.host.split(":")[0];
|
||||||
console.log("ip",ip)
|
console.log("ip",ip)
|
||||||
// const host = `ws://${ip}:10087`;
|
const host = `ws://${ip}:10087`;
|
||||||
const host = 'ws://172.16.1.168:10087/';
|
// const host = 'ws://172.16.1.168:10087/';
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
// 配置
|
// 配置
|
||||||
|
|
|
||||||
|
|
@ -13,46 +13,67 @@
|
||||||
:key="s.analogAreaComponentId"
|
:key="s.analogAreaComponentId"
|
||||||
>
|
>
|
||||||
<template>
|
<template>
|
||||||
<div ref="sectionContent" >
|
<div ref="sectionContent">
|
||||||
<div>
|
<div>
|
||||||
<p class="board-title">
|
<p class="board-title">
|
||||||
<span>{{ s.title }}</span>
|
<span>{{ s.title }}</span>
|
||||||
</p>
|
</p>
|
||||||
<!-- <span class="downPull1" data-num="1" @click="sectionHandle(i)"></span> -->
|
<!-- <span class="downPull1" data-num="1" @click="sectionHandle(i)"></span> -->
|
||||||
</div>
|
</div>
|
||||||
<div v-for="o in s.children" :key="o.analogAreaComponentId">
|
<el-tabs>
|
||||||
|
<el-collapse v-model="acticveName">
|
||||||
<!-- <OD v-if="o.componentName.includes('OD')" :pageType="o.graphicType" triggerType="触发"
|
<div v-for="o in s.children" :key="o.analogAreaComponentId">
|
||||||
:componentName="o.componentName" :echartArr="o.presentationForm"
|
<el-collapse-item :title="o.componentName" :name="o.analogAreaComponentId">
|
||||||
:dataArr="o.trigger" :title="o.componentName.split('_')[0]"
|
<OD
|
||||||
:chartName='o.combinationName' />
|
v-if="o.componentName.includes('OD')"
|
||||||
<typeChart v-else :pageType="o.graphicType" :triggerType="o.timeMode"
|
:pageType="o.graphicType"
|
||||||
:componentName="o.componentName"
|
triggerType="触发"
|
||||||
:dataArr="o.timeMode == '触发' ? o.trigger : o.cycleTimeData"
|
:componentName="o.componentName"
|
||||||
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
|
:echartArr="o.presentationForm"
|
||||||
:chartName='o.combinationName'
|
:dataArr="o.trigger"
|
||||||
:typeValue="o.timeMode == '触发' ? typeValue : typeCycleTimeData" /> -->
|
:title="o.componentName.split('_')[0]"
|
||||||
<OD v-if="o.componentName.includes('OD')" :pageType="o.graphicType" triggerType="触发"
|
:chartName="o.combinationName"
|
||||||
:componentName="o.componentName" :echartArr="o.presentationForm"
|
/>
|
||||||
:dataArr="o.trigger" :title="o.componentName.split('_')[0]"
|
<!--触发的组件 -->
|
||||||
:chartName="o.combinationName" />
|
<typeChart
|
||||||
<typeChart v-if="o.timeMode === '触发'" :pageType="o.graphicType"
|
v-if="o.timeMode === '触发'"
|
||||||
:triggerType="o.timeMode" :componentName="o.componentName" :dataArr="o.trigger"
|
:pageType="o.graphicType"
|
||||||
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
|
:triggerType="o.timeMode"
|
||||||
:chartName="o.combinationName" :typeValue="typeTimeMode" />
|
:componentName="o.componentName"
|
||||||
<typeChart v-if="o.timeMode === '周期时刻'" :pageType="o.graphicType"
|
:dataArr="o.trigger"
|
||||||
:triggerType="o.timeMode" :componentName="o.componentName"
|
:echartArr="o.presentationForm"
|
||||||
:dataArr="o.cycleTimeData" :echartArr="o.presentationForm"
|
:title="o.componentName.split('_')[0]"
|
||||||
:title="o.componentName.split('_')[0]" :chartName="o.combinationName"
|
:chartName="o.combinationName"
|
||||||
:typeValue="typeCycleTimeData" />
|
:typeValue="typeTimeMode"
|
||||||
<!-- 周期统计的组件 -->
|
/>
|
||||||
<typeChart v-if="o.timeMode === '周期统计'" :pageType="o.graphicType"
|
<typeChart
|
||||||
:triggerType="o.timeMode" :componentName="o.componentName"
|
v-if="o.timeMode === '周期时刻'"
|
||||||
:dataArr="o.cycleStatistics" :echartArr="o.presentationForm"
|
:pageType="o.graphicType"
|
||||||
:title="o.componentName.split('_')[0]" :chartName="o.combinationName"
|
:triggerType="o.timeMode"
|
||||||
:typeValue="typeCycleStatistics" />
|
:componentName="o.componentName"
|
||||||
</div>
|
:dataArr="o.cycleTimeData"
|
||||||
<!-- :data="triggerList.length != 0 ? triggerList : tableData" -->
|
:echartArr="o.presentationForm"
|
||||||
|
:title="o.componentName.split('_')[0]"
|
||||||
|
:chartName="o.combinationName"
|
||||||
|
:typeValue="typeCycleTimeData"
|
||||||
|
/>
|
||||||
|
<!-- 周期统计的组件 -->
|
||||||
|
<typeChart
|
||||||
|
style="width: 100%;"
|
||||||
|
v-if="o.timeMode === '周期统计'"
|
||||||
|
:pageType="o.graphicType"
|
||||||
|
:triggerType="o.timeMode"
|
||||||
|
:componentName="o.componentName"
|
||||||
|
:dataArr="o.cycleStatistics"
|
||||||
|
:echartArr="o.presentationForm"
|
||||||
|
:title="o.componentName.split('_')[0]"
|
||||||
|
:chartName="o.combinationName"
|
||||||
|
:typeValue="typeCycleStatistics"
|
||||||
|
/>
|
||||||
|
</el-collapse-item>
|
||||||
|
</div>
|
||||||
|
</el-collapse>
|
||||||
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -351,28 +372,33 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.idVal = this.$route.query.id;
|
this.getNew()
|
||||||
getComponentSection({ VideoId: this.idVal }).then(res => {
|
},
|
||||||
|
methods: {
|
||||||
|
getNew(){
|
||||||
|
// this.idVal = ;
|
||||||
|
getComponentSection({ VideoId: this.$route.query.id }).then(res => {
|
||||||
if (res.data.code == 200) {
|
if (res.data.code == 200) {
|
||||||
this.componentList = res.data.data;
|
this.componentList = res.data.data;
|
||||||
this.siftData();
|
this.siftData();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
methods: {
|
|
||||||
siftData() {
|
siftData() {
|
||||||
|
// this.sectionArr=[]
|
||||||
|
// this.sectionData=[]
|
||||||
this.componentList.forEach(val => {
|
this.componentList.forEach(val => {
|
||||||
this.sectionArr.push(val.combinationName);
|
this.sectionArr.push(val.combinationName);
|
||||||
this.sectionArr = Array.from(new Set(this.sectionArr));
|
this.sectionArr = Array.from(new Set(this.sectionArr));
|
||||||
});
|
});
|
||||||
this.sectionData = this.sectionArr.map(item => {
|
this.sectionData = this.sectionArr.map(item => {
|
||||||
item = { title: item, children: [] };
|
item = { title: item, children: [] };
|
||||||
this.acticveName=[]
|
this.acticveName = [];
|
||||||
this.componentList.forEach(val => {
|
this.componentList.forEach(val => {
|
||||||
if (item.title == val.combinationName) {
|
if (item.title == val.combinationName) {
|
||||||
item.children.push(val);
|
item.children.push(val);
|
||||||
}
|
}
|
||||||
this.acticveName.push(val.analogAreaComponentId)
|
this.acticveName.push(val.analogAreaComponentId);
|
||||||
});
|
});
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
|
|
@ -397,6 +423,19 @@ export default {
|
||||||
// sectionBox[i].style.height = '48vh';
|
// sectionBox[i].style.height = '48vh';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
channge(oldVal, newVal){
|
||||||
|
console.log("old",oldVal)
|
||||||
|
console.log("newVal",newVal)
|
||||||
|
if(oldVal=='second'){
|
||||||
|
this.sectionArr=[]
|
||||||
|
this.sectionData=[]
|
||||||
|
this.getNew()
|
||||||
|
}else if(newVal=='second'){
|
||||||
|
this.sectionArr=[]
|
||||||
|
this.sectionData=[]
|
||||||
|
this.getNew()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 触发数据的类型数值
|
// 触发数据的类型数值
|
||||||
|
|
@ -408,7 +447,7 @@ export default {
|
||||||
handler(newVal, oldVal) {},
|
handler(newVal, oldVal) {},
|
||||||
immediate: true
|
immediate: true
|
||||||
},
|
},
|
||||||
|
activeName:'channge',
|
||||||
// 处理过的触发数据
|
// 处理过的触发数据
|
||||||
triggerListData: {
|
triggerListData: {
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
|
|
|
||||||
|
|
@ -409,8 +409,6 @@ export default {
|
||||||
getDataByMqtt(url, topic, cIdNum) {
|
getDataByMqtt(url, topic, cIdNum) {
|
||||||
const clientId = "test_id_" + String(new Date().getTime()); // 用户名
|
const clientId = "test_id_" + String(new Date().getTime()); // 用户名
|
||||||
// const host = 'ws://49.234.27.18:10087/'; // 一个测试用url,改成给的,ws://broker.emqx.io:8083/mqtt
|
// const host = 'ws://49.234.27.18:10087/'; // 一个测试用url,改成给的,ws://broker.emqx.io:8083/mqtt
|
||||||
var ip = window.location.host.split(":")[0];
|
|
||||||
console.log("ip",ip)
|
|
||||||
const host = `ws://${ip}:10087`;
|
const host = `ws://${ip}:10087`;
|
||||||
// const host = 'ws://172.16.1.168:10087/';
|
// const host = 'ws://172.16.1.168:10087/';
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue