场位管控-场位图

dev3
wuwx 2024-02-27 16:10:12 +08:00
parent 1fa3e5607d
commit db464aa5b9
2 changed files with 160 additions and 108 deletions

View File

@ -196,43 +196,31 @@
<view class="cwRight"> <view class="cwRight">
<view class="rightBox" v-for="(item,index) in qyList" :key="index"> <view class="rightBox" v-for="(item,index) in qyList" :key="index">
<view class="boxTop"> <view class="boxTop">
<p>{{item.pyaAreaCode}}{{item.totalLaneAmout}}/{{item.totalSeatAmout}}</p> <p>{{item.pyaAreaCode}}{{item.useSeatAmount}}/{{item.totalSeatAmount}}</p>
<text @click="clickLine(item)"></text> <text @click="clickLine(item)"></text>
</view> </view>
<view class="boxContent"> <view class="boxContent">
<view class="dataList"> <view class="empty" v-show="item.emptyLaneList.length">
<p>车位总数 <view class="dataList" v-for="(ite,inde) in item.emptyLaneList" :key="inde">
<template v-if="item.totalSeatAmout == null">-- </template> {{ ite }} 空道
<template v-else>{{item.totalSeatAmout}}</template> </view>
车位
</p>
<p>使用
<template v-if="item.useSeatAmout == null">-- </template>
<template v-else>{{item.useSeatAmout}}</template>
车位
</p>
<p>剩余
<template v-if="item.remainSeatAmout == null">-- </template>
<template v-else>{{item.remainSeatAmout}}</template>
车位
</p>
<p>可停放车辆
<template v-if="item.unparkGoodsAmout == null">-- </template>
<template v-else>{{item.unparkGoodsAmout}}</template>
</p>
<p>已停放车辆
<template v-if="item.stopGoodsAmout == null">-- </template>
<template v-else>{{item.stopGoodsAmout}}</template>
</p>
</view> </view>
<view class="boxJd"> <view class="data" v-show="item.goodsInfoList.length">
<view class="dataList" v-for="(ite,inde) in item.goodsInfoList" :key="inde">
<view class="goOut" v-show="ite.importExportType == 'E'"></view>
<view class="advance" v-show="ite.importExportType == 'I'"></view>
<view class="spmName">{{ ite.spmName }}/{{ ite.vvyName }}</view>
<view class="brdName">{{ ite.brdName }}</view>
<view style="margin-left: 16px;">{{ ite.amount }}</view>
<view class="lane">{{ ite.lane }}</view>
</view>
</view>
<!-- <view class="boxJd">
<lx-progress-bar title="" :total="item.totalSeatAmout" <lx-progress-bar title="" :total="item.totalSeatAmout"
:firstValue="item.stopGoodsAmout" contentColor="#0067CF" /> :firstValue="item.stopGoodsAmout" contentColor="#0067CF" />
<text>{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}</text> <text>{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}</text>
</view> </view> -->
<view class="carUl"> <!-- <view class="carUl">
<view class="carLi" v-for="(v,index2) in item.carStatisticsList" <view class="carLi" v-for="(v,index2) in item.carStatisticsList"
:key="index2" @click="clickCar(v)"> :key="index2" @click="clickCar(v)">
<zb-tooltip placement="top-start" color="white" <zb-tooltip placement="top-start" color="white"
@ -257,7 +245,7 @@
</view> </view>
</zb-tooltip> </zb-tooltip>
</view> </view>
</view> </view> -->
</view> </view>
</view> </view>
</view> </view>
@ -265,7 +253,7 @@
</view> </view>
<template v-else> <template v-else>
<place @modifyPlaceTabs="modifyPlaceTabs" :vvyId="vvyId" :pyaObj="pyaObj" :brdId="brdId" <place @modifyPlaceTabs="modifyPlaceTabs" :vvyId="vvyId" :pyaObj="pyaObj" :brdId="brdId"
:potId="potId" :vinCode="vinCode" :workId="workId"></place> :potId="potId" :vinCode="vinCode" :workId="workId" :dcId="dcId"></place>
</template> </template>
</custom-tab-pane> </custom-tab-pane>
<custom-tab-pane :label="tabsTitle1" name="c1_2"> <custom-tab-pane :label="tabsTitle1" name="c1_2">
@ -949,7 +937,8 @@
// //
getDc() { getDc() {
uni.request({ uni.request({
url: `${this.$local}/api/yardGoods/monitor/goods/manage/page?displayFlag=0&pamId=${this.portObj.portId}&vvyId=${this.vvyId}&brdId=${this.brdId}&potId=${this.potId}&spmId=${this.shipId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=100`, url: `${this.$local}/api/yardGoods/monitor/v2/yard/list?displayFlag=0&pamId=${this.portObj.portId}&vvyId=${this.vvyId}&brdId=${this.brdId}&potId=${this.potId}&spmId=${this.shipId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=100`,
// url: `${this.$local}/api/yardGoods/monitor/goods/manage/page?displayFlag=0&pamId=${this.portObj.portId}&vvyId=${this.vvyId}&brdId=${this.brdId}&potId=${this.potId}&spmId=${this.shipId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=100`,
header: { header: {
'Content-Type': 'application/json', // 'Content-Type': 'application/json', //
'Authorization': `Bearer ${this.loginObj.access_token}` 'Authorization': `Bearer ${this.loginObj.access_token}`
@ -957,7 +946,7 @@
method: 'GET', // method: 'GET', //
success: (res) => { success: (res) => {
if (res.data.status == "200") { if (res.data.status == "200") {
this.dcList = res.data.data.records this.dcList = res.data.data
this.dcId = this.dcList[0].pymId this.dcId = this.dcList[0].pymId
this.dcName = this.dcList[0].pymName this.dcName = this.dcList[0].pymName
this.getSurvey() this.getSurvey()
@ -977,7 +966,8 @@
// //
getQy() { getQy() {
uni.request({ uni.request({
url: `${this.$local}/api/yardGoods/monitor/region/statistics?spmId=${this.shipId}&vvyId=${this.vvyId}&pymId=${this.dcId}&displayFlag=0&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=1000`, url: `${this.$local}/api/yardGoods/monitor/v2/region/page?spmId=${this.shipId}&vvyId=${this.vvyId}&pymId=${this.dcId}&displayFlag=0&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=1000`,
// url: `${this.$local}/api/yardGoods/monitor/region/statistics?spmId=${this.shipId}&vvyId=${this.vvyId}&pymId=${this.dcId}&displayFlag=0&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}&size=1000`,
header: { header: {
'Content-Type': 'application/json', // 'Content-Type': 'application/json', //
'Authorization': `Bearer ${this.loginObj.access_token}` 'Authorization': `Bearer ${this.loginObj.access_token}`
@ -986,24 +976,13 @@
success: (res) => { success: (res) => {
if (res.statusCode == 200) { if (res.statusCode == 200) {
this.qyList = res.data.data.records this.qyList = res.data.data.records
// console.log(this.qyList);
this.qyList.forEach(v => { this.qyList.forEach(v => {
if (v.remainSeatAmout == null) { if (v.totalSeatAmount == null) {
this.$set(v, "remainSeatAmout", 0) this.$set(v, "totalSeatAmount", 0)
} }
if (v.stopGoodsAmout == null) { if (v.useSeatAmount == null) {
this.$set(v, "stopGoodsAmout", 0) this.$set(v, "useSeatAmount", 0)
}
if (v.totalLaneAmout == null) {
this.$set(v, "totalLaneAmout", 0)
}
if (v.totalSeatAmout == null) {
this.$set(v, "totalSeatAmout", 0)
}
if (v.unparkGoodsAmout == null) {
this.$set(v, "unparkGoodsAmout", 0)
}
if (v.useSeatAmout == null) {
this.$set(v, "useSeatAmout", 0)
} }
if (v.carStatisticsList != null) { if (v.carStatisticsList != null) {
v.carStatisticsList.forEach(e => { v.carStatisticsList.forEach(e => {
@ -1332,16 +1311,60 @@
height: 180px; height: 180px;
overflow: scroll; overflow: scroll;
padding: 5px 8px; padding: 5px 8px;
.empty {
.dataList {
display: flex; display: flex;
flex-wrap: wrap; width: 100%;
padding: 8px 6px;
p { background: #E1E5ED;
margin-right: 10px; align-items: center;
font-size: 12px; justify-content: center;
color: #666666; .dataList {
}
}
}
.data {
font-size: 12px;
.dataList {
width: 100%;
padding: 8px 9px;
background: white;
margin-top: 6px;
display: flex;
align-items: center;
position: relative;
.goOut {
color: #FF6B3B;
border: 1px solid #FF6B3B;
border-radius: 50%;
padding: 3px;
font-size: 8px;
}
.advance {
color: #2CC68B;
border: 1px solid #2CC68B;
border-radius: 50%;
padding: 3px;
font-size: 8px;
}
.spmName {
margin-left: 10px;
width:77px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.brdName {
margin-left: 12px;
width:50px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.lane {
position: absolute;
right: 9px;
}
}
} }
.boxJd { .boxJd {

View File

@ -32,6 +32,8 @@
<text>有计划</text> <text>有计划</text>
</view> </view>
</template> </template>
<superwei-combox :candidates="pyaAreaCodeList" :isJSON="true" keyName="pyaAreaCode" placeholder="区域"
v-model="pyaAreaCode" @select="regionSelect" @input="inputSelect"></superwei-combox>
</view> </view>
</view> </view>
</view> </view>
@ -44,63 +46,52 @@
</view> </view>
</view> </view>
<view class="placeText"> <view class="placeText">
<text>车位总数{{lineData.totalSeatAmout}}车位</text> <text>车位总数{{lineData.totalSeatAmount}}车位</text>
<text>使用车位{{lineData.useSeatAmout}}车位</text> <text>使用车位{{lineData.useSeatAmount}}车位</text>
<text>剩余车位{{lineData.remainSeatAmout}}车位</text> <text>剩余车位{{lineData.remainSeatAmount}}车位</text>
<text>虚拟场位{{lineData.virtuaSeatAmout}}车位</text> <text>虚拟场位{{lineData.virtualSeatAmount}}车位</text>
<text>可停放车辆{{lineData.unparkGoodsAmout}}</text> <!-- <text>可停放车辆{{lineData.unparkGoodsAmout}}</text> -->
<text>已停放车辆{{lineData.stopGoodsAmout}}</text> <text>已停放车辆{{lineData.stopGoodsAmount}}</text>
</view> </view>
<view class="placeContent" v-if="selectValue == 1"> <view class="placeContent" v-if="selectValue == 1">
<view class="placeList" v-for="(item,index) in lineData.lineStatisticsList"> <view class="placeList" v-for="(item,index) in lineData.laneList">
<view class="listLeft"> <view class="listLeft">
<template> <template>
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}</p> <p>{{item.yalNo}}</p>
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}</text> <text>已停{{item.stopGoodsAmount}}/{{item.totalSeatAmount}}</text>
</template> </template>
</view> </view>
<view class="listRight"> <view class="listRight">
<template v-for="(item2,index2) in item.carLineRespList" @click="showContent(item2)"> <template v-for="(item2,index2) in item.laneDisplayList" @click="showContent(item2)">
<view class="rigthContent wsy" :key="index2" v-if="item2.type == '0' || item2.type == '3'"> <view class="rigthContent wsy" :key="index2" v-if="item2.status == '0'">
<text>{{item2.carSituation}}</text> <text>未使用:{{item2.notUsedSeatAmount}}车位/禁用:{{ item2.bannedSeatAmount }}车位</text>
</view> </view>
<view class="rigthContent sy" :key="index2" v-if="item2.type == '1'"> <view class="rigthContent sy" :key="index2" v-if="item2.status == '1'">
<text v-if="item2.existFlag == '1'"
class="gl">{{item2.brdName}}{{item2.amount}}</text>
<text v-else>{{item2.brdName}}{{item2.amount}}</text>
</view>
<!-- <view class="rigthContent xn" :key="index2" v-if="item2.type == '2'">
<text v-if="item2.existFlag == '1'" <text v-if="item2.existFlag == '1'"
class="gl">{{item2.carSituation}}{{item2.carAmout}}</text> class="gl">{{item2.carSituation}}{{item2.carAmout}}</text>
<text v-else>{{item2.carSituation}}{{item2.carAmout}}</text> <text v-else>{{item2.carSituation}}{{item2.carAmout}}</text>
</view> </view> -->
<view class="rigthContent xn" :key="index2" v-if="item2.type == '2'">
<text v-if="item2.existFlag == '1'"
class="gl">{{item2.carSituation}}{{item2.carAmout}}</text>
<text v-else>{{item2.carSituation}}{{item2.carAmout}}</text>
</view>
</template> </template>
</view> </view>
</view> </view>
</view> </view>
<view class="placeContent" v-if="selectValue == 2"> <view class="placeContent" v-if="selectValue == 2">
<!-- <view class="seatTitle"> <view class="placeList" v-for="(item,index) in lineData.laneList">
<view class="titleLeft">
车位
</view>
<view class="titleRight">
<p v-for="(item,index) in seatNum" :key="index">
<template v-if="item >= 1 && item <= 9">0</template>
{{item}}
</p>
</view>
</view> -->
<view class="placeList" v-for="(item,index) in seatData.seatCarStatisticsList">
<view class="listLeft"> <view class="listLeft">
<template> <template>
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}</p> <p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}</p>
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}</text> <text>已停{{item.stopGoodsAmount}}/{{item.totalSeatAmount}}</text>
</template> </template>
</view> </view>
<view class="listRightSeat"> <view class="listRightSeat">
<template v-for="(item2,index2) in item.carStatisticsList"> <template v-for="(item2,index2) in item.seatDisplayList">
<view class="seatBox kz" :key="index2" v-if="item2.type == 0"> <view class="seatBox kz" :key="index2" v-if="item2.status == 0">
<view class="planIcon"> <view class="planIcon">
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'"> <image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
</image> </image>
@ -111,7 +102,7 @@
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p> <p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
</view> </view>
<view class="seatBox sy" :class="{syGl:item2.existFlag == '1'}" :key="index2" <view class="seatBox sy" :class="{syGl:item2.existFlag == '1'}" :key="index2"
v-if="item2.type == 1"> v-if="item2.status == 1">
<view class="planIcon"> <view class="planIcon">
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'"> <image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
</image> </image>
@ -123,7 +114,7 @@
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p> <p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
</view> </view>
<view class="seatBox xn" :class="{xnGl:item2.existFlag == '1'}" :key="index2" <view class="seatBox xn" :class="{xnGl:item2.existFlag == '1'}" :key="index2"
v-if="item2.type == 2"> v-if="item2.virtuallyFlag == 1 && item2.status == 1">
<view class="planIcon"> <view class="planIcon">
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'"> <image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
</image> </image>
@ -159,6 +150,8 @@
lineData: {}, lineData: {},
seatNum: 0, seatNum: 0,
seatData: {}, seatData: {},
pyaAreaCode:'',
pyaAreaCodeList:[]
} }
}, },
props: { props: {
@ -189,12 +182,18 @@
workId: { workId: {
type: String, type: String,
default: () => "" default: () => ""
},
dcId:{
type: String,
default: () => ""
} }
}, },
mounted() { mounted() {
this.loginObj = uni.getStorageSync('loginObj') this.loginObj = uni.getStorageSync('loginObj')
this.pyaAreaCode = this.pyaObj.pyaAreaCode
this.getLineData() this.getLineData()
console.log(this.workId) console.log(this.workId)
this.getSelect()
}, },
methods: { methods: {
// //
@ -211,7 +210,8 @@
// //
getLineData() { getLineData() {
uni.request({ uni.request({
url: `${this.$local}/api/yardGoods/monitor/line/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}`, url: `${this.$local}/api/yardGoods/monitor/v2/lane/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}`,
// url: `${this.$local}/api/yardGoods/monitor/line/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}`,
header: { header: {
'Content-Type': 'application/json', // 'Content-Type': 'application/json', //
'Authorization': `Bearer ${this.loginObj.access_token}` 'Authorization': `Bearer ${this.loginObj.access_token}`
@ -226,27 +226,56 @@
}) })
}, },
// //
getSeatData() { // getSeatData() {
// uni.request({
// url: `${this.$local}/api/yardGoods/monitor/seat/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}`,
// header: {
// 'Content-Type': 'application/json', //
// 'Authorization': `Bearer ${this.loginObj.access_token}`
// },
// method: 'GET', //
// success: (res) => {
// if (res.data.status == 200) {
// this.seatData = res.data.data
// console.log(this.seatData)
// let numList = []
// this.seatData.seatCarStatisticsList.forEach(v => {
// numList.push(v.carStatisticsList.length)
// })
// this.seatNum = Math.max(...numList)
// }
// }
// })
// },
//
getSelect() {
uni.request({ uni.request({
url: `${this.$local}/api/yardGoods/monitor/seat/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&potId=${this.potId}&vinCode=${this.vinCode}&workStatuss=${this.workId}`, url: `${this.$local}/api/yardGoods/monitor/v2/region/select?pymId=${this.dcId}&key=${this.pyaAreaCode}`,
header: { header: {
'Content-Type': 'application/json', // 'Content-Type': 'application/x-www-form-urlencoded', //
'Authorization': `Bearer ${this.loginObj.access_token}` 'Authorization': `Bearer ${this.loginObj.access_token}`
}, },
method: 'GET', // method: 'GET', //
success: (res) => { success: (res) => {
if (res.data.status == 200) { if (res.data.status == 200) {
this.seatData = res.data.data console.log(res.data.data);
console.log(this.seatData) this.pyaAreaCodeList = res.data.data
let numList = []
this.seatData.seatCarStatisticsList.forEach(v => {
numList.push(v.carStatisticsList.length)
})
this.seatNum = Math.max(...numList)
} }
} }
}) })
}, },
//
regionSelect(e) {
console.log(e);
this.pyaObj.pyaId = e.pyaId
this.dcId = e.pymId
this.getLineData()
},
//
inputSelect(e) {
this.pyaAreaCode = e
this.getSelect()
}
}, },
} }
</script> </script>
@ -272,7 +301,7 @@
.right { .right {
display: flex; display: flex;
align-items: center;
.status { .status {
width: 10px; width: 10px;
height: 10px; height: 10px;