From 36909d121a6f1b4c3f4540b8c64c80e872d105ae Mon Sep 17 00:00:00 2001 From: zjj <3272660260@qq.com> Date: 星期三, 28 五月 2025 15:12:32 +0800 Subject: [PATCH] # --- Monitor-APP/pages/index/index.vue | 537 +++++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 442 insertions(+), 95 deletions(-) diff --git a/Monitor-APP/pages/index/index.vue b/Monitor-APP/pages/index/index.vue index cfe67fe..b24e432 100644 --- a/Monitor-APP/pages/index/index.vue +++ b/Monitor-APP/pages/index/index.vue @@ -1,10 +1,12 @@ <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}} {{hours}}:{{minutes}}:{{seconds}} {{week}}</view> - <view class="button-left" @click="url()"></view> + <view class="button-left" @click="ejected()"></view> <view class="button-right" @click="ledId()"></view> </view> <view class="main"> @@ -14,15 +16,58 @@ <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;"> + <view style="width: 100%;height: 100%;" v-show="!errorShow"> + <!-- 鍒嗘湁鏃犺鍗曞垝鍒嗕袱閮ㄥ垎 --> + <!-- 宸︿晶淇℃伅 --> + <view style="" :class="width"> + <!-- 鍏ㄦ澘鍑哄簱 --> + <view class="box-items">{{title}}</view> + <!-- 鐩爣绔� --> + <view class="box-items">{{staNo}}</view> + <!-- 鍟嗗搧缂栧彿 --> + <!-- <view class="box-items">{{matnr}}</view> --> + <!-- 鍟嗗搧鍚嶇О --> + <view class="box-items">{{maknx}}</view> + <!-- 鍟嗗搧鍚嶇О --> + <view class="box-items">{{specs}}</view> + <!-- 鍑哄簱鏁伴噺 --> + <view class="box-items">{{count}}</view> + </view> + <view style="width: 50%;height: 100%;display: inline-block;float: left;" v-show="orderShow"> + <!-- 璁㈠崟鍙� --> + <view class="box-items">{{orderNo}}</view> + <!-- 宸插嚭鎵樼洏鏁� --> + <view class="box-items">{{doneOfTray}}</view> + <!-- 鎵樼洏鎬绘暟閲� --> + <view class="box-items">{{totalOfTray}}</view> + <!-- 宸插嚭绠辨暟 --> + <view class="box-items">{{doneOfUnit}}</view> + <!-- 鎬荤鏁� --> + <view class="box-items">{{totalOfUnit}}</view> + </view> + </view> + <view style="width: 100%;height: 100%;" v-show="errorShow"> + <view style="line-height: 700px;font-size: 175rpx;">{{errorMsg}}</view> + </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: 170rpx;"> - <text class="animate">{{newspaper}}</text> - </view> - <view style="width: 10%;height: 100%;display: inline-block;float: right;padding-top: 180px;"> + </view> --> + <!-- 婊氬姩鍖哄煙 --> + <!-- <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> + </view> --> </view> </view> </view> @@ -31,7 +76,7 @@ <view class="head"> <text @click="port()">鑷姩浠撳簱WCS鐩戞帶骞冲彴</text> <view class="time-tools">{{year}}-{{month}}-{{day}} {{hours}}:{{minutes}}:{{seconds}} {{week}}</view> - <view class="button-left" @click="url()"></view> + <view class="button-left" @click="ejected()"></view> <view class="button-right" @click="ledId()"></view> </view> <view class="main"> @@ -90,7 +135,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"> @@ -174,8 +219,8 @@ <view class="box-border box-border4"></view> <!-- <text>娴欐睙涓壃绔嬪簱鎶�鏈湁闄愬叕鍙�</text> <text>褰撳墠鐗堟湰鍙�</text> --> - <view>娴欐睙涓壃绔嬪簱鎶�鏈湁闄愬叕鍙�</view> - <image src="../../static/barcode.png" mode="aspectFit"></image> + <view @click="crn()">鍢夊杽杈归攱鏈烘鑲′唤鏈夐檺鍏徃</view> + <!-- <image src="../../static/barcode.png" mode="aspectFit"></image> --> </view> </view> </view> @@ -183,7 +228,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> @@ -201,20 +246,70 @@ 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 class="eject-mask" v-show="ejectShow"> + <view class="eject"> + <!-- 寮瑰嚭title --> + <view class="eject-title">淇敼 / 閰嶇疆</view> + <!-- input --> + <view class="eject-input"> + <view class="item"> + <view class="desc">ip锛�</view> + <view class="input"> + <input type="text" v-model="baseIP"> + </view> + </view> + <view class="item"> + <view class="desc">port锛�</view> + <view class="input"> + <input type="text" v-model="basePort"> + </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> + <!-- button --> + <view class="eject-button"> + <view class="button-item" @click="ejectClose">鍙� 娑�</view> + <view class="button-item" @click="ejectConfirm">纭� 璁�</view> + </view> + </view> + + </view> </view> </template> <script> + import ycqdata from '@/pages/index/data.json'; import demodata from '@/mockdata/demodata.json'; 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, @@ -254,104 +349,217 @@ version:'', // newspaper:'鎷f枡鍑哄簱锛�4426)\n婧愬簱浣嶏細1200101\n鐩爣绔欙細186\n1101842-10000-22047518517\n\n', newspaper:'', + errorPaper:'', title:'', - staNo:'' + staNo:'', + matnr:'', + maknx:'', + specs:'', + count:'', + orderNo:null, + doneOfTray:'', + totalOfTray:'', + doneOfUnit:'', + totalOfUnit:'', + errorMsg:null, + width:'full-width', + errorShow:'', + pakinShow:'', + pakinGun:'', + orderShow:false, + swiper:'swiper-here', + autoplay:true, // 鑷姩寰幆 + interval:1000, // 璋冪敤鏃堕暱 + duration:8000, // 绉诲姩閫熷害 + matList:[], // 璁㈠崟鍒楄〃 + ejectShow: false, + } }, 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'); + that.baseIP = BaseIP that.baseLedId = BaseLedId that.basePort = BasePort - } else { - that.baseUrl = '' - that.baseLedId = '' - } - }, - onReady() { - setTimeout(() => { - // this.initlineChart(); - // this.initPieChart(); - - }, 0); - setTimeout(() => { - // this.getServerData(); - // this.getOther(); - // this.getPakin(); - }, 1000); - setInterval(() => { - this.getDate(); - // this.getPakin(); - // this.getYYY(); - this.animation(); - },1000) + that.baseCrnId = BaseCrnId + this.getUrl() }, onLoad() { - // var that=this - // plus.runtime.getProperty( plus.runtime.appid, function ( wgtinfo ) { - // that.version=wgtinfo.version - // }); + + }, + onReady() { + setInterval(() => { + // 鑾峰緱鍒濆鏁版嵁 + this.initlineChart(); + this.initPieChart(); + // 涓婚〉淇℃伅 + this.getServerData(); + this.getOther(); + // 鍏朵粬淇℃伅 + this.getDate(); + this.getPakin(); + this.getError(); + // this.getYYY(); + // this.getEEE(); + this.animation() + this.getUrl() + },1000) }, methods: { + // 鑾峰彇url + getUrl() { + this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + this.baseUrl + this.chartsDataLine1 = JSON.parse(JSON.stringify(demodata.Line)) + }, + // 鑾峰彇閿欒淇℃伅 + getYYY() { + let that = this + var result = ycqdata.dataEEE + // 娴嬭瘯鐢� 鈫� + var res = result.data + // 娴嬭瘯鐢� 鈫� + // 杩斿洖缁撴灉鏈夊�� 涓斿�间笉绛変簬绌哄�� 灏辨槸鏈夐敊璇俊鎭渶瑕佸睍绀� + if (res.data && res.data !== "") { + + that.errorMsg = res.data + that.errorShow = true + that.move = false // 鏄剧ず + } else { + that.errorPaper = '' + that.errorShow = false + if (that.pakinShow) { + return; + } else { + that.move = true // 闅愯棌 + } + } + }, + getEEE () { + let that = this + var newsData = '' + var str = '' + let result = ycqdata.dataYYY + // 娴嬭瘯鐢� 鈫� + let res = result.data + // 娴嬭瘯鐢� 鈫� + if(res.data && res.data !== null) { + if (res.data[0].ioType === 101) { + that.title = '鍏ㄦ澘鍑哄簱' + } else if(res.data[0].ioType === 103) { + that.title = '妫�鏂欏嚭搴�' + } + that.staNo = '鐩爣绔�:' + res.data[0].staNo + that.matnr = '鍟嗗搧缂栧彿锛�' + res.data[0].matDtos[0].matnr + that.maknx = '鍟嗗搧鍚嶇О锛�' + res.data[0].matDtos[0].maknx + that.count = '鍑哄簱鏁伴噺锛�' + res.data[0].matDtos[0].count + if (res.data[0].orderNo) { + that.orderNo = "璁㈠崟鍙凤細" + res.data[0].orderNo + that.orderShow = true + that.width = 'half-width' + } else { + that.orderNo = null; + that.orderShow = false + that.width = 'full-width' + } + that.doneOfTray = '宸插嚭鎵樼洏鏁�:' + res.data[0].doneOfTray + that.totalOfTray = '鎵樼洏鎬绘暟閲忥細' + res.data[0].totalOfTray + that.doneOfUnit = '宸插嚭绠辨暟锛�' + res.data[0].doneOfUnit + that.totalOfUnit = '鎬荤鏁帮細' + res.data[0].totalOfUnit + if (that.errorShow) { + return; + } else { + that.newspaper = newsData + that.move = false + } + }else { + that.move = true + } + + + }, + // 鑾峰彇閿欒淇℃伅 getError() { let that = this - ni.request({ - url: "http://" + that.baseUrl + ":" + that.basePort + "/jkwcs/monitor/led/error/led", + var res + uni.request({ + url: that.commonUrl + "/monitor/led/error", data: { ledId:that.baseLedId }, method:'GET', success(result) { - let res = result.data - if (res.data) { - that.newspaper = '123' + res = result.data + if (res.data && res.data !== "") { + that.errorMsg = res.data + that.errorShow = true + that.move = false // 鏄剧ず } else { - that.newspaper = '' + that.errorShow = false + // if (that.pakinShow) { + // return; + // } else { + // // that.move = true // 闅愯棌 + // } } } }); }, 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 - if (res[0]) { - if (res[0].ioType === 101) { + res = result.data + if (that.errorShow) { + return; // 鏈夐敊璇俊鎭� + } + if(res.data && res.data !== null) { + if (res.data[0].ioType === 101) { that.title = '鍏ㄦ澘鍑哄簱' - } else if(res[0].ioType === 103) { + } else if(res.data[0].ioType === 103) { that.title = '妫�鏂欏嚭搴�' + } else + that.title = res.data[0].title + that.staNo = '鐩爣绔�:' + res.data[0].staNo + that.matnr = '鍟嗗搧缂栧彿锛�' + res.data[0].matDtos[0].matnr + that.maknx = '鍟嗗搧鍚嶇О锛�' + res.data[0].matDtos[0].maknx + that.specs = '瑙勬牸锛�' + res.data[0].matDtos[0].specs + that.count = '鍑哄簱鏁伴噺锛�' + res.data[0].matDtos[0].count + if (res.data[0].orderNo) { + that.orderNo = "璁㈠崟鍙凤細" + res.data[0].orderNo + that.orderShow = true + that.width = 'half-width' + } else { + that.orderNo = null; + that.orderShow = false + that.width = 'full-width' } - that.staNo = '鐩爣绔�' + res[0].staNo - - for (var i = 0; i < res[0].matDtos.length; i++) { - str = res[0].matDtos[i].matnr + ' - ' + res[0].matDtos[i].batch + '\n' - newsData = newsData + str - } + that.doneOfTray = '宸插嚭鎵樼洏鏁�:' + res.data[0].doneOfTray + that.totalOfTray = '鎵樼洏鎬绘暟閲忥細' + res.data[0].totalOfTray + that.doneOfUnit = '宸插嚭绠辨暟锛�' + res.data[0].doneOfUnit + that.totalOfUnit = '鎬荤鏁帮細' + res.data[0].totalOfUnit that.newspaper = newsData that.move = false - } else { - that.newspaper = '' - that.title = '' - that.staNo = '' + }else { that.move = true } } - }) + }); }, animation() { - if (this.move) { + if (this.move) { this.topMove = 'topUp' this.floorMove = 'floorUp' } else { @@ -371,12 +579,16 @@ 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 + console.log(result); 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 } } @@ -386,13 +598,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 @@ -405,19 +617,19 @@ 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) { + console.log(result); var res = result.data if (res.code === 200) { that.xDistance = res.data.xDistance that.yDistance = res.data.yDistance that.xDuration = res.data.xDuration that.yDuration = res.data.yDuration - console.log(res) } else if (res.code === 403) { } else { @@ -426,26 +638,21 @@ } }) }, - port() { - this.$refs.port.open() + ejected () { + this.ejectShow = true }, - url() { - this.$refs.url.open() - }, - ledId() { - this.$refs.ledId.open() - }, - baseUrlConfirm(val) { - this.baseUrl = val - uni.setStorageSync('BaseUrl', this.baseUrl); - }, - ledIdConfirm(val) { - this.baseLedId = val + // 寮瑰嚭灞傜‘璁� + ejectConfirm() { + uni.setStorageSync('BaseIp', this.baseIP); uni.setStorageSync('BaseLedId', this.baseLedId); - }, - portConfirm(val) { - this.basePort = val uni.setStorageSync('BasePort',this.basePort); + uni.setStorageSync('BaseCrnId',this.baseCrnId); + this.getUrl() + this.ejectShow = false + }, + // 寮瑰嚭灞傚彇娑� + ejectClose() { + this.ejectShow = false }, getServerData() { this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line)) @@ -478,6 +685,130 @@ </script> <style> + /* 寮瑰嚭:閰嶇疆鍖哄煙 */ + .eject-mask { + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + position: fixed; + top: 0; + left: 0; + z-index: 999; + display: flex; + align-items: center; + justify-content: center; + } + .eject{ + position: relative; + width: 600px; + height: 350px; + background-color: #eaeaea; + border-radius: 25rpx; + } + .eject-title { + width: 100%; + height: 100px; + line-height: 100px; + font-size: 20px; + font-weight: 700; + color: #606266; + text-align: center; + } + .eject-input { + + } + .item { + display: flex; + align-items: center; + margin: 10px 0 0 0; + } + .desc { + display: inline-block; + width: 40%; + text-align: right; + color: #606266; + font-size: 18px; + } + .input { + display: flex; + align-items: center; + padding-left: 5px; + padding-right: 5px; + width: 100%; + height: 30px; + border: 1px solid #C0C4CC; + margin-right: 50px; + } + .eject-input input { + width: 100%; + + + } + .eject-button { + display: flex; + align-items: center; + position: absolute; + bottom: 0; + height: 60px; + line-height: 60px; + width: 100%; + border-top: 1px solid #ccc; + } + .button-item { + width: 50%; + height: 100%; + font-size: 20px; + font-weight: bold; + text-align: center; + color: #909399; + } + .button-item:last-child { + color: #67C23A; + + border-left: 1px solid #ccc; + } + .full-width { + width: 100%; + height: 100%; + display: inline-block; + float: left; + } + .half-width { + width: 50%; + height: 100%; + display: inline-block; + float: left; + } + .box-items { + height: 20%; + width: 100%; + /* background-color: #233751; */ + line-height: 300rpx; + } + /* 褰撳墠椤甸潰鏃� 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; */ @@ -592,7 +923,7 @@ position: relative; color: #FFFFFF; text-align: center; - font-size: 200rpx; + font-size: 120rpx; letter-spacing: 5rpx; background-image: url(../../static/background.png); } @@ -923,3 +1254,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} --> \ No newline at end of file -- Gitblit v1.9.1