大屏显示内容完善

pang.jiabao

2025-10-15 e2b9859ab42fc9cd3de1fa960717dbfa87e95da7

 Monitor-APP/pages/home/home.vue

@@ -218,13 +218,11 @@
                           </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;">
                                 自动仓库WCS监控平台
                              </view>
                           </y-box>
                        <view style="height: 18%"  class="flex-row">
                              <image style="height: 100%;"
                                 src="../../static/barcode.png" mode="aspectFit"></image>
                              <image style="height: 100%;"
                                 src="../../static/zy_logo.png" mode="aspectFit"></image>
                        </view>
                     </view>
                  </view>
@@ -245,25 +243,58 @@
            <view class="button-right" @click="ejected()"></view>
            <!-- 主体 -->
            <view class="info-main">
               <view class="info-box">
               <view class="info-box">													
                  <view class="swiper-head" style="height: 10%;width: 96%;margin-left: 2%;font-size: 2dvw;display: flex;">
                     <view style="width: 15%; display: flex; flex-direction: column; align-items: center;">
                           <view style="line-height: 1.5; white-space: nowrap;">任务号：{{infoText.workNo}}</view>
                           <view>订单号</view>
                     </view>
                     <view style="width: 15%;">商品编号</view>
                     <view style="width: 15%;">商品名称</view>
                     <view style="width: 10%;">托盘码</view>
                     <view style="width: 15%;">批号</view>
                     <view style="width: 10%;">数量</view>
                     <view style="width: 10%;">目标库位</view>
                     <view style="width: 10%;">源库位</view>
                  </view>
                  <y-box>
                     <!-- 文本容器 -->
                     <view class="text-content" v-for="item in swiperList">
                        <view>目标站：{{infoText.staNo}}</view>
                     <!-- <view class="text-content" v-for="item in swiperList" style="font-size: 3vw;"> -->
<!--                         <view>目标站：{{infoText.staNo}}</view>
                        <view>商品编码：{{item.matnr}}</view>
                        <view>商品名称：{{item.maknx}}</view>
                        <view>规格：{{item.specs}}</view>
                        <view>数量：{{item.count}} / {{item.total ? item.total : '--'}}</view>

                        <view>图号：{{item.model ? item.model :''}}</view>
                        <view>数量：{{item.count}} / {{item.total ? item.total : '--'}}</view> -->
         <!--             <view style="display: flex;text-align: left;">
                        <view style="width: 50%;">订单号：{{item.orderNo}}</view>
                        <view style="width: 50%;">单行ID：{{item.memo}}</view>
                     </view>
                     <view style="display: flex;text-align: left;">
                           <view style="width: 50%;">商品编号：{{item.matnr}}</view>
                           <view style="width: 50%;">商品名称：{{item.maknx}}</view>
                     </view>
                     <view style="display: flex;text-align: left;">
                           <view style="width: 50%;">托盘码：{{infoText.barcode}}</view>
                           <view style="width: 50%;">特殊说明：{{item.batch}}</view>
                     </view>
                     <view style="display: flex;text-align: left;">
                           <view style="width: 50%;">作业数量：{{item.count}}</view>
                           <view style="width: 50%;">剩余数量：{{item.total}}</view>
                     </view> -->
							


                        <!-- head -->
                        <!-- <view class="swiper-head">
                           <view style="width: 20%;">目标站：{{infoText.staNo}}</view>
                           <view style="width: 30%;">商品编号</view>
                           <view style="width: 20%;">商品名称</view>
                           <view style="width: 20%;">规格</view>
                           <view style="width: 10%;">数量</view>
<!--                         <view class="swiper-head" style="height: 15%;">
                           <view style="width: 15%;">订单号</view>
                           <view style="width: 10%;">单行ID</view>
                           <view style="width: 15%;">商品编号</view>
                           <view style="width: 15%;">商品名称</view>
                           <view style="width: 10%;">托盘码</view>
                           <view style="width: 15%;">特殊说明</view>
                           <view style="width: 10%;">作业数量</view>
                           <view style="width: 10%;">剩余数量</view>
                        </view> -->
                        <!-- body -->
                        <!-- <view class="swiper-body"> -->
@@ -271,19 +302,23 @@
                           circular 是否采用衔接滑动，即播放到末尾后重新回到开头
                           vertical 滑动方向是否为纵向 
                           display-multiple-items 同时显示的滑块数量 -->
                        <!-- <swiper class="swiper-body-main" vertical="true" 
                           display-multiple-items="8"
                           circular="true" :autoplay="true" :interval="3000" :duration="1000">
                              <swiper-item class="swiper-item" v-for="(item,i) in swiperList" :key="i">
                                 <view style="width: 20%;">No:{{i+1}}</view>
                                 <view style="width: 30%;">{{item.matNo}}</view>
                                 <view style="width: 20%;">{{item.maknx}}</view>
                                 <view style="width: 20%;">{{item.specs}}</view>
                                 <view style="width: 10%;">{{item.count}}</view>
                        <swiper class="swiper-body-main" vertical="true" 
                           display-multiple-items="3"
                           circular="true" :autoplay="true" :interval="3000" :duration="1000" style="font-size: 2vw;">
                              <swiper-item  class="swiper-item" v-for="(item,i) in swiperList" :key="i">
                                 <!-- <view>No:{{i+1}}</view> -->
                                 <view style="width: 15%;">{{item.orderNo}}</view>
                                 <view style="width: 15%;word-break: break-all;">{{item.matnr}}</view>
                                 <view style="width: 15%;word-break: break-all;">{{item.maknx}}</view>
                                 <view style="width: 10%;">{{infoText.barcode}}</view>
                                 <view style="width: 15%;word-break: break-all;">{{item.batch}}</view>
                                 <view style="width: 10%;">{{item.anfme}}</view>
                                 <view style="width: 10%;">{{infoText.locNo}}</view>
                                 <view style="width: 10%;">{{infoText.sourceLocNo}}</view>
                              </swiper-item>
                           </swiper>
                        </view> -->
                     </view>
                        <!-- </view> -->
                     <!-- </view> -->
                  </y-box>
               </view>
            </view>
@@ -373,7 +408,9 @@
            homeViewShow: true,
            infoViewShow: false,
            errorInfoViewShow: false,
            errorBoardShow: false,
            homeMode: [],
            carInfo: [],
            infoMode: [],
            errorInfoMode: [],
            baseInfo: {
@@ -412,6 +449,10 @@
            baseLedId: '',
            baseCrnId: '',
            baseUrl: '',
            apiIp: '192.168.5.111',
            apiPort: '9090',
            apiUrl: 'jsjwcs',
            ledInfosApi: '/console/getLedInfos',
            info: null,
            error: null,
            infoType: 0,
@@ -463,10 +504,10 @@

         this.getDate2()
         setTimeout(() => {
            // this.getServerData()
            // this.initlineChart()
            // this.initPieChart()
            // this.getOther()
            this.getServerData()
            this.initlineChart()
            this.initPieChart()
            this.getOther()
            setTimeout(() => {
               this.getServerData()
               this.initlineChart()
@@ -477,11 +518,13 @@
                  this.initlineChart()
                  this.initPieChart()
                  this.getOther()
               }, 3000)
            }, 1000)
         }, 1000)
               }, 500)
            }, 500)
         }, 500)
      },
      onLoad() {
         this.getLedInfo()
			
         setInterval(() => {
            this.getDate2()
            this.getUrl()
@@ -497,9 +540,27 @@
            this.initlineChart()
            this.initPieChart()
            this.getOther()
         }, 3600000)
         }, 180000)
      },
      methods: {
         carInfoModel(res) {
            let infoList = []

            if (res.code == 200 && res.data != '') {
               let str = ''
               for (let k of res.data) {
                  str = `${k.deviceNo}号${k.device}-${k.errorMsg}`
                  infoList.push(str)
               }
               this.carInfo = infoList
               this.errorBoardShow = true
            } else {
               this.errorBoardShow = false
            }
         },
         changeErrorShow() {
            this.errorBoardShow = !this.errorBoardShow
         },
         timeOuts() {
            console.log(this.times);
         },
@@ -509,6 +570,25 @@
         getServerData() {
            this.chartsDataLine1 = JSON.parse(JSON.stringify(this.chartsData.Line))
            this.chartsDataPie2 = JSON.parse(JSON.stringify(this.chartsData.Pie))
         },
         getLedInfo() {
            let that = this
            uni.request({
               url: this.baseHttp +  that.apiIp + ":" + that.apiPort + "/" + that.apiUrl + "/" + that.ledInfosApi,
               method: "GET",
               data: {},
               success(result) {
                  var res = result.data
                  let data = res.data;
						
                  uni.setStorageSync('BaseIp', that.apiIp);
                  uni.setStorageSync('BaseLedId', data.staArr);
                  uni.setStorageSync('BasePort', that.apiPort);
                  uni.setStorageSync('BaseCrnId', data.crnId);
                  uni.setStorageSync('UPROJ', that.apiUrl);
                  this.getUrl()
               }
            })
         },
         // 获取错误信息
         getInfo2() {
@@ -599,11 +679,27 @@
               if (res.data[0].ioType === 101) {
                  that.infoText.title = '全板出库'
               } else if (res.data[0].ioType === 103) {
                  that.infoText.title = '检料出库'
                  that.infoText.title = '拣料出库'
               } else if (res.data[0].ioType === 107) {
                  that.infoText.title = '盘点出库'
               } else if (res.data[0].ioType === 1) {
                  that.infoText.title = '全板入库'
               } else if (res.data[0].ioType === 10) {
                  that.infoText.title = '空板入库'
               } else if (res.data[0].ioType === 54) {
                  that.infoText.title = '并板入库'
               } else if (res.data[0].ioType === 110) {
                  that.infoText.title = '空板出库'
               } else if (res.data[0].ioType === 53) {
                  that.infoText.title = '拣料再入库'
               } else if (res.data[0].ioType === 57) {
                  that.infoText.title = '盘点再入库'
               }
               that.infoText.staNo = res.data[0].staNo

               that.infoText.workNo = res.data[0].workNo
               that.infoText.barcode = res.data[0].barcode
               that.infoText.locNo = res.data[0].locNo
               that.infoText.sourceLocNo = res.data[0].sourceLocNo
               that.swiperList = res.data[0].matDtos
               // that.infoText.matnr = res.data[0].matDtos[0].matnr
               // that.infoText.specs = res.data[0].matDtos[0].specs
@@ -1100,7 +1196,7 @@

   .info-box {
      width: 98%;
      height: 98%;
      height: 90%;
   }

   /* 异常信息 */
@@ -1234,4 +1330,26 @@
   .textred {
      color: red;
   }

   .board {
      position: absolute;
      top: 0;
      right: 0;
      /* background-color: #aa00ff; */
      /* height: 13vh; */
      width: 100%;
      /* box-shadow: rgba(0,0,0,.35) 0px 5px 15px; */
   }

   .error-board {
      margin: .2rem;
      height: 11vh;
      background-color: #F56C6C;
      box-shadow: rgba(0, 0, 0, .35) 0px 5px 15px;
      border-radius: .2rem;
      display: flex;
      align-items: center;
      justify-content: space-around;
      font-size: 2rem;
   }
</style>