#

whycq

2022-07-19 c6b1363a759595e3d9334cab8a8e753d0783987a

 Monitor-APP/pages/index/index.vue

@@ -1,6 +1,8 @@
<template>
   <view class="container">
      <!-- 跳动信息板 -->
      <view class="floor-screen" :class="floorMove" >
         <!-- 头部 -->
         <view class="head">
            <text @click="port()">自动仓库WCS监控平台</text>
            <view class="time-tools">{{year}}-{{month}}-{{day}}&nbsp{{hours}}:{{minutes}}:{{seconds}}&nbsp{{week}}</view>
@@ -14,17 +16,21 @@
                  <view class="box-border box-border2"></view>
                  <view class="box-border box-border3"></view>
                  <view class="box-border box-border4"></view>
                  <!-- 全板出库 -->
                  <view style="width: 10%;height: 100%;display:inline-block;float: left;text-align: center;padding-top: 180px;">
                     <text>{{title}}</text>
                  </view>
                  <view style="width: 80%;height: 100%;display: inline-block;float: left;font-size: 160rpx;">
                      <!--显示order订单编号 -->
                     <text v-show="orderShow" style="display: inline-block;position: absolute; height: 12%;width: 68%;background-color: #001ead;z-index: 9999;" >CK20220718</text>
                     <!-- 显示滚动列表 -->
                     <text class="animate" style="" v-show="!errorShow && pakinShow && pakinGun">{{newspaper}}</text>
                     <text v-show="errorShow">{{errorPaper}}</text>
                     <text v-show="pakinShow">{{newspaper}}</text>
                  <!-- 滚动区域 -->
                  <view style="width: 80%;height: 100%;display: inline-block;">
                     <!--显示order订单编号 -->
                     <text v-show="orderShow" style="display: block;font-size: 140rpx;" >{{orderNo}}</text>
                     <swiper :class="swiper" circular="true" vertical="true" display-multiple-items="6" :autoplay="autoplay" :interval="interval" :duration="duration">
                        <swiper-item v-for="(item,index) in matList" :key="index">
                           <view style="font-size: 160rpx;">{{item}}</view>
                        </swiper-item>
                     </swiper>
                  </view>
                  <!-- 站台号 -->
                  <view style="width: 10%;height: 100%;display: inline-block;float: right;padding-top: 180px;">
                     <text>{{staNo}}</text>
                  </view>
@@ -95,7 +101,7 @@
                        <p class="english">EQUIPMENT USAGE THIS MONTH</p>
                     </view>
                     <view class="use-right">
                        <h3>20%</h3>
                        <h3>{{usedPr}}%</h3>
                        <p class="english">同比上月 + 5%</p>
                     </view>
                     <view class="use-main">
@@ -149,6 +155,7 @@
                        <p class="english">Today</p>
                     </view>
                     <view class="sub-main">
                        <!-- 折线图 -->
                        <view class="charts-box ring">
                           <qiun-data-charts type="ring" :opts="{legend:{position:'bottom'}}" :eopts="ringOpts" :chartData="chartsDataPie2" :echartsH5="true" :echartsApp="true"/>
                        </view>
@@ -179,7 +186,7 @@
                  <view class="box-border box-border4"></view>
                  <!-- <text>浙江中扬立库技术有限公司</text>
                  <text>当前版本号</text> -->
                  <view>浙江中扬立库技术有限公司</view>
                  <view @click="crn()">浙江中扬立库技术有限公司</view>
                  <image src="../../static/barcode.png" mode="aspectFit"></image>
               </view>
            </view>
@@ -188,7 +195,7 @@
      <view>
         <!-- 输入url -->
         <uni-popup ref="url" type="dialog">
            <uni-popup-dialog ref="inputClose" mode="input" title="配置url" :value="baseUrl"
            <uni-popup-dialog ref="inputClose" mode="input" title="配置url" :value="baseIP"
               placeholder="示例:192.168.1.1" @confirm="baseUrlConfirm"></uni-popup-dialog>
         </uni-popup>
      </view>
@@ -206,6 +213,13 @@
               placeholder="示例:9090" @confirm="portConfirm"></uni-popup-dialog>
         </uni-popup>
      </view>
      <view>
         <!-- 输入crnId -->
         <uni-popup ref="crnId" type="dialog">
            <uni-popup-dialog ref="inputClose" mode="input" title="配置堆垛机" :value="crnId"
               placeholder="示例:1" @confirm="crnConfirm"></uni-popup-dialog>
         </uni-popup>
      </view>
   </view>
</template>

@@ -215,12 +229,14 @@
   export default {
      data() {
         return {
            commonUrl:null, // 通用url
            show: true,
            modeClass: 'fade',
            styles: {},
            baseUrl:'10.10.0.200',
            baseIP:'',
            baseLedId:'',
            basePort:'',
            crnId:'',
            value: '',
            xDistance: 0,
            yDistance:0,
@@ -267,32 +283,41 @@
            pakinShow:'',
            pakinGun:'',
            orderShow:false,
            orderNo:null,
            swiper:'swiper-here',
            autoplay:true, // 自动循环
            interval:1000, // 调用时长
            duration:8000, // 移动速度
            matList:[], // 订单列表
         }
      },
      mounted() {
         let that = this
         const BaseUrl = uni.getStorageSync('BaseUrl');
         const BaseIP = uni.getStorageSync('BaseIp');
         const BaseLedId = uni.getStorageSync('BaseLedId');
         const BasePort = uni.getStorageSync('BasePort');
         if (BaseUrl && BaseLedId) {
            that.baseUrl = BaseUrl
         const BaseCrnId = uni.getStorageSync('BaseCrnId');
         if (BaseIP && BaseLedId) {
            that.baseIP = BaseIP
            that.baseLedId = BaseLedId
            that.basePort = BasePort
            that.baseCrnId = BaseCrnId
         } else {
            that.baseUrl = ''
            that.baseLedId = ''
         }
         this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + this.baseUrl
      },
      onReady() {
         // 获得初始数据
         setTimeout(() => {
            // this.initlineChart();
            // this.initPieChart();
				
            this.initlineChart();
            this.initPieChart();
         }, 0);
         setTimeout(() => {
            // this.getServerData();
            // this.getOther();
            // this.getPakin();
            this.getServerData();
            this.getOther();
            this.getPakin();
         }, 1000);
         setInterval(() => {
            this.getDate();
@@ -301,91 +326,35 @@
            // this.getYYY();
            // this.getEEE();
            this.animation();
         },1000)
         },2000)
      },
      methods: {
         getEEE() {
            var result = ycqdata.dataEEE
            let that = this
            let res = result.data
            if (res.data && res.data !== "") {
               that.title = ''
               that.staNo = ''
               that.pakinShow = false
               that.errorShow = true
               that.errorPaper = res.data
               that.move = false // 显示
            } else {
               that.errorPaper = ''
               that.errorShow = false
               if (that.pakinShow) {
                  return;
               } else {
                  that.move = true // 隐藏
               }
            }
         },
         getYYY() {
            var result = ycqdata.dataYYY
            let that = this
            var newsData = ''
            var str = ''
            let res = result.data
            if(res.data && res.data !== null) {
               if (res.data[0].matDtos.length > 0) {
                  that.pakinShow = true
                  that.pakinGun = true
                  if (res.data[0].ioType === 101) {
                     that.title = '全板出库'
                  } else if(res.data[0].ioType === 103) {
                     that.title = '检料出库'
                  }
                  if (res.data[0].orderNo) {
                     that.orderShow = true
                  } else {
                     that.orderShow = false
                  }
                  that.staNo = '目标站' + res.data[0].staNo
                  for (var i = 0; i < res.data[0].matDtos.length; i++) {
                     str = res.data[0].matDtos[i].matnr + ' - ' + res.data[0].matDtos[i].batch + '\n'
                     newsData = newsData + str 
                  }
                  if (that.errorShow) {
                     // that.pakinShow = false
                     return;
                  } else {
                     that.newspaper = newsData
                     that.move = false
                  }
                  if (res.data[0].matDtos.length <= 8) {
                     that.errorShow = true
                     that.pakinShow = true
                     that.pakinGun  = false
                  }
               } else {
                  that.move = true
                  }
            } else {
               that.move = true
            }
				
         },
         // 获取错误信息
         getError() {
            let that = this
            var res
            uni.request({
               url: "http://" + that.baseUrl + ":" + that.basePort + "/jkwcs/monitor/led/error",
               url: that.commonUrl + "/monitor/led/error",
               data: {
                  ledId:that.baseLedId
               },
               method:'GET',
               success(result) {
                  let res = result.data 
                  // res = result.data 
                  // 测试用 ↓
               result = ycqdata.dataEEE
               res = result.data
                  // 测试用 ↑
                  // 返回结果有值 且值不等于空值 就是有错误信息需要展示
                  if (res.data && res.data !== "") {
                     that.matList = []
                     that.orderNo = null
                     that.matList.push(res.data)
                     that.swiper = 'swiper-here-error'
                     that.title = ''
                     that.staNo = ''
                     that.pakinShow = false
                     that.errorShow = true
                     that.errorPaper = res.data
                     that.move = false // 显示
                  } else {
                     that.errorPaper = ''
@@ -401,16 +370,23 @@
         },
         getPakin () {
            let that = this
            that.matList = [] // 清空条码列表
            var newsData = ''
            var str = ''
            let res 
            uni.request({
               url: "http://" + that.baseUrl + ":" + that.basePort + "/jkwcs/monitor/led",
               url: that.commonUrl + "/monitor/led",
               data: {
                  ledId:that.baseLedId
               },
               method:'GET',
               success(result) {
                  var newsData = ''
                  var str = ''
                  let res = result.data
                  // res = result.data
                  // 测试用 ↓
               result = ycqdata.dataYYY
               res = result.data
                  // 测试用 ↑
                  console.log(res)
                  if(res.data && res.data !== null) {
                     if (res.data[0].matDtos.length > 0) {
                        that.pakinShow = true
@@ -421,16 +397,21 @@
                           that.title = '检料出库'
                        }
                        if (res.data[0].orderNo) {
                           that.orderNo = "订单号：" + res.data[0].orderNo
                           that.swiper = 'swiper-here-oN'
                           that.orderShow = true
                        } else {
                           that.orderNo = null;
                           that.swiper = 'swiper-here'
                           that.orderShow = false
                        }
                        that.staNo = '目标站' + res.data[0].staNo
                        for (var i = 0; i < res.data[0].matDtos.length; i++) {
                           str = res.data[0].matDtos[i].matnr + ' - ' + res.data[0].matDtos[i].batch + '\n'
                           newsData = newsData + str 
                           var matnr = res.data[0].matDtos[i].matnr + ' - ' + res.data[0].matDtos[i].batch 
                           that.matList.push(matnr)
                        }
                        if (that.errorShow) {
                           // that.pakinShow = false
                           return;
                        } else {
                           that.newspaper = newsData
@@ -443,12 +424,12 @@
                        }
                     } else {
                        that.move = true
                     }
                        }
                  } else {
                     that.move = true
                  }
               }
            })
            });
         },
         animation() {
            if (this.move) {
@@ -473,12 +454,15 @@
         initlineChart() {
            let that = this
            uni.request({
               url: "http://10.10.0.222:9090/jswcs/monitor/line/charts",
               url: that.commonUrl + "/monitor/line/charts",
               method:'GET',
               success(result) {
                  var res = result.data
                  if (res.code === 200) {
                     that.chartsData.Line.categories = [that.getDateFormat(-11),that.getDateFormat(-10),that.getDateFormat(-9),that.getDateFormat(-8),that.getDateFormat(-7),that.getDateFormat(-6),that.getDateFormat(-5),that.getDateFormat(-4),that.getDateFormat(-3),that.getDateFormat(-2),that.getDateFormat(-1),that.getDateFormat(0),]
                     that.chartsData.Line.categories = [
                        that.getDateFormat(-11),that.getDateFormat(-10),that.getDateFormat(-9),that.getDateFormat(-8),
                        that.getDateFormat(-7),that.getDateFormat(-6),that.getDateFormat(-5),that.getDateFormat(-4),
                        that.getDateFormat(-3),that.getDateFormat(-2),that.getDateFormat(-1),that.getDateFormat(0),]
                     that.chartsData.Line.series = res.data.rows
                  }
               }
@@ -488,13 +472,13 @@
         initPieChart() {
            let that = this
            uni.request({
               url: "http://10.10.0.222:9090/jswcs/monitor/loc/rep",
               url: that.commonUrl + "/monitor/loc/rep",
               method:'GET',
               success(result) {
                  var res = result.data
                  if (res.code === 200) {
                     that.chartsData.Pie.series[0].data = res.data.pie
                     that.stockCount = res.data.stockCount
                     that.stockCount = res.data.stockCunt
                     that.emptyCount = res.data.emptyCount
                     that.noneCount = res.data.noneCount
                     that.used = res.data.used
@@ -507,10 +491,10 @@
            let that = this
            uni.request({
               // http://10.10.0.222:9090/jkwcs/monitor/led?ledId=186
               url: "http://" + that.baseUrl + ":9090/jswcs/monitor/other",
               url: that.commonUrl + "/monitor/other",
               data: {
                  crnId: 1, 
                  ledId: this.baseLedId,
                  crnId: that.baseCrnId, 
                  ledId: 1,
               },
               success(result) {
                  var res = result.data
@@ -519,7 +503,6 @@
                     that.yDistance = res.data.yDistance
                     that.xDuration = res.data.xDuration
                     that.yDuration = res.data.yDuration
                     console.log(res)
                  } else if (res.code === 403) {
                     
                  } else {
@@ -537,9 +520,12 @@
         ledId() {
            this.$refs.ledId.open()
         },
         crn() {
            this.$refs.crnId.open()
         },
         baseUrlConfirm(val) {
            this.baseUrl = val
            uni.setStorageSync('BaseUrl', this.baseUrl);
            this.baseIp = val
            uni.setStorageSync('BaseIp', this.baseIp);
         },
         ledIdConfirm(val) {
            this.baseLedId = val
@@ -548,6 +534,10 @@
         portConfirm(val) {
            this.basePort = val
            uni.setStorageSync('BasePort',this.basePort);
         },
         crnConfirm(val) {
            this.baseCrnId = val
            uni.setStorageSync('BaseCrnId',this.baseCrnId);
         },
         getServerData() {
            this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line))
@@ -580,6 +570,30 @@
</script>

<style>
   /* 当前页面无 orderNo */
   .swiper-here {
      display: inline-block;
      margin: 0 auto;
      width: 100%;
      height: 100%;
   }
   /* 当前页面有 orderNo */
   .swiper-here-oN{
      display: inline-block;
      /* background-color: #063A7B; */
      margin: 0 auto;
      width: 100%;
      height: 90%;
   }
   /* 当前页面有 error提示 */
   .swiper-here-error {
      display: inline-block;
      /* background-color: #063A7B; */
      /* margin: 0 auto; */
      margin-top: 20%;
      width: 100%;
      height: 100%;
   }
   .animate {
      display: inline-block;
               /* white-space: nowrap; */
@@ -1025,3 +1039,19 @@
      bottom: 0;
   }
</style>
<!-- {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22037502300","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22037505146","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504801","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027507729","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027507727","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027507731","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504807","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504805","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504797","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504794","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504791","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504793","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22037505141","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027507728","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22027504810","count":1.0},
               {"matnr":"1100349-10000","maknx":"C5S-4-M03/333/KS","batch":"22037505148","count":1.0} -->