xfapp/pages/deviceManage/deviceEdit/deviceEdit.vue

<template>
	<view class="appWrapper padding-top" style="height:calc(100vh - 250rpx);overflow:scroll">

		<form action="">
			<view class="form-item ">
				<view class="title">
					<text class="necessary">*</text>
					设备编号:
				</view>
				<input name="input" v-model="deviceDetailData.owner_code" disabled="disabled"></input>
			</view>
			<view class="form-item">
				<view class="title"><text class="necessary">*</text>设备名称:</view>
				<input name="input" v-model="deviceDetailData.owner_name"></input>
			</view>
			<view class="form-item">
				<view class="title"><text class="necessary">*</text>单元地址:</view>
				<input name="input" v-model="deviceDetailData.unitinfo"></input>
			</view>
			<view class="form-item selectBox">
				<view class="title"><text class="necessary">*</text>所属楼层:</view>
				<select name="" id="" v-model="deviceDetailData.louyu" clearable>
					<option value="">请选择</option>
					<option value="B10">楼层B10</option>
					<option value="B9">楼层B9</option>
					<option value="B8">楼层B8</option>
					<option value="B7">楼层B7</option>
					<option value="B6">楼层B6</option>
					<option value="B5">楼层B5</option>
					<option value="B4">楼层B4</option>
					<option value="B3">楼层B3</option>
					<option value="B2">楼层B2</option>
					<option value="B1">楼层B1</option>
					<!-- <option :value=item v-for="item in 60" >楼层{{item}}</option> -->
					<option :value=item v-for="item in 60" >楼层{{item}}</option>
				</select>
				<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
			</view>
			<view class="form-item ">
				<view class="title"><text class="necessary">*</text>物联网卡号:</view>
				<input name="input" v-model="deviceDetailData.sim"></input>
			</view>
			<view class="form-item selectBox">
				<view class="title"><text class="necessary">*</text>所属单位:</view>
				<select name="" id="" v-model="deviceDetailData.company" disabled="disabled" clearable>
					<option value="">请选择</option>
					<option :value="item.owner_code" v-for="(item,index) in companyListData" 
						style="width:80%">{{item.owner_name}}</option>
				</select>
				<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
			</view>
			<view class="form-item selectBox">
				<view class="title"><text class="necessary">*</text>设备类型:</view>
				<select name="" id="" placeholder="" v-model="deviceDetailData.dwtype" disabled="disabled" clearable>
					<option value="">请选择设备类型</option>
					<option value="1">用传</option>
					<option value="2">水表</option>
					<option value="3">烟感</option>
					<option value="4">消防栓</option>
					<option value="5">液位</option>
					<option value="6">RTU</option>
					<option value="7">电气火灾</option>
					<option value="16">视频监测</option>
				</select>
				<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
			</view>
			<view class="form-item selectBox">
				<view class="title"><text class="necessary">*</text>传输方式:</view>

				<select name="" id="" placeholder="" v-model="deviceDetailData.transfer_type" disabled="disabled" clearable>
					<option value="">请选择传输方式</option>
					<option v-if="deviceDetailData.dwtype==2||deviceDetailData.dwtype==5" value="NB">NB</option>
					<option value="4G">4G</option>
					<option  v-if="deviceDetailData.dwtype==2||deviceDetailData.dwtype==5" value="Lora">Lora</option>
				</select>
				<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
			</view>
			<view class="form-item margin-top">
				<view class="title">
					<text class="necessary">*</text>
					是否顶楼
				</view>
				<radio-group name="gender" @change="radioChange">
					<label class="margin-right">
						<radio value="1" :checked='deviceDetailData.is_top == 1'/><text>是</text>
					</label>
					<label>
						<radio value="0" :checked='deviceDetailData.is_top == 0' /><text>否</text>
					</label>
				</radio-group>
			</view>


			<!-- 水表NB必填参数 start -->
			<!-- <block v-if="this.transfer_type=='NB'&&(this.type==2||this.type==5)">
				<view class="form-item selectBox" >
					<view class="title"><text class="necessary">*</text>NB类型:</view>
					<select name="" id=""  v-model="deviceType">
						<option value="MultiSensor">水表</option>
						<option value="WaterMeter">宇洁戎情水表</option>
						<option value="topsailSensor">拓扑索尔</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox" >
					<view class="title"><text class="necessary">*</text>NB厂商名称:</view>
					<select name="" id="" v-model="manufacturerName">
						<option value="ST">ST</option>
						<option value="ZHYQ">ZHYQ</option>
						<option value="shanghaijunyanTest">shanghaijunyanTest</option>
						<option value="Topsail">Topsail</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox" >
					<view class="title"><text class="necessary">*</text>NB设备型号:</view>
					<select name="" id="" v-model="model">
						<option value="PT124B-2892-010">水表型号</option>
						<option value="WPTA">宇洁戎情水表型号</option>
						<option value="TH12">拓扑索尔水表液位</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox" >
					<view class="title"><text class="necessary">*</text>NB厂商id:</view>
					<select name="" id="" v-model="manufacturerId">
						<option value="ST">ST</option>
						<option value="ZHYQ">ZHYQ</option>
						<option value="JunyanTest">JunyanTest</option>
						<option value="Topsail">Topsail</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item" >
					<view class="title"><text class="necessary">*</text>NB地址:</view>
					<input name="input" v-model="location"></input>
				</view>
				<view class="form-item" >
					<view class="title"><text class="necessary">*</text>NB协议:</view>
					<input name="input" v-model="protocolType"></input>
				</view>
				
			</block> -->
			<!-- 水表NB必填参数 end -->
			
			<!-- 用传4G必填参数 -->
			<block v-if="deviceDetailData.dwtype==1&&deviceDetailData.transfer_type=='4G'">
				<view class="form-item selectBox"  >
					<view class="title"><text class="necessary">*</text>解析方法:</view>
					<select name="" id="" v-model="deviceDetailData.owner_xh_a" clearable>
						<option value="z">请选择</option>
						<option :value=index v-for="(item,index) in 8">方法{{index}}</option> 
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox">
					<view class="title"></view>
					<select name="" id="" v-model="deviceDetailData.owner_xh_b" clearable>
						<option value="z">请选择</option>
						<!-- <option :value=item v-for="item in 7" >方法{{item}}</option>  -->
						<option :value=index v-for="(item,index) in 8">方法{{index}}</option> 
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox">
					<view class="title"></view>
					<select name="" id="" v-model="deviceDetailData.owner_xh_c" clearable>
						<option value="z">请选择</option>
						<option :value=index v-for="(item,index) in 8">方法{{index}}</option> 
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				
			</block>
			<!-- 电气火灾参数 start -->
			<block v-if="deviceDetailData.dwtype==7&&deviceDetailData.transfer_type=='4G'">
				<view class="form-item selectBox">
					<view class="title"><text class="necessary">*</text>最高层:</view>
					<select name="" id="" v-model="deviceDetailData.max_level" clearable>
						<option value="">请选择</option>
						<option value="-10">楼层B10</option>
						<option value="-9">楼层B9</option>
						<option value="-8">楼层B8</option>
						<option value="-7">楼层B7</option>
						<option value="-6">楼层B6</option>
						<option value="-5">楼层B5</option>
						<option value="-4">楼层B4</option>
						<option value="-3">楼层B3</option>
						<option value="-2">楼层B2</option>
						<option value="-1">楼层B1</option>
						<option :value=item v-for="item in 60" >楼层{{item}}</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item selectBox">
					<view class="title"><text class="necessary">*</text>最底层:</view>
					<select name="" id="" v-model="deviceDetailData.min_level" clearable>
						<option value="">请选择</option>
						<option value="-10">楼层B10</option>
						<option value="-9">楼层B9</option>
						<option value="-8">楼层B8</option>
						<option value="-7">楼层B7</option>
						<option value="-6">楼层B6</option>
						<option value="-5">楼层B5</option>
						<option value="-4">楼层B4</option>
						<option value="-3">楼层B3</option>
						<option value="-2">楼层B2</option>
						<option value="-1">楼层B1</option>
						<option :value=item v-for="item in 60" >楼层{{item}}</option>
					</select>
					<text class="icon iconfont margin-right-sm margin-left">&#xe63d;</text>
				</view>
				<view class="form-item ">
					<view class="title">
						<text class="necessary">*</text>
						倍率:
					</view>
					<input name="input" v-model="deviceDetailData.owner_bl"></input>
				</view>
			</block>
			<!-- 电气火灾参数 end -->
			

			<view class="btn-area submitBottomBtn padding-lr-sm">
				<button class="bg-blue round  margin-top" @tap="submit()">提 交 </button>
			</view>
		</form>


	</view>
</template>

<script>
	export default {

		data() {
			return {

				companyListData: [],
				index: -1,

				"device_code":"",
				"device_name":"",
				"unitinfo":"",
				"louyu": "",
				"sim":"",
				company_code: 0,
				
				"type":0,
				transfer_type: 0,
				
				"owner_bl":"",//倍率
				"is_top":"0", //是否顶楼
				
				"deviceType":"",
				"manufacturerName":"",
				"model":"",
				"location":"",
				"protocolType":"",
				"manufacturerId":"",
				
				"min_level":"",
				"max_level":"",
				
				"radioOne":0,
				
				"owner_xh_a":'z',
				"owner_xh_b":'z',
				"owner_xh_c":'z',
				
				
				deviceDetailData:{}

				


			}
		},
		onLoad: function(option) {
			this.getSiteList();
			this.getDeviceDetail({
				"device_code":option.device_code
			})



		},
		watch: {
			
		},
		methods: {
			
			// 修改回显请求
			async getDeviceDetail(params = {}) {
				const res = await this.$myRequest({
					url: 'DeviceConfig/getDeviceListEcho',
					showLoading: true,
					data: params
				})
				this.deviceDetailData=res.data.data[0];
			},


			async submit() {
				//修改提交验证
				
				
				// if (!this.deviceDetailData.owner_code) {
				// 	uni.showToast({
				// 		title: "请输入设备编号",
				// 		icon: "none"
				// 	});
				// 	return
				// }else{
				// 	var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{2,100}$/;
				// 	if(!reg.test(this.deviceDetailData.owner_code)){
				// 		uni.showToast({
				// 			title: "请输入字母和数字结合的设备编号",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// }
					
				if (!this.deviceDetailData.owner_name.replace(/^\s*/g,'')) {
					uni.showToast({
						title: "请输入设备名称",
						icon: "none"
					});
					return
				}
				if (!this.deviceDetailData.unitinfo.replace(/^\s*/g,'')) {
					uni.showToast({
						title: "请输入单元地址",
						icon: "none"
					});
					return
				}
				if (!this.deviceDetailData.louyu) {
					uni.showToast({
						title: "请选择所属楼层",
						icon: "none"
					});
					return
				}
				if (!this.deviceDetailData.sim.replace(/^\s*/g,'')) {
					uni.showToast({
						title: "请输入物联网卡号",
						icon: "none"
					});
					return
				}
				// if (!this.deviceDetailData.company) {
				// 	uni.showToast({
				// 		title: "请选择所在单位",
				// 		icon: "none"
				// 	});
				// 	return
				// }
				// if (!this.deviceDetailData.dwtype) {
				// 	uni.showToast({
				// 		title: "请选择设备类型",
				// 		icon: "none"
				// 	});
				// 	return
				// }
				// if (!this.deviceDetailData.transfer_type) {
				// 	uni.showToast({
				// 		title: "请选择传输方式",
				// 		icon: "none"
				// 	});
				// 	return
				// }
				if(!this.radioOne&&!this.deviceDetailData.is_top){
					uni.showToast({
						title: "请选择是否为顶楼",
						icon: "none"
					});
					return
				}
				
				if(this.deviceDetailData.dwtype==1&&this.deviceDetailData.transfer_type=="4G"){
					if (this.deviceDetailData.owner_xh_a=='z') {
						uni.showToast({
							title: "请选择第一个解析方法",
							icon: "none"
						});
						return
					}
					if (this.deviceDetailData.owner_xh_b=='z') {
						uni.showToast({
							title: "请选择第二个解析方法",
							icon: "none"
						});
						return
					}
					if (this.deviceDetailData.owner_xh_c=='z') {
						uni.showToast({
							title: "请选择第三个解析方法",
							icon: "none"
						});
						return
					}
				}
				
				// if(this.transfer_type=='NB'&&(this.type==2||this.type==5)){
				// 	if (!this.deviceType) {
				// 		uni.showToast({
				// 			title: "请选择水表NB设备类型",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// 	if (!this.manufacturerName) {
				// 		uni.showToast({
				// 			title: "请选择水表NB厂商名称",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// 	if (!this.model) {
				// 		uni.showToast({
				// 			title: "请选择水表NB设备型号",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// 	if (!this.manufacturerId) {
				// 		uni.showToast({
				// 			title: "请选择水表NB厂商ID",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// 	if (!this.location.replace(/^\s*/g,'')) {
				// 		uni.showToast({
				// 			title: "请输入水表NB地址",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// 	if (!this.protocolType.replace(/^\s*/g,'')) {
				// 		uni.showToast({
				// 			title: "请输入水表NB协议",
				// 			icon: "none"
				// 		});
				// 		return
				// 	}
				// }
				
				
				if(this.deviceDetailData.dwtype==7&&this.deviceDetailData.transfer_type=='4G'){
					if (!this.deviceDetailData.max_level) {
						uni.showToast({
							title: "请选择最高层",
							icon: "none"
						});
						return
					}
					if (!this.deviceDetailData.min_level) {
						uni.showToast({
							title: "请选择最低层",
							icon: "none"
						});
						return
					}
					
				
					if (!this.deviceDetailData.owner_bl.replace(/^\s*/g,'')) {
						uni.showToast({
							title: "请输入倍率",
							icon: "none"
						});
						return
					}
				}
	
				let queryParam = {};
				queryParam.device_code = this.deviceDetailData.owner_code;
				queryParam.device_name = this.deviceDetailData.owner_name;
				queryParam.unitinfo = this.deviceDetailData.unitinfo;
				queryParam.louyu = this.deviceDetailData.louyu;
				queryParam.sim = this.deviceDetailData.sim;
				queryParam.is_top = this.radioOne;
				
				// queryParam.transfer_type = this.transfer_type;
				// queryParam.owner_name = this.device_name;
				// queryParam.company_code = this.company_code;
				// queryParam.type = this.type;
				
				
				
				if (this.deviceDetailData.dwtype==1&&this.deviceDetailData.transfer_type=="4G") {
					alert(1)
					queryParam.owner_xh_a = this.deviceDetailData.owner_xh_a;  //
					queryParam.owner_xh_b = this.deviceDetailData.owner_xh_b;  //
					queryParam.owner_xh_c = this.deviceDetailData.owner_xh_c;  //
					this.addDevice(queryParam)
					return;
				}
				// if (this.transfer_type=='NB'&&(this.type==2||this.type==5)) {
				// 	alert(2)
				// 	queryParam.deviceType = this.deviceType;
				// 	queryParam.manufacturerName = this.manufacturerName;
				// 	queryParam.model = this.model;
				// 	queryParam.location = this.location;
				// 	queryParam.protocolType = this.protocolType;
				// 	queryParam.manufacturerId = this.manufacturerId;
				// 	this.addDevice(queryParam)
				// 	return;
				// }
				if (this.deviceDetailData.dwtype==7&&this.deviceDetailData.transfer_type=='4G') {
					alert(3)
					queryParam.max_level = this.deviceDetailData.max_level;  //
					queryParam.min_level = this.deviceDetailData.min_level; //
					queryParam.owner_bl = this.deviceDetailData.owner_bl;   //
					this.addDevice(queryParam)
					return;
				}
				this.addDevice(queryParam)
			
			},
			
			async addDevice(params = {}) {
				const res = await this.$myRequest({
					url: 'DeviceConfig/upDevice',
					data: params
				})
				if (res.data.flag) {
					// uni.showToast({
					// 	title: "提交成功",
					// });
					// setTimeout(() => {
					// 	uni.navigateTo({
					// 		url: '/pages/deviceManage/deviceManage',
					// 	});
					// }, 1000);
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/accountManage/success/success',
						});
					}, 1000);
				}
			},
			
			

			radioChange(e) {
				console.log('type:' + e.detail.value);
				this.radioOne = e.detail.value;
			},

			//单位下拉请求数据
			async getSiteList() {
				const res = await this.$myRequest({
					url: 'Index/getCompanyList',
				})
				this.companyListData = res.data.data;
			},






		}
	}
</script>




<style lang="scss">
	input,
	select,
	option {
		line-height: 70rpx;
		padding: 0 20rpx;
		height: 70rpx;
		border: 1px solid #EDEDED;
		// width:500rpx!important;
		background-color: #fff;
		box-sizing: border-box;
		appearance: none;
		-moz-appearance: none;
		-webkit-appearance: none;
		color: #999;
	}




	/* 站点多选下拉样式end */
</style>