product
tengxi
2 years ago
parent
5a9f59d172
commit
fadb9543bc
@ -1,262 +1,281 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :title="!dataForm.id ? '新建' : isDetail ? '详情':'编辑'"
|
<el-dialog :title="!dataForm.id ? '新建' : isDetail ? '详情':'编辑'"
|
||||||
:close-on-click-modal="false" append-to-body
|
:close-on-click-modal="false" append-to-body
|
||||||
:visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll
|
:visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll
|
||||||
width="800px">
|
width="800px">
|
||||||
<el-row :gutter="15" class="">
|
<el-row :gutter="15" class="">
|
||||||
<el-form ref="elForm" :model="dataForm" :rules="rules" size="small" label-width="100px" label-position="right" >
|
<el-form ref="elForm" :model="dataForm" :rules="rules" size="small" label-width="100px" label-position="right">
|
||||||
<template v-if="!loading">
|
<template v-if="!loading">
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="设备名称"
|
<el-form-item label="设备名称"
|
||||||
prop="mName" >
|
prop="mName">
|
||||||
<el-input v-model="dataForm.mName"
|
<el-input v-model="dataForm.mName"
|
||||||
placeholder="请输入设备名称" clearable :style='{"width":"100%"}'>
|
placeholder="请输入设备名称" clearable :style='{"width":"100%"}'>
|
||||||
|
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
|
||||||
<el-form-item label="区域"
|
|
||||||
prop="monitoringId" >
|
|
||||||
<el-select v-model="dataForm.monitoringId"
|
|
||||||
placeholder="请选择区域" clearable :style='{"width":"100%"}' filterable >
|
|
||||||
<el-option v-for="(item, index) in monitoringIdOptions" :key="index" :label="item.m_name" :value="item.id" :disabled="item.disabled" ></el-option>
|
|
||||||
|
|
||||||
</el-select>
|
<el-col :span="24">
|
||||||
</el-form-item>
|
<el-form-item label="设备序列号"
|
||||||
</el-col>
|
prop="mName">
|
||||||
<el-col :span="24" >
|
<el-input v-model="dataForm.serialnumber"
|
||||||
<el-form-item label="设备状态："
|
placeholder="请输入序列号" clearable :style='{"width":"100%"}'>
|
||||||
prop="mStatus" >
|
|
||||||
<el-select v-model="dataForm.mStatus"
|
|
||||||
placeholder="请选择设备状态" clearable :style='{"width":"100%"}'>
|
|
||||||
<el-option v-for="(item, index) in mStatusOptions" :key="index" :label="item.fullName" :value="item.id" :disabled="item.disabled" ></el-option>
|
|
||||||
|
|
||||||
</el-select>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
|
||||||
<el-form-item label="标清flv直播地址"
|
|
||||||
prop="flvAddress" >
|
|
||||||
<el-input v-model="dataForm.flvAddress"
|
|
||||||
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
|
||||||
|
|
||||||
</el-input>
|
<el-col :span="24">
|
||||||
</el-form-item>
|
<el-form-item label="区域"
|
||||||
</el-col>
|
prop="monitoringId">
|
||||||
<el-col :span="24" >
|
<el-select v-model="dataForm.monitoringId"
|
||||||
<el-form-item label="高清flv直播地址"
|
placeholder="请选择区域" clearable :style='{"width":"100%"}' filterable>
|
||||||
prop="flvHdAddress" >
|
<el-option v-for="(item, index) in monitoringIdOptions" :key="index" :label="item.m_name"
|
||||||
<el-input v-model="dataForm.flvHdAddress"
|
:value="item.id" :disabled="item.disabled"></el-option>
|
||||||
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
|
||||||
|
|
||||||
</el-input>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="设备通道号"
|
<el-form-item label="设备状态："
|
||||||
prop="channelNumber" >
|
prop="mStatus">
|
||||||
<el-input v-model="dataForm.channelNumber"
|
<el-select v-model="dataForm.mStatus"
|
||||||
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
placeholder="请选择设备状态" clearable :style='{"width":"100%"}'>
|
||||||
|
<el-option v-for="(item, index) in mStatusOptions" :key="index" :label="item.fullName" :value="item.id"
|
||||||
|
:disabled="item.disabled"></el-option>
|
||||||
|
|
||||||
</el-input>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="是否显示"
|
<el-form-item label="标清flv直播地址"
|
||||||
prop="isEnable" >
|
prop="flvAddress">
|
||||||
<el-select v-model="dataForm.isEnable"
|
<el-input v-model="dataForm.flvAddress"
|
||||||
placeholder="请选择是否显示" clearable :style='{"width":"100%"}'>
|
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
||||||
<el-option v-for="(item, index) in isEnableOptions" :key="index" :label="item.fullName" :value="item.id" :disabled="item.disabled" ></el-option>
|
|
||||||
|
|
||||||
</el-select>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="修改时间"
|
<el-form-item label="高清flv直播地址"
|
||||||
prop="lastmodifytime" >
|
prop="flvHdAddress">
|
||||||
<el-date-picker v-model="dataForm.lastmodifytime"
|
<el-input v-model="dataForm.flvHdAddress"
|
||||||
placeholder="请选择" readonly clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
|
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
||||||
|
|
||||||
</el-date-picker>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="修改人id"
|
<el-form-item label="设备通道号"
|
||||||
prop="deleteUserId" >
|
prop="channelNumber">
|
||||||
<el-input v-model="dataForm.deleteUserId"
|
<el-input v-model="dataForm.channelNumber"
|
||||||
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
||||||
|
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<el-col :span="24">
|
||||||
<el-form-item label="创建人名称"
|
<el-form-item label="是否显示"
|
||||||
prop="creatorUserName" >
|
prop="isEnable">
|
||||||
<el-input v-model="dataForm.creatorUserName"
|
<el-select v-model="dataForm.isEnable"
|
||||||
placeholder="请输入" readonly clearable :style='{"width":"100%"}'>
|
placeholder="请选择是否显示" clearable :style='{"width":"100%"}'>
|
||||||
|
<el-option v-for="(item, index) in isEnableOptions" :key="index" :label="item.fullName" :value="item.id"
|
||||||
|
:disabled="item.disabled"></el-option>
|
||||||
|
|
||||||
</el-input>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" >
|
<!-- <el-col :span="24">-->
|
||||||
<el-form-item label="创建时间"
|
<!-- <el-form-item label="修改时间"-->
|
||||||
prop="creatorTime" >
|
<!-- prop="lastmodifytime">-->
|
||||||
<el-date-picker v-model="dataForm.creatorTime"
|
<!-- <el-date-picker v-model="dataForm.lastmodifytime"-->
|
||||||
placeholder="请选择" readonly clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
|
<!-- placeholder="请选择" readonly clearable :style='{"width":"100%"}' type="datetime"-->
|
||||||
|
<!-- format="yyyy-MM-dd HH:mm:ss" value-format="timestamp">-->
|
||||||
|
|
||||||
</el-date-picker>
|
<!-- </el-date-picker>-->
|
||||||
</el-form-item>
|
<!-- </el-form-item>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
</template>
|
<!-- <el-col :span="24">-->
|
||||||
</el-form>
|
<!-- <el-form-item label="修改人id"-->
|
||||||
|
<!-- prop="deleteUserId">-->
|
||||||
|
<!-- <el-input v-model="dataForm.deleteUserId"-->
|
||||||
|
<!-- placeholder="请输入" readonly clearable :style='{"width":"100%"}'>-->
|
||||||
|
|
||||||
|
<!-- </el-input>-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
|
<!-- <el-col :span="24">-->
|
||||||
|
<!-- <el-form-item label="创建人名称"-->
|
||||||
|
<!-- prop="creatorUserName">-->
|
||||||
|
<!-- <el-input v-model="dataForm.creatorUserName"-->
|
||||||
|
<!-- placeholder="请输入" readonly clearable :style='{"width":"100%"}'>-->
|
||||||
|
|
||||||
|
<!-- </el-input>-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
|
<!-- <el-col :span="24">-->
|
||||||
|
<!-- <el-form-item label="创建时间"-->
|
||||||
|
<!-- prop="creatorTime">-->
|
||||||
|
<!-- <el-date-picker v-model="dataForm.creatorTime"-->
|
||||||
|
<!-- placeholder="请选择" readonly clearable :style='{"width":"100%"}' type="datetime"-->
|
||||||
|
<!-- format="yyyy-MM-dd HH:mm:ss" value-format="timestamp">-->
|
||||||
|
|
||||||
|
<!-- </el-date-picker>-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
|
</template>
|
||||||
|
</el-form>
|
||||||
</el-row>
|
</el-row>
|
||||||
<span slot="footer" class="dialog-footer">
|
<span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="visible = false"> 取 消</el-button>
|
<el-button @click="visible = false"> 取 消</el-button>
|
||||||
<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail"> 确 定</el-button>
|
<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail"> 确 定</el-button>
|
||||||
</span>
|
</span>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import request from '@/utils/request'
|
import request from '@/utils/request'
|
||||||
import { getDataInterfaceRes } from '@/api/systemData/dataInterface'
|
import { getDataInterfaceRes } from '@/api/systemData/dataInterface'
|
||||||
import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
|
import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
|
||||||
export default {
|
|
||||||
components: {},
|
|
||||||
props: [],
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
visible: false,
|
|
||||||
loading: false,
|
|
||||||
isDetail: false,
|
|
||||||
dataForm: {
|
|
||||||
mName : '',
|
|
||||||
monitoringId : "",
|
|
||||||
serialnumber : '',
|
|
||||||
mStatus : "0",
|
|
||||||
flvAddress : '',
|
|
||||||
flvHdAddress : '',
|
|
||||||
channelNumber : '',
|
|
||||||
isEnable : "0",
|
|
||||||
lastmodifytime : '',
|
|
||||||
deleteUserId : '',
|
|
||||||
creatorUserName : '',
|
|
||||||
creatorTime : '',
|
|
||||||
},
|
|
||||||
rules:
|
|
||||||
{
|
|
||||||
mName: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入设备名称',
|
|
||||||
trigger: 'blur'
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
monitoringIdOptions:[],
|
|
||||||
mStatusOptions:[{"fullName":"在线","id":"1"},{"fullName":"不在线","id":"0"}],
|
|
||||||
isEnableOptions:[{"fullName":"显示","id":"1"},{"fullName":"不显示","id":"0"}],
|
|
||||||
|
|
||||||
}
|
export default {
|
||||||
},
|
components: {},
|
||||||
computed: {},
|
props: [],
|
||||||
watch: {},
|
data() {
|
||||||
created() {
|
return {
|
||||||
this.getmonitoringIdOptions();
|
visible: false,
|
||||||
},
|
loading: false,
|
||||||
mounted() {},
|
isDetail: false,
|
||||||
methods: {
|
dataForm: {
|
||||||
getmonitoringIdOptions() {
|
mName: '',
|
||||||
getDataInterfaceRes('370933183241262469').then(res => {
|
monitoringId: '',
|
||||||
let data = res.data.data
|
|
||||||
this.monitoringIdOptions = data
|
serialnumber: '',
|
||||||
})
|
mStatus: '0',
|
||||||
},
|
flvAddress: '',
|
||||||
clearData(data){
|
flvHdAddress: '',
|
||||||
for (let key in data) {
|
channelNumber: '',
|
||||||
if (data[key] instanceof Array) {
|
isEnable: '0',
|
||||||
data[key] = [];
|
lastmodifytime: '',
|
||||||
} else if (data[key] instanceof Object) {
|
deleteUserId: '',
|
||||||
this.clearData(data[key]);
|
creatorUserName: '',
|
||||||
} else {
|
creatorTime: ''
|
||||||
data[key] = "";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
init(id, isDetail) {
|
|
||||||
this.dataForm.id = id || 0;
|
|
||||||
this.visible = true;
|
|
||||||
this.isDetail = isDetail || false;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.$refs['elForm'].resetFields();
|
|
||||||
if(this.dataForm.id){
|
|
||||||
this.loading = true
|
|
||||||
request({
|
|
||||||
url: '/api/example/Monitoringitem/'+this.dataForm.id,
|
|
||||||
method: 'get'
|
|
||||||
}).then(res => {
|
|
||||||
this.dataInfo(res.data)
|
|
||||||
this.loading = false
|
|
||||||
});
|
|
||||||
}else{
|
|
||||||
this.clearData(this.dataForm)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.$store.commit('generator/UPDATE_RELATION_DATA', {})
|
|
||||||
},
|
|
||||||
// 表单提交
|
|
||||||
dataFormSubmit() {
|
|
||||||
this.$refs['elForm'].validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
this.request()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
request() {
|
|
||||||
var _data =this.dataList()
|
|
||||||
if (!this.dataForm.id) {
|
|
||||||
request({
|
|
||||||
url: '/api/example/Monitoringitem',
|
|
||||||
method: 'post',
|
|
||||||
data: _data
|
|
||||||
}).then((res) => {
|
|
||||||
this.$message({
|
|
||||||
message: res.msg,
|
|
||||||
type: 'success',
|
|
||||||
duration: 1000,
|
|
||||||
onClose: () => {
|
|
||||||
this.visible = false
|
|
||||||
this.$emit('refresh', true)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}else{
|
|
||||||
request({
|
|
||||||
url: '/api/example/Monitoringitem/'+this.dataForm.id,
|
|
||||||
method: 'PUT',
|
|
||||||
data: _data
|
|
||||||
}).then((res) => {
|
|
||||||
this.$message({
|
|
||||||
message: res.msg,
|
|
||||||
type: 'success',
|
|
||||||
duration: 1000,
|
|
||||||
onClose: () => {
|
|
||||||
this.visible = false
|
|
||||||
this.$emit('refresh', true)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
dataList(){
|
|
||||||
var _data = JSON.parse(JSON.stringify(this.dataForm));
|
|
||||||
return _data;
|
|
||||||
},
|
|
||||||
dataInfo(dataAll){
|
|
||||||
let _dataAll =dataAll
|
|
||||||
this.dataForm = _dataAll
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
rules:
|
||||||
|
{
|
||||||
|
mName: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请输入设备名称',
|
||||||
|
trigger: 'blur'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
monitoringIdOptions: [],
|
||||||
|
mStatusOptions: [{ 'fullName': '在线', 'id': '1' }, { 'fullName': '不在线', 'id': '0' }],
|
||||||
|
isEnableOptions: [{ 'fullName': '显示', 'id': '1' }, { 'fullName': '不显示', 'id': '0' }]
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
watch: {},
|
||||||
|
created() {
|
||||||
|
this.getmonitoringIdOptions()
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getmonitoringIdOptions() {
|
||||||
|
getDataInterfaceRes('370933183241262469').then(res => {
|
||||||
|
let data = res.data.data
|
||||||
|
this.monitoringIdOptions = data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
clearData(data) {
|
||||||
|
for (let key in data) {
|
||||||
|
if (data[key] instanceof Array) {
|
||||||
|
data[key] = []
|
||||||
|
} else if (data[key] instanceof Object) {
|
||||||
|
this.clearData(data[key])
|
||||||
|
} else {
|
||||||
|
data[key] = ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
init(id, isDetail) {
|
||||||
|
this.dataForm.id = id || 0
|
||||||
|
this.visible = true
|
||||||
|
this.isDetail = isDetail || false
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs['elForm'].resetFields()
|
||||||
|
if (this.dataForm.id) {
|
||||||
|
this.loading = true
|
||||||
|
request({
|
||||||
|
url: '/api/example/Monitoringitem/' + this.dataForm.id,
|
||||||
|
method: 'get'
|
||||||
|
}).then(res => {
|
||||||
|
this.dataInfo(res.data)
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.clearData(this.dataForm)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.$store.commit('generator/UPDATE_RELATION_DATA', {})
|
||||||
|
},
|
||||||
|
// 表单提交
|
||||||
|
dataFormSubmit() {
|
||||||
|
this.$refs['elForm'].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
this.request()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
request() {
|
||||||
|
var _data = this.dataList()
|
||||||
|
if (!this.dataForm.id) {
|
||||||
|
request({
|
||||||
|
url: '/api/example/Monitoringitem',
|
||||||
|
method: 'post',
|
||||||
|
data: _data
|
||||||
|
}).then((res) => {
|
||||||
|
this.$message({
|
||||||
|
message: res.msg,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1000,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false
|
||||||
|
this.$emit('refresh', true)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
request({
|
||||||
|
url: '/api/example/Monitoringitem/' + this.dataForm.id,
|
||||||
|
method: 'PUT',
|
||||||
|
data: _data
|
||||||
|
}).then((res) => {
|
||||||
|
this.$message({
|
||||||
|
message: res.msg,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1000,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false
|
||||||
|
this.$emit('refresh', true)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataList() {
|
||||||
|
var _data = JSON.parse(JSON.stringify(this.dataForm))
|
||||||
|
return _data
|
||||||
|
},
|
||||||
|
dataInfo(dataAll) {
|
||||||
|
let _dataAll = dataAll
|
||||||
|
this.dataForm = _dataAll
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Loading…
Reference in new issue