#
whycq
2024-02-07 8dbcf49091f41d784b777a932910552e5ff84a93
Monitor-APP/pages/home/home.vue
@@ -2,118 +2,46 @@
   <view class="container">
      <uni-transition :duration="duration" :mode-class="homeMode" :show="homeViewShow">
         <view class="home-view">
            <view class="head">
               <text>自动仓库监控平台</text>
            </view>
            <!-- 日历 -->
            <view class="time-tools">{{calendar}}</view>
            <view class="button-left" @click="ejected()"></view>
            <view class="button-right" @click="ejected()"></view>
            <view class="main">
            <view v-if="locs.length==0"><button size="mini" @click="ejected()" >配置</button></view>
            <!-- <view class="main" v-if="locs" >
               <view class="main-b" v-for="item in locs" :class="item.color">
                  <view class="flex-col" style="width: 100%;">
                     <view class="flex-row">
                        <view style="flex: 1;">{{item.devNo}}</view>
                        <view style="flex: 1;">{{item.locSts$}}</view>
                        <!-- <view style="flex: 1;" v-if="item.agvWrkMast">{{item.agvWrkMast.wrkNo}}</view> -->
                        <view style="flex: 1;"></view>
                     </view>
                     <view class="flex-row">
                        <view style="flex: 1;" v-if="item.agvWrkMast">工作号:{{item.agvWrkMast.wrkNo}}</view>
                        <view style="flex: 1;" v-if="item.agvWrkMast" >{{item.agvWrkMast.wrkSts$}}</view>
                        <view style="flex: 1;" v-if="item.agvWrkMast">{{item.agvWrkMast.ioType$}}</view>
                        <view style="flex: 1;" v-if="!item.agvWrkMast"></view>
                     </view>
                     <view class="flex-row">
                        <view style="flex: 1;" v-if="item.agvWaitPakin">料箱码: {{item.agvWaitPakin.suppCode}}</view>
                        <view style="flex: 1;" v-if="item.agvWrkDetl">料箱码:{{item.agvWrkDetl.suppCode}}</view>
                        <view style="flex: 1;" ></view>
                        <view style="flex: 1;" ></view>
                     </view>
                  <view style="background-color: aquamarine;height: 100%;border: 1px solid #999;">
                     <image style="background-color: #FFF;margin: 16rpx;" src="../../static/moren.png" mode="heightFix"></image>
                  </view>
                  <view class="flex-col" style="width: 100%;"  v-if="item.agvWaitPakin">
                     <view class="flex-row" style="background-color: #007aff;">
                        <view style="flex: 2;">订单号</view>
                        <view style="flex: 2;">物料号</view>
                        <view style="flex: 1;">批号</view>
                        <view style="flex: 1;">数量</view>
                        <view style="flex: 1;">总数量</view>
                     </view>
                     <view class="flex-row" v-for="k in item.agvWaitPakin.orderNo">
                        <view style="flex: 2;">{{k.orderNo}}</view>
                        <view style="flex: 2;">{{item.agvWaitPakin.matnr}}</view>
                        <view style="flex: 1;">{{item.agvWaitPakin.batch ? item.agvWaitPakin.batch : '--'}}</view>
                        <view style="flex: 1;">{{k.anfme}}</view>
                        <view style="flex: 1;">{{item.agvWaitPakin.anfme + item.agvWaitPakin.volume}}</view>
                     </view>
                  </view>
                  <view class="flex-col" style="width: 100%;"  v-if="item.agvWrkDetl">
                     <view class="flex-row" style="background-color: #007aff;">
                        <view style="flex: 2;">订单号</view>
                        <view style="flex: 2;">物料号</view>
                        <view style="flex: 1;">批号</view>
                        <view style="flex: 1;">数量</view>
                        <view style="flex: 1;">库存数量</view>
                     </view>
                     <view class="flex-row" v-for="k in item.agvWrkDetl.orderNo">
                        <view style="flex: 2;">{{k.orderNo}}</view>
                        <view style="flex: 2;">{{item.agvWrkDetl.matnr}}</view>
                        <view style="flex: 1;">{{item.agvWrkDetl.batch ? item.agvWrkDetl.batch : '--'}}</view>
                        <view style="flex: 1;">{{k.anfme}}</view>
                        <view style="flex: 1;">{{item.agvWrkDetl.anfme + item.agvWrkDetl.volume}}</view>
                     </view>
                  </view>
                  <view style="position: absolute;bottom: 0;left: 0;width: 100%;display: flex;justify-content: center;" v-if="item.agvWrkMast && item.agvWrkMast.ioType == 103 && item.agvWrkDetl">
                     <!-- <button type="primary" size="mini">拣料回库</button> -->
                     <view style="width: 60%;background-color: #007aff;height: 3vh;display: flex;align-items: center;justify-content: center;font-size: 30rpx;
                        border-radius: 8rpx;" @click="pickIn(item.devNo)">拣料回库</view>
                  </view>
                  <view style="position: absolute;bottom: 0;left: 0;width: 100%;display: flex;justify-content: center;" v-if="item.agvWrkMast && item.agvWrkMast.ioType == 101 && item.agvWrkDetl">
                     <!-- <button type="primary" size="mini">容器离场</button> -->
                     <view style="width: 60%;background-color: #007aff;height: 3vh;display: flex;align-items: center;justify-content: center;font-size: 30rpx;
                        border-radius: 8rpx;" @click="containerMoveOut(item.devNo)">容器离场</view>
                  </view>
               </view>
            </view>
            <!-- 主视图 -->
            <!-- <view class="main">
               <view class="main-y" v-for="item in locs">
                  <view class="y-it"><view class="y-it-desc">工作站编号:</view><view class="margin">{{item.devNo}}</view></view>
                  <view class="y-it"><view class="y-it-desc">工作站编号:</view><view class="margin">{{item.locSts$}}</view></view>
                  <view class="y-it" v-if="item.agvWaitPakin"><view class="y-it-desc">订单号:</view><view class="margin">{{item.agvWaitPakin.orderNo}}</view></view>
                  <view class="y-it" v-if="item.agvWaitPakin"><view class="y-it-desc">物料号:</view><view class="margin">{{item.agvWaitPakin.matnr}}</view></view>
                  <view class="y-it" v-if="item.agvWaitPakin"><view class="y-it-desc">批号:</view><view class="margin">{{item.agvWaitPakin.batch}}</view></view>
                  <view class="y-it" v-if="item.agvWaitPakin"><view class="y-it-desc">料箱码:</view><view class="margin">{{item.agvWaitPakin.suppCode}}</view></view>
                  <view class="y-it" v-if="item.agvWaitPakin"><view class="y-it-desc">数量:</view><view class="margin">{{item.agvWaitPakin.anfme}}</view></view>
                  <view class="y-it" v-if="item.agvWrkMast"><view class="y-it-desc">工作号:</view><view class="margin">{{item.agvWrkMast.wrkNo}}</view></view>
                  <view class="y-it" v-if="item.agvWrkMast"><view class="y-it-desc">工作状态:</view><view class="margin">{{item.agvWrkMast.wrkSts$}}</view></view>
                  <view class="y-it" v-if="item.agvWrkMast"><view class="y-it-desc">工作类型:</view><view class="margin">{{item.agvWrkMast.ioType$}}</view></view>
                  <view class="y-it" v-if="item.agvWrkDetl "  >
                     <view style="display: flex;align-items: stretch;" >
                        <view style="height: 100%">订单号: </view>
                        <view style="width: 16vw;display: flex;flex-wrap: wrap;">
                           <view style="width: 100%; text-align: left;" v-for="k in item.agvWrkDetl.orderNo">{{k.orderNo}}--{{k.anfme}}</view>
                        </view>
                     </view>
                  </view>
                  <view class="y-it" v-if="item.agvWrkDetl"><view class="y-it-desc">物料号:</view><view class="margin">{{item.agvWrkDetl.matnr}}</view></view>
                  <view class="y-it" v-if="item.agvWrkDetl"><view class="y-it-desc">批号:</view><view class="margin">{{item.agvWrkDetl.batch}}</view></view>
                  <view class="y-it" v-if="item.agvWrkDetl"><view class="y-it-desc">料箱码:</view><view class="margin">{{item.agvWrkDetl.suppCode}}</view></view>
                  <view class="y-it" v-if="item.agvWrkDetl">
                     <view class="y-it-desc" >取货数量:</view><view class="margin">{{item.agvWrkDetl.anfme}}</view>
                     <view class="y-it-desc" style="flex:1;">结余数量:</view><view class="margin" style="margin-right: 10%;">{{item.agvWrkDetl.volume}}</view>
                  </view>
               </view>
            </view> -->
            <view style="font-size: 32px;">
               AGV 料箱
            </view>
            <!-- <view>
               <view><text>工作号:</text><text>{{locs[0].wrkNo ? locs[0].wrkNo : '--'}}</text></view>
            </view> -->
            <view class="linke" v-if="locs" >
               <view class="linke-item" v-for="item in locs" :class="item.color">
                  <view style="background-color: aquamarine;height: 100%;border: 1px solid #999;">
                     <image style="background-color: #FFF;margin: 16rpx;" src="../../static/moren.png" mode="heightFix"></image>
                  </view>
                  <view style="display: flex;flex-direction: column;font-size: 10px;text-indent: 1em;text-align: start;" v-if="item.wrkNo">
                     <view><text>订单号:</text><text>{{item.orderNo ? item.orderNo : '--'}}</text></view>
                     <view><text>工作号:</text><text>{{item.wrkNo ? item.wrkNo : '--'}}</text></view>
                     <view><text>箱码:</text><text>{{item.suppCode ? item.suppCode : '--'}}</text></view>
                     <view><text>物料名称:</text><text>{{item.maktx ? item.maktx : '--'}}</text></view>
                     <view><text>物料号:</text><text>{{item.matnr ? item.matnr : '--'}}</text></view>
                     <view><text>规格:</text><text>{{item.specs ? item.specs : '--'}}</text></view>
                     <view><text>数量:</text><text>{{item.anfme ? item.anfme : '--'}}</text></view>
                     <view><text>结余:</text><text>{{item.volume ? item.volume : '--'}}</text></view>
                  </view>
                  <view style="display: flex;flex-direction: column;font-size: 10px;text-indent: 1em;text-align: start;" v-if="!item.wrkNo">
                     <view><text>订单号:</text><text>{{item.orderNo ? item.orderNo : '--'}}</text></view>
                     <view><text>箱码:</text><text>{{item.suppCode ? item.suppCode : '--'}}</text></view>
                     <view><text>物料名称:</text><text>{{item.maktx ? item.maktx : '--'}}</text></view>
                     <view><text>物料号:</text><text>{{item.matnr ? item.matnr : '--'}}</text></view>
                     <view><text>规格:</text><text>{{item.specs ? item.specs : '--'}}</text></view>
                     <view><text>数量:</text><text>{{item.anfme ? item.anfme : '--'}}</text></view>
                     <view><text>结余:</text><text>{{item.volume ? item.volume : '--'}}</text></view>
                  </view>
                </view>
            </view>
            
         </view>
      </uni-transition>
@@ -188,9 +116,49 @@
   export default {
      data() {
         return {
            locs: [],
            locs: [
               // {devNo:'CS-309-005-03@3',locSts$:'O.空库位',
               // agvWrkMast:{},
               // agvWaitPakin: [
               //       {matnr:"123123",maktx:"hhahah"},
               //       {}
               //    ]
               // },
               {
                  wrkNo:'',
                  anfme:6.0,
                  matnr:"420201001209204",
                  maktx: '硅胶干燥剂10g',
                  suppCode: "cdoedad"
               },
               {
                  wrkNo:137207,
                  anfme:6.0,
                  matnr:"420201001209204"
               },
               {
                  wrkNo:137207,
                  anfme:6.0,
                  matnr:"420201001209204"
               },
               {
                  wrkNo:137207,
                  anfme:6.0,
                  matnr:"420201001209204"
               },
               {
                  wrkNo:137207,
                  anfme:6.0,
                  matnr:"420201001209204"
               },
               {
                  wrkNo:137207,
                  anfme:6.0,
                  matnr:"420201001209204"
               },
               ],
            floors: [{value: 1,name:'1楼'},{value:2,name:'3楼'}],
            rows: [{value: 'cs-101',name:'1号'},{value: 'cs-102',name:'2号'}],
            rows: [{value: 'cs-101',name:'101'},{value: 'cs-102',name:'102'}],
            ck1: true,
            ck2: false,
            current: 'cs-101',
@@ -324,11 +292,14 @@
         // 容器离场
         containerMoveOut(e) {
            let _this = this
            let devNo = {devNo:[e]}
            // console.log(JSON.stringify(devNo));
            uni.request({
               url: `${_this.commonUrl}/agv/basDevp/visualized/container/moveOut`,
               data: {devNo: e},
               data: JSON.stringify(devNo),
               method: 'POST',
               success(res) {
               }
            })
         },
@@ -337,9 +308,9 @@
            this.ck1 = this.ck2
            this.ck2 = temp
            if (this.ck1) {
               this.rows = [{value: 'cs-101',name:'1号'},{value: 'cs-102',name:'2号'}]
               this.rows = [{value: 'cs-101',name:'101'},{value: 'cs-102',name:'102'}]
            } else {
               this.rows = [{value: 'CS-305',name:'1号'},{value: 'CS-306',name:'2号'},{value: 'CS-307',name:'3号'}]
               this.rows = [{value: 'CS-313',name:'313'},{value: 'CS-312',name:'312'},{value: 'CS-311',name:'311'},{value: 'CS-310',name:'310'}]
            }
         },
         radioChange(evt) {
@@ -352,45 +323,24 @@
         },
         getVisualized() {
            let that = this
            let param = {stationCode: `${that.current}`}
            let param = {devNo: `${that.current}`}
            uni.request({
               url: `${that.commonUrl}/agv/basDevp/visualized/list/auth`,
               header: { 'Access-Control-Allow-Origin': '*'},
               url: `${that.commonUrl}/rpc/info`,
               header: {
                  'Access-Control-Allow-Origin': '*',
                  'Access-Control-Allow-Methods': 'GET,POST,OPTIONS',
                  'Access-Control-Allow-Headers': 'X-Request-with,Content-Type',
                  },
               sslVerify: false,
               withCredentials: true,
               method: 'POST',
               data: JSON.stringify(param),
               success(res) {
                  res = res.data
                  console.log(res);
                  that.result = res
                  if (res.code === 200 && res.data.body.length>0) {
                     that.locs = [];
                     for (let k of res.data.body) {
                        for (let i of k.loc) {
                           if (i.agvWrkDetl) {
                              let a = i.agvWrkDetl.orderNo
                              if (RegExp(/{/).test(a)) {
                                 i.agvWrkDetl.orderNo =   JSON.parse(a)
                              } else {
                                 i.agvWrkDetl.orderNo = []
                                 // console.log(i.agvWrkDetl);
                                 i.agvWrkDetl.orderNo.push({anfme:i.agvWrkDetl.anfme,orderNo:a})
                              }
                           }
                           if (i.agvWaitPakin) {
                              let a = i.agvWaitPakin.orderNo
                              if (RegExp(/{/).test(a)) {
                                 i.agvWaitPakin.orderNo =   JSON.parse(a)
                              } else {
                                 i.agvWaitPakin.orderNo = []
                                 // console.log(i.agvWrkDetl);
                                 i.agvWaitPakin.orderNo.push({anfme:i.agvWaitPakin.anfme,orderNo:a})
                              }
                           }
                           if(i.locSts == 'F') {
                              i['color'] = 'pakin'
                           }
                           that.locs.push(i)
                        }
                     }
                  if (res.code === 200 && res.data) {
                     that.locs = res.data
                  }
               }
            })
@@ -483,20 +433,33 @@
      justify-content: center;
      /* text-align: left; */
   }
   .main {
      height: 100vh;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-around;
      position: relative;
   }
   .linke {
      display: flex;
      flex-wrap: wrap;
   }
   .linke-item {
      width: 50vw;
      height: 31.5vh;
      display: flex;
      background-color: rgba(255, 255, 255, .05);
   }
   .main-b {
      font-size: 22rpx;
      font-size: 24rpx;
      background-color: rgba(255, 255, 255, .05);
      /* background-color: rgba(0, 189, 47, 0.3); */
      width:19vw;
      height: 28vh;
      margin-top: 4px;
      width:49.8vw;
      height: 33vh;
      backdrop-filter: blur(3px);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      /* align-items: stretch; */
      /* justify-content: center; */
      /* flex-direction: column; */
   }
   .pakin {
      background-color: rgba(0, 189, 47, 0.3);
@@ -537,7 +500,7 @@
   .home-view {
      width: 100vw;
      min-height: 100vh;
      background-image: url(../../static/background.png);
      /* background-image: url(../../static/background.png); */
      background-size: 100vw 100vh;
   }
   .home-right {
@@ -649,11 +612,11 @@
   
   /* 共用 */
   .main {
      height: 88vh;
      margin: 16rpx;
      height: 100vh;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-around;
      position: relative;
   }
   .mian-item {
      width: 50%;