Browse Source

高速云事件改版

develop
lau572 6 months ago
parent
commit
d4f2018b0d
  1. 440
      ruoyi-ui/src/views/JiHeExpressway/pages/service/analysis/index.vue
  2. 29
      ruoyi-ui/src/views/JiHeExpressway/pages/service/analysis/search/index.vue

440
ruoyi-ui/src/views/JiHeExpressway/pages/service/analysis/index.vue

@ -17,20 +17,20 @@
:highlight-current="true" :highlight-current="true"
:expand-on-click-node="false" :expand-on-click-node="false"
:auto-expand-parent="false"> :auto-expand-parent="false">
</el-tree> </el-tree>
<!-- <el-checkbox-group class="device" v-model="devices" @change="onDeviceChange"> <!-- <el-checkbox-group class="device" v-model="devices" @change="onDeviceChange">
<el-checkbox v-for="(item,index) in deviceTypeList" :label="item.value" >{{ item.label }}</el-checkbox> <el-checkbox v-for="(item,index) in deviceTypeList" :label="item.value" >{{ item.label }}</el-checkbox>
</el-checkbox-group> --> </el-checkbox-group> -->
</div> </div>
<div class="cright"> <div class="cright">
<div style="display: flex;justify-content: flex-end;padding-right: 20px;"><Search ref="search" /></div> <div style="display: flex;justify-content: flex-end;padding-right: 20px;"><Search ref="search" /></div>
<div v-if="curid === ''" style="height:300px"></div> <div v-if="curid === ''" style="height:300px"></div>
<div class="tag1A" v-if="curid==='8' ">方向济南<span></span></div> <div class="tag1A" v-if="curid==='7' ">方向济南<span></span></div>
<div class="tag2A" v-if="curid==='8' "><span></span>方向菏泽</div> <div class="tag2A" v-if="curid==='7' "><span></span>方向菏泽</div>
<div class="tag1A" v-if=" curid==='9'">方向出口<span></span></div> <div class="tag1A" v-if=" curid==='8'">方向出口<span></span></div>
<div class="tag2A" v-if=" curid==='9'"><span></span>方向入口</div> <div class="tag2A" v-if=" curid==='8'"><span></span>方向入口</div>
<div :hidden="curid==='' || curid==='7'" class="charts "id="charts"></div> <div :hidden="curid==='' || curid==='6'" class="charts "id="charts"></div>
<div style="overflow: none;height: 450px"> <div style="overflow: none;height: 450px">
<Table :data="tableData" style="width: 99%;margin-top: 30px;" height="430px"> <Table :data="tableData" style="width: 99%;margin-top: 30px;" height="430px">
<ElTableColumn v-for="(item,index) of tableCols" :label="item.label" :prop="item.value" align="center" /> <ElTableColumn v-for="(item,index) of tableCols" :label="item.label" :prop="item.value" align="center" />
@ -70,38 +70,41 @@ export default {
id:'a', id:'a',
label:'交通事件', label:'交通事件',
children:[ children:[
{ id:'1', label:'事多发路段'}, { id:'1', label:'事多发路段'},
{ id:'2', label:'事件类型分析'}, { id:'2', label:'事件类型分析'},
{ id:'3', label:'事故车型分析'}, { id:'3', label:'事件时间分析'},
{ id:'4', label:'事故时间分析'}, { id:'4', label:'事件地市分布'},
{ id:'5', label:'事故地市分布'}, { id:'5', label:'交通管制情况统计'},
{ id:'6', label:'交通管制情况统计'},
] ]
},{ },{
id:'b', id:'b',
label:'天气情况统计', label:'天气情况统计',
children:[ children:[
{ id:'7', label:'天气情况统计'}, { id:'6', label:'天气情况统计'},
] ]
},{ },{
id:'c', id:'c',
label:'交通量统计', label:'交通量统计',
children:[ children:[
{ id:'8', label:'门架车流量'}, { id:'7', label:'门架车流量'},
{ id:'9', label:'收费站车流量'}, { id:'8', label:'收费站车流量'},
] ]
},{ },{
id:'d', id:'d',
label:'交通事故情况', label:'交通事故情况',
children:[ children:[
{ id:'10', label:'事故类型统计'}, { id:'9', label:'事故类型统计'},
{ id:'10', label:'事故车型分析'},
{ id:'11', label:'事故时间分析'},
{ id:'12', label:'事故地市分布'},
{ id:'13', label:'事故路段分布'},
] ]
},{ },{
id:'e', id:'e',
label:'拥堵情况', label:'拥堵情况',
children:[ children:[
{ id:'11', label:'拥堵地点统计'}, { id:'14', label:'拥堵地点统计'},
{ id:'12', label:'路段平均拥堵时长'}, { id:'15', label:'路段平均拥堵时长'},
] ]
} }
], ],
@ -111,7 +114,7 @@ export default {
}; };
}, },
created() { created() {
}, },
mounted() { mounted() {
this.$nextTick(()=>{ this.$nextTick(()=>{
@ -133,13 +136,13 @@ export default {
methods: { methods: {
getKeys(){ getKeys(){
let keys = this.$refs.menu.getCheckedKeys().filter(x=>!isNaN(x)); let keys = this.$refs.menu.getCheckedKeys().filter(x=>!isNaN(x));
return keys; return keys;
}, },
bind(){ bind(){
let id = this.$refs.menu.getCurrentKey(); let id = this.$refs.menu.getCurrentKey();
let query = this.$refs.search.searchQuery(); let query = this.$refs.search.searchQuery();
const {thisTime,lastTime} = query; const {lastTime,thisTime} = query;
if(id==='1'){ if(id==='1'){
request({ request({
url: '/business/sdhsEvent/sectionAnalysis', url: '/business/sdhsEvent/sectionAnalysis',
@ -148,16 +151,16 @@ export default {
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'路段桩号',value:'stakeMark'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}] this.tableCols = [{label:'路段桩号',value:'stakeMark'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime; chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime; chartsOptions.series[1].name = lastTime;
if(result.data.length === 0){ if(result.data.length === 0){
this.tableData = [] this.tableData = []
chartsOptions.series[0].data = [] chartsOptions.series[0].data = []
chartsOptions.series[1].data = [] chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
@ -166,7 +169,7 @@ export default {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.stakeMark); chartsOptions.xAxis.data = this.tableData.map(x=>x.stakeMark);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
@ -177,16 +180,16 @@ export default {
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'事故类型',value:'eventType'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}] this.tableCols = [{label:'事故类型',value:'eventType'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime; chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime; chartsOptions.series[1].name = lastTime;
if(result.data.length === 0){ if(result.data.length === 0){
this.tableData = [] this.tableData = []
chartsOptions.series[0].data = [] chartsOptions.series[0].data = []
chartsOptions.series[1].data = [] chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
@ -194,130 +197,67 @@ export default {
setTimeout(() => { setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.eventType); chartsOptions.xAxis.data = this.tableData.map(x=>x.eventType);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
}, 200) }, 200)
}) })
} else if(id==='3'){ } else if(id==='3'){
let unit = '时';
if(query.type === '1'){unit='日'}
else if(query.type === '0'){unit='月'}
request({ request({
url: '/business/sdhsEvent/accidentModelAnalysis', url: '/business/sdhsEvent/eventTimeAnalysis',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [ this.tableCols = [{label:'事件时间',value:'time'},{label:thisTime+'事件总量(起)',value:'num'},{label:lastTime+'事件总量(起)',value:'numYes'}]
{label:'事故类型',value:'name'}, let _tableData = []
{label:'货车'+thisTime,value:'货车'+thisTime},
{label:'小型车'+thisTime,value:'小型车'+thisTime},
{label:'客车'+thisTime,value:'客车'+thisTime},
{label:'货车'+lastTime,value:'货车'+lastTime},
{label:'小型车'+lastTime,value:'小型车'+lastTime},
{label:'客车'+lastTime,value:'客车'+lastTime}
]
chartsOptions3.series[0].name = '货车'+thisTime
chartsOptions3.series[1].name = '小型车'+thisTime
chartsOptions3.series[2].name = '客车'+thisTime
chartsOptions3.series[3].name = '货车'+lastTime
chartsOptions3.series[4].name = '小型车'+lastTime
chartsOptions3.series[5].name = '客车'+lastTime
if(_.keys(result.data).length === 0){
chartsOptions3.series[0].data = [] chartsOptions4.series[0].name = thisTime;
chartsOptions3.series[1].data = [] chartsOptions4.series[1].name = lastTime;
chartsOptions3.series[2].data = [] this.curid = id;
chartsOptions3.series[3].data = [] if(_.keys(result.data[thisTime]).length === 0){
chartsOptions3.series[4].data = [] chartsOptions4.series[0].data = []
chartsOptions3.series[5].data = [] chartsOptions4.series[1].data = []
this.myChart.setOption(chartsOptions3); chartsOptions4.xAxis.data = [];
this.myChart.setOption(chartsOptions4);
this.myChart.resize(); this.myChart.resize();
this.tableData = [] this.tableData = []
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
let _tableData = []
for(let i in result.data[thisTime]){ for(let i in result.data[thisTime]){
const _row = {name:i} _tableData.push({
_row['货车'+thisTime] = result.data[thisTime][i]['货车']||0 idx:parseInt(i),
_row['小型车'+thisTime] = result.data[thisTime][i]['小型车']||0 time:i.toString()+ unit,
_row['客车'+thisTime] = result.data[thisTime][i]['客车']||0 num:result.data[thisTime][i.toString()],
numYes:result.data[lastTime][i.toString()]
_row['货车'+lastTime] = result.data[lastTime][i]['货车']||0 })
_row['小型车'+lastTime] = result.data[lastTime][i]['小型车']||0
_row['客车'+lastTime] = result.data[lastTime][i]['客车']||0
_tableData.push(_row)
} }
_tableData.sort(function(a,b){return a.idx-b.idx})
this.tableData = _tableData; this.tableData = _tableData;
this.curid = id;
setTimeout(() => { setTimeout(() => {
chartsOptions3.xAxis.data = _tableData.map(x=>x.name);
chartsOptions3.series[0].data = _tableData.map(x=>x['货车'+thisTime])
chartsOptions3.series[1].data = _tableData.map(x=>x['小型车'+thisTime])
chartsOptions3.series[2].data = _tableData.map(x=>x['客车'+thisTime])
chartsOptions3.series[3].data = _tableData.map(x=>x['货车'+lastTime])
chartsOptions3.series[4].data = _tableData.map(x=>x['小型车'+lastTime])
chartsOptions3.series[5].data = _tableData.map(x=>x['客车'+lastTime])
this.myChart.setOption(chartsOptions3);
this.myChart.resize();
}, 200);
})
} else if(id==='4'){
let unit = '时';
if(query.type === '1'){unit='日'}
else if(query.type === '0'){unit='月'}
request({
url: '/business/sdhsEvent/accidentTimeAnalysis',
method: 'post',
data: query
}).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'事故时间',value:'time'},{label:thisTime+'事故总量(起)',value:'num'},{label:lastTime+'事故总量(起)',value:'numYes'}]
let _tableData = []
chartsOptions4.series[0].name = thisTime;
chartsOptions4.series[1].name = lastTime;
this.curid = id;
if(_.keys(result.data[thisTime]).length === 0){
chartsOptions4.series[0].data = []
chartsOptions4.series[1].data = []
chartsOptions4.xAxis.data = [];
this.myChart.setOption(chartsOptions4);
this.myChart.resize();
this.tableData = []
this.$message.warning('暂无数据')
return;
}
for(let i in result.data[thisTime]){
_tableData.push({
idx:parseInt(i),
time:i.toString()+ unit,
num:result.data[thisTime][i.toString()],
numYes:result.data[lastTime][i.toString()]
})
}
_tableData.sort(function(a,b){return a.idx-b.idx})
this.tableData = _tableData;
setTimeout(() => {
chartsOptions4.series[0].data = _tableData.map(x=>x.num) chartsOptions4.series[0].data = _tableData.map(x=>x.num)
chartsOptions4.series[1].data = _tableData.map(x=>x.numYes) chartsOptions4.series[1].data = _tableData.map(x=>x.numYes)
chartsOptions4.xAxis.data = _tableData.map(x=>x.time); chartsOptions4.xAxis.data = _tableData.map(x=>x.time);
this.myChart.setOption(chartsOptions4); this.myChart.setOption(chartsOptions4);
this.myChart.resize(); this.myChart.resize();
},200) },200)
}) })
} else if(id==='5'){ } else if(id==='4'){
request({ request({
url: '/business/sdhsEvent/selectRegionAnalysis', url: '/business/sdhsEvent/selectEventRegionAnalysis',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
console.log(result) console.log(result)
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'发生地区',value:'city'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}] this.tableCols = [{label:'发生地区',value:'city'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime; chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime; chartsOptions.series[1].name = lastTime;
if(result.data.length===0){ if(result.data.length===0){
@ -326,21 +266,21 @@ export default {
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.tableData = [] this.tableData = []
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
this.curid = id; this.curid = id;
setTimeout(() => { setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = result.data.map(x=>x.city); chartsOptions.xAxis.data = result.data.map(x=>x.city);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='6'){ } else if(id==='5'){
request({ request({
url: '/business/sdhsEvent/selectStationAnalysis', url: '/business/sdhsEvent/selectStationAnalysis',
method: 'post', method: 'post',
@ -354,7 +294,7 @@ export default {
{label:thisTime+'限行',value:thisTime+'restriction'}, {label:thisTime+'限行',value:thisTime+'restriction'},
{label:lastTime+'封闭',value:lastTime+'close'}, {label:lastTime+'封闭',value:lastTime+'close'},
{label:lastTime+'限行',value:lastTime+'restriction'}, {label:lastTime+'限行',value:lastTime+'restriction'},
] ]
chartsOptions6.series[0].name = thisTime+'封闭' chartsOptions6.series[0].name = thisTime+'封闭'
chartsOptions6.series[1].name = thisTime+'限行' chartsOptions6.series[1].name = thisTime+'限行'
chartsOptions6.series[2].name = lastTime+'封闭' chartsOptions6.series[2].name = lastTime+'封闭'
@ -367,7 +307,7 @@ export default {
this.myChart.setOption(chartsOptions6); this.myChart.setOption(chartsOptions6);
this.myChart.resize(); this.myChart.resize();
this.tableData = [] this.tableData = []
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
@ -381,9 +321,9 @@ export default {
this.myChart.setOption(chartsOptions6); this.myChart.setOption(chartsOptions6);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='7'){ } else if(id==='6'){
request({ request({
url: '/business/sdhsEvent/selectWeather', url: '/business/sdhsEvent/selectWeather',
method: 'post' method: 'post'
@ -393,27 +333,27 @@ export default {
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
if(result.data.dataList.length===0){ if(result.data.dataList.length===0){
this.tableData = [] this.tableData = []
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
let col = [{label:'地区',value:'regionName'}] let col = [{label:'地区',value:'regionName'}]
for(let i in result.data.column){ for(let i in result.data.column){
col.push({label:result.data.column[i],value:i}) col.push({label:result.data.column[i],value:i})
} }
this.tableCols = col; this.tableCols = col;
this.tableData = result.data.dataList; this.tableData = result.data.dataList;
}) })
} else if(id==='8'){ } else if(id==='7'){
request({ request({
url: '/business/sdhsEvent/gantryAnalysis', url: '/business/sdhsEvent/gantryAnalysis',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'方向',value:'dir'},{label:'门架',value:'name'},{label:'车流量',value:'num'}] this.tableCols = [{label:'方向',value:'dir'},{label:'门架',value:'name'},{label:'车流量',value:'num'}]
chartsOptions8.legend.data[0].name = thisTime+'车流量' chartsOptions8.legend.data[0].name = thisTime+'车流量'
chartsOptions8.legend.data[1].name = lastTime+'车流量' chartsOptions8.legend.data[1].name = lastTime+'车流量'
@ -459,15 +399,15 @@ export default {
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='9'){ } else if(id==='8'){
request({ request({
url: '/business/sdhsEvent/TollBoothStatisticsList', url: '/business/sdhsEvent/TollBoothStatisticsList',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'方向',value:'dir'},{label:'收费站',value:'name'},{label:'车流量',value:'num'}] this.tableCols = [{label:'方向',value:'dir'},{label:'收费站',value:'name'},{label:'车流量',value:'num'}]
chartsOptions8.legend.data[0].name = thisTime+'车流量' chartsOptions8.legend.data[0].name = thisTime+'车流量'
chartsOptions8.legend.data[1].name = lastTime+'车流量' chartsOptions8.legend.data[1].name = lastTime+'车流量'
@ -477,7 +417,7 @@ export default {
chartsOptions8.series[2].name = thisTime+'车流量' chartsOptions8.series[2].name = thisTime+'车流量'
chartsOptions8.series[3].name = lastTime+'车流量' chartsOptions8.series[3].name = lastTime+'车流量'
let _tableData = [] let _tableData = []
for(let i of result.data[thisTime+'exit']){ for(let i of result.data[thisTime+'exit']){
@ -509,58 +449,228 @@ export default {
chartsOptions8.series[1].data =result.data[lastTime+'exit'].map(x=>x.trafficVolume) chartsOptions8.series[1].data =result.data[lastTime+'exit'].map(x=>x.trafficVolume)
chartsOptions8.series[2].data = result.data[thisTime+'entrance'].map(x=>x.trafficVolume) chartsOptions8.series[2].data = result.data[thisTime+'entrance'].map(x=>x.trafficVolume)
chartsOptions8.series[3].data =result.data[lastTime+'entrance'].map(x=>x.trafficVolume) chartsOptions8.series[3].data =result.data[lastTime+'entrance'].map(x=>x.trafficVolume)
this.myChart.setOption(chartsOptions8); this.myChart.setOption(chartsOptions8);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='10'){ } else if(id==='9'){
request({ request({
url: '/business/sdhsEvent/selectAccidentType', url: '/business/sdhsEvent/selectAccidentType',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'事故类型',value:'eventSubclass'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}] this.tableCols = [{label:'事故类型',value:'eventSubclass'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime; chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime; chartsOptions.series[1].name = lastTime;
if(result.data.length===0){ if(result.data.length===0){
this.tableData = [] this.tableData = []
chartsOptions.series[0].data = [] chartsOptions.series[0].data = []
chartsOptions.series[1].data = [] chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
this.curid = id; this.curid = id;
setTimeout(() => { setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.eventSubclass); chartsOptions.xAxis.data = this.tableData.map(x=>x.eventSubclass);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize();
}, 200);
})
} else if(id==='10'){
request({
url: '/business/sdhsEvent/accidentModelAnalysis',
method: 'post',
data: query
}).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [
{label:'事故类型',value:'name'},
{label:'货车'+thisTime,value:'货车'+thisTime},
{label:'小型车'+thisTime,value:'小型车'+thisTime},
{label:'客车'+thisTime,value:'客车'+thisTime},
{label:'货车'+lastTime,value:'货车'+lastTime},
{label:'小型车'+lastTime,value:'小型车'+lastTime},
{label:'客车'+lastTime,value:'客车'+lastTime}
]
chartsOptions3.series[0].name = '货车'+thisTime
chartsOptions3.series[1].name = '小型车'+thisTime
chartsOptions3.series[2].name = '客车'+thisTime
chartsOptions3.series[3].name = '货车'+lastTime
chartsOptions3.series[4].name = '小型车'+lastTime
chartsOptions3.series[5].name = '客车'+lastTime
if(_.keys(result.data).length === 0){
chartsOptions3.series[0].data = []
chartsOptions3.series[1].data = []
chartsOptions3.series[2].data = []
chartsOptions3.series[3].data = []
chartsOptions3.series[4].data = []
chartsOptions3.series[5].data = []
this.myChart.setOption(chartsOptions3);
this.myChart.resize();
this.tableData = []
this.$message.warning('暂无数据')
return;
}
let _tableData = []
for(let i in result.data[thisTime]){
const _row = {name:i}
_row['货车'+thisTime] = result.data[thisTime][i]['货车']||0
_row['小型车'+thisTime] = result.data[thisTime][i]['小型车']||0
_row['客车'+thisTime] = result.data[thisTime][i]['客车']||0
_row['货车'+lastTime] = result.data[lastTime][i]['货车']||0
_row['小型车'+lastTime] = result.data[lastTime][i]['小型车']||0
_row['客车'+lastTime] = result.data[lastTime][i]['客车']||0
_tableData.push(_row)
}
this.tableData = _tableData;
this.curid = id;
setTimeout(() => {
chartsOptions3.xAxis.data = _tableData.map(x=>x.name);
chartsOptions3.series[0].data = _tableData.map(x=>x['货车'+thisTime])
chartsOptions3.series[1].data = _tableData.map(x=>x['小型车'+thisTime])
chartsOptions3.series[2].data = _tableData.map(x=>x['客车'+thisTime])
chartsOptions3.series[3].data = _tableData.map(x=>x['货车'+lastTime])
chartsOptions3.series[4].data = _tableData.map(x=>x['小型车'+lastTime])
chartsOptions3.series[5].data = _tableData.map(x=>x['客车'+lastTime])
this.myChart.setOption(chartsOptions3);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='11'){ } else if(id==='11'){
let unit = '时';
if(query.type === '1'){unit='日'}
else if(query.type === '0'){unit='月'}
request({
url: '/business/sdhsEvent/accidentTimeAnalysis',
method: 'post',
data: query
}).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'事故时间',value:'time'},{label:thisTime+'事故总量(起)',value:'num'},{label:lastTime+'事故总量(起)',value:'numYes'}]
let _tableData = []
chartsOptions4.series[0].name = thisTime;
chartsOptions4.series[1].name = lastTime;
this.curid = id;
if(_.keys(result.data[thisTime]).length === 0){
chartsOptions4.series[0].data = []
chartsOptions4.series[1].data = []
chartsOptions4.xAxis.data = [];
this.myChart.setOption(chartsOptions4);
this.myChart.resize();
this.tableData = []
this.$message.warning('暂无数据')
return;
}
for(let i in result.data[thisTime]){
_tableData.push({
idx:parseInt(i),
time:i.toString()+ unit,
num:result.data[thisTime][i.toString()],
numYes:result.data[lastTime][i.toString()]
})
}
_tableData.sort(function(a,b){return a.idx-b.idx})
this.tableData = _tableData;
setTimeout(() => {
chartsOptions4.series[0].data = _tableData.map(x=>x.num)
chartsOptions4.series[1].data = _tableData.map(x=>x.numYes)
chartsOptions4.xAxis.data = _tableData.map(x=>x.time);
this.myChart.setOption(chartsOptions4);
this.myChart.resize();
},200)
})
} else if(id==='12'){
request({
url: '/business/sdhsEvent/selectRegionAnalysis',
method: 'post',
data: query
}).then(result=>{
console.log(result)
if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'发生地区',value:'city'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime;
if(result.data.length===0){
chartsOptions.series[0].data = []
chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions);
this.myChart.resize();
this.tableData = []
this.$message.warning('暂无数据')
return;
}
this.tableData = result.data;
this.curid = id;
setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = result.data.map(x=>x.city);
this.myChart.setOption(chartsOptions);
this.myChart.resize();
}, 200);
})
} else if(id==='13'){
request({
url: '/business/sdhsEvent/accidentSectionAnalysis',
method: 'post',
data: query
}).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'路段桩号',value:'stakeMark'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime;
if(result.data.length === 0){
this.tableData = []
chartsOptions.series[0].data = []
chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions);
this.myChart.resize();
this.$message.warning('暂无数据')
return;
}
this.tableData = result.data;
this.curid = id;
setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.stakeMark);
this.myChart.setOption(chartsOptions);
this.myChart.resize();
}, 200);
})
} else if(id==='14'){
request({ request({
url: '/business/sdhsEvent/congestedLocation', url: '/business/sdhsEvent/congestedLocation',
method: 'post', method: 'post',
data: query data: query
}).then(result=>{ }).then(result=>{
if (result.code != 200) return this.$message.error(result?.msg); if (result.code != 200) return this.$message.error(result?.msg);
this.tableCols = [{label:'拥堵类型',value:'eventSubclass'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}] this.tableCols = [{label:'拥堵类型',value:'eventSubclass'},{label:thisTime+' 数量(起)',value:thisTime},{label:lastTime+' 数量(起)',value:lastTime}]
chartsOptions.series[0].name = thisTime; chartsOptions.series[0].name = thisTime;
chartsOptions.series[1].name = lastTime; chartsOptions.series[1].name = lastTime;
if(result.data.length===0){ if(result.data.length===0){
this.tableData = [] this.tableData = []
chartsOptions.series[0].data = [] chartsOptions.series[0].data = []
chartsOptions.series[1].data = [] chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
@ -568,15 +678,15 @@ export default {
setTimeout(() => { setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.eventSubclass); chartsOptions.xAxis.data = this.tableData.map(x=>x.eventSubclass);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
} else if(id==='12'){ } else if(id==='15'){
request({ request({
url: '/business/sdhsEvent/congestedTime', url: '/business/sdhsEvent/congestedTime',
method: 'post', method: 'post',
@ -590,9 +700,9 @@ export default {
this.tableData = [] this.tableData = []
chartsOptions.series[0].data = [] chartsOptions.series[0].data = []
chartsOptions.series[1].data = [] chartsOptions.series[1].data = []
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
this.$message.warning('暂无数据') this.$message.warning('暂无数据')
return; return;
} }
this.tableData = result.data; this.tableData = result.data;
@ -600,13 +710,13 @@ export default {
setTimeout(() => { setTimeout(() => {
chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime]) chartsOptions.series[0].data = this.tableData.map(x=>x[thisTime])
chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime]) chartsOptions.series[1].data = this.tableData.map(x=>x[lastTime])
chartsOptions.xAxis.data = this.tableData.map(x=>x.stakeMark); chartsOptions.xAxis.data = this.tableData.map(x=>x.stakeMark);
this.myChart.setOption(chartsOptions); this.myChart.setOption(chartsOptions);
this.myChart.resize(); this.myChart.resize();
}, 200); }, 200);
}) })
}else { }else {
this.$message.warning('暂未配置') this.$message.warning('暂未配置')
@ -615,7 +725,7 @@ export default {
onTreeClick(e){ onTreeClick(e){
this.curid = '' this.curid = ''
this.myChart.dispose(); this.myChart.dispose();
this.myChart = echarts.init(document.getElementById("charts")); this.myChart = echarts.init(document.getElementById("charts"));
if(e.id === 'a'){ if(e.id === 'a'){
this.$refs.menu.setCurrentKey(1); this.$refs.menu.setCurrentKey(1);
@ -630,7 +740,7 @@ export default {
} else { } else {
this.$refs.menu.setCurrentKey(e.id); this.$refs.menu.setCurrentKey(e.id);
} }
this.bind() this.bind()
}, },
handleCheckedTreeNodeAll(value) { handleCheckedTreeNodeAll(value) {
@ -696,7 +806,7 @@ export default {
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
padding:10px; padding:10px;
} }
.cright{ .cright{
flex: 1; flex: 1;

29
ruoyi-ui/src/views/JiHeExpressway/pages/service/analysis/search/index.vue

@ -64,7 +64,7 @@ export default {
urlRoot: process.env.VUE_APP_BASE_API, // urlRoot: process.env.VUE_APP_BASE_API, //
uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", //
fileList: [], fileList: [],
fileType: ["xls", "xlsx"], fileType: ["xls", "xlsx"],
fileName: '', fileName: '',
@ -103,7 +103,7 @@ export default {
}, },
created() { }, created() { },
watch: { watch: {
dateTime:{ dateTime:{
handler: function(n,o) { handler: function(n,o) {
@ -132,7 +132,7 @@ export default {
}, },
}).then((result) => { }).then((result) => {
if (result.code != 200) return Message.error(result?.msg); if (result.code != 200) return Message.error(result?.msg);
this.$message.success(`上传完成。成功${result.data.successNum}条,失败${result.data.errorNum}`); this.$message.success(`上传完成。成功${result.data.successNum}条,失败${result.data.errorNum}`);
this.bindFiles(); this.bindFiles();
}); });
}, },
@ -156,17 +156,18 @@ export default {
this.dateTime.unshift(moment(this.dateTime[0]).subtract(1,'years').subtract.format("YYYY-MM-DD")) this.dateTime.unshift(moment(this.dateTime[0]).subtract(1,'years').subtract.format("YYYY-MM-DD"))
} }
} }
let thisTime = this.dateTime[0]; this.dateTime.sort((a, b) => a - b);
let lastTime = this.dateTime[1]; let lastTime = this.dateTime[0];
let thisTime = this.dateTime[1];
if (this.type == 2) { // if (this.type == 2) { //
thisTime = moment(this.dateTime[0]).format("YYYY-MM-DD"); lastTime = moment(this.dateTime[0]).format("YYYY-MM-DD");
lastTime = moment(this.dateTime[1]).format("YYYY-MM-DD"); thisTime = moment(this.dateTime[1]).format("YYYY-MM-DD");
} else if (this.type == 1) { // } else if (this.type == 1) { //
thisTime = moment(this.dateTime[0]).format("YYYY-MM"); lastTime = moment(this.dateTime[0]).format("YYYY-MM");
lastTime = moment(this.dateTime[1]).format("YYYY-MM"); thisTime = moment(this.dateTime[1]).format("YYYY-MM");
} else if (this.type == 0) { // } else if (this.type == 0) { //
thisTime = moment(this.dateTime[0]).format("YYYY"); lastTime = moment(this.dateTime[0]).format("YYYY");
lastTime = moment(this.dateTime[1]).format("YYYY"); thisTime = moment(this.dateTime[1]).format("YYYY");
} }
return {type: this.type, thisTime,lastTime} return {type: this.type, thisTime,lastTime}
}, },
@ -175,8 +176,8 @@ export default {
this.selectIndex = 1; this.selectIndex = 1;
this.reset = true; this.reset = true;
this.direction = "1"; this.direction = "1";
this.type = "1"; this.type = "0";
this.dateTime = [moment().subtract(1,'years').format("YYYY-MM-DD"),moment().format("YYYY-MM-DD")]; this.dateTime = [moment().subtract(1,'years').format("YYYY"),moment().format("YYYY")];
this.$parent.bind() this.$parent.bind()
}, },
onQuery(){ onQuery(){
@ -231,7 +232,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
height: 40px; height: 40px;
font-size: 14px; font-size: 14px;
margin-bottom: 10px; margin-bottom: 10px;
z-index: 1; z-index: 1;

Loading…
Cancel
Save