@@ -37,8 +38,7 @@
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
:chartName="o.combinationName" :typeValue="typeCycleTimeData"
:startEndData="{ start: o.startSectionNames, end: o.endSectionNames }"
- :historyData="o.cycleTimeData
- " />
+ />
+ :startEndData="{ start: o.startSectionNames, end: o.endSectionNames }" />
@@ -101,6 +100,13 @@ export default {
default() {
return [];
}
+ },
+ //历史数据
+ cycleHistoryData: {
+ type: Object,
+ default() {
+ return {};
+ }
}
},
data() {
@@ -135,7 +141,8 @@ export default {
typeCycleStatistics: {},
// 各个组件分类
- classify: []
+ classify: [],
+ // cycleHistoryData:''
};
},
// beforeCeated(){
@@ -143,16 +150,17 @@ export default {
// },
created() {
// this.getNew()
+ // console.log("cycleHistoryData",this.cycleHistoryData)
},
methods: {
// 手风琴下拉切换
handleChange(val) {
-
- this.$nextTick(function () {
- var myEvent = new Event("resize");
- window.dispatchEvent(myEvent);
- });
-
+ // setTimeout(() => {
+ // this.$nextTick(function () {
+ // var myEvent = new Event("resize");
+ // window.dispatchEvent(myEvent);
+ // });
+ // }, 3000);
},
getNew() {
// this.idVal = ;
@@ -161,6 +169,7 @@ export default {
console.log(res.data.data, '组件的数据');
this.componentList = res.data.data;
this.siftData();
+
}
});
},
@@ -176,7 +185,6 @@ export default {
});
this.sectionData = this.sectionArr.map(item => {
-
item = { title: item, children: [] };
this.acticveName = [];
this.componentList.forEach(val => {
@@ -184,11 +192,34 @@ export default {
this.classify.push(val);
item.children.push(val);
if (val.timeMode == '周期统计' || this.cycleStatisticsData.length == 0) {
- item.cycleStatisticsData = val.cycleStatisticsData
+ // if(this.$route.query.type=='离线视频'){
+ // if(this.cycleHistoryData.CycleStatisticsData!=undefined){
+ // this.cycleHistoryData.CycleStatisticsData.forEach(ele => {
+ // if(val.analogAreaComponentId == ele.component_id){
+ // item.cycleStatisticsData = ele.cycleStatisticsData
+ // }
+ // })
+ // }
+
+
+ // }else{
+ item.cycleStatisticsData = val.cycleStatisticsData
+ // }
+
}
if (val.timeMode == '周期时刻' || this.cycleTimeData.length == 0) {
+ // if(this.$route.query.type=='离线视频'){
+ // if(this.cycleHistoryData.CycleTimeData!=undefined){
+ // this.cycleHistoryData.CycleTimeData.forEach(ele => {
+ // if(val.analogAreaComponentId == ele.component_id){
+ // item.cycleTimeData = ele.cycleTimeData
+ // }
+ // })
+ // }
+
+ // }else{
item.cycleTimeData = val.cycleTimeData
-
+ // }
}
}
this.acticveName.push([val.analogAreaComponentId]);
@@ -221,13 +252,12 @@ export default {
// 触发数据的类型数值
//循环方法
- getRef(data,timeMode) {
- // console.log(timeMode);
+ getRef(data, timeMode) {
for (let i = 0; i < data.length; i++) {
let refItem = data[i]
if (data.length != 0 && refItem.dataArr != undefined && refItem.dataArr.length != 0) {
if (refItem.echartArr.includes('时间曲线图')) {
- refItem.$refs.lineChartRef.drawLine(refItem.dataArr,refItem.componentName.split('_')[0],timeMode)
+ refItem.$refs.lineChartRef.drawLine(refItem.dataArr, refItem.componentName.split('_')[0], timeMode)
}
if (refItem.echartArr.includes('数值')) {
refItem.getDataArr(refItem.dataArr)
@@ -243,8 +273,15 @@ export default {
if (refItem.echartArr.includes('均值图') && refItem.$refs.avgChartRef != undefined) {
refItem.$refs.avgChartRef.drawBar(refItem.dataArr[0])
}
+ if (refItem.componentName.includes('OD') && refItem.$refs.ODChartRef != undefined && refItem.dataArr[0].ob_data.length != 0) {
+ refItem.$refs.ODChartRef.drawThermalChart(refItem.dataArr[0].ob_data, refItem.startEndData)
+ }
}
}
+ },
+ //处理离线视频历史数据
+ changecycleHistoryData(){
+
}
},
mounted() { },
@@ -265,55 +302,188 @@ export default {
},
componentList: {
handler(newVal) {
- // console.log("componentList", newVal)
+ console.log("componentList", newVal)
if (newVal != undefined && newVal.length != 0) {
newVal.forEach(ele => {
- if (ele.timeMode == '周期统计') {
+ if (ele.timeMode == '周期统计'&&this.$route.query.type=='实时视频') {
+ console.log("实时视频")
this.$nextTick(() => {
// var thatNN = this;
ele.cycleStatisticsData.forEach(item => {
if (item.type_data != null) {
- this.typeCycleStatistics = item;
+ this.typeCycleStatistics = item;
}
})
- if (this.$refs.typeChartRef2 != undefined) {
- // // 轮循周期时刻生成的各类组件
- this.getRef(this.$refs.typeChartRef2,ele.timeMode)
+ if (this.$refs.typeChartRef2 != undefined) {
+ // // 轮循周期时刻生成的各类组件
+ this.getRef(this.$refs.typeChartRef2, ele.timeMode)
}
})
}
- if (ele.timeMode == '周期时刻') {
- this.$nextTick(()=>{
- ele.cycleStatisticsData.forEach(item => {
+ if(ele.timeMode == '周期统计'&&this.$route.query.type=='离线视频'){
+
+ if(this.cycleHistoryData.CycleStatisticsData!=undefined&&this.cycleHistoryData.CycleStatisticsData.lenght!=0){
+ this.cycleHistoryData.CycleStatisticsData.forEach(ne => {
+ if(ne.component_id== ele.analogAreaComponentId ){
+ ele.cycleStatisticsData = ne.cycleStatisticsData
+ }
+
+ })
+ this.$nextTick(() => {
+ ele.cycleStatisticsData.forEach(item => {
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
if (item.type_data != null) {
+
this.typeCycleStatistics = item;
}
// thatN.$nextTick(() => {
-
+
+ })
+ if (this.$refs.typeChartRef2 != undefined) {
+ // // 轮循周期时刻生成的各类组件
+ this.getRef(this.$refs.typeChartRef2, '周期统计')
+ }
+ })
+
+
+ }
+ if (ele.timeMode == '周期时刻'&&this.$route.query.type=='实时视频') {
+ console.log("实时视频")
+ this.$nextTick(() => {
+ ele.cycleTimeData.forEach(item => {
+ if (item.type_data != null) {
+ item.time = item.time.split('.')[0];
+
+ this.typeCycleStatistics = item;
+ }
+ // thatN.$nextTick(() => {
+
})
if (this.$refs.typeChartRef1 != undefined) {
- // // 轮循周期时刻生成的各类组件
- this.getRef(this.$refs.typeChartRef1,ele.timeMode)
+ // // 轮循周期时刻生成的各类组件
+ this.getRef(this.$refs.typeChartRef1, ele.timeMode)
}
})
-
-
-
}
+
+ } if(ele.timeMode == '周期时刻'&&this.$route.query.type=='离线视频'){
+ if(this.cycleHistoryData.CycleTimeData!=undefined &&this.cycleHistoryData.CycleTimeData.lenght!=0){
+ this.cycleHistoryData.CycleTimeData.forEach(ne => {
+ if(ne.component_id== ele.analogAreaComponentId ){
+ ele.cycleTimeData = ne.cycleTimeData
+ }
+
+ })
+ this.$nextTick(() => {
+ ele.cycleTimeData.forEach(item => {
+ // if(this.$route.query.type=='离线视频'){
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
+ // }else{
+ // item.time = item.time.split('.')[0];
+ // }
+ if (item.type_data != null) {
+ this.typeCycleStatistics = item;
+ }
+ })
+ if (this.$refs.typeChartRef1 != undefined) {
+ // // 轮循周期时刻生成的各类组件
+
+ this.getRef(this.$refs.typeChartRef1, '周期时刻')
+ }
+ })
+
+ }
+ }
+
});
}
},
immediate: true,
deep: true,
+ },
+ cycleHistoryData: {
+ handler(newVal) {
+ // debugger
+ console.log("历史",newVal)
+ // console.log("历史",oldVal)
+ if (newVal != undefined ) {
+ // newVal.forEach(ele => {
+ if (newVal.CycleStatisticsData) {
+ newVal.CycleStatisticsData.forEach(ele => {
+ this.$nextTick(() => {
+ // var thatNN = this;
+ ele.cycleStatisticsData.forEach(item => {
+ if (item.type_data != null) {
+ if(this.$route.query.type=='离线视频'){
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
+ }else{
+ item.time = item.time.split('.')[0];
+ }
+ this.typeCycleStatistics = item;
+ }
+ })
+ if (this.$refs.typeChartRef2 != undefined) {
+ // // 轮循周期时刻生成的各类组件
+ this.getRef(this.$refs.typeChartRef2, '周期统计')
+ }
+ })
+ })
+
+ }
+ if (newVal.CycleTimeData) {
+ newVal.CycleTimeData.forEach(ele => {
+ this.$nextTick(() => {
+ // debugger
+ // var thatNN = this;
+ ele.cycleTimeData.forEach(item => {
+ if(this.$route.query.type=='离线视频'){
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
+ }else{
+ item.time = item.time.split('.')[0];
+ }
+ if (item.type_data != null) {
+ this.typeCycleStatistics = item;
+ }
+
+ })
+ if (this.$refs.typeChartRef1 != undefined) {
+ // // 轮循周期时刻生成的各类组件
+ this.getRef(this.$refs.typeChartRef1, '周期时刻')
+ }
+ })
+ })
+
+ }
+
+ // });
+ }
+
+ },
+ immediate: true,
+ deep: true,
},
// activeName:'channge',
// 处理过的触发数据
triggerListData: {
handler(newVal) {
+ // console.log("newVal",newVal)
this.triggerList = newVal;
+ // console.log("oldVal",oldVal)
// 触发数据
var _this = this
if (newVal.length != 0 && _this.sectionData) {
@@ -323,10 +493,20 @@ export default {
}
newVal.forEach(item => {
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') {
+ // console.log(ele.analogAreaComponentId, 'analogAreaComponentId');
+ // console.log(item.component_id, 'component_id');
if (ele.trigger.length == 10) {
ele.trigger.pop();
} else {
- item.time = item.time.split('.')[0];
+ if(this.$route.query.type=='离线视频'){
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
+ }else{
+ item.time = item.time.split('.')[0];
+ }
+
// 该时间的触发数据
if (item.type_data != null) {
_this.typeTimeMode = item;
@@ -353,6 +533,9 @@ export default {
// 数据改变重新渲染饼图
itemTypeChart.$refs.pieChartRef.drawPie(itemTypeChart.dataArr[0])
}
+ if (itemTypeChart.componentName.includes('OD') && itemTypeChart.$refs.ODChartRef != undefined && itemTypeChart.dataArr[0].ob_data.length != 0) {
+ itemTypeChart.$refs.ODChartRef.drawThermalChart(itemTypeChart.dataArr[0].ob_data, itemTypeChart.startEndData)
+ }
}
}
@@ -371,18 +554,27 @@ export default {
cycleTimeData: {
handler(newVal) {
// 监听到打印周期时刻数据
- // console.log(newVal, '周期时刻数据');
+ console.log(newVal, '周期时刻数据');
if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var thatN = this;
thatN.classify.forEach((ele, index) => {
-
+
newVal.forEach(item => {
+
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期时刻') {
if (ele.cycleTimeData.length == 10) {
ele.cycleTimeData.pop();
} else {
- item.time = item.time.split('.')[0];
+ // item.time = item.time.split('.')[0];
+ // if(this.$route.query.type=='离线视频'){
+ // var timeNew = item.time.split('.')[0]
+ // var dateLength = timeNew.length;
+ // var key = timeNew.substring(dateLength-8,dateLength);
+ // item.time = key;
+ // }else{
+ // item.time = item.time.split('.')[0];
+ // }
if (item.type_data != null) {
// 周期时刻的类型数据
thatN.typeCycleTimeData = item;
@@ -429,7 +621,7 @@ export default {
} else {
var _thatN = this
_thatN.classify.forEach((ele, index) => {
-
+
// newVal.forEach(item => {
if (ele.timeMode == '周期时刻') {
if (ele.cycleTimeData.length == 10) {
@@ -486,7 +678,7 @@ export default {
//周期统计
cycleStatisticsData: {
handler(newVal) {
- // console.log("newVal", newVal)
+ console.log("newVal", newVal)
if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var that = this;
that.classify.forEach((ele, index) => {
@@ -496,7 +688,14 @@ export default {
ele.cycleStatisticsData.pop();
} else {
- item.time = item.time.split('.')[0];
+ if(this.$route.query.type=='离线视频'){
+ var timeNew = item.time.split('.')[0]
+ var dateLength = timeNew.length;
+ var key = timeNew.substring(dateLength-8,dateLength);
+ item.time = key;
+ }else{
+ item.time = item.time.split('.')[0];
+ }
if (item.type_data != null) {
that.typeCycleStatistics = item;
}
@@ -593,22 +792,8 @@ export default {
}
},
immediate: true
- }
- // activeName: {
- // handler(newVal) {
- // if (newVal == "second") {
- // getComponentSection({ VideoId: this.$route.query.id }).then(res => {
- // if (res.data.code == 200) {
- // this.componentList = res.data.data;
- // this.siftData();
- // } else if (res.data.code == 404) {
- // }
- // });
- // }
-
- // },
- // immediate: true
- // }
+ },
+
}
};
diff --git a/src/views/general/network.vue b/src/views/general/network.vue
index 381427d5..eedba942 100644
--- a/src/views/general/network.vue
+++ b/src/views/general/network.vue
@@ -1,50 +1,61 @@
-
+
界面
-
+
-
+
-
+
-
+
-
+
-
+
+
+
+
+
+
运行状态
-
+
-
+
- YES
+ {{sizeForm.status}}
-
+
+
+ 静态地址
+ 新增
+
-
+
+
+
+
-
+
-
- 确认
-
+
+
+ 删除行
+
+
- DHCP
+
-
静态地址
+
+
+
默认网关
+
+
+
+
静态路由
-
-
+ 新增
+
+
+
+
+
+
+
+
+
-
+
-
+
+
+
+
-
+
+
+
+
-
+
+
+ 删除行
+
DNS服务
-
+
+
+ 新增
+
+
+
+
+
+
+
+
+
+
+
+
+ 删除行
+
+
+
+
+
+ 保存
+
@@ -164,9 +237,94 @@