| | |
| | | |
| | | <!-- null --> |
| | | <view style="height: 2%;"></view> |
| | | |
| | | |
| | | |
| | | <view style="height: 43%;"> |
| | | <view style="height: 51%;"> |
| | | <y-box> |
| | | <view class="box-item"> |
| | | <view class="flex-row" style="width: 100%;"> |
| | |
| | | </view> |
| | | </view> |
| | | <view class="flex-row" style="width: 100%;"> |
| | | <!-- 左 --> |
| | | <view class="charts-box-ring"> |
| | | <qiun-data-charts type="ring" :opts="{legend:{position:'bottom'}}" :eopts="ringOpts" :chartData="chartsDataPie2" :echartsH5="true" :echartsApp="true"/> |
| | | </view> |
| | | <!-- 右 --> |
| | | <view> |
| | | <!-- 库位使用情况 --> |
| | | <!-- left --> |
| | | <view style="margin-left: 5%;"> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">在库</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.stockCount}}</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">长总库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.longAllLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info" style="margin-top: 2vh;"> |
| | | <image src="../../static/f1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">空库</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.emptyCount}}</view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">使用库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.longUseLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info" style="margin-top: 2vh;"> |
| | | <image src="../../static/e1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">锁定</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.noneCount}}</view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">空库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.longEmptyLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">禁用库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.longXLoc}}</view> |
| | | </view> |
| | | </view> |
| | | <view style="margin-left: 5%;"> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">短总库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.shortAllLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">使用库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.shortUseLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">空库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.shortEmptyLoc}}</view> |
| | | </view> |
| | | <view class="flex-row sub-info"> |
| | | <image src="../../static/g1.png" mode="aspectFit"></image> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;">禁用库位</view> |
| | | <view style="width: 8vw;height: 4vw;line-height: 4vw;font-size: 2vw;">{{baseInfo.shortXLoc}}</view> |
| | | </view> |
| | | </view> |
| | | |
| | | </view> |
| | | </view> |
| | | |
| | | </y-box> |
| | | </view> |
| | | <view style="height: 2%;"></view> |
| | | <view style="height: 18%;"> |
| | | <view style="height: 10%;"> |
| | | <y-box> |
| | | <view class="flex-col" style="width: 100%;height: 100%;font-size: 4vh;justify-content: center;letter-spacing: 1vh;"> |
| | | <!-- 嘉善边锋机械股份有限公司 --> |
| | |
| | | <view class="text-content"> |
| | | <!-- head --> |
| | | <view class="swiper-head"> |
| | | <view style="width: 20%;">目标站:{{infoText.staNo}}</view> |
| | | <view style="width: 30%;">商品编号</view> |
| | | <view style="width: 20%;">商品名称</view> |
| | | <view style="width: 20%;">规格</view> |
| | | <view style="width: 10%;">序号</view> |
| | | <view style="width: 12%;">订单号</view> |
| | | <view style="width: 12%;">工作号</view> |
| | | <view style="width: 12%;">箱码</view> |
| | | <view style="width: 12%;">商品编号</view> |
| | | <view style="width: 12%;">商品名称</view> |
| | | <view style="width: 10%;">规格</view> |
| | | <view style="width: 10%;">数量</view> |
| | | <view style="width: 10%;">结余</view> |
| | | </view> |
| | | <!-- body --> |
| | | <view class="swiper-body"> |
| | |
| | | <swiper class="swiper-body-main" vertical="true" |
| | | display-multiple-items="8" |
| | | circular="true" :autoplay="true" :interval="3000" :duration="1000"> |
| | | <swiper-item class="swiper-item" v-for="(item,i) in swiperList" :key="i"> |
| | | <view style="width: 20%;">No:{{i+1}}</view> |
| | | <view style="width: 30%;">{{item.matNo}}</view> |
| | | <view style="width: 20%;">{{item.maknx}}</view> |
| | | <view style="width: 20%;">{{item.specs}}</view> |
| | | <view style="width: 10%;">{{item.count}}</view> |
| | | <swiper-item class="swiper-item" v-for="(item,i) in locs" :key="i" |
| | | :style="item.color"> |
| | | <view style="width: 10%;">No:{{i+1}}</view> |
| | | <view style="width: 12%;">{{item.orderNo ? item.orderNo : '--'}}</view> |
| | | <view style="width: 12%;">{{item.wrkNo ? item.wrkNo : '--'}}</view> |
| | | <view style="width: 12%;">{{item.suppCode ? item.suppCode : '--'}}</view> |
| | | <view style="width: 12%;">{{item.matnr}}</view> |
| | | <view style="width: 12%;">{{item.maktx}}</view> |
| | | <view style="width: 10%;">{{item.specs ? item.specs : '--'}}</view> |
| | | <view style="width: 10%;">{{item.anfme ? item.anfme : '--'}}</view> |
| | | <view style="width: 10%;">{{item.volume ? item.volume : '--'}}</view> |
| | | </swiper-item> |
| | | </swiper> |
| | | </view> |
| | |
| | | <input type="text" v-model="baseUrl"> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="desc">站点:</view> |
| | | <view class="input"> |
| | | <input type="text" v-model="devNo"> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <!-- button --> |
| | | <view class="eject-button"> |
| | |
| | | data() { |
| | | return { |
| | | series: [], |
| | | homeViewShow: true, |
| | | infoViewShow: false , |
| | | homeViewShow: false, |
| | | infoViewShow: true , |
| | | errorInfoViewShow: false, |
| | | homeMode: [], |
| | | infoMode: [], |
| | |
| | | stockCount: '', |
| | | emptyCount: '', |
| | | noneCount: '', |
| | | longAllLoc: '', |
| | | shortAllLoc: '', |
| | | longEmptyLoc: '', |
| | | shortEmptyLoc: '', |
| | | longUseLoc: '', |
| | | shortUseLoc: '', |
| | | longXLoc: '', |
| | | shortXLoc: '', |
| | | }, |
| | | chartsData: { |
| | | "Line": { |
| | |
| | | count: "", |
| | | error: "" |
| | | }, |
| | | swiperList: [] |
| | | swiperList: [], |
| | | devNo: 'CS-313', |
| | | locs: [] |
| | | } |
| | | }, |
| | | onShow() { |
| | |
| | | const BasePort = uni.getStorageSync('BasePort'); |
| | | const BaseCrnId = uni.getStorageSync('BaseCrnId'); |
| | | const PROJ = uni.getStorageSync('UPROJ'); |
| | | const DEVNO = uni.getStorageSync('devNo'); |
| | | that.baseUrl = PROJ |
| | | that.baseIP = BaseIP |
| | | that.baseLedId = BaseLedId |
| | | that.basePort = BasePort |
| | | that.baseCrnId = BaseCrnId |
| | | that.devNo = DEVNO |
| | | // this.getUrl() |
| | | }, |
| | | onLoad() { |
| | | setInterval(()=>{ |
| | | this.getServerData() |
| | | this.initlineChart() |
| | | this.initPieChart() |
| | | this.getOther() |
| | | this.getDate() |
| | | this.getInfo() |
| | | this.getError() |
| | | // this.getInfo2() |
| | | // this.getError2() |
| | | setTimeout(()=> { |
| | | this.getUrl() |
| | | this.controller() |
| | | },1000) |
| | | setInterval(()=>{ |
| | | // 测试用 |
| | | |
| | | this.getVisualized() |
| | | // this.getVisualizedTest() |
| | | },1000) |
| | | }, |
| | | methods: { |
| | | getUrl() { |
| | | this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePort + "/" +this.baseUrl |
| | | }, |
| | | getVisualizedTest() { |
| | | let that = this |
| | | var result = ycqdata.dataInfo3 |
| | | // console.log(result); |
| | | let res = result.data |
| | | if (res.code === 200) { |
| | | // console.log(res.data.agvWaitPakins); |
| | | if (res.data.agvWrkDetls != null) { |
| | | that.locs = res.data.agvWrkDetls |
| | | if (res.data.agvWrkMast) { |
| | | if (res.data.agvWrkMast.ioType == 107) { |
| | | that.infoText.title = '盘点出库' |
| | | } else if (res.data.agvWrkMast.ioType == 103) { |
| | | that.infoText.title = '拣料出库' |
| | | } else if (res.data.agvWrkMast.ioType == 57) { |
| | | that.infoText.title = '盘点再入库' |
| | | } else if (res.data.agvWrkMast.ioType == 53) { |
| | | that.infoText.title = '拣料再入库' |
| | | } else if (res.data.agvWrkMast.ioType == 101) { |
| | | that.infoText.title = '全板出库' |
| | | } |
| | | } else{ |
| | | that.infoText.title = '入库作业' |
| | | } |
| | | } else if (res.data.agvWaitPakins != null) { |
| | | that.locs = res.data.agvWaitPakins |
| | | that.infoText.title = '入库作业' |
| | | } |
| | | |
| | | |
| | | |
| | | } |
| | | }, |
| | | getVisualized() { |
| | | let that = this |
| | | let param = {devNo: `${that.devNo}`} |
| | | uni.request({ |
| | | 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 |
| | | that.result = res |
| | | if (res.code === 200) { |
| | | if (res.data.agvWrkDetls != null) { |
| | | that.locs = res.data.agvWrkDetls |
| | | if (res.data.agvWrkMast) { |
| | | if (res.data.agvWrkMast.ioType == 107) { |
| | | that.infoText.title = '盘点出库' |
| | | } else if (res.data.agvWrkMast.ioType == 103) { |
| | | that.infoText.title = '拣料出库' |
| | | for (let k in that.locs) { |
| | | if (that.locs[k].anfme == 0 || that.locs[k].anfme == null) { |
| | | that.locs[k]['color'] = 'color: #df741c' |
| | | } |
| | | } |
| | | } else if (res.data.agvWrkMast.ioType == 57) { |
| | | that.infoText.title = '盘点再入库' |
| | | } else if (res.data.agvWrkMast.ioType == 53) { |
| | | that.infoText.title = '拣料再入库' |
| | | } else if (res.data.agvWrkMast.ioType == 101) { |
| | | that.infoText.title = '全板出库' |
| | | } |
| | | |
| | | |
| | | } else{ |
| | | that.infoText.title = '入库作业' |
| | | } |
| | | } else if (res.data.agvWaitPakins != null) { |
| | | that.locs = res.data.agvWaitPakins |
| | | that.infoText.title = '入库作业' |
| | | } |
| | | |
| | | |
| | | |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | getServerData() { |
| | | this.chartsDataLine1=JSON.parse(JSON.stringify(this.chartsData.Line)) |
| | | this.chartsDataPie2=JSON.parse(JSON.stringify(this.chartsData.Pie)) |
| | |
| | | uni.setStorageSync('BasePort',this.basePort); |
| | | uni.setStorageSync('BaseCrnId',this.baseCrnId); |
| | | uni.setStorageSync('UPROJ',this.baseUrl); |
| | | uni.setStorageSync('devNo',this.devNo); |
| | | this.getUrl() |
| | | this.ejectShow = false |
| | | }, |
| | |
| | | uni.request({ |
| | | url: that.commonUrl + "/monitor/loc/rep", |
| | | method:'GET', |
| | | data: { |
| | | crnId: that.baseCrnId, |
| | | }, |
| | | success(result) { |
| | | var res = result.data |
| | | if (res.code === 200) { |
| | | // console.log(res.data.pie); |
| | | 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.longAllLoc = res.data.longAllLoc |
| | | that.baseInfo.shortAllLoc = res.data.shortAllLoc |
| | | that.baseInfo.longEmptyLoc = res.data.longEmptyLoc |
| | | that.baseInfo.shortEmptyLoc = res.data.shortEmptyLoc |
| | | that.baseInfo.longUseLoc = res.data.longUseLoc |
| | | that.baseInfo.shortUseLoc = res.data.shortUseLoc |
| | | that.baseInfo.longXLoc = res.data.longXLoc |
| | | that.baseInfo.shortXLoc = res.data.shortXLoc |
| | | that.baseInfo.used = res.data.used |
| | | that.baseInfo.usedPr = res.data.usedPr |
| | | } |
| | |
| | | display: flex; |
| | | flex-direction: row; |
| | | } |
| | | |
| | | .red { |
| | | color: red |
| | | } |
| | | |
| | | .container{ |
| | | width: 100vw; |
| | |
| | | /* background-color: #00ffff; */ |
| | | } |
| | | .sub-info { |
| | | margin-top: 1vh; |
| | | font-size: 1.5vw; |
| | | } |
| | | .sub-info image { |
| | |
| | | .eject{ |
| | | position: relative; |
| | | width: 40vw; |
| | | height: 40vh; |
| | | height: 50vh; |
| | | background-color: #fff; |
| | | border-radius: 2rem; |
| | | } |