From 5ef99c7d71ec5d3d027bef03062cd71b271a766d Mon Sep 17 00:00:00 2001 From: whycq <10027870+whycq@user.noreply.gitee.com> Date: 星期三, 13 三月 2024 16:20:29 +0800 Subject: [PATCH] # --- Monitor-APP/pages/home/home.vue | 960 +++++++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 854 insertions(+), 106 deletions(-) diff --git a/Monitor-APP/pages/home/home.vue b/Monitor-APP/pages/home/home.vue index 0690806..b1bc16c 100644 --- a/Monitor-APP/pages/home/home.vue +++ b/Monitor-APP/pages/home/home.vue @@ -1,115 +1,581 @@ <template> <view class="container"> - <!-- 涓昏鍥� --> - <uni-transition :duration="duration" :mode-class="modeClass" :styles="homeView" :show="homeViewShow"> + <uni-transition :duration="duration" :mode-class="homeMode" :show="homeViewShow"> <view class="home-view"> <view class="head"> - <text>鑷姩浠撳簱WCS鐩戞帶骞冲彴</text> + <text>鑷姩浠撳簱鐩戞帶骞冲彴</text> </view> <!-- 鏃ュ巻 --> <view class="time-tools">{{calendar}}</view> - <view class="button-left"></view> - <view class="button-right"></view> - <!-- 涓讳綋 --> + <view class="button-left" @click="ejected()"></view> + <view class="button-right" @click="ejected()"></view> + <!-- 涓昏鍥� --> <view class="main"> - <view class="mian-item"> - <view class="mian-item-box"> - <y-box> - <view class="content-item"> - <text>鑷姩鍖栫珛浣撲粨搴�</text> - <p class="english">Automatic Storageand Retrieval System</p> - <p class="introduce-content"> 鍒╃敤绔嬩綋浠撳簱璁惧鍙疄鐜颁粨搴撻珮灞傚悎鐞嗗寲銆佸瓨鍙栬嚜鍔ㄥ寲銆佹搷浣滅畝渚垮寲锛� - 鑷姩鍖栫珛浣撲粨搴撴槸褰撳墠鎶�鏈按骞宠緝楂樼殑褰㈠紡銆� - 鑷姩鍖栫珛浣撲粨搴撶殑涓讳綋鐢辫揣鏋躲�佸贩閬撳紡鍫嗗灈璧烽噸鏈恒�佸叆锛堝嚭锛夊簱宸ヤ綔鍙板拰鑷姩杩愯繘锛堝嚭锛夊強鎿嶄綔鎺у埗绯荤粺缁勬垚銆� - 璐ф灦鏄挗缁撴瀯鎴栭挗绛嬫贩鍑濆湡缁撴瀯鐨勫缓绛戠墿鎴栫粨鏋勪綋锛岃揣鏋跺唴鏄爣鍑嗗昂瀵哥殑璐т綅绌洪棿锛屽贩閬撳爢鍨涜捣閲嶆満绌胯浜庤揣 - 鏋朵箣闂寸殑宸烽亾涓紝瀹屾垚瀛樸�佸彇璐х殑宸ヤ綔銆傜鐞嗕笂閲囩敤璁$畻鏈哄強鏉″舰鐮佹妧鏈��</p> + <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> + <!-- v-for="k in item.agvWrkDetl.orderNo" --> + <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 class="content-item img"> - <text>浠撳簱鏁版嵁</text> - <p class="english">warehouse data</p> - <view> - <view class="charge-info-item"> - <image src="../../static/a1.png" mode="aspectFit"></image> - <view> - <text class="count">{{xDistance}}</text> - <text class="unit">m</text> - </view> - <view>绱璧拌璺濈(绫�)</view> - </view> - </view> - </view> - </y-box> - </view> - </view> - <view class="mian-item"> - <view class="mian-item-box"> - <view style="height: 38%;"> - <y-box></y-box> - </view> - <view style="height: 2%;"></view> - <view style="height: 38%;"> - <y-box></y-box> - </view> - <view style="height: 2%;"></view> - <view style="height: 20%;"> - <y-box></y-box> + <!-- <view style="width: 16vw;background-color: aquamarine;display: flex;" v-for="k in item.agvWrkDetl.orderNo"> + <view>{{k.orderNo}}--</view> + <view>{{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> </uni-transition> <!-- 鍏ㄦ澘/鎷f枡淇℃伅 --> - <!-- <view class="info"> - - </view> --> - <!-- 寮傚父淇℃伅 --> - <!-- <view class="error-info"></view> --> + + <!-- 鑷畾涔夊脊鍑哄眰 --> + <view class="eject-mask" v-show="ejectShow"> + <view class="eject"> + <!-- 寮瑰嚭title --> + <view class="eject-title">淇敼 / 閰嶇疆</view> + <!-- input --> + <scroll-view scroll-y 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">Url锛�</view> + <view class="input"> + <input type="text" v-model="baseUrl"> + </view> + </view> + + + <view class="item"> + <view class="desc">妤煎眰锛�</view> + <radio-group @change="floor"> + <label> + <radio :checked="ck1" style="margin-left: 50rpx;"/><text>1妤�</text> + </label> + <label> + <radio :checked="ck2" style="margin-left: 50rpx;"/><text>3妤�</text> + </label> + </radio-group> + </view> + + <view class="item"> + <view class="desc">缂撳瓨璐ф灦锛�</view> + <radio-group @change="radioChange" > + <label v-for="(item, index) in rows" :key="item.value"> + <radio style="margin-left: 50rpx;" :value="item.value" :checked="index === current" />{{item.name}} + </label> + </radio-group> + </view> + + </scroll-view> + <!-- button --> + <view class="eject-button"> + <view class="button-item" @click="ejectClose">鍙� 娑�</view> + <view class="button-item" @click="ejectConfirm">纭� 璁�</view> + </view> + </view> + </view> + <view style="color: #FFF;position: fixed;bottom: 10px;left: 10px;" v-show="timeOut"> + 杩炴帴瓒呮椂: {{times}} s + </view> </view> </template> - +<!-- {"msg":"鎿嶄綔鎴愬姛","code":200,"data":[{"title":"鍏ㄦ澘鍑哄簱","workNo":7460,"staNo":110,"sourceStaNo":null,"locNo":null,"sourceLocNo":"0807102","matDtos":[{"matNo":"50460834","maknx":"200x60妗岄潰","count":26.0}],"emptyMk":false,"ioType":101}]} --> <script> + import demodata from '@/mockdata/demodata.json'; + import ycqdata from '@/pages/index/data.json'; export default { data() { return { + locs: [], + floors: [{value: 1,name:'1妤�'},{value:2,name:'3妤�'}], + rows: [{value: 'cs-101',name:'1鍙�'},{value: 'cs-102',name:'2鍙�'}], + ck1: true, + ck2: false, + current: 'cs-101', + series: [], homeViewShow: true, - modeClass: ['fade', 'slide-top'], - homeView: { - justifyContent: 'center', - alignItems: 'center', - width: '100vw', - height: '100vh', - borderRadius: '5px', - textAlign: 'center', - backgroundColor: '#4cd964', - boxShadow: '0 0 5px 1px rgba(0,0,0,0.2)' + infoViewShow: false , + errorInfoViewShow: false, + homeMode: [], + infoMode: [], + errorInfoMode: [], + baseInfo: { + xDistance: 1, + yDistance: 2, + xDuration: 3, + yDuration: 4, + usedPr: 50, + used: 3537, + stockCount: '', + emptyCount: '', + noneCount: '', + }, + chartsData: { + "Line": { + "categories": [], + "series": [] + }, + "Pie": { + "series": [{ + "data": [] + }] + }, }, duration: 1000, calendar: '', - xDistance: '', - yDistance: '', - xDuration: '', - yDuration: '', + ringOpts:{}, + chartsDataLine1: {}, + chartsDataPie2: {}, + fontSize: '', + height: '', + showCharts: false, + ejectShow: false, + baseIP: '10.10.10.40', + basePort: '8081', + baseLedId: '', + baseCrnId: '', + baseUrl: 'tzskwms', + floor1: true, + floor2: false, + row: '', + info: null, + error: null, + infoType: 0, + text: '', + infoText: { + title: '', + staNo: "", + matnr: "", + maknx: "", + specs: "", + count: "", + error: "", + barcode: "", + orderNo: '', + batch: '', + doneOfTray: '', + totalOfTray: '', + doneOfUnit: '', + totalOfUnit: '', + ctnNo: '1' + }, + swiperList: [], + timeOut: false, + times: 0, + currDate: '', + textred: 'textred' } }, onShow() { // 闅愯棌鏃堕棿,鐢甸噺,淇″彿绛� + // #ifdef APP-PLUS plus.navigator.setFullscreen(true) + // #endif + }, + mounted() { + let that = this + const BaseIP = uni.getStorageSync('BaseIp'); + const BaseLedId = uni.getStorageSync('BaseLedId'); + const BasePort = uni.getStorageSync('BasePort'); + const BaseCrnId = uni.getStorageSync('BaseCrnId'); + const PROJ = uni.getStorageSync('UPROJ'); + const CURRENT = uni.getStorageSync('current'); + that.baseUrl = PROJ + that.baseIP = BaseIP + that.baseLedId = BaseLedId + that.basePort = BasePort + that.baseCrnId = BaseCrnId + that.current = CURRENT + this.getUrl() + this.getVisualized() }, onLoad() { - this.getDate() setInterval(()=>{ - this.getDate() + // this.getDate2() + // this.getInfo() + // this.getError() + // this.getInfo2() + // this.getError2() + // this.getUrl() + // this.controller() + this.getVisualized() },1000) - setInterval(()=>{ - // this.handle(['fade', 'slide-top']) - },4000) + }, methods: { + floor() { + var temp = this.ck1 + this.ck1 = this.ck2 + this.ck2 = temp + if (this.ck1) { + this.rows = [{value: 'cs-101',name:'1鍙�'},{value: 'cs-102',name:'2鍙�'}] + } else { + this.rows = [{value: 'CS-305',name:'1鍙�'},{value: 'CS-306',name:'2鍙�'},{value: 'CS-307',name:'3鍙�'}] + } + }, + radioChange(evt) { + for (let i = 0; i < this.rows.length; i++) { + if (this.rows[i].value === evt.detail.value) { + this.current = evt.detail.value; + break; + } + } + }, + getVisualized() { + let that = this + let param = {stationCode: `${that.current}`} + uni.request({ + url: `${that.commonUrl}/agv/basDevp/visualized/list/auth`, + header: { 'Access-Control-Allow-Origin': '*'}, + method: 'POST', + data: JSON.stringify(param), + success(res) { + res = res.data + 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.devNo == 'CS-101-004-01@1') { + // let a = i.agvWrkDetl.orderNo + // // console.log(a.length); + // let b = JSON.parse(a) + // // console.log(b.length); + + // } + // console.log(i.agvWrkDetl); + that.locs.push(i) + } + } + } + } + }) + }, + timeOuts() { + console.log(this.times); + }, + getUrl() { + this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + "/" +this.baseUrl + }, + getServerData() { + this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line)) + this.chartsDataPie2=JSON.parse(JSON.stringify(this.chartsData.Pie)) + }, + // 鑾峰彇閿欒淇℃伅 + getInfo2() { + let that = this + var result = ycqdata.dataInfo3 + var res = result.data + that.infoModel(res) + }, + getError2 () { + let that = this + let result = ycqdata.dataError2 + var res = result.data + that.errorModel(res) + }, + getInfo() { + let that = this + uni.request({ + url: that.commonUrl + "/monitor/led", + method:"GET", + data: {ledId:that.baseLedId}, + success(result) { + that.timeOut = false + that.times = 0 + var res = result.data + that.infoModel(res) + }, + fail(err) { + that.timeOut = true + that.times = that.times+1 + that.infoType = 0 + } + }) + + }, + + getError() { + let that = this + uni.request({ + url: that.commonUrl + "/monitor/led/error", + data: {ledId:that.baseLedId}, + method:"GET", + success(result) { + that.timeOut = false + that.times = 0 + var res = result.data + that.errorModel(res) + + }, + fail(err) { + that.timeOut = true + that.infoType = 0 + } + }) + + }, + errorModel(res) { + let that = this + if (res.data && res.data !== "") { + var errorInfo = res.data + if (that.infoType == 1) { + that.infoType = 3 + that.infoText.title = "鍏朵粬淇℃伅" + // that.infoText.title = "寮傚父" + that.infoText.error = errorInfo + return + } + that.infoType = 2 + that.infoText.title = "鍏朵粬淇℃伅" + // that.infoText.title = "寮傚父" + that.infoText.error = errorInfo + } else { + if (that.infoType == 1) { + return + } + that.infoType = 0 + } + + }, + infoModel(res) { + let that = this + if (res.data && res.data !== "") { + if (that.infoType == 2 || that.infoType == 3) { + return; + } + // infoType1:鍙湁鎷f枡绛変俊鎭� + that.infoType = 1 + if (res.data[0].ioType === 101) { + that.infoText.title = '鍏ㄦ澘鍑哄簱' + } else if(res.data[0].ioType === 103) { + 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 === 110) { + that.infoText.title = '绌烘墭鍑哄簱' + } + that.infoText.workNo = res.data[0].workNo + that.infoText.sourceLocNo = res.data[0].sourceLocNo + that.infoText.staNo = res.data[0].staNo + that.swiperList = res.data[0].matDtos + that.infoText.ctnNo = res.data[0].ctnNo + if (res.data[0].ctnNo) { + that.infoText.orderNo = '' + that.textred = 'textred' + } else { + that.infoText.orderNo = res.data[0].orderNo + that.textred = '' + } + that.infoText.matnr = res.data[0].matDtos[0].matnr + that.infoText.barcode = res.data[0].barcode + that.infoText.batch = res.data[0].matDtos[0].batch ? res.data[0].matDtos[0].batch : '--' + that.infoText.specs = res.data[0].matDtos[0].specs + that.infoText.count = res.data[0].matDtos[0].count + that.infoText.doneOfTray = res.data[0].doneOfTray + that.infoText.totalOfTray = res.data[0].totalOfTray + that.infoText.doneOfUnit = res.data[0].doneOfUnit + that.infoText.totalOfUnit = res.data[0].totalOfUnit + } else { + if (that.infoType == 2 || that.infoType == 3) { + return; + } + that.infoType = 0 + } + }, + // 鎺у埗鍣� + controller() { + switch(this.infoType) { + // 鏈変俊鎭� 浣� 娌℃湁閿欒淇℃伅 + case 0: + if (this.errorInfoViewShow) { + this.errorInfoViewShow = false + this.errorInfoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.homeViewShow = true + this.homeMode = ['fade', 'slide-bottom'] + },1000) + } else if (this.infoViewShow) { + this.infoViewShow = false + this.infoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.homeViewShow = true + this.homeMode = ['fade', 'slide-bottom'] + },1000) + } else if (this.errorInfoViewShow && this.infoViewShow) { + this.errorInfoViewShow = false + this.infoViewShow = false + this.infoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.homeViewShow = true + this.homeMode = ['fade', 'slide-bottom'] + },1000) + } + return; + case 1: + if (this.homeViewShow) { + this.homeViewShow = false + this.homeMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.infoViewShow = true + this.infoMode = ['fade', 'slide-bottom'] + },1000) + } else if (this.errorInfoViewShow) { + this.errorInfoViewShow = false + this.errorInfoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.infoViewShow = true + this.infoMode = ['fade', 'slide-bottom'] + },1000) + } + + return; + // 鏈変俊鎭� 涓� 鏈夐敊璇俊鎭� + case 2: + if (this.homeViewShow) { + this.homeViewShow = false + this.homeMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.errorInfoViewShow = true + this.errorInfoMode = ['fade', 'slide-bottom'] + },1000) + } else if (this.infoViewShow) { + this.infoViewShow = false + this.infoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.errorInfoViewShow = true + this.errorInfoMode = ['fade', 'slide-bottom'] + },1000) + } + return; + // 鏈変俊鎭� 涓� 鏈夐敊璇俊鎭� + case 3: + if (this.homeViewShow) { + this.homeViewShow = false + this.homeMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.errorInfoViewShow = true + this.errorInfoMode = ['fade', 'slide-bottom'] + },1000) + } else if (this.infoViewShow) { + this.infoViewShow = false + this.infoMode = ['fade', 'slide-bottom'] + setTimeout(()=>{ + this.errorInfoViewShow = true + this.errorInfoMode = ['fade', 'slide-bottom'] + },1000) + } + return; + + } + + }, + // 涓诲睆骞� handle(type) { this.homeViewShow = !this.homeViewShow this.modeClass = type }, + // 鎷f枡 + handle1(type) { + this.infoViewShow = !this.infoViewShow + this.modeClass = type + }, + // 寮傚父 + handle2(type) { + this.errorInfoViewShow = !this.errorInfoViewShow + this.modeClass = type + }, + // 閰嶇疆 + ejected () { + this.ejectShow = true + }, + // 鍙栨秷閰嶇疆 + ejectClose() { + this.ejectShow = false + }, + // 纭閰嶇疆 + ejectConfirm() { + uni.setStorageSync('BaseIp', this.baseIP); + uni.setStorageSync('BaseLedId', this.baseLedId); + uni.setStorageSync('BasePort',this.basePort); + uni.setStorageSync('BaseCrnId',this.baseCrnId); + uni.setStorageSync('UPROJ',this.baseUrl); + uni.setStorageSync('current',this.current); + this.getUrl() + this.ejectShow = false + }, + // 鏃ュ巻 鏈嶅姟鍣� + getDate2() { + let that = this + if(that.commonUrl == 'undefined') { + return + } + uni.request({ + url: that.commonUrl + "/monitor/date", + method:"GET", + success(result) { + var res = result.data.data + that.calendar = res.year + "骞�" + res.month + "鏈�" + res.day + "鏃� " + res.hour + ":" + res.minute + ":" + res.second + " " + res.week + that.currDate = res.year + "/" + res.month + "/" + res.day + }, + fail(res) { + console.log(res); + } + + }) + }, + // 鏃ュ巻 getDate() { var dt = new Date(); @@ -132,20 +598,135 @@ } this.calendar = year + "骞�" + month + "鏈�" + day + "鏃� " + hours + ":" + minutes + ":" + seconds + " " + weeks }, + getDateFormat(value) { + var date = new Date(this.currDate);// 鑾峰彇褰撳墠鏃堕棿 + date.setDate(date.getDate() + value);// 璁剧疆澶╂暟 -1 澶� + var m = date.getMonth() + 1 + var d = date.getDate() + var newDate = m + '-' + d + return newDate + }, + /*************** 鎶樼嚎鍥� *****************************************************************************************************/ + initlineChart() { + let that = this + if(that.commonUrl == 'undefined') { + return + } + uni.request({ + 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.series = res.data.rows + } + } + }) + }, + /*************** 楗煎浘 *****************************************************************************************************/ + initPieChart() { + let that = this + if(that.commonUrl == 'undefined') { + return + } + uni.request({ + 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.baseInfo.stockCount = res.data.stockCunt + that.baseInfo.emptyCount = res.data.emptyCount + that.baseInfo.noneCount = res.data.noneCount + that.baseInfo.used = res.data.used + that.baseInfo.usedPr = res.data.usedPr + } + } + }) + }, + getOther() { + let that = this + if(that.commonUrl == 'undefined') { + return + } + uni.request({ + url: that.commonUrl + "/monitor/other", + data: { + crnId: that.baseCrnId, + ledId: that.baseLedId, + }, + success(result) { + var res = result.data + if (res.code === 200) { + that.baseInfo.xDistance = res.data.xDistance + that.baseInfo.yDistance = res.data.yDistance + that.baseInfo.xDuration = res.data.xDuration + that.baseInfo.yDuration = res.data.yDuration + } else if (res.code === 403) { + + } else { + + } + } + }) + }, } } </script> <style> + /* @import url("../../static/css/common.css"); */ + @import url("home.css"); + + .main-y { + font-size: 22rpx; + background-color: rgba(255, 255, 255, .05); + width:19vw; + height: 28vh; + margin-top: 4px; + backdrop-filter: blur(3px); + display: flex; + flex-direction: column; + align-items: stretch; + justify-content: center; + /* text-align: left; */ + } + .y-it { + display: flex; + /* background-color: #FF5722; */ + } + .y-it-desc { + text-align: right; + /* background-color: #FF5722; */ + } + .margin { + margin-left: 10rpx; + } + + /* 鍒� */ + .flex-col { + display: flex; + flex-direction: column; + } + /* 琛� */ + .flex-row { + display: flex; + flex-direction: row; + } + .container{ width: 100vw; min-height: 100vh; - background-color: blue; - display: flex; - flex-direction: column; - align-items: center; + background-color: #00163E; color: #fff; + text-align: center; + } /* 涓昏鍥� */ .home-view { @@ -166,17 +747,19 @@ .head { width: 100vw; height: 11vh; - font-size: 4vh; + font-size:4vw; font-weight: 700; display: flex; align-items: center; justify-content: center; + transform: scale(0.7); } .time-tools { position: absolute; right: 2%; top: 2%; - font-size: 1.5vh; + font-size:1vw; + transform: scale(0.8); } .button-left { position: absolute; @@ -197,24 +780,75 @@ width: 13.5%; height: 8.5%; } - .charge-info-item { + .img-box { width: 100%; - height: 100%; + /* background-color: #666666; */ + display: flex; + flex-direction: row; + justify-content: flex-start; + flex-wrap: wrap; + font-size: 1vw; } - .charge-info-item image { - height: 100%; - width: 100%; + .item-img { + width: 50%; + margin-top: 5%; + display: flex; + flex-direction: row; + /* background-color: #00ffff; */ + justify-content: flex-start; + align-items: flex-start; } + .distance { + + } + .item-img image { + height: 5vw; + width: 5vw; + } + .progressBar { + margin-top: 9%; + /* width: 100%; */ + height: 20%; + background-color: #233751; + border-radius: 5vw; + } + .progress { + /* width: 90%; */ + height: 100%; + background-color: #FF5722; + border-radius: 5vw; + } + .charts-box { + width: 80%; + height: 24vh; + margin-left: 10%; + } + .charts-box-ring { + width: 50%; + height: 24vh; + /* background-color: #00ffff; */ + } + .sub-info { + font-size: 1.5vw; + } + .sub-info image { + width: 3.5vw; + height: 3.5vw; + } + .red{ + color: red + } + /* 鍏辩敤 */ .main { - width: 100vw; height: 88vh; - margin-top: 1vh; + margin: 16rpx; display: flex; - + flex-wrap: wrap; + justify-content: space-around; } .mian-item { width: 50%; @@ -224,45 +858,159 @@ align-items: center; justify-content: center; } - .mian-item:last-child { - align-items: flex-start; - } .mian-item-box { width: 98%; height: 98%; } - .content-item { + .box-item { + width: 100%; + margin-top: 4%; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; - margin-top: 1vh; - margin-left: 4%; - margin-right: 4%; } - .english { - font-size: 0.1vh; + .item-title { + font-size:1.5vw; + font-weight: 700; } - .introduce-content { - font-size: 0.3vh; - padding-top: 2vh; - text-indent: 3vh; - letter-spacing: 0.3vh; + .item-subTitle { + font-size:0.5vw; + text-indent: 0em; } - - - + .item-text { + font-size: 1vw; + text-indent: 2em; + letter-spacing: 1px; + line-height: 3vh; + } /* 鍏ㄦ澘/鎷f枡淇℃伅 */ - .info { + .info-view { width: 100vw; min-height: 100vh; - background-color: #666666; + background-image: url(../../static/background.png); + background-size: 100vw 100vh; + } + .info-main { + width: 100vw; + height: 88vh; + display: flex; + justify-content: center; + align-items: center; + } + .info-box { + width: 98%; + height: 98%; } /* 寮傚父淇℃伅 */ - .error-info { + .error-info-view { width: 100vw; min-height: 100vh; - background-color: #00ffff; + background-image: url(../../static/background.png); + background-size: 100vw 100vh; + } + + /* 寮瑰嚭:閰嶇疆鍖哄煙 */ + .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: 40vw; + height: 40vh; + background-color: #fff; + border-radius: 2rem; + } + .eject-title { + width: 100%; + height: 5vh; + line-height: 6vh; + font-size: 3vh; + font-weight: 700; + color: #606266; + text-align: center; + } + .eject-input { + margin-top: 2vh; + height: 25vh; + /* background-color: #00163E; */ + ::-webkit-scrollbar{display:none} + } + .item { + display: flex; + align-items: center; + margin: 1vh 0 0 0; + font-size: 1.5vw; + color: #363636; + } + .desc { + display: inline-block; + width: 40%; + text-align: right; + color: #606266; + + } + .input { + display: flex; + align-items: center; + padding-left: 5px; + padding-right: 5px; + width: 100%; + height: 3vh; + border: 0.1vh solid #cfd4dc; + margin-right: 20%; + text-align: start; + } + .eject-input input { + width: 100%; + height: 3vh; + font-size: 1vw; + + + } + .eject-button { + display: flex; + align-items: center; + position: absolute; + bottom: 0; + height: 6vh; + line-height: 6vh; + width: 100%; + border-top: 1px solid #ccc; + } + .button-item { + width: 50%; + height: 100%; + font-size: 1.5vw; + font-weight: bold; + text-align: center; + color: #909399; + } + .button-item:last-child { + color: #67C23A; + + border-left: 1px solid #ccc; + } + .info-box-text { + width: 100%;height: 100%; + display: flex;flex-direction: column;align-items: center;justify-content: center; + } + .info-box-text-item { + height: 20%;font-size: 8vh; + justify-content: center; + white-space: pre-line; + } + .textred{ + color: red; } </style> \ No newline at end of file -- Gitblit v1.9.1