From 4843e7a6d1539b6ed73d845f787a3a58f50a8d90 Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Thu, 30 May 2024 09:53:17 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9Ael-drawer=E7=BC=93=E5=AD=98?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98-=E9=87=87=E8=B4=AD?=
 =?UTF-8?q?=E8=AE=A1=E5=88=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/pum/order.vue     |  21 ++--
 src/views/pum/orderitem.vue | 241 +++++++++++++++++++-----------------
 src/views/pum/plan.vue      |  19 +--
 src/views/pum/planitem.vue  | 224 +++++++++++++++++----------------
 4 files changed, 266 insertions(+), 239 deletions(-)

diff --git a/src/views/pum/order.vue b/src/views/pum/order.vue
index 5fd55ead..8b1e77f4 100644
--- a/src/views/pum/order.vue
+++ b/src/views/pum/order.vue
@@ -125,9 +125,13 @@
 		@success="handleSaveSuccess"
 		@closed="dialog.save = false"
 	></save-dialog>
-	<el-drawer title="订单详情" v-model="dialog.detail" :size="'90%'">
-		<detail-dialog :orderId="orderId" ref="detailDialogs"> </detail-dialog>
-	</el-drawer>
+	<detail-dialog
+		ref="detailDialogs"
+		v-if="dialog.detail"
+		:orderId="orderId"
+		@closed="dialog.detail = false"
+	>
+	</detail-dialog>
 </template>
 <script>
 import saveDialog from "./order_form.vue";
@@ -177,14 +181,9 @@ export default {
 		table_detail(row) {
 			this.orderId = row.id;
 			this.dialog.detail = true;
-			// this.$nextTick(() => {
-			// 	this.$router.push({
-			// 		name: "orderitem",
-			// 		query: {
-			// 			pu_order: row.id,
-			// 		},
-			// 	});
-			// });
+			this.$nextTick(() => {
+				this.$refs.detailDialogs.open();
+			});
 		},
 		table_submit(row) {
 			this.$API.pum.order.submit.req(row.id).then((res) => {
diff --git a/src/views/pum/orderitem.vue b/src/views/pum/orderitem.vue
index b185b03e..800a483f 100644
--- a/src/views/pum/orderitem.vue
+++ b/src/views/pum/orderitem.vue
@@ -1,118 +1,129 @@
 <template>
-	<div style="padding: 8px">
-		<div>
-			<el-card style="width: 100%" header="基本信息" shadow="hover">
-				<el-descriptions>
-					<el-descriptions-item label="订单编号">{{
-						orderObj.number
-					}}</el-descriptions-item>
-					<el-descriptions-item label="订单状态">{{
-						stateOption[orderObj.state]
-					}}</el-descriptions-item>
-					<el-descriptions-item label="供应商">{{
-						orderObj.supplier_name
-					}}</el-descriptions-item>
-					<el-descriptions-item label="所属部门">{{
-						orderObj.belong_dept_name
-					}}</el-descriptions-item>
-					<el-descriptions-item label="创建人">{{
-						orderObj.create_by_name
-					}}</el-descriptions-item>
-					<el-descriptions-item label="创建时间">{{
-						orderObj.create_time
-					}}</el-descriptions-item>
-				</el-descriptions>
-			</el-card>
+	<el-drawer
+		v-model="visible"
+		title="订单详情"
+		:size="'90%'"
+		destroy-on-close
+		@closed="$emit('closed')"
+	>
+		<div style="padding: 8px">
+			<div>
+				<el-card style="width: 100%" header="基本信息" shadow="hover">
+					<el-descriptions>
+						<el-descriptions-item label="订单编号">{{
+							orderObj.number
+						}}</el-descriptions-item>
+						<el-descriptions-item label="订单状态">{{
+							stateOption[orderObj.state]
+						}}</el-descriptions-item>
+						<el-descriptions-item label="供应商">{{
+							orderObj.supplier_name
+						}}</el-descriptions-item>
+						<el-descriptions-item label="所属部门">{{
+							orderObj.belong_dept_name
+						}}</el-descriptions-item>
+						<el-descriptions-item label="创建人">{{
+							orderObj.create_by_name
+						}}</el-descriptions-item>
+						<el-descriptions-item label="创建时间">{{
+							orderObj.create_time
+						}}</el-descriptions-item>
+					</el-descriptions>
+				</el-card>
+			</div>
+			<div style="height: 8px"></div>
+			<div>
+				<el-card style="width: 100%" header="订单明细" shadow="hover">
+					<div>
+						<el-button
+							type="primary"
+							@click="addLinkPlanItem"
+							v-auth="'pu_orderitem.create'"
+							v-if="orderObj.state == 10"
+							>计划明细变更采购明细</el-button
+						>
+						<el-button
+							type="primary"
+							icon="el-icon-plus"
+							@click="add"
+							v-auth="'pu_orderitem.create'"
+							v-if="orderObj.state == 10"
+							>手动新增</el-button
+						>
+					</div>
+					<scTable
+						ref="table"
+						:apiObj="apiObj"
+						row-key="id"
+						stripe
+						:params="params"
+						:query="query"
+						hidePagination
+						hideDo
+					>
+						<el-table-column type="index" width="50" />
+						<el-table-column
+							label="物料"
+							prop="material"
+							show-overflow-tooltip
+						>
+							<template #default="scope">
+								<span v-if="scope.row.material_">
+									{{ scope.row.material_.name }}</span
+								>
+							</template>
+						</el-table-column>
+						<el-table-column label="所需数量" prop="count">
+						</el-table-column>
+						<el-table-column
+							label="已到货数量"
+							prop="delivered_count"
+						>
+						</el-table-column>
+						<el-table-column
+							label="创建时间"
+							prop="create_time"
+							show-overflow-tooltip
+						>
+						</el-table-column>
+						<el-table-column
+							label="更新时间"
+							prop="update_time"
+							show-overflow-tooltip
+						>
+						</el-table-column>
+						<el-table-column
+							label="操作"
+							fixed="right"
+							align="left"
+							width="100px"
+						>
+							<template #default="scope">
+								<el-button
+									link
+									type="primary"
+									@click="table_edit(scope.row)"
+									v-auth="'pu_orderitem.update'"
+									v-if="orderObj.state == 10"
+								>
+									编辑
+								</el-button>
+								<el-button
+									link
+									type="danger"
+									@click="table_del(scope.row)"
+									v-auth="'pu_orderitem.delete'"
+									v-if="orderObj.state == 10"
+								>
+									删除
+								</el-button>
+							</template>
+						</el-table-column>
+					</scTable>
+				</el-card>
+			</div>
 		</div>
-		<div style="height: 8px"></div>
-		<div>
-			<el-card style="width: 100%" header="订单明细" shadow="hover">
-				<div>
-					<el-button
-						type="primary"
-						@click="addLinkPlanItem"
-						v-auth="'pu_orderitem.create'"
-						v-if="orderObj.state == 10"
-						>计划明细变更采购明细</el-button
-					>
-					<el-button
-						type="primary"
-						icon="el-icon-plus"
-						@click="add"
-						v-auth="'pu_orderitem.create'"
-						v-if="orderObj.state == 10"
-						>手动新增</el-button
-					>
-				</div>
-				<scTable
-					ref="table"
-					:apiObj="apiObj"
-					row-key="id"
-					stripe
-					:params="params"
-					:query="query"
-					hidePagination
-					hideDo
-				>
-					<el-table-column type="index" width="50" />
-					<el-table-column
-						label="物料"
-						prop="material"
-						show-overflow-tooltip
-					>
-						<template #default="scope">
-							<span v-if="scope.row.material_">
-								{{ scope.row.material_.name }}</span
-							>
-						</template>
-					</el-table-column>
-					<el-table-column label="所需数量" prop="count">
-					</el-table-column>
-					<el-table-column label="已到货数量" prop="delivered_count">
-					</el-table-column>
-					<el-table-column
-						label="创建时间"
-						prop="create_time"
-						show-overflow-tooltip
-					>
-					</el-table-column>
-					<el-table-column
-						label="更新时间"
-						prop="update_time"
-						show-overflow-tooltip
-					>
-					</el-table-column>
-					<el-table-column
-						label="操作"
-						fixed="right"
-						align="left"
-						width="100px"
-					>
-						<template #default="scope">
-							<el-button
-								link
-								type="primary"
-								@click="table_edit(scope.row)"
-								v-auth="'pu_orderitem.update'"
-								v-if="orderObj.state == 10"
-							>
-								编辑
-							</el-button>
-							<el-button
-								link
-								type="danger"
-								@click="table_del(scope.row)"
-								v-auth="'pu_orderitem.delete'"
-								v-if="orderObj.state == 10"
-							>
-								删除
-							</el-button>
-						</template>
-					</el-table-column>
-				</scTable>
-			</el-card>
-		</div>
-	</div>
+	</el-drawer>
 	<save-dialog
 		v-if="dialog.save"
 		ref="saveDialog"
@@ -163,6 +174,7 @@ export default {
 				30: "到货中",
 				40: "已完成",
 			},
+			visible: false,
 		};
 	},
 	mounted() {
@@ -172,6 +184,9 @@ export default {
 		this.getOrder();
 	},
 	methods: {
+		open() {
+			this.visible = true;
+		},
 		getOrder() {
 			this.$API.pum.order.item.req(this.puOrder).then((res) => {
 				this.orderObj = res;
diff --git a/src/views/pum/plan.vue b/src/views/pum/plan.vue
index 4ba85a59..1f605f85 100644
--- a/src/views/pum/plan.vue
+++ b/src/views/pum/plan.vue
@@ -107,9 +107,13 @@
 		@success="handleSaveSuccess"
 		@closed="dialog.save = false"
 	></save-dialog>
-	<el-drawer title="计划详情" v-model="dialog.detail" :size="'90%'">
-		<detail-dialog :planId="planId" ref="detailDialogs"> </detail-dialog>
-	</el-drawer>
+	<detail-dialog
+		ref="detailDialogs"
+		v-if="dialog.detail"
+		:planId="planId"
+		@closed="dialog.detail = false"
+	>
+	</detail-dialog>
 </template>
 <script>
 import saveDialog from "./plan_form.vue";
@@ -155,12 +159,9 @@ export default {
 		table_detail(row) {
 			this.planId = row.id;
 			this.dialog.detail = true;
-			// this.$nextTick(() => {
-			// 	this.$router.push({
-			// 		name: "planitem",
-			// 		query: { pu_plan: row.id },
-			// 	});
-			// });
+			this.$nextTick(() => {
+				this.$refs.detailDialogs.open();
+			});
 		},
 		//编辑
 		table_edit(row) {
diff --git a/src/views/pum/planitem.vue b/src/views/pum/planitem.vue
index dbe3de8c..c2ffc33d 100644
--- a/src/views/pum/planitem.vue
+++ b/src/views/pum/planitem.vue
@@ -1,110 +1,118 @@
 <template>
-	<div style="padding: 8px">
-		<div>
-			<el-card style="width: 100%" header="基本信息" shadow="hover">
-				<el-descriptions>
-					<el-descriptions-item label="计划名称">{{
-						orderObj.name
-					}}</el-descriptions-item>
-					<el-descriptions-item label="计划编号">{{
-						orderObj.number
-					}}</el-descriptions-item>
-					<el-descriptions-item label="计划状态">{{
-						stateOption[orderObj.state]
-					}}</el-descriptions-item>
-				</el-descriptions>
-			</el-card>
+	<el-drawer
+		v-model="visible"
+		title="计划详情"
+		:size="'90%'"
+		destroy-on-close
+		@closed="$emit('closed')"
+	>
+		<div style="padding: 8px">
+			<div>
+				<el-card style="width: 100%" header="基本信息" shadow="hover">
+					<el-descriptions>
+						<el-descriptions-item label="计划名称">{{
+							orderObj.name
+						}}</el-descriptions-item>
+						<el-descriptions-item label="计划编号">{{
+							orderObj.number
+						}}</el-descriptions-item>
+						<el-descriptions-item label="计划状态">{{
+							stateOption[orderObj.state]
+						}}</el-descriptions-item>
+					</el-descriptions>
+				</el-card>
+			</div>
+			<div style="height: 8px"></div>
+			<div>
+				<el-card style="width: 100%" header="计划明细" shadow="hover">
+					<div>
+						<el-button
+							type="primary"
+							icon="el-icon-plus"
+							v-auth="'pu_planitem.create'"
+							@click="add"
+							v-if="orderObj.state == 10"
+							>新增</el-button
+						>
+					</div>
+					<scTable
+						ref="table"
+						:apiObj="apiObj"
+						row-key="id"
+						stripe
+						:params="query"
+						:query="query"
+						hidePagination
+						hideDo
+					>
+						<el-table-column type="index" width="50" />
+						<el-table-column
+							label="所属物料"
+							prop="material"
+							show-overflow-tooltip
+						>
+							<template #default="scope">
+								<span v-if="scope.row.material_">
+									{{ scope.row.material_.name }}</span
+								>
+							</template>
+						</el-table-column>
+						<el-table-column label="所属数量" prop="need_count">
+						</el-table-column>
+						<el-table-column
+							label="需求日期"
+							prop="need_date"
+							show-overflow-tooltip
+						>
+						</el-table-column>
+						<el-table-column label="部门" prop="belong_dept_name">
+						</el-table-column>
+						<el-table-column label="关联采购订单" prop="pu_order">
+							<template #default="scope">
+								<span v-if="scope.row.pu_order">是</span>
+								<span v-else>否</span>
+							</template>
+						</el-table-column>
+						<el-table-column label="创建人" prop="create_by_name">
+						</el-table-column>
+						<el-table-column
+							label="备注"
+							prop="note"
+							show-overflow-tooltip
+						>
+						</el-table-column>
+						<el-table-column
+							label="操作"
+							fixed="right"
+							align="center"
+							width="100px"
+						>
+							<template #default="scope">
+								<el-button
+									link
+									type="primary"
+									@click="table_edit(scope.row)"
+									v-auth="'pu_planitem.update'"
+									v-if="orderObj == 10"
+								>
+									编辑
+								</el-button>
+								<el-button
+									link
+									type="danger"
+									@click="table_del(scope.row)"
+									v-auth="'pu_planitem.delete'"
+									v-if="orderObj == 10"
+								>
+									删除
+								</el-button>
+							</template>
+						</el-table-column>
+					</scTable>
+				</el-card>
+			</div>
 		</div>
-		<div style="height: 8px"></div>
-		<div>
-			<el-card style="width: 100%" header="计划明细" shadow="hover">
-				<div>
-					<el-button
-						type="primary"
-						icon="el-icon-plus"
-						v-auth="'pu_planitem.create'"
-						@click="add"
-						v-if="orderObj.state == 10"
-						>新增</el-button
-					>
-				</div>
-				<scTable
-					ref="table"
-					:apiObj="apiObj"
-					row-key="id"
-					stripe
-					:params="query"
-					:query="query"
-					hidePagination
-					hideDo
-				>
-					<el-table-column type="index" width="50" />
-					<el-table-column
-						label="所属物料"
-						prop="material"
-						show-overflow-tooltip
-					>
-						<template #default="scope">
-							<span v-if="scope.row.material_">
-								{{ scope.row.material_.name }}</span
-							>
-						</template>
-					</el-table-column>
-					<el-table-column label="所属数量" prop="need_count">
-					</el-table-column>
-					<el-table-column
-						label="需求日期"
-						prop="need_date"
-						show-overflow-tooltip
-					>
-					</el-table-column>
-					<el-table-column label="部门" prop="belong_dept_name">
-					</el-table-column>
-					<el-table-column label="关联采购订单" prop="pu_order">
-						<template #default="scope">
-							<span v-if="scope.row.pu_order">是</span>
-							<span v-else>否</span>
-						</template>
-					</el-table-column>
-					<el-table-column label="创建人" prop="create_by_name">
-					</el-table-column>
-					<el-table-column
-						label="备注"
-						prop="note"
-						show-overflow-tooltip
-					>
-					</el-table-column>
-					<el-table-column
-						label="操作"
-						fixed="right"
-						align="center"
-						width="100px"
-					>
-						<template #default="scope">
-							<el-button
-								link
-								type="primary"
-								@click="table_edit(scope.row)"
-								v-auth="'pu_planitem.update'"
-								v-if="orderObj == 10"
-							>
-								编辑
-							</el-button>
-							<el-button
-								link
-								type="danger"
-								@click="table_del(scope.row)"
-								v-auth="'pu_planitem.delete'"
-								v-if="orderObj == 10"
-							>
-								删除
-							</el-button>
-						</template>
-					</el-table-column>
-				</scTable>
-			</el-card>
-		</div>
-	</div>
+	</el-drawer>
 	<save-dialog
 		v-if="dialog.save"
 		ref="saveDialog"
@@ -146,16 +154,20 @@ export default {
 				40: "下单完成",
 				40: "已完成",
 			},
+			visible: false,
 		};
 	},
 	mounted() {
 		this.puPlan = this.planId;
 		this.query.pu_plan = this.planId;
 		this.apiObj = this.$API.pum.planitem.list;
-		this.$refs.table.refresh();
+		// this.$refs.table.refresh();
 		this.getOrder();
 	},
 	methods: {
+		open() {
+			this.visible = true;
+		},
 		getOrder() {
 			this.$API.pum.plan.item.req(this.puPlan).then((res) => {
 				this.orderObj = res;