398 lines
11 KiB
Vue
398 lines
11 KiB
Vue
<template>
|
|
<view class="page">
|
|
<uni-row style="height: 40px;margin-left: 10px;">
|
|
<uni-col :span="12" >
|
|
<uni-row style="height: 40px;">
|
|
<uni-col :span="10" ><view style="font-size: 14px;line-height: 35px;color: white;" >运行模式</view></uni-col>
|
|
<uni-col :span="12" ><u-button :text="`${itemProperty.m == '1'? '自动':'手动'}`" :type="`${itemProperty.m == '1'? 'success':'warning'}`"
|
|
style="height: 25px;width: 60px;margin-bottom: 2px;margin-top: 5px;float: right;margin-right: 5px;float: left;" @click="controlHeadSwitch(item,itemProperty.m,'m')"></u-button></uni-col>
|
|
</uni-row>
|
|
</uni-col>
|
|
<uni-col :span="12" >
|
|
<u-button text="历史" type="info"
|
|
style="height: 25px;width: 60px;margin-bottom: 2px;margin-top: 5px;float: right;margin-right: 5px;" @click="openH(item)"></u-button>
|
|
</uni-col>
|
|
</uni-row>
|
|
<uni-row class="rowheadstyle">
|
|
<view class="rowview">
|
|
<uni-col :span="6">
|
|
<u-icon label="设备门:" labelPos="right" label-color="white" size="28" labelSize="12"
|
|
name="../../static/images/spore_tem1.png"></u-icon>
|
|
</uni-col>
|
|
<uni-col :span="6" >
|
|
<view class="valuecol">
|
|
{{itemProperty.ss===null?"--":(itemProperty.ss==='1'?"打开":"关闭") }}
|
|
</view>
|
|
</uni-col>
|
|
<uni-col :span="6" >
|
|
<u-icon label="海拔:" labelPos="right" label-color="white" size="28" labelSize="12"
|
|
name="../../static/images/bzhb.png"></u-icon>
|
|
</uni-col>
|
|
<uni-col :span="6" >
|
|
<view class="valuecol">
|
|
{{itemProperty.att===null?"--":itemProperty.att}}m
|
|
</view>
|
|
</uni-col>
|
|
</view>
|
|
</uni-row>
|
|
<uni-row class="rowheadstyle">
|
|
<view class="rowview">
|
|
<uni-col :span="6" >
|
|
<u-icon label="单次采样:" labelPos="right" label-color="white" size="28" labelSize="12"
|
|
name="../../static/images/spore_tem2.png"></u-icon>
|
|
</uni-col>
|
|
<uni-col :span="6" >
|
|
<view class="valuecol">
|
|
{{itemProperty.pl===null?"--":itemProperty.pl}}
|
|
</view>
|
|
</uni-col>
|
|
<uni-col :span="6">
|
|
<u-icon label="累计采样:" labelPos="right" label-color="white" size="28" labelSize="12"
|
|
name="../../static/images/spore_tem3.png"></u-icon>
|
|
</uni-col>
|
|
<uni-col :span="6" >
|
|
<view class="valuecol">
|
|
{{itemProperty.pt===null?"--":itemProperty.pt}}
|
|
</view>
|
|
</uni-col>
|
|
</view>
|
|
</uni-row>
|
|
<uni-row class="rowstyle">
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">光源</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button :text="`${itemProperty.ias == '1'? '打开':'关闭'}`" type="info"
|
|
@click="controlHeadSwitch(item,itemProperty.ias,'ias')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">采样口</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button :text="`${itemProperty.sls == '1'? '打开':'关闭'}`" type="info"
|
|
@click="controlHeadSwitch(item,itemProperty.sls,'sls')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
</uni-row>
|
|
<uni-row class="rowstyle">
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">吸气口</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button :text="`${itemProperty.ais == '1'? '打开':'关闭'}`" type="info"
|
|
@click="controlHeadSwitch(item,itemProperty.ais,'ais')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">载波电机</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button :text="`${itemProperty.zbs == '1'? '运行':'停止'}`" type="info"
|
|
@click="controlHeadSwitch(item,itemProperty.zbs,'zbs')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
</uni-row>
|
|
<uni-row class="rowstyle">
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">排气口</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button :text="`${itemProperty.bwa == '1'? '打开':'关闭'}`" type="info"
|
|
@click="controlHeadSwitch(item,itemProperty.bwa,'bwa')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
<uni-col :span="12" >
|
|
<uni-row class="col1"><uni-col :span="24" ><view class="text1">摄像头</view></uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" ><u-button text="拍照" type="info"
|
|
@click="controlHeadSwitch(item,0,'pg')" class="but1"></u-button></uni-col></uni-row>
|
|
</uni-col>
|
|
</uni-row>
|
|
<uni-row class="rowheadstyle"> <uni-col :span="24" v-if="itemProperty.aat!=null">
|
|
<u-button text="分析" type="info" @click="analysis(item,itemProperty.aat)"
|
|
style="height: 25px;width: 200px;margin-bottom: 2px;margin-top: 10px;text-align: center;"></u-button>
|
|
</uni-col></uni-row>
|
|
<u-popup :show="showDeviceLog" mode="center">
|
|
<view class="dialog-container">
|
|
<view class="dialog-title">
|
|
<text>孢子历史记录</text>
|
|
<u-icon name="reload" size="20" class="reload-btn" @click="reload"></u-icon>
|
|
<u-icon name="close" size="20" class="close-btn" @click="closeLog"></u-icon>
|
|
</view>
|
|
<view class="dialog-body">
|
|
<spore-logs :passParams="passParams"></spore-logs>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-popup :show="showAnalysis" mode="center">
|
|
<view class="dialog-container">
|
|
<view class="dialog-title">
|
|
<text>孢子分析</text>
|
|
<u-icon name="close" size="20" class="close-btn" @click="closeLogAnalysis"></u-icon>
|
|
</view>
|
|
<view class="dialog-body" v-if="itemProperty.aat!=null">
|
|
<uni-row class="rowstyle">
|
|
<uni-col :span="24">
|
|
<uni-row class="col1"><uni-col :span="24">
|
|
<view class="text2">分析图片</view>
|
|
</uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" style="text-align: center;"><u-image
|
|
:src="itemProperty.img" :lazy-load="true" width="240px" height="240px"
|
|
shape="square"></u-image></uni-col></uni-row>
|
|
</uni-col>
|
|
</uni-row>
|
|
<uni-row class="rowstyle">
|
|
<uni-col :span="24">
|
|
<uni-row class="col1"><uni-col :span="24">
|
|
<view class="text2">分析时间</view>
|
|
</uni-col></uni-row>
|
|
<uni-row class="col2"><uni-col :span="24" style="text-align: center;">
|
|
<view class="text2">{{itemProperty.aat===null?"--":itemProperty.aat}}</view>
|
|
</uni-col></uni-row>
|
|
</uni-col>
|
|
</uni-row>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
</view>
|
|
</template>
|
|
<script setup>
|
|
import {
|
|
ref
|
|
} from "vue"
|
|
import {
|
|
onLoad,
|
|
onUnload
|
|
} from '@dcloudio/uni-app'
|
|
import plugin from '@/plugins'
|
|
import store from '@/store'
|
|
const item = ref({})
|
|
const itemProperty = ref({})
|
|
const time3 = ref({});
|
|
const Intervalflag = ref(true);
|
|
const showDeviceLog = ref(false);
|
|
const passParams = ref({});
|
|
const showAnalysis = ref(false);
|
|
//页面跳转值
|
|
onLoad(info => {
|
|
if (info.item != null) {
|
|
item.value = JSON.parse(decodeURIComponent(info.item));
|
|
queryList();
|
|
time3.value = setInterval(() => {
|
|
if (Intervalflag.value) {
|
|
queryList();
|
|
} else {
|
|
clearInterval(time3.value);
|
|
}
|
|
}, 5000);
|
|
}
|
|
})
|
|
onUnload(info => {
|
|
Intervalflag.value = false;
|
|
clearInterval(time3);
|
|
})
|
|
|
|
function queryList() {
|
|
let par = {
|
|
"deviceCode": item.value.deviceCode,
|
|
"iotId": item.value.iotId,
|
|
"deviceTypeId": 8
|
|
};
|
|
store.dispatch('getSporeDevicePropertyStatus', par)
|
|
.then(res => {
|
|
console.log(res)
|
|
itemProperty.value = res.data
|
|
}).catch(error => {
|
|
plugin.modal.msgError(error);
|
|
}).finally(() => {})
|
|
}
|
|
|
|
//打开历史界面
|
|
function openH(item){
|
|
showDeviceLog.value = true
|
|
passParams.value = item
|
|
}
|
|
|
|
function reload(){
|
|
uni.$emit("reloadlogs")
|
|
}
|
|
|
|
function closeLog(){
|
|
showDeviceLog.value = false;
|
|
}
|
|
|
|
function controlHeadSwitch(item,e,k){
|
|
if(itemProperty.value.s==="offline"){
|
|
plugin.modal.msgError("设备离线，不能操作！");
|
|
return;
|
|
}
|
|
if(k==="pg" && itemProperty.value.m==="1"){
|
|
plugin.modal.msgError("自动模式不能拍照！");
|
|
return;
|
|
}
|
|
if(k==="pg" && itemProperty.value.ias==="0"){
|
|
plugin.modal.msgError("请先打开光源！");
|
|
return;
|
|
}
|
|
let par = {
|
|
controlKey: k,
|
|
deviceTypeId: 8,
|
|
operationType: 11,
|
|
deviceCode: item.deviceCode,
|
|
controlValve: e == 1 ? 0 : 1
|
|
};
|
|
store.dispatch('controlHeadSwitch', par)
|
|
.then(res => {
|
|
queryList();
|
|
}).catch(error => {
|
|
plugin.modal.msgError(error);
|
|
}).finally(() => {})
|
|
}
|
|
|
|
//打开分析弹出页
|
|
function analysis(item, e) {
|
|
if (!e) {
|
|
plugin.modal.msgError("没有可以分析的数据！");
|
|
return;
|
|
}
|
|
showAnalysis.value = true;
|
|
}
|
|
//关闭分析弹出页
|
|
function closeLogAnalysis() {
|
|
showAnalysis.value = false;
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.page{
|
|
height: 1200px;
|
|
width: 100%;
|
|
background-color:cadetblue;
|
|
}
|
|
.uni-page-head {
|
|
display: none
|
|
}
|
|
.col1{
|
|
width: 130px;height: 20px;
|
|
|
|
}
|
|
.col2{
|
|
width: 130px;height: 30px;
|
|
|
|
}
|
|
|
|
.text1{
|
|
text-align: center;background-color: #13bff3;height: 20px;line-height: 20px;color: white;
|
|
|
|
}
|
|
.text2 {
|
|
text-align: center;
|
|
background-color: #13bff3;
|
|
height: 20px;
|
|
width: 240px;
|
|
line-height: 20px;
|
|
color: white;
|
|
}
|
|
.but1{
|
|
width:130;
|
|
}
|
|
|
|
.demo-uni-col {
|
|
height: 32px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.dark {
|
|
background-color: cadetblue;
|
|
}
|
|
|
|
.light {
|
|
background-color: cadetblue;
|
|
}
|
|
.rowheadstyle{
|
|
height: 40px;
|
|
left: 10px;
|
|
|
|
}
|
|
.rowstyle{
|
|
height: 70px;
|
|
left: 10px;
|
|
padding-top: 10px;
|
|
|
|
}
|
|
|
|
.rowview {
|
|
margin-top: 5px;
|
|
height: 100%;
|
|
width: 100%;
|
|
line-height: 40px;
|
|
}
|
|
|
|
.valuecol {
|
|
height: 80%;
|
|
text-align: left;
|
|
line-height: 28px;
|
|
font-size: 12px;
|
|
// border: 1px solid black;
|
|
width: 95%;
|
|
// background-color: white;
|
|
color: white;
|
|
}
|
|
|
|
// 弹窗
|
|
.dialog-container {
|
|
width: 90vw;
|
|
height: 90vh;
|
|
overflow: hidden;
|
|
.dialog-title {
|
|
width: 100%;
|
|
height: 34px;
|
|
font-size: 16px;
|
|
line-height: 34px;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border-bottom: 1px solid #999;
|
|
position: relative;
|
|
.reload-btn {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 56px;
|
|
transform: translateY(-50%);
|
|
}
|
|
.close-btn {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 10px;
|
|
transform: translateY(-50%);
|
|
}
|
|
}
|
|
.dialog-body {
|
|
height: calc(100% - 35px);
|
|
overflow: hidden;
|
|
position: relative;
|
|
background-color: #f7f7f7;
|
|
//扫码的弹窗
|
|
.scancode-device-info {
|
|
height: 100%;
|
|
padding: 0 20px;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-evenly;
|
|
& > view {
|
|
width: 100%;
|
|
line-height: 40px;
|
|
font-size: 18px;
|
|
color: gray;
|
|
.label {
|
|
display: inline-block;
|
|
width: 30%;
|
|
color: black;
|
|
margin-right: 2px;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.control-panel {
|
|
height: 100px;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: nowrap;
|
|
justify-content: space-evenly;
|
|
& > view {
|
|
padding: 6px 10px;
|
|
color: #007acc;
|
|
font-size: 14px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
}
|
|
}
|
|
</style> |