关联设备修改5

pull/33/head
lukeyan 1 year ago
parent 3a82dc90c9
commit eda71f5611

@ -392,7 +392,7 @@ export default {
/* 图片鼠标经过按钮 */
.btn {
margin-left: 25%;
margin-left: 20%;
margin-top: 25%;
button {

@ -11,196 +11,368 @@
<!-- 设备基础信息表单 -->
<div class="equipment_form">
<p>设备基础信息</p>
<el-form ref="equipmentForm" :model="equipmentForm">
<el-form-item label="企业名称">
<el-form
ref="equipmentForm"
:model="form"
:rules="rules"
:disabled="disabled"
>
<el-form-item label="企业名称" prop="companyName">
<el-select
v-model="equipmentForm.company.villageName"
ref="companySelect"
v-model="form.companyName"
placeholder="请选择企业"
>
<el-option
v-for="item in equipmentForm.company"
:key="item.villageCode"
:label="item.villageName"
:value="item.villageCode"
v-for="item in form.company"
:key="item.id"
:label="item.companyName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="设备名称">
<el-input v-model="equipmentForm.name"></el-input>
<el-form-item>
</el-form-item>
<el-form-item label="设备IP">
<el-input v-model="equipmentForm.ip"></el-input>
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model="form.deviceName"></el-input>
</el-form-item>
<el-form-item label="登录账号">
<el-input v-model="equipmentForm.passUser"></el-input>
<el-form-item label="设备IP" prop="deviceIp">
<el-input v-model="form.deviceIp"></el-input>
</el-form-item>
<el-form-item label="登录密码">
<el-input v-model="equipmentForm.passNum"></el-input>
<el-form-item label="登录账号" prop="account">
<el-input v-model="form.account"></el-input>
</el-form-item>
<el-form-item label="设备大类">
<el-input v-model="equipmentForm.big"></el-input>
<el-form-item label="登录密码" prop="password">
<el-input v-model="form.password"></el-input>
</el-form-item>
<el-form-item label="是否卡口">
<el-input v-model="equipmentForm.mouse"></el-input>
<el-form-item label="设备大类" prop="deviceVideoParentType">
<el-select
v-model="form.deviceVideoParentType"
placeholder="请选择设备大类"
>
<el-option
v-for="item in form.perception_type"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="设备小类">
<el-input v-model="equipmentForm.small"></el-input>
<el-form-item label="设备小类" prop="deviceVideoSubType">
<el-select
v-model="form.deviceVideoSubType"
placeholder="请选择设备小类"
>
<el-option
v-for="item in form.video_type"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<!-- 视频通道信息表单 -->
<div class="video_form">
<p>视频通道信息</p>
<el-form ref="videoForm" :model="videoForm">
<el-form-item label="通道编码">
<el-input v-model="videoForm.channelCode"></el-input>
<el-form
ref="videoForm"
:model="form"
:rules="rules"
:disabled="disabled"
>
<el-form-item label="通道编码" prop="gbsChannelNo">
<el-input v-model="form.gbsChannelNo"></el-input>
</el-form-item>
<el-form-item label="NVR编码">
<el-input v-model="videoForm.NVRCode"></el-input>
<el-form-item label="NVR编码" prop="gbsNvrNo">
<el-input v-model="form.gbsNvrNo"></el-input>
</el-form-item>
<el-form-item label="通道号">
<el-input v-model="videoForm.channelNum"></el-input>
<el-form-item label="通道号" prop="channelNo">
<el-input v-model="form.channelNo"></el-input>
</el-form-item>
<el-form-item label="RTSP流地址">
<el-input v-model="videoForm.address"></el-input>
<el-form-item label="RTSP流地址" prop="rtspAddress">
<el-input v-model="form.rtspAddress"></el-input>
</el-form-item>
</el-form>
</div>
<!-- 设备位置信息表单 -->
<div class="equipment_address_form">
<p>设备位置信息</p>
<el-form ref="addressForm" :model="addressForm">
<el-form-item label="设备经度">
<el-input v-model="addressForm.longitude"></el-input>
<el-form
ref="addressForm"
:model="form"
:rules="rules"
:disabled="disabled"
>
<el-form-item label="设备经度" prop="longitude">
<el-input v-model="form.longitude"></el-input>
</el-form-item>
<el-form-item label="设备纬度">
<el-input v-model="addressForm.latitude"></el-input>
<el-form-item label="设备纬度" prop="latitude">
<el-input v-model="form.latitude"></el-input>
</el-form-item>
<el-form-item label="U3D经度">
<el-input v-model="addressForm.U3D_longitude"></el-input>
<el-form-item label="U3D经度" prop="u3dLongitude">
<el-input v-model="form.u3dLongitude"></el-input>
</el-form-item>
<el-form-item label="U3D纬度">
<el-input v-model="addressForm.U3D_latitude"></el-input>
<el-form-item label="U3D纬度" prop="u3dLatitude">
<el-input v-model="form.u3dLatitude"></el-input>
</el-form-item>
<el-form-item label="设备高度">
<el-input v-model="addressForm.equipemnt_hight"></el-input>
<el-form-item label="设备高度" prop="deviceHeight">
<el-input v-model="form.deviceHeight"></el-input>
</el-form-item>
<el-form-item label="U3D高度">
<el-input v-model="addressForm.U3D_hight"></el-input>
<el-form-item label="U3D高度" prop="u3dHeight">
<el-input v-model="form.u3dHeight"></el-input>
</el-form-item>
<el-form-item label="设备方位">
<el-select
v-model="addressForm.equipment_orientation.orientationCode"
placeholder="请选择设备方位"
>
<el-form-item label="设备方位" prop="orientation">
<el-select v-model="form.orientation" placeholder="请选择设备方位">
<el-option
v-for="item in addressForm.equipment_orientation"
:key="item.orientationCode"
:label="item.orientation"
:value="item.orientationCode"
v-for="item in form.orientation_types"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="安装位置">
<el-input v-model="addressForm.equipment_position"></el-input>
<el-form-item label="安装位置" prop="deviceAddress">
<el-input v-model="form.deviceAddress"></el-input>
</el-form-item>
</el-form>
</div>
<!-- 设备其他信息表单 -->
<div class="other_form">
<p>设备其他信息</p>
<el-form ref="otherForm" :model="otherForm">
<el-form-item label="设备品牌">
<el-input v-model="otherForm.brand"></el-input>
<el-form ref="otherForm" :model="form" :disabled="disabled">
<el-form-item label="设备品牌" prop="deviceBrand">
<el-input v-model="form.deviceBrand"></el-input>
</el-form-item>
<el-form-item label="设备厂家">
<el-input v-model="otherForm.manufacturer"></el-input>
<el-form-item label="设备厂家" prop="manufactor">
<el-input v-model="form.manufactor"></el-input>
</el-form-item>
<el-form-item label="厂家联系电话">
<el-input v-model="otherForm.manufacturer_phone"></el-input>
<el-form-item label="厂家联系电话" prop="manufactorPhone">
<el-input v-model="form.manufactorPhone"></el-input>
</el-form-item>
<el-form-item label="SN号">
<el-input v-model="otherForm.SN_num"></el-input>
<el-form-item label="SN号" prop="deviceSn">
<el-input v-model="form.deviceSn"></el-input>
</el-form-item>
<el-form-item label="设备MAC">
<el-input v-model="otherForm.MAC"></el-input>
<el-form-item label="设备MAC" prop="deviceMac">
<el-input v-model="form.deviceMac"></el-input>
</el-form-item>
<el-form-item label="设备端口">
<el-input v-model="otherForm.port"></el-input>
<el-form-item label="设备端口" prop="devicePort">
<el-input v-model="form.devicePort"></el-input>
</el-form-item>
</el-form>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="saveFormData"> </el-button>
<el-button> </el-button>
<el-button
@click="
saveFormData('equipmentForm', 'videoForm', 'addressForm', 'otherForm')
"
> </el-button
>
<el-button @click="close()"> </el-button>
</div>
</el-dialog>
</template>
<script>
<script>
import {
commonDict,
getCompanyList,
addVideoList,
} from "@/api/correlationEquipment";
import { debounce } from "@/utils/publicMethod_lxy/debounce.js";
export default {
name: "addPerceptionDialog",
name: "addVideoDialog",
data() {
return {
visible: false,
dialogTitle: "新建",
equipmentForm: {
form: {
//
companyId: "",
companyName: "",
company: [],
mouse:'',
},
//
videoForm: {
channelCode: "",
NVRCode: "",
channelNum: "",
address: "",
},
//
addressForm: {
deviceName: "",
deviceIp: "",
deviceVideoParentType: "",
deviceParentType: "", //
video_type: [],
deviceVideoSubType: "", //
perception_type: [],
account: "",
password: "",
//
gbsChannelNo: "",
gbsNvrNo: "",
channelNo: "",
rtspAddress: "",
//
longitude: "",
latitude: "",
U3D_longitude: "",
U3D_latitude: "",
equipemnt_hight: "",
U3D_hight: "",
equipment_orientation: [],
equipment_position: "",
u3dLongitude: "",
u3dLatitude: "",
deviceHeight: "",
u3dHeight: "",
orientation: "",
orientation_types: [],
deviceAddress: "",
//
deviceBrand: "",
manufactor: "",
manufactorPhone: "",
deviceSn: "",
deviceMac: "",
devicePort: "",
isDoorwayVideo: "",
isShowVideo: "",
},
//
otherForm: {
brand: "",
manufacturer: "",
manufacturer_phone: "",
SN_num: "",
MAC: "",
port: "",
disabled: false, //
rules: {
companyName: [
{ required: true, message: "请选择企业", trigger: "change" },
],
deviceName: [
{ required: true, message: "请填写设备名称", trigger: "blur" },
],
deviceIp: [
{ required: true, message: "请填写设备ip", trigger: "blur" },
],
deviceVideoParentType: [
{ required: true, message: "请选择设备大类", trigger: "change" },
],
deviceVideoSubType: [
{ required: true, message: "请选择设备小类", trigger: "change" },
],
gbsChannelNo: [
{ required: true, message: "请输入通道编码", trigger: "blur" },
],
gbsNvrNo: [
{ required: true, message: "请输入NVR编码", trigger: "blur" },
],
longitude: [
{ required: true, message: "请输入设备经度", trigger: "blur" },
],
latitude: [
{ required: true, message: "请输入设备经度", trigger: "blur" },
],
deviceAddress: [
{ required: true, message: "请输入安装位置", trigger: "blur" },
],
},
};
},
created() {
//
const params = {
dictType: "device_video_sub_type",
};
commonDict(params).then((res) => {
this.form.video_type = res.data;
});
const val = {
dictType: "device_perception_sub_type",
};
//
commonDict(val).then((res) => {
this.form.perception_type = res.data;
});
//
const param_op = {
dictType: "orientation",
};
commonDict(param_op).then((res) => {
this.form.orientation_types = res.data;
});
//
getCompanyList().then((res) => {
this.form.company = res.data;
});
},
methods: {
open() {
open(num, row) {
this.visible = true;
if (num === "1") {
this.dialogTitle = "新建";
} else if (num === "2") {
this.dialogTitle = "编辑";
this.form = row;
} else if (num === "5") {
this.dialogTitle = "详情";
this.form = row;
this.disabled = true;
}
},
saveFormData: debounce(function () {
this.$message.success("232324234");
//
saveFormData: debounce(function (formName1, formName2, formName3) {
this.$refs[formName1].validate((valid1) => {
if (valid1) {
this.$refs[formName2].validate((valid2) => {
if (valid2) {
this.$refs[formName3].validate((valid3) => {
if (valid3) {
delete this.form.company;
delete this.form.video_type;
delete this.form.perception_type;
delete this.form.orientation_types;
this.form.companyId = this.$refs.companySelect.selected.value; // id
const params = this.form;
console.log("this.form", this.form);
if (this.dialogTitle === "新建") {
addVideoList(params)
.then((res) => {
this.visible = false;
this.$message({
message: res.msg,
type: "success",
});
})
.catch((err) => {
console.log(err); //
});
}
} else {
this.$message.warning("请填入必填项");
}
}); //
} else {
this.$message.warning("请填入必填项");
}
}); //
} else {
this.$message.warning("请填入必填项");
}
}); //
}, 300),
//
close() {
this.visible = false;
//
//
this.$refs['equipmentForm'].resetFields()
//
this.$refs['videoForm'].resetFields()
//
this.$refs['addressForm'].resetFields()
//
this.$refs['otherForm'].resetFields()
},
},
};
</script>
<style lang="less" scoped>
<style lang="less" scoped>
/deep/.el-dialog {
.el-dialog__title {
color: #fff;
text-shadow: 0 0 9px rgba(21, 255, 198, 0.64);
}
background-image: url("~@/assets/companyFile/dialogBack.png");
background-size: 100% 100%;
background-repeat: no-repeat;
height: 720px;
height: 750px;
/* 关闭弹窗叉号 */
.el-dialog__headerbtn {
@ -237,6 +409,7 @@ export default {
}
.form_body {
margin-top: 3%;
height: 600px;
overflow-y: scroll;
p {
@ -254,7 +427,9 @@ export default {
background: url("~@/assets/companyFile/242112.png") no-repeat !important;
background-size: 100% 100% !important;
}
.equipment_form {
margin-top: -2%;
}
.form_body::-webkit-scrollbar {
width: 6px;
background-color: #5e666a;

@ -18,7 +18,11 @@
:disabled="disabled"
>
<el-form-item label="企业名称" prop="companyName">
<el-select ref="companySelect" v-model="form.companyName" placeholder="请选择企业">
<el-select
ref="companySelect"
v-model="form.companyName"
placeholder="请选择企业"
>
<el-option
v-for="item in form.company"
:key="item.id"
@ -62,10 +66,10 @@
</el-option>
</el-select>
</el-form-item>
<el-form-item label="登录账号">
<el-form-item label="登录账号" prop="account">
<el-input v-model="form.account"></el-input>
</el-form-item>
<el-form-item label="登录密码">
<el-form-item label="登录密码" prop="password">
<el-input v-model="form.password"></el-input>
</el-form-item>
</el-form>
@ -85,10 +89,10 @@
<el-form-item label="NVR编码" prop="gbsNvrNo">
<el-input v-model="form.gbsNvrNo"></el-input>
</el-form-item>
<el-form-item label="通道号">
<el-form-item label="通道号" prop="channelNo">
<el-input v-model="form.channelNo"></el-input>
</el-form-item>
<el-form-item label="RTSP流地址">
<el-form-item label="RTSP流地址" prop="rtspAddress">
<el-input v-model="form.rtspAddress"></el-input>
</el-form-item>
</el-form>
@ -103,24 +107,24 @@
:disabled="disabled"
>
<el-form-item label="设备经度" prop="longitude">
<el-input v-model="form.longitude" ></el-input>
<el-input v-model="form.longitude"></el-input>
</el-form-item>
<el-form-item label="设备纬度" prop="latitude">
<el-input v-model="form.latitude"></el-input>
</el-form-item>
<el-form-item label="U3D经度">
<el-form-item label="U3D经度" prop="u3dLongitude">
<el-input v-model="form.u3dLongitude"></el-input>
</el-form-item>
<el-form-item label="U3D纬度">
<el-form-item label="U3D纬度" prop="u3dLatitude">
<el-input v-model="form.u3dLatitude"></el-input>
</el-form-item>
<el-form-item label="设备高度">
<el-form-item label="设备高度" prop="deviceHeight">
<el-input v-model="form.deviceHeight"></el-input>
</el-form-item>
<el-form-item label="U3D高度">
<el-form-item label="U3D高度" prop="u3dHeight">
<el-input v-model="form.u3dHeight"></el-input>
</el-form-item>
<el-form-item label="设备方位">
<el-form-item label="设备方位" prop="orientation">
<el-select v-model="form.orientation" placeholder="请选择设备方位">
<el-option
v-for="item in form.orientation_types"
@ -140,22 +144,22 @@
<div class="other_form">
<p>设备其他信息</p>
<el-form ref="otherForm" :model="form" :disabled="disabled">
<el-form-item label="设备品牌">
<el-form-item label="设备品牌" prop="deviceBrand">
<el-input v-model="form.deviceBrand"></el-input>
</el-form-item>
<el-form-item label="设备厂家">
<el-form-item label="设备厂家" prop="manufactor">
<el-input v-model="form.manufactor"></el-input>
</el-form-item>
<el-form-item label="厂家联系电话">
<el-form-item label="厂家联系电话" prop="manufactorPhone">
<el-input v-model="form.manufactorPhone"></el-input>
</el-form-item>
<el-form-item label="SN号">
<el-form-item label="SN号" prop="deviceSn">
<el-input v-model="form.deviceSn"></el-input>
</el-form-item>
<el-form-item label="设备MAC">
<el-form-item label="设备MAC" prop="deviceMac">
<el-input v-model="form.deviceMac"></el-input>
</el-form-item>
<el-form-item label="设备端口">
<el-form-item label="设备端口" prop="devicePort">
<el-input v-model="form.devicePort"></el-input>
</el-form-item>
</el-form>
@ -168,7 +172,7 @@
"
> </el-button
>
<el-button> </el-button>
<el-button @click="close()"> </el-button>
</div>
</el-dialog>
</template>
@ -260,6 +264,7 @@ export default {
};
},
created() {
//
const params = {
dictType: "device_video_sub_type",
};
@ -269,15 +274,18 @@ export default {
const val = {
dictType: "device_perception_sub_type",
};
//
commonDict(val).then((res) => {
this.form.perception_type = res.data;
});
//
const param_op = {
dictType: "orientation",
};
commonDict(param_op).then((res) => {
this.form.orientation_types = res.data;
});
//
getCompanyList().then((res) => {
this.form.company = res.data;
});
@ -296,6 +304,7 @@ export default {
this.disabled = true;
}
},
//
saveFormData: debounce(function (formName1, formName2, formName3) {
this.$refs[formName1].validate((valid1) => {
if (valid1) {
@ -307,17 +316,17 @@ export default {
delete this.form.video_type;
delete this.form.perception_type;
delete this.form.orientation_types;
this.form.companyId = this.$refs.companySelect.selected.value // id
this.form.companyId = this.$refs.companySelect.selected.value; // id
const params = this.form;
console.log("this.form", this.form);
if (this.dialogTitle === "新建") {
addVideoList(params)
.then((res) => {
this.visible = false;
this.$message({
message: res.msg,
type: "success",
});
this.visible = false;
this.$message({
message: res.msg,
type: "success",
});
})
.catch((err) => {
console.log(err); //
@ -336,6 +345,19 @@ export default {
}
}); //
}, 300),
//
close() {
this.visible = false;
//
//
this.$refs['equipmentForm'].resetFields()
//
this.$refs['videoForm'].resetFields()
//
this.$refs['addressForm'].resetFields()
//
this.$refs['otherForm'].resetFields()
},
},
};
</script>
@ -348,7 +370,7 @@ export default {
background-image: url("~@/assets/companyFile/dialogBack.png");
background-size: 100% 100%;
background-repeat: no-repeat;
height: 720px;
height: 750px;
/* 关闭弹窗叉号 */
.el-dialog__headerbtn {
@ -385,6 +407,7 @@ export default {
}
.form_body {
margin-top: 3%;
height: 600px;
overflow-y: scroll;
p {
@ -402,7 +425,9 @@ export default {
background: url("~@/assets/companyFile/242112.png") no-repeat !important;
background-size: 100% 100% !important;
}
.equipment_form {
margin-top: -2%;
}
.form_body::-webkit-scrollbar {
width: 6px;
background-color: #5e666a;

@ -375,7 +375,7 @@ export default {
width: calc(100% - 30px);
margin-top: 12px;
margin-left: 12px;
height: 27vh;
height: 30vh;
.el-table,
.el-table__expanded-cell {

@ -266,7 +266,7 @@ export default {
/* 左侧 */
.cardBodyLeft {
width: 25%;
height: 100%;
height: 97%;
background: rgba(23, 36, 36, 0.4);
border: 0.5px solid #485f6c;
border-radius: 4px;
@ -316,7 +316,7 @@ export default {
height: 69vh;
.el-tree {
/* 树形数据过长添加滚动条 */
height: 95%;
height: 96%;
overflow: auto;
// box-shadow: 5px 5px 10px #126a58;
border-radius: 4px;
@ -411,8 +411,8 @@ export default {
font-size: 18px;
text-shadow: 0 0 9px rgba(21, 255, 198, 0.64);
}
width: 75%;
height: 100%;
width: 74%;
height: 97%;
border-radius: 4px;
background: rgba(31, 45, 49, 0.4);
border: 0.5px solid #485f6c;

Loading…
Cancel
Save