优化配送订单收货地址联动显示

2026-08-13 22:50:37 +08:00
parent 457bcfb450
commit 029724a46c
12 changed files with 367 additions and 116 deletions
--- a/frontend/platform_admin/src/views/resource/ResourceFieldForm.vue
+++ b/frontend/platform_admin/src/views/resource/ResourceFieldForm.vue
@@ -90,7 +90,7 @@
        <a-select
          v-else
          v-model="model[field.key]"
-          :disabled="disabledSet.has(field.key)"
+          :disabled="disabledSet.has(field.key) || relationRequiresParent(field)"
          :multiple="field.type === 'identity-list'"
          :placeholder="field.placeholder"
          :loading="relationLoading[field.relation ?? '']"
@@ -106,6 +106,9 @@
          >
            {{ relationOptionLabel(field, option) }}
          </a-option>
+          <template #empty>
+            <div class="relation-empty">{{ relationEmptyText(field) }}</div>
+          </template>
        </a-select>
        <div
          v-if="disabledSet.has(field.key) && (field.showIdentityCopy || field.staffRelation?.showIdentityCopy) && !field.readonlyRelationText && model[field.key]"
@@ -191,6 +194,27 @@ function readonlyRelationLabel(field: ResourceField) {
  return option ? relationOptionLabel(field, option) : identity;
 }

+/** 父级尚未选择时禁用联动下拉，避免用户误以为可以跨合同选择。 */
+function relationRequiresParent(field: ResourceField) {
+  const linkage = field.relationLinkage;
+  return Boolean(
+    linkage?.requiresParent &&
+      !String(model.value[linkage.parentKey] ?? '').trim(),
+  );
+}
+
+/** 根据父级和候选状态给出明确的关联选择引导。 */
+function relationEmptyText(field: ResourceField) {
+  if (relationRequiresParent(field)) {
+    const parentName =
+      field.relationLinkage?.parentKey === 'gasorder_contract_identity'
+        ? '配送合同'
+        : '上级数据';
+    return `请先选择${parentName}`;
+  }
+  return field.relationEmptyText ?? '暂无数据';
+}
+
 /** 为历史未知编码补充只读选项，避免下拉框退回显示原始值。 */
 function selectOptions(field: ResourceField) {
  const options = [...(field.options ?? [])];
--- a/frontend/platform_admin/src/views/resource/ResourceRecordPage.vue
+++ b/frontend/platform_admin/src/views/resource/ResourceRecordPage.vue
@@ -124,6 +124,14 @@
          >
            当前归属只能选择库房、气站、配送点或用户中的一个；选择新归属时会自动清空其他归属。
          </a-alert>
+          <a-alert
+            v-if="relationUnavailableMessage"
+            class="workflow-alert"
+            type="warning"
+            show-icon
+          >
+            {{ relationUnavailableMessage }}
+          </a-alert>
          <a-form :model="form" layout="vertical">
            <ResourceFieldForm
              v-model="form"
@@ -143,7 +151,7 @@
            />
          </a-form>
          <div class="form-actions">
-            <a-button type="primary" :loading="saving" @click="save">保存</a-button>
+            <a-button type="primary" :loading="saving" :disabled="Boolean(relationUnavailableMessage)" @click="save">保存</a-button>
            <a-button :disabled="saving" @click="cancelForm">取消</a-button>
          </div>
        </div>
@@ -258,6 +266,9 @@ const staffOwnerGuard = useStaffCredentialOwnerGuard({
 const resolvedStaffType = staffOwnerGuard.resolvedStaffType;
 const relations = staffOwnerGuard.relations;
 const relationLinkage = useResourceRelationLinkage(form, relations);
+const relationUnavailableMessage = computed(() =>
+  relationLinkage.unavailableMessage(),
+);
 const productOwnershipKeys = [
  'warehouse_identity',
  'gas_basic_identity',
--- a/frontend/platform_admin/src/views/resource/use-resource-relation-linkage.ts
+++ b/frontend/platform_admin/src/views/resource/use-resource-relation-linkage.ts
@@ -1,6 +1,6 @@
 /**
- * 功能：协调资源表单中显式启用的父子关联下拉、搜索和保存前校验。
- * 版本：v1.0.0
+ * 功能：协调资源表单中显式启用的多组父子关联下拉、搜索和保存前校验。
+ * 版本：v1.1.0
 */
 import { Message } from '@arco-design/web-vue';
 import type { ResourceField } from '@/api/resources';
@@ -24,7 +24,7 @@ export function useResourceRelationLinkage(
  form: Record<string, any>,
  relations: ResourceRelations,
 ) {
-  let active: ActiveLinkage | undefined;
+  let active: ActiveLinkage[] = [];
  let organizationStaffField: ResourceField | undefined;
  let initialized = false;

@@ -34,21 +34,19 @@ export function useResourceRelationLinkage(
    );
  }

+  /** 收集页面内全部显式联动，允许一个父字段同时驱动多个业务子项。 */
  function configure(fields: ResourceField[]) {
-    const childField = fields.find((field) => field.relationLinkage);
+    active = fields
+      .filter((field) => field.relationLinkage)
+      .map((childField) => ({
+        childField,
+        parentField: fields.find(
+          (field) => field.key === childField.relationLinkage?.parentKey,
+        ),
+      }));
    organizationStaffField = fields.find(
      (field) => field.staffRelation?.organizationScoped,
    );
-    if (!childField?.relationLinkage) {
-      active = undefined;
-      return;
-    }
-    active = {
-      childField,
-      parentField: fields.find(
-        (field) => field.key === childField.relationLinkage?.parentKey,
-      ),
-    };
  }

  function staffRequest() {
@@ -94,62 +92,63 @@ export function useResourceRelationLinkage(
    await reloadStaffOptions();
  }

-  function childRequest() {
-    if (!active?.childField.relationLinkage) return {};
-    const linkage = active.childField.relationLinkage;
+  function childRequest(linkageItem: ActiveLinkage) {
+    const linkage = linkageItem.childField.relationLinkage;
+    if (!linkage) return {};
    const parentIdentity = relationIdentity(form[linkage.parentKey]);
-    const childIdentity = relationIdentity(form[active.childField.key]);
+    const rawChildValue = form[linkageItem.childField.key];
+    const childIdentities = (Array.isArray(rawChildValue)
+      ? rawChildValue
+      : [rawChildValue]
+    )
+      .map(relationIdentity)
+      .filter(Boolean);
    return {
      filters: linkedRelationFilters(parentIdentity, linkage.filterKey),
-      preserveIdentities: childIdentity ? [childIdentity] : [],
+      preserveIdentities: childIdentities,
    };
  }

-  async function reloadChildOptions() {
-    const childField = active?.childField;
-    const resource = childField?.relation;
-    if (!resource) return;
+  /** 加载一组子选项，并在配置要求时自动选中默认业务记录。 */
+  async function reloadChildOptions(linkageItem: ActiveLinkage) {
+    const childField = linkageItem.childField;
+    const linkage = childField.relationLinkage;
+    const resource = childField.relation;
+    if (!linkage || !resource) return;
+    const parentIdentity = relationIdentity(form[linkage.parentKey]);
+    if (linkage.requiresParent && !parentIdentity) {
+      relations.clear(resource);
+      return;
+    }
    relations.cancelSearch(resource);
-    await relations.loadField(childField, '', childRequest());
+    await relations.loadField(childField, '', childRequest(linkageItem));
+    if (
+      !relationIdentity(form[childField.key]) &&
+      childField.relationAutoSelectKey
+    ) {
+      const defaultOption = (relations.options[resource] ?? []).find(
+        (option) => Boolean(option[childField.relationAutoSelectKey as string]),
+      );
+      if (defaultOption) {
+        form[childField.key] = relationIdentity(defaultOption.identity);
+      }
+    }
  }

-  /** 预加载普通关联项，并单独按父级条件加载启用联动的子选项。 */
+  /** 预加载普通关联项，并分别按父级条件加载所有启用联动的子选项。 */
  async function preload(fields: ResourceField[]) {
    initialized = false;
    configure(fields);
-    if (!active?.childField.relationLinkage || !active.childField.relation) {
-      await relations.preload(
-        fields.filter((field) => field.key !== organizationStaffField?.key),
-      );
-      await relations.ensureValues(fields, form);
-      await reloadStaffOptions();
-      initialized = true;
-      return;
-    }
-
+    const linkedChildKeys = new Set(active.map((item) => item.childField.key));
    await relations.preload(
      fields.filter(
        (field) =>
-          field.key !== active?.childField.key &&
+          !linkedChildKeys.has(field.key) &&
          field.key !== organizationStaffField?.key,
      ),
    );
-    const linkage = active.childField.relationLinkage;
-    const parentIdentity = relationIdentity(form[linkage.parentKey]);
-    const childIdentity = relationIdentity(form[active.childField.key]);
-    if (parentIdentity && active.parentField?.relation) {
-      await relations.ensure(active.parentField.relation, parentIdentity);
-    }
-    if (childIdentity) {
-      await relations.ensure(active.childField.relation, childIdentity);
-    }
-    const staffIdentity = relationIdentity(
-      organizationStaffField ? form[organizationStaffField.key] : '',
-    );
-    if (staffIdentity && organizationStaffField?.relation) {
-      await relations.ensure(organizationStaffField.relation, staffIdentity);
-    }
-    await reloadChildOptions();
+    await relations.ensureValues(fields, form);
+    await Promise.all(active.map((item) => reloadChildOptions(item)));
    await reloadStaffOptions();
    initialized = true;

@@ -157,58 +156,61 @@ export function useResourceRelationLinkage(
    if (warning) Message.warning(`当前组织归属需要确认：${warning}`);
  }

-  async function handleParentChange(parentIdentity: string) {
-    if (!active?.childField.relationLinkage || !active.childField.relation)
-      return;
-    const linkage = active.childField.relationLinkage;
-    const childIdentity = relationIdentity(form[active.childField.key]);
+  async function handleParentChange(
+    linkageItem: ActiveLinkage,
+    parentIdentity: string,
+  ) {
+    const childField = linkageItem.childField;
+    const linkage = childField.relationLinkage;
+    if (!linkage || !childField.relation) return;
+    const childIdentity = relationIdentity(form[childField.key]);
+    if (linkage.filterOnly) relations.clear(childField.relation);
    if (linkage.filterOnly && childIdentity) {
-      form[active.childField.key] = '';
-      Message.info('合同已变更，请重新选择该合同可绑定的气瓶');
+      form[childField.key] = childField.type === 'identity-list' ? [] : '';
+      Message.info(
+        linkage.parentChangeMessage ?? '上级数据已变更，请重新选择关联数据',
+      );
    }
    if (childIdentity && !linkage.filterOnly) {
      const option =
-        findOption(active.childField.relation, childIdentity) ??
-        (await relations.ensure(active.childField.relation, childIdentity));
+        findOption(childField.relation, childIdentity) ??
+        (await relations.ensure(childField.relation, childIdentity));
      if (
        relationIdentity(form[linkage.parentKey]) !== parentIdentity ||
-        relationIdentity(form[active.childField.key]) !== childIdentity
+        relationIdentity(form[childField.key]) !== childIdentity
      ) {
        return;
      }
      if (
        shouldClearLinkedOption(parentIdentity, option, linkage.optionParentKey)
      ) {
-        form[active.childField.key] = '';
-        Message.info('所属气站已变更，请重新选择配送点');
+        form[childField.key] = '';
+        Message.info(
+          linkage.parentChangeMessage ?? '所属气站已变更，请重新选择配送点',
+        );
      }
    }
-    await reloadChildOptions();
+    await reloadChildOptions(linkageItem);
  }

-  async function handleChildChange(childIdentity: string) {
-    if (!active?.childField.relationLinkage || !active.childField.relation)
+  async function handleChildChange(
+    linkageItem: ActiveLinkage,
+    childIdentity: string,
+  ) {
+    const childField = linkageItem.childField;
+    const linkage = childField.relationLinkage;
+    if (!linkage || !childField.relation || !childIdentity || linkage.filterOnly)
      return;
-    const linkage = active.childField.relationLinkage;
-    if (!childIdentity) return;
-    if (linkage.filterOnly) return;
    const option =
-      findOption(active.childField.relation, childIdentity) ??
-      (await relations.ensure(active.childField.relation, childIdentity));
-    if (
-      !option ||
-      relationIdentity(form[active.childField.key]) !== childIdentity
-    ) {
-      return;
-    }
+      findOption(childField.relation, childIdentity) ??
+      (await relations.ensure(childField.relation, childIdentity));
+    if (!option || relationIdentity(form[childField.key]) !== childIdentity) return;
    if (linkage.backfillParent) {
      const nextParent = optionParentIdentity(option, linkage.optionParentKey);
      const currentParent = relationIdentity(form[linkage.parentKey]);
-      if (nextParent && active.parentField?.relation) {
-        await relations.ensure(active.parentField.relation, nextParent);
-        if (relationIdentity(form[active.childField.key]) !== childIdentity) {
-          return;
-        }
+      if (nextParent && linkageItem.parentField?.relation) {
+        await relations.ensure(linkageItem.parentField.relation, nextParent);
+        if (relationIdentity(form[childField.key]) !== childIdentity) return;
      }
      if (currentParent !== nextParent) {
        form[linkage.parentKey] = nextParent;
@@ -217,29 +219,41 @@ export function useResourceRelationLinkage(
        }
      }
    }
-    await reloadChildOptions();
+    await reloadChildOptions(linkageItem);
  }

  /** 响应用户主动修改关联字段；初始化回显不会触发自动清理。 */
  async function change(field: ResourceField, value: unknown) {
-    if (!initialized || !active?.childField.relationLinkage) return;
+    if (!initialized) return;
    const identity = relationIdentity(value);
-    if (field.key === active.childField.relationLinkage.parentKey) {
-      await handleParentChange(identity);
-      await synchronizeStaff();
-    } else if (field.key === active.childField.key) {
-      await handleChildChange(identity);
-      await synchronizeStaff();
-    } else if (field.key === organizationStaffField?.key) {
+    const parentLinkages = active.filter(
+      (item) => item.childField.relationLinkage?.parentKey === field.key,
+    );
+    await Promise.all(
+      parentLinkages.map((item) => handleParentChange(item, identity)),
+    );
+    const childLinkage = active.find((item) => item.childField.key === field.key);
+    if (childLinkage) await handleChildChange(childLinkage, identity);
+    if (
+      field.key === 'gas_basic_identity' ||
+      field.key === 'delivery_basic_identity' ||
+      field.key === organizationStaffField?.key
+    ) {
      await synchronizeStaff();
    }
  }

-  /** 搜索联动子项时始终保留父级过滤和当前选项。 */
+  /** 搜索联动子项时始终保留对应父级过滤和当前选项。 */
  function search(field: ResourceField, keyword: string) {
    if (!field.relation) return;
-    if (field.key === active?.childField.key) {
-      relations.searchField(field, keyword, childRequest());
+    const linkageItem = active.find((item) => item.childField.key === field.key);
+    if (linkageItem) {
+      const linkage = linkageItem.childField.relationLinkage;
+      if (linkage?.requiresParent && !relationIdentity(form[linkage.parentKey])) {
+        relations.clear(field.relation);
+        return;
+      }
+      relations.searchField(field, keyword, childRequest(linkageItem));
      return;
    }
    if (field.key === organizationStaffField?.key) {
@@ -251,30 +265,52 @@ export function useResourceRelationLinkage(

  /** 返回保存前的父子关系错误，空字符串代表当前组合可提交。 */
  function validationMessage() {
-    if (!active?.childField.relationLinkage || !active.childField.relation)
-      return '';
-    const linkage = active.childField.relationLinkage;
-    if (linkage.filterOnly) return '';
-    const parentIdentity = relationIdentity(form[linkage.parentKey]);
-    const childIdentity = relationIdentity(form[active.childField.key]);
-    const option = findOption(active.childField.relation, childIdentity);
-    const linkedMessage = linkedRelationValidationMessage(
-      parentIdentity,
-      childIdentity,
-      option,
-      linkage.optionParentKey,
-    );
-    if (linkedMessage) return linkedMessage;
+    for (const linkageItem of active) {
+      const childField = linkageItem.childField;
+      const linkage = childField.relationLinkage;
+      if (!linkage || !childField.relation || linkage.filterOnly) continue;
+      const parentIdentity = relationIdentity(form[linkage.parentKey]);
+      const childIdentity = relationIdentity(form[childField.key]);
+      const linkedMessage = linkedRelationValidationMessage(
+        parentIdentity,
+        childIdentity,
+        findOption(childField.relation, childIdentity),
+        linkage.optionParentKey,
+      );
+      if (linkedMessage) return linkedMessage;
+    }
    const staffField = organizationStaffField;
    if (!staffField?.relation) return '';
    const staffIdentity = relationIdentity(form[staffField.key]);
    return staffOrganizationValidationMessage(
-      parentIdentity,
-      childIdentity,
+      relationIdentity(form.gas_basic_identity),
+      relationIdentity(form.delivery_basic_identity),
      staffIdentity,
      findOption(staffField.relation, staffIdentity),
    );
  }

-  return { preload, change, search, validationMessage };
+  /** 必填联动候选为空时返回业务引导，用于阻止提交无效表单。 */
+  function unavailableMessage() {
+    for (const linkageItem of active) {
+      const field = linkageItem.childField;
+      const linkage = field.relationLinkage;
+      if (
+        !field.required ||
+        !field.relation ||
+        !field.relationEmptyText ||
+        !linkage?.requiresParent ||
+        !relationIdentity(form[linkage.parentKey]) ||
+        relations.loading[field.relation]
+      ) {
+        continue;
+      }
+      if ((relations.options[field.relation] ?? []).length === 0) {
+        return field.relationEmptyText;
+      }
+    }
+    return '';
+  }
+
+  return { preload, change, search, validationMessage, unavailableMessage };
 }
--- a/frontend/platform_admin/src/views/resource/use-resource-relations.ts
+++ b/frontend/platform_admin/src/views/resource/use-resource-relations.ts
@@ -183,6 +183,15 @@ export function useResourceRelations(
    timers.delete(resource);
  }

+  /** 清空依赖父级但当前尚无有效父级的候选项。 */
+  function clear(resource: string | undefined) {
+    if (!resource) return;
+    cancelSearch(resource);
+    requestGuard.begin(resource);
+    options[resource] = [];
+    loading[resource] = false;
+  }
+
  onBeforeUnmount(() => {
    for (const resource of timers.keys()) cancelSearch(resource);
  });
@@ -198,6 +207,7 @@ export function useResourceRelations(
    search,
    searchField,
    cancelSearch,
+    clear,
  };
 }