更新线边库监控

src/views/asrs/warehouseLineMonitoring/index.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2024-01-17 09:58:41
  * @LastEditors: zwq
- * @LastEditTime: 2024-03-14 14:53:29
+ * @LastEditTime: 2024-04-01 10:43:49
  * @Description:
 -->
 <template>
@@ -17,19 +17,16 @@
 			<el-tag effect="dark" color="#7362F3" style="border: none">锁</el-tag>
 		</div>
 		<div class="mainbody">
-			<el-divider class="divider" content-position="left">分拣区</el-divider>
+			<el-divider class="divider" content-position="left">二次分拣区</el-divider>
-			<div v-for="i in 12" :key="i">
+			<div v-for="i in 5" :key="i+'G'">
 				<el-row style="margin-bottom: 10px" type="flex" class="flex-warp">
-					<div
-						class="dashboard-layout-item"
-						style="opacity: 0"
-						v-if="i === 12" />
 					<div
 						class="dashboard-layout-item"
 						v-for="j in wareData
 							.filter(
 								(item) =>
-									item.agvGroundCode.substr(0, 2) == 13 - i && item.region === 2
+									item.agvGroundCode.substr(1, 2) == 6 - i &&
+									item.region === 4
 							)
 							.reverse()"
 						:key="j.id"
@@ -39,8 +36,51 @@
 							:title="j.lineEdgeLibraryCode"
 							width="200"
 							trigger="hover">
-              <div class="point"/>托盘编码: {{ j.trayCode }}<br/>
+							<div class="point" />
-              <div class="point"/>Agv地码: {{ j.agvGroundCode }}
+							托盘编码: {{ j.trayCode }}
+							<br />
+							<div class="point" />
+							Agv地码: {{ j.agvGroundCode }}
+							<div
+								slot="reference"
+								class="hoverDiv"
+								:style="{
+									cursor:
+										j.lineEdgeLibraryState === 1 ? 'not-allowed' : 'pointer',
+									background: bgColor[j.lineEdgeLibraryState],
+								}"></div>
+						</el-popover>
+					</div>
+				</el-row>
+			</div>
+			<el-divider class="divider" content-position="left">一次分拣区</el-divider>
+			<div v-for="i in 7" :key="i+'F'">
+				<el-row style="margin-bottom: 10px" type="flex" class="flex-warp">
+					<div
+						class="dashboard-layout-item"
+						style="opacity: 0"
+						v-if="i === 7" />
+					<div
+						class="dashboard-layout-item"
+						v-for="j in wareData
+							.filter(
+								(item) =>
+									item.agvGroundCode.substr(1, 2) == 8 - i &&
+									item.region === 2
+							)
+							.reverse()"
+						:key="j.id"
+						:title="j.lineEdgeLibraryCode">
+						<el-popover
+							placement="top-start"
+							:title="j.lineEdgeLibraryCode"
+							width="200"
+							trigger="hover">
+							<div class="point" />
+							托盘编码: {{ j.trayCode }}
+							<br />
+							<div class="point" />
+							Agv地码: {{ j.agvGroundCode }}
 							<div
 								slot="reference"
 								class="hoverDiv"
@@ -67,8 +107,11 @@
 						:title="j.lineEdgeLibraryCode"
 						width="200"
 						trigger="hover">
-              <div class="point"/>托盘编码: {{ j.trayCode }}<br/>
+						<div class="point" />
-              <div class="point"/>Agv地码: {{ j.agvGroundCode }}
+						托盘编码: {{ j.trayCode }}
+						<br />
+						<div class="point" />
+						Agv地码: {{ j.agvGroundCode }}
 						<div
 							slot="reference"
 							class="hoverDiv"
@@ -94,8 +137,11 @@
 						:title="j.lineEdgeLibraryCode"
 						width="200"
 						trigger="hover">
-              <div class="point"/>托盘编码: {{ j.trayCode }}<br/>
+						<div class="point" />
-              <div class="point"/>Agv地码: {{ j.agvGroundCode }}
+						托盘编码: {{ j.trayCode }}
+						<br />
+						<div class="point" />
+						Agv地码: {{ j.agvGroundCode }}
 						<div
 							slot="reference"
 							class="hoverDiv"
@@ -206,13 +252,13 @@ export default {
 	top: 22px;
 	right: 120px;
 }
-.point{
+.point {
-  width: 5px;
+	width: 5px;
-  height: 5px;
+	height: 5px;
-  border-radius: 50%;
+	border-radius: 50%;
-  background-color: #409EFF;
+	background-color: #409eff;
-  float: left;
+	float: left;
-  margin-top: 7px;
+	margin-top: 7px;
-  margin-right: 5px;
+	margin-right: 5px;
 }
 </style>