mengff
/
jihe-hs
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

预案

wangqin
zhoule 11 months ago
parent
5b46a7c79f
commit
e8a851589d
2 changed files with 689 additions and 709 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 492
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/plan/addAndEditDialog/index.vue
  2. 26
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/plan/formTable/index.vue

492
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/plan/addAndEditDialog/index.vue
View File

@ -4,65 +4,35 @@
<ElForm :model="formData" inline :rules="rules" ref="ruleForm"> <ElForm :model="formData" inline :rules="rules" ref="ruleForm">
<div class="first"> <div class="first">
<el-form-item prop="eventCategory"> <el-form-item prop="eventCategory">
<el-radio-group <el-radio-group v-model="formData.eventCategory" @input="changeRadio">
v-model="formData.eventCategory"
@input="changeRadio"
>
<el-radio-button :label="1">交通事件</el-radio-button> <el-radio-button :label="1">交通事件</el-radio-button>
<el-radio-button :label="2">感知事件</el-radio-button> <el-radio-button :label="2">感知事件</el-radio-button>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item required label="预案名称:" prop="planName"> <el-form-item required label="预案名称:" prop="planName">
<el-input <el-input v-model="formData.planName" placeholder="请输入预案名称"></el-input>
v-model="formData.planName"
placeholder="请输入预案名称"
></el-input>
</el-form-item> </el-form-item>
<el-form-item required label="事件类型:" prop="eventType"> <el-form-item required label="事件类型:" prop="eventType">
<el-select <el-select v-model="formData.eventType" placeholder="请选择事件类型" @change="changeEventType">
v-model="formData.eventType" <el-option v-for="item in eventOptions" :key="item.value" :label="item.label"
placeholder="请选择事件类型" :value="item.value">
@change="changeEventType"
>
<el-option
v-for="item in eventOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
v-if=" v-if="(formData.eventCategory == 1 && formData.eventType !== 8) || formData.eventCategory == 2"
(formData.eventCategory == 1 && formData.eventType !== 8) || label="触发类型:" prop="triggerMechanism">
formData.eventCategory == 2
"
label="触发类型:"
prop="triggerMechanism"
>
<el-select <el-select
v-if=" v-if="(formData.eventCategory == 1 && formData.eventType !== 6) || formData.eventCategory == 2"
(formData.eventCategory == 1 && formData.eventType !== 6) || v-model="formData.triggerMechanism" placeholder="请选择触发类型">
formData.eventCategory == 2 <el-option v-for="item in mechanismOptions" :key="item.value" :label="item.label"
" :value="item.value">
v-model="formData.triggerMechanism"
placeholder="请选择触发类型"
>
<el-option
v-for="item in mechanismOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option> </el-option>
</el-select> </el-select>
<el-select <el-select v-if="formData.eventCategory == 1 && formData.eventType == 6"
v-if="formData.eventCategory == 1 && formData.eventType == 6" v-model="formData.triggerMechanism" placeholder="请选择触发类型">
v-model="formData.triggerMechanism"
placeholder="请选择触发类型"
>
<el-option-group label="主线"> <el-option-group label="主线">
<el-option label="主线封闭" value="1"></el-option> <el-option label="主线封闭" value="1"></el-option>
<el-option label="主线限行" value="2"></el-option> <el-option label="主线限行" value="2"></el-option>
@ -80,6 +50,7 @@
<el-option label="服务区限行" value="8"></el-option> <el-option label="服务区限行" value="8"></el-option>
</el-option-group> </el-option-group>
</el-select> </el-select>
</el-form-item> </el-form-item>
</div> </div>
@ -89,10 +60,7 @@
<div class="text">执行操作:</div> <div class="text">执行操作:</div>
</el-col> </el-col>
<el-col :span="22"> <el-col :span="22">
<FormTable <FormTable ref="secondFormTable" :tableData="secondFormData"></FormTable>
ref="secondFormTable"
:tableData="secondFormData"
></FormTable>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -102,10 +70,7 @@
<div class="text">恢复操作:</div> <div class="text">恢复操作:</div>
</el-col> </el-col>
<el-col :span="22"> <el-col :span="22">
<FormTable <FormTable ref="thirdFormTable" :tableData="thirdFormData"></FormTable>
ref="thirdFormTable"
:tableData="thirdFormData"
></FormTable>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -113,324 +78,317 @@
</div> </div>
<template #footer> <template #footer>
<Button <Button style="background: #C9C9C9;padding:0 24px;"
style="background: #c9c9c9; padding: 0 24px" @click.native="modelVisible = false, submitting = false">取消</Button>
@click.native="(modelVisible = false), (submitting = false)" <Button style="padding:0 24px;" @click.native="handleSubmit" :loading="submitting">保存</Button>
>取消</Button
>
<Button
style="padding: 0 24px"
@click.native="handleSubmit"
:loading="submitting"
>保存</Button
>
</template> </template>
</Dialog> </Dialog>
</template> </template>
<script> <script>
import Dialog from "@screen/components/Dialog/index"; import Dialog from "@screen/components/Dialog/index";
import Form from "@screen/components/FormConfig"; import Form from '@screen/components/FormConfig';
import FormTable from "../formTable/index"; import FormTable from '../formTable/index';
import Button from "@screen/components/Buttons/Button.vue"; import Button from '@screen/components/Buttons/Button.vue';
import request from "@/utils/request"; import request from '@/utils/request';
import { Message } from "element-ui"; import { Message } from "element-ui";
import { throttle } from "lodash"
const optionsMap = { const optionsMap = {
1: { 1: {
1: [ 1: [
{ {
value: 1, value: 1,
label: "雨", label: '雨'
}, },
{ {
value: 2, value: 2,
label: "雪", label: '雪'
}, },
{ {
value: 3, value: 3,
label: "雾", label: '雾'
}, },
{ {
value: 4, value: 4,
label: "大风", label: '大风'
}, },
{ {
value: 5, value: 5,
label: "低温寒潮", label: '低温寒潮'
}, },
{ {
value: 6, value: 6,
label: "路面积雪", label: '路面积雪'
}, },
{ {
value: 7, value: 7,
label: "路面结冰", label: '路面结冰'
}, },
{ {
value: 8, value: 8,
label: "路面积水", label: '路面积水'
}, },
{ {
value: 9, value: 9,
label: "其他", label: '其他'
}, }
], ],
2: [ 2: [
{ {
value: 1, value: 1,
label: "侧翻", label: '侧翻'
}, },
{ {
value: 2, value: 2,
label: "撞障碍物", label: '撞障碍物'
}, },
{ {
value: 3, value: 3,
label: "货物洒落", label: '货物洒落'
}, },
{ {
value: 4, value: 4,
label: "撞护栏", label: '撞护栏'
}, },
{ {
value: 5, value: 5,
label: "自燃", label: '自燃'
}, },
{ {
value: 6, value: 6,
label: "追尾", label: '追尾'
}, }
], ],
3: [ 3: [
{ {
value: 1, value: 1,
label: "行人", label: '行人'
}, },
{ {
value: 2, value: 2,
label: "非机动车", label: '非机动车'
}, },
{ {
value: 3, value: 3,
label: "摩托车", label: '摩托车'
}, },
{ {
value: 4, value: 4,
label: "其他", label: '其他'
}, }
], ],
4: [ 4: [
{ {
value: 1, value: 1,
label: "高速主线", label: '高速主线'
}, },
{ {
value: 2, value: 2,
label: "服务区", label: '服务区'
}, },
{ {
value: 3, value: 3,
label: "立交桥", label: '立交桥'
}, },
{ {
value: 4, value: 4,
label: "收费站", label: '收费站'
}, }
], ],
5: [ 5: [
{ {
value: 1, value: 1,
label: "道路拥堵", label: '道路拥堵'
}, },
{ {
value: 2, value: 2,
label: "立交拥堵", label: '立交拥堵'
}, },
{ {
value: 3, value: 3,
label: "收费站拥堵", label: '收费站拥堵'
}, },
{ {
value: 4, value: 4,
label: "收费站服务区拥堵", label: '收费站服务区拥堵'
}, }
],
6: [
], ],
6: [],
7: [ 7: [
{ {
value: 1, value: 1,
label: "封闭、暂停营业", label: '封闭、暂停营业'
}, },
{ {
value: 2, value: 2,
label: "重要设施停用", label: '重要设施停用'
}, },
{ {
value: 3, value: 3,
label: "其他异常", label: '其他异常'
}, }
], ],
8: [], 8: [],
9: [ 9: [
{ {
value: 1, value: 1,
label: "烟雾", label: '烟雾'
}, },
{ {
value: 2, value: 2,
label: "倒伏树木", label: '倒伏树木'
}, },
{ {
value: 3, value: 3,
label: "洒落物", label: '洒落物'
}, },
{ {
value: 4, value: 4,
label: "动物", label: '动物'
}, },
{ {
value: 5, value: 5,
label: "其他", label: '其他'
}, }
], ]
}, },
2: { 2: {
1: [ 1: [{
{
value: 1, value: 1,
label: "雾", label: '雾'
}, }],
],
2: [], 2: [],
3: [], 3: [],
4: [], 4: [],
5: [], 5: [],
6: [], 6: [],
7: [], 7: [],
}, }
}; };
export default { export default {
name: "addAndEditDialog", name: 'addAndEditDialog',
components: { components: {
Dialog, Dialog,
Form, Form,
Button, Button,
FormTable, FormTable
}, },
model: { model: {
prop: "visible", prop: 'visible',
event: "close", event: 'close'
},
provide() {
return {
loadData: throttle(this.loadData, 1000)
}
}, },
props: { props: {
visible: Boolean, visible: Boolean,
detail: { detail: {
type: Object, type: Object,
default: () => {}, default: () => { }
}, }
}, },
data() { data() {
return { return {
title: "新增预案", title: '新增预案',
dialogType: 1, dialogType: 1,
planId: 0, planId: 0,
submitting: false, submitting: false,
formData: { formData: {
eventCategory: 1, eventCategory: 1,
eventType: 1, eventType: 1,
triggerMechanism: 1, triggerMechanism: 1
}, },
secondFormData: [ secondFormData: [{
{
deviceType: 1, deviceType: 1,
searchRule: 1, searchRule: 1,
qbb: "", qbb: ''
}, }],
], thirdFormData: [{
thirdFormData: [
{
deviceType: 1, deviceType: 1,
searchRule: 1, searchRule: 1,
qbb: "", qbb: ''
}, }],
], deviceData: [],
eventOptions: [ eventOptions: [
{ {
value: 1, value: 1,
label: "异常天气", label: '异常天气'
}, },
{ {
value: 2, value: 2,
label: "交通事故", label: '交通事故'
}, },
{ {
value: 3, value: 3,
label: "非法上路", label: '非法上路'
}, },
{ {
value: 4, value: 4,
label: "车辆故障", label: '车辆故障'
}, },
{ {
value: 5, value: 5,
label: "交通拥堵", label: '交通拥堵'
}, },
{ {
value: 6, value: 6,
label: "交通管制", label: '交通管制'
}, },
{ {
value: 7, value: 7,
label: "服务区异常", label: '服务区异常'
}, },
{ {
value: 8, value: 8,
label: "施工建设", label: '施工建设'
}, },
{ {
value: 9, value: 9,
label: "路障清除", label: '路障清除'
}, }
], ],
mechanismOptions: [ mechanismOptions: [{
{
value: 1, value: 1,
label: "雨", label: '雨'
}, },
{ {
value: 2, value: 2,
label: "雪", label: '雪'
}, },
{ {
value: 3, value: 3,
label: "雾", label: '雾'
}, },
{ {
value: 4, value: 4,
label: "大风", label: '大风'
}, },
{ {
value: 5, value: 5,
label: "低温寒潮", label: '低温寒潮'
}, },
{ {
value: 6, value: 6,
label: "路面积雪", label: '路面积雪'
}, },
{ {
value: 7, value: 7,
label: "路面结冰", label: '路面结冰'
}, },
{ {
value: 8, value: 8,
label: "路面积水", label: '路面积水'
}, },
{ {
value: 9, value: 9,
label: "其他", label: '其他'
}, }],
],
conditionOptions: [ conditionOptions: [
// { // {
// value: 1, // value: 1,
@ -438,41 +396,57 @@ export default {
// }, // },
{ {
value: 1, value: 1,
label: "小于(<)", label: '小于(<)'
}, },
], ],
rules: { rules: {
planName: [{ required: true, message: "请输入预案名称" }], planName: [
{ required: true, message: '请输入预案名称', trigger: 'blur' },
],
eventType: [ eventType: [
{ required: true, message: "请选择事件类型", trigger: "change" }, { required: true, message: '请选择事件类型', trigger: 'change' }
], ],
}
}
}, },
}; mounted() {
}, },
mounted() {},
computed: { computed: {
modelVisible: { modelVisible: {
get() { get() {
if (this.visible) { if (this.visible) {
if (Object.keys(this.detail).length > 0) { if (Object.keys(this.detail).length > 0) {
this.title = "修改预案"; this.title = '修改预案';
this.dialogType = 2; this.dialogType = 2;
this.initData(this.detail.id); this.initData(this.detail.id);
} else { } else {
this.title = "新增预案"; this.title = '新增预案';
this.dialogType = 1; this.dialogType = 1;
this.formData = { this.formData = {
eventCategory: 1, eventCategory: 1,
eventType: 1, eventType: 1,
triggerMechanism: 1, triggerMechanism: 1
}; }
this.secondFormData = [{
deviceType: 1,
searchRule: 1,
qbb: ''
}];
this.thirdFormData = [{
deviceType: 1,
searchRule: 1,
qbb: ''
}];
} }
} }
return this.visible; return this.visible;
}, },
set(val) { set(val) {
this.$emit("close", val); this.$emit('close', val)
}, }
}, },
}, },
methods: { methods: {
@ -480,8 +454,7 @@ export default {
request({ request({
url: `/business/plans/list/${id}`, url: `/business/plans/list/${id}`,
method: "get", method: "get",
}) }).then((result) => {
.then((result) => {
if (result.code != 200) return Message.error(result?.msg); if (result.code != 200) return Message.error(result?.msg);
let data = result.data; let data = result.data;
let dcExecuteAction = result.data.dcExecuteAction; let dcExecuteAction = result.data.dcExecuteAction;
@ -492,217 +465,222 @@ export default {
planName: data.planName, planName: data.planName,
eventType: data.eventType, eventType: data.eventType,
triggerMechanism: data.triggerMechanism, triggerMechanism: data.triggerMechanism,
}; }
this.secondFormData = []; this.secondFormData = [];
this.thirdFormData = []; this.thirdFormData = [];
dcExecuteAction.forEach((it) => { dcExecuteAction.forEach(it => {
if (it.deviceList) { if (it.deviceList) {
it.deviceList = it.deviceList.split(","); it.deviceList = it.deviceList.split(',');
} }
if (it.actionType == 1) { if (it.actionType == 1) {
this.secondFormData.push(it); this.secondFormData.push(it);
} else if (it.actionType == 2) { } else if (it.actionType == 2) {
this.thirdFormData.push(it); this.thirdFormData.push(it);
} }
});
}) })
.catch((err) => {
console.log(err); }).catch((err) => {
console.log(err)
Message.error("查询事件预案列表失败", err); Message.error("查询事件预案列表失败", err);
}); })
},
async loadData() {
if (this.deviceData.length <= 0) {
let result = await request({
url: `business/device/query?deviceType=2`,
method: "get",
})
if (result.code != 200) return Message.error(result?.msg);
console.log('123');
this.deviceData = result.data;
// return result.data;
}
return this.deviceData;
}, },
changeEventType(value = 1) { changeEventType(value = 1) {
this.mechanismOptions = this.mechanismOptions = optionsMap[this.formData.eventCategory || 1][value];
optionsMap[this.formData.eventCategory || 1][value];
}, },
changeRadio(value = 1) { changeRadio(value = 1) {
const optionsMap = { const optionsMap = {
1: [ 1: [{
{
value: 1, value: 1,
label: "异常天气", label: '异常天气'
}, },
{ {
value: 2, value: 2,
label: "交通事故", label: '交通事故'
}, },
{ {
value: 3, value: 3,
label: "非法上路", label: '非法上路'
}, },
{ {
value: 4, value: 4,
label: "车辆故障", label: '车辆故障'
}, },
{ {
value: 5, value: 5,
label: "交通拥堵", label: '交通拥堵'
}, },
{ {
value: 6, value: 6,
label: "交通管制", label: '交通管制'
}, },
{ {
value: 7, value: 7,
label: "服务区异常", label: '服务区异常'
}, },
{ {
value: 8, value: 8,
label: "施工建设", label: '施工建设'
}, },
{ {
value: 9, value: 9,
label: "路障清除", label: '路障清除'
}, }],
], 2: [{
2: [
{
value: 1, value: 1,
label: "异常天气", label: '异常天气'
}, },
{ {
value: 2, value: 2,
label: "拥堵", label: '拥堵'
}, },
{ {
value: 3, value: 3,
label: "非机动车", label: '非机动车'
}, },
{ {
value: 4, value: 4,
label: "行人", label: '行人'
}, },
{ {
value: 5, value: 5,
label: "烟火", label: '烟火'
}, },
{ {
value: 6, value: 6,
label: "抛洒物", label: '抛洒物'
}, },
{ {
value: 7, value: 7,
label: "逆行", label: '逆行'
}, },
], ]
}; }
this.eventOptions = optionsMap[value]; this.eventOptions = optionsMap[value];
this.changeEventType(); this.changeEventType();
}, },
handleChange() {}, handleChange() {
},
formatData(it, value = 1) { formatData(it, value = 1) {
let data = { ...it, actionType: value }; let data = { ...it, actionType: value }
if ( if (it.deviceList && typeof it.deviceList !== 'string' && it.deviceList.length > 0) {
it.deviceList && data.deviceList = it.deviceList.join(',');
typeof it.deviceList !== "string" &&
it.deviceList.length > 0
) {
data.deviceList = it.deviceList.join(",");
} else { } else {
data.deviceList = ""; data.deviceList = '';
} }
if (it.content) { if (it.content) {
data.otherConfig = JSON.stringify({ content: it.content }); data.otherConfig = JSON.stringify({ content: it.content })
} }
if (it.controlModel) { if (it.controlModel) {
let other = { let other = {
controlModel: it.controlModel, controlModel: it.controlModel,
state: it.state, state: it.state,
}; }
if (it.time && it?.time[0]) { if (it.time && it?.time[0]) {
other = { other = {
controlModel: it.controlModel, controlModel: it.controlModel,
state: it.state, state: it.state,
startTime: it.time[0], startTime: it.time[0],
endTime: it.time[1], endTime: it.time[1]
}; }
} }
data.otherConfig = JSON.stringify(other); data.otherConfig = JSON.stringify(other)
} }
if (it.gzms) { if (it.gzms) {
data.otherConfig = JSON.stringify({ data.otherConfig = JSON.stringify({
state: it.gzms, state: it.gzms,
operationDuration: it.operationDuration, operationDuration: it.operationDuration,
}); })
} }
return data; return data;
}, },
handleSubmit() { handleSubmit() {
this.$refs["ruleForm"].validate((valid) => { this.$refs['ruleForm'].validate((valid) => {
if (valid) { if (valid) {
// this.submitting = false; // this.submitting = false;
let secondFormTable = this.$refs["secondFormTable"].tableData || []; let secondFormTable = this.$refs['secondFormTable'].tableData || [];
let thirdFormTable = this.$refs["thirdFormTable"].tableData || []; let thirdFormTable = this.$refs['thirdFormTable'].tableData || [];
let dcArr = []; let dcArr = [];
secondFormTable.forEach((it) => { secondFormTable.forEach(it => {
dcArr.push(this.formatData(it, 1)); dcArr.push(this.formatData(it, 1));
}); })
thirdFormTable.forEach((it) => { thirdFormTable.forEach(it => {
dcArr.push(this.formatData(it, 2)); dcArr.push(this.formatData(it, 2));
}); })
console.log({ console.log({
...this.formData, ...this.formData,
dcExecuteAction: dcArr, dcExecuteAction: dcArr
}); })
// return; // return;
if (this.dialogType == 1) { if (this.dialogType == 1) {//新增
//新增
request({ request({
url: `/business/plans`, url: `/business/plans`,
method: "post", method: "post",
data: { data: {
...this.formData, ...this.formData,
dcExecuteAction: dcArr, dcExecuteAction: dcArr
}, }
}) }).then((result) => {
.then((result) => {
if (result.code != 200) return Message.error(result?.msg); if (result.code != 200) return Message.error(result?.msg);
Message.success("提交成功"); Message.success("提交成功");
this.modelVisible = false; this.modelVisible = false;
}) }).catch(() => {
.catch(() => {
Message.error("提交失败"); Message.error("提交失败");
}) }).finally(() => {
.finally(() => {
this.submitting = false; this.submitting = false;
this.$emit("reInitData", true); this.$emit('reInitData', true);
}); })
} else if (this.dialogType == 2) { } else if (this.dialogType == 2) {//修改
//修改
request({ request({
url: `/business/plans`, url: `/business/plans`,
method: "put", method: "put",
data: { data: {
...this.formData, ...this.formData,
id: this.planId, id: this.planId,
dcExecuteAction: dcArr, dcExecuteAction: dcArr
}, }
}) }).then((result) => {
.then((result) => {
if (result.code != 200) return Message.error(result?.msg); if (result.code != 200) return Message.error(result?.msg);
Message.success("提交成功"); Message.success("提交成功");
this.modelVisible = false; this.modelVisible = false;
}) }).catch(() => {
.catch(() => {
Message.error("提交失败"); Message.error("提交失败");
}) }).finally(() => {
.finally(() => {
this.submitting = false; this.submitting = false;
this.$emit("reInitData", true); this.$emit('reInitData', true);
}); })
}
}
})
}
} }
} }
});
},
},
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.fade-enter-active, .fade-enter-active,
.fade-leave-active { .fade-leave-active {
transition: opacity 0.24s; transition: opacity .24s;
} }
.fade-enter, .fade-enter,

26
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/plan/formTable/index.vue
View File

@ -110,6 +110,7 @@ export default {
prop: 'visible', prop: 'visible',
event: 'update:value' event: 'update:value'
}, },
inject: ['loadData'],
props: { props: {
visible: Boolean, visible: Boolean,
eventType: Number, eventType: Number,
@ -229,22 +230,23 @@ export default {
index: 1 index: 1
} }
}, },
created() { async created() {
this.initData(); let loadData = await this.loadData();
// console.log('aa',loadData)
this.sbOptions = loadData;
}, },
methods: { methods: {
initData() { initData() {
// request({
// url: `business/device/query?deviceType=2`,
// method: "get",
// }).then((result) => {
// if (result.code != 200) return Message.error(result?.msg);
// this.sbOptions = result.data;
request({ // }).catch(() => {
url: `business/device/query?deviceType=2`, // Message.error("查询可变信息标识失败");
method: "get", // })
}).then((result) => {
if (result.code != 200) return Message.error(result?.msg);
this.sbOptions = result.data;
}).catch(() => {
Message.error("查询可变信息标识失败");
})
}, },
changeDeviceType(value) { changeDeviceType(value) {

Write Preview
Loading…
Cancel
Save