qingzhengli
1 year ago
29 changed files with 2068 additions and 488 deletions
@ -0,0 +1,22 @@ |
|||||
|
import request from "@/utils/request"; |
||||
|
|
||||
|
// 查询事件气象
|
||||
|
export function WeatherForecast(lng, lat) { |
||||
|
return request({ |
||||
|
url: |
||||
|
"/weatherForecast/queryTheSpecifiedLatitudeAndLongitudeWeather/" + |
||||
|
lng + |
||||
|
"/" + |
||||
|
lat, |
||||
|
method: "get", |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
// 查询调度联络
|
||||
|
export function commandDispatch(data) { |
||||
|
return request({ |
||||
|
url: "/business/warning/commandAndDispatch", |
||||
|
method: "post", |
||||
|
data, |
||||
|
}); |
||||
|
} |
||||
@ -0,0 +1,83 @@ |
|||||
|
import * as echarts from "echarts"; |
||||
|
|
||||
|
export const StatChartOption = { |
||||
|
width: "100%", |
||||
|
height: "100%", |
||||
|
color: ["#2AD9FD"], |
||||
|
xAxis: { |
||||
|
name: "日", |
||||
|
type: "category", |
||||
|
// boundaryGap: ["15%", "15%"],
|
||||
|
nameTextStyle: { |
||||
|
color: "#2AD9FD", |
||||
|
align: "right", |
||||
|
fontSize: 15, |
||||
|
padding: [0, -15, 0, 0], |
||||
|
}, |
||||
|
boundaryGap: false, |
||||
|
data: ["1", "5", "10", "15", "20", "25", "30"], |
||||
|
axisTick: { |
||||
|
show: false, |
||||
|
}, |
||||
|
axisLabel: { |
||||
|
color: "#fff", |
||||
|
fontSize: 12, |
||||
|
}, |
||||
|
axisLine: { |
||||
|
lineStyle: { |
||||
|
color: "#668598", |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
grid: { |
||||
|
left: 50, |
||||
|
top: 10, |
||||
|
// bottom: 30,
|
||||
|
// right: 30,
|
||||
|
}, |
||||
|
tooltip: { |
||||
|
trigger: "axis", |
||||
|
valueFormatter: (value) => { |
||||
|
return value + "%"; |
||||
|
}, |
||||
|
}, |
||||
|
yAxis: { |
||||
|
max: 100, |
||||
|
type: "value", |
||||
|
splitLine: { |
||||
|
lineStyle: { |
||||
|
type: [6, 9], |
||||
|
color: "rgba(255,255,255, .3)", |
||||
|
}, |
||||
|
}, |
||||
|
axisLabel: { |
||||
|
color: "#fff", |
||||
|
fontSize: 12, |
||||
|
formatter: "{value} %", |
||||
|
}, |
||||
|
}, |
||||
|
series: [ |
||||
|
{ |
||||
|
data: [0, 90, 65, 90, 45, 36, 27], |
||||
|
type: "line", |
||||
|
showSymbol: false, |
||||
|
smooth: true, |
||||
|
lineStyle: { |
||||
|
color: "#2AD9FD", |
||||
|
}, |
||||
|
areaStyle: { |
||||
|
opacity: 0.8, |
||||
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ |
||||
|
{ |
||||
|
offset: 0, |
||||
|
color: "rgb(90, 227, 255, .9)", |
||||
|
}, |
||||
|
{ |
||||
|
offset: 1, |
||||
|
color: "rgba(42,217,253,0)", |
||||
|
}, |
||||
|
]), |
||||
|
}, |
||||
|
}, |
||||
|
], |
||||
|
}; |
||||
@ -0,0 +1,51 @@ |
|||||
|
<template> |
||||
|
<Card class='DeviceControl' title="设备管控"> |
||||
|
TODO |
||||
|
</Card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import Card from "@screen/components/Card2/Card.vue";; |
||||
|
|
||||
|
import { merge } from "lodash"; |
||||
|
import { provideMixin } from "./../../mixin" |
||||
|
|
||||
|
|
||||
|
|
||||
|
export default { |
||||
|
name: 'DeviceControl', |
||||
|
mixins: [provideMixin], |
||||
|
components: { |
||||
|
Card |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
data: null |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
data() { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang='scss' scoped> |
||||
|
.DeviceControl { |
||||
|
::v-deep { |
||||
|
.content { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,207 @@ |
|||||
|
export function getQuadrant(angle) { |
||||
|
angle %= 360.0; |
||||
|
if (angle < 0) angle += 360.0; |
||||
|
var quadrant = Math.floor(angle / 90) + 1; |
||||
|
return quadrant; |
||||
|
} |
||||
|
|
||||
|
export function calcPoint(x0, y0, width, height, angle) { |
||||
|
const parseAngle = parseFloat(angle); |
||||
|
|
||||
|
angle = (Math.PI / 180) * parseFloat(parseAngle); |
||||
|
|
||||
|
x0 += width / 2; |
||||
|
y0 += height / 2; |
||||
|
|
||||
|
const hypotenuse = width / 2 > height / 2 ? width / 2 : height / 2; |
||||
|
|
||||
|
// 对边
|
||||
|
let oppositeEdge = Math.abs(hypotenuse * Math.sin(angle)); |
||||
|
|
||||
|
// 邻边
|
||||
|
let adjacentEdge = Math.abs(hypotenuse * Math.cos(angle)); |
||||
|
|
||||
|
let point0 = [], |
||||
|
point1 = []; |
||||
|
|
||||
|
switch (parseFloat(parseAngle) % 360.0) { |
||||
|
case 180: |
||||
|
oppositeEdge = adjacentEdge; |
||||
|
adjacentEdge = 0; |
||||
|
break; |
||||
|
case 90: |
||||
|
case 270: |
||||
|
adjacentEdge = oppositeEdge; |
||||
|
oppositeEdge = 0; |
||||
|
break; |
||||
|
} |
||||
|
|
||||
|
switch (getQuadrant(parseAngle)) { |
||||
|
case 1: |
||||
|
point0 = [x0 - adjacentEdge, y0 + oppositeEdge]; |
||||
|
point1 = [x0 + adjacentEdge, y0 - oppositeEdge]; |
||||
|
break; |
||||
|
case 2: |
||||
|
point0 = [x0 - adjacentEdge, y0 - oppositeEdge]; |
||||
|
point1 = [x0 + adjacentEdge, y0 + oppositeEdge]; |
||||
|
break; |
||||
|
case 3: |
||||
|
point0 = [x0 + adjacentEdge, y0 - oppositeEdge]; |
||||
|
point1 = [x0 - adjacentEdge, y0 + oppositeEdge]; |
||||
|
break; |
||||
|
case 4: |
||||
|
point0 = [x0 + adjacentEdge, y0 + oppositeEdge]; |
||||
|
point1 = [x0 - adjacentEdge, y0 - oppositeEdge]; |
||||
|
break; |
||||
|
} |
||||
|
|
||||
|
return angle > 0 ? [point0, point1] : [point1, point0]; |
||||
|
} |
||||
|
|
||||
|
export class CanvasFlow { |
||||
|
canvas = null; |
||||
|
context = null; |
||||
|
zoom = 3; |
||||
|
constructor(canvas) { |
||||
|
this.canvas = canvas; |
||||
|
this.context = canvas.getContext("2d"); |
||||
|
|
||||
|
this.canvas.width = canvas.clientWidth * this.zoom; |
||||
|
this.canvas.height = canvas.clientHeight * this.zoom; |
||||
|
} |
||||
|
|
||||
|
drawRectangle({ |
||||
|
x, |
||||
|
y, |
||||
|
width, |
||||
|
height, |
||||
|
borderWidth, |
||||
|
borderColor, |
||||
|
backgroundColor, |
||||
|
radius, |
||||
|
}) { |
||||
|
this.context.beginPath(); |
||||
|
|
||||
|
if (backgroundColor) this.context.fillStyle = backgroundColor; |
||||
|
|
||||
|
x *= this.zoom; |
||||
|
y *= this.zoom; |
||||
|
width *= this.zoom; |
||||
|
height *= this.zoom; |
||||
|
|
||||
|
if (radius) { |
||||
|
this.context.roundRect(x, y, width, height, radius); |
||||
|
this.context.fill(); |
||||
|
} else { |
||||
|
this.context.fillRect(x, y, width, height); |
||||
|
} |
||||
|
|
||||
|
if (typeof borderWidth === "number") { |
||||
|
borderWidth *= this.zoom; |
||||
|
|
||||
|
this.context.lineWidth = borderWidth; |
||||
|
this.context.strokeStyle = borderColor; |
||||
|
|
||||
|
this.context.stroke(); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
transformCssLinearGradient(x, y, width, height, linearGradient) { |
||||
|
const [_, deg, ...stopStrings] = linearGradient.match(/[^,()]+/g); |
||||
|
|
||||
|
const stops = stopStrings.map((stop) => { |
||||
|
const [color, offset] = stop.trim().split(" "); |
||||
|
|
||||
|
return { |
||||
|
color, |
||||
|
offset: parseFloat(offset) * 0.01, |
||||
|
}; |
||||
|
}); |
||||
|
|
||||
|
const [point0, point1] = calcPoint(x, y, width, height, deg); |
||||
|
|
||||
|
return [ |
||||
|
{ |
||||
|
x0: point0[0], |
||||
|
y0: point0[1], |
||||
|
x1: point1[0], |
||||
|
y1: point1[1], |
||||
|
}, |
||||
|
stops, |
||||
|
]; |
||||
|
} |
||||
|
|
||||
|
setLinearGradient({ x0, y0, x1, y1 }, stops) { |
||||
|
x0 *= this.zoom; |
||||
|
x1 *= this.zoom; |
||||
|
y0 *= this.zoom; |
||||
|
y1 *= this.zoom; |
||||
|
|
||||
|
const gradient = this.context.createLinearGradient(x0, y0, x1, y1); |
||||
|
|
||||
|
stops.forEach(({ offset, color }) => { |
||||
|
gradient.addColorStop(offset, color); |
||||
|
}); |
||||
|
|
||||
|
this.context.fillStyle = gradient; |
||||
|
} |
||||
|
|
||||
|
drawLine({ x, y, color, lineWidth = 1 }, vertices) { |
||||
|
x *= this.zoom; |
||||
|
y *= this.zoom; |
||||
|
|
||||
|
this.context.beginPath(); |
||||
|
|
||||
|
this.context.moveTo(x, y); |
||||
|
|
||||
|
vertices.forEach(({ x, y }) => { |
||||
|
this.context.lineTo(x * this.zoom, y * this.zoom); |
||||
|
}); |
||||
|
|
||||
|
this.context.strokeStyle = color; |
||||
|
|
||||
|
this.context.lineWidth = lineWidth; |
||||
|
|
||||
|
this.context.stroke(); |
||||
|
} |
||||
|
|
||||
|
fillText( |
||||
|
text, |
||||
|
{ |
||||
|
x, |
||||
|
y, |
||||
|
fontSize = 15, |
||||
|
color, |
||||
|
align = "center", |
||||
|
fontWeight = "normal", |
||||
|
fontFamily = "微软雅黑", |
||||
|
} = {}, |
||||
|
{ width: rectWidth = 0, height: rectHeight = 0 } = {} |
||||
|
) { |
||||
|
this.context.beginPath(); |
||||
|
|
||||
|
this.context.font = `${fontWeight} ${fontSize * this.zoom}px ${fontFamily}`; |
||||
|
|
||||
|
this.context.textBaseline = "middle"; |
||||
|
|
||||
|
const textWidth = this.context.measureText(text).width; |
||||
|
|
||||
|
x *= this.zoom; |
||||
|
|
||||
|
switch (align) { |
||||
|
case "center": |
||||
|
x += (rectWidth * this.zoom - textWidth) / 2; |
||||
|
|
||||
|
y += rectHeight / 2; |
||||
|
break; |
||||
|
} |
||||
|
|
||||
|
this.context.fillStyle = color; |
||||
|
|
||||
|
this.context.fillText(text, x, y * this.zoom); |
||||
|
} |
||||
|
|
||||
|
clear() { |
||||
|
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,187 @@ |
|||||
|
<template> |
||||
|
<Dialog v-model="modelVisible" title="智能调度" width="1200px"> |
||||
|
<div class="StatsDetail"> |
||||
|
<el-form ref="form" :model="form"> |
||||
|
<el-table :data="data"> |
||||
|
<el-table-column |
||||
|
prop="organizationName" |
||||
|
label="路管驻点" |
||||
|
width="180" |
||||
|
align="center" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
<el-table-column |
||||
|
prop="difference" |
||||
|
label="距离" |
||||
|
width="180" |
||||
|
align="center" |
||||
|
> |
||||
|
<template slot-scope="scope"> |
||||
|
<span>{{ scope.row.difference }}公里</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="人员" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-checkbox-group v-model="form.personnel"> |
||||
|
<el-checkbox |
||||
|
v-for="item in scope.row.shiftsMap" |
||||
|
:label="item.shiftsName" |
||||
|
></el-checkbox> |
||||
|
</el-checkbox-group> |
||||
|
<!-- <span v-for="item in scope.row.shiftsMap"> |
||||
|
{{ item.shiftsName }}</span |
||||
|
> --> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="车辆" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-checkbox-group v-model="form.vehicle"> |
||||
|
<el-checkbox |
||||
|
v-for="item in scope.row.vehiclesMap" |
||||
|
:label="item.vehiclePlate + ' -' + item.vehicleText" |
||||
|
></el-checkbox> |
||||
|
</el-checkbox-group> |
||||
|
<!-- <span v-for="item in scope.row.vehiclesMap"> |
||||
|
{{ item.vehiclePlate }}</span |
||||
|
> --> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<template #footer> |
||||
|
<Button |
||||
|
style="background-color: rgba(0, 179, 204, 0.3)" |
||||
|
@click.native="(modelVisible = false), (submitting = false)" |
||||
|
> |
||||
|
取消 |
||||
|
</Button> |
||||
|
<Button @click.native="handleSubmit" :loading="submitting"> 确定 </Button> |
||||
|
</template> |
||||
|
</Dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import Dialog from "@screen/components/Dialog/index"; |
||||
|
import InputSearch from "@screen/components/InputSearch/index.vue"; |
||||
|
import Table from "@screen/components/Table.vue"; |
||||
|
import { selectTollStation } from "@/api/event/governanceAnalysis"; |
||||
|
import request from "@/utils/request"; |
||||
|
import Button from "@screen/components/Buttons/Button.vue"; |
||||
|
export default { |
||||
|
name: "StatsDetail", |
||||
|
components: { |
||||
|
Dialog, |
||||
|
InputSearch, |
||||
|
Table, |
||||
|
Button, |
||||
|
}, |
||||
|
model: { |
||||
|
prop: "visible", |
||||
|
event: "update:value", |
||||
|
}, |
||||
|
props: { |
||||
|
visible: Boolean, |
||||
|
data: Array, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
form: { personnel: [], vehicle: [] }, |
||||
|
}; |
||||
|
}, |
||||
|
computed: { |
||||
|
modelVisible: { |
||||
|
get() { |
||||
|
return this.visible; |
||||
|
}, |
||||
|
set(val) { |
||||
|
this.$emit("update:value", val); |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
handleSubmit() {}, |
||||
|
}, |
||||
|
mounted() {}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.dialog { |
||||
|
min-height: 800px; |
||||
|
} |
||||
|
|
||||
|
.search { |
||||
|
display: flex; |
||||
|
flex-direction: row-reverse; |
||||
|
} |
||||
|
|
||||
|
::v-deep .is-scrolling-none { |
||||
|
background: #0b6581; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table__empty-text { |
||||
|
color: #3ae0f8; |
||||
|
} |
||||
|
|
||||
|
.StatsDetail { |
||||
|
// height: 770px; |
||||
|
margin: 20px 0; |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
gap: 5px; |
||||
|
} |
||||
|
|
||||
|
.el-table { |
||||
|
border: 1px solid #07aec6; |
||||
|
background: #0b6581; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table .el-table__header-wrapper th, |
||||
|
.el-table .el-table__fixed-header-wrapper th { |
||||
|
background: #0b6581; |
||||
|
border: 1px solid #07aec6; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table th.el-table__cell > .cell { |
||||
|
color: #3de8ff; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table thead.is-group th.el-table__cell { |
||||
|
background: #0b6581; |
||||
|
border: 1px solid #07aec6; |
||||
|
} |
||||
|
|
||||
|
// ::v-deep .el-table th.el-table__cell.is-leaf, |
||||
|
::v-deep .el-table td.el-table__cell { |
||||
|
border: 1px solid #07aec6; |
||||
|
background: #1b586d; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table tr { |
||||
|
border: 1px solid #07aec6; |
||||
|
background-color: #0b6581; |
||||
|
} |
||||
|
|
||||
|
::v-deep |
||||
|
.el-table--enable-row-hover |
||||
|
.el-table__body |
||||
|
tr:hover |
||||
|
> td.el-table__cell { |
||||
|
background: #1b586d; |
||||
|
border: 1px solid #07aec6; |
||||
|
} |
||||
|
|
||||
|
::v-deep .el-table::before, |
||||
|
.el-table--group::after, |
||||
|
.el-table--border::after { |
||||
|
background: none; |
||||
|
} |
||||
|
.footer { |
||||
|
margin-top: 20px; |
||||
|
display: flex; |
||||
|
} |
||||
|
</style> |
||||
|
After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 2.6 MiB After Width: | Height: | Size: 2.6 KiB |
@ -0,0 +1,413 @@ |
|||||
|
<template> |
||||
|
<div class="ScopeTable"> |
||||
|
<el-row> |
||||
|
<el-col :span="2"> |
||||
|
<p>设备资源:</p> |
||||
|
</el-col> |
||||
|
<el-col :span="4"> |
||||
|
<!-- 设备类型 --> |
||||
|
<el-select v-model="tableInfo.deviceType" placeholder="" @change="changeDeviceType" transfer="true" |
||||
|
:popper-append-to-body="false"> |
||||
|
<el-option v-for="item in deviceOptions" :key="item.value" :label="item.label" :value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col :span="4"> |
||||
|
<!-- 规则条件 --> |
||||
|
<el-select v-model="tableInfo.searchRule" placeholder=""> |
||||
|
<el-option v-for="item in zyOptions" :key="item.value" :label="item.label" :value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col :span="4"> |
||||
|
<!-- 设备列表 --> |
||||
|
<el-select v-if="tableInfo.searchRule == 1" v-model="tableInfo.devList" placeholder="请选择设备" multiple |
||||
|
collapse-tags> |
||||
|
<el-option v-for="item in sbOptions" :key="item.id" :label="item.deviceName" :value="item.id"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<!-- 个 --> |
||||
|
<el-input-number v-if="tableInfo.searchRule == 2 || tableInfo.searchRule == 3" |
||||
|
v-model="tableInfo.number" :min="0" :max="9999" style="width: 130px;"></el-input-number> |
||||
|
<span v-if="tableInfo.searchRule == 2 || tableInfo.searchRule == 3">个</span> |
||||
|
<!-- 公里 --> |
||||
|
<el-input-number v-if="tableInfo.searchRule == 4" v-model="tableInfo.number" :min="0" :max="9999" |
||||
|
style="width: 130px;"></el-input-number> |
||||
|
<span v-if="tableInfo.searchRule == 4" style="width: 56px;">公里</span> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row> |
||||
|
<el-col :span="2"> |
||||
|
<p>执行操作:</p> |
||||
|
</el-col> |
||||
|
<!-- 可变信息标识 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 2" :span="4"> |
||||
|
<el-select v-model="tableInfo.zx_operationType" placeholder="请选择"> |
||||
|
<el-option label="自定义发布" :value="1"></el-option> |
||||
|
<el-option label="智能发布" :value="2"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 2 && tableInfo.zx_operationType == 1" :span="4"> |
||||
|
<el-input @click.native="clickQbb('zx_content')" placeholder="请选择" v-model="tableInfo.zx_content" readonly> |
||||
|
<i slot="suffix" class="el-input__icon el-icon-search"></i> |
||||
|
</el-input> |
||||
|
</el-col> |
||||
|
<!-- 疲劳唤醒 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="4"> |
||||
|
<el-select v-model="tableInfo.zx_name" placeholder="工作模式"> |
||||
|
<el-option v-for="item in gzmsOptions" :key="item.value" :label="item.label" |
||||
|
:value="item.value"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="4"> |
||||
|
<el-input-number placeholder="" v-model="tableInfo.zx_operationDuration" :min="0" |
||||
|
:max="999"></el-input-number> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="2"> |
||||
|
<span>时长(分钟)</span> |
||||
|
</el-col> |
||||
|
<!-- 行车诱导 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 12" :span="4"> |
||||
|
<el-select v-model="tableInfo.zx_controlModel" placeholder="请选择模式" transfer="true" |
||||
|
:popper-append-to-body="false"> |
||||
|
<el-option label="手动模式" value="00"></el-option> |
||||
|
<el-option label="自动模式" value="01"></el-option> |
||||
|
<el-option label="万年历" value="02"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 12 && tableInfo.zx_controlModel == '01'" :span="4"> |
||||
|
<el-time-picker v-model="tableInfo.zx_time" is-range style="" range-separator="-" placeholder="选择时间" |
||||
|
value-format="HH:mm" format="HH:mm"> |
||||
|
</el-time-picker> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 12" :span="4"> |
||||
|
<el-select v-model="tableInfo.zx_state" placeholder="工作状态"> |
||||
|
<el-option v-for="item in gzztOptions" :key="item.value" :label="item.label" |
||||
|
:value="item.value"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<!-- 语音广播 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 5" :span="4"> |
||||
|
<el-select v-model="tableInfo.zx_operationType" placeholder="请选择"> |
||||
|
<el-option label="自定义发布" :value="1"></el-option> |
||||
|
<el-option label="智能发布" :value="2"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 5 && tableInfo.zx_operationType == 1" :span="4"> |
||||
|
<el-input v-model="tableInfo.zx_content" placeholder="请输入发布内容"></el-input> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
<el-row> |
||||
|
<el-col :span="2"> |
||||
|
<p>恢复操作:</p> |
||||
|
</el-col> |
||||
|
<!-- 可变信息标识 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 2" :span="4"> |
||||
|
<el-select v-model="tableInfo.hf_operationType" placeholder="请选择"> |
||||
|
<el-option label="自定义发布" :value="1"></el-option> |
||||
|
<el-option label="还原上次" :value="2"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 2 && tableInfo.hf_operationType == 1" :span="4"> |
||||
|
<el-input @click.native="clickQbb('hf_content')" placeholder="请选择" v-model="tableInfo.hf_content" readonly> |
||||
|
<i slot="suffix" class="el-input__icon el-icon-search"></i> |
||||
|
</el-input> |
||||
|
</el-col> |
||||
|
<!-- 疲劳唤醒 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="4"> |
||||
|
<el-select v-model="tableInfo.hf_name" placeholder="工作模式"> |
||||
|
<el-option v-for="item in gzmsOptions" :key="item.value" :label="item.label" |
||||
|
:value="item.value"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="4"> |
||||
|
<el-input-number placeholder="" v-model="tableInfo.hf_operationDuration" :min="0" |
||||
|
:max="999"></el-input-number> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 10" :span="2"> |
||||
|
<span>时长(分钟)</span> |
||||
|
</el-col> |
||||
|
<!-- 行车诱导 --> |
||||
|
<el-col v-if="tableInfo.deviceType == 12" :span="4"> |
||||
|
<el-select v-model="tableInfo.hf_controlModel" placeholder="请选择模式" transfer="true" |
||||
|
:popper-append-to-body="false"> |
||||
|
<el-option label="手动模式" value="00"></el-option> |
||||
|
<el-option label="自动模式" value="01"></el-option> |
||||
|
<el-option label="万年历" value="02"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 12 && tableInfo.hf_controlModel == '01'" :span="4"> |
||||
|
<el-time-picker v-model="tableInfo.hf_time" is-range style="" range-separator="-" placeholder="选择时间" |
||||
|
value-format="HH:mm" format="HH:mm"> |
||||
|
</el-time-picker> |
||||
|
</el-col> |
||||
|
<el-col v-if="tableInfo.deviceType == 12" :span="4"> |
||||
|
<el-select v-model="tableInfo.hf_state" placeholder="工作状态"> |
||||
|
<el-option v-for="item in gzztOptions" :key="item.value" :label="item.label" |
||||
|
:value="item.value"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> |
||||
|
<!-- 语音广播 --> |
||||
|
<!-- <el-col v-if="tableInfo.deviceType == 5" :span="4"> |
||||
|
<el-select v-model="tableInfo.hf_operationType" placeholder="请选择"> |
||||
|
<el-option label="自定义发布" :value="1"></el-option> |
||||
|
<el-option label="智能发布" :value="2"></el-option> |
||||
|
</el-select> |
||||
|
</el-col> --> |
||||
|
<el-col v-if="tableInfo.deviceType == 5 && tableInfo.hf_operationType == 1" :span="4"> |
||||
|
<el-input v-model="tableInfo.hf_content" placeholder="请输入发布内容"></el-input> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
<!-- 情报板弹窗 --> |
||||
|
<QbbDialog :visible="isShowDialog" :info="qbbData" @close="onCloseDialog" @dialogSubmit="dialogSubmit" /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import Table from '@screen/components/Table.vue'; |
||||
|
import Button from '@screen/components/Buttons/Button.vue'; |
||||
|
import request from "@/utils/request"; |
||||
|
import QbbDialog from "../qbbDialog/index.vue"; |
||||
|
import { Message } from 'element-ui' |
||||
|
import { planDeviceOptions } from "@screen/utils/enum.js"; |
||||
|
import { defaultTableInfo } from "../data"; |
||||
|
|
||||
|
export default { |
||||
|
name: 'ScopeTable', |
||||
|
components: { |
||||
|
Button, |
||||
|
Table, |
||||
|
QbbDialog |
||||
|
}, |
||||
|
model: { |
||||
|
prop: 'visible', |
||||
|
event: 'update:value' |
||||
|
}, |
||||
|
inject: ['loadData'], |
||||
|
props: { |
||||
|
visible: Boolean, |
||||
|
eventType: Number, |
||||
|
type: Number, |
||||
|
tableInfo: { |
||||
|
type: Object, |
||||
|
default: () => ({...defaultTableInfo}) |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
isShowDialog: false, |
||||
|
deviceOptions: planDeviceOptions, |
||||
|
zyOptions: [ |
||||
|
{ |
||||
|
value: 1, |
||||
|
label: '指定设备资源' |
||||
|
}, |
||||
|
{ |
||||
|
value: 2, |
||||
|
label: '事发上游最近' |
||||
|
}, |
||||
|
{ |
||||
|
value: 3, |
||||
|
label: '事发下游最近' |
||||
|
}, |
||||
|
{ |
||||
|
value: 4, |
||||
|
label: '最近公里数' |
||||
|
}, |
||||
|
], |
||||
|
gzztOptions: [ |
||||
|
{ |
||||
|
value: "01", |
||||
|
label: "常亮" |
||||
|
}, |
||||
|
{ |
||||
|
value: "02", |
||||
|
label: "流水" |
||||
|
}, |
||||
|
{ |
||||
|
value: "03", |
||||
|
label: "闪烁" |
||||
|
}, |
||||
|
{ |
||||
|
value: "04", |
||||
|
label: "关闭", |
||||
|
} |
||||
|
], |
||||
|
gzmsOptions: [ |
||||
|
{ |
||||
|
value: "激光关闭", |
||||
|
label: "激光关闭" |
||||
|
}, |
||||
|
{ |
||||
|
value: "常亮模式", |
||||
|
label: "常亮模式" |
||||
|
}, |
||||
|
{ |
||||
|
value: "间隔100ms闪烁模式", |
||||
|
label: "间隔100ms闪烁模式" |
||||
|
}, |
||||
|
{ |
||||
|
value: "间隔200ms闪烁模式", |
||||
|
label: "间隔200ms闪烁模式", |
||||
|
}, |
||||
|
{ |
||||
|
value: "间隔500ms闪烁模式", |
||||
|
label: "间隔500ms闪烁模式", |
||||
|
}, |
||||
|
{ |
||||
|
value: "2次闪烁模式", |
||||
|
label: "2次闪烁模式" |
||||
|
}, |
||||
|
{ |
||||
|
value: "SOS模式", |
||||
|
label: "SOS模式" |
||||
|
}, |
||||
|
{ |
||||
|
value: "自定义模式1", |
||||
|
label: "自定义模式1", |
||||
|
}, |
||||
|
{ |
||||
|
value: "自定义模式2", |
||||
|
label: "自定义模式2", |
||||
|
}, |
||||
|
{ |
||||
|
value: "自定义模式3", |
||||
|
label: "自定义模式3", |
||||
|
} |
||||
|
], |
||||
|
qbbData: {}, |
||||
|
sbOptions: [], |
||||
|
deviceType: 1, |
||||
|
clickQbbName: 1 |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
// async tableData(newValue) { |
||||
|
// console.log('newValue', newValue) |
||||
|
// if (newValue) { |
||||
|
// const item = this.tableData.find(it => it.searchRule == 1); |
||||
|
// console.log('item', item); |
||||
|
// if (item && item.deviceType) { |
||||
|
// let loadData = await this.loadData(item.deviceType); |
||||
|
// console.log('aa', loadData) |
||||
|
// this.sbOptions = loadData; |
||||
|
// } |
||||
|
// } |
||||
|
// } |
||||
|
}, |
||||
|
async mounted() { |
||||
|
let loadData = await this.loadData(2); |
||||
|
// console.log('aa', loadData) |
||||
|
this.sbOptions = loadData; |
||||
|
}, |
||||
|
methods: { |
||||
|
initData() { |
||||
|
|
||||
|
}, |
||||
|
async changeDeviceType(value) { |
||||
|
this.deviceType = value; |
||||
|
console.log('value', value) |
||||
|
this.sbOptions = await this.loadData(value); |
||||
|
}, |
||||
|
onAdd(id) { |
||||
|
this.tableData.push({ |
||||
|
deviceType: 1, |
||||
|
searchRule: 1, |
||||
|
qbb: '' |
||||
|
}) |
||||
|
}, |
||||
|
onDel(index) { |
||||
|
if (this.tableData.length <= 1) { |
||||
|
return Message.warning('最后一项不可删除！'); |
||||
|
} |
||||
|
this.tableData.splice(index, 1) |
||||
|
}, |
||||
|
clickQbb(name) { |
||||
|
this.clickQbbName = name; |
||||
|
// this.qbbData = this.tableData[index].dcInfoBoardTemplate; |
||||
|
this.isShowDialog = true; |
||||
|
}, |
||||
|
onCloseDialog() { |
||||
|
this.isShowDialog = false; |
||||
|
}, |
||||
|
dialogSubmit(data) { |
||||
|
console.log('qbbData',data) |
||||
|
this.tableInfo[this.clickQbbName] = data.content; |
||||
|
// this.tableData[this.index].otherConfig = JSON.stringify(data); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.ScopeTable { |
||||
|
display: flex; |
||||
|
gap: 9px; |
||||
|
width: 100%; |
||||
|
// height: 768px; |
||||
|
min-height: 50px; |
||||
|
margin-top: 5px; |
||||
|
flex-direction: column; |
||||
|
|
||||
|
p { |
||||
|
color: aqua; |
||||
|
} |
||||
|
|
||||
|
::v-deep { |
||||
|
.el-table .el-table__cell { |
||||
|
padding: 0 5px; |
||||
|
} |
||||
|
|
||||
|
.el-col-4 { |
||||
|
margin-left: 6px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.mjs { |
||||
|
display: flex; |
||||
|
|
||||
|
>div { |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.ms { |
||||
|
width: 160px; |
||||
|
} |
||||
|
|
||||
|
.plhx { |
||||
|
display: flex; |
||||
|
} |
||||
|
|
||||
|
::v-deep { |
||||
|
.el-tag.el-tag--info { |
||||
|
max-width: 100px; |
||||
|
} |
||||
|
|
||||
|
.el-range-editor--medium .el-range__icon, |
||||
|
.el-range-editor--medium .el-range__close-icon { |
||||
|
display: none; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.elButton { |
||||
|
background: #2ba8c3; |
||||
|
border-radius: 2px 2px 2px 2px; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.elButton:hover, |
||||
|
.elButton:focus { |
||||
|
background: #2ba8c3; |
||||
|
border-radius: 2px 2px 2px 2px; |
||||
|
border-color: #FFFFFF; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,472 @@ |
|||||
|
<template> |
||||
|
<Dialog v-model="modelVisible" :title="title" width="1330px"> |
||||
|
<div class="EventAddPlanDialog"> |
||||
|
<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-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-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-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="触发类型:" prop="triggerMechanism"> |
||||
|
<el-select 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-form-item> |
||||
|
</div> |
||||
|
|
||||
|
<div class="second"> |
||||
|
<el-row> |
||||
|
<el-col :span="2"> |
||||
|
<div class="text"><i style="color: red">*</i>执行操作:</div> |
||||
|
</el-col> |
||||
|
<el-col :span="22"> |
||||
|
<FormTable ref="secondFormTable" :tableData="secondFormData" :type="1"></FormTable> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
<div class="third"> |
||||
|
<el-row> |
||||
|
<el-col :span="2"> |
||||
|
<div class="text"><i style="color: red">*</i>恢复操作:</div> |
||||
|
</el-col> |
||||
|
<el-col :span="22"> |
||||
|
<FormTable ref="thirdFormTable" :tableData="thirdFormData" :type="2"></FormTable> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
</ElForm> |
||||
|
</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> |
||||
|
</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 { Message } from "element-ui"; |
||||
|
import { throttle } from "lodash"; |
||||
|
import { |
||||
|
controlModelMap, |
||||
|
gzztMap, |
||||
|
gzmsMap, |
||||
|
eventSubClassMap, |
||||
|
trafficKV, |
||||
|
WarningTypeList as perceptionKV, |
||||
|
} from "@screen/utils/enum.js"; |
||||
|
|
||||
|
const typeMap = { |
||||
|
1: trafficKV, |
||||
|
2: perceptionKV, |
||||
|
}; |
||||
|
|
||||
|
export default { |
||||
|
name: "addAndEditDialog", |
||||
|
components: { |
||||
|
Dialog, |
||||
|
Form, |
||||
|
Button, |
||||
|
FormTable, |
||||
|
}, |
||||
|
model: { |
||||
|
prop: "visible", |
||||
|
event: "close", |
||||
|
}, |
||||
|
provide() { |
||||
|
return { |
||||
|
// loadData: throttle(this.loadData, 100) |
||||
|
loadData: this.loadData, |
||||
|
}; |
||||
|
}, |
||||
|
props: { |
||||
|
visible: Boolean, |
||||
|
detail: { |
||||
|
type: Object, |
||||
|
default: () => { }, |
||||
|
}, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
title: "新增预案", |
||||
|
dialogType: 1, |
||||
|
planId: 0, |
||||
|
submitting: false, |
||||
|
formData: { |
||||
|
eventCategory: 1, |
||||
|
eventType: 1, |
||||
|
triggerMechanism: "", |
||||
|
}, |
||||
|
secondFormData: [ |
||||
|
{ |
||||
|
deviceType: 1, |
||||
|
searchRule: 1, |
||||
|
qbb: "", |
||||
|
}, |
||||
|
], |
||||
|
thirdFormData: [ |
||||
|
{ |
||||
|
deviceType: 1, |
||||
|
searchRule: 1, |
||||
|
qbb: "", |
||||
|
}, |
||||
|
], |
||||
|
deviceData: [], |
||||
|
eventOptions: trafficKV, |
||||
|
mechanismOptions: [ |
||||
|
{ |
||||
|
value: "1-1", |
||||
|
label: "追尾", |
||||
|
}, |
||||
|
{ |
||||
|
value: "1-2", |
||||
|
label: "侧翻", |
||||
|
}, |
||||
|
{ |
||||
|
value: "1-3", |
||||
|
label: "撞护栏", |
||||
|
}, |
||||
|
{ |
||||
|
value: "1-4", |
||||
|
label: "自然", |
||||
|
}, |
||||
|
{ |
||||
|
value: "1-5", |
||||
|
label: "其他事故", |
||||
|
}, |
||||
|
], |
||||
|
rules: { |
||||
|
planName: [{ required: true, message: "请输入预案名称" }], |
||||
|
eventType: [ |
||||
|
{ required: true, message: "请选择事件类型", trigger: "change" }, |
||||
|
], |
||||
|
}, |
||||
|
}; |
||||
|
}, |
||||
|
mounted() { }, |
||||
|
computed: { |
||||
|
modelVisible: { |
||||
|
get() { |
||||
|
if (this.visible) { |
||||
|
if (Object.keys(this.detail).length > 0) { |
||||
|
this.title = "修改预案"; |
||||
|
this.dialogType = 2; |
||||
|
this.eventOptions = typeMap[this.detail.eventCategory]; |
||||
|
this.mechanismOptions = |
||||
|
eventSubClassMap[this.detail.eventCategory || 1][ |
||||
|
this.detail.eventType |
||||
|
]; |
||||
|
this.initData(this.detail.id); |
||||
|
} else { |
||||
|
this.title = "新增预案"; |
||||
|
this.dialogType = 1; |
||||
|
this.formData = { |
||||
|
eventCategory: 1, |
||||
|
eventType: 1, |
||||
|
triggerMechanism: "", |
||||
|
}; |
||||
|
this.secondFormData = [ |
||||
|
{ |
||||
|
deviceType: 1, |
||||
|
searchRule: 1, |
||||
|
qbb: "", |
||||
|
}, |
||||
|
]; |
||||
|
this.thirdFormData = [ |
||||
|
{ |
||||
|
deviceType: 1, |
||||
|
searchRule: 1, |
||||
|
qbb: "", |
||||
|
}, |
||||
|
]; |
||||
|
} |
||||
|
} |
||||
|
return this.visible; |
||||
|
}, |
||||
|
set(val) { |
||||
|
this.$emit("close", val); |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
methods: { |
||||
|
initData(id = 1) { |
||||
|
request({ |
||||
|
url: `/business/plans/list/${id}`, |
||||
|
method: "get", |
||||
|
}) |
||||
|
.then((result) => { |
||||
|
if (result.code != 200) return Message.error(result?.msg); |
||||
|
let data = result.data; |
||||
|
let dcExecuteAction = result.data.dcExecuteAction; |
||||
|
|
||||
|
this.planId = data.id; |
||||
|
this.formData = { |
||||
|
eventCategory: data.eventCategory, |
||||
|
planName: data.planName, |
||||
|
eventType: data.eventType, |
||||
|
triggerMechanism: data.triggerMechanism, |
||||
|
}; |
||||
|
this.secondFormData = []; |
||||
|
this.thirdFormData = []; |
||||
|
dcExecuteAction.forEach((it) => { |
||||
|
let action = {}; |
||||
|
if (it.otherConfig) { |
||||
|
let config = JSON.parse(it.otherConfig); |
||||
|
let qbb = ""; |
||||
|
if (config.id) { |
||||
|
qbb = config.content; |
||||
|
config = { dcInfoBoardTemplate: config }; |
||||
|
} |
||||
|
// if (config.state) { |
||||
|
// config.gzms = config.state |
||||
|
// } |
||||
|
action = { ...it, ...config, qbb: qbb }; |
||||
|
} |
||||
|
if (it.deviceList) { |
||||
|
action.deviceList = it.deviceList |
||||
|
.split(",") |
||||
|
.map((str) => Number(str)); |
||||
|
} |
||||
|
if (it.actionType == 1) { |
||||
|
this.secondFormData.push(action); |
||||
|
} else if (it.actionType == 2) { |
||||
|
this.thirdFormData.push(action); |
||||
|
} |
||||
|
}); |
||||
|
console.log("secondFormData", this.secondFormData); |
||||
|
}) |
||||
|
// console.log('secondFormData', this.secondFormData) |
||||
|
// }).catch((err) => { |
||||
|
// console.log(err) |
||||
|
// Message.error("查询事件预案列表失败", err); |
||||
|
// }) |
||||
|
|
||||
|
.catch((err) => { |
||||
|
console.log(err); |
||||
|
Message.error("查询事件预案列表失败", err); |
||||
|
}); |
||||
|
}, |
||||
|
async loadData(deviceType = 1) { |
||||
|
this.deviceData = []; |
||||
|
let result = await request({ |
||||
|
url: `business/device/query?deviceType=${deviceType}`, |
||||
|
method: "get", |
||||
|
}); |
||||
|
if (result.code != 200) return Message.error(result?.msg); |
||||
|
if (deviceType == 1) { |
||||
|
this.deviceData = result.data.filter((it) => it.childType !== "1-1"); |
||||
|
} else { |
||||
|
this.deviceData = result.data; |
||||
|
} |
||||
|
return this.deviceData; |
||||
|
}, |
||||
|
changeEventType(value = 1) { |
||||
|
this.mechanismOptions = |
||||
|
eventSubClassMap[this.formData.eventCategory || 1][value]; |
||||
|
}, |
||||
|
changeRadio(value = 1) { |
||||
|
this.formData.triggerMechanism = ""; |
||||
|
this.eventOptions = typeMap[value]; |
||||
|
this.changeEventType(1); |
||||
|
}, |
||||
|
handleChange() { }, |
||||
|
formatData(it, value = 1, id = "") { |
||||
|
let data = { ...it, actionType: value, emergencyPlansId: id }; |
||||
|
if ( |
||||
|
it.deviceList && |
||||
|
typeof it.deviceList !== "string" && |
||||
|
it.deviceList.length > 0 |
||||
|
) { |
||||
|
data.deviceList = it.deviceList.join(","); |
||||
|
} else { |
||||
|
data.deviceList = ""; |
||||
|
} |
||||
|
if (it.content) { |
||||
|
data.otherConfig = JSON.stringify({ content: it.content }); |
||||
|
} |
||||
|
if (it.controlModel) { |
||||
|
let other = { |
||||
|
controlModel: it.controlModel, |
||||
|
controlModelName: controlModelMap[it.controlModel], |
||||
|
state: it.state, |
||||
|
name: gzztMap[it.state], |
||||
|
}; |
||||
|
if (it.time && it?.time[0]) { |
||||
|
other = { |
||||
|
controlModel: it.controlModel, |
||||
|
controlModelName: controlModelMap[it.controlModel], |
||||
|
state: it.state, |
||||
|
name: gzztMap[it.state], |
||||
|
startTime: it.time[0], |
||||
|
endTime: it.time[1], |
||||
|
}; |
||||
|
} |
||||
|
data.otherConfig = JSON.stringify(other); |
||||
|
} |
||||
|
if (it.gzms) { |
||||
|
data.otherConfig = JSON.stringify({ |
||||
|
state: it.gzms, |
||||
|
name: gzmsMap[it.gzms], |
||||
|
operationDuration: it.operationDuration, |
||||
|
}); |
||||
|
} |
||||
|
return data; |
||||
|
}, |
||||
|
handleSubmit() { |
||||
|
this.$refs["ruleForm"].validate((valid) => { |
||||
|
if (valid) { |
||||
|
// this.submitting = false; |
||||
|
let secondFormTable = this.$refs["secondFormTable"].tableData || []; |
||||
|
let thirdFormTable = this.$refs["thirdFormTable"].tableData || []; |
||||
|
// let flg = false; |
||||
|
// for (let item of secondFormTable) { |
||||
|
// if (this.areAllValuesEmpty(item)) { flg = true; break }; |
||||
|
// } |
||||
|
// if (flg) return Message.warning('执行操作子项不能为空！'); |
||||
|
// for (let item of thirdFormTable) { |
||||
|
// if (this.areAllValuesEmpty(item)) { flg = true; break }; |
||||
|
// } |
||||
|
// if (flg) return Message.warning('恢复操作子项不能为空！'); |
||||
|
// console.log('12', secondFormTable); |
||||
|
// console.log('34', thirdFormTable); |
||||
|
let dcArr = []; |
||||
|
let id = ""; |
||||
|
if (this.dialogType == 2) id = this.planId; |
||||
|
secondFormTable.forEach((it) => { |
||||
|
dcArr.push(this.formatData(it, 1, id)); |
||||
|
}); |
||||
|
thirdFormTable.forEach((it) => { |
||||
|
dcArr.push(this.formatData(it, 2, id)); |
||||
|
}); |
||||
|
|
||||
|
console.log({ |
||||
|
...this.formData, |
||||
|
dcExecuteAction: dcArr, |
||||
|
}); |
||||
|
// return; |
||||
|
if (this.dialogType == 1) { |
||||
|
//新增 |
||||
|
request({ |
||||
|
url: `/business/plans`, |
||||
|
method: "post", |
||||
|
data: { |
||||
|
...this.formData, |
||||
|
dcExecuteAction: dcArr, |
||||
|
}, |
||||
|
}) |
||||
|
.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("reInitData", true); |
||||
|
}); |
||||
|
} else if (this.dialogType == 2) { |
||||
|
//修改 |
||||
|
request({ |
||||
|
url: `/business/plans`, |
||||
|
method: "put", |
||||
|
data: { |
||||
|
...this.formData, |
||||
|
id: this.planId, |
||||
|
dcExecuteAction: dcArr, |
||||
|
}, |
||||
|
}) |
||||
|
.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("reInitData", true); |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
areAllValuesEmpty(obj) { |
||||
|
console.log("ass", obj); |
||||
|
return Object.keys(obj).every(function (key) { |
||||
|
const value = obj[key]; |
||||
|
return ( |
||||
|
value == null || |
||||
|
value === "" || |
||||
|
(Array.isArray(value) && value.length === 0) || |
||||
|
(value instanceof Object && Object.keys(value).length === 0) |
||||
|
); |
||||
|
}); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.fade-enter-active, |
||||
|
.fade-leave-active { |
||||
|
transition: opacity 0.24s; |
||||
|
} |
||||
|
|
||||
|
.fade-enter, |
||||
|
.fade-leave-to { |
||||
|
opacity: 0; |
||||
|
} |
||||
|
|
||||
|
.EventAddPlanDialog { |
||||
|
gap: 9px; |
||||
|
width: 1280px; |
||||
|
height: 310px; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
|
||||
|
.first, |
||||
|
.second, |
||||
|
.third { |
||||
|
padding: 5px 10px 8px; |
||||
|
background-color: #296887; |
||||
|
margin-bottom: 15px; |
||||
|
|
||||
|
.text { |
||||
|
margin-top: 12px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.form { |
||||
|
flex: 1; |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
|
||||
|
.footer { |
||||
|
display: flex; |
||||
|
justify-content: end; |
||||
|
gap: 15px; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue