From 9a7521e691198a521ce383e3e8abfd4993a9d9e6 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 11:15:18 +0800
Subject: [PATCH 01/13] add CustomTrasfer

---
 .../components/CustomTransfer.vue             | 112 ++++++++++++++++++
 .../components/CustomTransferBox.vue          |  78 ++++++++++++
 .../components/ProcessBomList.vue             |  12 +-
 3 files changed, 195 insertions(+), 7 deletions(-)
 create mode 100644 src/views/extend/processFlowView/components/CustomTransfer.vue
 create mode 100644 src/views/extend/processFlowView/components/CustomTransferBox.vue

diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
new file mode 100644
index 00000000..08d0fc0d
--- /dev/null
+++ b/src/views/extend/processFlowView/components/CustomTransfer.vue
@@ -0,0 +1,112 @@
+<!-- 
+    filename: CustomTransfer.vue
+    author: liubin
+    date: 2023-11-17 10:22:28
+    description: 
+-->
+
+<template>
+	<div class="custom-transfer">
+		<CustomTransferBox key="left" class="left-ctb" title="设备列表" />
+		<div
+			class="btns"
+			style="
+				display: flex;
+				flex-direction: column;
+				gap: 12px;
+				justify-content: center;
+				align-items: center;
+			">
+			<el-button style="margin: 0">&gt;</el-button>
+			<el-button style="margin: 0" disabled>&lt;</el-button>
+		</div>
+		<CustomTransferBox key="right" class="right-ctb" title="已选BOM" />
+	</div>
+</template>
+
+<script>
+import CustomTransferBox from './CustomTransferBox.vue';
+export default {
+	name: 'CustomTransfer',
+	components: { CustomTransferBox },
+	props: ['sectionId', 'selectedBoms'],
+	data() {
+		return {
+			pageUrl: '',
+			list: [],
+			bomLoading: false,
+			queryParams: {
+				pageNo: 1,
+				pageSize: 100,
+			},
+		};
+	},
+	computed: {},
+	methods: {
+		http(url, method, payload) {
+			return this.$axios({
+				url,
+				method,
+				params: method === 'get' ? payload : null,
+				data: method !== 'get' ? payload : null,
+			});
+		},
+		// 获取设备列表
+		async getList() {
+			const res = await this.http.get(this.pageUrl, {
+				workshopSectionId: this.sectionId,
+				...this.queryParams,
+			});
+			if (res.code === 200) {
+				// this.list = res.data;
+				this.list = [
+					{ equipmentId: 1, equipmentName: '设备1' },
+					{ equipmentId: 2, equipmentName: '设备2' },
+					{ equipmentId: 3, equipmentName: '设备3' },
+				];
+			}
+		},
+		// 点击设备时获取对应的参数bom和物料bom
+		async getMaterialBom(eqId) {},
+		async getParamBom(eqId) {},
+		async handleEquipmentClick(eqItem) {
+			this.bomLoading = true;
+			eqItem.children = [];
+
+			const { code: materialCode, data: materialData } =
+				await this.getMaterialBom(eqItem.equipmentId);
+			const { code: paramCode, data: paramData } = await this.getParamBom(
+				eqItem.equipmentId
+			);
+
+			if (materialCode == 0) {
+				eqItem.children.push(...materialData);
+			}
+			if (paramCode == 0) {
+				eqItem.children.push(...paramData);
+			}
+			this.bomLoading = false;
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.custom-transfer {
+	background: '#cfc2';
+	display: flex;
+}
+
+.btns {
+	border: 1px solid #ccc;
+	padding: 10px;
+}
+
+.left-ctb {
+	flex: 1;
+}
+
+.right-ctb {
+	flex: 1;
+}
+</style>
diff --git a/src/views/extend/processFlowView/components/CustomTransferBox.vue b/src/views/extend/processFlowView/components/CustomTransferBox.vue
new file mode 100644
index 00000000..d4f9f7d2
--- /dev/null
+++ b/src/views/extend/processFlowView/components/CustomTransferBox.vue
@@ -0,0 +1,78 @@
+<!-- 
+    filename: CustomTrasferBox.vue
+    author: liubin
+    date: 2023-11-17 10:49:08
+    description: 
+-->
+
+<template>
+	<div class="custom-transfer-box">
+		<div class="ctb-header">
+			<span>
+				{{ title }}
+			</span>
+			<span>
+				<b>{{ selectedList.length }}</b>
+				/
+				<b>{{ candidateList.length }}</b>
+				项
+			</span>
+		</div>
+		<div class="ctb-main"></div>
+		<div class="ctb-footer"></div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'CustomTransferBox',
+	components: {},
+	props: {
+		title: {
+			type: String,
+			default: '',
+		},
+		candidateList: {
+			type: Array,
+			default: () => [],
+		},
+		selectedList: {
+			type: Array,
+			default: () => [],
+		},
+	},
+	data() {
+		return {};
+	},
+	computed: {},
+	methods: {},
+};
+</script>
+
+<style scoped lang="scss">
+.custom-transfer-box {
+	margin: 0 8px;
+	flex: 1;
+	border: 1px solid #ccc;
+	border-radius: 8px;
+	min-height: 240px;
+	display: flex;
+	flex-direction: column;
+}
+.ctb-header {
+	min-height: 12px;
+	padding: 12px;
+	border-bottom: 1px solid #ccc;
+	display: flex;
+	justify-content: space-between;
+}
+.ctb-main {
+	flex: 1;
+	padding: 12px;
+}
+.ctb-footer {
+	min-height: 12px;
+	padding: 12px;
+	border-top: 1px solid #ccc;
+}
+</style>
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 69bf868c..5908eba4 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -66,19 +66,17 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<el-transfer v-model="choosedEquipments" :data="eqList">
-				<!-- <span slot-scope="{ option }">
-					{{ option.key }} - {{ option.label }}
-				</span> -->
-			</el-transfer>
+			<CustomTransfer />
 		</base-dialog>
 	</section>
 </template>
 
 <script>
+import CustomTransfer from './CustomTransfer.vue';
+
 export default {
 	name: 'ProcessBom',
-	components: {},
+	components: { CustomTransfer },
 	props: {
 		currentDet: {
 			type: Object,
@@ -104,7 +102,7 @@ export default {
 				pageNo: 1,
 				pageSize: 10,
 			},
-			searchText: ''
+			searchText: '',
 		};
 	},
 	watch: {

From d3eb9d8fbc0f2fdebfd025ea5c1089c056f8b146 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 11:25:28 +0800
Subject: [PATCH 02/13] update custom-transfer

---
 .../components/CustomTransfer.vue              | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
index 08d0fc0d..9c8bb234 100644
--- a/src/views/extend/processFlowView/components/CustomTransfer.vue
+++ b/src/views/extend/processFlowView/components/CustomTransfer.vue
@@ -7,7 +7,13 @@
 
 <template>
 	<div class="custom-transfer">
-		<CustomTransferBox key="left" class="left-ctb" title="设备列表" />
+		<CustomTransferBox
+			key="left"
+			class="left-ctb"
+			title="设备列表"
+			:candidate-list="[]"
+			:selected-list="[]"
+			@selected-list-change="handleChange" />
 		<div
 			class="btns"
 			style="
@@ -20,7 +26,13 @@
 			<el-button style="margin: 0">&gt;</el-button>
 			<el-button style="margin: 0" disabled>&lt;</el-button>
 		</div>
-		<CustomTransferBox key="right" class="right-ctb" title="已选BOM" />
+		<CustomTransferBox
+			key="right"
+			class="right-ctb"
+			title="已选BOM"
+			:candidate-list="[]"
+			:selected-list="[]"
+			@selected-list-change="handleChange" />
 	</div>
 </template>
 
@@ -87,6 +99,8 @@ export default {
 			}
 			this.bomLoading = false;
 		},
+        //
+        handleChange() {}
 	},
 };
 </script>

From bb731dfcd43886ff1d73c4f4f5172a939f8eb908 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 14:56:43 +0800
Subject: [PATCH 03/13] add custom tree

---
 .../components/CustomBomList.vue              | 109 ++++++++++++++++++
 .../components/CustomTransfer.vue             |   7 +-
 .../components/CustomTransferBox.vue          |  42 ++++++-
 .../processFlowView/components/CustomTree.vue |  65 +++++++++++
 4 files changed, 215 insertions(+), 8 deletions(-)
 create mode 100644 src/views/extend/processFlowView/components/CustomBomList.vue
 create mode 100644 src/views/extend/processFlowView/components/CustomTree.vue

diff --git a/src/views/extend/processFlowView/components/CustomBomList.vue b/src/views/extend/processFlowView/components/CustomBomList.vue
new file mode 100644
index 00000000..d1243363
--- /dev/null
+++ b/src/views/extend/processFlowView/components/CustomBomList.vue
@@ -0,0 +1,109 @@
+<!-- 
+    filename: CustomBomList.vue
+    author: liubin
+    date: 2023-11-17 14:06:04
+    description: 
+-->
+
+<template>
+	<div class="custom-bom-list—wrapper">
+		<div
+			class="ct__equipment-name"
+			@click.prevent="
+				() => {
+					$emit('open', equipment.id);
+				}
+			">
+			{{ equipment.name }}
+		</div>
+		<div
+			class="ct__bom-list"
+			:class="{ hidden: active && bomListLength > 0 ? false : true }">
+			<ul class="param-bom">
+				<li v-for="bom in equipment.paramBomList" :key="bom.name">
+					{{ bom.name }}
+				</li>
+			</ul>
+			<ul class="material-bom">
+				<li v-for="bom in equipment.materialBomList" :key="bom.name">
+					{{ bom.name }}
+				</li>
+			</ul>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'CustomBomList',
+	components: {},
+	props: {
+		equipment: {
+			type: Object,
+			default: () => ({}),
+		},
+		active: {
+			type: Boolean,
+			default: false,
+		},
+	},
+	computed: {
+		bomListLength() {
+			return (
+				(this.equipment.paramBomList?.length || 0) +
+				(this.equipment.materialBomList?.length || 0)
+			);
+		},
+	},
+	data() {
+		return {
+			showList: false,
+		};
+	},
+	methods: {},
+};
+</script>
+
+<style scoped lang="scss">
+// .custom-bom-list—wrapper {
+//     height: auto;
+//     transition: height .2s ease-in-out;
+// }
+
+.ct__equipment-name {
+	background: #0001;
+	padding: 8px;
+	border-radius: 4px;
+	cursor: pointer;
+	transition: all 0.3s;
+
+	&:hover {
+		background: #0002;
+	}
+}
+
+.hidden {
+	display: none;
+}
+
+ul,
+li {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+}
+
+ul {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    margin-top: 4px;
+}
+
+.material-bom > li,
+.param-bom > li {
+	padding: 4px 24px;
+    background: #0001;
+    border-radius: 4px;
+}
+</style>
diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
index 9c8bb234..52498647 100644
--- a/src/views/extend/processFlowView/components/CustomTransfer.vue
+++ b/src/views/extend/processFlowView/components/CustomTransfer.vue
@@ -11,8 +11,8 @@
 			key="left"
 			class="left-ctb"
 			title="设备列表"
-			:candidate-list="[]"
-			:selected-list="[]"
+			:candidate-list="candidateList"
+			:selected-list="selectedList"
 			@selected-list-change="handleChange" />
 		<div
 			class="btns"
@@ -51,6 +51,8 @@ export default {
 				pageNo: 1,
 				pageSize: 100,
 			},
+            candidateList: [],
+            selectedList: [],
 		};
 	},
 	computed: {},
@@ -112,7 +114,6 @@ export default {
 }
 
 .btns {
-	border: 1px solid #ccc;
 	padding: 10px;
 }
 
diff --git a/src/views/extend/processFlowView/components/CustomTransferBox.vue b/src/views/extend/processFlowView/components/CustomTransferBox.vue
index d4f9f7d2..ca4a3574 100644
--- a/src/views/extend/processFlowView/components/CustomTransferBox.vue
+++ b/src/views/extend/processFlowView/components/CustomTransferBox.vue
@@ -18,15 +18,34 @@
 				项
 			</span>
 		</div>
-		<div class="ctb-main"></div>
-		<div class="ctb-footer"></div>
+		<div class="ctb-main">
+			<el-input
+				v-model="searchText"
+				placeholder="搜索"
+				style="margin-bottom: 12px; user-select: none">
+				<i slot="prefix" class="el-input__icon el-icon-search"></i>
+			</el-input>
+
+			<custom-tree />
+		</div>
+		<div class="ctb-footer">
+			<pagination
+				v-show="1"
+				style="padding: 0"
+				:total="total"
+				:page.sync="queryParams.pageNo"
+				:limit.sync="queryParams.pageSize"
+				@pagination="getList" />
+		</div>
 	</div>
 </template>
 
 <script>
+import CustomTree from './CustomTree.vue';
+
 export default {
 	name: 'CustomTransferBox',
-	components: {},
+	components: { CustomTree },
 	props: {
 		title: {
 			type: String,
@@ -42,10 +61,21 @@ export default {
 		},
 	},
 	data() {
-		return {};
+		return {
+			queryParams: {
+				pageNo: 1,
+				pageSize: 10,
+			},
+			total: 0,
+			searchText: '',
+		};
 	},
 	computed: {},
-	methods: {},
+	methods: {
+		getList() {
+			this.$emit('get-list', this.queryParams);
+		},
+	},
 };
 </script>
 
@@ -70,7 +100,9 @@ export default {
 	flex: 1;
 	padding: 12px;
 }
+
 .ctb-footer {
+	user-select: none;
 	min-height: 12px;
 	padding: 12px;
 	border-top: 1px solid #ccc;
diff --git a/src/views/extend/processFlowView/components/CustomTree.vue b/src/views/extend/processFlowView/components/CustomTree.vue
new file mode 100644
index 00000000..ecf7ee37
--- /dev/null
+++ b/src/views/extend/processFlowView/components/CustomTree.vue
@@ -0,0 +1,65 @@
+<!-- 
+    filename: CustomTree.vue
+    author: liubin
+    date: 2023-11-17 13:53:16
+    description: 
+-->
+
+<template>
+	<div class="custom-tree">
+		<div v-for="n in 5" :key="n">
+			<CustomBomList
+				@open="closeOthers"
+				:active="activeId == n"
+				:equipment="{
+					id: n,
+					name: '设备' + n,
+					paramBomList: [
+						{ name: '参数BOM1', type: 'param', id: 1 },
+						{ name: '参数BOM2', type: 'param', id: 2 },
+						{ name: '参数BOM3', type: 'param', id: 3 },
+						{ name: '参数BOM4', type: 'param', id: 4 },
+						{ name: '参数BOM5', type: 'param', id: 5 },
+					],
+					materialBomList: [
+						{ name: '物料BOM1', type: 'material', id: 1 },
+						{ name: '物料BOM2', type: 'material', id: 2 },
+						{ name: '物料BOM3', type: 'material', id: 3 },
+						{ name: '物料BOM4', type: 'material', id: 4 },
+						{ name: '物料BOM5', type: 'material', id: 5 },
+					],
+				}" />
+		</div>
+	</div>
+</template>
+
+<script>
+import CustomBomList from './CustomBomList.vue';
+
+export default {
+	name: 'CustomTree',
+	components: { CustomBomList },
+	props: {},
+	data() {
+		return {
+			showList: false,
+			activeId: null,
+		};
+	},
+	computed: {},
+	methods: {
+		closeOthers(id) {
+			this.activeId = id;
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.custom-tree {
+	// background: #0001;
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+}
+</style>

From 76f5385140db08e835f5733553ffbef5f17e5bac Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 16:05:57 +0800
Subject: [PATCH 04/13] add Candidate

---
 .../components/CustomBomList.vue              | 16 +++--
 .../components/CustomTransfer.vue             | 66 +++++++++++++++++--
 .../components/CustomTransferBox.vue          |  2 +-
 .../processFlowView/components/CustomTree.vue | 30 +++------
 .../processFlowView/components/candidate.js   | 43 ++++++++++++
 5 files changed, 124 insertions(+), 33 deletions(-)
 create mode 100644 src/views/extend/processFlowView/components/candidate.js

diff --git a/src/views/extend/processFlowView/components/CustomBomList.vue b/src/views/extend/processFlowView/components/CustomBomList.vue
index d1243363..5f25fadb 100644
--- a/src/views/extend/processFlowView/components/CustomBomList.vue
+++ b/src/views/extend/processFlowView/components/CustomBomList.vue
@@ -18,7 +18,9 @@
 		</div>
 		<div
 			class="ct__bom-list"
-			:class="{ hidden: active && bomListLength > 0 ? false : true }">
+			:class="{
+				hidden: active && bomListLength > 0 ? false : true,
+			}">
 			<ul class="param-bom">
 				<li v-for="bom in equipment.paramBomList" :key="bom.name">
 					{{ bom.name }}
@@ -94,16 +96,16 @@ li {
 }
 
 ul {
-    display: flex;
-    flex-direction: column;
-    gap: 4px;
-    margin-top: 4px;
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+	margin-top: 4px;
 }
 
 .material-bom > li,
 .param-bom > li {
 	padding: 4px 24px;
-    background: #0001;
-    border-radius: 4px;
+	background: #0001;
+	border-radius: 4px;
 }
 </style>
diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
index 52498647..7d78ee22 100644
--- a/src/views/extend/processFlowView/components/CustomTransfer.vue
+++ b/src/views/extend/processFlowView/components/CustomTransfer.vue
@@ -51,8 +51,66 @@ export default {
 				pageNo: 1,
 				pageSize: 100,
 			},
-            candidateList: [],
-            selectedList: [],
+			candidate: {
+				total: 0,
+				tree: [
+					{
+						id: 1,
+						name: '设备1',
+						paramBomList: [
+							{ name: '参数BOM1', type: 'param', id: 1 },
+							{ name: '参数BOM2', type: 'param', id: 2 },
+							{ name: '参数BOM3', type: 'param', id: 3 },
+							{ name: '参数BOM4', type: 'param', id: 4 },
+							{ name: '参数BOM5', type: 'param', id: 5 },
+						],
+						materialBomList: [
+							{ name: '物料BOM1', type: 'material', id: 1 },
+							{ name: '物料BOM2', type: 'material', id: 2 },
+							{ name: '物料BOM3', type: 'material', id: 3 },
+							{ name: '物料BOM4', type: 'material', id: 4 },
+							{ name: '物料BOM5', type: 'material', id: 5 },
+						],
+					},
+					{
+						id: 2,
+						name: '设备2',
+						paramBomList: [
+							{ name: '参数BOM1', type: 'param', id: 1 },
+							{ name: '参数BOM2', type: 'param', id: 2 },
+							{ name: '参数BOM3', type: 'param', id: 3 },
+							{ name: '参数BOM4', type: 'param', id: 4 },
+							{ name: '参数BOM5', type: 'param', id: 5 },
+						],
+						materialBomList: [
+							{ name: '物料BOM1', type: 'material', id: 1 },
+							{ name: '物料BOM2', type: 'material', id: 2 },
+							{ name: '物料BOM3', type: 'material', id: 3 },
+							{ name: '物料BOM4', type: 'material', id: 4 },
+							{ name: '物料BOM5', type: 'material', id: 5 },
+						],
+					},
+					{
+						id: 3,
+						name: '设备3',
+						paramBomList: [
+							{ name: '参数BOM1', type: 'param', id: 1 },
+							{ name: '参数BOM2', type: 'param', id: 2 },
+							{ name: '参数BOM3', type: 'param', id: 3 },
+							{ name: '参数BOM4', type: 'param', id: 4 },
+							{ name: '参数BOM5', type: 'param', id: 5 },
+						],
+						materialBomList: [
+							{ name: '物料BOM1', type: 'material', id: 1 },
+							{ name: '物料BOM2', type: 'material', id: 2 },
+							{ name: '物料BOM3', type: 'material', id: 3 },
+							{ name: '物料BOM4', type: 'material', id: 4 },
+							{ name: '物料BOM5', type: 'material', id: 5 },
+						],
+					},
+				],
+			},
+			selectedList: [],
 		};
 	},
 	computed: {},
@@ -101,8 +159,8 @@ export default {
 			}
 			this.bomLoading = false;
 		},
-        //
-        handleChange() {}
+		//
+		handleChange() {},
 	},
 };
 </script>
diff --git a/src/views/extend/processFlowView/components/CustomTransferBox.vue b/src/views/extend/processFlowView/components/CustomTransferBox.vue
index ca4a3574..95098dee 100644
--- a/src/views/extend/processFlowView/components/CustomTransferBox.vue
+++ b/src/views/extend/processFlowView/components/CustomTransferBox.vue
@@ -26,7 +26,7 @@
 				<i slot="prefix" class="el-input__icon el-icon-search"></i>
 			</el-input>
 
-			<custom-tree />
+			<custom-tree :raw-data="candidateList" />
 		</div>
 		<div class="ctb-footer">
 			<pagination
diff --git a/src/views/extend/processFlowView/components/CustomTree.vue b/src/views/extend/processFlowView/components/CustomTree.vue
index ecf7ee37..6fd4e3e7 100644
--- a/src/views/extend/processFlowView/components/CustomTree.vue
+++ b/src/views/extend/processFlowView/components/CustomTree.vue
@@ -7,28 +7,11 @@
 
 <template>
 	<div class="custom-tree">
-		<div v-for="n in 5" :key="n">
+		<div v-for="equipment in rawData" :key="eq.id">
 			<CustomBomList
 				@open="closeOthers"
-				:active="activeId == n"
-				:equipment="{
-					id: n,
-					name: '设备' + n,
-					paramBomList: [
-						{ name: '参数BOM1', type: 'param', id: 1 },
-						{ name: '参数BOM2', type: 'param', id: 2 },
-						{ name: '参数BOM3', type: 'param', id: 3 },
-						{ name: '参数BOM4', type: 'param', id: 4 },
-						{ name: '参数BOM5', type: 'param', id: 5 },
-					],
-					materialBomList: [
-						{ name: '物料BOM1', type: 'material', id: 1 },
-						{ name: '物料BOM2', type: 'material', id: 2 },
-						{ name: '物料BOM3', type: 'material', id: 3 },
-						{ name: '物料BOM4', type: 'material', id: 4 },
-						{ name: '物料BOM5', type: 'material', id: 5 },
-					],
-				}" />
+				:active="activeId == eq.id"
+				:equipment="equipment" />
 		</div>
 	</div>
 </template>
@@ -39,7 +22,12 @@ import CustomBomList from './CustomBomList.vue';
 export default {
 	name: 'CustomTree',
 	components: { CustomBomList },
-	props: {},
+	props: {
+		rawData: {
+			type: Array,
+			default: () => [],
+		},
+	},
 	data() {
 		return {
 			showList: false,
diff --git a/src/views/extend/processFlowView/components/candidate.js b/src/views/extend/processFlowView/components/candidate.js
new file mode 100644
index 00000000..564e2335
--- /dev/null
+++ b/src/views/extend/processFlowView/components/candidate.js
@@ -0,0 +1,43 @@
+export class Candidate {
+	constructor(id, name, paramBomList, materialBomList) {
+		this.equipmentId = id;
+		this.equipmentName = name;
+		this.children = [];
+		this.totalBom = paramBomList.length + materialBomList.length;
+		this.selected = false;
+		paramBomList.forEach((pb) => {
+			this.children.push({
+				id: pb.id,
+				name: pb.name,
+				type: 'param',
+				selected: false,
+			});
+		});
+		materialBomList.forEach((mb) => {
+			this.children.push({
+				id: mb.id,
+				name: mb.name,
+				type: 'material',
+				selected: false,
+			});
+		});
+	}
+
+	get selected() {
+		return this.children.filter((child) => child.selected).length;
+	}
+}
+
+export class CandidateList {
+	constructor() {
+		this.value = [];
+	}
+
+	addCandidate(candidate) {
+		this.value.push(candidate);
+	}
+
+	get selected() {
+		return this.list.filter((candidate) => candidate.selected).length;
+	}
+}

From 7249abf5b1425e2a79b2461e2ad0176d337a004f Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 16:48:00 +0800
Subject: [PATCH 05/13] add BomSelector

---
 .../components/BomSelector.vue                | 123 ++++++++++++++++++
 .../components/CustomTransfer.vue             |  60 +--------
 .../components/ProcessBomList.vue             |   7 +-
 .../processFlowView/components/candidate.js   |   8 ++
 4 files changed, 137 insertions(+), 61 deletions(-)
 create mode 100644 src/views/extend/processFlowView/components/BomSelector.vue

diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
new file mode 100644
index 00000000..cdd9a160
--- /dev/null
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -0,0 +1,123 @@
+<!-- 
+    filename: BomSelector.vue
+    author: liubin
+    date: 2023-11-17 16:23:28
+    description: 
+-->
+
+<template>
+	<div class="bom-selector">
+		<el-row>
+			<el-col :span="8">
+				<el-input
+					v-model="searchText"
+					placeholder="搜索"
+					style="margin-bottom: 12px; user-select: none">
+					<i slot="prefix" class="el-input__icon el-icon-search"></i>
+				</el-input>
+			</el-col>
+		</el-row>
+
+		<el-row style="border: 1px solid #ccc">
+			<el-col :span="8">
+				<div class="select-list">
+					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
+						<span style="">可分配设备</span>
+						<span>1/24</span>
+					</div>
+					<el-checkbox-group v-model="selectedEquipments" class="sl__body">
+						<el-checkbox
+							v-for="n in 10"
+							:key="n"
+							:label="'设备' + n"
+                            :true-label="n"
+							class="sl__body-item"></el-checkbox>
+					</el-checkbox-group>
+				</div>
+			</el-col>
+			<el-col :span="8" style="border-left: 1px solid #ccc">
+				<div class="select-list">
+					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
+						<span style="">物料BOM</span>
+					</div>
+					<el-checkbox-group v-model="selectedMBom" class="sl__body">
+						<el-checkbox
+							v-for="n in 10"
+							:key="n"
+							class="sl__body-item"></el-checkbox>
+					</el-checkbox-group>
+				</div>
+			</el-col>
+			<el-col :span="8" style="border-left: 1px solid #ccc">
+				<div class="select-list">
+					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
+						<span style="">参数BOM</span>
+					</div>
+					<el-checkbox-group v-model="selectedPBom" class="sl__body">
+						<el-checkbox
+							v-for="n in 10"
+							:key="n"
+							class="sl__body-item"></el-checkbox>
+					</el-checkbox-group>
+				</div>
+			</el-col>
+		</el-row>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'BomSelector',
+	components: {},
+	props: {},
+	data() {
+		return {
+			searchText: '',
+			selectedEquipments: [],
+			selectedMBom: [],
+			selectedPBom: [],
+		};
+	},
+    watch: {
+        selectedEquipments: {
+            handler(val) {
+                console.log(val);
+            },
+            deep: true,
+        },
+    },
+	computed: {},
+	methods: {},
+};
+</script>
+
+<style scoped lang="scss">
+.bom-selector {
+	min-height: 200px;
+}
+
+.select-list {
+}
+
+.sl__body {
+	display: flex;
+	flex-direction: column;
+	gap: 6px;
+	padding: 6px;
+    
+	> .el-checkbox {
+        margin: 0;
+        padding: 3px 6px;
+		border-radius: 4px;
+        transition: background 0.3s ease-in-out;
+
+		&:hover {
+			background: #0001;
+		}
+	}
+}
+
+.sl__header {
+    border-bottom: 1px solid #ccc;
+}
+</style>
diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
index 7d78ee22..173c6c5a 100644
--- a/src/views/extend/processFlowView/components/CustomTransfer.vue
+++ b/src/views/extend/processFlowView/components/CustomTransfer.vue
@@ -51,65 +51,7 @@ export default {
 				pageNo: 1,
 				pageSize: 100,
 			},
-			candidate: {
-				total: 0,
-				tree: [
-					{
-						id: 1,
-						name: '设备1',
-						paramBomList: [
-							{ name: '参数BOM1', type: 'param', id: 1 },
-							{ name: '参数BOM2', type: 'param', id: 2 },
-							{ name: '参数BOM3', type: 'param', id: 3 },
-							{ name: '参数BOM4', type: 'param', id: 4 },
-							{ name: '参数BOM5', type: 'param', id: 5 },
-						],
-						materialBomList: [
-							{ name: '物料BOM1', type: 'material', id: 1 },
-							{ name: '物料BOM2', type: 'material', id: 2 },
-							{ name: '物料BOM3', type: 'material', id: 3 },
-							{ name: '物料BOM4', type: 'material', id: 4 },
-							{ name: '物料BOM5', type: 'material', id: 5 },
-						],
-					},
-					{
-						id: 2,
-						name: '设备2',
-						paramBomList: [
-							{ name: '参数BOM1', type: 'param', id: 1 },
-							{ name: '参数BOM2', type: 'param', id: 2 },
-							{ name: '参数BOM3', type: 'param', id: 3 },
-							{ name: '参数BOM4', type: 'param', id: 4 },
-							{ name: '参数BOM5', type: 'param', id: 5 },
-						],
-						materialBomList: [
-							{ name: '物料BOM1', type: 'material', id: 1 },
-							{ name: '物料BOM2', type: 'material', id: 2 },
-							{ name: '物料BOM3', type: 'material', id: 3 },
-							{ name: '物料BOM4', type: 'material', id: 4 },
-							{ name: '物料BOM5', type: 'material', id: 5 },
-						],
-					},
-					{
-						id: 3,
-						name: '设备3',
-						paramBomList: [
-							{ name: '参数BOM1', type: 'param', id: 1 },
-							{ name: '参数BOM2', type: 'param', id: 2 },
-							{ name: '参数BOM3', type: 'param', id: 3 },
-							{ name: '参数BOM4', type: 'param', id: 4 },
-							{ name: '参数BOM5', type: 'param', id: 5 },
-						],
-						materialBomList: [
-							{ name: '物料BOM1', type: 'material', id: 1 },
-							{ name: '物料BOM2', type: 'material', id: 2 },
-							{ name: '物料BOM3', type: 'material', id: 3 },
-							{ name: '物料BOM4', type: 'material', id: 4 },
-							{ name: '物料BOM5', type: 'material', id: 5 },
-						],
-					},
-				],
-			},
+			candidate: [],
 			selectedList: [],
 		};
 	},
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 5908eba4..1667dc7d 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -63,20 +63,23 @@
 		<base-dialog
 			dialogTitle="选择设备"
 			:dialogVisible="open"
+			width="45%"
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<CustomTransfer />
+			<!-- <CustomTransfer /> -->
+			<BomSelector />
 		</base-dialog>
 	</section>
 </template>
 
 <script>
 import CustomTransfer from './CustomTransfer.vue';
+import BomSelector from './BomSelector.vue';
 
 export default {
 	name: 'ProcessBom',
-	components: { CustomTransfer },
+	components: { BomSelector },
 	props: {
 		currentDet: {
 			type: Object,
diff --git a/src/views/extend/processFlowView/components/candidate.js b/src/views/extend/processFlowView/components/candidate.js
index 564e2335..76329c90 100644
--- a/src/views/extend/processFlowView/components/candidate.js
+++ b/src/views/extend/processFlowView/components/candidate.js
@@ -26,6 +26,14 @@ export class Candidate {
 	get selected() {
 		return this.children.filter((child) => child.selected).length;
 	}
+
+	get paramBom() {
+		return this.children.filter((child) => child.type === 'param');
+	}
+
+	get materialBom() {
+		return this.children.filter((child) => child.type === 'material');
+	}
 }
 
 export class CandidateList {

From 8ddef0de9d9a92336ac1cce68306ef4836d2a544 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 17 Nov 2023 17:07:52 +0800
Subject: [PATCH 06/13] update bomselector

---
 .../components/BomSelector.vue                | 62 +++++++++++++------
 1 file changed, 42 insertions(+), 20 deletions(-)

diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index cdd9a160..903a9154 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -18,7 +18,7 @@
 			</el-col>
 		</el-row>
 
-		<el-row style="border: 1px solid #ccc">
+		<el-row style="border: 1px solid #ccc; display: flex;">
 			<el-col :span="8">
 				<div class="select-list">
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
@@ -30,19 +30,19 @@
 							v-for="n in 10"
 							:key="n"
 							:label="'设备' + n"
-                            :true-label="n"
+							@change="() => handleChange(n)"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
 				</div>
 			</el-col>
-			<el-col :span="8" style="border-left: 1px solid #ccc">
+			<el-col :span="8" style="border-left: 1px solid #ccc;">
 				<div class="select-list">
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">物料BOM</span>
 					</div>
 					<el-checkbox-group v-model="selectedMBom" class="sl__body">
 						<el-checkbox
-							v-for="n in 10"
+							v-for="n in materialBomList"
 							:key="n"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
@@ -55,7 +55,7 @@
 					</div>
 					<el-checkbox-group v-model="selectedPBom" class="sl__body">
 						<el-checkbox
-							v-for="n in 10"
+							v-for="n in paramBomList"
 							:key="n"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
@@ -64,7 +64,7 @@
 		</el-row>
 	</div>
 </template>
-
+;
 <script>
 export default {
 	name: 'BomSelector',
@@ -76,18 +76,40 @@ export default {
 			selectedEquipments: [],
 			selectedMBom: [],
 			selectedPBom: [],
+			selected: [],
+            materialBomList: [],
+            paramBomList: [],
 		};
 	},
-    watch: {
-        selectedEquipments: {
-            handler(val) {
-                console.log(val);
-            },
-            deep: true,
-        },
-    },
+	watch: {
+		selected: {
+			handler(val) {
+				console.log(val);
+			},
+			deep: true,
+		},
+	},
 	computed: {},
-	methods: {},
+	methods: {
+		handleChange(id) {
+            this.materialBomList = [];
+            this.paramBomList = [];
+			this.selected.push({
+				id: id,
+			});
+		},
+		handleBomChange(eqId, id, type) {
+			const record = this.selected.find((item) => item.id === eqId);
+			if (record) {
+				record[type == 'param' ? 'paramBomId' : 'materialBomId'] = id;
+			} else {
+				this.selected.push({
+					id: eqId,
+					[type == 'param' ? 'paramBomId' : 'materialBomId']: id,
+				});
+			}
+		},
+	},
 };
 </script>
 
@@ -104,12 +126,12 @@ export default {
 	flex-direction: column;
 	gap: 6px;
 	padding: 6px;
-    
+
 	> .el-checkbox {
-        margin: 0;
-        padding: 3px 6px;
+		margin: 0;
+		padding: 3px 6px;
 		border-radius: 4px;
-        transition: background 0.3s ease-in-out;
+		transition: background 0.3s ease-in-out;
 
 		&:hover {
 			background: #0001;
@@ -118,6 +140,6 @@ export default {
 }
 
 .sl__header {
-    border-bottom: 1px solid #ccc;
+	border-bottom: 1px solid #ccc;
 }
 </style>

From 44452f2e8983954c878d46f08c1670f444953ccd Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Mon, 20 Nov 2023 11:26:27 +0800
Subject: [PATCH 07/13] update

---
 .env.dev                                      |   4 +-
 .../components/BomSelector.vue                | 138 +++++++++++++-----
 .../components/ProcessBomList.vue             |  29 +++-
 3 files changed, 134 insertions(+), 37 deletions(-)

diff --git a/.env.dev b/.env.dev
index 5e7d20c9..72b44389 100644
--- a/.env.dev
+++ b/.env.dev
@@ -12,8 +12,8 @@ ENV = 'development'
 VUE_APP_TITLE = MES系统
 
 # 芋道管理系统/开发环境
-VUE_APP_BASE_API = 'http://100.64.0.26:48082'
-# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
+# VUE_APP_BASE_API = 'http://100.64.0.26:48082'
+VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 # VUE_APP_BASE_API = 'http://192.168.4.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.2.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.49:48080'
diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index 903a9154..4718abbc 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -18,32 +18,43 @@
 			</el-col>
 		</el-row>
 
-		<el-row style="border: 1px solid #ccc; display: flex;">
+		<el-row style="border: 1px solid #ccc; display: flex">
 			<el-col :span="8">
 				<div class="select-list">
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">可分配设备</span>
-						<span>1/24</span>
+						<span>{{ selectedEquipments.length }}/{{ bomList.length }}</span>
 					</div>
 					<el-checkbox-group v-model="selectedEquipments" class="sl__body">
 						<el-checkbox
-							v-for="n in 10"
-							:key="n"
-							:label="'设备' + n"
-							@change="() => handleChange(n)"
+							v-for="eq in bomList"
+							:key="eq.id"
+							:label="`${eq.name} (${
+								selectedMBom[currentEquipment].length +
+								selectedPBom[currentEquipment].length
+							} / 2)`"
+							@change="(e) => handleEquipmentChange(eq, e)"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
 				</div>
 			</el-col>
-			<el-col :span="8" style="border-left: 1px solid #ccc;">
+			<el-col :span="8" style="border-left: 1px solid #ccc">
 				<div class="select-list">
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">物料BOM</span>
 					</div>
-					<el-checkbox-group v-model="selectedMBom" class="sl__body">
+					<el-checkbox-group
+						v-model="selectedMBom[currentEquipment]"
+						class="sl__body">
 						<el-checkbox
-							v-for="n in materialBomList"
-							:key="n"
+							v-for="mb in materialsBomList"
+							:key="mb.id"
+							:label="mb.name"
+							:disabled="mb.disabled || false"
+							@change="
+								(e) =>
+									handleMaterialBomChange(mb, materialsBomList.equipmentId, e)
+							"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
 				</div>
@@ -53,10 +64,17 @@
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">参数BOM</span>
 					</div>
-					<el-checkbox-group v-model="selectedPBom" class="sl__body">
+					<el-checkbox-group
+						v-model="selectedPBom[currentEquipment]"
+						class="sl__body">
 						<el-checkbox
-							v-for="n in paramBomList"
-							:key="n"
+							v-for="vb in valuesBomList"
+							:key="vb.id"
+							:label="vb.name"
+							:disabled="vb.disabled || false"
+							@change="
+								(e) => handleValueBomChange(vb, valuesBomList.equipmentId, e)
+							"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
 				</div>
@@ -69,16 +87,22 @@
 export default {
 	name: 'BomSelector',
 	components: {},
-	props: {},
+	props: {
+		bomList: {
+			type: Array,
+			default: () => [],
+		},
+	},
 	data() {
 		return {
 			searchText: '',
 			selectedEquipments: [],
-			selectedMBom: [],
-			selectedPBom: [],
+			selectedMBom: { default: [] },
+			selectedPBom: { default: [] },
 			selected: [],
-            materialBomList: [],
-            paramBomList: [],
+			materialsBomList: [],
+			valuesBomList: [],
+			currentEquipment: 'default',
 		};
 	},
 	watch: {
@@ -90,24 +114,72 @@ export default {
 		},
 	},
 	computed: {},
+	created() {},
+	mounted() {
+		// 准备v-model
+		this.bomList.forEach((item) => {
+			this.$set(this.selectedMBom, item.id, []);
+			this.$set(this.selectedPBom, item.id, []);
+		});
+	},
 	methods: {
-		handleChange(id) {
-            this.materialBomList = [];
-            this.paramBomList = [];
-			this.selected.push({
-				id: id,
+		handleEquipmentChange(eq, selected) {
+			this.currentEquipment = eq.id;
+			this.materialsBomList =
+				// [
+				// 	{
+				// 		id: 1,
+				// 		name: 'mb-1',
+				// 	},
+				// 	{
+				// 		id: 2,
+				// 		name: 'mb-2',
+				// 	},
+				// 	{
+				// 		id: 3,
+				// 		name: 'mb-3',
+				// 	},
+				// ] ||
+				eq.materialsBom || [];
+			this.valuesBomList = eq.valuesBom || [];
+			// 重新确保equipmentId已经被加载上去了
+			this.materialsBomList.equipmentId = eq.id;
+			this.valuesBomList.equipmentId = eq.id;
+
+			console.log('eq', selected, eq, this.selectedEquipments);
+			if (selected) {
+				this.selected.push({
+					equipmentId: eq.id,
+					equValueBomId: null,
+					equMaterialBomId: null,
+				});
+			} else {
+				// 清空选择状态
+				this.selected = this.selected.filter(
+					(item) => item.equipmentId !== eq.id
+				);
+				this.selectedMBom[eq.id] = [];
+				this.selectedPBom[eq.id] = [];
+			}
+		},
+		handleValueBomChange(vb, equipmentId, selected) {
+			const selectedItem = this.selected.find(
+				(item) => item.equipmentId == equipmentId
+			);
+			selectedItem.equValueBomId = selected ? vb.id : null;
+			this.valuesBomList.forEach((item) => {
+				item.disabled = selected ? item.id !== vb.id : false;
 			});
 		},
-		handleBomChange(eqId, id, type) {
-			const record = this.selected.find((item) => item.id === eqId);
-			if (record) {
-				record[type == 'param' ? 'paramBomId' : 'materialBomId'] = id;
-			} else {
-				this.selected.push({
-					id: eqId,
-					[type == 'param' ? 'paramBomId' : 'materialBomId']: id,
-				});
-			}
+		handleMaterialBomChange(mb, equipmentId, selected) {
+			debugger;
+			const selectedItem = this.selected.find(
+				(item) => item.equipmentId == equipmentId
+			);
+			selectedItem.equMaterialBomId = selected ? mb.id : null;
+			this.materialsBomList.forEach((item) => {
+				item.disabled = selected ? item.id !== mb.id : false;
+			});
 		},
 	},
 };
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 1667dc7d..9ecdc8dd 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -68,7 +68,7 @@
 			@cancel="cancel"
 			@confirm="submitForm">
 			<!-- <CustomTransfer /> -->
-			<BomSelector />
+			<BomSelector :bom-list="bomList" />
 		</base-dialog>
 	</section>
 </template>
@@ -90,6 +90,7 @@ export default {
 		return {
 			open: false,
 			eqList: [],
+			bomList: [],
 			finalList: [],
 			choosedEquipments: [],
 			searchBarFormConfig: [{ label: '工序下设备' }],
@@ -111,6 +112,7 @@ export default {
 	watch: {
 		currentDet: {
 			handler(val) {
+				console.log('currentDet', val);
 				if (val != null) {
 					this.getList(val);
 				} else {
@@ -188,7 +190,14 @@ export default {
 			});
 		},
 		submitForm() {},
-		async getList({ detId, detName, detDesc, flowId, sectionName } = {}) {
+		async getList({
+			detId,
+			detName,
+			detDesc,
+			flowId,
+			sectionName,
+			sectionId,
+		} = {}) {
 			console.log('get list', detId, detName, flowId);
 			const { data, code } = await this.http(
 				'/extend/process-flow-det-equipment/page',
@@ -202,6 +211,22 @@ export default {
 				this.list.splice(0);
 				this.total = 0;
 			}
+
+			// 获取设备及bom列表
+			this.http(
+				'/extend/process-flow-det/getEquipmentDetBySectionId?id=' + sectionId,
+				'post'
+			).then(({ code, data }) => {
+				if (code == 0) {
+					this.bomList = data.map(eq => {
+						if (eq.materialsBom) eq.materialsBom.equipmentId = eq.id 
+						if (eq.valuesBom) eq.valuesBom.equipmentId = eq.id
+						return eq;
+					});
+				} else {
+					this.bomList.splice(0);
+				}
+			});
 		},
 		async handleAddEquipment() {
 			this.open = true;

From dd23c49ba0d581d2e9d1a594a769e5a79069bfdd Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Mon, 20 Nov 2023 14:21:14 +0800
Subject: [PATCH 08/13] =?UTF-8?q?update=20=E8=AE=BE=E5=A4=87=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/BomSelection.vue               |  84 ++++++++++++++
 .../components/BomSelector.vue                | 109 ++++--------------
 .../components/ProcessBomList.vue             |   8 +-
 3 files changed, 112 insertions(+), 89 deletions(-)
 create mode 100644 src/views/extend/processFlowView/components/BomSelection.vue

diff --git a/src/views/extend/processFlowView/components/BomSelection.vue b/src/views/extend/processFlowView/components/BomSelection.vue
new file mode 100644
index 00000000..86991023
--- /dev/null
+++ b/src/views/extend/processFlowView/components/BomSelection.vue
@@ -0,0 +1,84 @@
+<!-- 
+    filename: BomSelection.vue
+    author: liubin
+    date: 2023-11-20 13:23:36
+    description: 
+-->
+
+<template>
+	<div class="bom-selection">
+		<el-checkbox
+			v-for="item in list__inner"
+			:key="item.id"
+			:label="item.name"
+			:disabled="item.disabled"
+			@change="(e) => handleChange(item, e)"
+			class="sl__body-item"></el-checkbox>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'BomSelection',
+	components: {},
+	props: {
+		list: {
+			type: Array,
+			default: () => [],
+		},
+		equipmentId: {
+			type: String,
+			default: '',
+		},
+	},
+	data() {
+		return {
+			list__inner: [],
+			selected: '',
+		};
+	},
+	watch: {
+		list: {
+			handler(val) {
+				if (val) {
+					this.list__inner = val.map((item) => ({ ...item, disabled: false }));
+				}
+			},
+			deep: true,
+			immediate: true,
+		},
+	},
+	methods: {
+		handleChange(bomItem, selected) {
+			this.list__inner = this.list__inner.map((item) => ({
+				...item,
+				disabled: selected ? item.id !== bomItem.id : false,
+			}));
+			this.$emit('change', this.equipmentId, bomItem.id, selected);
+			this.$nextTick(() => {
+				this.$forceUpdate();
+			});
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.bom-selection {
+	display: flex;
+	flex-direction: column;
+	gap: 6px;
+	padding: 6px;
+}
+
+.sl__body-item {
+	margin: 0;
+	padding: 3px 6px;
+	border-radius: 4px;
+	transition: background 0.3s ease-in-out;
+
+	&:hover {
+		background: #0001;
+	}
+}
+</style>
diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index 4718abbc..39ab1710 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -29,10 +29,7 @@
 						<el-checkbox
 							v-for="eq in bomList"
 							:key="eq.id"
-							:label="`${eq.name} (${
-								selectedMBom[currentEquipment].length +
-								selectedPBom[currentEquipment].length
-							} / 2)`"
+							:label="eq.name"
 							@change="(e) => handleEquipmentChange(eq, e)"
 							class="sl__body-item"></el-checkbox>
 					</el-checkbox-group>
@@ -43,20 +40,12 @@
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">物料BOM</span>
 					</div>
-					<el-checkbox-group
-						v-model="selectedMBom[currentEquipment]"
-						class="sl__body">
-						<el-checkbox
-							v-for="mb in materialsBomList"
-							:key="mb.id"
-							:label="mb.name"
-							:disabled="mb.disabled || false"
-							@change="
-								(e) =>
-									handleMaterialBomChange(mb, materialsBomList.equipmentId, e)
-							"
-							class="sl__body-item"></el-checkbox>
-					</el-checkbox-group>
+
+					<BomSelection
+						key="materialsBomList"
+						:list="materialsBomList"
+						:equipment-id="materialsBomList.equipmentId"
+						@change="handleMaterialBomChange" />
 				</div>
 			</el-col>
 			<el-col :span="8" style="border-left: 1px solid #ccc">
@@ -64,19 +53,12 @@
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">参数BOM</span>
 					</div>
-					<el-checkbox-group
-						v-model="selectedPBom[currentEquipment]"
-						class="sl__body">
-						<el-checkbox
-							v-for="vb in valuesBomList"
-							:key="vb.id"
-							:label="vb.name"
-							:disabled="vb.disabled || false"
-							@change="
-								(e) => handleValueBomChange(vb, valuesBomList.equipmentId, e)
-							"
-							class="sl__body-item"></el-checkbox>
-					</el-checkbox-group>
+
+					<BomSelection
+						key="valuesBomList"
+						:list="valuesBomList"
+						:equipment-id="valuesBomList.equipmentId"
+						@change="handleValueBomChange" />
 				</div>
 			</el-col>
 		</el-row>
@@ -84,9 +66,10 @@
 </template>
 ;
 <script>
+import BomSelection from './BomSelection.vue';
 export default {
 	name: 'BomSelector',
-	components: {},
+	components: { BomSelection },
 	props: {
 		bomList: {
 			type: Array,
@@ -97,56 +80,17 @@ export default {
 		return {
 			searchText: '',
 			selectedEquipments: [],
-			selectedMBom: { default: [] },
-			selectedPBom: { default: [] },
 			selected: [],
 			materialsBomList: [],
 			valuesBomList: [],
-			currentEquipment: 'default',
 		};
 	},
-	watch: {
-		selected: {
-			handler(val) {
-				console.log(val);
-			},
-			deep: true,
-		},
-	},
-	computed: {},
-	created() {},
-	mounted() {
-		// 准备v-model
-		this.bomList.forEach((item) => {
-			this.$set(this.selectedMBom, item.id, []);
-			this.$set(this.selectedPBom, item.id, []);
-		});
-	},
 	methods: {
 		handleEquipmentChange(eq, selected) {
 			this.currentEquipment = eq.id;
-			this.materialsBomList =
-				// [
-				// 	{
-				// 		id: 1,
-				// 		name: 'mb-1',
-				// 	},
-				// 	{
-				// 		id: 2,
-				// 		name: 'mb-2',
-				// 	},
-				// 	{
-				// 		id: 3,
-				// 		name: 'mb-3',
-				// 	},
-				// ] ||
-				eq.materialsBom || [];
-			this.valuesBomList = eq.valuesBom || [];
-			// 重新确保equipmentId已经被加载上去了
-			this.materialsBomList.equipmentId = eq.id;
-			this.valuesBomList.equipmentId = eq.id;
+			this.materialsBomList = eq.materialsBom;
+			this.valuesBomList = eq.valuesBom;
 
-			console.log('eq', selected, eq, this.selectedEquipments);
 			if (selected) {
 				this.selected.push({
 					equipmentId: eq.id,
@@ -158,28 +102,21 @@ export default {
 				this.selected = this.selected.filter(
 					(item) => item.equipmentId !== eq.id
 				);
-				this.selectedMBom[eq.id] = [];
-				this.selectedPBom[eq.id] = [];
 			}
 		},
-		handleValueBomChange(vb, equipmentId, selected) {
+
+		handleMaterialBomChange(equipmentId, bomId, selected) {
 			const selectedItem = this.selected.find(
 				(item) => item.equipmentId == equipmentId
 			);
-			selectedItem.equValueBomId = selected ? vb.id : null;
-			this.valuesBomList.forEach((item) => {
-				item.disabled = selected ? item.id !== vb.id : false;
-			});
+			selectedItem.equMaterialBomId = selected ? bomId : null;
 		},
-		handleMaterialBomChange(mb, equipmentId, selected) {
-			debugger;
+
+		handleValueBomChange(equipmentId, bomId, selected) {
 			const selectedItem = this.selected.find(
 				(item) => item.equipmentId == equipmentId
 			);
-			selectedItem.equMaterialBomId = selected ? mb.id : null;
-			this.materialsBomList.forEach((item) => {
-				item.disabled = selected ? item.id !== mb.id : false;
-			});
+			selectedItem.equValueBomId = selected ? bomId : null;
 		},
 	},
 };
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 9ecdc8dd..0e4e334f 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -218,9 +218,11 @@ export default {
 				'post'
 			).then(({ code, data }) => {
 				if (code == 0) {
-					this.bomList = data.map(eq => {
-						if (eq.materialsBom) eq.materialsBom.equipmentId = eq.id 
-						if (eq.valuesBom) eq.valuesBom.equipmentId = eq.id
+					this.bomList = data.map((eq) => {
+						eq.materialsBom = eq.materialsBom || [];
+						eq.valuesBom = eq.valuesBom || [];
+						eq.materialsBom.equipmentId = eq.id;
+						eq.valuesBom.equipmentId = eq.id;
 						return eq;
 					});
 				} else {

From ac041c2f4a261206999efb7c97ae81c0d8688e64 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Mon, 20 Nov 2023 15:51:47 +0800
Subject: [PATCH 09/13] update bom-selector v1

---
 .../components/BomSelection.vue               |  27 +++-
 .../components/BomSelector.vue                |  84 +++++++++++-
 .../components/CustomBomList.vue              | 111 ---------------
 .../components/CustomTransfer.vue             | 127 ------------------
 .../components/CustomTransferBox.vue          | 110 ---------------
 .../processFlowView/components/CustomTree.vue |  53 --------
 .../components/ProcessBomList.vue             |  71 ++++------
 7 files changed, 126 insertions(+), 457 deletions(-)
 delete mode 100644 src/views/extend/processFlowView/components/CustomBomList.vue
 delete mode 100644 src/views/extend/processFlowView/components/CustomTransfer.vue
 delete mode 100644 src/views/extend/processFlowView/components/CustomTransferBox.vue
 delete mode 100644 src/views/extend/processFlowView/components/CustomTree.vue

diff --git a/src/views/extend/processFlowView/components/BomSelection.vue b/src/views/extend/processFlowView/components/BomSelection.vue
index 86991023..f5c2f02b 100644
--- a/src/views/extend/processFlowView/components/BomSelection.vue
+++ b/src/views/extend/processFlowView/components/BomSelection.vue
@@ -9,9 +9,10 @@
 	<div class="bom-selection">
 		<el-checkbox
 			v-for="item in list__inner"
-			:key="item.id"
+			:key="item.id + randomKey"
 			:label="item.name"
 			:disabled="item.disabled"
+			:checked="item.id === selected"
 			@change="(e) => handleChange(item, e)"
 			class="sl__body-item"></el-checkbox>
 	</div>
@@ -21,7 +22,15 @@
 export default {
 	name: 'BomSelection',
 	components: {},
+	// model: {
+	// 	prop: 'selected',
+	// 	event: 'update',
+	// },
 	props: {
+		// selected: {
+		// 	type: String,
+		// 	default: '',
+		// },
 		list: {
 			type: Array,
 			default: () => [],
@@ -34,7 +43,8 @@ export default {
 	data() {
 		return {
 			list__inner: [],
-			selected: '',
+			selected: null,
+            randomKey: Math.random()
 		};
 	},
 	watch: {
@@ -54,11 +64,24 @@ export default {
 				...item,
 				disabled: selected ? item.id !== bomItem.id : false,
 			}));
+
+			if (selected) this.selected = null;
+			else this.clearSelected();
+
 			this.$emit('change', this.equipmentId, bomItem.id, selected);
 			this.$nextTick(() => {
 				this.$forceUpdate();
 			});
 		},
+		clearSelected() {
+			console.log('clearSelected');
+			this.selected = null;
+            this.randomKey = Math.random()
+			// this.$emit('update', null);
+			// this.$nextTick(() => {
+			// 	this.$forceUpdate();
+			// });
+		},
 	},
 };
 </script>
diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index 39ab1710..9927f7b1 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -12,6 +12,7 @@
 				<el-input
 					v-model="searchText"
 					placeholder="搜索"
+					clearable
 					style="margin-bottom: 12px; user-select: none">
 					<i slot="prefix" class="el-input__icon el-icon-search"></i>
 				</el-input>
@@ -23,16 +24,19 @@
 				<div class="select-list">
 					<div class="sl__header" style="background: #f3f4fb; padding: 12px">
 						<span style="">可分配设备</span>
-						<span>{{ selectedEquipments.length }}/{{ bomList.length }}</span>
+						<span>
+							{{ selectedEquipments.length }}/{{ filteredBomList.length }}
+						</span>
 					</div>
-					<el-checkbox-group v-model="selectedEquipments" class="sl__body">
+					<div class="sl__body">
 						<el-checkbox
-							v-for="eq in bomList"
-							:key="eq.id"
+							v-for="eq in filteredBomList"
+							:key="eq.id + refreshKey"
 							:label="eq.name"
+							:checked="selectedEquipments.includes(eq.id)"
 							@change="(e) => handleEquipmentChange(eq, e)"
 							class="sl__body-item"></el-checkbox>
-					</el-checkbox-group>
+					</div>
 				</div>
 			</el-col>
 			<el-col :span="8" style="border-left: 1px solid #ccc">
@@ -42,6 +46,7 @@
 					</div>
 
 					<BomSelection
+						ref="materialsBomList"
 						key="materialsBomList"
 						:list="materialsBomList"
 						:equipment-id="materialsBomList.equipmentId"
@@ -55,6 +60,7 @@
 					</div>
 
 					<BomSelection
+						ref="valuesBomList"
 						key="valuesBomList"
 						:list="valuesBomList"
 						:equipment-id="valuesBomList.equipmentId"
@@ -70,11 +76,19 @@ import BomSelection from './BomSelection.vue';
 export default {
 	name: 'BomSelector',
 	components: { BomSelection },
+	model: {
+		prop: 'value',
+		event: 'update',
+	},
 	props: {
 		bomList: {
 			type: Array,
 			default: () => [],
 		},
+		value: {
+			type: Array,
+			default: () => [],
+		},
 	},
 	data() {
 		return {
@@ -83,8 +97,29 @@ export default {
 			selected: [],
 			materialsBomList: [],
 			valuesBomList: [],
+			refreshKey: Math.random(),
 		};
 	},
+	watch: {
+		value: {
+			handler(val) {
+				console.log('value', val);
+				if (val) {
+					this.selectedEquipments = val.map((item) => item.equipmentId);
+					this.selected = val;
+				}
+			},
+			deep: true,
+			immediate: true,
+		},
+	},
+	computed: {
+		filteredBomList() {
+			return this.bomList.filter((item) => {
+				return item.name.includes(this.searchText);
+			});
+		},
+	},
 	methods: {
 		handleEquipmentChange(eq, selected) {
 			this.currentEquipment = eq.id;
@@ -92,16 +127,24 @@ export default {
 			this.valuesBomList = eq.valuesBom;
 
 			if (selected) {
+				this.selectedEquipments.push(eq.id);
 				this.selected.push({
 					equipmentId: eq.id,
 					equValueBomId: null,
 					equMaterialBomId: null,
 				});
+				this.$emit('update', this.selected);
 			} else {
 				// 清空选择状态
+				this.selectedEquipments = this.selectedEquipments.filter(
+					(id) => id !== eq.id
+				);
+				this.$refs.materialsBomList.clearSelected();
+				this.$refs.valuesBomList.clearSelected();
 				this.selected = this.selected.filter(
 					(item) => item.equipmentId !== eq.id
 				);
+				this.$emit('update', this.selected);
 			}
 		},
 
@@ -109,14 +152,41 @@ export default {
 			const selectedItem = this.selected.find(
 				(item) => item.equipmentId == equipmentId
 			);
-			selectedItem.equMaterialBomId = selected ? bomId : null;
+			if (selected && !selectedItem) {
+				// 如果没找到这个
+				this.selectedEquipments.push(equipmentId);
+				this.selected.push({
+					equipmentId,
+					equValueBomId: null,
+					equMaterialBomId: bomId,
+				});
+				// 强制更新'设备'一栏
+				this.refreshKey = Math.random();
+				this.$emit('update', this.selected);
+				return;
+			}
+			selectedItem && (selectedItem.equMaterialBomId = selected ? bomId : null);
+			this.$emit('update', this.selected);
 		},
 
 		handleValueBomChange(equipmentId, bomId, selected) {
 			const selectedItem = this.selected.find(
 				(item) => item.equipmentId == equipmentId
 			);
-			selectedItem.equValueBomId = selected ? bomId : null;
+			if (selected && !selectedItem) {
+				// 如果没找到这个
+				this.selectedEquipments.push(equipmentId);
+				this.selected.push({
+					equipmentId,
+					equValueBomId: bomId,
+					equMaterialBomId: null,
+				});
+				this.refreshKey = Math.random();
+				this.$emit('update', this.selected);
+				return;
+			}
+			selectedItem && (selectedItem.equValueBomId = selected ? bomId : null);
+			this.$emit('update', this.selected);
 		},
 	},
 };
diff --git a/src/views/extend/processFlowView/components/CustomBomList.vue b/src/views/extend/processFlowView/components/CustomBomList.vue
deleted file mode 100644
index 5f25fadb..00000000
--- a/src/views/extend/processFlowView/components/CustomBomList.vue
+++ /dev/null
@@ -1,111 +0,0 @@
-<!-- 
-    filename: CustomBomList.vue
-    author: liubin
-    date: 2023-11-17 14:06:04
-    description: 
--->
-
-<template>
-	<div class="custom-bom-list—wrapper">
-		<div
-			class="ct__equipment-name"
-			@click.prevent="
-				() => {
-					$emit('open', equipment.id);
-				}
-			">
-			{{ equipment.name }}
-		</div>
-		<div
-			class="ct__bom-list"
-			:class="{
-				hidden: active && bomListLength > 0 ? false : true,
-			}">
-			<ul class="param-bom">
-				<li v-for="bom in equipment.paramBomList" :key="bom.name">
-					{{ bom.name }}
-				</li>
-			</ul>
-			<ul class="material-bom">
-				<li v-for="bom in equipment.materialBomList" :key="bom.name">
-					{{ bom.name }}
-				</li>
-			</ul>
-		</div>
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'CustomBomList',
-	components: {},
-	props: {
-		equipment: {
-			type: Object,
-			default: () => ({}),
-		},
-		active: {
-			type: Boolean,
-			default: false,
-		},
-	},
-	computed: {
-		bomListLength() {
-			return (
-				(this.equipment.paramBomList?.length || 0) +
-				(this.equipment.materialBomList?.length || 0)
-			);
-		},
-	},
-	data() {
-		return {
-			showList: false,
-		};
-	},
-	methods: {},
-};
-</script>
-
-<style scoped lang="scss">
-// .custom-bom-list—wrapper {
-//     height: auto;
-//     transition: height .2s ease-in-out;
-// }
-
-.ct__equipment-name {
-	background: #0001;
-	padding: 8px;
-	border-radius: 4px;
-	cursor: pointer;
-	transition: all 0.3s;
-
-	&:hover {
-		background: #0002;
-	}
-}
-
-.hidden {
-	display: none;
-}
-
-ul,
-li {
-	margin: 0;
-	padding: 0;
-	list-style: none;
-}
-
-ul {
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-	margin-top: 4px;
-}
-
-.material-bom > li,
-.param-bom > li {
-	padding: 4px 24px;
-	background: #0001;
-	border-radius: 4px;
-}
-</style>
diff --git a/src/views/extend/processFlowView/components/CustomTransfer.vue b/src/views/extend/processFlowView/components/CustomTransfer.vue
deleted file mode 100644
index 173c6c5a..00000000
--- a/src/views/extend/processFlowView/components/CustomTransfer.vue
+++ /dev/null
@@ -1,127 +0,0 @@
-<!-- 
-    filename: CustomTransfer.vue
-    author: liubin
-    date: 2023-11-17 10:22:28
-    description: 
--->
-
-<template>
-	<div class="custom-transfer">
-		<CustomTransferBox
-			key="left"
-			class="left-ctb"
-			title="设备列表"
-			:candidate-list="candidateList"
-			:selected-list="selectedList"
-			@selected-list-change="handleChange" />
-		<div
-			class="btns"
-			style="
-				display: flex;
-				flex-direction: column;
-				gap: 12px;
-				justify-content: center;
-				align-items: center;
-			">
-			<el-button style="margin: 0">&gt;</el-button>
-			<el-button style="margin: 0" disabled>&lt;</el-button>
-		</div>
-		<CustomTransferBox
-			key="right"
-			class="right-ctb"
-			title="已选BOM"
-			:candidate-list="[]"
-			:selected-list="[]"
-			@selected-list-change="handleChange" />
-	</div>
-</template>
-
-<script>
-import CustomTransferBox from './CustomTransferBox.vue';
-export default {
-	name: 'CustomTransfer',
-	components: { CustomTransferBox },
-	props: ['sectionId', 'selectedBoms'],
-	data() {
-		return {
-			pageUrl: '',
-			list: [],
-			bomLoading: false,
-			queryParams: {
-				pageNo: 1,
-				pageSize: 100,
-			},
-			candidate: [],
-			selectedList: [],
-		};
-	},
-	computed: {},
-	methods: {
-		http(url, method, payload) {
-			return this.$axios({
-				url,
-				method,
-				params: method === 'get' ? payload : null,
-				data: method !== 'get' ? payload : null,
-			});
-		},
-		// 获取设备列表
-		async getList() {
-			const res = await this.http.get(this.pageUrl, {
-				workshopSectionId: this.sectionId,
-				...this.queryParams,
-			});
-			if (res.code === 200) {
-				// this.list = res.data;
-				this.list = [
-					{ equipmentId: 1, equipmentName: '设备1' },
-					{ equipmentId: 2, equipmentName: '设备2' },
-					{ equipmentId: 3, equipmentName: '设备3' },
-				];
-			}
-		},
-		// 点击设备时获取对应的参数bom和物料bom
-		async getMaterialBom(eqId) {},
-		async getParamBom(eqId) {},
-		async handleEquipmentClick(eqItem) {
-			this.bomLoading = true;
-			eqItem.children = [];
-
-			const { code: materialCode, data: materialData } =
-				await this.getMaterialBom(eqItem.equipmentId);
-			const { code: paramCode, data: paramData } = await this.getParamBom(
-				eqItem.equipmentId
-			);
-
-			if (materialCode == 0) {
-				eqItem.children.push(...materialData);
-			}
-			if (paramCode == 0) {
-				eqItem.children.push(...paramData);
-			}
-			this.bomLoading = false;
-		},
-		//
-		handleChange() {},
-	},
-};
-</script>
-
-<style scoped lang="scss">
-.custom-transfer {
-	background: '#cfc2';
-	display: flex;
-}
-
-.btns {
-	padding: 10px;
-}
-
-.left-ctb {
-	flex: 1;
-}
-
-.right-ctb {
-	flex: 1;
-}
-</style>
diff --git a/src/views/extend/processFlowView/components/CustomTransferBox.vue b/src/views/extend/processFlowView/components/CustomTransferBox.vue
deleted file mode 100644
index 95098dee..00000000
--- a/src/views/extend/processFlowView/components/CustomTransferBox.vue
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- 
-    filename: CustomTrasferBox.vue
-    author: liubin
-    date: 2023-11-17 10:49:08
-    description: 
--->
-
-<template>
-	<div class="custom-transfer-box">
-		<div class="ctb-header">
-			<span>
-				{{ title }}
-			</span>
-			<span>
-				<b>{{ selectedList.length }}</b>
-				/
-				<b>{{ candidateList.length }}</b>
-				项
-			</span>
-		</div>
-		<div class="ctb-main">
-			<el-input
-				v-model="searchText"
-				placeholder="搜索"
-				style="margin-bottom: 12px; user-select: none">
-				<i slot="prefix" class="el-input__icon el-icon-search"></i>
-			</el-input>
-
-			<custom-tree :raw-data="candidateList" />
-		</div>
-		<div class="ctb-footer">
-			<pagination
-				v-show="1"
-				style="padding: 0"
-				:total="total"
-				:page.sync="queryParams.pageNo"
-				:limit.sync="queryParams.pageSize"
-				@pagination="getList" />
-		</div>
-	</div>
-</template>
-
-<script>
-import CustomTree from './CustomTree.vue';
-
-export default {
-	name: 'CustomTransferBox',
-	components: { CustomTree },
-	props: {
-		title: {
-			type: String,
-			default: '',
-		},
-		candidateList: {
-			type: Array,
-			default: () => [],
-		},
-		selectedList: {
-			type: Array,
-			default: () => [],
-		},
-	},
-	data() {
-		return {
-			queryParams: {
-				pageNo: 1,
-				pageSize: 10,
-			},
-			total: 0,
-			searchText: '',
-		};
-	},
-	computed: {},
-	methods: {
-		getList() {
-			this.$emit('get-list', this.queryParams);
-		},
-	},
-};
-</script>
-
-<style scoped lang="scss">
-.custom-transfer-box {
-	margin: 0 8px;
-	flex: 1;
-	border: 1px solid #ccc;
-	border-radius: 8px;
-	min-height: 240px;
-	display: flex;
-	flex-direction: column;
-}
-.ctb-header {
-	min-height: 12px;
-	padding: 12px;
-	border-bottom: 1px solid #ccc;
-	display: flex;
-	justify-content: space-between;
-}
-.ctb-main {
-	flex: 1;
-	padding: 12px;
-}
-
-.ctb-footer {
-	user-select: none;
-	min-height: 12px;
-	padding: 12px;
-	border-top: 1px solid #ccc;
-}
-</style>
diff --git a/src/views/extend/processFlowView/components/CustomTree.vue b/src/views/extend/processFlowView/components/CustomTree.vue
deleted file mode 100644
index 6fd4e3e7..00000000
--- a/src/views/extend/processFlowView/components/CustomTree.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<!-- 
-    filename: CustomTree.vue
-    author: liubin
-    date: 2023-11-17 13:53:16
-    description: 
--->
-
-<template>
-	<div class="custom-tree">
-		<div v-for="equipment in rawData" :key="eq.id">
-			<CustomBomList
-				@open="closeOthers"
-				:active="activeId == eq.id"
-				:equipment="equipment" />
-		</div>
-	</div>
-</template>
-
-<script>
-import CustomBomList from './CustomBomList.vue';
-
-export default {
-	name: 'CustomTree',
-	components: { CustomBomList },
-	props: {
-		rawData: {
-			type: Array,
-			default: () => [],
-		},
-	},
-	data() {
-		return {
-			showList: false,
-			activeId: null,
-		};
-	},
-	computed: {},
-	methods: {
-		closeOthers(id) {
-			this.activeId = id;
-		},
-	},
-};
-</script>
-
-<style scoped lang="scss">
-.custom-tree {
-	// background: #0001;
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-}
-</style>
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 0e4e334f..8522f904 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -68,13 +68,12 @@
 			@cancel="cancel"
 			@confirm="submitForm">
 			<!-- <CustomTransfer /> -->
-			<BomSelector :bom-list="bomList" />
+			<BomSelector :bom-list="bomList" v-model="selectedBoms" />
 		</base-dialog>
 	</section>
 </template>
 
 <script>
-import CustomTransfer from './CustomTransfer.vue';
 import BomSelector from './BomSelector.vue';
 
 export default {
@@ -107,6 +106,7 @@ export default {
 				pageSize: 10,
 			},
 			searchText: '',
+			selectedBoms: [],
 		};
 	},
 	watch: {
@@ -124,49 +124,6 @@ export default {
 		},
 	},
 	methods: {
-		renderFn(h, option) {
-			console.log(option);
-			return <span>1</span>;
-		},
-		async getEqList() {
-			console.log('currentDet', this.currentDet);
-			const { sectionId } = this.currentDet;
-			const { code, data } = await this.http(
-				'base/core-equipment-bind-section/page',
-				'get',
-				{ workshopSectionId: sectionId, pageNo: 1, pageSize: 100 }
-			);
-			if (code == 0) {
-				console.log('workshopSectionId', data);
-
-				// 模拟数据
-				this.eqList = [
-					{ equipmentId: 1, equipmentName: '设备1' },
-					{ equipmentId: 2, equipmentName: '设备2' },
-					{ equipmentId: 3, equipmentName: '设备3' },
-					{ equipmentId: 4, equipmentName: '设备4' },
-					{ equipmentId: 5, equipmentName: '设备5' },
-					{ equipmentId: 6, equipmentName: '设备6' },
-				]; // ].map((item) => ({ label: item.equipmentName, key: item.equipmentId }));
-
-				// 获取参数bom和物料bom
-				// 需调用参数bom接口和 物料bom接口
-				this.finalList = this.eqList.map((item) => {
-					item.sub = [];
-					// key: equipmentId-参数bomId
-					item.sub.push({
-						key: item.equipmentId + '-' + '101',
-						label: '参数bom1',
-					});
-					item.sub.push({
-						key: item.equipmentId + '-' + '201',
-						label: '物料bom1',
-					});
-
-					return item;
-				});
-			}
-		},
 		handleEmitFun() {},
 		handleTableBtnClick() {},
 		put(payload) {
@@ -189,7 +146,28 @@ export default {
 				data: method !== 'get' ? payload : null,
 			});
 		},
-		submitForm() {},
+		async submitForm() {
+			console.log('selectedBoms', this.selectedBoms);
+			if (this.selectedBoms.length) {
+				const { code, data } = await this.http(
+					'/extend/process-flow-det-equipment/createList',
+					'post',
+					this.selectedBoms.map((item) => ({
+						...item,
+						flowDetId: this.currentDet.detId,
+					}))
+				);
+				if (code == 0) {
+					this.$message.success('操作成功');
+					this.getList(this.currentDet);
+					this.cancel();
+				} else {
+					this.$message.error('操作失败');
+				}
+			} else {
+				this.$message.info('请选择设备');
+			}
+		},
 		async getList({
 			detId,
 			detName,
@@ -232,7 +210,6 @@ export default {
 		},
 		async handleAddEquipment() {
 			this.open = true;
-			await this.getEqList();
 		},
 		cancel() {
 			this.open = false;

From 20975948ef17e30faa068330953bc2e1e694fd84 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Mon, 20 Nov 2023 16:50:38 +0800
Subject: [PATCH 10/13] update

---
 .../components/ProcessBomList.vue             | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 8522f904..4817d42d 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -191,14 +191,25 @@ export default {
 			}
 
 			// 获取设备及bom列表
-			this.http(
-				'/extend/process-flow-det/getEquipmentDetBySectionId?id=' + sectionId,
-				'post'
-			).then(({ code, data }) => {
+			this.http('/extend/process-flow-det/getEquipmentDetBySectionId', 'post', {
+				sectionId,
+				flowDetId: detId,
+			}).then(({ code, data }) => {
 				if (code == 0) {
 					this.bomList = data.map((eq) => {
 						eq.materialsBom = eq.materialsBom || [];
 						eq.valuesBom = eq.valuesBom || [];
+						// 设置选中状态
+						eq.materialsBom.chosen = eq.materialsBomChoseId ?? null;
+						eq.valuesBom.chosen = eq.valuesBomChoseId ?? null;
+						if (eq.materialsBom.chosen || eq.valuesBom.chosen) {
+							this.selectedBoms.push({
+								equipmentId: eq.id,
+								equMaterialBomId: eq.materialsBom.chosen,
+								equValueBomId: eq.valuesBom.chosen,
+							});
+						}
+						// 设置设备id
 						eq.materialsBom.equipmentId = eq.id;
 						eq.valuesBom.equipmentId = eq.id;
 						return eq;

From 32a43fbc3b831d8b5ac6c7a9b01ff011c9eb8b82 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Tue, 21 Nov 2023 09:13:28 +0800
Subject: [PATCH 11/13] update process equipment relation

---
 .../components/BomSelector.vue                | 15 +++---
 .../components/ProcessBomList.vue             | 52 +++++++++++--------
 2 files changed, 40 insertions(+), 27 deletions(-)

diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index 9927f7b1..f8b37b8a 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -121,6 +121,9 @@ export default {
 		},
 	},
 	methods: {
+		commit() {
+			this.$emit('update', this.selected);
+		},
 		handleEquipmentChange(eq, selected) {
 			this.currentEquipment = eq.id;
 			this.materialsBomList = eq.materialsBom;
@@ -133,7 +136,7 @@ export default {
 					equValueBomId: null,
 					equMaterialBomId: null,
 				});
-				this.$emit('update', this.selected);
+				// this.$emit('update', this.selected);
 			} else {
 				// 清空选择状态
 				this.selectedEquipments = this.selectedEquipments.filter(
@@ -144,7 +147,7 @@ export default {
 				this.selected = this.selected.filter(
 					(item) => item.equipmentId !== eq.id
 				);
-				this.$emit('update', this.selected);
+				// this.$emit('update', this.selected);
 			}
 		},
 
@@ -162,11 +165,11 @@ export default {
 				});
 				// 强制更新'设备'一栏
 				this.refreshKey = Math.random();
-				this.$emit('update', this.selected);
+				// this.$emit('update', this.selected);
 				return;
 			}
 			selectedItem && (selectedItem.equMaterialBomId = selected ? bomId : null);
-			this.$emit('update', this.selected);
+			// this.$emit('update', this.selected);
 		},
 
 		handleValueBomChange(equipmentId, bomId, selected) {
@@ -182,11 +185,11 @@ export default {
 					equMaterialBomId: null,
 				});
 				this.refreshKey = Math.random();
-				this.$emit('update', this.selected);
+				// this.$emit('update', this.selected);
 				return;
 			}
 			selectedItem && (selectedItem.equValueBomId = selected ? bomId : null);
-			this.$emit('update', this.selected);
+			// this.$emit('update', this.selected);
 		},
 	},
 };
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 4817d42d..68565eb8 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -68,7 +68,12 @@
 			@cancel="cancel"
 			@confirm="submitForm">
 			<!-- <CustomTransfer /> -->
-			<BomSelector :bom-list="bomList" v-model="selectedBoms" />
+			<BomSelector
+				ref="bomSelector"
+				v-if="open"
+				:bom-list="bomList"
+				:value="selectedBoms"
+				@update="selectedBoms = $event" />
 		</base-dialog>
 	</section>
 </template>
@@ -146,27 +151,32 @@ export default {
 				data: method !== 'get' ? payload : null,
 			});
 		},
-		async submitForm() {
-			console.log('selectedBoms', this.selectedBoms);
-			if (this.selectedBoms.length) {
-				const { code, data } = await this.http(
-					'/extend/process-flow-det-equipment/createList',
-					'post',
-					this.selectedBoms.map((item) => ({
-						...item,
-						flowDetId: this.currentDet.detId,
-					}))
-				);
-				if (code == 0) {
-					this.$message.success('操作成功');
-					this.getList(this.currentDet);
-					this.cancel();
+		submitForm() {
+			// 现将子组件的修改提交更新至本组件
+			this.$refs.bomSelector.commit();
+			// 再提交至后端
+			this.$nextTick(async () => {
+				console.log('selectedBoms', this.selectedBoms);
+				if (this.selectedBoms.length) {
+					const { code, data } = await this.http(
+						'/extend/process-flow-det-equipment/createList',
+						'post',
+						this.selectedBoms.map((item) => ({
+							...item,
+							flowDetId: this.currentDet.detId,
+						}))
+					);
+					if (code == 0) {
+						this.$message.success('操作成功');
+						this.getList(this.currentDet);
+						this.cancel();
+					} else {
+						this.$message.error('操作失败');
+					}
 				} else {
-					this.$message.error('操作失败');
+					this.$message.info('请选择设备');
 				}
-			} else {
-				this.$message.info('请选择设备');
-			}
+			});
 		},
 		async getList({
 			detId,
@@ -202,7 +212,7 @@ export default {
 						// 设置选中状态
 						eq.materialsBom.chosen = eq.materialsBomChoseId ?? null;
 						eq.valuesBom.chosen = eq.valuesBomChoseId ?? null;
-						if (eq.materialsBom.chosen || eq.valuesBom.chosen) {
+						if (eq.equChose || eq.materialsBom.chosen || eq.valuesBom.chosen) {
 							this.selectedBoms.push({
 								equipmentId: eq.id,
 								equMaterialBomId: eq.materialsBom.chosen,

From 847e34fcc615bae5eb9b688f9f18311c56f832a1 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Tue, 21 Nov 2023 11:48:17 +0800
Subject: [PATCH 12/13] update

---
 .../components/BomSelection.vue               | 18 ++++++---
 .../components/BomSelector.vue                | 38 +++++++++++++++----
 2 files changed, 42 insertions(+), 14 deletions(-)

diff --git a/src/views/extend/processFlowView/components/BomSelection.vue b/src/views/extend/processFlowView/components/BomSelection.vue
index f5c2f02b..d5c51f7e 100644
--- a/src/views/extend/processFlowView/components/BomSelection.vue
+++ b/src/views/extend/processFlowView/components/BomSelection.vue
@@ -27,10 +27,10 @@ export default {
 	// 	event: 'update',
 	// },
 	props: {
-		// selected: {
-		// 	type: String,
-		// 	default: '',
-		// },
+		currentSelect: {
+			type: String,
+			default: null,
+		},
 		list: {
 			type: Array,
 			default: () => [],
@@ -44,7 +44,7 @@ export default {
 		return {
 			list__inner: [],
 			selected: null,
-            randomKey: Math.random()
+			randomKey: Math.random(),
 		};
 	},
 	watch: {
@@ -57,6 +57,12 @@ export default {
 			deep: true,
 			immediate: true,
 		},
+		currentSelect: {
+			handler(val) {
+				this.selected = val;
+			},
+			immediate: true,
+		},
 	},
 	methods: {
 		handleChange(bomItem, selected) {
@@ -76,7 +82,7 @@ export default {
 		clearSelected() {
 			console.log('clearSelected');
 			this.selected = null;
-            this.randomKey = Math.random()
+			this.randomKey = Math.random();
 			// this.$emit('update', null);
 			// this.$nextTick(() => {
 			// 	this.$forceUpdate();
diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index f8b37b8a..1dffa4b0 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -29,13 +29,21 @@
 						</span>
 					</div>
 					<div class="sl__body">
-						<el-checkbox
+						<div
+							class="sl__body-item"
 							v-for="eq in filteredBomList"
-							:key="eq.id + refreshKey"
-							:label="eq.name"
-							:checked="selectedEquipments.includes(eq.id)"
-							@change="(e) => handleEquipmentChange(eq, e)"
-							class="sl__body-item"></el-checkbox>
+							:key="eq.id + refreshKey">
+							<el-checkbox
+								:key="refreshKey"
+								:checked="selectedEquipments.includes(eq.id)"
+								@change="(e) => handleEquipmentChange(eq, e)"
+								class=""></el-checkbox>
+							<span
+								:key="'label' + refreshKey"
+								@click.stop="() => handleLoadDom(eq)">
+								{{ eq.name }}
+							</span>
+						</div>
 					</div>
 				</div>
 			</el-col>
@@ -47,9 +55,10 @@
 
 					<BomSelection
 						ref="materialsBomList"
-						key="materialsBomList"
+						:key="materialsBomList.equipmentId + 'materialsBomList'"
 						:list="materialsBomList"
 						:equipment-id="materialsBomList.equipmentId"
+						:current-select="currentSelectedMaterialBomId"
 						@change="handleMaterialBomChange" />
 				</div>
 			</el-col>
@@ -61,9 +70,10 @@
 
 					<BomSelection
 						ref="valuesBomList"
-						key="valuesBomList"
+						:key="valuesBomList.equipmentId + 'valuesBomList'"
 						:list="valuesBomList"
 						:equipment-id="valuesBomList.equipmentId"
+						:current-select="currentSelectedValueBomId"
 						@change="handleValueBomChange" />
 				</div>
 			</el-col>
@@ -98,6 +108,8 @@ export default {
 			materialsBomList: [],
 			valuesBomList: [],
 			refreshKey: Math.random(),
+			currentSelectedMaterialBomId: null,
+			currentSelectedValueBomId: null,
 		};
 	},
 	watch: {
@@ -124,6 +136,14 @@ export default {
 		commit() {
 			this.$emit('update', this.selected);
 		},
+
+		handleLoadDom(eq) {
+			// 只显示 dom 列表
+			this.currentEquipment = eq.id;
+			this.materialsBomList = eq.materialsBom;
+			this.valuesBomList = eq.valuesBom;
+		},
+
 		handleEquipmentChange(eq, selected) {
 			this.currentEquipment = eq.id;
 			this.materialsBomList = eq.materialsBom;
@@ -169,6 +189,7 @@ export default {
 				return;
 			}
 			selectedItem && (selectedItem.equMaterialBomId = selected ? bomId : null);
+			this.currentSelectedMaterialBomId = selected ? bomId : null;
 			// this.$emit('update', this.selected);
 		},
 
@@ -189,6 +210,7 @@ export default {
 				return;
 			}
 			selectedItem && (selectedItem.equValueBomId = selected ? bomId : null);
+			this.currentSelectedValueBomId = selected ? bomId : null;
 			// this.$emit('update', this.selected);
 		},
 	},

From 51baca61cc72f9ff08406212b91d64e0cb0ac297 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Tue, 21 Nov 2023 14:10:47 +0800
Subject: [PATCH 13/13] update equipment attach process

---
 .env.dev                                      |  4 +-
 .../components/BomSelection.vue               |  1 +
 .../components/BomSelector.vue                | 47 ++++++++++++-------
 .../components/ProcessBomList.vue             | 20 +++++++-
 4 files changed, 53 insertions(+), 19 deletions(-)

diff --git a/.env.dev b/.env.dev
index 72b44389..9830c162 100644
--- a/.env.dev
+++ b/.env.dev
@@ -13,11 +13,11 @@ VUE_APP_TITLE = MES系统
 
 # 芋道管理系统/开发环境
 # VUE_APP_BASE_API = 'http://100.64.0.26:48082'
-VUE_APP_BASE_API = 'http://192.168.0.33:48082'
+# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 # VUE_APP_BASE_API = 'http://192.168.4.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.2.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.49:48080'
-# VUE_APP_BASE_API = 'http://192.168.1.8:48080'
+VUE_APP_BASE_API = 'http://192.168.1.8:48082'
 # VUE_APP_BASE_API = 'http://192.168.4.159:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.56:48080'
 # VUE_APP_BASE_API = 'http://192.168.4.159:48080'
diff --git a/src/views/extend/processFlowView/components/BomSelection.vue b/src/views/extend/processFlowView/components/BomSelection.vue
index d5c51f7e..75bfa061 100644
--- a/src/views/extend/processFlowView/components/BomSelection.vue
+++ b/src/views/extend/processFlowView/components/BomSelection.vue
@@ -60,6 +60,7 @@ export default {
 		currentSelect: {
 			handler(val) {
 				this.selected = val;
+				this.randomKey = Math.random();
 			},
 			immediate: true,
 		},
diff --git a/src/views/extend/processFlowView/components/BomSelector.vue b/src/views/extend/processFlowView/components/BomSelector.vue
index 1dffa4b0..a52be51c 100644
--- a/src/views/extend/processFlowView/components/BomSelector.vue
+++ b/src/views/extend/processFlowView/components/BomSelector.vue
@@ -142,6 +142,15 @@ export default {
 			this.currentEquipment = eq.id;
 			this.materialsBomList = eq.materialsBom;
 			this.valuesBomList = eq.valuesBom;
+			// 回复选中的bom信息
+			if (this.selectedEquipments.includes(eq.id)) {
+				const selectedItem = this.selected.find(
+					(item) => item.equipmentId == eq.id
+				);
+				this.currentSelectedMaterialBomId =
+					selectedItem.equMaterialBomId ?? null;
+				this.currentSelectedValueBomId = selectedItem.equValueBomId ?? null;
+			}
 		},
 
 		handleEquipmentChange(eq, selected) {
@@ -162,8 +171,10 @@ export default {
 				this.selectedEquipments = this.selectedEquipments.filter(
 					(id) => id !== eq.id
 				);
-				this.$refs.materialsBomList.clearSelected();
-				this.$refs.valuesBomList.clearSelected();
+				// this.$refs.materialsBomList.clearSelected();
+				// this.$refs.valuesBomList.clearSelected();
+				this.currentSelectedMaterialBomId = null;
+				this.currentSelectedValueBomId = null;
 				this.selected = this.selected.filter(
 					(item) => item.equipmentId !== eq.id
 				);
@@ -222,27 +233,31 @@ export default {
 	min-height: 200px;
 }
 
-.select-list {
-}
-
 .sl__body {
 	display: flex;
 	flex-direction: column;
 	gap: 6px;
 	padding: 6px;
-
-	> .el-checkbox {
-		margin: 0;
-		padding: 3px 6px;
-		border-radius: 4px;
-		transition: background 0.3s ease-in-out;
-
-		&:hover {
-			background: #0001;
-		}
-	}
 }
 
+.sl__body-item {
+	margin: 0;
+	padding: 3px 6px;
+	border-radius: 4px;
+	cursor: pointer;
+	transition: background 0.3s ease-in-out;
+	display: flex;
+	align-items: center;
+	gap: 8px;
+
+	> span {
+		flex: 1;
+	}
+
+	&:hover {
+		background: #0001;
+	}
+}
 .sl__header {
 	border-bottom: 1px solid #ccc;
 }
diff --git a/src/views/extend/processFlowView/components/ProcessBomList.vue b/src/views/extend/processFlowView/components/ProcessBomList.vue
index 68565eb8..e98f32c6 100644
--- a/src/views/extend/processFlowView/components/ProcessBomList.vue
+++ b/src/views/extend/processFlowView/components/ProcessBomList.vue
@@ -31,6 +31,9 @@
 				icon="el-icon-search"
 				placeholder="搜索"
 				v-model="searchText"
+				:disabled="currentDet == null"
+				@change="handleSearchTextChange"
+				clearable
 				style="margin-left: 20px">
 				<i slot="prefix" class="el-input__icon el-icon-search"></i>
 			</el-input>
@@ -99,7 +102,7 @@ export default {
 			choosedEquipments: [],
 			searchBarFormConfig: [{ label: '工序下设备' }],
 			tableProps: [
-				{ prop: 'equipmentId', label: '设备名称' },
+				{ prop: 'equName', label: '设备名称' },
 				{ prop: 'materialName', label: '物料BOM' },
 				{ prop: 'valueName', label: '参数BOM' },
 			],
@@ -109,9 +112,11 @@ export default {
 			queryParams: {
 				pageNo: 1,
 				pageSize: 10,
+				equipmentName: '',
 			},
 			searchText: '',
 			selectedBoms: [],
+			timer: null,
 		};
 	},
 	watch: {
@@ -130,7 +135,20 @@ export default {
 	},
 	methods: {
 		handleEmitFun() {},
+
 		handleTableBtnClick() {},
+
+		handleSearchTextChange(val) {
+			if (this.timer) clearTimeout(this.timer);
+			this.timer = setTimeout(() => {
+				console.log('geting list.......');
+				this.queryParams.equipmentName = val;
+				this.$nextTick(() => {
+					this.getList(this.currentDet);
+				});
+			}, 300);
+		},
+
 		put(payload) {
 			return this.http(this.updateUrl, 'put', payload);
 		},