新增混炼示方选择弹窗及相关功能，支持规格选择与参照新增，优化用户交互体验。

2026-05-26 10:21:56 +08:00
parent a579f0e15c
commit 51cac2c17a
3 changed files with 390 additions and 17 deletions
--- a/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/MesXslMixingSpec.data.ts
+++ b/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/MesXslMixingSpec.data.ts
@@ -1185,3 +1185,62 @@ export const mixingSpecHistorySelectColumns: BasicColumn[] = [
  },
 ];
 //update-end---author:cursor ---date:20260526  for：【XSLMES-20260526-A58】参照历史混合步骤选择弹窗-----------
+
+//update-begin---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方及参照新增-----------
+/** 参照新增时需剔除的主表字段 */
+export const MIXING_SPEC_MAIN_STRIP_FIELDS = [
+  'id',
+  'createBy',
+  'createTime',
+  'updateBy',
+  'updateTime',
+  'draftBy',
+  'draftTime',
+  'proofreadBy',
+  'proofreadTime',
+  'auditBy',
+  'auditTime',
+  'approveBy',
+  'approveTime',
+  'changeDate',
+  'delFlag',
+  'tenantId',
+  'sysOrgCode',
+] as const;
+
+/** 参照新增时需剔除的明细字段 */
+export const MIXING_SPEC_CHILD_STRIP_FIELDS = [
+  'id',
+  'mixingSpecId',
+  'createBy',
+  'createTime',
+  'updateBy',
+  'updateTime',
+  'tenantId',
+] as const;
+
+/** 参照选中示方新增：复制除 ID 及审计字段外的全部数据 */
+export function cloneMixingSpecPageForReferenceAdd(source: Recordable = {}): Recordable {
+  const main: Recordable = { ...source };
+  MIXING_SPEC_MAIN_STRIP_FIELDS.forEach((key) => delete main[key]);
+  main.id = '';
+
+  const cloneChildList = (rows: Recordable[] = []) =>
+    normalizeMixingDetailRows(
+      (rows || []).map((row) => {
+        const next: Recordable = { ...row };
+        MIXING_SPEC_CHILD_STRIP_FIELDS.forEach((key) => delete next[key]);
+        delete next.baseUnitWeight;
+        return next;
+      }),
+    );
+
+  return {
+    ...main,
+    materialList: cloneChildList(source.materialList),
+    stepList: cloneChildList(source.stepList),
+    downStepList: cloneChildList(source.downStepList),
+    tcuList: cloneChildList(source.tcuList),
+  };
+}
+//update-end---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方及参照新增-----------
--- a/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/components/MesXslMixingSpecModal.vue
+++ b/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/components/MesXslMixingSpecModal.vue
@@ -20,7 +20,15 @@
          <tr>
            <th class="formTitle required" rowspan="3">规格</th>
            <td class="formValue" colspan="3" rowspan="3">
-              <a-input v-model:value="sheetForm.specName" :disabled="!showFooter" :bordered="false" class="form-input" />
+              <a-input
+                :value="sheetForm.specName"
+                readonly
+                placeholder="请点击选择混炼示方"
+                :disabled="!showFooter"
+                :bordered="false"
+                :class="['form-input', 'mixing-picker-input', { 'is-filled': !!sheetForm.specName }]"
+                @click="openSpecPicker"
+              />
            </td>
            <th class="formTitle" colspan="2">机台</th>
            <th class="formTitle" colspan="1">制作日期</th>
@@ -421,6 +429,7 @@
  <MesXslMixerPsCompileSelectModal @register="registerIssueNumberModal" @select="onIssueNumberSelect" />
  <MesXslMixingMaterialSelectModal @register="registerMixingMaterialModal" @select="onMixingMaterialSelect" />
  <MesXslMixingSpecStepHistorySelectModal @register="registerHistoryStepModal" @select="onHistoryStepSelect" />
+  <MesXslMixingSpecSelectModal @register="registerSpecPickerModal" @edit="onSpecPickerEdit" @referenceAdd="onSpecPickerReferenceAdd" />
 </template>

 <script lang="ts" setup>
@@ -471,6 +480,7 @@ import {
  calcMixingFillVolume,
  resolveMixingSpecificGravity,
  cloneMixingHistoryStepRows,
+  cloneMixingSpecPageForReferenceAdd,
  MIXING_MATERIAL_ROW_NUMBER_WIDTH,
  MIXING_MATERIAL_FOOTER_ROW_HEIGHT,
  MIXING_MATERIAL_MIN_COLUMN_WIDTH,
@@ -488,6 +498,7 @@ import { queryById as queryEquipmentById } from '/@/views/xslmes/mesXslEquipment
 import MesXslMixerPsCompileSelectModal from '/@/views/xslmes/mesXslMixerPsCompile/components/MesXslMixerPsCompileSelectModal.vue';
 import MesXslMixingMaterialSelectModal from './MesXslMixingMaterialSelectModal.vue';
 import MesXslMixingSpecStepHistorySelectModal from './MesXslMixingSpecStepHistorySelectModal.vue';
+import MesXslMixingSpecSelectModal from './MesXslMixingSpecSelectModal.vue';

 const emit = defineEmits(['register', 'success']);
 const { createMessage } = useMessage();
@@ -895,6 +906,9 @@ const [registerMixingMaterialModal, { openModal: openMixingMaterialModalInner, c
 //update-begin---author:cursor ---date:20260526  for：【XSLMES-20260526-A58】参照历史混合步骤选择弹窗-----------
 const [registerHistoryStepModal, { openModal: openHistoryStepModalInner, closeModal: closeHistoryStepModal, setModalProps: setHistoryStepModalProps }] = useModal();
 //update-end---author:cursor ---date:20260526  for：【XSLMES-20260526-A58】参照历史混合步骤选择弹窗-----------
+//update-begin---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方-----------
+const [registerSpecPickerModal, { openModal: openSpecPickerModalInner, closeModal: closeSpecPickerModal, setModalProps: setSpecPickerModalProps }] = useModal();
+//update-end---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方-----------

 //update-begin---author:cursor ---date:20260525  for：【XSLMES-20260525-A52】关闭混炼示方弹窗时同步关闭嵌套选料弹窗-----------
 function closeNestedPickers() {
@@ -902,6 +916,7 @@ function closeNestedPickers() {
  closeMachineModal();
  closeIssueNumberModal();
  closeHistoryStepModal();
+  closeSpecPickerModal();
  materialPickerRow.value = null;
 }
 //update-end---author:cursor ---date:20260525  for：【XSLMES-20260525-A52】关闭混炼示方弹窗时同步关闭嵌套选料弹窗-----------
@@ -931,6 +946,80 @@ function openIssueNumberPicker() {
  openIssueNumberModalInner(true, { psCompileId: mixerPsCompilePickerId.value || '' });
 }

+//update-begin---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方-----------
+function openSpecPicker() {
+  if (!showFooter.value) {
+    return;
+  }
+  setSpecPickerModalProps({ zIndex: 1500 });
+  openSpecPickerModalInner(true, { machineId: sheetForm.machineId || '' });
+}
+
+async function applyMixingSpecPageData(row: Recordable, mode: 'edit' | 'referenceAdd') {
+  const pageData = mode === 'referenceAdd' ? cloneMixingSpecPageForReferenceAdd(row) : row;
+  isUpdate.value = mode === 'edit';
+  Object.assign(sheetForm, pageData || {});
+  if (mode === 'referenceAdd') {
+    sheetForm.id = '';
+    const userInfo = userStore.getUserInfo || {};
+    refreshSignDisplay({
+      createBy_dictText: userInfo.realname,
+      createBy: userInfo.username,
+    });
+  } else {
+    refreshSignDisplay(pageData || {});
+  }
+  await loadMachineEffectiveVolume(sheetForm.machineId);
+  await loadMixerStepOptions(sheetForm.machineId);
+  await syncSheetToForm();
+  materialData.value = ensureMixingDetailRows(pageData?.materialList || [], DEFAULT_MIXING_MATERIAL_ROW_COUNT);
+  convertFactorApplying.value = true;
+  initMaterialBaseUnitWeights(materialData.value, sheetForm.convertFactor, true);
+  lastConvertFactor.value = normalizeMixingConvertFactor(sheetForm.convertFactor);
+  applyMaterialAccumWeight(materialData.value);
+  convertFactorApplying.value = false;
+  stepData.value = ensureMixingDetailRows(pageData?.stepList || [], DEFAULT_MIXING_STEP_ROW_COUNT);
+  downStepData.value = ensureMixingDetailRows(pageData?.downStepList || [], DEFAULT_MIXING_DOWN_STEP_ROW_COUNT);
+  tcuData.value = ensureTcuDefaultRows(pageData?.tcuList || []);
+}
+
+async function onSpecPickerEdit(payload: Recordable | null) {
+  if (!payload?.mixingSpecId) {
+    return;
+  }
+  try {
+    const raw = await queryById({ id: payload.mixingSpecId });
+    const row = (raw as Recordable)?.specName != null ? raw : (raw as Recordable)?.result;
+    if (!row?.id) {
+      createMessage.warning('未找到混炼示方数据');
+      return;
+    }
+    await applyMixingSpecPageData(row, 'edit');
+    createMessage.success(`已加载示方「${row.specName || ''}」`);
+  } catch {
+    createMessage.error('加载混炼示方失败');
+  }
+}
+
+async function onSpecPickerReferenceAdd(payload: Recordable | null) {
+  if (!payload?.mixingSpecId) {
+    return;
+  }
+  try {
+    const raw = await queryById({ id: payload.mixingSpecId });
+    const row = (raw as Recordable)?.specName != null ? raw : (raw as Recordable)?.result;
+    if (!row?.id) {
+      createMessage.warning('未找到混炼示方数据');
+      return;
+    }
+    await applyMixingSpecPageData(row, 'referenceAdd');
+    createMessage.success(`已参照示方「${row.specName || ''}」新增`);
+  } catch {
+    createMessage.error('参照混炼示方失败');
+  }
+}
+//update-end---author:cursor ---date:20260526  for：【XSLMES-20260526-A59】规格点击选择混炼示方-----------
+
 function onIssueNumberSelect(payload: Recordable | null) {
  if (!payload) {
    return;
@@ -1075,22 +1164,7 @@ const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data
  if (isUpdate.value && data?.record?.id) {
    const raw = await queryById({ id: data.record.id });
    const row = raw?.result || raw;
-    Object.assign(sheetForm, row || {});
-    refreshSignDisplay(row || {});
-    await loadMachineEffectiveVolume(sheetForm.machineId);
-    await loadMixerStepOptions(sheetForm.machineId);
-    await syncSheetToForm();
-    //update-begin---author:cursor ---date:20260522  for：【XSLMES-20260522-A39】编辑页明细补齐默认空行与新增一致-----------
-    materialData.value = ensureMixingDetailRows(row?.materialList || [], DEFAULT_MIXING_MATERIAL_ROW_COUNT);
-    convertFactorApplying.value = true;
-    initMaterialBaseUnitWeights(materialData.value, sheetForm.convertFactor, true);
-    lastConvertFactor.value = normalizeMixingConvertFactor(sheetForm.convertFactor);
-    applyMaterialAccumWeight(materialData.value);
-    convertFactorApplying.value = false;
-    stepData.value = ensureMixingDetailRows(row?.stepList || [], DEFAULT_MIXING_STEP_ROW_COUNT);
-    downStepData.value = ensureMixingDetailRows(row?.downStepList || [], DEFAULT_MIXING_DOWN_STEP_ROW_COUNT);
-    //update-end---author:cursor ---date:20260522  for：【XSLMES-20260522-A39】编辑页明细补齐默认空行与新增一致-----------
-    tcuData.value = ensureTcuDefaultRows(row?.tcuList || []);
+    await applyMixingSpecPageData(row, 'edit');
  } else {
    const userInfo = userStore.getUserInfo || {};
    //update-begin---author:cursor ---date:20260522  for：【XSLMES-20260522-A33】新增混炼示方制作日期默认当天-----------
@@ -1270,6 +1344,10 @@ async function handleSubmit() {
    cursor: pointer;
  }

+  :deep(.mixing-picker-input:not(.is-filled) input::placeholder) {
+    color: #bfbfbf;
+  }
+
  :deep(.mixing-picker-input.is-filled) {
    color: #262626;
  }
--- a/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/components/MesXslMixingSpecSelectModal.vue
+++ b/jeecgboot-vue3/src/views/xslmes/mesXslMixingSpec/components/MesXslMixingSpecSelectModal.vue
@@ -0,0 +1,236 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    title="选取混炼示方"
+    :width="960"
+    :zIndex="1500"
+    :showOkBtn="false"
+    :showCancelBtn="false"
+    wrapClassName="mixing-spec-picker-modal-wrap"
+    @register="registerModal"
+  >
+    <div class="mixing-spec-picker">
+      <div class="mixing-spec-picker-toolbar">
+        <span class="mixing-spec-picker-label">关键字</span>
+        <a-input
+          v-model:value="keyword"
+          allow-clear
+          placeholder="规格/用途/发行编号/机台"
+          style="width: 240px"
+          @pressEnter="reloadTable"
+        />
+        <span class="mixing-spec-picker-label">机台</span>
+        <a-select
+          v-model:value="machineId"
+          allow-clear
+          show-search
+          option-filter-prop="label"
+          placeholder="==请选择=="
+          style="width: 160px"
+          :options="machineOptions"
+          :loading="machineLoading"
+          :getPopupContainer="getSelectPopupContainer"
+          popupClassName="mixing-spec-picker-machine-dropdown"
+          @click.stop
+        />
+        <a-button type="primary" @click="reloadTable">搜索</a-button>
+      </div>
+      <BasicTable @register="registerTable" />
+    </div>
+    <template #footer>
+      <a-button @click="handleClose">关闭</a-button>
+      <a-button type="primary" :loading="confirmLoading" @click="handleConfirm">确认</a-button>
+      <a-button type="primary" :loading="referenceLoading" @click="handleReferenceAdd">参照选中示方新增</a-button>
+    </template>
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicTable, useTable } from '/@/components/Table';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { list as mixingSpecList, queryById as queryMixingSpecById } from '../MesXslMixingSpec.api';
+  import { mixingSpecHistorySelectColumns } from '../MesXslMixingSpec.data';
+  import { list as equipmentList } from '/@/views/xslmes/mesXslEquipmentLedger/MesXslEquipmentLedger.api';
+
+  const emit = defineEmits(['register', 'edit', 'referenceAdd']);
+
+  const { createMessage } = useMessage();
+
+  const keyword = ref('');
+  const machineId = ref<string | undefined>(undefined);
+  const machineOptions = ref<Array<{ label: string; value: string }>>([]);
+  const machineLoading = ref(false);
+  const confirmLoading = ref(false);
+  const referenceLoading = ref(false);
+  const selectedRow = ref<Recordable | null>(null);
+
+  function getSelectPopupContainer() {
+    return document.body;
+  }
+
+  const [registerTable, { reload, getSelectRowKeys, getSelectRows, setSelectedRowKeys, clearSelectedRowKeys }] = useTable({
+    api: mixingSpecList,
+    columns: mixingSpecHistorySelectColumns,
+    rowKey: 'id',
+    useSearchForm: false,
+    pagination: { pageSize: 30 },
+    canResize: false,
+    showIndexColumn: true,
+    immediate: false,
+    beforeFetch: (params) => ({
+      ...params,
+      keyword: keyword.value?.trim() || undefined,
+      machineId: machineId.value || undefined,
+    }),
+    rowSelection: {
+      type: 'radio',
+      columnWidth: 48,
+      onChange: (_keys, rows) => {
+        selectedRow.value = rows?.[0] ?? null;
+      },
+    },
+    clickToRowSelect: true,
+  });
+
+  async function loadMachineOptions() {
+    machineLoading.value = true;
+    try {
+      const optionMap = new Map<string, { label: string; value: string }>();
+      const raw = await mixingSpecList({ pageNo: 1, pageSize: 500 });
+      const page = (raw as Recordable)?.records != null ? raw : (raw as Recordable)?.result;
+      const specRecords = ((page?.records || page || []) as Recordable[]).filter(Boolean);
+      specRecords.forEach((row) => {
+        if (!row?.machineId) {
+          return;
+        }
+        const value = String(row.machineId);
+        optionMap.set(value, {
+          value,
+          label: row.machineName || value,
+        });
+      });
+      if (!optionMap.size) {
+        const eqRaw = await equipmentList({ pageNo: 1, pageSize: 500 });
+        const eqPage = (eqRaw as Recordable)?.records != null ? eqRaw : (eqRaw as Recordable)?.result;
+        const eqRecords = ((eqPage?.records || eqPage || []) as Recordable[]).filter(Boolean);
+        eqRecords.forEach((row) => {
+          if (!row?.id) {
+            return;
+          }
+          const value = String(row.id);
+          optionMap.set(value, {
+            value,
+            label: row.equipmentName || row.equipmentCode || value,
+          });
+        });
+      }
+      machineOptions.value = Array.from(optionMap.values()).sort((a, b) =>
+        a.label.localeCompare(b.label, 'zh-CN'),
+      );
+    } catch {
+      machineOptions.value = [];
+    } finally {
+      machineLoading.value = false;
+    }
+  }
+
+  function reloadTable() {
+    reload();
+  }
+
+  async function resolveSelectedRow(): Promise<Recordable | null> {
+    const keys = (getSelectRowKeys?.() || []) as string[];
+    let row = selectedRow.value || ((getSelectRows?.() || []) as Recordable[])[0];
+    if (!row?.id && keys.length) {
+      try {
+        const raw = await queryMixingSpecById({ id: keys[0] });
+        row = (raw as Recordable)?.specName != null ? raw : (raw as Recordable)?.result;
+      } catch {
+        row = null;
+      }
+    }
+    return row?.id ? row : null;
+  }
+
+  function handleClose() {
+    closeModal();
+  }
+
+  async function handleConfirm() {
+    const row = await resolveSelectedRow();
+    if (!row) {
+      createMessage.warning('请选择一条混炼示方');
+      return;
+    }
+    confirmLoading.value = true;
+    try {
+      emit('edit', {
+        mixingSpecId: row.id,
+        specName: row.specName || '',
+      });
+      closeModal();
+    } finally {
+      confirmLoading.value = false;
+    }
+  }
+
+  async function handleReferenceAdd() {
+    const row = await resolveSelectedRow();
+    if (!row) {
+      createMessage.warning('请选择一条混炼示方');
+      return;
+    }
+    referenceLoading.value = true;
+    try {
+      emit('referenceAdd', {
+        mixingSpecId: row.id,
+        specName: row.specName || '',
+      });
+      closeModal();
+    } finally {
+      referenceLoading.value = false;
+    }
+  }
+
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    keyword.value = '';
+    machineId.value = data?.machineId || undefined;
+    selectedRow.value = null;
+    confirmLoading.value = false;
+    referenceLoading.value = false;
+    clearSelectedRowKeys?.();
+    setModalProps({ confirmLoading: false });
+    await loadMachineOptions();
+    reload();
+  });
+</script>
+
+<style lang="less" scoped>
+  .mixing-spec-picker-toolbar {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+
+  .mixing-spec-picker-label {
+    color: #333;
+    font-size: 13px;
+    white-space: nowrap;
+  }
+</style>
+
+<style lang="less">
+  .mixing-spec-picker-modal-wrap {
+    .ant-modal {
+      top: 40px;
+    }
+  }
+
+  .mixing-spec-picker-machine-dropdown {
+    z-index: 2100 !important;
+  }
+</style>