#
whycq
2024-03-21 4dc72b22acac30fa642999a845d708feacc28100
Monitor-APP/pages/home/home.vue
@@ -4,13 +4,15 @@
        <uni-transition :duration="duration" :mode-class="infoMode" :show="infoViewShow">
            <view class="home-view">
                <view class="head">
               <view class="head-left" @click="ejected()"></view>
               <view class="head-mid">
                  <text style="z-index: 999;">立体库入库看板</text>
               <view class="head-left" @click="ejected()">
                  <view class="logo"></view>
               </view>
               <view class="head-right"></view>
               <view class="head-mid">
                  <text style="z-index: 999;">出库单列表</text>
               </view>
               <view class="head-right">
                  <view class="time-tools">{{calendar}}</view>
               </view>
                </view>
                <!-- 日历 -->
                <!-- <view class="time-tools">{{calendar}}</view> -->
@@ -24,13 +26,14 @@
                            <view class="text-content">
                                <!-- head -->
                                <view class="swiper-head">
                                    <view style="width: 10%;">序号</view>
                                    <view style="width: 25%;">品番</view>
                                    <view style="width: 15%;">待补货数量</view>
                             <view style="width: 15%;">已补货数量</view>
                             <view style="width: 15%;">补货状态</view>
                           <view style="width: 10%;">工单创建时间</view>
                           <view style="width: 10%;">预计完成时间</view>
                                    <view class="item-box1" style="width: 10%;">呼叫编号</view>
                                    <view class="item-box1" style="width: 15%;">呼叫产线</view>
                                    <view class="item-box1" style="width: 15%;">产线代码</view>
                           <view class="item-box1" style="width: 15%;">呼叫工单</view>
                           <view class="item-box1" style="width: 15%;">任务名称</view>
                           <view class="item-box1" style="width: 10%;">出库单状态</view>
                           <view class="item-box1" style="width: 10%;">呼叫时间</view>
                           <view class="item-box1" style="width: 9.5%;">最晚送达时间</view>
                                </view>
                                <!-- body -->
                                <view class="swiper-body">
@@ -39,31 +42,34 @@
                                    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="item.inspectSts" class="swiper-item"  v-for="(item,i) in swiperList" :key="i">
                                            <view class="item-box" style="width: 10%;" >{{i+1}}</view>
                                            <view class="item-box" style="width: 25%;">{{item.maktx}}</view>
                                            <view class="item-box" style="width: 15%;">{{item.storeReplenishment}}</view>
                                    display-multiple-items="10"
                                    circular="true" :autoplay="false" :interval="3000" :duration="1000" disable-touch='true'>
                                        <swiper-item class="swiper-item"  v-for="(item,i) in swiperList" :key="i">
                                            <view class="item-box" style="width: 10%;" >{{item.callNo ? item.callNo : '--'}}</view>
                                            <view class="item-box" style="width: 15%;">{{item.callLine}}</view>
                                            <view class="item-box" style="width: 15%;">{{item.callLineNo}}</view>
                                            <view class="item-box" style="width: 15%;">
                                    
                                    <text style="color: #25E51E ;"  v-if="item.inspectSts == 'inspectWhite'">{{item.storeAdd}}</text>
                                    <text v-if="item.inspectSts == 'inspectRed'">{{item.storeAdd}}</text>
                                    <text v-if="item.inspectSts == 'inspectRed'">{{item.callOrder}}</text>
                                 </view>
                                            <view class="item-box" style="width: 15%;">
                                    <text class="beBatch1" v-if="item.beBatch == 2 && item.inspectSts == 'inspectWhite'">
                                       {{item.beBatch$}}
                                 <view class="item-box" style="width: 15%;">{{item.callName}}</view>
                                 <view class="item-box" style="width: 10%;">
                                    <text class="beBatch1" v-if="item.callSettle == 2 ">
                                       {{item.callSettle$}}
                                    </text>
                                    <text class="beBatch2" v-if="item.beBatch != 2 && item.inspectSts == 'inspectWhite'">
                                       {{item.beBatch$}}
                                    <text class="beBatch2" v-if="item.callSettle != 2 ">
                                       {{item.callSettle$}}
                                    </text>
                                    <text class="beBatch3" v-if="item.inspectSts != 'inspectWhite'">
                                    <!-- <text class="beBatch3" v-if="item.inspectSts != 'inspectWhite'">
                                       {{item.beBatch$}}
                                    </text>
                                    </text> -->
                                 </view>
                                 <view class="item-box" style="width: 10%;">{{item.appeTime$}}</view>
                                 <view class="item-box" style="width: 9.5%;">{{item.overTime$ ? item.overTime$ : '--'}}</view>
                                 <view class="item-box" style="width: 10%;">{{item.callTime$}}</view>
                                 <view class="item-box" style="width: 9.5%;">{{item.lastTime$}}</view>
                                        </swiper-item>
                              <view style="height: 1px;"></view>
                                    </swiper>
                                </view>
                            </view>
@@ -140,7 +146,28 @@
                </view>
            </view>
        </view>
    </view>
      <!-- 确认是否操作 -->
      <view>
         <uni-popup ref="inputDialog" type="dialog">
            <uni-popup-dialog :type="msgType" :title="dialogTitle" :content="dialogContent" @confirm="dialogConfirm"
                           @close="dialogClose"></uni-popup-dialog>
         </uni-popup>
      </view>
      <!-- 操作成功失败弹窗 -->
      <view>
         <!-- 提示信息弹窗 -->
         <uni-popup ref="message" type="message">
            <uni-popup-message :type="messageType" :message="messageText" :duration="3000"></uni-popup-message>
         </uni-popup>
      </view>
      <view class="board">
         <uni-transition ref="ani" custom-class="transition" :mode-class="newModeClass" :show="errorBoardShow">
            <view class="error-board">
               <text v-for="item in carInfo">{{item}}</text>
            </view>
         </uni-transition>
      </view>
   </view>
</template>
 
<script>
@@ -149,6 +176,18 @@
    export default {
        data() {
            return {
            newModeClass: 'slide-top',
            errorBoardShow: false,
            carInfo: [],
            type: 'center',
            msgType: 'success',
            messageType: 'success',
            messageText: '这是一条成功提示',
            dialogTitle: '',
            value: '',
            dialogContent: '确认开始该笔补货物料?',
            matnr: '',
            dialogType: 0,
                series: [],
                homeViewShow: false,
                infoViewShow: true    ,
@@ -234,14 +273,15 @@
        onLoad() {
         setInterval(()=>{
            // this.getServerData()
            // this.getDate2()
            // this.getUrl()
            // this.getInfo()
            // this.getError()
            // this.getInfo2()
            // this.getError2()
            // this.getInfo3()
            this.getInfo4()
            this.getDate2()
            this.getInfo3()
            this.getCarInfo()
            // this.getInfo4()
            // this.controller()
         },1000)
         
@@ -258,23 +298,98 @@
        },
        methods: {
         // 日历 服务器
         // 异常信息
         getCarInfoTest() {
            let that = this
            var result = ycqdata.carError
            var res = result.data
            that.carInfoModel(res)
         },
         getCarInfo() {
            let that = this
            uni.request({
               url: that.commonUrl + "/mobile/error/list2",
               method: "GET",
               success(result) {
                  var res = result.data
                  that.carInfoModel(res)
               }
            })
         },
         carInfoModel(res) {
            let infoList = []
            if (res.code == 200 && res.data != '') {
               let str = ''
               for (let k of res.data) {
                  str = `${k.tsakNo1}-${k.errName}`
                  infoList.push(str)
               }
               this.carInfo = infoList
               this.errorBoardShow = true
            } else {
               this.errorBoardShow = false
            }
         },
         getDate2() {
            let that = this
            if(that.commonUrl == 'undefined') {
               return
            }
            uni.request({
               url: that.commonUrl + "/monitor/date",
               url: that.commonUrl + "/mobile/date",
               method:"GET",
               success(result) {
                  // console.log(result);
                  var res = result.data.data
                  that.calendar = res.year + "年" + res.month + "月" + res.day + "日 " + res.hour + ":" + res.minute + ":" + res.second + " " + res.week
                  that.calendar = res.hour + ":" + res.minute + ":" + res.second + " " + res.year + "-" + res.month + "-" + res.day
                  that.currDate = res.year + "/" + res.month + "/" + res.day
               },
               fail(res) {
               }
               
            })
         },
         // 开始按钮
         complete(matnr) {
            this.matnr = matnr
            this.dialogTitle = `品番:${matnr}`
            this.dialogType = 1
            this.dialogContent = '确认开始该笔补货物料?'
            this.$refs.inputDialog.open()
         },
         // 结束按钮
         cancel(matnr) {
            this.matnr = matnr
            this.dialogTitle = `品番:${matnr}`
            this.dialogType = 2
            this.dialogContent = '确认完成该笔补货物料?'
            this.$refs.inputDialog.open()
         },
         // 弹窗取消
         dialogClose() {
            this.$refs.inputDialog.close()
         },
         // 弹窗确认
         dialogConfirm() {
            let that = this
            uni.request({
                url: that.commonUrl + "/LocDetlReplenishmentController/hand/control/re",
                method:"GET",
                data: {matnr:that.matnr,type: that.dialogType},
                success(result) {
                  console.log(result);
                    var res = result.data
                  if (res.code === 200) {
                     that.messageType = 'success'
                     that.messageText = `操作成功`
                     that.$refs.message.open()
                  } else {
                     that.messageType = 'error'
                     that.messageText = res.msg
                     that.$refs.message.open()
                  }
                }
            })
         },
            getUrl() {
@@ -316,9 +431,9 @@
         getInfo3() {
            let that = this
            uni.request({
                url: that.commonUrl + "/open/loc/query/auth/v1",
                url: that.commonUrl + "/mobile/order/list",
                method:"GET",
                data: {ledId:that.baseLedId},
               data: {},
                success(result) {
                    var res = result.data
                  for (let k of res.data) {
@@ -660,7 +775,7 @@
    .container{
        width: 100vw;
        min-height: 100vh;
        background-color: #13151d;
        background-color: #083870;
        color: #fff;
        text-align: center;
        
@@ -706,11 +821,23 @@
      background-image: url(../../static/headleft.png);
      background-size: 110% 100%;
   }
   .logo {
      position: absolute;
      left: 30%;
      top: 90%;
      width: 60%;
      height: 110%;
      background-image: url(../../static/DENSO_logo.png);
      background-size: 60% 60%;
      /* background-color: #55ff7f; */
      background-repeat: no-repeat;
      transform: scaleX(-1);
   }
    .time-tools {
        position: absolute;
        right: 2%;
        top: 2%;
        font-size:1vw;
        right: 4%;
        top: 6%;
        font-size:1.2vw;
        transform: scale(0.8);
    }
    .button-left {
@@ -851,6 +978,7 @@
    .info-box {
        width: 98%;
        height: 98%;
      background-color: #032246;
    }
    /* 异常信息 */
    .error-info-view {
@@ -956,20 +1084,18 @@
        justify-content: center;
    }
   .beBatch1 {
      padding: 18rpx;
      color: #F3720D;
      height: 60rpx;
      text-align: center;
      line-height: 60rpx;
      border-radius: 10rpx;
      color: #ffba02;
      padding: 4rpx 10rpx;
      background-color: #fff8e6;
      font-weight: bold;
      border-radius: 2rpx;
   }
   .beBatch2 {
      padding: 18rpx;
      color: #25E51E ;
      height: 60rpx;
      text-align: center;
      line-height: 60rpx;
      border-radius: 10rpx;
      color: #ff5454;
      padding: 4rpx 10rpx;
      background-color: #ffeded;
      font-weight: bold;
      border-radius: 2rpx;
   }
   .inspectRed {
      color: #F10F0F;
@@ -977,11 +1103,52 @@
   .inspectWhite {
      color: #FFF;
   }
   .item-box1 {
      height: 98%;
      display: flex;
      align-items: center;
      justify-content: center;
      border-left: 1px solid #7db2f7;
   }
   .item-box {
      height: 98%;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #18167c;
      border: 1px solid #074a9a;
   }
</style>
   .start-btn {
      color: #FFF;
      background-color: #13ce66;
      transform: scale(0.7);
   }
   .end-btn {
      color: #FFF;
      background-color: #1890ff;
      transform: scale(0.7);
   }
   .popup {
   }
   .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>