299 lines
9.4 KiB
Vue
299 lines
9.4 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<div class="level-title">
|
|
<h1>{{ this.$parent.DEVICE_ID == '' ? "新增" : "修改" }}</h1>
|
|
</div>
|
|
<div>
|
|
<el-form v-loading="dialogFormVisible" ref="form" :model="form" :rules="rules" label-width="150px">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="设备名称：" prop="DEVICE_NAME">
|
|
<el-input v-model="form.DEVICE_NAME" placeholder="闸机名称"/>
|
|
</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 typeList" :key="item.VALUE" :label="item.NAME" :value="item.VALUE" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="10">
|
|
<el-form-item label="绑定设备：" prop="DOCK_DEVICE_ID">
|
|
<el-select v-model="form.DOCK_DEVICE_ID" filterable clearable style="width: 100%;" @change="getDockDeviceInfo">
|
|
<el-option v-for="item in deviceList" :key="item.DOCK_DEVICE_ID" :value="item.DOCK_DEVICE_ID" :label="item.DEVICE_NAME"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="2">
|
|
<el-button v-if="!form.DOCK_DEVICE_ID" style="position: relative; left: 10%" type="danger" icon="el-icon-price-tag" size="mini">请进行设备绑定</el-button>
|
|
<el-button v-else-if="form.DOCK_DEVICE_ID" style="position: relative; left: 10%" type="success" icon="el-icon-price-tag" size="mini" @click="handleOpen()">查看绑定数据信息</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-form-item label="状态：" prop="STATUS">
|
|
<el-select v-model="form.STATUS" style="width: 100%;">
|
|
<el-option v-for="item in statusList" :key="item.VALUE" :label="item.NAME" :value="item.VALUE" />
|
|
</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>
|
|
<!-- 设备 -->
|
|
<el-dialog v-if="dialogDoor" :visible.sync="dialogDoor" title="设备信息" width="600px">
|
|
<el-form v-loading="dialogFormVisible" label-width="150px">
|
|
<el-row>
|
|
<el-col :span="20">
|
|
<el-form-item label="设备名称：" prop="DEVICE_NAME">
|
|
<el-input v-model="dockDeviceForm.DEVICE_NAME" disabled placeholder="设备名称"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="20">
|
|
<el-form-item label="所属口门名称：" prop="DOOR_NAME">
|
|
<el-input v-model="dockDeviceForm.DOOR_NAME" disabled placeholder="所属口门名称"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="20">
|
|
<el-form-item label="所属通道名称：" prop="PATH_NAME">
|
|
<el-input v-model="dockDeviceForm.PATH_NAME" disabled placeholder="所属通道名称"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="20">
|
|
<el-form-item label="设备类型：" prop="DEVICE_TYPE">
|
|
<el-input v-model="dockDeviceForm.DEVICE_TYPE" disabled placeholder="设备类型"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<div style="position: relative; top: 10px">
|
|
<el-button @click="dialogDoor = false">取 消</el-button>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</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' // waves directive
|
|
export default {
|
|
|
|
components: { Pagination, SelectTree },
|
|
directives: { waves },
|
|
data() {
|
|
return {
|
|
DEVICE_NAMES: '',
|
|
deviceListQuery: {
|
|
page: 1,
|
|
limit: 20
|
|
},
|
|
DOOR_TYPE: '',
|
|
doorTotal: 0,
|
|
deviceList: [],
|
|
doorFilterText: '',
|
|
dialogDoor: false,
|
|
dialogFormVisible: false,
|
|
dialogTableVisible: false,
|
|
PERSON_CHARGE: '',
|
|
DEPARTMENT_ID_OLD: '',
|
|
DEVICE_ID: '',
|
|
form: {
|
|
DOCK_DEVICE_ID: '',
|
|
DEVICE_NAME: '',
|
|
DEVICE_TYPE: '',
|
|
PATH_ID: '',
|
|
DOOR_ID: '',
|
|
STATUS: ''
|
|
},
|
|
dockDeviceForm: {
|
|
DOCK_DEVICE_ID: '',
|
|
DEVICE_NAME: '',
|
|
DOOR_NAME: '',
|
|
PATH_NAME: '',
|
|
DEVICE_TYPE: ''
|
|
},
|
|
typeList: [
|
|
{ NAME: '闸机', VALUE: 0 }
|
|
],
|
|
statusList: [
|
|
{ NAME: '正常', VALUE: 0 },
|
|
{ NAME: '停用', VALUE: 1 },
|
|
{ NAME: '暂时关闭', VALUE: 2 }
|
|
],
|
|
riskForm: {},
|
|
KEYWORDS: '',
|
|
rules: {
|
|
DOCK_DEVICE_ID: [{ required: true, message: '请选择绑定设备', trigger: 'blur' }],
|
|
DEVICE_NAME: [{ required: true, message: '闸机名称不为空', trigger: 'blur' }],
|
|
DEVICE_TYPE: [{ required: true, message: '闸机类型不为空', trigger: 'blur' }],
|
|
STATUS: [{ required: true, message: '闸机类别不为空', trigger: 'blur' }]
|
|
},
|
|
formLabelWidth: '120px',
|
|
fullscreenLoading: false,
|
|
total: 0,
|
|
listQuery: {
|
|
page: 1,
|
|
limit: 20
|
|
},
|
|
multipleSelection: [],
|
|
accidentList: [],
|
|
categoryList: [
|
|
{ ID: '1', NAME: '人员' },
|
|
{ ID: '2', NAME: '车辆' }
|
|
],
|
|
leaveList: [
|
|
{ ID: '1', NAME: '入' },
|
|
{ ID: '2', NAME: '出' }
|
|
],
|
|
IsAdjacentList: [
|
|
{ ID: '0', NAME: '否' },
|
|
{ ID: '1', NAME: '是' }
|
|
]
|
|
}
|
|
},
|
|
watch: {
|
|
},
|
|
async created() {
|
|
this.form.PATH_ID = this.$parent.PATH_ID
|
|
this.form.DOOR_ID = this.$parent.DOOR_ID
|
|
this.DEVICE_ID = this.$parent.DEVICE_ID
|
|
if (this.DEVICE_ID) {
|
|
this.getDataByID()
|
|
}
|
|
this.DOOR_TYPE = this.$parent.DOOR_TYPE
|
|
this.getDeviceList()
|
|
},
|
|
methods: {
|
|
async handleOpen() {
|
|
requestFN(
|
|
'/mkmjDockDevice/findById',
|
|
{
|
|
DOCK_DEVICE_ID: this.form.DOCK_DEVICE_ID
|
|
}
|
|
).then((data) => {
|
|
this.listLoading = false
|
|
this.dockDeviceForm = data.pd
|
|
this.dialogDoor = true
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
console.log(e)
|
|
})
|
|
},
|
|
getDockDeviceInfo() {
|
|
const deviceList = this.deviceList
|
|
for (let i = 0; i < deviceList.length; i++) {
|
|
if (deviceList[i].DOCK_DEVICE_ID == this.form.DOCK_DEVICE_ID) {
|
|
this.dockDeviceForm.DOCK_DEVICE_ID = deviceList[i].DOCK_DEVICE_ID
|
|
this.dockDeviceForm.DEVICE_NAME = deviceList[i].DEVICE_NAME
|
|
this.dockDeviceForm.DOOR_NAME = deviceList[i].DOOR_NAME
|
|
this.dockDeviceForm.PATH_NAME = deviceList[i].PATH_NAME
|
|
this.dockDeviceForm.DEVICE_TYPE = deviceList[i].DEVICE_TYPE == '0' ? '人行闸机' : '车行闸机'
|
|
}
|
|
}
|
|
console.log(this.dockDeviceForm)
|
|
},
|
|
getDeviceList() {
|
|
this.listLoading = true
|
|
return new Promise(resolve => {
|
|
requestFN(
|
|
'/mkmjDockDevice/listAll',
|
|
{
|
|
KEYWORDS: this.doorFilterText,
|
|
DOOR_TYPE: this.DOOR_TYPE
|
|
}
|
|
).then((data) => {
|
|
this.listLoading = false
|
|
this.deviceList = data.varList
|
|
this.doorTotal = data.page.totalResult
|
|
resolve()
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
console.log(e)
|
|
})
|
|
})
|
|
},
|
|
confirm() {
|
|
this.$refs.form.validate(valid => {
|
|
if (valid) {
|
|
if (!this.DEVICE_ID) {
|
|
this.handleAdd()
|
|
} else {
|
|
if (valid) {
|
|
this.listLoading = true
|
|
requestFN(
|
|
'/mkmjDevice/edit',
|
|
this.form
|
|
).then((data) => {
|
|
this.$message.success(data.msg)
|
|
this.listLoading = false
|
|
this.dialogFormEdit = false
|
|
this.$parent.activeName = 'ListDevice'
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
}
|
|
}
|
|
}
|
|
})
|
|
},
|
|
handleAdd() {
|
|
requestFN(
|
|
'/mkmjDevice/add',
|
|
{
|
|
...this.form,
|
|
CORPINFO_ID: this.$parent.CORPINFO_ID
|
|
}
|
|
).then((data) => {
|
|
if (data.msg === '保存成功') {
|
|
this.$message.success(data.msg)
|
|
this.goBack()
|
|
} else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((e) => {
|
|
})
|
|
},
|
|
getDataByID() {
|
|
this.listLoading = true
|
|
this.dialogFormVisible = true
|
|
requestFN(
|
|
'/mkmjDevice/goEdit',
|
|
{ DEVICE_ID: this.DEVICE_ID }
|
|
).then((data) => {
|
|
this.form = data.pd
|
|
this.dialogFormVisible = false
|
|
}).catch((e) => {
|
|
this.dialogFormVisible = false
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
// 返回列表
|
|
goBack() {
|
|
this.$parent.activeName = 'ListDevice'
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|