卸船指令-场位图需求

config/index.js

@@ -17,7 +17,8 @@ export default {
 	 */
 	// local: "http://192.168.61.133/tos", // VPN地址
 	local: "https://rtops4.haitongauto.com/tos", // 海通地址(测试版)
-	local2: "https://rtops.haitongauto.com/tos", // 海通地址(正式版)
+	local2: "https://khpt1.haitongauto.com/tos", // 海通地址(正式版)
+	// local2: "https://rtops.haitongauto.com/tos", // 海通地址(正式版)
 	imgSrc: "http://116.205.142.169/HtRtosResource/assets/",
 	mapkey: "FUFBZ-KBIWW-P63RR-RR4W3-BNV4H-T6BGX"
 }

pages/discharge/instruct.vue

@@ -539,6 +539,12 @@
 						<view class="cwMain">
 							<view class="cwTop">
 								<view style="display: flex;">
+									<view style="display: flex; flex-direction: column; justify-content: center;">
+				                    	<view class="left" @click="goBack">
+				                    		<uni-icons type="back" size="16" />
+				                    		<text>返回</text>
+				                    	</view>
+				                    </view>
 									<view class="statusText">
 										<view class="status kz"></view>
 										<text>空置</text>
@@ -547,24 +553,43 @@
 										<view class="status sy"></view>
 										<text>使用</text>
 									</view>
+									<view class="statusText">
+						            	<view class="status xn"></view>
+						            	<text>虚拟车位</text>
+						            </view>
+									<view class="statusText">
+						            	<view class="status jh"></view>
+						            	<text>无计划</text>
+						            </view>
 								</view>
 								<view class="topRight">
-									<p>港区:{{cwData.pamName}}</p>
+									<!-- <p>港区:{{cwData.pamName}}</p>
 									<p>船名/航次:{{cwData.voyName}}</p>
 									<p>总数量:{{cwData.total}}</p>
 									<p>已配数量:{{cwData.allocatNumber}}</p>
-									<p>未配数量:{{cwData.notNumber}}</p>
+									<p>未配数量:{{cwData.notNumber}}</p> -->
+									<view class="rightImg">
+				                    	<image src="../../static/images/lineImg.png" mode=""></image>
+				                    </view>
+				                    <uni-data-select v-model="selectValue" :localdata="selectList" @change="selectChange"></uni-data-select>
+				                    <uni-icons type="bottom" size="16" color="#1677FF" />
 								</view>
 							</view>
-							<view class="cwTitle">
+						  <view style="overflow: scroll;" v-if="selectValue == 1">
+							<view class="cwTitle" style="width: 100%;">
 								<view class="titleLeft">
 									车道
 								</view>
-								<view class="titleRight">
+								<view class="titleRight" style="justify-content: center;">
 									车位
 								</view>
+								<!-- <view class="titleRight">
+									<view v-for="item in 30" class="parkingSpace">
+                                      {{ item }}
+									</view>
+								</view> -->
 							</view>
-							<view class="cwContent">
+							<view class="cwContent" style="width: 100%;">
 								<view class="cwLeftBox">
 									<view class="cwLeft" v-for="item in cdList.length" :key="item">
 										<template v-if="item > 0 && item <= 9">0</template>
@@ -573,13 +598,42 @@
 								</view>
 								<view class="cwRightBox">
 									<view class="cwRight"
-										:style="{height:(item.index > 1 ? item.index*32 + 'px':''),background: (item.index > 1 ? '#C7D4F3':'')}"
+										:style="{background: (item.index > 1 ? '#C7D4F3':'')}"
 										v-for="(item,idx) in rigthCw" :key="idx">
-										<text v-if="item.name == '空置'">{{item.name}}</text>
+										<text style="width:100%" v-if="item.name == '空置'">{{item.name}}</text>
-										<p v-else>{{item.name}}</p>
+										<p v-else style="flex:1;">{{item.name}}</p>
+										<p v-if="item.sum > item.amount" :style="{width:(1 - item.amount / item.sum) * 100 + '%',background: '#F7F9FF',color: '#666666'}">空置</p>
 									</view>
 								</view>
 							</view>
+						  </view>
+						  <view style="overflow: scroll;" v-if="selectValue == 2">
+							<view class="cwTitle" :style="{width:(maxWidth)}">
+								<view class="titleLeft">
+									车道
+								</view>
+								<view class="titleRight">
+									<view v-for="item in 30" class="parkingSpace">
+                                      {{ item }}
+									</view>
+								</view>
+							</view>
+							<view class="cwContent" :style="{width:(maxWidth)}">
+								<view class="cwLeftBox">
+									<view class="cwLeft" v-for="item in cdList.length" :key="item">
+										<template v-if="item > 0 && item <= 9">0</template>
+										{{item}}道
+									</view>
+								</view>
+								<view class="cwRightBox">
+								  <view v-for="(item,index) in yalChartList" :key="index" style="display:flex;">
+                                    <view v-for="(ite,inx) in item" :key="inx" class="carSpace" :class="[ite.veFlag == '0' ? 'use' : ite.veFlag == '1' ? 'virtually' : ite.valid == 'N' ? 'disable' : '']">
+                                         {{ ite.valid == 'N' ? '禁用' : ite.brdName }}
+									</view>
+								  </view>
+								</view>
+							</view>
+						  </view>
 						</view>
 					</view>
 				</custom-tab-pane>
@@ -761,6 +815,18 @@
 				// 分页
 				pageSize: 10,
 				current: 1,
+				selectValue: "1",
+				selectList: [{
+						text: "车道",
+						value: "1",
+					},
+					{
+						text: "车位",
+						value: "2",
+					}
+				],
+				yalChartList:[],
+				maxWidth:0
 			}
 		},
 		computed: {
@@ -791,6 +857,17 @@
 			HeadView,
 		},
 		methods: {
+		    // 返回上页
+			goBack() {
+				uni.navigateTo({
+                	url: '/pages/discharge/index'
+                });
+			},
+			// 点击下拉切换车道车位
+			selectChange(e) {
+				this.selectValue = e
+				this.getCw()
+			},
 			// 点击tabs
 			changeTabs(e) {
 				this.mnfBl = ''
@@ -1415,7 +1492,8 @@
 			// 获取车道数据
 			getCd() {
 				uni.request({
-					url: `${this.$local}/api/yard/sel/queryLanesByPyaId?pyaId=${this.qyId}`,
+					// url: `${this.$local}/api/yard/sel/queryListByPyaId?pyaId=${this.qyId}`,
+					url: `${this.$local}/api/yard/sel/queryListByPyaId?pyaId=194dfe8a61b78839c8370343f7653e47`,
 					header: {
 						'Content-Type': 'application/json', //自定义请求头信息
 						'Authorization': `Bearer ${this.loginObj.access_token}`
@@ -1425,6 +1503,7 @@
 						console.log(res)
 						if (res.data.status == "200") {
 							this.cdList = res.data.data
+							this.getCw()
 						}
 					}
 				})
@@ -1432,7 +1511,8 @@
 			// 获取数据
 			getCw() {
 				uni.request({
-					url: `${this.$local}/api/shipment/unload/plans/pos/chart?brdId=${this.brdId}&mnfBl=${this.mnfBl}&vvyId=${this.shipInfo.vvyId}&pyaId=${this.qyId}`,
+					// url: `${this.$local}/api/shipment/unload/plans/pos/chart?brdId=${this.brdId}&mnfBl=${this.mnfBl}&vvyId=${this.shipInfo.vvyId}&pyaId=${this.qyId}`,
+					url: `${this.$local}/api/shipment/unload/plans/pos/chart?brdId=${this.brdId}&mnfBl=${this.mnfBl}&vvyId=${this.shipInfo.vvyId}&pyaId=194dfe8a61b78839c8370343f7653e47`,
 					header: {
 						'Content-Type': 'application/json', //自定义请求头信息
 						'Authorization': `Bearer ${this.loginObj.access_token}`
@@ -1443,33 +1523,57 @@
 						if (res.data.status == "200") {
 							this.cwData = res.data.data
 							let arr = []
-							let nArr = []
+							this.yalChartList = []
 							let arr2 = []
+							let maxArr = []
+							let max
+							let sumList = []
+							res.data.data.yalChartList.forEach(item => {
+								item.posPuts.forEach(ite => {
+									 maxArr.push(Number(ite.yacNo))
+									 max = Math.max(...maxArr)
+								})
+							})
 							this.cdList.forEach(item => {
 								arr.push({
 									name: "空置",
 									index: 1
 								})
+								arr2 = []
+								for (let index = 0; index < max; index++) {
+									arr2.push({yacNo:index + 1,valid:item.yardAreaCoordList[index]?.valid})
+								}
+							 this.yalChartList.push(arr2)
 							})
+							this.maxWidth = max * 54 + 'px'
+							// console.log(this.yalChartList);
 							res.data.data.posChartRespDTOList.forEach(item => {
-								nArr = []
+								sumList = []
-								let num = Number(item.endLane) - Number(item.startLane) ? Number(item
+								for (let index = Number(item.startLane) - 1; index <= Number(item.endLane) - 1; index++) {
-									.endLane) - Number(item.startLane) : 1
+									 sumList.push(this.cdList[index].yardAreaCoordTotal)
-								let Nnum = num > 1 ? num + 1 : num
+									 arr[index] = {
-								for (let i = 0; i < Nnum; i++) {
+									 	name: item.plansGroupList[0]
-									nArr.push({
+									 		?.name,
-										name: item.plansGroupList[0]
+									 	amount:item.plansGroupList[0]
-											?.name,
+									 		?.amount,
-										index: Nnum
+										sumList
-									})
+									 }
 								}
-								if (Nnum > 1) {
+								
-									arr.pop()
-								}
-								arr.splice(Number(item.startLane) - 1, num, ...nArr)
 							})
-							this.arrFrom(arr, arr2)
+							if(this.selectValue == 2) {
-							this.rigthCw = arr2
+								res.data.data.yalChartList.forEach(item => {
+								item.posPuts.forEach(ite => {
+									if(this.yalChartList[Number(ite.yalNo) - 1][Number(ite.yacNo) - 1]) this.yalChartList[Number(ite.yalNo) - 1][Number(ite.yacNo) - 1].brdName = ite.brdName
+									if(this.yalChartList[Number(ite.yalNo) - 1][Number(ite.yacNo) - 1]) this.yalChartList[Number(ite.yalNo) - 1][Number(ite.yacNo) - 1].veFlag = ite.veFlag
+									})
+								})
+							}
+							this.rigthCw = arr.map((item,index) => {
+							   if(item.sumList) item.sum = item.sumList.reduce((sum, num) => (sum += num), 0)
+								return item
+							})
+							// console.log(this.rigthCw);
 						}
 					}
 				})
@@ -2277,6 +2381,11 @@
 				background: #FDFEFE;
 				border: 1px solid #E1E5ED;
 
+				.left {
+					font-size: 14px;
+					margin-right: 48px;
+				}
+
 				.status {
 					width: 10px;
 					height: 10px;
@@ -2298,10 +2407,38 @@
 					.sy {
 						background: #4476F6;
 					}
+					
+					.xn {
+						background: #FF6B3B;
+					}
+
+					.jh {
+                        background: #744BFF;
+					}
 				}
 
 				.topRight {
 					display: flex;
+				 .rightImg {
+					display: flex;
+					flex-direction: column;
+					justify-content: center;
+
+					image {
+						width: 14px;
+						height: 14px;
+					}
+				  }
+				  /deep/.uni-stat__select {
+					width: 50px;
+				}
+				  /deep/.uni-select {
+					border: none;
+					background: transparent;
+				}
+				/deep/.uniui-clear:before {
+					display: none;
+				}
 
 					p {
 						margin-left: 20px;
@@ -2310,7 +2447,6 @@
 			}
 
 			.cwTitle {
-				width: 100%;
 				height: 32px;
 				line-height: 32px;
 				display: flex;
@@ -2330,6 +2466,10 @@
 				.titleRight {
 					width: calc(100% - 128px);
 					height: 100%;
+					display: flex;
+					.parkingSpace {
+						width: 54px;
+					}
 				}
 			}
 
@@ -2337,8 +2477,6 @@
 				background-color: #fff;
 				display: flex;
 				height: calc(100% - 83px);
-				overflow: scroll;
-
 				.cwLeftBox {
 					width: 128px;
 					height: 100%;
@@ -2362,12 +2500,33 @@
 					height: 100%;
 					text-align: center;
 					font-size: 12px;
+					.carSpace {
+						width:54px;
+						height:32px;
+						opacity:0.8;
+                        background: #F7F9FF;
+                        border: 1px solid #E1E5ED;
+						font-size: 12px;
+						line-height: 32px;
+					}
+					.use {
+						background: #C7D4F3;
+						color: #4476F6;
+					}
+					.virtually {
+						background: rgba(253,98,98,0.10);
+						color: #FD6262;
+					}
+					.disable {
+						background: #EEEEEE;
+						color: #666666;
+					}
 
 					.cwRight {
 						height: 32px;
 						display: flex;
-						flex-direction: column;
+						// flex-direction: column;
-						justify-content: center;
+						// justify-content: center;
 
 						text {
 							padding: 5px;
@@ -2381,9 +2540,7 @@
 							background: #C7D4F3;
 							color: #4476F6;
 							height: 32px;
-							display: flex;
+							line-height:32px
-							flex-direction: column;
-							justify-content: center;
 						}
 					}
 				}

pages/monitor/place.vue

@@ -443,6 +443,7 @@
 						margin: 7px 0;
 						font-size: 14px;
 						color: #666666;
+						min-width: 120px;
 					}
 
 					.wsy {