feat: 完成成品出货单。

src/views/production/finished-product-shipment/FinishedProductShipmentView.vue

@@ -1,18 +1,20 @@
 <script lang="ts" setup>
-import BasePageableTable from "@/components/base/base-pageable-table/BasePageableTable.vue";
 import DefaultToolButton from "@/components/base/default-tool-button/DefaultToolButton.vue";
 import DefaultOperateButtonColumn from "@/components/base/default-column/DefaultOperateButtonColumn.vue";
 import DefaultStatusSwitchColumn from "@/components/base/default-column/DefaultStatusSwitchColumn.vue";
 import { usePage } from "@/composables/use-page";
 import BaseFormWithTable from "@/components/base/base-form-with-table/BaseFormWithTable.vue";
+import BaseItemDialog from "@/components/base/base-item-dialog/BaseItemDialog.vue";
 import { $t } from "@/common/languages";
 import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from "element-plus";
 import { formatDate } from "@/common/utils/format-utils";
-import BaseItemDialog from "@/components/base/base-item-dialog/BaseItemDialog.vue";
 import BaseSelect from "@/components/base/base-select/BaseSelect.vue";
 import { generateDucumentNo } from "@/common/utils/document-no-generator/document-no-generator";
 import { get, post } from "@/common/http/request";
 import { useStatus } from "@/common/languages/mapping/base-info-mapping";
+import ExpandablePageableTable from "@/components/base/expandable-pageable-table/ExpandablePageableTable.vue";
+import { type FieldMappingConfig } from "@/components/base/base-form-with-table/type";
+import { watch } from "vue";
 
 /**
  * 必须要的变量
@@ -23,11 +25,10 @@ const addUrl = "/production/finishedproductshipment/addFinishedProductShipment";
 const editUrl = "/production/finishedproductshipment/updateFinishedProductShipment";
 const removeUrl = "/production/finishedproductshipment/deleteFinishedProductShipment";
 const approveUrl = "/production/finishedproductshipment/approveFinishedProductShipment";
-const unapproveUrl = "/production/finishedproductshipment/unapproveFinishedProductShipment";
+const rejectUrl = "/production/finishedproductshipment/rejectFinishedProductShipment";
 const getDetailUrl = "/production/finishedproductshipment/getFinishedProductShipmentDetail";
-const importItemsUrl = "/production/finishedproductshipment/importFinishedProductShipmentItems";
 const getWarehouseSelectListUrl = "/warehouse/warehouse/getWarehouseSelectList";
-const itemArrayName = "deviceItems";
+const itemArrayName = "shipmentItems";
 const searchers = [
   { name: "searchCode", type: "text" as const, placeholder: $t("_prop.production.finishedproductshipment.formCode") },
   { name: "formName", type: "text" as const, placeholder: $t("_prop.production.finishedproductshipment.formName") },
@@ -42,12 +43,15 @@ const rules = reactive<FormRules>({
   storeNo: [
     { required: true, message: $t("_message.production.finishedproductshipment.select_storeId"), trigger: "blur" },
   ],
-  deviceItems: [
+  outStockType: [
+    { required: true, message: $t("_message.production.finishedproductshipment.select_outStockType"), trigger: "blur" },
+  ],
+  shipmentItems: [
     {
       required: true,
       validator: (rule, value, callback) => {
         if (value === undefined || value.length === 0) {
-          callback($t("_message.production.finishedproductshipment.no_module_sn_items"));
+          callback($t("_message.production.finishedproductshipment.no_shipment_items"));
         }
         callback();
       },
@@ -55,15 +59,55 @@ const rules = reactive<FormRules>({
     },
   ],
 });
+
+const outStockTypeOptions = [
+  { label: $t("_enum.outStockType.material"), value: 1 },
+  { label: $t("_enum.outStockType.finishedProduct"), value: 2 },
+];
+
+const mappingConfig: FieldMappingConfig = {
+  partNumber: {
+    sourceKey: "物料编号",
+    defaultValue: "",
+  },
+  productCount: {
+    sourceKey: "数量",
+    defaultValue: 0,
+    transform: (val: any) => {
+      const num = Number(val);
+      return isNaN(num) ? 0 : num;
+    },
+  },
+  productMark: {
+    sourceKey: "备注",
+    defaultValue: "",
+  },
+};
+
 /**
  * 基本不变通用变量
  */
-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, itemVisible, itemParentId } = useGeneralPageRef();
-const baseFormWithTableRef = ref<InstanceType<typeof BaseFormWithTable>>();
 const warehouseSelectRef = ref<InstanceType<typeof BaseSelect>>();
 const { getFormStatusLabel } = useStatus();
+
+/**
+ * 根据 formType 获取出库类型标签
+ * formType = 4 (WAREHOUSE_ISSUE) -> 物料出库
+ * formType = 7 (FINISHED_PRODUCT_SHIPMENT) -> 成品出库
+ */
+const getOutStockTypeLabelByFormType = (formTypeValue: number) => {
+  if (formTypeValue === 4) {
+    return outStockTypeOptions.find(opt => opt.value === 1)?.label || "";
+  }
+  if (formTypeValue === 7) {
+    return outStockTypeOptions.find(opt => opt.value === 2)?.label || "";
+  }
+  return "";
+};
+
 /**
  * 可以自定义的变量
  */
@@ -71,19 +115,37 @@ const { getFormStatusLabel } = useStatus();
 const add = () => {
   form.value = {};
   title.value = "_title.production.finishedproductshipment.add";
-  form.value["formCode"] = generateDucumentNo("CPCK");
   visible.value = true;
   formType.value = false;
+  // 默认生成成品出库单号
+  form.value["formCode"] = generateDucumentNo("CPCK");
 };
+
+// 监听出库类型变化，动态生成单号
+watch(
+  () => form.value?.outStockType,
+  newVal => {
+    if (newVal === 1) {
+      // 物料出库 - 使用 WarehouseIssue (4) 的单号前缀
+      form.value["formCode"] = generateDucumentNo("CK");
+    } else if (newVal === 2) {
+      // 成品出库 - 使用 FinishedProductShipment (7) 的单号前缀
+      form.value["formCode"] = generateDucumentNo("CPCK");
+    }
+  }
+);
+
 const edit = (row: any) => {
   title.value = "_title.production.finishedproductshipment.edit";
   form.value = { ...row };
   visible.value = true;
   formType.value = true;
 };
+
 const remove = (row: any) => {
   useRemove(removeUrl, row.id, "_message.production.finishedproductshipment.delete_message");
 };
+
 const approve = (row: any) => {
   ElMessageBox.confirm($t("_message.production.finishedproductshipment.approve_confirm"), $t("_level.warning"), {
     confirmButtonText: $t("_button.confirm"),
@@ -99,14 +161,15 @@ const approve = (row: any) => {
     }
   });
 };
-const unapprove = (row: any) => {
+
+const reject = (row: any) => {
   ElMessageBox.confirm($t("_message.production.finishedproductshipment.reject_confirm"), $t("_level.warning"), {
     confirmButtonText: $t("_button.confirm"),
     cancelButtonText: $t("_button.cancel"),
     type: "warning",
   }).then(async () => {
     try {
-      await post(unapproveUrl, { id: row.id });
+      await post(rejectUrl, { id: row.id });
       ElMessage.success($t("_message.production.finishedproductshipment.reject_success"));
       tableRef.value?.reload();
     } catch (err: any) {
@@ -114,10 +177,12 @@ const unapprove = (row: any) => {
     }
   });
 };
+
 const showItem = (row: any) => {
   itemParentId.value = row.id;
   itemVisible.value = true;
 };
+
 const submit = (form: any, formRef: FormInstance | undefined) => {
   setName();
   if (formRef !== undefined) {
@@ -129,6 +194,7 @@ const submit = (form: any, formRef: FormInstance | undefined) => {
     });
   }
 };
+
 const topButtonClick = (eventName: string) => {
   switch (eventName) {
     case "add":
@@ -136,6 +202,7 @@ const topButtonClick = (eventName: string) => {
       break;
   }
 };
+
 const operateButtonClick = (eventName: string, row: any) => {
   switch (eventName) {
     case "edit":
@@ -147,39 +214,78 @@ const operateButtonClick = (eventName: string, row: any) => {
     case "approve":
       approve(row);
       break;
-    case "unapprove":
-      unapprove(row);
+    case "reject":
+      reject(row);
       break;
     case "showItem":
       showItem(row);
       break;
   }
 };
+
+const authShowFunc = (row: any, button: globalThis.ButtonProp) => {
+  // 已审核(formStatus=1)时不显示审核按钮，显示反审按钮
+  // 未审核(formStatus=0)时显示审核按钮，不显示反审按钮
+  if (row.formStatus === 0 && button.eventName === "reject") return false;
+  if (row.formStatus === 1 && button.eventName === "approve") return false;
+  // 已审核后不能编辑和删除
+  if (row.formStatus === 1 && (button.eventName === "edit" || button.eventName === "remove")) return false;
+  return true;
+};
+
 const setName = () => {
   form.value["storeName"] = warehouseSelectRef.value?.getLabel();
 };
+
 const handleReset = () => {
   form.value["formCode"] = generateDucumentNo("CPCK");
 };
 </script>
 <template>
-  <BasePageableTable :url="getPageUrl" :searchers="searchers" ref="tableRef">
+  <ExpandablePageableTable
+    :url="getPageUrl"
+    :searchers="searchers"
+    ref="tableRef"
+    :item-url="getDetailUrl"
+    item-id-key="id"
+    item-id-name="id"
+    itemFieldName="shipmentItems"
+  >
     <template #tool-button>
       <DefaultToolButton @top-button-click="topButtonClick" />
     </template>
     <template #columns>
       <el-table-column :label="$t('_prop.production.finishedproductshipment.formCode')" prop="formCode" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.formName')" prop="formName" />
       <el-table-column :label="$t('_prop.production.finishedproductshipment.storeName')" prop="storeName" />
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.formName')" prop="formName" />
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.outStockType')" prop="formType">
+        <template #default="{ row }">
+          {{ getOutStockTypeLabelByFormType(row.formType) }}
+        </template>
+      </el-table-column>
       <el-table-column :label="$t('_prop.production.finishedproductshipment.formMark')" prop="formMark" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.totalValue')" prop="totalValue" />
       <el-table-column :label="$t('_prop.common.createDate')" prop="createDate" :formatter="formatDate" />
       <DefaultStatusSwitchColumn status-param-name="formStatus" :status-label-mapping="getFormStatusLabel" />
-      <DefaultOperateButtonColumn @operate-button-click="operateButtonClick" />
+      <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.production.finishedproductshipment.partNumber')"
+          prop="partNumber"
+          width="150"
+        />
+        <el-table-column
+          :label="$t('_prop.production.finishedproductshipment.productSpecs')"
+          prop="productSpecs"
+          width="200"
+        />
+        <el-table-column :label="$t('_prop.production.finishedproductshipment.productCount')" prop="productCount" />
+        <el-table-column :label="$t('_prop.production.finishedproductshipment.productMark')" prop="productMark" />
+      </el-table>
+    </template>
+  </ExpandablePageableTable>
   <BaseFormWithTable
-    ref="baseFormWithTableRef"
     v-model:visible="visible"
     @submit="submit"
     v-model:form="form"
@@ -188,8 +294,8 @@ const handleReset = () => {
     :base-title="$t('_title.production.finishedproductshipment.baseTitle')"
     :table-title="$t('_title.production.finishedproductshipment.tableTitle')"
     :item-array-name="itemArrayName"
-    upload-desc="设备信息"
-    :import-url="importItemsUrl"
+    upload-desc="物料信息"
+    :mapping-config="mappingConfig"
     @reset="handleReset"
   >
     <template #form-items>
@@ -221,6 +327,21 @@ const handleReset = () => {
             <BaseSelect v-model="form.storeNo" :url="getWarehouseSelectListUrl" ref="warehouseSelectRef" />
           </el-form-item>
         </el-col>
+        <el-col :span="12">
+          <el-form-item :label="$t('_prop.production.finishedproductshipment.outStockType')" prop="outStockType">
+            <el-select
+              v-model="form.outStockType"
+              :placeholder="$t('_message.production.finishedproductshipment.select_outStockType')"
+            >
+              <el-option
+                v-for="item in outStockTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
       </el-row>
       <el-form-item :label="$t('_prop.production.finishedproductshipment.formMark')" prop="formMark">
         <el-input
@@ -232,109 +353,39 @@ const handleReset = () => {
       </el-form-item>
     </template>
     <template #form-table-columns>
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.productType')" width="150">
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.partNumber')" width="150">
         <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.productType`">
+          <el-form-item :prop="`${itemArrayName}.${$index}.partNumber`">
             <el-input
-              v-model="row.productType"
+              v-model="row.partNumber"
               size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_productType')"
+              :placeholder="$t('_message.production.finishedproductshipment.input_partNumber')"
             />
           </el-form-item>
         </template>
       </el-table-column>
 
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.productSn')" width="150">
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.productSpecs')" width="200">
+        <template #default="{ row }">
+          <span>{{ row.productSpecs }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.productCount')" width="150">
         <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.productSn`">
-            <el-input
-              v-model="row.productSn"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_productSn')"
-            />
+          <el-form-item :prop="`${itemArrayName}.${$index}.productCount`">
+            <el-input-number v-model="row.productCount" size="small" :min="1" />
           </el-form-item>
         </template>
       </el-table-column>
 
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.mac')" width="150">
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.productMark')" width="200">
         <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.mac`">
+          <el-form-item :prop="`${itemArrayName}.${$index}.productMark`">
             <el-input
-              v-model="row.mac"
+              v-model="row.productMark"
               size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_mac')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.serialNum')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.serialNum`">
-            <el-input
-              v-model="row.serialNum"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_serialNum')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.softVersion')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.softVersion`">
-            <el-input
-              v-model="row.softVersion"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_softVersion')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alVersion')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.alVersion`">
-            <el-input
-              v-model="row.alVersion"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_alVersion')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alNum')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.alNum`">
-            <el-input
-              v-model="row.alNum"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_alNum')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alTxt')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.alTxt`">
-            <el-input
-              v-model="row.alTxt"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_alTxt')"
-            />
-          </el-form-item>
-        </template>
-      </el-table-column>
-
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.mark')" width="150">
-        <template #default="{ row, $index }">
-          <el-form-item :prop="`${itemArrayName}.${$index}.mark`">
-            <el-input
-              v-model="row.mark"
-              size="small"
-              :placeholder="$t('_message.production.finishedproductshipment.input_mark')"
+              :placeholder="$t('_message.production.finishedproductshipment.input_productMark')"
             />
           </el-form-item>
         </template>
@@ -349,15 +400,18 @@ const handleReset = () => {
     v-model:parent-param-value="itemParentId"
   >
     <template #columns>
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.productType')" prop="productType" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.productSn')" prop="productSn" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.mac')" prop="mac" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.serialNum')" prop="serialNum" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.softVersion')" prop="softVersion" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alVersion')" prop="alVersion" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alNum')" prop="alNum" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.alTxt')" prop="alTxt" />
-      <el-table-column :label="$t('_prop.production.finishedproductshipment.mark')" prop="mark" />
+      <el-table-column
+        :label="$t('_prop.production.finishedproductshipment.partNumber')"
+        prop="partNumber"
+        width="150"
+      />
+      <el-table-column
+        :label="$t('_prop.production.finishedproductshipment.productSpecs')"
+        prop="productSpecs"
+        width="200"
+      />
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.productCount')" prop="productCount" />
+      <el-table-column :label="$t('_prop.production.finishedproductshipment.productMark')" prop="productMark" />
     </template>
   </BaseItemDialog>
 </template>