zjj
2025-07-02 ab478c5acee01dc7fcd319c5715fc38b8342219c
Monitor-APP/pages/home/home.vue
@@ -6,8 +6,8 @@
               <text>智能大屏显示系统</text>
            </view>
            <!-- 日历 -->
            <view class="time-tools">{{version}}</view>
            <view class="version">当前版本:{{socketUrl}}</view>
            <view class="time-tools">{{calendar}}</view>
            <view class="version">V:{{version}}</view>
            <view class="button-left" @click="ejected()"></view>
            <view class="button-right" @click="ejected()"></view>
            <!-- 主视图 -->
@@ -157,12 +157,13 @@
                           </y-box>
                        </view>
                        <view style="height: 2%;"></view>
                        <view style="height: 18%;">
                           <y-box>
                              <view class="flex-col" style="width: 100%;height: 100%;font-size: 4vh;justify-content: center;letter-spacing: 1vh;">
                                 智能大屏显示系统
                              </view>
                           </y-box>
                        <view style="height: 18%;display: flex;justify-content: space-around;align-items: center;">
                           <!-- <view style="font-size: 4vh">
                              自动仓库WCS监控平台
                           </view> -->
                           <view style="height: 50%;">
                              <image style="height: 100%;" src="../../static/img/logo-bai.png" mode="aspectFit"></image>
                           </view>
                        </view>
                     </view>
                  </view>
@@ -202,10 +203,10 @@
                           vertical 滑动方向是否为纵向 
                           display-multiple-items 同时显示的滑块数量 -->
                           <swiper class="swiper-body-main" vertical="true" 
                           display-multiple-items="2"
                           display-multiple-items="1"
                           circular="true" :autoplay="true" :interval="3000" :duration="2000">
                              <swiper-item class="swiper-item" v-for="(item,i) in swiperList" :key="i">
                                 <view style="width: 30%;">{{i+1}} / {{swiperList.length}}</view>
                                 <view style="width: 100%;">{{i+1}} / {{swiperList.length}}</view>
                                 <!-- <view style="width: 30%;">料号: {{item.matnr}}</view> -->
                                 <view style="width: 50%; font-size: 3vw;">物料编码: {{item.matnr}}</view>
                                 <view style="width: 50%; font-size: 3vw;">名称: {{item.maknx}}</view>
@@ -265,27 +266,33 @@
                  </view>
               </view>
               <view class="item">
                  <view class="desc">port:</view>
                  <view class="desc">Wcsport:</view>
                  <view class="input">
                     <input type="text" v-model="basePort">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">WcsUrl:</view>
                  <view class="input">
                     <input type="text" v-model="baseUrl">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">Wmsport:</view>
                  <view class="input">
                     <input type="text" v-model="wmsPort">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">WmsUrl:</view>
                  <view class="input">
                     <input type="text" v-model="wmsUrl">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">ledId:</view>
                  <view class="input">
                     <input type="text" v-model="baseLedId">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">CrnId:</view>
                  <view class="input">
                     <input type="text" v-model="baseCrnId">
                  </view>
               </view>
               <view class="item">
                  <view class="desc">Url:</view>
                  <view class="input">
                     <input type="text" v-model="baseUrl">
                  </view>
               </view>
            </scroll-view>
@@ -296,6 +303,13 @@
            </view>
         </view>
      </view>
      <view>
         <!-- 提示窗示例 -->
         <uni-popup ref="upVersion" type="dialog">
            <uni-popup-dialog :type="msgType" title="通知" :content="dialogContent" @confirm="dialogConfirm"
               @close="dialogClose"></uni-popup-dialog>
         </uni-popup>
      </view>
      <view style="color: #FFF;position: fixed;bottom: 10px;left: 10px;" v-show="timeOut">
         连接超时,正在重新建立链接:: {{times}} 
      </view>
@@ -303,9 +317,9 @@
</template>
<!-- {"msg":"操作成功","code":200,"data":[{"title":"全板出库","workNo":7460,"staNo":110,"sourceStaNo":null,"locNo":null,"sourceLocNo":"0807102","matDtos":[{"matNo":"50460834","maknx":"200x60桌面","count":26.0}],"emptyMk":false,"ioType":101}]} -->
<script>
   import demodata from '@/mockdata/demodata.json';
   import ycqdata from '@/pages/index/data.json';
   import {WebSocketClient} from "@/static/js/WebSocketClient"
   import WebSocketUtil from './uniWebSocket';
   let socket;
   export default {
@@ -318,6 +332,10 @@
            homeMode: [],
            infoMode: [],
            errorInfoMode: [],
            needUpdateCharts: false,
            viewSwitchTimer: null, // 视图切换定时器
            viewSwitchInProgress: false, // 添加这一行来跟踪视图切换状态
            timerIds: [], // 存储定时器ID
            baseInfo: {
               xDistance: 1,
               yDistance: 2,
@@ -378,8 +396,12 @@
            socketClient: null,
            messages: [],
            version:'',
            socketUrl:''
            socketUrl:'',
            msgType: 'success',
            filename: '',
            dialogContent: '',
            wmsUrl:'',
            wmsPort:''
            
         }
      },
@@ -397,11 +419,15 @@
         const BasePort = uni.getStorageSync('BasePort');
         const BaseCrnId = uni.getStorageSync('BaseCrnId');
         const PROJ = uni.getStorageSync('UPROJ');
         const WMSURL = uni.getStorageSync('wmsUrl');
         const WMSPORT = uni.getStorageSync('wmsPort');
         that.baseUrl = PROJ
         that.baseIP = BaseIP
         that.baseLedId = BaseLedId
         that.basePort = BasePort
         that.baseCrnId = BaseCrnId
         that.wmsUrl = WMSURL
         that.wmsPort = WMSPORT
         // this.getUrl()
      },
      created() {
@@ -411,16 +437,21 @@
         const BasePort = uni.getStorageSync('BasePort');
         const BaseCrnId = uni.getStorageSync('BaseCrnId');
         const PROJ = uni.getStorageSync('UPROJ');
         const WMSURL = uni.getStorageSync('wmsUrl');
         const WMSPORT = uni.getStorageSync('wmsPort');
         that.baseUrl = PROJ
         that.baseIP = BaseIP
         that.baseLedId = BaseLedId
         that.basePort = BasePort
         that.baseCrnId = BaseCrnId
         that.wmsUrl = WMSURL
         that.wmsPort = WMSPORT
         that.uniWebSocket();
         // that.webSockerInit()
      },
      onLoad() {         
         setInterval(()=>{
         // 存储定时器ID以便后续清理
         const timerId1 = setInterval(()=>{
            this.getServerData()
            // this.initlineChart()
            // this.initPieChart()
@@ -437,28 +468,48 @@
            // 测试用
            
         },1000)
         this.timerIds.push(timerId1)
         
         setInterval(()=> {
         const timerId2 = setInterval(()=> {
            setTimeout(()=>{
               plus.runtime.restart();
            },100)
            
         },1000*60*60*4)
         // setInterval(()=> {
         //    setTimeout(()=>{
         //       var time = new Date();
         //       var hh = time.getHours();
         //       var mm = time.getMinutes();
         //       if(hh > this.oldHours && mm >this.oldMin && this.oldMin - mm < 55){
         //          plus.runtime.restart();
         //       }
         //       if(mm >this.oldMin && mm - this.oldMin >2){
         //          plus.runtime.restart();
         //       }
         //    },100)
         this.timerIds.push(timerId2)
         //安卓内存占用打印
         // setInterval(() => {
         //    plus.android.importClass('android.os.Debug');
         //              const mem = plus.android.invoke(
         //                'android.os.Debug',
         //                'getNativeHeapAllocatedSize'
         //              ) / 1048576;
         //              console.log(mem.toFixed(1))
            
         // },1000*30)
         //    }, 2000)
      },
      onUnload() {
         // 清理所有定时器
         this.timerIds.forEach(id => clearInterval(id))
         this.timerIds = []
      },
      beforeDestroy() {
         // 清理WebSocket连接
         if (this.socketClient) {
            this.socketClient.close()
            this.socketClient = null
         }
         // 清理所有定时器
         this.timerIds.forEach(id => clearInterval(id))
         this.timerIds = []
         // 清理视图切换定时器
         if (this.viewSwitchTimer) {
            clearTimeout(this.viewSwitchTimer)
            this.viewSwitchTimer = null
         }
      },
      methods: {
         uniWebSocket(){
@@ -558,6 +609,8 @@
         showDate(data){
            const that = this
            if(data.type === "default"){
               // 设置标记,表示数据已更新,需要重新渲染图表
               that.needUpdateCharts = true
               that.chartsData.Pie.series[0].data = data.pie
               that.baseInfo.stockCount = data.stockCunt
               that.baseInfo.emptyCount = data.emptyCount
@@ -650,15 +703,16 @@
               }
            })
         },
         timeOut() {
            console.log(this.times);
         },
         getUrl() {
            this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + "/" +this.baseUrl
            this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + "/" +this.baseUrl
         },
         getServerData() {
            this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line))
            this.chartsDataPie2=JSON.parse(JSON.stringify(this.chartsData.Pie))
            // 只在数据变化时才进行深拷贝
            if (this.needUpdateCharts) {
               this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line))
               this.chartsDataPie2=JSON.parse(JSON.stringify(this.chartsData.Pie))
               this.needUpdateCharts = false
            }
         },
         // 获取错误信息
         getInfo2() {
@@ -816,91 +870,147 @@
         },
         // 控制器
         controller() {
            switch(this.infoType) {
               // 有信息 但 没有错误信息
               case 0:
                  if (this.errorInfoViewShow) {
                     this.errorInfoViewShow = false
                     this.errorInfoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.homeViewShow = true
                        this.homeMode = ['fade', 'slide-bottom']
                     },1000)
                  } else if (this.infoViewShow) {
                     this.infoViewShow = false
                     this.infoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.homeViewShow = true
                        this.homeMode = ['fade', 'slide-bottom']
                     },1000)
                  } else if (this.errorInfoViewShow && this.infoViewShow) {
                     this.errorInfoViewShow = false
                     this.infoViewShow = false
                     this.infoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.homeViewShow = true
                        this.homeMode = ['fade', 'slide-bottom']
                     },1000)
                  }
                  return;
               case 1:
                  if (this.homeViewShow) {
                     this.homeViewShow = false
                     this.homeMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.infoViewShow = true
                        this.infoMode = ['fade', 'slide-bottom']
                     },1000)
                  } else if (this.errorInfoViewShow) {
                     this.errorInfoViewShow = false
                     this.errorInfoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.infoViewShow = true
                        this.infoMode = ['fade', 'slide-bottom']
                     },1000)
                  }
                  return;
                  // 有信息 且 有错误信息
               case 2:
                  if (this.homeViewShow) {
                     this.homeViewShow = false
                     this.homeMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.errorInfoViewShow = true
                        this.errorInfoMode = ['fade', 'slide-bottom']
                     },1000)
                  } else if (this.infoViewShow) {
                     this.infoViewShow = false
                     this.infoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.errorInfoViewShow = true
                        this.errorInfoMode = ['fade', 'slide-bottom']
                     },1000)
                  }
                  return;
               // 有信息 且 有错误信息
               case 3:
                  if (this.homeViewShow) {
                     this.homeViewShow = false
                     this.homeMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.errorInfoViewShow = true
                        this.errorInfoMode = ['fade', 'slide-bottom']
                     },1000)
                  } else if (this.infoViewShow) {
                     this.infoViewShow = false
                     this.infoMode = ['fade', 'slide-bottom']
                     setTimeout(()=>{
                        this.errorInfoViewShow = true
                        this.errorInfoMode = ['fade', 'slide-bottom']
                     },1000)
                  }
                  return;
            }
         },
    // 如果视图切换正在进行中,不要中断
    if (this.viewSwitchInProgress) {
        return;
    }
    // 清除之前的视图切换定时器
    if (this.viewSwitchTimer) {
        clearTimeout(this.viewSwitchTimer)
        this.viewSwitchTimer = null
    }
    switch(this.infoType) {
        // 有信息 但 没有错误信息
        case 0:
            if (this.errorInfoViewShow) {
                this.viewSwitchInProgress = true;
                this.errorInfoViewShow = false
                this.errorInfoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.homeViewShow = true
                    this.homeMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            } else if (this.infoViewShow) {
                this.viewSwitchInProgress = true;
                this.infoViewShow = false
                this.infoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.homeViewShow = true
                    this.homeMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            } else if (this.errorInfoViewShow && this.infoViewShow) {
                this.viewSwitchInProgress = true;
                this.errorInfoViewShow = false
                this.infoViewShow = false
                this.infoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.homeViewShow = true
                    this.homeMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            }
            return;
        case 1:
            if (this.homeViewShow) {
                this.viewSwitchInProgress = true;
                this.homeViewShow = false
                this.homeMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.infoViewShow = true
                    this.infoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            } else if (this.errorInfoViewShow) {
                this.viewSwitchInProgress = true;
                this.errorInfoViewShow = false
                this.errorInfoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.infoViewShow = true
                    this.infoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            }
            return;
            // 有信息 且 有错误信息
        case 2:
            if (this.homeViewShow) {
                this.viewSwitchInProgress = true;
                this.homeViewShow = false
                this.homeMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.errorInfoViewShow = true
                    this.errorInfoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            } else if (this.infoViewShow) {
                this.viewSwitchInProgress = true;
                this.infoViewShow = false
                this.infoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.errorInfoViewShow = true
                    this.errorInfoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            }
            return;
        // 有信息 且 有错误信息
        case 3:
            if (this.homeViewShow) {
                this.viewSwitchInProgress = true;
                this.homeViewShow = false
                this.homeMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.errorInfoViewShow = true
                    this.errorInfoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            } else if (this.infoViewShow) {
                this.viewSwitchInProgress = true;
                this.infoViewShow = false
                this.infoMode = ['fade', 'slide-bottom']
                this.viewSwitchTimer = setTimeout(()=>{
                    this.errorInfoViewShow = true
                    this.errorInfoMode = ['fade', 'slide-bottom']
                    // 设置另一个定时器来重置进行中标志
                    setTimeout(() => {
                        this.viewSwitchInProgress = false;
                    }, 1000);
                },1000)
            }
            return;
    }
},
         // 主屏幕
         handle(type) {
            this.homeViewShow = !this.homeViewShow
@@ -931,6 +1041,8 @@
            uni.setStorageSync('BasePort',this.basePort);
            uni.setStorageSync('BaseCrnId',this.baseCrnId);
            uni.setStorageSync('UPROJ',this.baseUrl);
            uni.setStorageSync('wmsUrl',this.wmsUrl);
            uni.setStorageSync('wmsPort',this.wmsPort);
            this.getUrl()
            this.ejectShow = false
         },
@@ -1042,6 +1154,8 @@
                  if (res.platform == "android") {
                     that.AndroidCheckUpdate();
                  }
                     // that.AndroidCheckUpdate();
               }
            })
         },
@@ -1051,9 +1165,107 @@
            plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => {
               that.version = wgtinfo.version //客户端版本号
            })
            // setTimeout(()=>{
            //    that.getUpdateVersion()
            // },100)
            setTimeout(()=>{
               that.getUpdateVersion()
            },100)
         },
         // 校验版本
         getUpdateVersion() {
            let that = this
            let type = 1
            if (that.baseUrl == 'http://undefined:undefined/undefined') {
               return
            }
            const wms = 'http://'+ that.baseIP + ':' +that.wmsPort + "/" +that.wmsUrl
            console.log(wms)
            let url = wms + '/appVersion/checkUpdate/' + that.version + '/' + type
            uni.request({
               url: url,
               method: 'GET',
               success(res) {
                  console.log(res);
                  var res = res.data
                  if (res.data) {
                     that.filename = res.data.path
                     that.dialogContent = '发现新版本:' + res.data.version + ', 是否立即更新'
                     that.$refs.upVersion.open()
                  } else {
                     uni.showToast({
                        title: res.msg,
                        icon: "none",
                        position: 'top'
                     })
                  }
               }
            })
         },
         dialogConfirm() {
            this.$refs.upVersion.close()
            this.downWgt()
         },
         dialogClose() {
            this.$refs.upVersion.close()
         },
         downWgt() {
            let that = this;
            const wms = 'http://'+ that.baseIP + ':' +that.wmsPort + "/" +that.wmsUrl
            const downloadUrl = wms + "/appVersion/downloadApp/" + that.filename
            uni.showLoading({
               title: '更新中……'
            })
            const downloadTask = uni.downloadFile({ //执行下载
               url: downloadUrl, //下载地址
               timeout: 1000 * 30, //30秒超时时间
               success: downloadResult => { //下载成功
                  console.log(downloadResult);
                  that.showdownLine = false
                  uni.hideLoading();
                  if (downloadResult.statusCode == 200) {
                     uni.showModal({
                        title: '',
                        content: '更新成功,确定现在重启吗?',
                        confirmText: '重启',
                        confirmColor: '#EE8F57',
                        success: function(res) {
                           if (res.confirm == true) {
                              plus.runtime.install( //安装
                                 downloadResult.tempFilePath, {
                                    force: true
                                 },
                                 function(res) {
                                    utils.showToast('更新成功,重启中');
                                    plus.runtime.restart();
                                 }
                              );
                           }
                        }
                     });
                  } else {
                     uni.hideLoading();
                     that.showdownLine = false
                     uni.showToast({
                        title:'请先上传安装包',
                        icon: 'error'
                     })
                  }
               },
               fail: err => {
                  uni.hideLoading();
                  that.showdownLine = false
                  that.$u.toast(downloadResult.errMsg)
               },
               complete: com => {
                  console.log(com)
               }
            });
            // 下载进度
            downloadTask.onProgressUpdate(res => {
               that.downloadNum = res.progress
               console.log('下载进度' + that.downloadNum);
            });
         },
      }
      
@@ -1228,8 +1440,8 @@
   }
   .version{
      position: absolute;
      left: 2%;
      top: 2%;
      left: 1%;
      top: 1%;
      font-size:1vw;
      transform: scale(0.8);
   }
@@ -1285,8 +1497,8 @@
   }
   .eject{
      position: relative;
      width: 40vw;
      height: 40vh;
      width: 45vw;
      height: 45vh;
      background-color: #fff;
      border-radius: 2rem;
   }