|
|
@ -3,17 +3,36 @@ |
|
|
|
<div class="PerceiveEvent"> |
|
|
|
<!-- <Video class="item-video" /> --> |
|
|
|
<div class="video-pic"> |
|
|
|
<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" /> |
|
|
|
<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" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<LineChart class="chart" /> |
|
|
|
<Form class="form" v-loading="loading" v-model="data" ref="FormConfigRef" :formList="formList" column="1" /> |
|
|
|
<Form |
|
|
|
class="form" |
|
|
|
v-loading="loading" |
|
|
|
v-model="data" |
|
|
|
ref="FormConfigRef" |
|
|
|
:formList="formList" |
|
|
|
column="1" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
|
|
|
|
<template #footer> |
|
|
|
{{ WarningTypeList }} |
|
|
|
<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> |
|
|
@ -21,25 +40,25 @@ |
|
|
|
|
|
|
|
<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 } from "@screen/utils/enum.js"; |
|
|
|
// import { getRoadInfoByStakeMark, getProduct } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js" |
|
|
|
import { dialogDelayVisible } from "./../mixin" |
|
|
|
import { LaneOccupancyList } from "@screen/utils/enum.js" |
|
|
|
import { dialogDelayVisible } from "./../mixin"; |
|
|
|
import { LaneOccupancyList } from "@screen/utils/enum.js"; |
|
|
|
|
|
|
|
let vehicleTypeList = []; |
|
|
|
|
|
|
|
// 感知事件 |
|
|
|
export default { |
|
|
|
name: 'PerceiveEvent', |
|
|
|
name: "PerceiveEvent", |
|
|
|
mixins: [dialogDelayVisible], |
|
|
|
components: { |
|
|
|
Dialog, |
|
|
@ -48,12 +67,12 @@ export default { |
|
|
|
LineChart, |
|
|
|
Video, |
|
|
|
Carousel, |
|
|
|
Form |
|
|
|
Form, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
loading: true, |
|
|
|
activeName: 'first', |
|
|
|
activeName: "first", |
|
|
|
deviceControlVisible: false, |
|
|
|
btnLoading: false, |
|
|
|
data: { |
|
|
@ -80,7 +99,7 @@ export default { |
|
|
|
label: "事件来源:", |
|
|
|
key: "warningSource", |
|
|
|
type: "text", |
|
|
|
enum: "InfoWarningSource" |
|
|
|
enum: "InfoWarningSource", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "事件类型:", |
|
|
@ -88,21 +107,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[4].options.options = |
|
|
|
WarningSubclassList[value] || []; |
|
|
|
data.warningSubclass = null; |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "细分类型:", |
|
|
|
key: "warningSubclass", |
|
|
|
type: "select", |
|
|
|
options: { |
|
|
|
options: [] |
|
|
|
options: [], |
|
|
|
}, |
|
|
|
}, |
|
|
|
// { |
|
|
@ -121,7 +141,7 @@ export default { |
|
|
|
maxlength: 100, |
|
|
|
autosize: { minRows: 6, maxRows: 6 }, |
|
|
|
showWordLimit: true, |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "影响车道:", |
|
|
@ -130,7 +150,7 @@ export default { |
|
|
|
options: { |
|
|
|
// activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", |
|
|
|
options: LaneOccupancyList, |
|
|
|
gap: "12px" |
|
|
|
gap: "12px", |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
@ -143,8 +163,8 @@ export default { |
|
|
|
key: "weather", |
|
|
|
type: "text", |
|
|
|
}, |
|
|
|
] |
|
|
|
} |
|
|
|
], |
|
|
|
}; |
|
|
|
}, |
|
|
|
async created() { |
|
|
|
this.getDetails(); |
|
|
@ -155,21 +175,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"); |
|
|
@ -184,8 +204,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("详情获取失败"); |
|
|
@ -220,9 +240,14 @@ 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[4].options.options = |
|
|
|
WarningSubclassList[data.warningType] || []; |
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
|
this.$refs.FormConfigRef.reset(true); |
|
|
@ -233,7 +258,7 @@ export default { |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}) |
|
|
|
}); |
|
|
|
}, |
|
|
|
updateEvent() { |
|
|
|
this.btnLoading = true; |
|
|
@ -256,8 +281,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("提交成功"); |
|
|
@ -267,13 +292,13 @@ export default { |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.btnLoading = false; |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang='scss' scoped> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.PerceiveEvent { |
|
|
|
width: 870px; |
|
|
|
color: #fff; |
|
|
|