bigDataApp/pages/cb/cbd/equip-set/equip-set.vue

<template>
	<view>
		<view class="tit adminTit">
			联网模块
		</view>
		<view class="btns">
			 <button type="warn" size="mini">升级</button>
			 <button type="warn" size="mini">重启</button>
			 <button type="warn" size="mini">MQTT配置</button>
		</view>
		<view class="tit adminTit">
			板子设置
		</view>
		<view class="btns">
			 <button type="warn" size="mini">查看原始IMEI</button>
			 <button type="warn" size="mini">更改IMEI</button>
		</view>
		<view class="tit adminTit">
			强制操作
		</view>
		<view class="btns">
			<button type="warn" size="mini">拍照</button>
			<button type="warn" size="mini">升级</button>
			<button type="warn" size="mini">重启</button>
			<button type="warn" size="mini">震动关闭</button>
			<button type="warn" size="mini">震动开启</button>
		</view>
		<view class="tit">
			设备开关
		</view>
		<view class="uni-list-cell">
			 <picker @change="turnChange($event,'ds')" value="equipContrlForm.ds" :range="dsArr">
				<text class="uni-input">{{dsArr[equipContrlForm.ds]}}</text>
				<view class="arrow"></view>
			</picker>
		</view>
		<view class="tit">
			工作模式
		</view>
		<view class="uni-list-cell">
			 <picker @change="turnChange($event,'ws')" :value="equipContrlForm.ws" :range="wsArr">
				<text class="uni-input">{{wsArr[equipContrlForm.ws]}}</text>
				<view class="arrow"></view>
			</picker>
		</view>
		<view class="tit">
			定时模式
		</view>
		<view class="uni-list-cell">
			 <picker @change="turnChange($event,'ts')" :value="equipContrlForm.ts" :range="tsArr">
				<text class="uni-input">{{tsArr[equipContrlForm.ts]}}</text>
				<view class="arrow"></view>
			</picker>
		</view>
		<template v-if="equipContrlForm.ts==0">
			<view class="tit">
				定时时长(h)
			</view>
			<view class="">
				<slider :value="equipContrlForm.tt" show-value="true" :min="1" :max="10" @change="sliderChange($event,'tt')"  block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		</template>
		<template v-if="equipContrlForm.ts==1">
			<view class="tit">
				开始结束时间
			</view>
			<view class="selectTime">
				<view class="uni-list-cell time" @click="selectTime('st')">
					<text>{{stLabel}}</text>
					<u-icon name="clock"></u-icon>
				</view>
				<text class="line">-</text>
				<view class="uni-list-cell time" @click="selectTime('et')">
					<text>{{etLabel}}</text>
					<u-icon name="clock"></u-icon>
				</view>
			</view>
			<u-select v-model="stShow" mode="single-column" :list="list" @confirm="stConfirm"></u-select>
			<u-select v-model="etShow" mode="single-column" :list="list" @confirm="etConfirm"></u-select>
		</template>
		<view class="tit">
			落虫时间(min)
		</view>
		<view class="">
			<slider :value="equipContrlForm.collt" show-value="true" :min="1" :max="20" @change="sliderChange($event,'collt')"  block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="tit">
			加热时间(min)
		</view>
		<view class="">
			<slider :value="equipContrlForm.htim" show-value="true" :min="1" :max="20" @change="sliderChange($event,'htim')" block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="tit">
			加热温度(℃)
		</view>
		<view class="">
			<slider :value="equipContrlForm.hst" show-value="true" :min="75" :max="120" @change="sliderChange($event,'hst')"  block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="tit">
			高温保护阈值(℃)
		</view>
		<view class=""> 
			<slider :value="equipContrlForm.tph" show-value="true" :min="50" :max="70" @change="sliderChange($event,'tph')" block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="tit">
			低温保护阈值(℃)
		</view>
		<view class="">
			<slider :value="equipContrlForm.tpl" show-value="true" :min="1" :max="10" @change="sliderChange($event,'tpl')" block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="tit">
			数据上传间隔(min)
		</view>
		<view class="">
			<slider :value="equipContrlForm.datt" show-value="true" :min="10" :max="60" @change="sliderChange($event,'datt')" block-color="#57C878" activeColor="#57C878" step="1" />
		</view>
		<view class="submit-box">
			<u-button  @click="submit" type="success">确定</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				d_id:'',
				dsArr:['开机','关机'],
				dsIndex:0,
				wsArr:['待机','工作'],
				wsIndex:0,
				tsArr:['光控','时控'],
				tsIndex:0,
				imgresArr:['高','中','低'],
				imgresIndex:"",
				equipContrlForm:{
					ds:0,//设备开关
					ws:0,//工作模式
					ts:0,//定时模式
					tt:1,//定时时长
					collt: 1,
					htim: 1,
					hst: 75,
					tph: 50,
					tpl: 1,
					datt: 10,
					st: null,
					et: null,
				},
				stShow:false,
				etShow:false,
				stLabel:'00:00',
				etLabel:'00:00',
				list:[
					{
					value:0,
					label:'00:00'
					},
					{
					value:1,
					label:'01:00'
					},
					{
					value:2,
					label:'02:00'
					},
					{
					value:3,
					label:'03:00'
					},
					{
					value:4,
					label:'04:00'
					},
					{
					value:5,
					label:'05:00'
					},
					{
					value:6,
					label:'06:00'
					},
					{
					value:7,
					label:'04:00'
					},	{
					value:8,
					label:'08:00'
					},
					{
					value:9,
					label:'09:00'
					},
					{
					value:10,
					label:'10:00'
					},
					{
					value:11,
					label:'11:00'
					},
					{
					value:12,
					label:'12:00'
					},
					{
					value:13,
					label:'13:00'
					},
					{
					value:14,
					label:'14:00'
					},	{
					value:15,
					label:'15:00'
					},
					{
					value:16,
					label:'16:00'
					},
					{
					value:17,
					label:'17:00'
					},
					{
					value:18,
					label:'18:00'
					},
					{
					value:19,
					label:'19:00'
					},
					{
					value:20,
					label:'20:00'
					},
					{
					value:21,
					label:'21:00'
					},	{
					value:22,
					label:'22:00'
					},
					{
					value:23,
					label:'23:00'
					},
				]
			}
		},
		onLoad(option){
			this.d_id=option.d_id
			this.getInfo()
		},
		methods: {
			turnChange(e,a){
				if(a=='ds'){
					// this.dsIndex = e.target.value
					this.equipContrlForm.ds=e.target.value 
				}else if(a=='ws'){
					// this.wsIndex = e.target.value
					this.equipContrlForm.ws=e.target.value
				}else if(a=='ts'){
					// this.tsIndex = e.target.value
					this.equipContrlForm.ts=e.target.value
				}
			},
			stConfirm(e){
				this.stLabel=e[0].label
				this.equipContrlForm.st=e[0].value
			},
			etConfirm(e){
				this.etLabel=e[0].label
				this.equipContrlForm.et=e[0].value
			},
			selectTime(a){
				if(a=='st'){
					this.stShow=true;
				}else{
					this.etShow=true;
				}
			},
			sliderChange(e,a){
				let val=e.detail.value
				switch(a){
					case 'tt':
						this.equipContrlForm.tt=val;
						break;
					case 'collt':
						this.equipContrlForm.collt=val;
						break;
					case 'htim':
						this.equipContrlForm.htim=val;
						break;
					case 'hst':
						this.equipContrlForm.hst=val;
						break;
					case 'tph':
						this.equipContrlForm.tph=val;
						break;
					case 'tpl':
						this.equipContrlForm.tpl=val;
						break;
					case 'datt':
						this.equipContrlForm.datt=val;
						break;
				}
			},
			async getInfo(){
				let res=await this.$myRequest({
					url:'/api/api_gateway?method=forecast.send_control.device_control_info',
					data:{
						d_id:this.d_id,
						cmd: 'paramconf'
					}
				})
				this.equipContrlForm=res
				console.log(res)
			},
			async submit(){
				console.log(this.equipContrlForm)
				let res=await this.$myRequest({
					url:'/api/api_gateway?method=forecast.send_control.device_control',
					data:{
						device_type_id:'',
						d_id: this.d_id,
						config: JSON.stringify(this.equipContrlForm)
					}
				})
			}
			
		}
	}
</script>

<style lang="scss">
	page{
		padding:20rpx;
		.tit{
			line-height:30rpx;
			font-size:30rpx;
			padding-left:20rpx;
			border-left-width:2px;
			border-left-style: solid;
			border-left-color:$uni-color-success;
			margin:30rpx 0;
			}
		.adminTit{border-left-color:#e64340;}
		.btns{
			display:flex;
			justify-content: flex-start;
			flex-wrap:no-wrap;
			button{margin:0;margin-right:10rpx;padding:0 25rpx;}
		}
		.uni-list-cell{
			background:#F7F8FA;
			padding:10rpx 40rpx;
			font-size:28rpx;
			.arrow{
				display:inline-block;
				border-width:12rpx 8rpx ;
				border-style: solid;
				float:right;
				margin-top:10rpx;
				border-color:#888 transparent transparent transparent;
			}
		}
		.selectTime{
			display:flex;
			.time{
				width:350rpx;
				display:flex;
				justify-content: space-between;
			}
			.line{width:50rpx;text-align: center;}
		}
		.submit-box{
			margin-top:60rpx
		}

  
	}
	

</style>