Browse Source

预案

wangqin
zhoule 1 year ago
parent
commit
e8a851589d
  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

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

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

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

Loading…
Cancel
Save