|
|
<template>
|
|
|
<el-dialog
|
|
|
class="addPhotoDialog"
|
|
|
:title="photoDialogTitle"
|
|
|
:visible.sync="photoDialog"
|
|
|
width="868px"
|
|
|
>
|
|
|
<el-form
|
|
|
label-position="left"
|
|
|
label-width="98px"
|
|
|
ref="formPhotoInfo"
|
|
|
:rules="rules"
|
|
|
:model="formInfo"
|
|
|
>
|
|
|
<el-form-item label="装置ID：" prop="cmdid" required>
|
|
|
<el-input v-model="formInfo.cmdid" auto-complete="on"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="SIM卡：" prop="simCard">
|
|
|
<el-input v-model="formInfo.simCard" auto-complete="on"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="杆塔编号：" prop="towerid" required>
|
|
|
<el-select
|
|
|
v-model="formInfo.towerid"
|
|
|
placeholder="请选择"
|
|
|
@change="changetowerid"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in toweridOptions"
|
|
|
:key="item.id"
|
|
|
:label="item.lineName"
|
|
|
:value="item.id"
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<!-- <el-input v-model="formInfo.towerid" auto-complete="on"></el-input> -->
|
|
|
</el-form-item>
|
|
|
|
|
|
<!-- <el-form-item label="线路编号：" prop="lineid" required>
|
|
|
<el-input v-model="formInfo.lineid" auto-complete="on"></el-input>
|
|
|
</el-form-item> -->
|
|
|
|
|
|
<el-form-item label="通道：" prop="channelVal" required>
|
|
|
<el-select
|
|
|
v-model="formInfo.channelVal"
|
|
|
multiple
|
|
|
placeholder="请选择"
|
|
|
@change="changeChannelId"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in channelOptions"
|
|
|
:key="item.id"
|
|
|
:label="item.channelname"
|
|
|
:value="item.id"
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="是否带云台：" prop="hasPan">
|
|
|
<!-- <el-input v-model="formInfo.hasPan"></el-input> -->
|
|
|
<el-radio-group v-model="formInfo.hasPan">
|
|
|
<el-radio :label="0">否</el-radio>
|
|
|
<el-radio :label="1">是</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="显示名：" prop="displayName">
|
|
|
<el-input v-model="formInfo.displayName"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="装置名称：" prop="equipName">
|
|
|
<el-input v-model="formInfo.equipName"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="装置型号：" prop="model">
|
|
|
<el-input v-model="formInfo.model"></el-input>
|
|
|
</el-form-item>
|
|
|
<!-- <el-form-item label="纬度：" prop="latitude">
|
|
|
<el-input v-model.number="formInfo.latitude"></el-input>
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="经度：" prop="longitude">
|
|
|
<el-input v-model.number="formInfo.longitude"></el-input>
|
|
|
</el-form-item> -->
|
|
|
<el-form-item label="原始 ID：" prop="orgId">
|
|
|
<el-input v-model="formInfo.orgId"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="版本号：" prop="essentialInfoVersion">
|
|
|
<el-input v-model="formInfo.essentialInfoVersion"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="出厂编号：" prop="bsIdentifier">
|
|
|
<el-input v-model="formInfo.bsIdentifier"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="生产厂家：" prop="bsManufacturer">
|
|
|
<el-input v-model="formInfo.bsManufacturer"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="生产日期：" prop="bsProductionDate">
|
|
|
<el-input v-model="formInfo.bsProductionDate"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="closeDialog(0)">取 消</el-button>
|
|
|
<el-button type="primary" @click="submitForm()">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
<script>
|
|
|
import {
|
|
|
addTerminalJoggle,
|
|
|
updateTerminalJoggle,
|
|
|
getAllChannelListJoggle,
|
|
|
getAllTowerJoggle,
|
|
|
} from "@/utils/api/index";
|
|
|
export default {
|
|
|
props: {
|
|
|
photoDialog: {
|
|
|
type: Boolean,
|
|
|
},
|
|
|
photoDialogTitle: {
|
|
|
type: String,
|
|
|
default: "新增",
|
|
|
},
|
|
|
formItem: {
|
|
|
type: Object,
|
|
|
default: function () {
|
|
|
return {};
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
data() {
|
|
|
let validCmid = (rule, value, callback) => {
|
|
|
let reg = /^[0-9A-Za-z]{17}$/;
|
|
|
if (!reg.test(value)) {
|
|
|
callback(new Error("装置id位17位编码"));
|
|
|
} else {
|
|
|
callback();
|
|
|
}
|
|
|
};
|
|
|
return {
|
|
|
page: 1, // 当前页数
|
|
|
pageSize: 10, // 每页数量
|
|
|
channelOptions: "",
|
|
|
channelArr: [],
|
|
|
toweridOptions: "",
|
|
|
toweridVal: "",
|
|
|
formInfo: {},
|
|
|
rules: {
|
|
|
// displayName: [
|
|
|
// { required: true, message: "请输入显示名", trigger: "blur" },
|
|
|
// ],
|
|
|
cmdid: [
|
|
|
{ required: true, message: "请输入装置ID", trigger: "blur" },
|
|
|
{ validator: validCmid, trigger: "blur" },
|
|
|
],
|
|
|
// lineid: [
|
|
|
// { required: true, message: "请输入线路编号", trigger: "blur" },
|
|
|
// ],
|
|
|
towerid: [
|
|
|
{ required: true, message: "请输入杆塔编号", trigger: "change" },
|
|
|
],
|
|
|
// hasPan: [
|
|
|
// { required: true, message: "请输入是否带云台", trigger: "change" },
|
|
|
// ],
|
|
|
channelVal: [
|
|
|
{ required: true, message: "请选择通道", trigger: "change" },
|
|
|
],
|
|
|
// equipName: [
|
|
|
// { required: true, message: "请输入装置名称", trigger: "blur" },
|
|
|
// ],
|
|
|
// model: [{ required: true, message: "请输入装置型号", trigger: "blur" }],
|
|
|
// latitude: [{ required: true, message: "请输入纬度", trigger: "blur" }],
|
|
|
// longitude: [{ required: true, message: "请输入经度", trigger: "blur" }],
|
|
|
// orgId: [{ required: true, message: "请输入原始 ID", trigger: "blur" }],
|
|
|
// essentialInfoVersion: [
|
|
|
// { required: true, message: "请输入版本号", trigger: "blur" },
|
|
|
// ],
|
|
|
// bsIdentifier: [
|
|
|
// { required: true, message: "请输入出厂编号", trigger: "blur" },
|
|
|
// ],
|
|
|
// bsManufacturer: [
|
|
|
// { required: true, message: "请输入生产厂家", trigger: "blur" },
|
|
|
// ],
|
|
|
// bsProductionDate: [
|
|
|
// { required: true, message: "请输入生产日期", trigger: "blur" },
|
|
|
// ],
|
|
|
},
|
|
|
//表单数组，对象
|
|
|
formArr: [],
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
// 保存确定操作
|
|
|
submitForm() {
|
|
|
this.$refs.formPhotoInfo.validate((valid) => {
|
|
|
if (valid) {
|
|
|
console.log(this.channelArr);
|
|
|
let formObj = {
|
|
|
bsIdentifier: this.formInfo.bsIdentifier,
|
|
|
bsManufacturer: this.formInfo.bsManufacturer,
|
|
|
bsProductionDate: this.formInfo.bsProductionDate,
|
|
|
cmdid: this.formInfo.cmdid,
|
|
|
displayName: this.formInfo.displayName,
|
|
|
equipName: this.formInfo.equipName,
|
|
|
essentialInfoVersion: this.formInfo.essentialInfoVersion,
|
|
|
hasPan: this.formInfo.hasPan,
|
|
|
latitude: this.formInfo.latitude,
|
|
|
//lineid: this.formInfo.lineid,
|
|
|
longitude: this.formInfo.longitude,
|
|
|
model: this.formInfo.model,
|
|
|
orgId: this.formInfo.orgId,
|
|
|
towerid: this.formInfo.towerid,
|
|
|
};
|
|
|
this.formArr.push(formObj);
|
|
|
console.log(this.formArr);
|
|
|
// 走保存请求
|
|
|
if (this.photoDialogTitle == "新增") {
|
|
|
addTerminalJoggle({ list: this.formArr })
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.$emit("photoDialogClose", 1); //关闭弹窗
|
|
|
this.formArr = [];
|
|
|
|
|
|
this.$message.success("添加成功");
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err); //代码错误、请求失败捕获
|
|
|
this.$message.error("添加失败");
|
|
|
});
|
|
|
} else if (this.photoDialogTitle == "修改") {
|
|
|
let changeformObj = {
|
|
|
bsIdentifier: this.formInfo.bsIdentifier,
|
|
|
bsManufacturer: this.formInfo.bsManufacturer,
|
|
|
bsProductionDate: this.formInfo.bsProductionDate,
|
|
|
cmdid: this.formInfo.cmdid,
|
|
|
displayName: this.formInfo.displayName,
|
|
|
equipName: this.formInfo.equipName,
|
|
|
essentialInfoVersion: this.formInfo.essentialInfoVersion,
|
|
|
hasPan: this.formInfo.hasPan,
|
|
|
latitude: this.formInfo.latitude,
|
|
|
// lineid: this.formInfo.lineid,
|
|
|
longitude: this.formInfo.longitude,
|
|
|
model: this.formInfo.model,
|
|
|
orgId: this.formInfo.orgId,
|
|
|
towerid: this.formInfo.towerid,
|
|
|
id: this.formInfo.id,
|
|
|
};
|
|
|
updateTerminalJoggle(changeformObj)
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.$emit("photoDialogClose", 1); //关闭弹窗
|
|
|
this.$message.success("修改成功");
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err); //代码错误、请求失败捕获
|
|
|
this.$message.error("修改失败");
|
|
|
});
|
|
|
}
|
|
|
} else {
|
|
|
console.log("error submit!!");
|
|
|
return false;
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
//取消关闭弹窗
|
|
|
closeDialog(flag) {
|
|
|
this.$refs.formPhotoInfo.resetFields();
|
|
|
this.formInfo.hasPan = 0;
|
|
|
this.$emit("photoDialogClose", flag);
|
|
|
},
|
|
|
//获取所有通道
|
|
|
getChannel() {
|
|
|
getAllChannelListJoggle()
|
|
|
.then((res) => {
|
|
|
this.channelOptions = res.data.list;
|
|
|
console.log(this.channelOptions);
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err);
|
|
|
});
|
|
|
},
|
|
|
//杆塔编号选择
|
|
|
getTowerid() {
|
|
|
getAllTowerJoggle()
|
|
|
.then((res) => {
|
|
|
this.toweridOptions = res.data.list;
|
|
|
console.log(this.channelOptions);
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err);
|
|
|
});
|
|
|
},
|
|
|
//通道id 选择
|
|
|
changeChannelId(val) {
|
|
|
console.log(val);
|
|
|
this.channelArr = val;
|
|
|
},
|
|
|
//通道id 选择
|
|
|
changetowerid(val) {
|
|
|
let opt = {};
|
|
|
opt = this.toweridOptions.find((item) => {
|
|
|
return item.lineName;
|
|
|
});
|
|
|
// let channelObj = {};
|
|
|
// channelObj = this.channelOption.find(function (i) {
|
|
|
// return i.value;
|
|
|
// });
|
|
|
console.log(opt.lineName);
|
|
|
//this.toweridVal = val;
|
|
|
},
|
|
|
},
|
|
|
mounted() {
|
|
|
console.log("打印传过来的对象", this.formItem);
|
|
|
console.log("打印传过来的对象", this.formItem.bsIdentifier);
|
|
|
this.formInfo = JSON.parse(JSON.stringify(this.formItem));
|
|
|
},
|
|
|
created() {
|
|
|
this.getChannel();
|
|
|
this.getTowerid();
|
|
|
},
|
|
|
watch: {
|
|
|
formItem: {
|
|
|
handler(newVal, oldVal) {
|
|
|
// 调用函数
|
|
|
this.$nextTick(() => {
|
|
|
this.formInfo = JSON.parse(JSON.stringify(this.formItem));
|
|
|
});
|
|
|
},
|
|
|
immediate: true,
|
|
|
deep: true,
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
.addPhotoDialog {
|
|
|
.el-dialog {
|
|
|
.el-form {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
.el-form-item {
|
|
|
width: 260px;
|
|
|
margin-right: 16px;
|
|
|
.el-form-item__label {
|
|
|
padding-right: 0px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style>
|