From f3a78b9ef7ec02b255dc52bf2b85f52c1cefa777 Mon Sep 17 00:00:00 2001
From: schangxiang@126.com <schangxiang@126.com>
Date: 周六, 14 12月 2024 16:36:08 +0800
Subject: [PATCH] 222

---
 LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/index.vue |  314 +++++++++++++++++-----------------------------------
 1 files changed, 103 insertions(+), 211 deletions(-)

diff --git a/LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/index.vue b/LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/index.vue
index 4652b77..b497832 100644
--- a/LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/index.vue
+++ b/LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/index.vue
@@ -1,6 +1,6 @@
 <template>
 	<div>
-		<el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
+		<!-- <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
 			<el-form :model="formModel" ref="queryForm" labelWidth="90">
 				<el-row>
 					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
@@ -36,39 +36,6 @@
 						</el-form-item>
 					</el-col>
 
-					<!-- 闅愯棌鐨勭瓫閫夋潯浠� -->
-					<!-- <template>
-              <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
-                <el-form-item label="閿佸畾鐘舵��:">
-                  <el-select v-model="formModel.isLocked" clearable placeholder="璇烽�夋嫨閿佸畾鐘舵��">
-                    <el-option v-for="item in isAutoEnum" :key="item.value" :label="item.title" :value="item.value" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
-
-                <el-form-item label="宸烽亾:">
-                  <el-select v-model="formModel.Lane" clearable placeholder="璇烽�夋嫨宸烽亾">
-                    <el-option v-for="item in LangEnum" :key="item.value" :label="item.title" :value="item.value" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
-                <el-form-item label="鎵�灞炴帓:">
-                  <el-select v-model="formModel.Row" clearable placeholder="璇烽�夋嫨鎵�灞炴帓">
-                    <el-option v-for="(item, index) in strorageRowEnum" :key="item" :label="`绗�${index + 1}鎺抈"
-                      :value="index + 1" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </template> -->
-					<!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
-              <el-form-item label-width="20px">
-                <el-button type="primary" icon="el-icon-search" @click="getLocationPage(2)">鏌ヨ</el-button>
-                <el-button icon="ele-Refresh" @click="() => formModel = {}"> 閲嶇疆 </el-button>
-              </el-form-item>
-            </el-col> -->
-
 					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" class="mb10">
 						<el-form-item>
 							<el-button-group style="display: flex; align-items: center">
@@ -81,145 +48,101 @@
 					</el-col>
 				</el-row>
 			</el-form>
-		</el-card>
+		</el-card> -->
 
 		<el-card class="full-table" shadow="hover" style="margin-top: 5px">
 			<div class="msi-content" style="height: calc(100vh - 200px)">
+				<!-- 缁熻鍖哄煙 -->
+				<count-view :countData="countList"></count-view>
 				<div class="box100">
 					<div v-for="(item, index) in dataList" :key="index" class="box100Inner">
-						<p class="t1">{{ item.laneNo }}#绔嬩綋搴�</p>
+						<p class="t1">{{ item.laneNo }}#鎺�</p>
 						<div class="storage-grid">
 							<div class="row rowMy0">
-								<div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex < 20">
-									<span class="textK" 
-
-                  :style="{ background: setBgColor(cell.placeStatus), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus) }"
-                  >
-										{{ cell.laneNo }}{{ cell.layerNo }}{{ cell.columnNo }}
+								<!-- <div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex < 20"> -->
+									<div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex >= 40 && cellIndex <= 60">
+									<span class="textK" :style="{ background: setBgColor(cell.placeStatus,cell.upi), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus,cell.upi) }" @click="handleClick(cell)">
+										{{ cell.placeCode }} 
 									</span>
 								</div>
 							</div>
 							<div class="row rowMy1">
 								<div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex >= 20 && cellIndex < 40">
-									<span class="textK"   :style="{ background: setBgColor(cell.placeStatus), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus) }">
-										{{ cell.laneNo }}{{ cell.layerNo }}{{ cell.columnNo }}
+									<span class="textK" :style="{ background: setBgColor(cell.placeStatus,cell.upi), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus,cell.upi) }" @click="handleClick(cell)">
+										{{ cell.placeCode }} 
 									</span>
 								</div>
 							</div>
 							<div class="row rowMy2">
-								<div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex >= 40 && cellIndex <= 60">
-									<span class="textK"   :style="{ background: setBgColor(cell.placeStatus), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus) }">
-										{{ cell.laneNo }}{{ cell.layerNo }}{{ cell.columnNo }}
+								<!-- <div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex >= 40 && cellIndex <= 60"> -->
+									<div class="cell" v-for="(cell, cellIndex) in item.data" :key="cellIndex" v-show="cellIndex < 20">
+									<span class="textK" :style="{ background: setBgColor(cell.placeStatus,cell.upi), boxShadow: '0 1px 1px' + setBgColor(cell.placeStatus,cell.upi) }" @click="handleClick(cell)">
+										<!-- {{ cell.laneNo }} -->
+										{{ cell.placeCode }} 
+										<!-- {{ cell.layerNo }}{{ cell.columnNo }} -->
 									</span>
 								</div>
 							</div>
 						</div>
 					</div>
 				</div>
-
-				<!-- <div>
-					<p>1#绔嬩綋搴�</p>
-					<div class="storage-grid">
-						閬嶅巻姣忎竴鎺�
-						<div class="row" :class="'rowMy' + rowIndex" v-for="(row, rowIndex) in storageList" :key="rowIndex">
-							閬嶅巻姣忎竴鍧�
-							<div class="cell" v-for="(cell, cellIndex) in row" :key="cellIndex">
-								{{ cell }}
-							</div>
-						</div>
-					</div>
-				</div> -->
-
-				<!-- 缁熻鍖哄煙 -->
-		 <!-- <count-view :countData="countList"></count-view>  -->
-				<!-- 搴撲綅灞曠ず -->
-				<!-- <content-view :contentData="dataList"></content-view> -->
 			</div>
 		</el-card>
+
+		<!-- 璇︽儏寮规 -->
+		<prop-detail ref="propDetailRef"></prop-detail>
 	</div>
 </template>
 <script lang="ts" setup>
-import { nextTick, onMounted, ref } from 'vue';
-//import SearchBar from '@/components/SearchBar.vue'
+import { getCurrentInstance, nextTick, onMounted, ref } from 'vue';
 import { getStorageView } from '/@/api/main/ReportCenter/storageView';
-
 import CountView from './component/CountView.vue';
 import ContentView from './component/ContentView.vue';
 import { ElMessage } from 'element-plus';
 import { handleSlectDataWmsArea } from '/@/utils/selectData';
+import PropDetail from './component/propDetail.vue';
+const { proxy }: any = getCurrentInstance(); // 璁块棶瀹炰緥涓婁笅鏂� proxy鍚屾椂鏀寔寮�鍙� 绾夸笂鐜
 
 const showAdvanceQueryUIWmsStockQuan = ref(false);
 // 鏀瑰彉楂樼骇鏌ヨ鐨勬帶浠舵樉绀虹姸鎬�
 const changeAdvanceQueryUIWmsStockQuan = () => {
 	showAdvanceQueryUIWmsStockQuan.value = !showAdvanceQueryUIWmsStockQuan.value;
 };
-//璁剧疆鑳屾櫙    姝e父 = 1,  灏佸瓨 = 2,   绂佸嚭 = 3,    绂佸叆 = 4,    閿佸畾 = 5
-const setBgColor = (type: number): string => {
+
+
+// public enum StockStatusEnum
+// {
+//     [Description("鍦ㄥ簱")]
+//     鍦ㄥ簱 = 1,
+//     [Description("宸插喕缁�")]
+//     宸插喕缁� = 2,
+
+//     [Description("榻愬寘寰呭嚭搴�")]
+//     榻愬寘寰呭嚭搴� = 3,
+
+//     [Description("浜哄伐寮哄埗寰呭嚭搴�")]
+//     浜哄伐寮哄埗寰呭嚭搴� = 4
+// }
+
+
+const setBgColor = (type: number,upi:string): string => {
 	let color = '';
+	//debugger
+	if(upi!=null){
+		color = '#2BA6FF'; //钃濊壊  鍦ㄥ簱
+		return color;
+	}
 	switch (type) {
-		case 1:
-			color = '#F18201'; //姗樿壊  姝e父
-			break;
-		case 2:
-			color = '#2BA6FF'; //钃濊壊 灏佸瓨
-			break;
-		case 3:
-			color = '#FFFF00'; //榛勮壊 绂佸嚭
-			break;
-
-		case 4:
-			color = '#A2A2A2'; //鐏拌壊 绂佸叆
-			break;
-
 		case 5:
-			color = '#FF0000'; //绾㈣壊  閿佸畾
-			break;
+		color = '#FF0000'; //绾㈣壊  宸插喕缁�
+		break;
+        default:
+		color = '#F6C285'; //姗樿壊  姝e父
+		break;
 	}
 	return color;
 };
-const LangEnum = ref([
-	// 鎵�灞炲贩閬�
-	{
-		value: '1',
-		title: '1宸烽亾',
-	},
-	{
-		value: '2',
-		title: '2宸烽亾',
-	},
-	{
-		value: '3',
-		title: '3宸烽亾',
-	},
-]);
-const isAutoEnum: any[] = [
-	{
-		title: '鍚�',
-		value: 0,
-	},
-	{
-		title: '鏄�',
-		value: 1,
-	},
-];
 
-//搴撲綅鐘舵��
-const storageStatusEnum = ref([
-	{
-		value: '0',
-		title: '绌哄簱浣�',
-	},
-	{
-		value: '1',
-		title: '绌哄鍣ㄥ簱浣�',
-	},
-	{
-		value: '2',
-		title: '鏈夎揣搴撲綅',
-	},
-]);
-
-const strorageRowEnum = ref<any>([]); // 鎵�灞炴帓
 //鍒楄〃璇锋眰鏁版嵁
 const formModel = ref({
 	Lane: '',
@@ -239,27 +162,27 @@
 //搴撲綅鍒楄〃鏁版嵁
 const dataList = ref([]);
 //缁熻鐨勬暟鎹�
-const countList = ref([
+let countList = ref([
 	{
 		type: 0,
-		title: '绌哄簱浣�:',
+		title: '鎬诲簱浣�:',
 		count: 0,
 	},
 	{
 		type: 1,
-		title: '鏈夎揣搴撲綅锛堢┖瀹瑰櫒锛�:',
+		title: '鏈夎揣搴撲綅:',
 		count: 0,
 	},
 	{
 		type: 2,
-		title: '鏈夎揣搴撲綅锛堢墿鏂欙級:',
+		title: '鏃犺揣搴撲綅:',
 		count: 0,
 	},
-	// {
-	//   type: 3,
-	//   title: '閿佸畾搴撲綅:',
-	//   count: 0
-	// },
+	{
+		type: 3,
+		title: '閿佸畾搴撲綅:',
+		count: 0,
+	},
 	// {
 	//   type: 4,
 	//   title: '绂佺敤搴撲綅:',
@@ -267,49 +190,37 @@
 	// }
 ]);
 
-// 鎸夌収琛屽垪鐩稿悓杩涜鍒嗙粍
-const sortClass = (sortData: any) => {
-	const groupBy = (array: any, f: any) => {
-		let groups = {};
-		array.forEach((o) => {
-			let group = JSON.stringify(f(o));
-			groups[group] = groups[group] || [];
-			groups[group].push(o);
-		});
-		return Object.keys(groups).map((group) => {
-			return groups[group];
-		});
-	};
-	const sorted = groupBy(sortData, (item) => {
-		return item.lane + '-' + item.column; // 杩斿洖闇�瑕佸垎缁勭殑瀵硅薄
-	});
-	return sorted;
-};
-
-// 鍒嗙粍鍓�
-// console.log(listData);
-// 鍒嗙粍鍚�
-// console.log(sortClass(listData));
-
 //搴撲綅鍥惧垪琛�
 const getLocationPage = async (param?: any) => {
-	// if (param && param == 2) {
-	//   if (formModel.value.Lane == "" && formModel.value.Row != "") {
-	//     ElMessage.warning("璇烽�夋嫨鎵�灞炲贩閬擄紒")
-	//     return
-	//   }
-	// }
-
-	// if(!formModel.value.areaCode){
-	//   ElMessage.warning("璇烽�夋嫨鎵�鍦ㄥ簱鍖猴紒")
-	//   return
-	// }
-	//璁剧疆鑳屾櫙
-	
 	var res = await getStorageView(Object.assign(formModel.value, {}));
 	if (res.data.code == 200) {
 		const { data } = res;
 		const result = data.result;
+		// 缁熻
+		var hasMaterialCount = result.filter((item: any) => item.stockStatus == 1).length || 0;
+		var noMaterialCount = result.length - hasMaterialCount;
+		countList.value = [
+			{
+				type: '',
+				title: '鎬诲簱浣�:',
+				count: result.length || 0,
+			},
+			{
+				type: 1,
+				title: '鏈夎揣搴撲綅:',
+				count: hasMaterialCount || 0,
+			},
+			{
+				type: 18,
+				title: '鏃犺揣搴撲綅:',
+				count: noMaterialCount || 0,
+			},
+			{
+				type: 2,
+				title: '閿佸畾搴撲綅:',
+				count: result.filter((item: any) => item.placeStatus == 5).length || 0,
+			},
+		];
 
 		// 鍋囪 result 鏄竴涓寘鍚涓璞$殑鏁扮粍锛屾瘡涓璞¢兘鏈� LaneNo 鍜� ColumnNo 灞炴��
 		const groupedResult = [];
@@ -360,31 +271,6 @@
 		}
 
 		dataList.value = groupedResult; // 濡傛灉瑕佸皢缁撴灉璧嬪�肩粰 dataList
-
-		// const finalResult = [];
-
-		// 鏈�缁堢粨鏋�
-
-		// ColumnNo 60
-		// result 鎸夌収LaneNo鍒嗙粍
-		// 鍐嶆寜鐓olumnNo 鍒嗙粍  绗竴缁� 20涓�  绗簩缁� 20涓�  绗笁缁� 20涓�
-
-		// dataList.value = result;
-
-		// strorageRowEnum.value = new Array(4).fill(0);
-		// countList.value[0].count = result.emptyLocation || 0;    //绌哄簱浣�
-		// countList.value[1].count = result.emptyContainerLocation || 0;   //绌哄鍣ㄥ簱浣�
-		// countList.value[2].count = result.materialLocation || 0;  //鏈夎揣搴撲綅
-		// // countList.value[3].count = result.lockedLocation || 0; //閿佸畾搴撲綅
-		// // countList.value[4].count = result.disableLocation || 0; //绂佺敤搴撲綅
-		// if (res.data.result.lanes) {
-		//   res.data.result.lanes.forEach((element: any) => {
-		//     element.rows.forEach((item: any) => {
-		//       item.rowLocations2 = sortClass(item.rowLocations)
-		//     })
-		//   });
-		// }
-		// dataList.value = res.data.result;
 	}
 };
 getLocationPage();
@@ -421,9 +307,12 @@
 		storageList.value.push(row); // 灏嗘瘡鎺掔殑搴撲綅鏁扮粍鎺ㄥ叆鎬绘暟缁�
 	}
 }
-console.log(66666666);
 
-console.log(storageList.value);
+const dialogVisible = ref(false); // 寮规鍙鎬�
+
+const handleClick = (row: any) => {
+	proxy.$refs['propDetailRef'].openDialog(row);
+};
 </script>
 <style lang="less" scoped>
 .msi-content {
@@ -433,8 +322,8 @@
 .storage-grid {
 	display: flex;
 	flex-direction: column; /* 鍨傜洿鎺掑垪姣忎竴鎺� */
-	width: 610px;
-	// border: 1px solid red;
+	width: 100%;
+	//  border: 1px solid red;
 }
 
 .row {
@@ -442,32 +331,32 @@
 }
 
 .cell {
-	border: 1px solid gray; /* 姣忎釜鏍煎瓙鐨勯粦绾� */
+	border: 1px solid #c1c1c1; /* 姣忎釜鏍煎瓙鐨勯粦绾� */
 	height: 50px; /* 姣忎釜鏍煎瓙鐨勯珮搴� */
 	display: inline-block;
 	justify-content: center;
 	align-items: center; /* 灞呬腑鏄剧ず鍐呭 */
-	width: 30px;
+	width: 50px;
 }
 
 .rowMy0 {
 	// background-color: #f9f9f9; /* 绗竴鎺掔殑鑳屾櫙鑹� */
 	div {
-		height: 120px;
+		height: 80px;
 	}
 }
 
 .rowMy1 {
 	// background-color: #eeeeee; /* 绗簩鎺掔殑鑳屾櫙鑹� */
 	div {
-		height: 50px;
+		height: 30px;
 	}
 }
 
 .rowMy2 {
 	// background-color: #dddddd; /* 绗笁鎺掔殑鑳屾櫙鑹� */
 	div {
-		height: 80px;
+		height: 50px;
 	}
 }
 
@@ -479,14 +368,17 @@
 }
 .t1 {
 	margin: 10px 0 2px 0;
+	font-size: 16px !important;
+	padding-bottom: 10px;
 }
 .textK {
 	display: flex; /* 浣跨敤 Flexbox 甯冨眬 */
 	flex-direction: column;
 	font-size: 12px;
 	text-align: center;
-  width: 100%;
-  height: 100%; 
-  color: white;
+	width: 100%;
+	height: 100%;
+	color: white;
+	cursor: pointer;
 }
 </style>

--
Gitblit v1.9.3