zhuguifei
2024-12-25 576d28de6be2d75bfd5a213874dd8d06657635b5
pages/device/control.vue
@@ -37,10 +37,17 @@
                     </view>
                     <view class="h-tr h-tr-2">
                        <view class="h-td">
                           <u-tag size="mini" text="在线" type="success" plain plainFill></u-tag>
                           <u-tag v-if="connected" size="mini" text="在线" type="success" plain
                              plainFill></u-tag>
                           <u-tag v-else size="mini" text="离线" type="error" plain plainFill></u-tag>
                        </view>
                        <view class="h-td">
                           <u-tag size="mini" text="正在干燥" type="success" plain plainFill></u-tag>
                           <template v-if="runStatu">
                              <u-tag size="mini" text="正在干燥" type="success" plain plainFill></u-tag>
                           </template>
                           <template v-else>
                              <u-tag size="mini" text="待机" type="error" plain plainFill></u-tag>
                           </template>
                        </view>
                        <view class="h-td">{{$lget(model,'windTemp')}}</view>
                        <view class="h-td">{{$lget(model,'windTemp')}}</view>
@@ -74,7 +81,7 @@
                     </view>
                     <view class="h-tr h-tr-2">
                        <view class="h-td">生地黄</view>
                        <view class="h-td">{{$lget(model,'herbName')}}</view>
                        <view class="h-td">{{$lget(model,'envTemp') == "" ? "--" :  $lget(model,'envTemp')}}m³
                        </view>
                        <view class="h-td">{{$lget(model,'envHum') == "" ? "--" :$lget(model,'envHum') }}kg
@@ -136,11 +143,12 @@
            <uni-section title="指令" type="line">
               <view class="flex justify-center padding-lg bg-white">
                  <view class="margin-right-sm">
                     <u-button text="开机" type="success" @click="$u.throttle(showModal(), 500)"></u-button>
                     <u-button :disabled="connected" text="开机" type="success"
                        @click="$u.throttle(showModal(1), 500)"></u-button>
                  </view>
                  <view class="margin-left-sm">
                     <u-button text="关机" type="error" :disabled="true"></u-button>
                     <u-button :disabled="!connected" text="关机" type="error"
                        @click="$u.throttle(showModal(2), 500)"></u-button>
                  </view>
@@ -150,8 +158,8 @@
            <uni-section title="控制台" type="line" class="margin-top-sm ">
               <view class="padding-left-sm padding-right-sm padding-bottom-sm">
                  <view class="text-sm text-gray">12:00:20: <开机>指令操作成功</view>
                  <view class="text-sm text-gray  margin-top-sm">12:00:10: 发送<开机>指令</view>
                  <view class="text-sm text-gray" :class="{'margin-top-sm':index>0}"  v-for="(log,index) in logList">{{log}}</view>
                  <!-- <view class="text-sm text-gray  margin-top-sm">12:00:10: 发送<开机>指令</view> -->
               </view>
            </uni-section>
@@ -162,15 +170,15 @@
      </swiper>
      <u-modal :show="show" title="验证二级密码" @confirm="confirm" :showCancelButton="true" @cancel="show=false"
         ref="uModal" :asyncClose="true">
      <u-modal :show="show" @confirm="confirm" :showCancelButton="true" @cancel="show=false" ref="uModal"
         :asyncClose="true">
         <slot>
            <view>
               <u--input style="width: 100%;" placeholder="请输入二级密码" border="surround" password
            <view style="width: 100%;height:100%;">
               <view style="color:red">
                  远程控制操作可能存在安全风险,请谨慎操作
               </view>
               <u--input style="width: 100%;" placeholder="请输入二级安全密码" border="surround" password
                  clearable></u--input>
            </view>
         </slot>
@@ -187,6 +195,14 @@
   export default {
      data() {
         return {
            //上个页面传递过来的数据
            option: {},
            //操作指令log
            logList: [],
            //当前设备连接状态
            connected: false,
            //开关机指令 1-开机 2-关机
            cmd: -1,
            show: false,
            swiperList: ["监测", "控制"],
            swiperCurrent: 0,
@@ -221,8 +237,8 @@
            notice: "2023-03-1812:00:001号机台低温报警",
            model: {},
            queryParam: {
               machineid: "GM001",
               tenantid: 1003
               machineid: "",
               tenantid: null
            },
            bannerList: [{
               imageUrl: '../../static/image/zcy_gzj1.png'
@@ -232,11 +248,21 @@
         }
      },
      onShow() {
         console.info("onShow")
         this.startTimer()
      },
      onLoad(e) {
      onLoad(option) {
         const userinfo = uni.getStorageSync('userinfo');
         this.option = option
         this.option.tenantid = userinfo.loginTenantId
         this.option.username = userinfo.username
         //初始化查询参数
         this.queryParam.machineid = option.code
         this.queryParam.tenantid = userinfo.loginTenantId
      },
      onBackPress() {
@@ -254,31 +280,127 @@
      },
      onReady() {
         //this.getServerData()
         // this.$mqttTool.message().then(res => {
         //    console.error("解析数据")
         //    if (res.topic == this.$constant.SERVICE_RES_EQU_STATU) {
         //       const msgstr = res.message.toString();
         //       const message = JSON.parse(msgstr);
         //       console.error(message)
         //       console.error(message.success)
         //    }
         // })
         let _this = this
         this.$mqttTool.client.on('message', function(topic, message, buffer) {
            const msg = JSON.parse(message);
            if (topic == _this.$constant.SERVICE_RES_EQU_STATU.replace('equ', _this.deviceId)) {
               if (msg.success) {
                  _this.connected = msg.connected
               } else {
                  _this.connected = false
               }
            } else if (topic == _this.$constant.SERVICE_RES_EQU_CMD.replace('equ', _this.deviceId)) {
               //发送指令收到响应
               //添加log
               let log = this.getCurrentTime() +'返回:' +  + '指令' ;
               this.logList.push(log)
               setTimeout(() => {
                  // 3秒后自动关闭
                  uni.showToast({
                     title: msg.msg,
                     icon: 'none',
                     mask: true
                  });
                  _this.show = false;
               }, 1000)
            }
         })
         this.queryEquStatu()
      },
      methods: {
         showModal() {
         //MQTT
         queryEquStatu() {
            //1.查询设备实时状态
            const message = {
               clientId: this.option.clientId,
               timestamp: new Date(),
               req: this.deviceId
            }
            let opts = {
               topic: this.$constant.MOBILE_QUERY_EQU_STATU,
               message: JSON.stringify(message),
            }
            this.$mqttTool.publish(opts).then(res => {
               console.error(res)
            })
         },
         sendEquCmd() {
            //添加log
            let log = this.getCurrentTime() +'发送' + (this.cmd == 1 ? ":《开机》" : ":《关机》") + '指令' ;
            this.logList.push(log)
            //1.发送开关机指令 1-开机  2-关机
            const message = {
               clientId: this.option.clientId,
               cmd: this.cmd,
               timestamp: new Date(),
               req: this.deviceId
            }
            let opts = {
               topic: this.$constant.MOBILE_REQ_EQU_CMD,
               message: JSON.stringify(message),
            }
            this.$mqttTool.publish(opts).then(res => {
               console.error(res)
            })
         },
         showModal(cmd) {
            this.show = true;
            this.cmd = cmd;
         },
         confirm() {
            setTimeout(() => {
               // 3秒后自动关闭
               uni.showToast({
                  title: '操作成功~',
                  icon: 'none',
                  mask: true
               });
               this.show = false;
            }, 3000)
            this.sendEquCmd()
            // setTimeout(() => {
            //    // 3秒后自动关闭
            //    uni.showToast({
            //       title: '操作成功~',
            //       icon: 'none',
            //       mask: true
            //    });
            //    this.show = false;
            // }, 3000)
         },
         startTimer() {
            console.info("监控页面显示")
            this.getRealData()
            //不间断查询待操作干燥机的状态,实时更新
            //this.queryEquStatu()
            if (!this.$monitorTimer) {
               this.$monitorTimer = setInterval(() => {
                  console.info("定时器工作")
                  console.info(this.$monitorTimer)
                  this.getRealData()
                  /**
                   * TODO 使用last_will代替轮询
                   */
                  //不间断查询待操作干燥机的状态,实时更新
                  //this.queryEquStatu()
               }, 1000 * 12)
            }
@@ -303,6 +425,20 @@
            this.swiperCurrent = e.detail.current;
            console.log(e.detail.current)
            this.$refs.tabs.unlockDx();
         },
         getCurrentTime() {
            // 获取当前时间
            let now = new Date();
            // 格式化时间
            let year = now.getFullYear();
            let month = (now.getMonth() + 1).toString().padStart(2, '0');
            let day = now.getDate().toString().padStart(2, '0');
            let hours = now.getHours().toString().padStart(2, '0');
            let minutes = now.getMinutes().toString().padStart(2, '0');
            let seconds = now.getSeconds().toString().padStart(2, '0');
            // 返回结果
            return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
         },
         getServerData() {
            //模拟从服务器获取数据时的延时
@@ -452,6 +588,9 @@
         }
      },
      computed: {
         deviceId() {
            return uni.getStorageSync(this.$constant.DEVICE_ID);
         },
         //运行状态
         runStatu() {
            let stop = this.$lget(this.model, 'stop');