|
|
|
@ -3,9 +3,9 @@ |
|
|
|
<div class="PerceiveEvent"> |
|
|
|
<!-- <Video class="item-video" /> --> |
|
|
|
<div class="video-pic"> |
|
|
|
<Video style="height: 100%;flex:1" :showHeader="false" :url="dialogData.formData.videoList[0]" |
|
|
|
<Video style="height: 100%; flex: 1" :showHeader="false" :url="dialogData.formData.videoList[0]" |
|
|
|
videoType="mp4" /> |
|
|
|
<Carousel style="flex: 1;height: 100%;" :pictures="dialogData.formData.pictures" /> |
|
|
|
<Carousel style="flex: 1; height: 100%" :pictures="dialogData.formData.pictures" /> |
|
|
|
</div> |
|
|
|
<LineChart class="chart" /> |
|
|
|
<Form class="form" v-loading="loading" v-model="data" ref="FormConfigRef" :formList="formList" column="1" /> |
|
|
|
@ -13,28 +13,27 @@ |
|
|
|
|
|
|
|
<template #footer> |
|
|
|
<Button>误报</Button> |
|
|
|
<Button style="background-color: rgba(0, 179, 204, 0.3);" @click.native="obverseVisible = false">取消</Button> |
|
|
|
<Button style="background-color: rgba(0, 179, 204, 0.3)" @click.native="obverseVisible = false">取消</Button> |
|
|
|
<Button @click.native="updateEvent" :loading="btnLoading">确定</Button> |
|
|
|
</template> |
|
|
|
</Dialog> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
|
|
|
|
import Dialog from "@screen/components/Dialog/index.vue"; |
|
|
|
import Button from "@screen/components/Buttons/Button.vue" |
|
|
|
import Descriptions from '@screen/components/Descriptions.vue'; |
|
|
|
import LineChart from './components/LineChart/index.vue'; |
|
|
|
import Button from "@screen/components/Buttons/Button.vue"; |
|
|
|
import Descriptions from "@screen/components/Descriptions.vue"; |
|
|
|
import LineChart from "./components/LineChart/index.vue"; |
|
|
|
import Video from "@screen/components/Video"; |
|
|
|
import Form from '@screen/components/FormConfig'; |
|
|
|
import Form from "@screen/components/FormConfig"; |
|
|
|
import request from "@/utils/request"; |
|
|
|
import { Message } from "element-ui"; |
|
|
|
import moment from "moment"; |
|
|
|
import Carousel from "@screen/pages/control/event/event/EventDetailDialog/Carousel" |
|
|
|
import { WarningTypeList, WarningSubclassList } from "@screen/utils/enum.js" |
|
|
|
import Carousel from "@screen/pages/control/event/event/EventDetailDialog/Carousel"; |
|
|
|
import { WarningTypeList, WarningSubclassList, LaneOccupancyList, DirectionTypes } from "@screen/utils/enum.js"; |
|
|
|
// import { getRoadInfoByStakeMark, getProduct } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js" |
|
|
|
import { dialogDelayVisible } from "./../mixin" |
|
|
|
import { LaneOccupancyList, DirectionTypes } from "@screen/utils/enum.js" |
|
|
|
|
|
|
|
import { dialogDelayVisible } from "./../mixin"; |
|
|
|
|
|
|
|
let vehicleTypeList = []; |
|
|
|
|
|
|
|
@ -61,7 +60,7 @@ function padZero(num) { |
|
|
|
|
|
|
|
// 感知事件 |
|
|
|
export default { |
|
|
|
name: 'PerceiveEvent', |
|
|
|
name: "PerceiveEvent", |
|
|
|
mixins: [dialogDelayVisible], |
|
|
|
components: { |
|
|
|
Dialog, |
|
|
|
@ -70,13 +69,13 @@ export default { |
|
|
|
LineChart, |
|
|
|
Video, |
|
|
|
Carousel, |
|
|
|
Form |
|
|
|
Form, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
interval: null, |
|
|
|
loading: true, |
|
|
|
activeName: 'first', |
|
|
|
activeName: "first", |
|
|
|
deviceControlVisible: false, |
|
|
|
btnLoading: false, |
|
|
|
data: { |
|
|
|
@ -103,13 +102,13 @@ export default { |
|
|
|
label: "路段方向:", |
|
|
|
key: "direction", |
|
|
|
type: "text", |
|
|
|
isAlone: true |
|
|
|
isAlone: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "事件来源:", |
|
|
|
key: "warningSource", |
|
|
|
type: "text", |
|
|
|
enum: "InfoWarningSource" |
|
|
|
enum: "InfoWarningSource", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "事件类型:", |
|
|
|
@ -117,21 +116,22 @@ export default { |
|
|
|
type: "select", |
|
|
|
options: { |
|
|
|
disabled: true, |
|
|
|
options: WarningTypeList |
|
|
|
options: WarningTypeList, |
|
|
|
}, |
|
|
|
ons: { |
|
|
|
change: (value, { data }) => { |
|
|
|
this.formList[4].options.options = WarningSubclassList[value] || []; |
|
|
|
this.formList[5].options.options = |
|
|
|
WarningSubclassList[value] || []; |
|
|
|
data.warningSubclass = null; |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "细分类型:", |
|
|
|
key: "warningSubclass", |
|
|
|
type: "select", |
|
|
|
options: { |
|
|
|
options: [] |
|
|
|
options: [], |
|
|
|
}, |
|
|
|
}, |
|
|
|
// { |
|
|
|
@ -150,7 +150,7 @@ export default { |
|
|
|
maxlength: 100, |
|
|
|
autosize: { minRows: 6, maxRows: 6 }, |
|
|
|
showWordLimit: true, |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "影响车道:", |
|
|
|
@ -159,7 +159,7 @@ export default { |
|
|
|
options: { |
|
|
|
// activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", |
|
|
|
options: LaneOccupancyList, |
|
|
|
gap: "12px" |
|
|
|
gap: "12px", |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -172,15 +172,14 @@ export default { |
|
|
|
// key: "weather", |
|
|
|
// type: "text", |
|
|
|
// }, |
|
|
|
] |
|
|
|
} |
|
|
|
], |
|
|
|
}; |
|
|
|
}, |
|
|
|
async created() { |
|
|
|
this.getDetails(); |
|
|
|
this.getVehicleTypeList(); |
|
|
|
}, |
|
|
|
async mounted() { |
|
|
|
}, |
|
|
|
async mounted() { }, |
|
|
|
beforeDestroy() { |
|
|
|
clearInterval(this.interval); |
|
|
|
}, |
|
|
|
@ -189,21 +188,21 @@ export default { |
|
|
|
if (vehicleTypeList.length) return; |
|
|
|
|
|
|
|
request({ |
|
|
|
url: `/system/dict/data/type/${'sys_vehicle_type'}`, |
|
|
|
url: `/system/dict/data/type/${"sys_vehicle_type"}`, |
|
|
|
method: "GET", |
|
|
|
params: {} |
|
|
|
params: {}, |
|
|
|
}) |
|
|
|
.then(({ data, code }) => { |
|
|
|
if (code != 200) return Message.error("详情获取失败"); |
|
|
|
|
|
|
|
vehicleTypeList = this.formList[5].options.options = data.map(item => ({ |
|
|
|
key: item.dictValue, |
|
|
|
label: item.dictLabel |
|
|
|
})) |
|
|
|
vehicleTypeList = this.formList[5].options.options = data.map( |
|
|
|
(item) => ({ |
|
|
|
key: item.dictValue, |
|
|
|
label: item.dictLabel, |
|
|
|
}) |
|
|
|
); |
|
|
|
}) |
|
|
|
.catch((err) => { |
|
|
|
|
|
|
|
}); |
|
|
|
.catch((err) => { }); |
|
|
|
}, |
|
|
|
convertSecToHHmmss(sec) { |
|
|
|
let currentTime = moment.duration(sec, "seconds"); |
|
|
|
@ -218,8 +217,8 @@ export default { |
|
|
|
url: `/perceivedEvents/warning/getWarningById`, |
|
|
|
method: "POST", |
|
|
|
data: { |
|
|
|
id: this.dialogData.id |
|
|
|
} |
|
|
|
id: this.dialogData.id, |
|
|
|
}, |
|
|
|
}) |
|
|
|
.then(({ data, code }) => { |
|
|
|
if (code != 200) return Message.error("详情获取失败"); |
|
|
|
@ -254,23 +253,30 @@ export default { |
|
|
|
// "latitude": "36.291145" |
|
|
|
// }; |
|
|
|
data.duration = this.convertSecToHHmmss(data.duration); |
|
|
|
this.data = { ...data, roadName: null, lane: data.lane?.split(",") || [] }; |
|
|
|
this.data = { |
|
|
|
...data, |
|
|
|
roadName: null, |
|
|
|
lane: data.lane?.split(",") || [], |
|
|
|
}; |
|
|
|
|
|
|
|
this.formList[4].options.options = WarningSubclassList[data.warningType] || []; |
|
|
|
this.formList[5].options.options = |
|
|
|
WarningSubclassList[data.warningType] || []; |
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
|
this.$refs.FormConfigRef.reset(true); |
|
|
|
}); |
|
|
|
this.data.direction = DirectionTypes[this.data.direction]; |
|
|
|
this.data.duration = getDuration(this.data.warningTime); |
|
|
|
this.interval = setInterval(() => { this.data.duration = getDuration(this.data.warningTime); }, 1000) |
|
|
|
this.interval = setInterval(() => { |
|
|
|
this.data.duration = getDuration(this.data.warningTime); |
|
|
|
}, 1000); |
|
|
|
}) |
|
|
|
.catch((e) => { |
|
|
|
Message.error("详情获取失败" + e); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}) |
|
|
|
}); |
|
|
|
}, |
|
|
|
updateEvent() { |
|
|
|
this.btnLoading = true; |
|
|
|
@ -293,8 +299,8 @@ export default { |
|
|
|
warningSubclass: this.data.warningSubclass, |
|
|
|
// vehicleType: this.data.vehicleType, |
|
|
|
remark: this.data.remark, |
|
|
|
lane: this.data.lane.join(",") |
|
|
|
} |
|
|
|
lane: this.data.lane.join(","), |
|
|
|
}, |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
Message.success("提交成功"); |
|
|
|
@ -304,13 +310,13 @@ export default { |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.btnLoading = false; |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang='scss' scoped> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.PerceiveEvent { |
|
|
|
width: 870px; |
|
|
|
color: #fff; |
|
|
|
|
hui
11 months ago