fix: 第一版错误修改后的存档。

src/views/purchase/purchase-plan/PurchasePlanView.vue

@@ -16,6 +16,8 @@ import type { FieldMappingConfig } from "@/components/base/base-form-with-table/
 import { ref } from "vue";
 import { useStatus } from "@/common/languages/mapping/base-info-mapping";
 import Decimal from "decimal.js";
+import ExpandablePageableTable from "@/components/base/expandable-pageable-table/ExpandablePageableTable.vue";
+import BaseItemDialog from "@/components/base/base-item-dialog/BaseItemDialog.vue";
 
 /**
  * 必须要的变量
@@ -27,8 +29,9 @@ const editUrl = "/purchase/purchaseplan/updatePurchasePlan";
 const removeUrl = "/purchase/purchaseplan/deletePurchasePlan";
 const getItemsUrl = "/purchase/purchaseplan/getPurchasePlanItemsWithVendorSuggestions";
 const generateOrderUrl = "/purchase/purchaseplan/generatePurchaseOrder";
+const getItemUrl = "/purchase/purchaseplan/getPurchasePlanItems";
 const searchers = [
-  { name: "vendorName", type: "text" as const, placeholder: $t("_prop.purchase.purchase_plan.vendorName") },
+  { name: "searchCode", type: "text" as const, placeholder: $t("_prop.purchase.purchase_plan.searchCode") },
 ];
 
 const { getPurchasePlanStatusLabel, getPurchasePlanItemStatusLabel } = useStatus();
@@ -53,9 +56,9 @@ const itemArrayName = "planItems";
 /**
  * 基本不变通用变量
  */
-const tableRef = ref<InstanceType<typeof BasePageableTable> | null>(null);
+const tableRef = ref<InstanceType<typeof ExpandablePageableTable> | null>(null);
 const { useAdd, useEdit, useRemove, useGeneralPageRef } = usePage(tableRef);
-const { title, visible, formType, form } = useGeneralPageRef();
+const { title, visible, formType, form, itemVisible, itemParentId } = useGeneralPageRef();
 const baseFormWithTableRef = ref<InstanceType<typeof BaseFormWithTable>>();
 const generateOrderVisible = ref(false);
 const generateOrderForm = reactive({
@@ -86,6 +89,10 @@ const edit = (row: any) => {
 const remove = (row: any) => {
   useRemove(removeUrl, row.id, "_message.purchase.purchase_plan.delete_message");
 };
+const showItem = (row: any) => {
+  itemParentId.value = row.id;
+  itemVisible.value = true;
+};
 const submit = (form: any, formRef: FormInstance | undefined) => {
   if (formRef !== undefined) {
     formRef.validate(valid => {
@@ -132,6 +139,9 @@ const operateButtonClick = (eventName: string, row: any) => {
     case "generatePurchaseOrder":
       showGenerateOrderDialog(row);
       break;
+    case "showItem":
+      showItem(row);
+      break;
   }
 };
 
@@ -333,7 +343,7 @@ const generatePurchaseOrder = async () => {
 
 const mappingConfig: FieldMappingConfig = {
   partNumber: {
-    sourceKey: "商品编号",
+    sourceKey: "物料编号",
     defaultValue: "",
   },
 
@@ -366,24 +376,49 @@ const mappingConfig: FieldMappingConfig = {
 };
 </script>
 <template>
-  <BasePageableTable :url="getPageUrl" :searchers="searchers" ref="tableRef">
+  <ExpandablePageableTable
+    :url="getPageUrl"
+    :searchers="searchers"
+    ref="tableRef"
+    :item-url="getItemUrl"
+    item-id-key="id"
+    item-id-name="planId"
+    item-field-name="planItems"
+  >
     <template #tool-button>
       <DefaultToolButton @top-button-click="topButtonClick" />
     </template>
     <template #columns>
-      <el-table-column :label="$t('_prop.purchase.purchase_plan.planNo')" prop="planNo" />
-      <el-table-column :label="$t('_prop.purchase.purchase_plan.planName')" prop="planName" />
-      <el-table-column :label="$t('_prop.purchase.purchase_plan.storeName')" prop="storeName" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan.planNo')" prop="planNo" width="150" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan.planName')" prop="planName" width="180" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan.storeName')" prop="storeName" width="150" />
       <DefaultStatusSwitchColumn
         status-param-name="planStatus"
         :status-label-mapping="getPurchasePlanStatusLabel"
         :tag-type-mapping="getPurchasePlanStatusTagType"
       />
-      <el-table-column :label="$t('_prop.purchase.purchase_plan.remask')" prop="remask" />
-      <el-table-column :label="$t('_prop.common.createDate')" prop="createDate" :formatter="formatDate" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan.remask')" prop="remask" width="200" />
+      <el-table-column :label="$t('_prop.common.createDate')" prop="createDate" :formatter="formatDate" width="150" />
       <DefaultOperateButtonColumn @operate-button-click="operateButtonClick" :auth-show-func="authShowFunc" />
     </template>
-  </BasePageableTable>
+    <template #item-content="{ itemData }">
+      <el-table :data="itemData" size="small" border stripe>
+        <el-table-column :label="$t('_prop.purchase.purchase_plan_item.partNumber')" prop="partNumber" width="150" />
+        <el-table-column :label="$t('_prop.purchase.purchase_plan.model')" prop="productSpecs" width="150" />
+        <el-table-column
+          :label="$t('_prop.purchase.purchase_plan_item.purchaseCount')"
+          prop="purchaseCount"
+          width="120"
+        />
+        <el-table-column :label="$t('_prop.purchase.purchase_plan_item.price')" prop="price" width="120" />
+        <el-table-column
+          :label="$t('_prop.purchase.purchase_plan_item.currentCount')"
+          prop="currentCount"
+          width="120"
+        />
+      </el-table>
+    </template>
+  </ExpandablePageableTable>
   <BaseFormWithTable
     ref="baseFormWithTableRef"
     v-model:visible="visible"
@@ -594,4 +629,23 @@ const mappingConfig: FieldMappingConfig = {
       </el-button>
     </template>
   </BaseTableForm>
+  <BaseItemDialog
+    :title="$t('_title.purchase.purchase_plan.showItem')"
+    v-model:visible="itemVisible"
+    :url="getItemUrl"
+    parent-param-name="planId"
+    v-model:parent-param-value="itemParentId"
+  >
+    <template #columns>
+      <el-table-column :label="$t('_prop.purchase.purchase_plan_item.partNumber')" prop="partNumber" width="150" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan.model')" prop="productSpecs" width="150" />
+      <el-table-column
+        :label="$t('_prop.purchase.purchase_plan_item.purchaseCount')"
+        prop="purchaseCount"
+        width="120"
+      />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan_item.price')" prop="price" width="120" />
+      <el-table-column :label="$t('_prop.purchase.purchase_plan_item.currentCount')" prop="currentCount" width="120" />
+    </template>
+  </BaseItemDialog>
 </template>