2023022402
This commit is contained in:
commit
936255e140
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
||||||
{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\src\\config\\apiurl.js","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\config\\apiurl.js","mtime":1677026201574},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.regexp.split\";\nvar ipUurl = window.location.host.split(\":\")[0];\nexport default {\n // dataUrl: \"http://172.16.1.22:8080/api/AddShipjk\",\n // getSpareElementOrder: \"http://172.16.1.22:8080/api/Upload\",\n // postSetQuanjsz: \"http://172.16.1.22:8080/api/SetQuanjsz\",\n // //新增图形接口\n // addFigure: \"http://172.16.1.22:8080/api/AddJianktx\", \n // //编辑图形名称\n // editFigure: \"http://172.16.1.22:8080/api/EditTuxmc\",\n // //编辑保存组件弹窗传参\n // editComponent: \"http://172.16.1.22:8080/api/SetMonqjkzjcs\", \n dataUrl: \"http://172.16.1.168:5000/api/AddShipjk\",\n getSpareElementOrder: \"http://172.16.1.168:5000/api/Upload\",\n postSetQuanjsz: \"http://172.16.1.168:5000/api/SetQuanjsz\",\n //新增图形接口\n addFigure: \"http://172.16.1.168:5000/api/AddJianktx\",\n //编辑图形名称\n editFigure: \"http://172.16.1.168:5000/api/EditTuxmc\",\n //编辑保存组件弹窗传参\n editComponent: \"http://172.16.1.168:5000/api/SetMonqjkzjcs\" // `http://${ipUurl}:5000/api/AddShipjk`\n // dataUrl: `http://${ipUurl}:5000/api/AddShipjk`,\n // getSpareElementOrder: `http://${ipUurl}:5000/api/Upload`,\n // postSetQuanjsz: `http://${ipUurl}:5000/api/SetQuanjsz`,\n // //新增图形接口\n // addFigure: `http://${ipUurl}:5000/api/AddJianktx`, \n // //编辑图形名称\n // editFigure: `http://${ipUurl}:5000/api/EditTuxmc`,\n // //编辑保存组件弹窗传参\n // editComponent: `http://${ipUurl}:5000/api/SetMonqjkzjcs`, \n\n};",{"version":3,"sources":["E:/视频边缘计算管理平台/TransFlow/src/config/apiurl.js"],"names":["ipUurl","window","location","host","split","dataUrl","getSpareElementOrder","postSetQuanjsz","addFigure","editFigure","editComponent"],"mappings":";AAAA,IAAIA,MAAM,GAAGC,MAAM,CAACC,QAAP,CAAgBC,IAAhB,CAAqBC,KAArB,CAA2B,GAA3B,EAAgC,CAAhC,CAAb;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGAC,EAAAA,OAAO,EAAE,wCAZM;AAafC,EAAAA,oBAAoB,EAAE,qCAbP;AAcfC,EAAAA,cAAc,EAAE,yCAdD;AAef;AACAC,EAAAA,SAAS,EAAE,yCAhBI;AAiBf;AACAC,EAAAA,UAAU,EAAE,wCAlBG;AAmBf;AACAC,EAAAA,aAAa,EAAE,4CApBA,CAqBf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AA9Be,CAAf","sourcesContent":["var ipUurl = window.location.host.split(\":\")[0];\r\nexport default {\r\n// dataUrl: \"http://172.16.1.22:8080/api/AddShipjk\",\r\n// getSpareElementOrder: \"http://172.16.1.22:8080/api/Upload\",\r\n// postSetQuanjsz: \"http://172.16.1.22:8080/api/SetQuanjsz\",\r\n// //新增图形接口\r\n// addFigure: \"http://172.16.1.22:8080/api/AddJianktx\", \r\n// //编辑图形名称\r\n// editFigure: \"http://172.16.1.22:8080/api/EditTuxmc\",\r\n// //编辑保存组件弹窗传参\r\n// editComponent: \"http://172.16.1.22:8080/api/SetMonqjkzjcs\", \r\n\r\n\r\ndataUrl: \"http://172.16.1.168:5000/api/AddShipjk\",\r\ngetSpareElementOrder: \"http://172.16.1.168:5000/api/Upload\",\r\npostSetQuanjsz: \"http://172.16.1.168:5000/api/SetQuanjsz\",\r\n//新增图形接口\r\naddFigure: \"http://172.16.1.168:5000/api/AddJianktx\", \r\n//编辑图形名称\r\neditFigure: \"http://172.16.1.168:5000/api/EditTuxmc\",\r\n//编辑保存组件弹窗传参\r\neditComponent: \"http://172.16.1.168:5000/api/SetMonqjkzjcs\", \r\n// `http://${ipUurl}:5000/api/AddShipjk`\r\n// dataUrl: `http://${ipUurl}:5000/api/AddShipjk`,\r\n// getSpareElementOrder: `http://${ipUurl}:5000/api/Upload`,\r\n// postSetQuanjsz: `http://${ipUurl}:5000/api/SetQuanjsz`,\r\n// //新增图形接口\r\n// addFigure: `http://${ipUurl}:5000/api/AddJianktx`, \r\n// //编辑图形名称\r\n// editFigure: `http://${ipUurl}:5000/api/EditTuxmc`,\r\n// //编辑保存组件弹窗传参\r\n// editComponent: `http://${ipUurl}:5000/api/SetMonqjkzjcs`, \r\n};\r\n"]}]}
|
{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\src\\config\\apiurl.js","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\config\\apiurl.js","mtime":1677208560152},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.regexp.split\";\nvar ipUurl = window.location.host.split(':')[0];\nexport default {\n // dataUrl: \"http://172.16.1.22:8080/api/AddShipjk\",\n // getSpareElementOrder: \"http://172.16.1.22:8080/api/Upload\",\n // postSetQuanjsz: \"http://172.16.1.22:8080/api/SetQuanjsz\",\n // //新增图形接口\n // addFigure: \"http://172.16.1.22:8080/api/AddJianktx\",\n // //编辑图形名称\n // editFigure: \"http://172.16.1.22:8080/api/EditTuxmc\",\n // //编辑保存组件弹窗传参\n // editComponent: \"http://172.16.1.22:8080/api/SetMonqjkzjcs\",\n dataUrl: 'http://172.16.1.168:5000/api/AddShipjk',\n getSpareElementOrder: 'http://172.16.1.168:5000/api/Upload',\n postSetQuanjsz: 'http://172.16.1.168:5000/api/SetQuanjsz',\n saveRoleApi: 'http://172.16.1.168:5000/api/AddZhangh',\n editRoleApi: 'http://172.16.1.168:5000/api/EditZhangh',\n //新增图形接口\n addFigure: 'http://172.16.1.168:5000/api/AddJianktx',\n //编辑图形名称\n editFigure: 'http://172.16.1.168:5000/api/EditTuxmc',\n //编辑保存组件弹窗传参\n editComponent: 'http://172.16.1.168:5000/api/SetMonqjkzjcs' // `http://${ipUurl}:5000/api/AddShipjk`\n // dataUrl: `http://${ipUurl}:5000/api/AddShipjk`,\n // getSpareElementOrder: `http://${ipUurl}:5000/api/Upload`,\n // postSetQuanjsz: `http://${ipUurl}:5000/api/SetQuanjsz`,\n // //新增图形接口\n // addFigure: `http://${ipUurl}:5000/api/AddJianktx`,\n // //编辑图形名称\n // editFigure: `http://${ipUurl}:5000/api/EditTuxmc`,\n // //编辑保存组件弹窗传参\n // editComponent: `http://${ipUurl}:5000/api/SetMonqjkzjcs`,\n\n};",{"version":3,"sources":["E:/视频边缘计算管理平台/TransFlow/src/config/apiurl.js"],"names":["ipUurl","window","location","host","split","dataUrl","getSpareElementOrder","postSetQuanjsz","saveRoleApi","editRoleApi","addFigure","editFigure","editComponent"],"mappings":";AAAA,IAAIA,MAAM,GAAGC,MAAM,CAACC,QAAP,CAAgBC,IAAhB,CAAqBC,KAArB,CAA2B,GAA3B,EAAgC,CAAhC,CAAb;AACA,eAAe;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEAC,EAAAA,OAAO,EAAE,wCAXE;AAYXC,EAAAA,oBAAoB,EAAE,qCAZX;AAaXC,EAAAA,cAAc,EAAE,yCAbL;AAcXC,EAAAA,WAAW,EAAE,wCAdF;AAeXC,EAAAA,WAAW,EAAE,yCAfF;AAiBX;AACAC,EAAAA,SAAS,EAAE,yCAlBA;AAmBX;AACAC,EAAAA,UAAU,EAAE,wCApBD;AAqBX;AACAC,EAAAA,aAAa,EAAE,4CAtBJ,CAwBX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAjCW,CAAf","sourcesContent":["var ipUurl = window.location.host.split(':')[0];\r\nexport default {\r\n // dataUrl: \"http://172.16.1.22:8080/api/AddShipjk\",\r\n // getSpareElementOrder: \"http://172.16.1.22:8080/api/Upload\",\r\n // postSetQuanjsz: \"http://172.16.1.22:8080/api/SetQuanjsz\",\r\n // //新增图形接口\r\n // addFigure: \"http://172.16.1.22:8080/api/AddJianktx\",\r\n // //编辑图形名称\r\n // editFigure: \"http://172.16.1.22:8080/api/EditTuxmc\",\r\n // //编辑保存组件弹窗传参\r\n // editComponent: \"http://172.16.1.22:8080/api/SetMonqjkzjcs\",\r\n\r\n dataUrl: 'http://172.16.1.168:5000/api/AddShipjk',\r\n getSpareElementOrder: 'http://172.16.1.168:5000/api/Upload',\r\n postSetQuanjsz: 'http://172.16.1.168:5000/api/SetQuanjsz',\r\n saveRoleApi: 'http://172.16.1.168:5000/api/AddZhangh',\r\n editRoleApi: 'http://172.16.1.168:5000/api/EditZhangh',\r\n\r\n //新增图形接口\r\n addFigure: 'http://172.16.1.168:5000/api/AddJianktx',\r\n //编辑图形名称\r\n editFigure: 'http://172.16.1.168:5000/api/EditTuxmc',\r\n //编辑保存组件弹窗传参\r\n editComponent: 'http://172.16.1.168:5000/api/SetMonqjkzjcs'\r\n\r\n // `http://${ipUurl}:5000/api/AddShipjk`\r\n // dataUrl: `http://${ipUurl}:5000/api/AddShipjk`,\r\n // getSpareElementOrder: `http://${ipUurl}:5000/api/Upload`,\r\n // postSetQuanjsz: `http://${ipUurl}:5000/api/SetQuanjsz`,\r\n // //新增图形接口\r\n // addFigure: `http://${ipUurl}:5000/api/AddJianktx`,\r\n // //编辑图形名称\r\n // editFigure: `http://${ipUurl}:5000/api/EditTuxmc`,\r\n // //编辑保存组件弹窗传参\r\n // editComponent: `http://${ipUurl}:5000/api/SetMonqjkzjcs`,\r\n};\r\n"]}]}
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
||||||
{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\myId.vue?vue&type=script&lang=js&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\myId.vue","mtime":1677026201587},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nexport default {\n data: function data() {\n return {\n formLabelAlign: {\n name: 'admin',\n account: 'admin',\n password: '123456'\n }\n };\n }\n};",{"version":3,"sources":["myId.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,eAAA;AACA,EAAA,IADA,kBACA;AACA,WAAA;AACA,MAAA,cAAA,EAAA;AACA,QAAA,IAAA,EAAA,OADA;AAEA,QAAA,OAAA,EAAA,OAFA;AAGA,QAAA,QAAA,EAAA;AAHA;AADA,KAAA;AAOA;AATA,CAAA","sourcesContent":["<template>\r\n <div class=\"content-box\">\r\n <div class=\"container\">\r\n <p class=\"title\">我的账号</p>\r\n <!-- <div class=\"test-div\">\r\n <i class=\"el-icon-edit\"></i>\r\n <i class=\"el-icon-share\"></i>\r\n <i class=\"el-icon-delete\"></i>\r\n </div> -->\r\n <el-form label-position=\"left\" label-width=\"60px\" :model=\"formLabelAlign\">\r\n <el-form-item label=\"名称：\">\r\n {{ formLabelAlign.name }}\r\n </el-form-item>\r\n <el-form-item label=\"账号：\">\r\n {{ formLabelAlign.account }}\r\n </el-form-item>\r\n <el-form-item label=\"密码：\">\r\n {{ formLabelAlign.password }}\r\n </el-form-item>\r\n </el-form>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n data() {\r\n return {\r\n formLabelAlign: {\r\n name: 'admin',\r\n account: 'admin',\r\n password: '123456',\r\n },\r\n }\r\n }\r\n}\r\n</script>\r\n\r\n<style>\r\n.test-div i {\r\n font-size: 25px;\r\n}\r\n</style>"],"sourceRoot":"src/views"}]}
|
{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\myId.vue?vue&type=script&lang=js&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\myId.vue","mtime":1677208560156},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport { getUserApi } from '@/api/myld.js';\nexport default {\n data: function data() {\n return {\n formLabelAlign: {\n name: 'admin',\n account: 'admin',\n password: '123456'\n }\n };\n },\n methods: {\n getUser: function getUser() {\n console.log(window.localStorage.getItem(''));\n }\n },\n mounted: function mounted() {\n this.getUser();\n }\n};",{"version":3,"sources":["myId.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAoBA,SAAA,UAAA,QAAA,eAAA;AAEA,eAAA;AACA,EAAA,IADA,kBACA;AACA,WAAA;AACA,MAAA,cAAA,EAAA;AACA,QAAA,IAAA,EAAA,OADA;AAEA,QAAA,OAAA,EAAA,OAFA;AAGA,QAAA,QAAA,EAAA;AAHA;AADA,KAAA;AAOA,GATA;AAUA,EAAA,OAAA,EAAA;AACA,IAAA,OADA,qBACA;AACA,MAAA,OAAA,CAAA,GAAA,CAAA,MAAA,CAAA,YAAA,CAAA,OAAA,CAAA,EAAA,CAAA;AACA;AAHA,GAVA;AAeA,EAAA,OAfA,qBAeA;AACA,SAAA,OAAA;AACA;AAjBA,CAAA","sourcesContent":["<template>\r\n <div class=\"content-box\">\r\n <div class=\"container\">\r\n <p class=\"title\">我的账号</p>\r\n <el-form label-position=\"left\" label-width=\"60px\" :model=\"formLabelAlign\">\r\n <el-form-item label=\"名称：\">\r\n {{ formLabelAlign.name }}\r\n </el-form-item>\r\n <el-form-item label=\"账号：\">\r\n {{ formLabelAlign.account }}\r\n </el-form-item>\r\n <el-form-item label=\"密码：\">\r\n {{ formLabelAlign.password }}\r\n </el-form-item>\r\n </el-form>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { getUserApi } from '@/api/myld.js';\r\n\r\nexport default {\r\n data() {\r\n return {\r\n formLabelAlign: {\r\n name: 'admin',\r\n account: 'admin',\r\n password: '123456'\r\n }\r\n };\r\n },\r\n methods: {\r\n getUser() {\r\n console.log(window.localStorage.getItem(''));\r\n }\r\n },\r\n mounted() {\r\n this.getUser();\r\n }\r\n};\r\n</script>\r\n\r\n<style>\r\n.test-div i {\r\n font-size: 25px;\r\n}\r\n</style>\r\n"],"sourceRoot":"src/views"}]}
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -125,12 +125,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.xData = this.typeValue.type_data.map(ele => {
|
|
||||||
return ele.name;
|
|
||||||
});
|
|
||||||
this.yData = this.typeValue.type_data.map(ele => {
|
|
||||||
return ele.quantity;
|
|
||||||
});
|
|
||||||
this.drawBar();
|
this.drawBar();
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|
|
||||||
|
|
@ -69,23 +69,22 @@ export default {
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
// console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');
|
// console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
drawLine() {
|
drawLine(newVal, title) {
|
||||||
let myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);
|
let myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);
|
||||||
if (myChart == null) {
|
if (myChart == null) {
|
||||||
myChart = this.$echarts.init(this.$refs.lineChart);
|
myChart = this.$echarts.init(this.$refs.lineChart);
|
||||||
}
|
}
|
||||||
|
// var series = []
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// myChart.showLoading() //开启loading
|
// myChart.showLoading() //开启loading
|
||||||
let option = {
|
let option = {
|
||||||
// title: {
|
|
||||||
// show: true,
|
|
||||||
// text: this.componentName + '-' + this.chartName + '-' + '曲线图',
|
|
||||||
// textStyle: {
|
|
||||||
// lineHeight: '30'
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
legend: {},
|
legend: {},
|
||||||
grid: {
|
grid: {
|
||||||
left: '2%',
|
left: '2%',
|
||||||
|
|
@ -139,40 +138,21 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
series: this.series
|
series: this.getMessage(newVal, title)
|
||||||
};
|
};
|
||||||
myChart.setOption(option) //再设置配置
|
myChart.setOption(option)
|
||||||
// myChart.hideLoading()
|
|
||||||
// myChart.setOption(option);
|
|
||||||
// window.onresize = () => { // 根据窗口大小变化图表自适应
|
|
||||||
// myChart.resize();
|
|
||||||
// };
|
|
||||||
window.addEventListener('resize', function () {
|
window.addEventListener('resize', function () {
|
||||||
myChart.resize();
|
myChart.resize();
|
||||||
});
|
});
|
||||||
}
|
|
||||||
},
|
},
|
||||||
mounted() {
|
|
||||||
this.drawLine();
|
|
||||||
console.log(this.$parent.dataArr, '父组件的dataArr');
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
listTotal() {
|
|
||||||
return JSON.parse(JSON.stringify(this.$parent.dataArr))
|
|
||||||
}
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
list: {
|
|
||||||
handler(newVal) {
|
|
||||||
console.log("newVal",newVal)
|
|
||||||
if (newVal.length!=0) {
|
|
||||||
|
|
||||||
// x轴的数据
|
getMessage(newVal, title) {
|
||||||
this.xData = newVal.map(val => {
|
this.xData = newVal.map(val => {
|
||||||
return val.time;
|
return val.time;
|
||||||
});
|
});
|
||||||
|
|
||||||
this.series = [
|
var series = [
|
||||||
{
|
{
|
||||||
name: '',
|
name: '',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
|
|
@ -187,15 +167,13 @@ export default {
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
// 区域组件触发y轴展示
|
if (title === '类型') {
|
||||||
if (this.title == '类型') {
|
|
||||||
this.tooltip = {
|
this.tooltip = {
|
||||||
formatter: '{a} {b}:{c}个',
|
formatter: '{a} {b}:{c}个',
|
||||||
show: true,
|
show: true,
|
||||||
confine: true
|
confine: true
|
||||||
};
|
};
|
||||||
this.series[0].name = '总量';
|
series[0].name = '总量';
|
||||||
console.log('折线图', newVal);
|
|
||||||
// 映射出类型数组
|
// 映射出类型数组
|
||||||
let arr = newVal.map(function (ele) {
|
let arr = newVal.map(function (ele) {
|
||||||
if (ele.type_data != null) {
|
if (ele.type_data != null) {
|
||||||
|
|
@ -208,32 +186,17 @@ export default {
|
||||||
mapN.push(arr[t][i]);
|
mapN.push(arr[t][i]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
var lineArr = [{
|
var lineArr = []
|
||||||
name: '机动车',
|
if (newVal[0].type_data != undefined) {
|
||||||
|
newVal[0].type_data.forEach(ele => {
|
||||||
|
lineArr.push({
|
||||||
|
name: ele.name,
|
||||||
type: 'line',
|
type: 'line',
|
||||||
data: [],
|
data: [],
|
||||||
smooth: true
|
smooth: true
|
||||||
}, {
|
});
|
||||||
name: '非机动车',
|
});
|
||||||
type: 'line',
|
}
|
||||||
data: [],
|
|
||||||
smooth: true
|
|
||||||
}, {
|
|
||||||
name: '行人',
|
|
||||||
type: 'line',
|
|
||||||
data: [],
|
|
||||||
smooth: true
|
|
||||||
}];
|
|
||||||
// if (newVal[0].type_data != undefined) {
|
|
||||||
// newVal[0].type_data.forEach(ele => {
|
|
||||||
// lineArr.push({
|
|
||||||
// name: ele.name,
|
|
||||||
// type: 'line',
|
|
||||||
// data: [],
|
|
||||||
// smooth: true
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
mapN.forEach(ele => {
|
mapN.forEach(ele => {
|
||||||
if (ele.name == '机动车') {
|
if (ele.name == '机动车') {
|
||||||
lineArr[0].data.push(ele.quantity);
|
lineArr[0].data.push(ele.quantity);
|
||||||
|
|
@ -244,7 +207,7 @@ export default {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
for (let j = 0; j < lineArr.length; j++) {
|
for (let j = 0; j < lineArr.length; j++) {
|
||||||
this.series.push(lineArr[j]);
|
series.push(lineArr[j]);
|
||||||
}
|
}
|
||||||
// 总和数量
|
// 总和数量
|
||||||
let mapNR1 = [];
|
let mapNR1 = [];
|
||||||
|
|
@ -256,72 +219,56 @@ export default {
|
||||||
mapNR1.push(sum);
|
mapNR1.push(sum);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// console.log("mapNR1", mapNR1)
|
series[0].data = mapNR1;
|
||||||
this.series[0].data = mapNR1;
|
} else if (title === '速度') {
|
||||||
} else if (this.title == '速度') {
|
|
||||||
console.log('速度的折线图');
|
|
||||||
this.tooltip = {
|
this.tooltip = {
|
||||||
formatter: '{a} {b}:{c}km/h',
|
formatter: '{a} {b}:{c}km/h',
|
||||||
show: true,
|
show: true,
|
||||||
confine: true
|
confine: true
|
||||||
};
|
};
|
||||||
// console.log("newVal",newVal)
|
// console.log("newVal",newVal)
|
||||||
this.series[0].data = newVal.map(val => {
|
series[0].data = newVal.map(val => {
|
||||||
return val.speed;
|
return val.speed;
|
||||||
});
|
});
|
||||||
} else if (this.title == '流量') {
|
} else if (title === '流量') {
|
||||||
this.tooltip = {
|
series[0].data = newVal.map(ele => {
|
||||||
formatter: '{a} {b}:{c}辆',
|
|
||||||
show: true,
|
|
||||||
confine: true
|
|
||||||
};
|
|
||||||
this.series[0].data = newVal.map(ele => {
|
|
||||||
return ele.in_flow + ele.out_flow;
|
return ele.in_flow + ele.out_flow;
|
||||||
});
|
});
|
||||||
} else if (this.title == '车头时距') {
|
} else if (title === '车头时距') {
|
||||||
console.log('车头时距', newVal);
|
|
||||||
this.tooltip = {
|
this.tooltip = {
|
||||||
formatter: '{a} {b}:{c}/s',
|
formatter: '{a} {b}:{c}/s',
|
||||||
show: true,
|
show: true,
|
||||||
confine: true
|
confine: true
|
||||||
};
|
};
|
||||||
this.series[0].data = newVal.map(val => {
|
series[0].data = newVal.map(val => {
|
||||||
return val.headway;
|
return val.headway;
|
||||||
});
|
});
|
||||||
} else if (this.title == '排队数' && this.status == '触发') {
|
} else if (title === '排队数') {
|
||||||
this.series[0].data = newVal.map(val => {
|
series[0].data = newVal.map(val => {
|
||||||
return val.n_queue;
|
return val.n_queue;
|
||||||
});
|
});
|
||||||
} else if (this.title == '排队数' && this.status == '周期统计') {
|
} else if (title === '检测数') {
|
||||||
this.series[0].data = newVal.map(val => {
|
series[0].data = newVal.map(val => {
|
||||||
return val.ave_queue;
|
|
||||||
});
|
|
||||||
} else if (this.title == '检测数') {
|
|
||||||
this.series[0].data = newVal.map(val => {
|
|
||||||
return val.n_stay;
|
return val.n_stay;
|
||||||
});
|
});
|
||||||
} else if (this.title == '延误') {
|
} else if (title === '延误') {
|
||||||
this.series[0].data = newVal.map(val => {
|
series[0].data = newVal.map(val => {
|
||||||
return val.ave_delay;
|
return val.ave_delay;
|
||||||
});
|
});
|
||||||
} else if (this.title == '拥堵') {
|
} else if (title === '拥堵') {
|
||||||
this.series[0].data = newVal.map(val => {});
|
series[0].data = newVal.map(val => { });
|
||||||
}
|
}
|
||||||
if (this.$refs.lineChart) {
|
console.log(series, '折线图数据');
|
||||||
console.log("1111111")
|
return series
|
||||||
this.$nextTick(() => {
|
|
||||||
this.drawLine();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
this.drawLine()
|
|
||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
deep: true
|
mounted() {
|
||||||
|
// this.drawLine();
|
||||||
|
// this.getMessage(this.list)
|
||||||
|
// console.log(this.$parent.dataArr, '父组件的dataArr');
|
||||||
|
// this.$set(this.$parent.dataArr)
|
||||||
},
|
},
|
||||||
|
watch: {
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div v-if="msg">
|
<div v-if="msg" class="regionBox">
|
||||||
<!-- 触发 -->
|
<!-- 触发 -->
|
||||||
<el-table :data="msg" style="width: 100%" v-if="triggerType == '触发' ">
|
<el-table :data="msg" style="width: 100%" v-if="triggerType == '触发' ">
|
||||||
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column> -->
|
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column> -->
|
||||||
|
|
@ -186,7 +186,13 @@ export default {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped lang="scss">
|
||||||
|
/deep/ .el-table{
|
||||||
|
height: 709px !important;
|
||||||
|
overflow-y: scroll;
|
||||||
|
|
||||||
|
}
|
||||||
|
.el-table::-webkit-scrollbar { width: 0 !important }
|
||||||
.tableContent {
|
.tableContent {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -27,6 +27,7 @@
|
||||||
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor'">机动车|非机动车</span>
|
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor'">机动车|非机动车</span>
|
||||||
<span v-if="scope.row.type == 'Motor Vehicle|Person'">机动车|行人</span>
|
<span v-if="scope.row.type == 'Motor Vehicle|Person'">机动车|行人</span>
|
||||||
<span v-if="scope.row.type == 'Person|Non_Motor'">行人|非机动车</span>
|
<span v-if="scope.row.type == 'Person|Non_Motor'">行人|非机动车</span>
|
||||||
|
<span v-if="scope.row.type == 'Person|Motor Vehicle'">行人|机动车</span>
|
||||||
<span v-if="scope.row.type == 'Person|Non_Motor|Motor Vehicle'">行人|非机动车|机动车</span>
|
<span v-if="scope.row.type == 'Person|Non_Motor|Motor Vehicle'">行人|非机动车|机动车</span>
|
||||||
<span v-if="scope.row.type == 'Person|Motor Vehicle|Non_Motor'">行人|非机动车|机动车</span>
|
<span v-if="scope.row.type == 'Person|Motor Vehicle|Non_Motor'">行人|非机动车|机动车</span>
|
||||||
<span v-if="scope.row.type == 'Non_Motor|Person|Motor Vehicle'">行人|非机动车|机动车</span>
|
<span v-if="scope.row.type == 'Non_Motor|Person|Motor Vehicle'">行人|非机动车|机动车</span>
|
||||||
|
|
@ -176,7 +177,13 @@ export default {
|
||||||
mounted() { }
|
mounted() { }
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped lang="scss">
|
||||||
|
/deep/ .el-table{
|
||||||
|
height: 709px !important;
|
||||||
|
overflow-y: scroll;
|
||||||
|
|
||||||
|
}
|
||||||
|
.el-table::-webkit-scrollbar { width: 0 !important }
|
||||||
.tableContent {
|
.tableContent {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,12 @@
|
||||||
<template><!-- 触发类型 -->
|
<template>
|
||||||
|
<!-- 触发类型 -->
|
||||||
<div class="setion">
|
<div class="setion">
|
||||||
<p class="chartTitle"><span class="titleIcon"></span> {{ componentName }} {{ triggerType }}</p>
|
<p class="chartTitle"><span class="titleIcon"></span> {{ componentName }} {{ triggerType }}</p>
|
||||||
<!-- 触发数据数值渲染 -->
|
<!-- 触发数据数值渲染 -->
|
||||||
<div class="typeContent" v-if="triggerType == '触发' || '周期时刻'">
|
<div class="typeContent">
|
||||||
<div v-if="dataArr && dataArr.length != 0 && dataArr != undefined">
|
<div v-if="dataArr && dataArr.length != 0 && dataArr != undefined">
|
||||||
<div v-if="title == '类型'" style="display:flex">
|
<div v-if="title == '类型'" style="display:flex">
|
||||||
<el-card v-for="(n, i) in typeValue.type_data" :key="i"
|
<el-card v-for="(n, i) in dataArr[0].type_data" :key="i"
|
||||||
style="width: 150px; margin-bottom: 20px; text-align: center">
|
style="width: 150px; margin-bottom: 20px; text-align: center">
|
||||||
<div>
|
<div>
|
||||||
<span style="font-size: 15px;">{{ n.name }}</span><br />
|
<span style="font-size: 15px;">{{ n.name }}</span><br />
|
||||||
|
|
@ -13,7 +14,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
{{ typeValue.time ? typeValue.time : '' }}
|
{{ dataArr[0].time ? dataArr[0].time : '' }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
@ -24,7 +25,7 @@
|
||||||
<div v-if="title == '类型'">
|
<div v-if="title == '类型'">
|
||||||
<span style="font-size: 15px;">类型数量总和</span><br />
|
<span style="font-size: 15px;">类型数量总和</span><br />
|
||||||
<span style="font-size: 30px; font-weight: bold">
|
<span style="font-size: 30px; font-weight: bold">
|
||||||
{{ this.total }}
|
{{ }}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div style="font-size: 30px; font-weight: bold" v-if="title == '速度'">
|
<div style="font-size: 30px; font-weight: bold" v-if="title == '速度'">
|
||||||
|
|
@ -67,9 +68,9 @@
|
||||||
<div class="tableTitle" v-if="dataArr && dataArr.length != 0 && dataArr != undefined">
|
<div class="tableTitle" v-if="dataArr && dataArr.length != 0 && dataArr != undefined">
|
||||||
<div>
|
<div>
|
||||||
<span
|
<span
|
||||||
style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"
|
style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"></span>
|
||||||
></span>
|
<span style="font-size:18px;">{{ this.chartName + '-' + this.componentName + '-' + '表格' + '-' +
|
||||||
<span style="font-size:18px;">{{ this.chartName + '-' + this.componentName + '-' + '表格' + '-' + triggerType }}</span>
|
triggerType }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="tableTime">
|
<div class="tableTime">
|
||||||
{{ dataArr[0].time ? dataArr[0].time : '' }}
|
{{ dataArr[0].time ? dataArr[0].time : '' }}
|
||||||
|
|
@ -84,16 +85,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="border" v-if="echartArr.includes('曲线图')">
|
<div class="border" v-if="echartArr.includes('曲线图')">
|
||||||
<detailDialog />
|
<detailDialog />
|
||||||
<lineChart
|
<lineChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
|
||||||
|
:status="triggerType" :title="title" :typeValue="typeValue" ref="lineChartRef" />
|
||||||
:componentName="componentName"
|
|
||||||
:chartName="chartName"
|
|
||||||
:pageType="pageType"
|
|
||||||
:list="dataArr"
|
|
||||||
:status="triggerType"
|
|
||||||
:title="title"
|
|
||||||
:typeValue="typeValue"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="border" v-if="echartArr.includes('饼状图')">
|
<div class="border" v-if="echartArr.includes('饼状图')">
|
||||||
<detailDialog />
|
<detailDialog />
|
||||||
|
|
@ -149,7 +142,7 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
console.log(this.title + 'TYPECHARTdataArr', this.dataArr)
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 计算类型的数值
|
// 计算类型的数值
|
||||||
|
|
@ -172,7 +165,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
computed: {},
|
computed: {
|
||||||
|
// 获取类型的总数量
|
||||||
|
getTotal() {
|
||||||
|
return this.dataArr[0].type_data((pre, cur) => {
|
||||||
|
return pre + cur
|
||||||
|
}, 0)
|
||||||
|
}
|
||||||
|
},
|
||||||
mounted() { },
|
mounted() { },
|
||||||
watch: {
|
watch: {
|
||||||
// 监听触发数据
|
// 监听触发数据
|
||||||
|
|
|
||||||
|
|
@ -25,11 +25,11 @@
|
||||||
:echartArr="o.presentationForm" :dataArr="o.trigger"
|
:echartArr="o.presentationForm" :dataArr="o.trigger"
|
||||||
:title="o.componentName.split('_')[0]" :chartName="o.combinationName" />
|
:title="o.componentName.split('_')[0]" :chartName="o.combinationName" />
|
||||||
<!--触发的组件 -->
|
<!--触发的组件 -->
|
||||||
<typeChart v-if="o.timeMode === '触发'" :pageType="o.graphicType"
|
<typeChart ref="typeChartRef" v-if="o.timeMode === '触发'"
|
||||||
:triggerType="o.timeMode" :componentName="o.componentName"
|
:pageType="o.graphicType" :triggerType="o.timeMode"
|
||||||
:dataArr="o.trigger" :echartArr="o.presentationForm"
|
:componentName="o.componentName" :dataArr="o.trigger"
|
||||||
:title="o.componentName.split('_')[0]" :chartName="o.combinationName"
|
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
|
||||||
:typeValue="typeTimeMode" />
|
:chartName="o.combinationName" :typeValue="typeTimeMode" />
|
||||||
<typeChart v-if="o.timeMode === '周期时刻'" :pageType="o.graphicType"
|
<typeChart v-if="o.timeMode === '周期时刻'" :pageType="o.graphicType"
|
||||||
:triggerType="o.timeMode" :componentName="o.componentName"
|
:triggerType="o.timeMode" :componentName="o.componentName"
|
||||||
:dataArr="o.cycleTimeData" :echartArr="o.presentationForm"
|
:dataArr="o.cycleTimeData" :echartArr="o.presentationForm"
|
||||||
|
|
@ -89,7 +89,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
//周期统计
|
//周期统计
|
||||||
cycleStatisticsData: {
|
cycleStatistics: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default() {
|
default() {
|
||||||
return [];
|
return [];
|
||||||
|
|
@ -102,220 +102,7 @@ export default {
|
||||||
title1: '01断面',
|
title1: '01断面',
|
||||||
title2: '01区域',
|
title2: '01区域',
|
||||||
dialogVisible: false,
|
dialogVisible: false,
|
||||||
// 触发数据断面与区域相同
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
steam_id: 0,
|
|
||||||
time: '2022-10-01 09:15:11.156',
|
|
||||||
obj_id: 125,
|
|
||||||
type: 'Person',
|
|
||||||
plate: '苏A0131M',
|
|
||||||
speed: 35.2,
|
|
||||||
event: 'in',
|
|
||||||
lane: 0,
|
|
||||||
headWay: 19
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: 0,
|
|
||||||
time: '2022-10-01 09:15:12.156',
|
|
||||||
obj_id: 125,
|
|
||||||
type: 'Motor Vehicle',
|
|
||||||
plate: '苏A0131M',
|
|
||||||
speed: 70.2,
|
|
||||||
event: 'in',
|
|
||||||
lane: 0,
|
|
||||||
headWay: 6.5
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: 0,
|
|
||||||
time: '2022-10-01 09:15:13.156',
|
|
||||||
obj_id: 125,
|
|
||||||
type: 'Non_Motor',
|
|
||||||
plate: '苏A0131M',
|
|
||||||
speed: 60.2,
|
|
||||||
event: 'in',
|
|
||||||
lane: 0,
|
|
||||||
headWay: 10.5
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: 0,
|
|
||||||
time: '2022-10-01 09:15:14.156',
|
|
||||||
obj_id: 125,
|
|
||||||
type: 'Non_Motor',
|
|
||||||
plate: '苏A0131M',
|
|
||||||
speed: 60.2,
|
|
||||||
event: 'in',
|
|
||||||
lane: 0,
|
|
||||||
headWay: 2.5
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: 0,
|
|
||||||
time: '2022-10-01 09:15:15.156',
|
|
||||||
obj_id: 125,
|
|
||||||
type: 'Motor Vehicle',
|
|
||||||
plate: '苏A0131M',
|
|
||||||
speed: 60.2,
|
|
||||||
event: 'in',
|
|
||||||
lane: 0,
|
|
||||||
headWay: 11.5
|
|
||||||
}
|
|
||||||
],
|
|
||||||
|
|
||||||
// 断面的周期统计
|
|
||||||
sectionList: [
|
|
||||||
{
|
|
||||||
steam_id: '0',
|
|
||||||
gate_id: 'Gate_1',
|
|
||||||
name: '西进口',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
interval: '53',
|
|
||||||
type: 'truck',
|
|
||||||
in_flow: 90,
|
|
||||||
out_flow: 120,
|
|
||||||
flow: 147,
|
|
||||||
in_spd: 20.1,
|
|
||||||
out_spd: 30.6,
|
|
||||||
speed: 30
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: '0',
|
|
||||||
gate_id: 'Gate_1',
|
|
||||||
name: '西进口',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
interval: '53',
|
|
||||||
type: 'truck',
|
|
||||||
in_flow: 90,
|
|
||||||
out_flow: 120,
|
|
||||||
flow: 123,
|
|
||||||
in_spd: 20.1,
|
|
||||||
out_spd: 30.6,
|
|
||||||
speed: 40
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: '0',
|
|
||||||
gate_id: 'Gate_1',
|
|
||||||
name: '西进口',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
interval: '53',
|
|
||||||
type: 'truck',
|
|
||||||
in_flow: 90,
|
|
||||||
out_flow: 80,
|
|
||||||
flow: 210,
|
|
||||||
in_spd: 20.1,
|
|
||||||
out_spd: 30.6,
|
|
||||||
speed: 50
|
|
||||||
},
|
|
||||||
{
|
|
||||||
steam_id: '0',
|
|
||||||
gate_id: 'Gate_1',
|
|
||||||
name: '西进口',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
interval: '53',
|
|
||||||
type: 'truck',
|
|
||||||
in_flow: 90,
|
|
||||||
out_flow: 120,
|
|
||||||
flow: 210,
|
|
||||||
in_spd: 20.1,
|
|
||||||
out_spd: 30.6,
|
|
||||||
speed: 77
|
|
||||||
}
|
|
||||||
],
|
|
||||||
// 区域的周期时刻
|
|
||||||
regionList1: [
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
frame: 1000,
|
|
||||||
type: 'car',
|
|
||||||
n_stay: 3,
|
|
||||||
n_queue: 2,
|
|
||||||
occ: 1,
|
|
||||||
speed: 5.6
|
|
||||||
},
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
frame: 1000,
|
|
||||||
type: 'car',
|
|
||||||
n_stay: 3,
|
|
||||||
n_queue: 2,
|
|
||||||
occ: 1,
|
|
||||||
speed: 12.6
|
|
||||||
},
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
frame: 1000,
|
|
||||||
type: 'car',
|
|
||||||
n_stay: 3,
|
|
||||||
n_queue: 2,
|
|
||||||
occ: 1,
|
|
||||||
speed: 10
|
|
||||||
},
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
frame: 1000,
|
|
||||||
type: 'car',
|
|
||||||
n_stay: 3,
|
|
||||||
n_queue: 2,
|
|
||||||
occ: 1,
|
|
||||||
speed: 6
|
|
||||||
}
|
|
||||||
],
|
|
||||||
// 区域的周期统计
|
|
||||||
regionList2: [
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
type: 'car',
|
|
||||||
enter_flow: 1,
|
|
||||||
leave_flow: 3,
|
|
||||||
ave_stay: 3.2,
|
|
||||||
ave_queue: 2.9,
|
|
||||||
ave_occ: 0.56,
|
|
||||||
ave_delay: 8,
|
|
||||||
ave_speed: 12
|
|
||||||
},
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
type: 'car',
|
|
||||||
enter_flow: 1,
|
|
||||||
leave_flow: 3,
|
|
||||||
ave_stay: 3.2,
|
|
||||||
ave_queue: 2.9,
|
|
||||||
ave_occ: 0.56,
|
|
||||||
ave_delay: 7,
|
|
||||||
ave_speed: 22
|
|
||||||
},
|
|
||||||
{
|
|
||||||
zone_id: '0',
|
|
||||||
gate_id: 'Zone_1',
|
|
||||||
name: '西进口左1',
|
|
||||||
timestamp: '2022-10-1',
|
|
||||||
type: 'car',
|
|
||||||
enter_flow: 1,
|
|
||||||
leave_flow: 3,
|
|
||||||
ave_stay: 3.2,
|
|
||||||
ave_queue: 2.9,
|
|
||||||
ave_occ: 0.56,
|
|
||||||
ave_delay: 17,
|
|
||||||
ave_speed: 12
|
|
||||||
}
|
|
||||||
],
|
|
||||||
|
|
||||||
idVal: '',
|
idVal: '',
|
||||||
//组件数组
|
//组件数组
|
||||||
|
|
@ -339,7 +126,10 @@ export default {
|
||||||
typeTimeMode: {},
|
typeTimeMode: {},
|
||||||
// 周期时刻的数值看板展示
|
// 周期时刻的数值看板展示
|
||||||
typeCycleTimeData: {},
|
typeCycleTimeData: {},
|
||||||
typeCycleStatistics: {}
|
typeCycleStatistics: {},
|
||||||
|
|
||||||
|
// 各个组件分类
|
||||||
|
classify: []
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
// beforeCeated(){
|
// beforeCeated(){
|
||||||
|
|
@ -351,38 +141,40 @@ export default {
|
||||||
methods: {
|
methods: {
|
||||||
getNew() {
|
getNew() {
|
||||||
// this.idVal = ;
|
// this.idVal = ;
|
||||||
getComponentSection({ VideoId: this.$route.query.id ,Number:10}).then(res => {
|
getComponentSection({ VideoId: this.$route.query.id }).then(res => {
|
||||||
if (res.data.code == 200) {
|
if (res.data.code == 200) {
|
||||||
console.log("res.data.data",res.data.data)
|
console.log(res.data.data, '组件的数据');
|
||||||
this.componentList = res.data.data;
|
this.componentList = res.data.data;
|
||||||
this.siftData();
|
this.sectionArr=[]
|
||||||
|
this.sectionData=[]
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.siftData(this.componentList);
|
||||||
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
siftData() {
|
siftData(newComponentList) {
|
||||||
this.sectionArr=[]
|
|
||||||
this.sectionData=[]
|
newComponentList.forEach(val => {
|
||||||
this.componentList.forEach(val => {
|
this.sectionArr.push(val.combinationName);
|
||||||
// var newSectionArr = []
|
|
||||||
// newSectionArr.push(val.combinationName)
|
|
||||||
// this.sectionArr = newSectionArr
|
|
||||||
this.sectionArr.push(val.combinationName)
|
|
||||||
this.sectionArr = Array.from(new Set(this.sectionArr));
|
this.sectionArr = Array.from(new Set(this.sectionArr));
|
||||||
});
|
});
|
||||||
// var newSectionData = []
|
|
||||||
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 => {
|
newComponentList.forEach(val => {
|
||||||
if (item.title == val.combinationName) {
|
if (item.title == val.combinationName) {
|
||||||
console.log("val.combinationName",val.combinationName)
|
this.classify.push(val)
|
||||||
item.children.push(val);
|
item.children.push(val);
|
||||||
}
|
}
|
||||||
this.acticveName.push(val.analogAreaComponentId);
|
this.acticveName.push(val.analogAreaComponentId);
|
||||||
});
|
});
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
|
console.log("this.classify",this.classify)
|
||||||
|
// console.log("this.sectionData",this.sectionData[0].children[0].trigger)
|
||||||
|
console.log("this.sectionData",this.sectionData[0].children[0])
|
||||||
},
|
},
|
||||||
// 组件图标点击下拉事件
|
// 组件图标点击下拉事件
|
||||||
sectionHandle(i) {
|
sectionHandle(i) {
|
||||||
|
|
@ -401,28 +193,37 @@ export default {
|
||||||
downPulls1[i].style.cssText = 'transition: all 0.5s linear;';
|
downPulls1[i].style.cssText = 'transition: all 0.5s linear;';
|
||||||
// sections[i].style.height = '500px';
|
// sections[i].style.height = '500px';
|
||||||
if (sectionBox[i] != undefined) {
|
if (sectionBox[i] != undefined) {
|
||||||
// sectionBox[i].style.height = '48vh';
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// channge(oldVal, newVal){
|
channge(oldVal, newVal) {
|
||||||
// console.log("old",oldVal)
|
console.log("old", oldVal)
|
||||||
// console.log("newVal",newVal)
|
console.log("newVal", newVal)
|
||||||
// if(oldVal=='second'){
|
if (oldVal == 'second') {
|
||||||
// this.sectionArr=[]
|
this.sectionArr = []
|
||||||
// this.sectionData=[]
|
this.sectionData = []
|
||||||
// this.getNew()
|
this.getNew()
|
||||||
// }else if(newVal=='second'){
|
} else if (newVal == 'second') {
|
||||||
// this.sectionArr=[]
|
this.sectionArr = []
|
||||||
// this.sectionData=[]
|
this.sectionData = []
|
||||||
// this.getNew()
|
this.getNew()
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
|
|
||||||
// 触发数据的类型数值
|
// 触发数据的类型数值
|
||||||
},
|
},
|
||||||
mounted() { },
|
mounted() { },
|
||||||
watch: {
|
watch: {
|
||||||
|
// acticveName: {
|
||||||
|
// handler(newVal) {
|
||||||
|
// if (newVal != 'second') {
|
||||||
|
// // 组件数据赋空
|
||||||
|
// this.classify = []
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// },
|
||||||
// 触发的原始数据
|
// 触发的原始数据
|
||||||
triggerData: {
|
triggerData: {
|
||||||
handler(newVal, oldVal) { },
|
handler(newVal, oldVal) { },
|
||||||
|
|
@ -434,29 +235,47 @@ export default {
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
this.triggerList = newVal;
|
this.triggerList = newVal;
|
||||||
// 触发数据
|
// 触发数据
|
||||||
// console.log(newVal, 'triggerlistData');
|
console.log(newVal, 'triggerlistData');
|
||||||
console.log(this.componentList, 'this.componentList');
|
var _this = this
|
||||||
this.componentList.forEach(ele => {
|
if (newVal.length != 0 && _this.sectionData) {
|
||||||
|
console.log("classify",_this.classify)
|
||||||
|
if(_this.classify.length!=0){
|
||||||
|
_this.classify.forEach((ele, index) => {
|
||||||
|
// console.log("classify",ele)
|
||||||
if (ele.trigger == undefined && ele.timeMode == '触发') {
|
if (ele.trigger == undefined && ele.timeMode == '触发') {
|
||||||
ele.trigger = [];
|
ele.trigger = [];
|
||||||
}
|
}
|
||||||
newVal.forEach(item => {
|
newVal.forEach((item) => {
|
||||||
|
// console.log("ele",ele)
|
||||||
|
// console.log("newVal",newVal)
|
||||||
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') {
|
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') {
|
||||||
if (ele.trigger.length == 10) {
|
if (ele.trigger.length == 10) {
|
||||||
ele.trigger.pop();
|
ele.trigger.splice(newVal.length - 1, 1);
|
||||||
} else {
|
} else {
|
||||||
console.log("item",item)
|
|
||||||
item.time = item.time.split('.')[0];
|
item.time = item.time.split('.')[0];
|
||||||
// 该时间的触发数据
|
// 该时间的触发数据
|
||||||
if (item.type_data != null) {
|
if (item.type_data != null) {
|
||||||
// console.log(item,'461461');
|
_this.typeTimeMode = item
|
||||||
this.typeTimeMode = item
|
|
||||||
}
|
}
|
||||||
ele.trigger.unshift(item);
|
ele.trigger.unshift(item);
|
||||||
|
console.log("ele.trigger",ele.trigger)
|
||||||
|
_this.$nextTick(() => {
|
||||||
|
if (_this.$refs.typeChartRef[index] != undefined) {
|
||||||
|
console.log(_this.$refs.typeChartRef[index].trigger, '数据');
|
||||||
|
_this.$refs.typeChartRef[index].$refs.lineChartRef.drawLine(ele.trigger, ele.componentName.split('_')[0])
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
},
|
},
|
||||||
immediate: true
|
immediate: true
|
||||||
},
|
},
|
||||||
|
|
@ -473,10 +292,9 @@ export default {
|
||||||
if (
|
if (
|
||||||
ele.analogAreaComponentId == item.component_id &&
|
ele.analogAreaComponentId == item.component_id &&
|
||||||
ele.timeMode == '周期时刻'
|
ele.timeMode == '周期时刻'
|
||||||
|
|
||||||
) {
|
) {
|
||||||
if (ele.cycleTimeData.length == 10) {
|
if (ele.cycleTimeData.length == 10) {
|
||||||
ele.cycleTimeData.slice(ele.cycleTimeData.length - 1, 0);
|
ele.cycleTimeData.splice(newVal.length - 1, 1);
|
||||||
} else {
|
} else {
|
||||||
item.time = item.time.split('.')[0];
|
item.time = item.time.split('.')[0];
|
||||||
if (item.type_data != null) {
|
if (item.type_data != null) {
|
||||||
|
|
@ -492,32 +310,25 @@ export default {
|
||||||
},
|
},
|
||||||
immediate: true
|
immediate: true
|
||||||
},
|
},
|
||||||
// 周期统计数据
|
cycleStatistics: {
|
||||||
// cycleStatistics:{
|
|
||||||
// handler(newVal){
|
|
||||||
// console.log(newVal,'周期统计');
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
cycleStatisticsData: {
|
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
|
|
||||||
if (newVal.length != 0 && this.sectionData) {
|
if (newVal.length != 0 && this.sectionData) {
|
||||||
this.componentList.forEach(ele => {
|
this.componentList.forEach(ele => {
|
||||||
if (ele.cycleStatisticsData == undefined && ele.timeMode == '周期统计') {
|
if (ele.cycleStatistics == undefined && ele.timeMode == '周期统计') {
|
||||||
ele.cycleStatisticsData = [];
|
ele.cycleStatistics = [];
|
||||||
}
|
}
|
||||||
newVal.forEach(item => {
|
newVal.forEach(item => {
|
||||||
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期统计') {
|
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期统计') {
|
||||||
if (ele.cycleStatisticsData.length == 10) {
|
if (ele.cycleStatistics.length == 10) {
|
||||||
ele.cycleStatisticsData.pop();
|
ele.cycleStatistics.splice(newVal.length - 1, 1);
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
item.time = item.time.split('.')[0];
|
item.time = item.time.split('.')[0];
|
||||||
if (item.type_data != null) {
|
if (item.type_data != null) {
|
||||||
//周期时刻的类型数据
|
//周期时刻的类型数据
|
||||||
this.typeCycleStatistics = item;
|
this.typeCycleStatistics = item;
|
||||||
}
|
}
|
||||||
ele.cycleStatisticsData.unshift(item);
|
ele.cycleStatistics.unshift(item);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -528,7 +339,7 @@ export default {
|
||||||
// activeName: {
|
// activeName: {
|
||||||
// handler(newVal) {
|
// handler(newVal) {
|
||||||
// if (newVal == "second") {
|
// if (newVal == "second") {
|
||||||
// getComponentSection({ VideoId: this.$route.query.id ,Number:10}).then(res => {
|
// 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();
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue