|
|
|
@ -5,7 +5,7 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="StatsDetail"> |
|
|
|
<el-table :data="tableData" style="width: 100%" :span-method="arraySpanMethod"> |
|
|
|
<el-table v-if="searchType == 2" :data="tableData" style="width: 100%" :span-method="arraySpanMethod"> |
|
|
|
<el-table-column prop="controlCauseName" label="封闭原因" width="150" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="causeTypeName" label="" align="center"> |
|
|
|
@ -41,6 +41,18 @@ |
|
|
|
<el-table-column prop="yearTimeRatio" label="同比（%）" align="center"></el-table-column> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<el-table v-else :data="facilityTableData" style="width: 100%"> |
|
|
|
<el-table-column prop="facilityName" label="" width="150" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="facilityClose" label="封闭" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="facilityRestriction" label="限行" width="150" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="facilityInterval" label="间隔放行" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="causeTypeName" label="合计" align="center"> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
</div> |
|
|
|
</Dialog> |
|
|
|
@ -52,6 +64,7 @@ import InputSearch from '@screen/components/InputSearch/index.vue'; |
|
|
|
import Table from "@screen/components/Table.vue"; |
|
|
|
import { selectTollStation } from "@/api/event/governanceAnalysis" |
|
|
|
import options from "../assets/charts"; |
|
|
|
import request from "@/utils/request"; |
|
|
|
export default { |
|
|
|
name: 'StatsDetail', |
|
|
|
components: { |
|
|
|
@ -78,32 +91,41 @@ export default { |
|
|
|
return time.getTime() > Date.now(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
searchType: 1, |
|
|
|
facilityIds: [], |
|
|
|
searchFormList: [ |
|
|
|
{ |
|
|
|
label: "查询条件:", |
|
|
|
key: "a", |
|
|
|
key: "searchType", |
|
|
|
required: true, |
|
|
|
isAlone: true, |
|
|
|
type: "RadioGroup", |
|
|
|
default: 1, |
|
|
|
options: { |
|
|
|
type: 'circle', |
|
|
|
options: [ |
|
|
|
{ |
|
|
|
key: "0", |
|
|
|
key: 1, |
|
|
|
label: "站点", |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: "1", |
|
|
|
key: 2, |
|
|
|
label: "原因", |
|
|
|
} |
|
|
|
], |
|
|
|
] |
|
|
|
} |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "事件类型:", |
|
|
|
key: "b", |
|
|
|
key: "controlType", |
|
|
|
required: true, |
|
|
|
type: "RadioGroup", |
|
|
|
visible: data => { |
|
|
|
if (data.searchType == 2) { |
|
|
|
return true |
|
|
|
} |
|
|
|
}, |
|
|
|
default: 1, |
|
|
|
options: { |
|
|
|
type: 'circle', |
|
|
|
options: [{ |
|
|
|
@ -118,20 +140,17 @@ export default { |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "选择站点:", |
|
|
|
key: "c", |
|
|
|
key: "facilityId", |
|
|
|
required: true, |
|
|
|
type: "RadioGroup", |
|
|
|
type: "select", |
|
|
|
options: { |
|
|
|
type: 'circle', |
|
|
|
options: [{ |
|
|
|
key: 1, |
|
|
|
label: "收费站封闭", |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: 2, |
|
|
|
label: "收费站限行", |
|
|
|
}] |
|
|
|
} |
|
|
|
multiple: true |
|
|
|
}, |
|
|
|
visible: data => { |
|
|
|
if (data.searchType == 1) { |
|
|
|
return true |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "日期:", |
|
|
|
@ -164,16 +183,44 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
getFacilityList() { |
|
|
|
Promise.allSettled([ |
|
|
|
// 查询收费站 |
|
|
|
request({ |
|
|
|
url: `/business/facility/query`, |
|
|
|
method: "get", |
|
|
|
}), |
|
|
|
]) |
|
|
|
.then((res) => { |
|
|
|
console.log(789789, res) |
|
|
|
if (res[0].status === 'fulfilled' && res[0].value.code == 200) { |
|
|
|
this.searchFormList[2].options.options = res[0].value.data.map(item => ({ |
|
|
|
key: item.id, |
|
|
|
label: item.facilityName, |
|
|
|
})) |
|
|
|
this.facilityIds = res[0].value.data.map(item => item.id) |
|
|
|
console.log(777, this.facilityIds) |
|
|
|
let date = moment().format('YYYY-MM-DD') |
|
|
|
let data = { |
|
|
|
searchType: 1, |
|
|
|
facilityId: this.facilityIds, |
|
|
|
date: [date + " 00:00:00", date + " 23:59:59"] |
|
|
|
} |
|
|
|
this.getSelectTollStation(data) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
}, |
|
|
|
handleSearch(data) { |
|
|
|
console.log("data", data) |
|
|
|
console.log("data555", data) |
|
|
|
this.getSelectTollStation(data) |
|
|
|
}, |
|
|
|
arraySpanMethod({ row, column, rowIndex, columnIndex }) { |
|
|
|
console.log("+++++++", row, column, rowIndex, columnIndex) |
|
|
|
// console.log("+++++++", row, column, rowIndex, columnIndex) |
|
|
|
|
|
|
|
|
|
|
|
if (!row.causeTypeName) { |
|
|
|
console.log("11111111111") |
|
|
|
// console.log("11111111111") |
|
|
|
if (columnIndex === 0) { |
|
|
|
return [1, 2]; |
|
|
|
} |
|
|
|
@ -182,7 +229,7 @@ export default { |
|
|
|
} |
|
|
|
}; |
|
|
|
if (row.controlCauseName === '恶劣天气') { |
|
|
|
console.log("222222222222") |
|
|
|
// console.log("222222222222") |
|
|
|
if (columnIndex === 0) { |
|
|
|
console.log(this.weatherNum.length) |
|
|
|
if (rowIndex === 0) { |
|
|
|
@ -230,32 +277,39 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
var formData = new FormData(); |
|
|
|
formData.append("controlType", '1'); |
|
|
|
this.searchType == data.searchType |
|
|
|
|
|
|
|
formData.append("controlType", data.controlType); |
|
|
|
formData.append("searchType", data.searchType); |
|
|
|
formData.append("facilityId", data.facilityId); |
|
|
|
formData.append("startTime", startTime); |
|
|
|
formData.append("endTime", endTime); |
|
|
|
let weatherData = [] |
|
|
|
let otherData = [] |
|
|
|
selectTollStation(formData).then((res) => { |
|
|
|
this.weatherNum = [] |
|
|
|
res.data.forEach(item => { |
|
|
|
if (item.causeTypeName) { |
|
|
|
this.weatherNum.push(item.causeTypeName) |
|
|
|
weatherData.push(item) |
|
|
|
} else { |
|
|
|
otherData.push(item) |
|
|
|
} |
|
|
|
}); |
|
|
|
this.tableData = weatherData.concat(otherData) |
|
|
|
if (data.searchType == 2) { |
|
|
|
this.weatherNum = [] |
|
|
|
res.data.forEach(item => { |
|
|
|
if (item.causeTypeName) { |
|
|
|
this.weatherNum.push(item.causeTypeName) |
|
|
|
weatherData.push(item) |
|
|
|
} else { |
|
|
|
otherData.push(item) |
|
|
|
} |
|
|
|
}); |
|
|
|
this.tableData = weatherData.concat(otherData) |
|
|
|
} else { |
|
|
|
this.facilityTableData = res.data |
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
let date = moment().format('YYYY-MM-DD') |
|
|
|
let data = { |
|
|
|
date: [date + " 00:00:00", date + " 23:59:59"] |
|
|
|
} |
|
|
|
this.getSelectTollStation(data) |
|
|
|
this.getFacilityList() |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
@ -296,6 +350,7 @@ export default { |
|
|
|
|
|
|
|
::v-deep .el-table th.el-table__cell>.cell { |
|
|
|
color: #3DE8FF; |
|
|
|
background: #1B586D; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .el-table thead.is-group th.el-table__cell { |
|
|
|
@ -312,10 +367,12 @@ export default { |
|
|
|
|
|
|
|
::v-deep .el-table tr { |
|
|
|
border: 1px solid #07AEC6; |
|
|
|
background-color: #1B586D; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell { |
|
|
|
background: #1B586D; |
|
|
|
border: 1px solid #07AEC6; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .el-table::before, |
|
|
|
|
