279 lines
8.7 KiB
Vue
279 lines
8.7 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<div class="level-title">
|
|
<h1>{{ this.$parent.DOCK_DEVICE_ID == '' ? "新增" : "修改" }}</h1>
|
|
</div>
|
|
<div>
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="150px">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="设备名称：" prop="DEVICEINDEXCODE">
|
|
<el-select v-model="form.DEVICEINDEXCODE" style="width: 100%;" @change="handleDeviceNameChange">
|
|
<el-option v-for="item in deviceList" :key="item.DEVICE_ID" :label="item.DEVICE_NAME" :value="item.DEVICE_ID" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="设备类型：" prop="DEVICE_TYPE">
|
|
<el-select v-model="form.DEVICE_TYPE" style="width: 100%;">
|
|
<el-option v-for="item in deviceTypeList" :key="item.VALUE" :label="item.NAME" :value="item.VALUE" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<!-- 查看展示所有二级口门（查询条件：口门类型，口门级别） -->
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="所属口门名称：" prop="DOORINDEXCODE">
|
|
<el-select v-model="form.DOORINDEXCODE" style="width: 100%;" @change="handleDoorNameChange">
|
|
<el-option v-for="item in doorList" :key="item.DOOR_ID" :label="item.DOOR_NAME" :value="item.DOOR_ID" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<!-- 查询条件：口门名称、通道类型 -->
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="所属通道名称：" prop="PATHINDEXCODE">
|
|
<el-select v-model="form.PATHINDEXCODE" style="width: 100%;" @change="handlePathNameChange">
|
|
<el-option v-for="item in pathList" :key="item.PATH_ID" :label="item.PATH_NAME" :value="item.PATH_ID" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</div>
|
|
<div class="ui-foot">
|
|
<el-button type="success" @click="confirm">保 存</el-button>
|
|
<el-button plain type="info" @click="goBack">返 回</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
|
|
import { requestFN } from '@/utils/request'
|
|
import SelectTree from '@/components/SelectTree'
|
|
import waves from '@/directive/waves'
|
|
|
|
export default {
|
|
|
|
components: { Pagination, SelectTree },
|
|
directives: { waves },
|
|
data() {
|
|
return {
|
|
deviceList: [], // 设备列表
|
|
doorList: [], // 口门列表
|
|
pathList: [], // 通道列表
|
|
form: {
|
|
DEVICEINDEXCODE: '', // 设备id
|
|
DEVICE_TYPE: '', // 设备类型
|
|
DOORINDEXCODE: '', // 口门id
|
|
PATHINDEXCODE: '', // 通道id
|
|
DEVICE_NAME: '', // 设备名称
|
|
DOOR_NAME: '', // 口门名称
|
|
PATH_NAME: '', // 通道名称
|
|
AREA_LEVEL: 2 // 口门级别:默认是二级口门
|
|
},
|
|
rules: {
|
|
DEVICEINDEXCODE: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
|
|
DEVICE_TYPE: [{ required: true, message: '请选择设备类型', trigger: 'blur' }],
|
|
DOORINDEXCODE: [{ required: true, message: '请选择所属口门名称', trigger: 'blur' }],
|
|
PATHINDEXCODE: [{ required: true, message: '请选择所属通道名称', trigger: 'blur' }]
|
|
},
|
|
deviceTypeList: [ // 设备类型
|
|
{ NAME: '人', VALUE: 0 },
|
|
{ NAME: '车', VALUE: 1 }
|
|
],
|
|
DOCK_DEVICE_ID: ''
|
|
}
|
|
},
|
|
watch: {
|
|
},
|
|
created() {
|
|
this.reSetForm()
|
|
this.DOCK_DEVICE_ID = this.$parent.DOCK_DEVICE_ID
|
|
this.handleDeviceList()
|
|
this.handleDoorList()
|
|
this.handlePathList()
|
|
if (this.DOCK_DEVICE_ID !== '') {
|
|
this.getDataByID()
|
|
}
|
|
},
|
|
methods: {
|
|
confirm() {
|
|
this.$refs.form.validate(valid => {
|
|
if (valid) {
|
|
if (this.DOCK_DEVICE_ID === '') {
|
|
this.handleAdd()
|
|
} else {
|
|
this.handleEdit()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
reSetForm() {
|
|
this.form.DEVICEINDEXCODE = ''
|
|
this.form.DEVICE_TYPE = ''
|
|
this.form.DOORINDEXCODE = ''
|
|
this.form.PATHINDEXCODE = ''
|
|
this.form.DEVICE_NAME = ''
|
|
this.form.DOOR_NAME = ''
|
|
this.form.DOOR_NAME = ''
|
|
},
|
|
handleEdit() {
|
|
this.listLoading = true
|
|
requestFN(
|
|
'/dockDevice/edit',
|
|
{
|
|
DOCK_DEVICE_ID: this.DOCK_DEVICE_ID,
|
|
...this.form
|
|
}
|
|
).then((data) => {
|
|
this.goBack()
|
|
this.listLoading = false
|
|
this.dialogFormEdit = false
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
handleAdd() {
|
|
requestFN(
|
|
'/dockDevice/add',
|
|
this.form
|
|
).then((data) => {
|
|
if (data.result === 'success') {
|
|
this.goBack()
|
|
}
|
|
}).catch((e) => {
|
|
})
|
|
},
|
|
// 进入修改界面进行数据回显
|
|
getDataByID() {
|
|
this.listLoading = true
|
|
this.dialogFormVisible = true
|
|
requestFN(
|
|
'/dockDevice/findById',
|
|
{ DOCK_DEVICE_ID: this.DOCK_DEVICE_ID }
|
|
).then((data) => {
|
|
if (this.safeReturn(data.pd.DEVICEINDEXCODE) !== '') {
|
|
this.form.DEVICEINDEXCODE = data.pd.DEVICEINDEXCODE // 设备id
|
|
}
|
|
this.form.DEVICE_NAME = data.pd.DEVICE_NAME // 设备名称
|
|
this.form.DEVICE_TYPE = Number(data.pd.DEVICE_TYPE) // 设备类型
|
|
if (this.safeReturn(data.pd.DOORINDEXCODE) !== '') {
|
|
this.form.DOORINDEXCODE = data.pd.DOORINDEXCODE // 口门id
|
|
}
|
|
this.form.DOOR_NAME = data.pd.DOOR_NAME
|
|
if (this.safeReturn(data.pd.PATHINDEXCODE) !== '') {
|
|
this.form.PATHINDEXCODE = data.pd.PATHINDEXCODE // 通道id
|
|
}
|
|
this.form.PATH_NAME = data.pd.PATH_NAME // 通道名称
|
|
this.form.AREA_LEVEL = data.pd.AREA_LEVEL // 口门级别
|
|
this.dialogFormVisible = false
|
|
}).catch((e) => {
|
|
this.dialogFormVisible = false
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
safeReturn(value) {
|
|
if (value !== null && value !== undefined && value !== '') {
|
|
return value;
|
|
}
|
|
return '';
|
|
},
|
|
// 返回列表
|
|
goBack() {
|
|
this.$parent.activeName = 'List'
|
|
},
|
|
handleDeviceList() { // 获取设备列表
|
|
this.formLoading = true
|
|
requestFN(
|
|
'/dockDevice/goDeviceList'
|
|
).then((data) => {
|
|
if (data.result === 'success') {
|
|
this.deviceList = data.varList
|
|
} else {
|
|
this.$message({
|
|
message: '系统忙，请稍后重试',
|
|
type: 'error'
|
|
})
|
|
}
|
|
this.formLoading = false
|
|
}).catch((e) => {
|
|
this.formLoading = false
|
|
})
|
|
},
|
|
handleDoorList(value) { // 获取口门列表(默认获取二级口门)
|
|
this.formLoading = true
|
|
requestFN(
|
|
'/dockDevice/goDoorList',
|
|
{
|
|
'DOOR_TYPE': '',
|
|
'AREA_LEVEL': 2
|
|
}
|
|
).then((data) => {
|
|
if (data.result === 'success') {
|
|
this.doorList = data.varList
|
|
} else {
|
|
this.$message({
|
|
message: '系统忙，请稍后重试',
|
|
type: 'error'
|
|
})
|
|
}
|
|
this.formLoading = false
|
|
}).catch((e) => {
|
|
this.formLoading = false
|
|
})
|
|
},
|
|
handlePathList() { // 获取通道列表
|
|
this.formLoading = true
|
|
requestFN(
|
|
'/dockDevice/goPathList',
|
|
{'PATH_TYPE': ''}
|
|
).then((data) => {
|
|
if (data.result === 'success') {
|
|
this.pathList = data.varList
|
|
} else {
|
|
this.$message({
|
|
message: '系统忙，请稍后重试',
|
|
type: 'error'
|
|
})
|
|
}
|
|
this.formLoading = false
|
|
}).catch((e) => {
|
|
this.formLoading = false
|
|
})
|
|
},
|
|
handleDeviceNameChange(value) { // 获取设备名称
|
|
const selectedDevice = this.deviceList.find(device => device.DEVICE_ID === value)
|
|
if (selectedDevice) {
|
|
this.form.DEVICE_NAME = selectedDevice.DEVICE_NAME
|
|
} else {
|
|
this.form.DEVICE_NAME = ''
|
|
}
|
|
},
|
|
handleDoorNameChange(value) { // 获取口门名称
|
|
const selectedDoor = this.doorList.find(door => door.DOOR_ID === value)
|
|
if (selectedDoor) {
|
|
this.form.DOOR_NAME = selectedDoor.DOOR_NAME
|
|
} else {
|
|
this.form.DOOR_NAME = ''
|
|
}
|
|
},
|
|
handlePathNameChange(value) { // 获取通道名称
|
|
const selectedPath = this.pathList.find(path => path.PATH_ID === value)
|
|
if (selectedPath) {
|
|
this.form.PATH_NAME = selectedPath.PATH_NAME
|
|
} else {
|
|
this.form.PATH_NAME = ''
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
</style>
|