|
|
|
@ -6,12 +6,12 @@ |
|
|
|
</el-tabs> |
|
|
|
|
|
|
|
<div> |
|
|
|
<Table :data="tableData" :show-header="false"> |
|
|
|
<Table :data="tableData" :show-header="false" @cell-click="onCellClick"> |
|
|
|
<ElTableColumn prop="remark" width="280"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div class="leftColumn"> |
|
|
|
<div class="device-icon" |
|
|
|
:style="{ backgroundImage: `url(${require(`@screen/images/event/${activeTab == 'first' ? (WarningType[scope.row.warningType] || '交通拥堵') : '交通拥堵'}.svg`)})` }" /> |
|
|
|
:style="{ backgroundImage: `url(${require(`@screen/images/event/${activeTab == 'first' ? ('交通拥堵') : '交通拥堵'}.svg`)})` }" /> |
|
|
|
<p>{{ activeTab == 'first' ? WarningType[scope.row.warningType] : scope.row.stringEventType }}</p> |
|
|
|
</div> |
|
|
|
<P> {{ scope.row.remark }}</P> |
|
|
|
@ -27,20 +27,36 @@ |
|
|
|
layout="total, sizes, prev, pager, next" :total="total"> |
|
|
|
</Pagination> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- "详情"弹出框 --> |
|
|
|
<EventDetailDialog :visible="eventDetailDialogVisible" :formData="detailDialogFormData" :activeName="activeName" |
|
|
|
@update:value="handleDialogClose" @queryData="reData" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import request from "@/utils/request"; |
|
|
|
import EventDetailDialog from "@screen/pages/control/event/event/EventDetailDialog/index"; |
|
|
|
import Table from '@screen/components/Table.vue'; |
|
|
|
import Pagination from '@screen/components/Pagination.vue'; |
|
|
|
import { WarningType } from "@screen/utils/enum.js"; |
|
|
|
import { Message } from "element-ui"; |
|
|
|
import { WarningType as warningTypeMapping, DirectionTypes as gzDirectionMapping, warningSourceMapping, warningStateMapping } from "@screen/utils/enum.js" |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { |
|
|
|
Table, |
|
|
|
Pagination, |
|
|
|
EventDetailDialog |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
activeTab: "first", |
|
|
|
WarningType, |
|
|
|
eventDetailDialogVisible: false, |
|
|
|
detailDialogFormData: {}, |
|
|
|
activeName: '-1', |
|
|
|
tableData: [], |
|
|
|
total: 10, |
|
|
|
searchData: { |
|
|
|
@ -49,10 +65,6 @@ export default { |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
components: { |
|
|
|
Table, |
|
|
|
Pagination |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
@ -62,6 +74,21 @@ export default { |
|
|
|
onChangeTab(tab, event) { |
|
|
|
console.log(tab, event); |
|
|
|
this.getMainData(); |
|
|
|
}, |
|
|
|
onCellClick(row, column, cell, event) { |
|
|
|
// console.log('55', row, column, cell, event) |
|
|
|
if (this.activeTab == 'first') { |
|
|
|
this.activeName = '-1' |
|
|
|
} else { |
|
|
|
this.activeName = '0' |
|
|
|
} |
|
|
|
this.firstBtnClick(row.id); |
|
|
|
}, |
|
|
|
handleDialogClose() { |
|
|
|
this.eventDetailDialogVisible = false; |
|
|
|
}, |
|
|
|
reData() { |
|
|
|
|
|
|
|
}, |
|
|
|
getMainData() { |
|
|
|
if (this.activeTab == 'first') { |
|
|
|
@ -70,7 +97,6 @@ export default { |
|
|
|
method: "POST", |
|
|
|
data: { |
|
|
|
warningState: 1, |
|
|
|
pageNum: 1, pageSize: 10 |
|
|
|
} |
|
|
|
}) |
|
|
|
.then((result) => { |
|
|
|
@ -95,6 +121,70 @@ export default { |
|
|
|
}) |
|
|
|
} |
|
|
|
}, |
|
|
|
firstBtnClick(id) {//点击去确认/详情/处置记录等第一个按钮 |
|
|
|
console.log("id", id); |
|
|
|
if (this.activeName == '-1') { |
|
|
|
request({ |
|
|
|
url: `/perceivedEvents/warning/getWarningById`,//感知事件 |
|
|
|
method: "post", |
|
|
|
data: { id } |
|
|
|
}).then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
let data = result.data; |
|
|
|
|
|
|
|
data.stringEventSource = data?.warningSource ? warningSourceMapping[data.warningSource] : ''; |
|
|
|
data.nickName = data.userName; |
|
|
|
data.direction = gzDirectionMapping[data.direction] || data.direction; |
|
|
|
data.startTime = data.warningTime; |
|
|
|
data.stringEventState = warningStateMapping[data.warningState]; |
|
|
|
data.stringEventType = warningTypeMapping[data.warningType]; |
|
|
|
|
|
|
|
data.videoList = []; |
|
|
|
if (data.otherConfig) { |
|
|
|
let otherConfig = JSON.parse(data.otherConfig); |
|
|
|
|
|
|
|
data.waterFilmThickness = otherConfig.waterFilmThickness; |
|
|
|
data.windSpeed = otherConfig.windSpeed; |
|
|
|
data.visibility = otherConfig.visibility; |
|
|
|
|
|
|
|
data.pictures = otherConfig.pictures || []; |
|
|
|
data.videoList = otherConfig.videoList || []; |
|
|
|
// data.videoList = ['https://sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/mp4/xgplayer-demo-480p.mp4', |
|
|
|
// 'https://sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/mp4/xgplayer-demo-480p.mp4'] |
|
|
|
} |
|
|
|
data.videoType = "mp4"; |
|
|
|
data.component = "Video"; |
|
|
|
this.detailDialogFormData = data; |
|
|
|
// console.log('data', this.detailDialogFormData) |
|
|
|
|
|
|
|
this.eventDetailDialogVisible = true; |
|
|
|
}); |
|
|
|
} else { |
|
|
|
request({ |
|
|
|
url: `/dc/system/event/${id}`,//交通事件 |
|
|
|
method: "get", |
|
|
|
}).then(async (result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
let data = result.data; |
|
|
|
data.stringDirection = gzDirectionMapping[data.direction] || data.direction; |
|
|
|
data.startTime = data?.occurrenceTime || ''; |
|
|
|
|
|
|
|
|
|
|
|
data.videoList = []; |
|
|
|
data.component = "VideoMulti"; |
|
|
|
|
|
|
|
// const { downCamera, upCamera } = ((await getNearCameraNew(data.stakeMark))?.data || {});//新的上下游摄像头接口 |
|
|
|
// data.downCamId = downCamera?.camId; |
|
|
|
// data.upCamId = upCamera?.camId; |
|
|
|
data.videoType = "flv"; |
|
|
|
|
|
|
|
this.detailDialogFormData = data; |
|
|
|
|
|
|
|
this.eventDetailDialogVisible = true; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
onSizeChange(pageSize) { |
|
|
|
this.searchData.pageSize = pageSize; |
|
|
|
this.getMainData(); |
|
|
|
|
