|
@ -2,42 +2,227 @@
|
|
<div class='temperatureIndex'>
|
|
<div class='temperatureIndex'>
|
|
<div class='bgc-17b3ec ptb10 plr15 c-fff c-f14'>
|
|
<div class='bgc-17b3ec ptb10 plr15 c-fff c-f14'>
|
|
<div class='flex f_y_c f_x_s'>
|
|
<div class='flex f_y_c f_x_s'>
|
|
<span>设备实时温度</span>
|
|
|
|
|
|
<span>设备实时温湿度</span>
|
|
<van-button size="small" type="text" class='tbtn w60 bgc-fff c-17B3EC'>获取</van-button>
|
|
<van-button size="small" type="text" class='tbtn w60 bgc-fff c-17B3EC'>获取</van-button>
|
|
</div>
|
|
</div>
|
|
<div class='c-f20'>22°</div>
|
|
|
|
|
|
<div class='c-f20'>22°<span class='ml20'>70%</span></div>
|
|
<div class='mt10'>设备实时温度每10分钟会从设备端返回一次</div>
|
|
<div class='mt10'>设备实时温度每10分钟会从设备端返回一次</div>
|
|
</div>
|
|
</div>
|
|
<div class='mt10 p10 bgc-fff c-f14 c-333 c-border-tb'>
|
|
<div class='mt10 p10 bgc-fff c-f14 c-333 c-border-tb'>
|
|
<div class='flex f_y_c'>
|
|
<div class='flex f_y_c'>
|
|
<span>温度控制:</span>
|
|
<span>温度控制:</span>
|
|
<van-switch @click="gotoUrl('/device/temperature/turnControl')" inactive-color='#ccc' active-color='#17b3ec' v-model="checked" />
|
|
|
|
|
|
<van-switch @change='temperatureChange' inactive-color='#ccc' active-color='#17b3ec' v-model="form.temperaturecontrol" />
|
|
</div>
|
|
</div>
|
|
<div class='mt10' v-show='checked'>温度控制值为 {{'22°'}}</div>
|
|
|
|
|
|
<div class='mt10' v-show='form.temperaturecontrol'>温度控制值为 {{form.temperature?form.temperature+'°':''}}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if='form.temperaturecontrol'>
|
|
|
|
<div class='c-333 c-f14 bgc-fff p15 c-border-b' >
|
|
|
|
<div class='flex f_y_c'>
|
|
|
|
<span>加热控制:</span>
|
|
|
|
<van-radio-group class='ml20' v-model="form.heat" direction="horizontal">
|
|
|
|
<van-radio :name="0">关闭</van-radio>
|
|
|
|
<van-radio :name="1">开启</van-radio>
|
|
|
|
</van-radio-group>
|
|
|
|
</div>
|
|
|
|
<div class='flex mt20'>
|
|
|
|
<div class='lh46'>请设置目标温度值:</div>
|
|
|
|
<div style='flex:1' class='ml10'>
|
|
|
|
<div class='flex f_y_c'><van-field class='c-border w80' v-model="form.temperature" maxlength='2' type="digit" /><span class='ml10'>度</span></div>
|
|
|
|
<!-- <van-notice-bar class='bgc-fff pl0' wrapable :scrollable="false" >可输入的值范围为: {{form.heat==0?'2-25°':form.heat==1?'20-40°':''}}</van-notice-bar> -->
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class='mt10'>最后一次发送的温度值为 22°</div>
|
|
|
|
<div class='mt10 c-999'>指令发送成功后,请等待设备生效,设备每隔十分钟左右会返回一次最新实时温度值</div>
|
|
|
|
</div>
|
|
|
|
<div class='mt10 p10 bgc-fff c-f14 c-333 c-border-tb' v-if='form.temperaturecontrol'>
|
|
|
|
<div class='flex f_y_c'>
|
|
|
|
<span>温度预警:</span>
|
|
|
|
<van-switch inactive-color='#ccc' active-color='#17b3ec' v-model="checked1" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div v-if='checked1'>
|
|
|
|
<div class='flex c-333 c-f14 bgc-fff p15'>
|
|
|
|
<div class='lh46'>当温度高于:</div>
|
|
|
|
<div style='flex:1' class='ml10'>
|
|
|
|
<div class='flex f_y_c'><van-field class='c-border w80' v-model="form.warningTemperatureHeight" maxlength='2' type="digit" /><span class='mlr10'>度</span>时进行预警</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class='flex c-333 c-f14 bgc-fff p15 c-border-b'>
|
|
|
|
<div class='lh46'>当温度低于:</div>
|
|
|
|
<div style='flex:1' class='ml10'>
|
|
|
|
<div class='flex f_y_c'><van-field class='c-border w80' v-model="form.warningTemperatureLow" maxlength='2' type="digit" /><span class='mlr10'>度</span>时进行预警</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class='mb100'>
|
|
|
|
<div class='mt10 p10 bgc-fff c-f14 c-333 c-border-tb'>
|
|
|
|
<div class='flex f_y_c'>
|
|
|
|
<span>湿度控制:</span>
|
|
|
|
<van-switch @change='humidityChange' inactive-color='#ccc' active-color='#17b3ec' v-model="form.humiditycontrol" />
|
|
|
|
</div>
|
|
|
|
<div class='mt10' v-show='form.humiditycontrol'>湿度控制值为 {{form.humidity?form.humidity+'%':''}}</div>
|
|
|
|
</div>
|
|
|
|
<div class='c-333 c-f14 bgc-fff p15 c-border-b' v-if='form.humiditycontrol'>
|
|
|
|
<div>请设置目标湿度值:</div>
|
|
|
|
<div class='flex f_y_c mt20 pl15'>
|
|
|
|
<van-slider button-size='30px' v-model="form.humidity" @change="onChange" />
|
|
|
|
<div class='ml15'>{{form.humidity}}%</div>
|
|
|
|
</div>
|
|
|
|
<div class='mt20'>最后一次发送的湿度调整值为%</div>
|
|
|
|
<div class='mt10 c-999'>指令发送成功后,请等待设备生效,设备每隔十分钟左右会返回一次最新实时湿度值</div>
|
|
|
|
</div>
|
|
|
|
<div class='mt10 p10 bgc-fff c-f14 c-333 c-border-tb' v-if='form.humiditycontrol'>
|
|
|
|
<div class='flex f_y_c'>
|
|
|
|
<span>湿度预警:</span>
|
|
|
|
<van-switch inactive-color='#ccc' active-color='#17b3ec' v-model="checked2" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div v-if='checked2'>
|
|
|
|
<div class='flex c-333 c-f14 bgc-fff p15'>
|
|
|
|
<div class='lh46'>当湿度高于:</div>
|
|
|
|
<div style='flex:1' class='ml10'>
|
|
|
|
<div class='flex f_y_c'><van-field class='c-border w80' v-model="form.waringHumidityHeight" maxlength='2' type="digit" /><span class='mlr10'>%</span>时进行预警</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class='flex c-333 c-f14 bgc-fff p15 c-border-b'>
|
|
|
|
<div class='lh46'>当湿度低于:</div>
|
|
|
|
<div style='flex:1' class='ml10'>
|
|
|
|
<div class='flex f_y_c'><van-field class='c-border w80' v-model="form.waringHumidityLow" maxlength='2' type="digit" /><span class='mlr10'>%</span>时进行预警</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class='c-position-f b0 ptb15 bgc-fff c-border-t' style='width:100%'><van-button class="w100_60 ml30 " color='#17b3ec' round @click="save">保存</van-button></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
|
|
import medicineAbinetApi from '@/api/api-medicineAbinet'
|
|
export default{
|
|
export default{
|
|
name: 'temperatureIndex',
|
|
name: 'temperatureIndex',
|
|
data(){
|
|
data(){
|
|
return {
|
|
return {
|
|
checked: false
|
|
|
|
|
|
checked1: '',
|
|
|
|
checked2: '',
|
|
|
|
form:{
|
|
|
|
deviceId: this.$route.query.id,
|
|
|
|
humidity: '',
|
|
|
|
temperature: '',
|
|
|
|
humiditycontrol: '',
|
|
|
|
temperaturecontrol:'',
|
|
|
|
heat: '',
|
|
|
|
warningTemperatureHeight: '',
|
|
|
|
waringHumidityHeight: '',
|
|
|
|
warningTemperatureLow: '',
|
|
|
|
waringHumidityLow: '',
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
watch:{
|
|
|
|
checked1(n){
|
|
|
|
if(!n){
|
|
|
|
this.form.warningTemperatureLow = '';
|
|
|
|
this.form.warningTemperatureHeight = '';
|
|
|
|
}
|
|
|
|
},
|
|
|
|
checked2(n){
|
|
|
|
if(!n){
|
|
|
|
this.form.waringHumidityHeight = '';
|
|
|
|
this.form.waringHumidityLow = '';
|
|
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods:{
|
|
methods:{
|
|
|
|
temperatureChange(n){
|
|
|
|
if(n==0){
|
|
|
|
this.form.checked1 = false;
|
|
|
|
this.form.temperature = '';
|
|
|
|
this.heat = ''
|
|
|
|
}
|
|
|
|
},
|
|
|
|
humidityChange(n){
|
|
|
|
if(n==0){
|
|
|
|
this.form.checked2 = false;
|
|
|
|
this.form.humidity = '';
|
|
|
|
}
|
|
|
|
},
|
|
|
|
save(){
|
|
|
|
this.form.humiditycontrol = this.form.humiditycontrol?'1':'0';
|
|
|
|
this.form.temperaturecontrol = this.form.temperaturecontrol?'1':'0'
|
|
|
|
//this.form.heat = !this.form.heat?'0':this.form.heat
|
|
|
|
medicineAbinetApi.updateTAndH(this.form).then(res=>{
|
|
|
|
if(res.status==200){
|
|
|
|
this.$toast(res.message);
|
|
|
|
this.goBack();
|
|
|
|
}else{
|
|
|
|
this.$toast(res.message)
|
|
|
|
}
|
|
|
|
}).catch(err=>{
|
|
|
|
this.$toast(err.message)
|
|
|
|
})
|
|
|
|
},
|
|
|
|
initMain(){
|
|
|
|
medicineAbinetApi.getHumidity({}).then(res=>{
|
|
|
|
|
|
|
|
}).catch(err=>{
|
|
|
|
|
|
|
|
})
|
|
|
|
}
|
|
},
|
|
},
|
|
created(){
|
|
created(){
|
|
|
|
|
|
|
|
let vm = this;
|
|
|
|
this.$EventBus.$on('openTemperature',(e)=>{
|
|
|
|
if(e.status){
|
|
|
|
Object.assign(vm.form, e.detail)
|
|
|
|
vm.checked1 = true
|
|
|
|
}else{
|
|
|
|
vm.checked1 = false
|
|
|
|
}
|
|
|
|
})
|
|
|
|
this.$EventBus.$on('openSecurity',(e)=>{
|
|
|
|
if(e.status){
|
|
|
|
Object.assign(vm.form, e.detail)
|
|
|
|
vm.checked2 = true
|
|
|
|
}else{
|
|
|
|
vm.checked2 = false
|
|
|
|
}
|
|
|
|
})
|
|
|
|
this.$EventBus.$on('openHumidity',(e)=>{
|
|
|
|
if(e.status){
|
|
|
|
Object.assign(vm.form, e.detail)
|
|
|
|
vm.checked3 = true
|
|
|
|
}else{
|
|
|
|
vm.checked3 = false
|
|
|
|
}
|
|
|
|
})
|
|
|
|
},
|
|
|
|
beforeDestroy(){
|
|
|
|
this.$EventBus.$off('openTemperature');
|
|
|
|
this.$EventBus.$off('openSecurity');
|
|
|
|
this.$EventBus.$off('openHumidity')
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
<style scoped lang='scss'>
|
|
<style scoped lang='scss'>
|
|
.temperatureIndex{
|
|
.temperatureIndex{
|
|
|
|
min-height: 100vh;
|
|
|
|
overflow-y: scroll;
|
|
|
|
position: relative;
|
|
.tbtn{
|
|
.tbtn{
|
|
border: 0;
|
|
border: 0;
|
|
border-radius: 5px;
|
|
border-radius: 5px;
|
|
}
|
|
}
|
|
|
|
.w100_60{
|
|
|
|
width: calc(100% - 60px);
|
|
|
|
}
|
|
|
|
.b0{
|
|
|
|
bottom: 0px;
|
|
|
|
}
|
|
|
|
.c-position-f{
|
|
|
|
position: fixed;
|
|
|
|
}
|
|
|
|
.mb100{
|
|
|
|
margin-bottom: 100px
|
|
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|