|
|
|
@ -2,44 +2,63 @@ |
|
|
|
<Dialog v-model="modelVisible" title="交通事故录入"> |
|
|
|
<div class="EventDetailDialog"> |
|
|
|
<ElTabs v-model="activeName" @tab-click="handleChange"> |
|
|
|
<ElTabPane v-for="(item, index) in tabConfigList" :key="index" :label="item.label" :name="item.key" /> |
|
|
|
<ElTabPane |
|
|
|
v-for="(item, index) in tabConfigList" |
|
|
|
:key="index" |
|
|
|
:label="item.label" |
|
|
|
:name="item.key" |
|
|
|
/> |
|
|
|
</ElTabs> |
|
|
|
|
|
|
|
<Transition name="fade"> |
|
|
|
<Form class="form" ref="FormConfigRef" :formList="formConfig.list" v-bind="getFormOptions" labelWidth="120px" /> |
|
|
|
<Form |
|
|
|
class="form" |
|
|
|
ref="FormConfigRef" |
|
|
|
:formList="formConfig.list" |
|
|
|
v-bind="getFormOptions" |
|
|
|
labelWidth="120px" |
|
|
|
/> |
|
|
|
</Transition> |
|
|
|
</div> |
|
|
|
|
|
|
|
<template #footer> |
|
|
|
<Button style="background: #C9C9C9;padding:0 24px;" |
|
|
|
@click.native="modelVisible = false, submitting = false">取消</Button> |
|
|
|
<Button style="padding:0 24px;" @click.native="handleSubmit" :loading="submitting">保存</Button> |
|
|
|
<Button |
|
|
|
style="background: #c9c9c9; padding: 0 24px" |
|
|
|
@click.native="(modelVisible = false), (submitting = false)" |
|
|
|
>取消</Button |
|
|
|
> |
|
|
|
<Button |
|
|
|
style="padding: 0 24px" |
|
|
|
@click.native="handleSubmit" |
|
|
|
:loading="submitting" |
|
|
|
>保存</Button |
|
|
|
> |
|
|
|
</template> |
|
|
|
</Dialog> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import Dialog from "@screen/components/Dialog/index"; |
|
|
|
import Form from '@screen/components/FormConfig'; |
|
|
|
import Button from '@screen/components/Buttons/Button.vue'; |
|
|
|
import request from '@/utils/request' |
|
|
|
import Form from "@screen/components/FormConfig"; |
|
|
|
import Button from "@screen/components/Buttons/Button.vue"; |
|
|
|
import request from "@/utils/request"; |
|
|
|
import { Message } from "element-ui"; |
|
|
|
|
|
|
|
import { tabConfigList } from "./data.js" |
|
|
|
import { tabConfigList } from "./data.js"; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'EventDetailDialog', |
|
|
|
name: "EventDetailDialog", |
|
|
|
components: { |
|
|
|
Dialog, |
|
|
|
Form, |
|
|
|
Button |
|
|
|
Button, |
|
|
|
}, |
|
|
|
model: { |
|
|
|
prop: 'visible', |
|
|
|
event: 'close' |
|
|
|
prop: "visible", |
|
|
|
event: "close", |
|
|
|
}, |
|
|
|
props: { |
|
|
|
visible: Boolean |
|
|
|
visible: Boolean, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
@ -50,14 +69,14 @@ export default { |
|
|
|
index: 1, |
|
|
|
roads: [], |
|
|
|
direction: [], |
|
|
|
lwss: [] |
|
|
|
} |
|
|
|
lwss: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// this.formConfig = tabConfigList[0].formConfig; |
|
|
|
this.initData().then(() => { |
|
|
|
this.handleChange({ index: 0 }) |
|
|
|
}) |
|
|
|
this.handleChange({ index: 0 }); |
|
|
|
}); |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
modelVisible: { |
|
|
|
@ -65,79 +84,89 @@ export default { |
|
|
|
return this.visible; |
|
|
|
}, |
|
|
|
set(val) { |
|
|
|
this.$emit('close', val) |
|
|
|
} |
|
|
|
this.$emit("close", val); |
|
|
|
}, |
|
|
|
}, |
|
|
|
getFormOptions() { |
|
|
|
return { |
|
|
|
column: 3, |
|
|
|
...this.formConfig.formOptions |
|
|
|
} |
|
|
|
} |
|
|
|
...this.formConfig.formOptions, |
|
|
|
}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
initData() { |
|
|
|
return Promise.all([ |
|
|
|
//道路 |
|
|
|
//道路 |
|
|
|
request({ |
|
|
|
url: `/business/road/query`, |
|
|
|
method: "get", |
|
|
|
}).then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach(it => { |
|
|
|
this.roads.push({ key: it.id, label: it.roadName }) |
|
|
|
}) |
|
|
|
.then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach((it) => { |
|
|
|
this.roads.push({ key: it.id, label: it.roadName }); |
|
|
|
}); |
|
|
|
}) |
|
|
|
}).catch((err) => { |
|
|
|
Message.error("查询失败4", err); |
|
|
|
}), |
|
|
|
.catch((err) => { |
|
|
|
Message.error("查询失败4", err); |
|
|
|
}), |
|
|
|
//方向字典 |
|
|
|
request({ |
|
|
|
url: `/system/dict/data/type/iot_event_direction`, |
|
|
|
method: "get", |
|
|
|
}).then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach(it => { |
|
|
|
this.direction.push({ key: it.dictValue, label: it.dictLabel }) |
|
|
|
}) |
|
|
|
.then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach((it) => { |
|
|
|
this.direction.push({ key: it.dictValue, label: it.dictLabel }); |
|
|
|
}); |
|
|
|
}) |
|
|
|
}).catch((err) => { |
|
|
|
Message.error("查询失败5", err); |
|
|
|
}), |
|
|
|
.catch((err) => { |
|
|
|
Message.error("查询失败5", err); |
|
|
|
}), |
|
|
|
//路网设施 1 收费站 2 桥梁 3 互通立交 4 枢纽立交 5 隧道 6 服务区 |
|
|
|
request({ |
|
|
|
url: `/business/facility/query`, |
|
|
|
method: "get" |
|
|
|
}).then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach(it => this.lwss.push({ key: it.id, label: it.facilityName, type: it.facilityType })) |
|
|
|
}).catch((err) => { |
|
|
|
console.log('err', err) |
|
|
|
Message.error("查询失败6", err); |
|
|
|
method: "get", |
|
|
|
}) |
|
|
|
|
|
|
|
]) |
|
|
|
.then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
result.data.forEach((it) => |
|
|
|
this.lwss.push({ |
|
|
|
key: it.id, |
|
|
|
label: it.facilityName, |
|
|
|
type: it.facilityType, |
|
|
|
}) |
|
|
|
); |
|
|
|
}) |
|
|
|
.catch((err) => { |
|
|
|
console.log("err", err); |
|
|
|
Message.error("查询失败6", err); |
|
|
|
}), |
|
|
|
]); |
|
|
|
}, |
|
|
|
handleChange({ index }) { |
|
|
|
// console.log('index',index) |
|
|
|
this.index = index; |
|
|
|
let formConfig = tabConfigList[index].formConfig; |
|
|
|
console.log('formConfig', formConfig) |
|
|
|
formConfig.list.forEach(it => { |
|
|
|
if (it.key == 'direction') { |
|
|
|
console.log("formConfig", formConfig); |
|
|
|
formConfig.list.forEach((it) => { |
|
|
|
if (it.key == "direction") { |
|
|
|
it.options.options = this.direction; |
|
|
|
} |
|
|
|
if (it.key == 'roadId') { |
|
|
|
if (it.key == "roadId") { |
|
|
|
it.options.options = this.roads; |
|
|
|
} |
|
|
|
if (index == 7 && it.key == 'dcEventServiceArea.facilityId') { |
|
|
|
it.options.options = this.lwss.filter(ss => ss.type == 6); |
|
|
|
if (index == 7 && it.key == "dcEventServiceArea.facilityId") { |
|
|
|
it.options.options = this.lwss.filter((ss) => ss.type == 6); |
|
|
|
} |
|
|
|
// if (index == 0 || index == 1 || index == 7) { |
|
|
|
// if (it.key === 'dcEventAccident.facilityId' || it.key === 'dcEventVehicleAccident.facilityId' || it.key === 'dcEventServiceArea.facilityId') { |
|
|
|
// it.options.options = this.lwss.filter(ss => ss.type == 6); |
|
|
|
// } |
|
|
|
// } |
|
|
|
|
|
|
|
}) |
|
|
|
}); |
|
|
|
|
|
|
|
this.formConfig = formConfig; |
|
|
|
}, |
|
|
|
@ -147,13 +176,16 @@ export default { |
|
|
|
this.submitting = true; |
|
|
|
|
|
|
|
if (this.index == 0 || this.index == 1) { |
|
|
|
formData.lang = formData.lang.join(',') |
|
|
|
formData.lang = formData.lang.join(","); |
|
|
|
} else { |
|
|
|
formData.lang = '' |
|
|
|
formData.lang = ""; |
|
|
|
} |
|
|
|
if (formData.endStakeMark && formData.endStakeMark[0] != null) { |
|
|
|
let endStakeMark = formData.endStakeMark; |
|
|
|
let strMark = (endStakeMark && endStakeMark.length > 0) ? ('K' + endStakeMark[0] + '+' + endStakeMark[1]) : ''; |
|
|
|
let strMark = |
|
|
|
endStakeMark && endStakeMark.length > 0 |
|
|
|
? "K" + endStakeMark[0] + "+" + endStakeMark[1] |
|
|
|
: ""; |
|
|
|
if (this.index == 3) { |
|
|
|
formData.dcEventTrafficCongestion.endStakeMark = strMark; |
|
|
|
} |
|
|
|
@ -163,9 +195,9 @@ export default { |
|
|
|
if (this.index == 9) { |
|
|
|
formData.dcEventAbnormalWeather.endStakeMark = strMark; |
|
|
|
} |
|
|
|
formData.endStakeMark = ''; |
|
|
|
formData.endStakeMark = ""; |
|
|
|
} else { |
|
|
|
formData.endStakeMark = ''; |
|
|
|
formData.endStakeMark = ""; |
|
|
|
} |
|
|
|
let stakeMark = formData.stakeMark; |
|
|
|
// console.log('formData', { |
|
|
|
@ -185,30 +217,36 @@ export default { |
|
|
|
...formData, |
|
|
|
eventType: Number(this.index) + 1, |
|
|
|
eventState: 0, |
|
|
|
stakeMark: (stakeMark && stakeMark[0] != null) ? ((stakeMark && stakeMark.length > 0) ? ('K' + stakeMark[0] + '+' + stakeMark[1]) : '') : '', |
|
|
|
} |
|
|
|
}).then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
Message.success("提交成功"); |
|
|
|
this.modelVisible = false; |
|
|
|
}).catch(() => { |
|
|
|
Message.error("提交失败"); |
|
|
|
}).finally(() => { |
|
|
|
this.submitting = false; |
|
|
|
this.$emit('queryData', true); |
|
|
|
stakeMark: |
|
|
|
stakeMark && stakeMark[0] != null |
|
|
|
? stakeMark && stakeMark.length > 0 |
|
|
|
? "K" + stakeMark[0] + "+" + stakeMark[1] |
|
|
|
: "" |
|
|
|
: "", |
|
|
|
}, |
|
|
|
}) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.then((result) => { |
|
|
|
if (result.code != 200) return Message.error(result?.msg); |
|
|
|
Message.success("提交成功"); |
|
|
|
this.modelVisible = false; |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
Message.error("提交失败"); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.submitting = false; |
|
|
|
this.$emit("queryData", true); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
.fade-enter-active, |
|
|
|
.fade-leave-active { |
|
|
|
transition: opacity .24s; |
|
|
|
transition: opacity 0.24s; |
|
|
|
} |
|
|
|
|
|
|
|
.fade-enter, |
|
|
|
|
zhangzhang
11 months ago