sy-form-components 0.2.7 → 0.2.9

package/dist/index.js

@@ -6893,6 +6893,38 @@ var normalizeField = (key, field, system = false) => ({
   width: field?.width,
   system
 });
+var SYSTEM_VALUE_ALIASES = {
+  formInstanceId: ["formInstanceId", "formInstId", "form_instance_id", "processInstanceId"],
+  instanceTitle: ["instanceTitle", "instance_title", "processInstanceTitle", "title"],
+  createdBy: ["createdBy", "created_by", "originator"],
+  createdByName: ["createdByName", "created_by_name", "originatorName", "creatorName"],
+  createdByDepartmentId: ["createdByDepartmentId", "created_by_department_id", "originatorCorp"],
+  createdByDepartmentName: [
+    "createdByDepartmentName",
+    "created_by_department_name",
+    "originatorDepartmentName",
+    "originatorCorpName"
+  ],
+  createdAt: ["createdAt", "created_at", "createTime", "gmtCreate"],
+  updatedAt: ["updatedAt", "updated_at", "modifiedTime", "modifyTime", "gmtModified"]
+};
+var pickAliasValue = (record, aliases) => {
+  for (const alias of aliases) {
+    const value = record?.[alias];
+    if (value !== void 0 && value !== null && value !== "") return value;
+  }
+  return void 0;
+};
+var normalizeDataManagementRecord = (record) => {
+  if (!record || typeof record !== "object" || Array.isArray(record)) return record;
+  const normalized = { ...record };
+  Object.entries(SYSTEM_VALUE_ALIASES).forEach(([targetKey, aliases]) => {
+    if (normalized[targetKey] !== void 0 && normalized[targetKey] !== null) return;
+    const aliasValue = pickAliasValue(record, aliases);
+    if (aliasValue !== void 0) normalized[targetKey] = aliasValue;
+  });
+  return normalized;
+};
 var PROCESS_INSTANCE_STATUS_OPTIONS = [
   { label: "\u5F85\u5904\u7406", value: "pending" },
   { label: "\u5BA1\u6279\u4E2D", value: "running" },
@@ -6947,15 +6979,29 @@ var PROCESS_SYSTEM_FIELDS = [
   )
 ];
 var BASE_SYSTEM_FIELDS = [
-  normalizeField("createTime", { label: "\u521B\u5EFA\u65F6\u95F4", componentName: "DateField", width: 170 }, true),
   normalizeField(
-    "modifiedTime",
-    { label: "\u66F4\u65B0\u65F6\u95F4", componentName: "DateField", width: 170 },
+    "instanceTitle",
+    { label: "\u5B9E\u4F8B\u6807\u9898", componentName: "TextField", width: 220, displayable: true },
     true
   ),
   normalizeField(
-    "originatorName",
-    { label: "\u521B\u5EFA\u4EBA", componentName: "TextField", width: 130 },
+    "createdByName",
+    { label: "\u521B\u5EFA\u4EBA", componentName: "TextField", width: 130, displayable: true },
+    true
+  ),
+  normalizeField(
+    "createdByDepartmentName",
+    { label: "\u521B\u5EFA\u4EBA\u90E8\u95E8", componentName: "TextField", width: 150, displayable: true },
+    true
+  ),
+  normalizeField(
+    "createdAt",
+    { label: "\u521B\u5EFA\u65F6\u95F4", componentName: "DateField", width: 170, displayable: true },
+    true
+  ),
+  normalizeField(
+    "updatedAt",
+    { label: "\u66F4\u65B0\u65F6\u95F4", componentName: "DateField", width: 170, displayable: true },
     true
   )
 ];
@@ -6976,7 +7022,7 @@ var normalizeDataManagementList = (payload) => {
   const records = body?.data || body?.records || body?.list || body?.items || [];
   const total = body?.totalCount ?? body?.total ?? body?.count ?? records.length;
   return {
-    records: Array.isArray(records) ? records : [],
+    records: Array.isArray(records) ? records.map(normalizeDataManagementRecord) : [],
     total: Number(total) || 0
   };
 };
@@ -6996,7 +7042,9 @@ var buildFilterPayload = (group) => {
 var normalizeColumnConfig = (cfg, fields) => {
   const allowed = new Set(fields.map((field) => field.fieldId));
   const configured = Array.isArray(cfg?.showFields) ? cfg.showFields.filter((fieldId) => allowed.has(fieldId)) : [];
-  const defaultShow = fields.filter((field) => !field.system || field.displayable).slice(0, 8).map((field) => field.fieldId);
+  const defaultBusinessFields = fields.filter((field) => !field.system).slice(0, 8).map((field) => field.fieldId);
+  const defaultSystemFields = fields.filter((field) => field.system && field.displayable).map((field) => field.fieldId);
+  const defaultShow = [...defaultBusinessFields, ...defaultSystemFields];
   return {
     showFields: configured.length > 0 ? configured : defaultShow,
     widths: cfg?.widths || {},
@@ -7658,8 +7706,14 @@ var import_react49 = require("react");
 var FORM_INSTANCE_METADATA_KEYS = /* @__PURE__ */ new Set([
   "appType",
   "code",
+  "createTime",
+  "created_at",
   "createdAt",
   "createdBy",
+  "created_by",
+  "created_by_department_id",
+  "created_by_department_name",
+  "created_by_name",
   "createdByDepartmentId",
   "createdByDepartmentName",
   "createdByName",
@@ -7671,9 +7725,18 @@ var FORM_INSTANCE_METADATA_KEYS = /* @__PURE__ */ new Set([
   "formUuid",
   "instanceTitle",
   "message",
+  "modifiedTime",
+  "modifyTime",
+  "originator",
+  "originatorCorp",
+  "originatorCorpName",
+  "originatorDepartmentName",
+  "originatorName",
+  "processInstanceTitle",
   "result",
   "success",
   "title",
+  "updated_at",
   "updatedAt"
 ]);
 var isPlainRecord = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
@@ -7720,6 +7783,76 @@ var extractFormValues = (formInstance, fieldIds) => {
   const flatValues = pickKnownFields(formInstance, fieldIds);
   return Object.keys(flatValues).length > 0 ? flatValues : null;
 };
+var firstValue = (source, keys) => {
+  for (const key of keys) {
+    const value = source[key];
+    if (value !== void 0 && value !== null && value !== "") return value;
+  }
+  return void 0;
+};
+var normalizeFormInstanceInfo = (formInstance, fallback) => {
+  if (!isPlainRecord(formInstance)) return null;
+  const creator = isPlainRecord(formInstance.creator) ? formInstance.creator : {};
+  const formInstanceId = firstValue(formInstance, [
+    "formInstanceId",
+    "formInstId",
+    "form_instance_id",
+    "id"
+  ]);
+  const createdByName = firstValue(formInstance, [
+    "createdByName",
+    "created_by_name",
+    "originatorName",
+    "creatorName"
+  ]);
+  const createdByDepartmentName = firstValue(formInstance, [
+    "createdByDepartmentName",
+    "created_by_department_name",
+    "originatorDepartmentName",
+    "originatorCorpName"
+  ]);
+  return {
+    ...formInstance,
+    formInstanceId: formInstanceId || fallback?.formInstanceId || "",
+    formUuid: formInstance.formUuid || fallback?.formUuid || "",
+    appType: formInstance.appType || fallback?.appType || "",
+    data: isPlainRecord(formInstance.data) ? formInstance.data : {},
+    title: firstValue(formInstance, [
+      "title",
+      "instanceTitle",
+      "instance_title",
+      "processInstanceTitle"
+    ]) || void 0,
+    instanceTitle: firstValue(formInstance, [
+      "instanceTitle",
+      "instance_title",
+      "processInstanceTitle",
+      "title"
+    ]) || void 0,
+    creator: {
+      userId: creator.userId || creator.id || formInstance.createdBy || formInstance.originator || "",
+      name: creator.name || createdByName || "",
+      avatar: creator.avatar,
+      department: creator.department || createdByDepartmentName || ""
+    },
+    createdBy: firstValue(formInstance, ["createdBy", "created_by", "originator"]),
+    createdByName,
+    createdByDepartmentId: firstValue(formInstance, [
+      "createdByDepartmentId",
+      "created_by_department_id",
+      "originatorCorp"
+    ]),
+    createdByDepartmentName,
+    createdAt: firstValue(formInstance, ["createdAt", "created_at", "createTime", "gmtCreate"]) || "",
+    updatedAt: firstValue(formInstance, [
+      "updatedAt",
+      "updated_at",
+      "modifiedTime",
+      "modifyTime",
+      "gmtModified"
+    ])
+  };
+};
 
 // src/hooks/useFormDetail.ts
 function useFormDetail(options) {
@@ -7750,8 +7883,13 @@ function useFormDetail(options) {
       if (!permResult || !hasViewOperation(permResult.operations, "view")) {
         onPermissionDenied?.();
       }
+      const normalizedInfo = normalizeFormInstanceInfo(formResult, {
+        formUuid,
+        appType,
+        formInstanceId
+      });
       setPermissions(permResult);
-      setInstanceInfo(formResult);
+      setInstanceInfo(normalizedInfo);
       setFormData(extractFormValues(formResult, fieldIds));
     } catch (error) {
       console.error("[useFormDetail] Failed to load data:", error);
@@ -8229,6 +8367,16 @@ function useApprovalActions(options) {
 
 // src/hooks/useChangeRecords.ts
 var import_react52 = require("react");
+var normalizeChangeRecordList = (value) => {
+  const body = value?.data ?? value?.result ?? value ?? {};
+  const records = body.records ?? body.data ?? body.list ?? body.items ?? [];
+  return {
+    records: Array.isArray(records) ? records : [],
+    total: Number(body.total ?? body.totalCount ?? body.count ?? records.length) || 0,
+    page: Number(body.page ?? body.currentPage ?? 1) || 1,
+    pageSize: Number(body.pageSize ?? body.limit ?? 20) || 20
+  };
+};
 function useChangeRecords(options) {
   const { formUuid, appType, formInstanceId, pageSize = 20, autoLoad = true } = options;
   const { api } = useFormContext();
@@ -8257,13 +8405,14 @@ function useChangeRecords(options) {
           pageSize
         });
         if (!mountedRef.current) return;
+        const normalized = normalizeChangeRecordList(result);
         if (append) {
-          setRecords((prev) => [...prev, ...result.records]);
+          setRecords((prev) => [...prev, ...normalized.records]);
         } else {
-          setRecords(result.records);
+          setRecords(normalized.records);
         }
-        setTotal(result.total);
-        setPage(pageNum);
+        setTotal(normalized.total);
+        setPage(normalized.page || pageNum);
       } catch (error) {
         console.error("[useChangeRecords] Failed to load change records:", error);
       } finally {
@@ -8279,7 +8428,8 @@ function useChangeRecords(options) {
       fetchRecords(1, false);
     }
   }, [autoLoad, fetchRecords]);
-  const hasMore = records.length < total;
+  const safeRecords = Array.isArray(records) ? records : [];
+  const hasMore = safeRecords.length < total;
   const loadMore = (0, import_react52.useCallback)(async () => {
     if (!hasMore || loading) return;
     await fetchRecords(page + 1, true);
@@ -8291,7 +8441,7 @@ function useChangeRecords(options) {
     await fetchRecords(1, false);
   }, [fetchRecords]);
   return {
-    records,
+    records: safeRecords,
     loading,
     total,
     page,
@@ -9057,6 +9207,21 @@ var import_icons6 = require("@ant-design/icons");
 var import_react57 = require("react");
 var import_antd24 = require("antd");
 var import_icons5 = require("@ant-design/icons");
+
+// src/utils/confirmAction.ts
+var confirmAction = (title, content) => {
+  const message2 = [title, content].filter(Boolean).join("\n") || "\u786E\u8BA4\u7EE7\u7EED\u5417\uFF1F";
+  if (typeof window === "undefined" || typeof window.confirm !== "function") {
+    return true;
+  }
+  try {
+    return window.confirm(message2);
+  } catch {
+    return true;
+  }
+};
+
+// src/modules/StickyActionBar.tsx
 var import_jsx_runtime81 = require("react/jsx-runtime");
 var getActionPriority = (action) => {
   const maybePriority = action.priority;
@@ -9071,8 +9236,8 @@ var StickyActionBar = ({
   className = "",
   maxMobileButtons = 2,
   layoutMode = "default",
-  inDrawer = false,
-  maxWidth = 1120
+  maxWidth = 1120,
+  position = "sticky"
 }) => {
   const [isMobile, setIsMobile] = (0, import_react57.useState)(false);
   (0, import_react57.useEffect)(() => {
@@ -9091,6 +9256,14 @@ var StickyActionBar = ({
   const moreMobile = visibleActions.slice(maxMobileButtons);
   const leftActions = visibleActions.filter((action) => getPlacement(action) === "left");
   const rightActions = visibleActions.filter((action) => getPlacement(action) !== "left");
+  const positionClass = position === "fixed" ? "fixed bottom-0 left-0 right-0" : position === "inline" ? "relative" : "sticky bottom-0";
+  const runAction = (action) => {
+    if (action.confirm) {
+      const confirmed = confirmAction(action.confirm.title, action.confirm.content);
+      if (!confirmed) return;
+    }
+    action.onClick();
+  };
   const renderButton = (action, mobile = false) => /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
     import_antd24.Button,
     {
@@ -9099,19 +9272,7 @@ var StickyActionBar = ({
       loading: action.loading,
       disabled: action.disabled,
       icon: action.icon,
-      onClick: () => {
-        if (action.confirm) {
-          import_antd24.Modal.confirm({
-            title: action.confirm.title,
-            content: action.confirm.content,
-            okText: action.confirm.okText || "\u786E\u8BA4",
-            cancelText: action.confirm.cancelText || "\u53D6\u6D88",
-            onOk: action.onClick
-          });
-          return;
-        }
-        action.onClick();
-      },
+      onClick: () => runAction(action),
       className: `${mobile ? "min-w-0 flex-1" : "min-w-[88px]"} rounded-md`,
       children: action.label
     },
@@ -9120,7 +9281,7 @@ var StickyActionBar = ({
   return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
     "div",
     {
-      className: `fixed bottom-0 left-0 right-0 z-50 border-t border-ant-border-secondary bg-ant-bg-container/95 px-4 py-3 shadow-[0_-8px_24px_rgba(15,23,42,0.06)] backdrop-blur supports-[padding:max(0px)]:pb-[max(0.75rem,env(safe-area-inset-bottom))] ${inDrawer ? "absolute" : ""} ${className}`,
+      className: `${positionClass} z-20 border-t border-ant-border-secondary bg-ant-bg-container/95 px-4 py-3 shadow-[0_-8px_24px_rgba(15,23,42,0.06)] backdrop-blur supports-[padding:max(0px)]:pb-[max(0.75rem,env(safe-area-inset-bottom))] ${className}`,
       children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
         "div",
         {
@@ -9140,19 +9301,7 @@ var StickyActionBar = ({
                     danger: action.type === "danger",
                     disabled: action.disabled,
                     icon: action.icon,
-                    onClick: () => {
-                      if (action.confirm) {
-                        import_antd24.Modal.confirm({
-                          title: action.confirm.title,
-                          content: action.confirm.content,
-                          okText: action.confirm.okText || "\u786E\u8BA4",
-                          cancelText: action.confirm.cancelText || "\u53D6\u6D88",
-                          onOk: action.onClick
-                        });
-                        return;
-                      }
-                      action.onClick();
-                    }
+                    onClick: () => runAction(action)
                   }))
                 },
                 children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(import_antd24.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(import_icons5.MoreOutlined, {}), className: "rounded-md", children: "\u66F4\u591A" })
@@ -9319,6 +9468,7 @@ var ApprovalActionBar = ({
     /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
       import_antd25.Modal,
       {
+        getContainer: false,
         title: getModalTitle(modalAction),
         open: modalAction !== null,
         okText: "\u786E\u8BA4",
@@ -9354,6 +9504,7 @@ var ApprovalActionBar = ({
                 import_antd25.Select,
                 {
                   placeholder: "\u8BF7\u9009\u62E9\u9000\u56DE\u8282\u70B9",
+                  getPopupContainer: (triggerNode) => triggerNode.parentElement || document.body,
                   options: returnableNodes.map((node) => ({
                     value: node.nodeId || node.id || "",
                     label: renderReturnNodeLabel ? renderReturnNodeLabel(node) : node.nodeName || node.name || node.nodeId || node.id
@@ -9490,6 +9641,7 @@ var ApprovalActions = ({
             import_antd26.Dropdown,
             {
               trigger: ["click"],
+              getPopupContainer: (triggerNode) => triggerNode.parentElement || document.body,
               menu: {
                 items: moreButtons.map((action) => ({
                   key: action.action,
@@ -9507,6 +9659,7 @@ var ApprovalActions = ({
     /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
       import_antd26.Modal,
       {
+        getContainer: false,
         title,
         open: modalAction !== null,
         okText: "\u786E\u8BA4",
@@ -9558,15 +9711,9 @@ var FormActionBar = ({
   });
   const handleClick = async (action) => {
     if (action.confirm) {
-      import_antd27.Modal.confirm({
-        title: action.confirm.title,
-        content: action.confirm.content,
-        okText: "\u786E\u8BA4",
-        cancelText: "\u53D6\u6D88",
-        onOk: async () => {
-          await executeAction(action);
-        }
-      });
+      const confirmed = confirmAction(action.confirm.title, action.confirm.content);
+      if (!confirmed) return;
+      await executeAction(action);
     } else {
       await executeAction(action);
     }
@@ -9648,11 +9795,11 @@ var RuntimePageShell = ({
     }
     return children;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: `sy-runtime-page min-h-screen bg-ant-bg-layout text-ant-text ${className}`, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: `sy-runtime-page min-h-full bg-ant-bg-layout text-ant-text ${className}`, children: [
     /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       "div",
       {
-        className: `sy-runtime-page__content mx-auto w-full px-4 py-6 pb-24 md:px-6 ${inDrawer ? "py-4 md:px-4" : ""} ${contentClassName}`,
+        className: `sy-runtime-page__content mx-auto w-full px-4 py-6 pb-8 md:px-6 ${inDrawer ? "py-4 md:px-4" : ""} ${contentClassName}`,
         style: { maxWidth: maxWidthStyle },
         children: renderState()
       }
@@ -9722,8 +9869,8 @@ var SummaryPanel = ({
           )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("h1", { className: "m-0 break-words text-2xl font-semibold leading-9 text-ant-text md:text-[28px]", children: title }),
-        items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "mt-5 grid grid-cols-1 gap-4 md:grid-cols-3", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("span", { className: "inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-gray-100 text-ant-text-secondary", children: item.icon }),
+        items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "mt-5 grid grid-cols-1 gap-4 md:grid-cols-4", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("span", { className: "inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-gray-100 text-ant-text-secondary", children: item.icon }),
           /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("span", { className: "min-w-0", children: [
             /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("span", { className: "block text-xs leading-5 text-ant-text-tertiary", children: item.label }),
             /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("span", { className: "block break-words text-sm font-medium leading-6 text-ant-text", children: item.value || "-" })
@@ -9795,9 +9942,11 @@ var ProcessPreview = ({
   routes,
   loading = false
 }) => {
+  const routeList = Array.isArray(routes) ? routes : [];
   return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
     import_antd31.Modal,
     {
+      getContainer: false,
       title: "\u6D41\u7A0B\u9884\u89C8",
       open,
       onCancel: onClose,
@@ -9806,8 +9955,8 @@ var ProcessPreview = ({
         /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_antd31.Button, { onClick: onClose, children: "\u53D6\u6D88" }),
         /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_antd31.Button, { type: "primary", onClick: onConfirm, loading, children: "\u786E\u8BA4\u63D0\u4EA4" })
       ] }),
-      children: loading && routes.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_antd31.Skeleton, { active: true, paragraph: { rows: 4 } }) : routes.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("p", { className: "text-sm text-gray-400 text-center py-8", children: "\u6682\u65E0\u6D41\u7A0B\u8282\u70B9" }) : /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "py-2", children: routes.map((route, index) => {
-        const isLast = index === routes.length - 1;
+      children: loading && routeList.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_antd31.Skeleton, { active: true, paragraph: { rows: 4 } }) : routeList.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("p", { className: "text-sm text-gray-400 text-center py-8", children: "\u6682\u65E0\u6D41\u7A0B\u8282\u70B9" }) : /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "py-2", children: routeList.map((route, index) => {
+        const isLast = index === routeList.length - 1;
         return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex gap-3", children: [
           /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "w-6 h-6 rounded-full bg-blue-50 border-2 border-blue-400 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_icons10.CheckCircleOutlined, { className: "text-blue-500 text-xs" }) }),
@@ -9836,6 +9985,7 @@ var ProcessPreview = ({
 // src/modules/DataManagementList.tsx
 var import_react61 = require("react");
 var import_antd32 = require("antd");
+var import_dayjs5 = __toESM(require("dayjs"));
 var import_icons11 = require("@ant-design/icons");
 var import_jsx_runtime89 = require("react/jsx-runtime");
 var createGroup = () => ({
@@ -9870,6 +10020,11 @@ var formatPrimitive = (value) => {
     return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "text-ant-color-text-quaternary", children: "--" });
   return String(value);
 };
+var formatDateTime = (value) => {
+  if (value === void 0 || value === null || value === "") return formatPrimitive("");
+  const parsed = (0, import_dayjs5.default)(value);
+  return parsed.isValid() ? parsed.format("YYYY-MM-DD HH:mm:ss") : String(value);
+};
 var pickOptionLabel = (field, value) => {
   const options = field.options || field.optionList || field.option_list || field.componentProps?.options || [];
   const scalar = typeof value === "object" ? value?.value ?? value?.id ?? value?.label ?? value?.name : value;
@@ -9897,6 +10052,9 @@ var renderStatusTag = (value, fieldId) => {
 var renderCellValue = (value, field) => {
   const status = renderStatusTag(value, field.fieldId);
   if (status) return status;
+  if (field.componentName === "DateField" || field.componentName === "DateTimeField") {
+    return formatDateTime(value);
+  }
   if (Array.isArray(value)) {
     if (value.length === 0) return formatPrimitive("");
     if (field.componentName === "ImageField") {
@@ -10075,6 +10233,54 @@ function FilterGroupEditor({
     }
   );
 }
+function ResizableColumnTitle({
+  label,
+  width,
+  onResize,
+  onResizeEnd
+}) {
+  const dragRef = (0, import_react61.useRef)({ startX: 0, startWidth: width, latestWidth: width });
+  const handleMouseDown = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    dragRef.current = {
+      startX: event.clientX,
+      startWidth: width,
+      latestWidth: width
+    };
+    const handleMouseMove = (moveEvent) => {
+      const nextWidth = Math.min(
+        520,
+        Math.max(96, dragRef.current.startWidth + moveEvent.clientX - dragRef.current.startX)
+      );
+      dragRef.current.latestWidth = nextWidth;
+      onResize(nextWidth);
+    };
+    const handleMouseUp = () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      onResizeEnd(dragRef.current.latestWidth);
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("span", { className: "relative flex min-w-0 items-center pr-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "min-w-0 truncate", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "absolute -right-2 top-1/2 h-5 w-2 -translate-y-1/2 cursor-col-resize rounded hover:bg-ant-color-primary",
+        onClick: (event) => {
+          event.preventDefault();
+          event.stopPropagation();
+        },
+        onMouseDown: handleMouseDown,
+        title: "\u62D6\u62FD\u8C03\u6574\u5217\u5BBD"
+      }
+    )
+  ] });
+}
 var DataManagementList = ({
   appType,
   formUuid,
@@ -10084,10 +10290,12 @@ var DataManagementList = ({
   configScope = "global",
   title,
   detailRenderer,
+  detailPageUrlBuilder,
   submitRenderer,
   requestOverride,
   rowActions = []
 }) => {
+  const rootRef = (0, import_react61.useRef)(null);
   const api = (0, import_react61.useMemo)(() => {
     if (typeof requestOverride === "function") {
       return createFormRuntimeApi({ request: requestOverride });
@@ -10096,9 +10304,11 @@ var DataManagementList = ({
   }, [requestOverride]);
   const [fields, setFields] = (0, import_react61.useState)([]);
   const [config, setConfig] = (0, import_react61.useState)({});
+  const [formType, setFormType] = (0, import_react61.useState)("form");
   const [showFields, setShowFields] = (0, import_react61.useState)([]);
   const [lockFieldIds, setLockFieldIds] = (0, import_react61.useState)([]);
   const [widths, setWidths] = (0, import_react61.useState)({});
+  const widthsRef = (0, import_react61.useRef)({});
   const [sort, setSort] = (0, import_react61.useState)([]);
   const [density, setDensity] = (0, import_react61.useState)("middle");
   const [detailOpenMode, setDetailOpenMode] = (0, import_react61.useState)("drawer");
@@ -10134,10 +10344,20 @@ var DataManagementList = ({
   const [submitOpen, setSubmitOpen] = (0, import_react61.useState)(false);
   const fetchStateRef = (0, import_react61.useRef)({});
   const request = api.request;
+  const getPopupContainer = (0, import_react61.useCallback)(
+    (triggerNode) => rootRef.current || triggerNode?.ownerDocument?.body || (typeof document !== "undefined" ? document.body : triggerNode?.parentElement),
+    []
+  );
+  const confirmDanger = (0, import_react61.useCallback)((title2, content, onOk) => {
+    if (confirmAction(title2, content)) onOk();
+  }, []);
   const visibleFields = (0, import_react61.useMemo)(
     () => showFields.map((fieldId) => fields.find((field) => field.fieldId === fieldId)).filter(Boolean),
     [fields, showFields]
   );
+  (0, import_react61.useEffect)(() => {
+    widthsRef.current = widths;
+  }, [widths]);
   (0, import_react61.useEffect)(() => {
     fetchStateRef.current = {
       current,
@@ -10205,16 +10425,18 @@ var DataManagementList = ({
         }).catch(() => void 0);
         if (!mounted) return;
         const resolved = normalizeColumnConfig(saved, allFields);
+        const resolvedDetailOpenMode = detailPageUrlBuilder ? resolved.detailOpenMode : "drawer";
         const nextSearchKeyWord = saved?.filter?.searchKeyWord || "";
         const nextFilterGroup = hydrateFilterGroup(saved?.filter?.group);
         setFields(allFields);
+        setFormType(schemaResult.formType || "form");
         setConfig(saved || {});
         setShowFields(resolved.showFields);
         setWidths(resolved.widths);
         setLockFieldIds(resolved.lockFieldIds);
         setSort(resolved.sort);
         setDensity(resolved.density);
-        setDetailOpenMode(resolved.detailOpenMode);
+        setDetailOpenMode(resolvedDetailOpenMode);
         setPageSize(resolved.pageSize);
         setSearchKeyWord(nextSearchKeyWord);
         setFilterGroup(nextFilterGroup);
@@ -10236,7 +10458,7 @@ var DataManagementList = ({
     return () => {
       mounted = false;
     };
-  }, [appType, configScope, formUuid, loadData, menuFormUuid, request]);
+  }, [appType, configScope, detailPageUrlBuilder, formUuid, loadData, menuFormUuid, request]);
   const persistConfig = (0, import_react61.useCallback)(
     async (patch) => {
       const nextConfig = { ...config, ...patch };
@@ -10260,22 +10482,62 @@ var DataManagementList = ({
       showFields,
       lockFieldIds,
       widths,
+      sort,
       density,
       detailOpenMode,
       pageSize
     });
+    await loadData({ current: 1, pageSize, sort });
   };
+  const handleSortChange = (index, patch) => {
+    setSort(
+      (prev) => prev.map((item, itemIndex) => itemIndex === index ? { ...item, ...patch } : item)
+    );
+  };
+  const handleAddSort = () => {
+    const firstFieldId = showFields[0] || fields[0]?.fieldId;
+    if (!firstFieldId) return;
+    setSort((prev) => [...prev, { id: firstFieldId, isAsc: "y" }]);
+  };
+  const handleRemoveSort = (index) => {
+    setSort((prev) => prev.filter((_, itemIndex) => itemIndex !== index));
+  };
+  const updateColumnWidth = (0, import_react61.useCallback)((fieldId, width) => {
+    const nextWidth = Math.round(Math.max(96, Math.min(520, width)));
+    widthsRef.current = { ...widthsRef.current, [fieldId]: nextWidth };
+    setWidths(widthsRef.current);
+  }, []);
+  const commitColumnWidth = (0, import_react61.useCallback)(
+    (fieldId, width) => {
+      const nextWidth = Math.round(Math.max(96, Math.min(520, width)));
+      const nextWidths = { ...widthsRef.current, [fieldId]: nextWidth };
+      widthsRef.current = nextWidths;
+      setWidths(nextWidths);
+      void persistConfig({ widths: nextWidths });
+    },
+    [persistConfig]
+  );
   const handleDetail = (0, import_react61.useCallback)(
     (record) => {
       const formInstanceId = getRecordId(record);
-      if (detailOpenMode === "newPage" && typeof window !== "undefined") {
-        window.open(`/${appType}/forms/${formUuid}/detail/${formInstanceId}`, "_blank");
+      if (!formInstanceId) {
+        import_antd32.message.warning("\u5F53\u524D\u8BB0\u5F55\u7F3A\u5C11\u5B9E\u4F8B ID\uFF0C\u65E0\u6CD5\u6253\u5F00\u8BE6\u60C5");
         return;
       }
+      if (detailOpenMode === "newPage" && detailPageUrlBuilder && typeof window !== "undefined") {
+        const detailUrl = detailPageUrlBuilder({ record, formInstanceId: String(formInstanceId) });
+        if (detailUrl) {
+          window.open(detailUrl, "_blank");
+          return;
+        }
+      }
+      if (detailOpenMode === "newPage" && !detailPageUrlBuilder) {
+        setDetailOpenMode("drawer");
+      }
       setActiveRecord(record);
       setDetailOpen(true);
     },
-    [appType, detailOpenMode, formUuid]
+    [detailOpenMode, detailPageUrlBuilder]
   );
   const handleDelete = (0, import_react61.useCallback)(
     async (ids) => {
@@ -10391,22 +10653,33 @@ var DataManagementList = ({
     await loadData({ current: 1, pageSize });
   };
   const columns = (0, import_react61.useMemo)(() => {
-    const baseColumns = visibleFields.map((field) => ({
-      title: field.label,
-      dataIndex: field.fieldId,
-      key: field.fieldId,
-      width: widths[field.fieldId] || field.width || 160,
-      fixed: lockFieldIds.includes(field.fieldId) ? "left" : void 0,
-      ellipsis: true,
-      sorter: true,
-      render: (value) => renderCellValue(value, field)
-    })) || [];
+    const baseColumns = visibleFields.map((field) => {
+      const columnWidth = widths[field.fieldId] || field.width || 160;
+      return {
+        title: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          ResizableColumnTitle,
+          {
+            label: field.label,
+            width: columnWidth,
+            onResize: (width) => updateColumnWidth(field.fieldId, width),
+            onResizeEnd: (width) => commitColumnWidth(field.fieldId, width)
+          }
+        ),
+        dataIndex: field.fieldId,
+        key: field.fieldId,
+        width: columnWidth,
+        fixed: lockFieldIds.includes(field.fieldId) ? "left" : void 0,
+        ellipsis: true,
+        sorter: true,
+        render: (value) => renderCellValue(value, field)
+      };
+    }) || [];
     return [
       ...baseColumns,
       {
         title: "\u64CD\u4F5C",
         key: "__actions",
-        width: 148,
+        width: 136,
         fixed: "right",
         render: (_, record) => /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { size: 4, children: [
           /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { type: "link", size: "small", onClick: () => handleDetail(record), children: "\u8BE6\u60C5" }),
@@ -10414,31 +10687,34 @@ var DataManagementList = ({
             import_antd32.Dropdown,
             {
               trigger: ["click"],
+              getPopupContainer,
               menu: {
                 items: [
+                  ...!readonly ? [
+                    {
+                      key: "delete",
+                      label: "\u5220\u9664",
+                      danger: true,
+                      icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DeleteOutlined, {}),
+                      onClick: () => confirmDanger(
+                        "\u786E\u8BA4\u5220\u9664",
+                        "\u5220\u9664\u540E\u4E0D\u53EF\u6062\u590D\uFF0C\u786E\u8BA4\u7EE7\u7EED\u5417\uFF1F",
+                        () => handleDelete([String(getRecordId(record))])
+                      )
+                    }
+                  ] : [],
                   ...rowActions.map((action) => ({
                     key: action.key,
                     label: action.label,
                     danger: action.danger,
                     onClick: () => action.onClick(record)
                   })),
-                  {
-                    key: "workflow",
-                    label: "\u6D41\u7A0B\u65E5\u5FD7",
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.HistoryOutlined, {}),
-                    onClick: () => import_antd32.message.info("\u8BF7\u901A\u8FC7 detailRenderer \u63A5\u5165\u6D41\u7A0B\u65E5\u5FD7\u6216\u6D41\u7A0B\u56FE\u5165\u53E3")
-                  },
-                  ...!readonly ? [
+                  ...formType === "process" ? [
                     {
-                      key: "delete",
-                      label: "\u5220\u9664",
-                      danger: true,
-                      icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DeleteOutlined, {}),
-                      onClick: () => import_antd32.Modal.confirm({
-                        title: "\u786E\u8BA4\u5220\u9664",
-                        content: "\u5220\u9664\u540E\u4E0D\u53EF\u6062\u590D\uFF0C\u786E\u8BA4\u7EE7\u7EED\u5417\uFF1F",
-                        onOk: () => handleDelete([String(getRecordId(record))])
-                      })
+                      key: "workflow",
+                      label: "\u6D41\u7A0B\u65E5\u5FD7",
+                      icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.HistoryOutlined, {}),
+                      onClick: () => import_antd32.message.info("\u8BF7\u901A\u8FC7 detailRenderer \u63A5\u5165\u6D41\u7A0B\u65E5\u5FD7\u6216\u6D41\u7A0B\u56FE\u5165\u53E3")
                     }
                   ] : []
                 ]
@@ -10449,8 +10725,25 @@ var DataManagementList = ({
         ] })
       }
     ];
-  }, [handleDelete, handleDetail, lockFieldIds, readonly, rowActions, visibleFields, widths]);
+  }, [
+    confirmDanger,
+    commitColumnWidth,
+    formType,
+    getPopupContainer,
+    handleDelete,
+    handleDetail,
+    lockFieldIds,
+    readonly,
+    rowActions,
+    updateColumnWidth,
+    visibleFields,
+    widths
+  ]);
   const tableSize = density === "compact" ? "small" : density === "loose" ? "large" : "middle";
+  const tableScrollX = Math.max(
+    900,
+    visibleFields.reduce((sum, field) => sum + (widths[field.fieldId] || field.width || 160), 136)
+  );
   const importPreviewColumns = (0, import_react61.useMemo)(() => {
     const keys = Array.from(
       new Set(importPreview.flatMap((record) => Object.keys(record || {})))
@@ -10467,438 +10760,525 @@ var DataManagementList = ({
       };
     });
   }, [fields, importPreview]);
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: `${fullHeight ? "h-full min-h-screen" : ""} bg-ant-bg-layout`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mx-auto flex h-full max-w-[1440px] flex-col px-4 py-4 md:px-6", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mb-4 flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("h1", { className: "text-xl font-semibold text-ant-color-text", children: title || "\u6570\u636E\u7BA1\u7406" }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("p", { className: "mt-1 text-sm text-ant-color-text-secondary", children: [
-            "\u5171 ",
-            total,
-            " \u6761\u6570\u636E\uFF0C\u5DF2\u9009\u62E9 ",
-            selectedRowKeys.length,
-            " \u6761"
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { wrap: true, children: [
-          !readonly && submitRenderer && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.PlusOutlined, {}), type: "primary", onClick: () => setSubmitOpen(true), children: "\u65B0\u589E" }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Input.Search,
+  return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.ConfigProvider, { getPopupContainer, children: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+    "div",
+    {
+      ref: rootRef,
+      className: `relative w-full bg-ant-bg-layout ${fullHeight ? "flex h-[calc(100vh-88px)] min-h-[560px] overflow-hidden" : ""}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mx-auto flex min-h-0 w-full max-w-[1440px] flex-col px-4 py-4 md:px-6", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mb-4 flex flex-col gap-3 md:flex-row md:items-center md:justify-between", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("h1", { className: "text-xl font-semibold text-ant-color-text", children: title || "\u6570\u636E\u7BA1\u7406" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("p", { className: "mt-1 text-sm text-ant-color-text-secondary", children: [
+                "\u5171 ",
+                total,
+                " \u6761\u6570\u636E\uFF0C\u5DF2\u9009\u62E9 ",
+                selectedRowKeys.length,
+                " \u6761"
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { wrap: true, children: [
+              !readonly && submitRenderer && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.PlusOutlined, {}), type: "primary", onClick: () => setSubmitOpen(true), children: "\u65B0\u589E" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Input.Search,
+                {
+                  allowClear: true,
+                  className: "w-[260px]",
+                  placeholder: "\u641C\u7D22\u5173\u952E\u5B57",
+                  value: searchKeyWord,
+                  onChange: (event) => setSearchKeyWord(event.target.value),
+                  onSearch: (value) => {
+                    const nextSearchKeyWord = String(value || "");
+                    setSearchKeyWord(nextSearchKeyWord);
+                    persistConfig({
+                      filter: { searchKeyWord: nextSearchKeyWord, group: filterGroup }
+                    });
+                    loadData({
+                      current: 1,
+                      pageSize,
+                      searchKeyWord: nextSearchKeyWord,
+                      filterGroup
+                    });
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.FilterOutlined, {}), onClick: () => setFilterOpen(true), children: "\u7B5B\u9009" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.SettingOutlined, {}), onClick: () => setColumnOpen(true), children: "\u5217\u8BBE\u7F6E" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Dropdown,
+                {
+                  getPopupContainer,
+                  menu: {
+                    items: [
+                      {
+                        key: "selected",
+                        label: "\u5BFC\u51FA\u9009\u4E2D",
+                        disabled: selectedRowKeys.length === 0,
+                        onClick: () => {
+                          setExportScope("selected");
+                          setExportFields(showFields);
+                          setExportOpen(true);
+                        }
+                      },
+                      {
+                        key: "all",
+                        label: "\u5BFC\u51FA\u5168\u90E8",
+                        onClick: () => {
+                          setExportScope("all");
+                          setExportFields(showFields);
+                          setExportOpen(true);
+                        }
+                      },
+                      {
+                        key: "records",
+                        label: "\u5BFC\u51FA\u8BB0\u5F55",
+                        onClick: () => loadTransferRecords("export")
+                      }
+                    ]
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DownloadOutlined, {}), children: "\u5BFC\u51FA" })
+                }
+              ),
+              !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Dropdown,
+                {
+                  getPopupContainer,
+                  menu: {
+                    items: [
+                      { key: "import", label: "\u5BFC\u5165\u6570\u636E", onClick: () => setImportOpen(true) },
+                      {
+                        key: "records",
+                        label: "\u5BFC\u5165\u8BB0\u5F55",
+                        onClick: () => loadTransferRecords("import")
+                      }
+                    ]
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.ImportOutlined, {}), children: "\u5BFC\u5165" })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.ReloadOutlined, {}), onClick: () => loadData({ current, pageSize }) })
+            ] })
+          ] }),
+          selectedRowKeys.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-3 rounded-lg border border-ant-border-secondary bg-ant-bg-container px-4 py-3 shadow-sm", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("span", { className: "text-sm text-ant-color-text-secondary", children: [
+              "\u5DF2\u9009 ",
+              selectedRowKeys.length,
+              " \u6761"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { wrap: true, children: [
+              !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.SwapOutlined, {}), onClick: handleBatchApprove, children: "\u6279\u91CF\u5BA1\u6279" }),
+              !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Button,
+                {
+                  danger: true,
+                  icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DeleteOutlined, {}),
+                  onClick: () => confirmDanger(
+                    "\u786E\u8BA4\u6279\u91CF\u5220\u9664",
+                    `\u5C06\u5220\u9664 ${selectedRowKeys.length} \u6761\u6570\u636E\uFF0C\u786E\u8BA4\u7EE7\u7EED\u5417\uFF1F`,
+                    () => handleDelete(selectedRowKeys.map(String))
+                  ),
+                  children: "\u6279\u91CF\u5220\u9664"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { type: "link", onClick: () => setSelectedRowKeys([]), children: "\u53D6\u6D88\u9009\u62E9" })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "relative flex-1 overflow-hidden rounded-lg border border-ant-border-secondary bg-ant-bg-container", children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+            import_antd32.Table,
             {
-              allowClear: true,
-              className: "w-[260px]",
-              placeholder: "\u641C\u7D22\u5173\u952E\u5B57",
-              value: searchKeyWord,
-              onChange: (event) => setSearchKeyWord(event.target.value),
-              onSearch: (value) => {
-                const nextSearchKeyWord = String(value || "");
-                setSearchKeyWord(nextSearchKeyWord);
-                persistConfig({ filter: { searchKeyWord: nextSearchKeyWord, group: filterGroup } });
+              rowKey: (record) => String(getRecordId(record)),
+              loading: loading || schemaLoading,
+              columns,
+              dataSource,
+              size: tableSize,
+              scroll: {
+                x: tableScrollX,
+                y: fullHeight ? selectedRowKeys.length > 0 ? "calc(100vh - 360px)" : "calc(100vh - 300px)" : void 0
+              },
+              rowSelection: {
+                selectedRowKeys,
+                onChange: setSelectedRowKeys
+              },
+              pagination: {
+                current,
+                pageSize,
+                total,
+                showSizeChanger: true,
+                showTotal: (count) => `\u5171 ${count} \u6761`
+              },
+              onChange: (pagination, _filters, sorter) => {
+                const sorters = Array.isArray(sorter) ? sorter : [sorter];
+                const nextSort = sorters.filter((item) => item?.field && item?.order).map((item) => ({
+                  id: String(item.field),
+                  isAsc: item.order === "ascend" ? "y" : "n"
+                }));
+                setSort(nextSort);
+                persistConfig({ sort: nextSort });
                 loadData({
-                  current: 1,
-                  pageSize,
-                  searchKeyWord: nextSearchKeyWord,
-                  filterGroup
+                  current: pagination.current || 1,
+                  pageSize: pagination.pageSize || pageSize,
+                  sort: nextSort
                 });
               }
             }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.FilterOutlined, {}), onClick: () => setFilterOpen(true), children: "\u7B5B\u9009" }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.SettingOutlined, {}), onClick: () => setColumnOpen(true), children: "\u5217\u8BBE\u7F6E" }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Dropdown,
-            {
-              menu: {
-                items: [
-                  {
-                    key: "selected",
-                    label: "\u5BFC\u51FA\u9009\u4E2D",
-                    disabled: selectedRowKeys.length === 0,
-                    onClick: () => {
-                      setExportScope("selected");
-                      setExportFields(showFields);
-                      setExportOpen(true);
-                    }
-                  },
-                  {
-                    key: "all",
-                    label: "\u5BFC\u51FA\u5168\u90E8",
-                    onClick: () => {
-                      setExportScope("all");
-                      setExportFields(showFields);
-                      setExportOpen(true);
-                    }
-                  },
+          ) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Modal,
+          {
+            getContainer: false,
+            title: "\u9AD8\u7EA7\u7B5B\u9009",
+            open: filterOpen,
+            width: 760,
+            onCancel: () => setFilterOpen(false),
+            onOk: () => {
+              setFilterOpen(false);
+              persistConfig({ filter: { searchKeyWord, group: filterGroup } });
+              loadData({ current: 1, pageSize, searchKeyWord, filterGroup });
+            },
+            okText: "\u5E94\u7528\u7B5B\u9009",
+            children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(FilterGroupEditor, { group: filterGroup, fields, onChange: setFilterGroup })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Modal,
+          {
+            getContainer: false,
+            title: "\u5217\u8BBE\u7F6E",
+            open: columnOpen,
+            width: 920,
+            onCancel: () => setColumnOpen(false),
+            onOk: handleColumnCommit,
+            children: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "space-y-5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u663E\u793A\u5217" }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                  import_antd32.Checkbox.Group,
                   {
-                    key: "records",
-                    label: "\u5BFC\u51FA\u8BB0\u5F55",
-                    onClick: () => loadTransferRecords("export")
+                    className: "grid grid-cols-2 gap-2 md:grid-cols-3",
+                    value: showFields,
+                    options: fields.map((field) => ({ label: field.label, value: field.fieldId })),
+                    onChange: (values) => setShowFields(values.map(String))
                   }
-                ]
-              },
-              children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DownloadOutlined, {}), children: "\u5BFC\u51FA" })
-            }
-          ),
-          !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Dropdown,
-            {
-              menu: {
-                items: [
-                  { key: "import", label: "\u5BFC\u5165\u6570\u636E", onClick: () => setImportOpen(true) },
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u5217\u5BBD" }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "grid max-h-56 gap-2 overflow-auto rounded-lg border border-ant-border-secondary p-3 md:grid-cols-2", children: showFields.map((fieldId) => {
+                  const field = fields.find((item) => item.fieldId === fieldId);
+                  const width = widths[fieldId] || field?.width || 160;
+                  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "min-w-0 truncate text-sm text-ant-color-text-secondary", children: field?.label || fieldId }),
+                    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                      import_antd32.InputNumber,
+                      {
+                        min: 96,
+                        max: 520,
+                        value: width,
+                        addonAfter: "px",
+                        onChange: (value) => updateColumnWidth(fieldId, Number(value || 160)),
+                        onBlur: () => commitColumnWidth(fieldId, widthsRef.current[fieldId] || width)
+                      }
+                    )
+                  ] }, fieldId);
+                }) })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u51BB\u7ED3\u5217" }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                  import_antd32.Select,
                   {
-                    key: "records",
-                    label: "\u5BFC\u5165\u8BB0\u5F55",
-                    onClick: () => loadTransferRecords("import")
+                    mode: "multiple",
+                    className: "w-full",
+                    value: lockFieldIds,
+                    options: showFields.map((fieldId) => {
+                      const field = fields.find((item) => item.fieldId === fieldId);
+                      return { label: field?.label || fieldId, value: fieldId };
+                    }),
+                    onChange: setLockFieldIds
                   }
-                ]
-              },
-              children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.ImportOutlined, {}), children: "\u5BFC\u5165" })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.ReloadOutlined, {}), onClick: () => loadData({ current, pageSize }) })
-        ] })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "relative flex-1 overflow-hidden rounded-lg border border-ant-border-secondary bg-ant-bg-container", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-          import_antd32.Table,
-          {
-            rowKey: (record) => String(getRecordId(record)),
-            loading: loading || schemaLoading,
-            columns,
-            dataSource,
-            size: tableSize,
-            scroll: {
-              x: Math.max(900, visibleFields.length * 160),
-              y: fullHeight ? "calc(100vh - 260px)" : void 0
-            },
-            rowSelection: {
-              selectedRowKeys,
-              onChange: setSelectedRowKeys
-            },
-            pagination: {
-              current,
-              pageSize,
-              total,
-              showSizeChanger: true,
-              showTotal: (count) => `\u5171 ${count} \u6761`
-            },
-            onChange: (pagination, _filters, sorter) => {
-              const sorters = Array.isArray(sorter) ? sorter : [sorter];
-              const nextSort = sorters.filter((item) => item?.field && item?.order).map((item) => ({
-                id: String(item.field),
-                isAsc: item.order === "ascend" ? "y" : "n"
-              }));
-              setSort(nextSort);
-              persistConfig({ sort: nextSort });
-              loadData({
-                current: pagination.current || 1,
-                pageSize: pagination.pageSize || pageSize,
-                sort: nextSort
-              });
-            }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Divider, { className: "my-1" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "text-sm font-medium text-ant-color-text", children: "\u6392\u5E8F\u89C4\u5219" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { size: "small", onClick: handleAddSort, disabled: fields.length === 0, children: "\u6DFB\u52A0\u6392\u5E8F" })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "space-y-2", children: sort.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "rounded-lg border border-dashed border-ant-border-secondary px-3 py-4 text-center text-sm text-ant-color-text-tertiary", children: "\u6682\u65E0\u6392\u5E8F\u89C4\u5219" }) : sort.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Select,
+                    {
+                      className: "min-w-0 flex-1",
+                      value: item.id,
+                      options: fields.map((field) => ({
+                        label: field.label,
+                        value: field.fieldId
+                      })),
+                      onChange: (value) => handleSortChange(index, { id: value })
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Segmented,
+                    {
+                      value: item.isAsc,
+                      options: [
+                        { label: "\u5347\u5E8F", value: "y" },
+                        { label: "\u964D\u5E8F", value: "n" }
+                      ],
+                      onChange: (value) => handleSortChange(index, { isAsc: value })
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Button,
+                    {
+                      danger: true,
+                      type: "text",
+                      icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DeleteOutlined, {}),
+                      onClick: () => handleRemoveSort(index)
+                    }
+                  )
+                ] }, `${item.id}_${index}`)) })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "grid gap-4 md:grid-cols-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u8868\u683C\u5BC6\u5EA6" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Segmented,
+                    {
+                      block: true,
+                      value: density,
+                      options: [
+                        { label: "\u7D27\u51D1", value: "compact" },
+                        { label: "\u6807\u51C6", value: "middle" },
+                        { label: "\u5BBD\u677E", value: "loose" }
+                      ],
+                      onChange: (value) => setDensity(value)
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u8BE6\u60C5\u6253\u5F00\u65B9\u5F0F" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Segmented,
+                    {
+                      block: true,
+                      value: detailOpenMode,
+                      options: detailPageUrlBuilder ? [
+                        { label: "\u62BD\u5C49", value: "drawer" },
+                        { label: "\u65B0\u9875", value: "newPage" }
+                      ] : [{ label: "\u62BD\u5C49", value: "drawer" }],
+                      onChange: (value) => setDetailOpenMode(value)
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u9875\u5927\u5C0F" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                    import_antd32.Select,
+                    {
+                      className: "w-full",
+                      value: pageSize,
+                      options: [10, 20, 50, 100].map((value) => ({ label: `${value} \u6761`, value })),
+                      onChange: setPageSize
+                    }
+                  )
+                ] })
+              ] })
+            ] })
           }
         ),
-        selectedRowKeys.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "absolute bottom-4 left-1/2 z-10 flex -translate-x-1/2 items-center gap-3 rounded-lg border border-ant-border-secondary bg-ant-bg-elevated px-4 py-3 shadow-lg", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("span", { className: "text-sm text-ant-color-text-secondary", children: [
-            "\u5DF2\u9009 ",
-            selectedRowKeys.length,
-            " \u6761"
-          ] }),
-          !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.SwapOutlined, {}), onClick: handleBatchApprove, children: "\u6279\u91CF\u5BA1\u6279" }),
-          !readonly && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Button,
-            {
-              danger: true,
-              icon: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_icons11.DeleteOutlined, {}),
-              onClick: () => import_antd32.Modal.confirm({
-                title: "\u786E\u8BA4\u6279\u91CF\u5220\u9664",
-                content: `\u5C06\u5220\u9664 ${selectedRowKeys.length} \u6761\u6570\u636E\uFF0C\u786E\u8BA4\u7EE7\u7EED\u5417\uFF1F`,
-                onOk: () => handleDelete(selectedRowKeys.map(String))
-              }),
-              children: "\u6279\u91CF\u5220\u9664"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { type: "link", onClick: () => setSelectedRowKeys([]), children: "\u53D6\u6D88\u9009\u62E9" })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Modal,
-      {
-        title: "\u9AD8\u7EA7\u7B5B\u9009",
-        open: filterOpen,
-        width: 760,
-        onCancel: () => setFilterOpen(false),
-        onOk: () => {
-          setFilterOpen(false);
-          persistConfig({ filter: { searchKeyWord, group: filterGroup } });
-          loadData({ current: 1, pageSize, searchKeyWord, filterGroup });
-        },
-        okText: "\u5E94\u7528\u7B5B\u9009",
-        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(FilterGroupEditor, { group: filterGroup, fields, onChange: setFilterGroup })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Modal,
-      {
-        title: "\u5217\u8BBE\u7F6E",
-        open: columnOpen,
-        width: 720,
-        onCancel: () => setColumnOpen(false),
-        onOk: handleColumnCommit,
-        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "space-y-5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u663E\u793A\u5217" }),
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Modal,
+          {
+            getContainer: false,
+            title: exportScope === "selected" ? "\u5BFC\u51FA\u9009\u4E2D\u6570\u636E" : "\u5BFC\u51FA\u5168\u90E8\u6570\u636E",
+            open: exportOpen,
+            onCancel: () => setExportOpen(false),
+            footer: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { onClick: () => setExportOpen(false), children: "\u53D6\u6D88" }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Button,
+                {
+                  type: "primary",
+                  loading: exporting,
+                  disabled: exportScope === "selected" && selectedRowKeys.length === 0,
+                  onClick: () => handleExport(exportScope),
+                  children: exportScope === "selected" ? `\u5BFC\u51FA\u9009\u4E2D (${selectedRowKeys.length})` : "\u5BFC\u51FA\u5168\u90E8"
+                }
+              )
+            ] }),
+            children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
               import_antd32.Checkbox.Group,
               {
-                className: "grid grid-cols-2 gap-2 md:grid-cols-3",
-                value: showFields,
+                className: "grid grid-cols-2 gap-2",
+                value: exportFields,
                 options: fields.map((field) => ({ label: field.label, value: field.fieldId })),
-                onChange: (values) => setShowFields(values.map(String))
-              }
-            )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u51BB\u7ED3\u5217" }),
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-              import_antd32.Select,
-              {
-                mode: "multiple",
-                className: "w-full",
-                value: lockFieldIds,
-                options: showFields.map((fieldId) => {
-                  const field = fields.find((item) => item.fieldId === fieldId);
-                  return { label: field?.label || fieldId, value: fieldId };
-                }),
-                onChange: setLockFieldIds
+                onChange: (values) => setExportFields(values.map(String))
               }
             )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "grid gap-4 md:grid-cols-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u8868\u683C\u5BC6\u5EA6" }),
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Modal,
+          {
+            getContainer: false,
+            title: "\u6279\u91CF\u5BA1\u6279",
+            open: batchApprovalOpen,
+            onCancel: () => setBatchApprovalOpen(false),
+            onOk: handleBatchApprovalConfirm,
+            okText: batchApprovalAction === "approved" ? "\u786E\u8BA4\u901A\u8FC7" : "\u786E\u8BA4\u62D2\u7EDD",
+            confirmLoading: batchApproving,
+            children: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "space-y-4", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "text-sm text-ant-color-text-secondary", children: [
+                "\u5DF2\u9009\u62E9 ",
+                selectedRowKeys.length,
+                " \u6761\u8BB0\u5F55"
+              ] }),
               /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
                 import_antd32.Segmented,
                 {
                   block: true,
-                  value: density,
+                  value: batchApprovalAction,
                   options: [
-                    { label: "\u7D27\u51D1", value: "compact" },
-                    { label: "\u6807\u51C6", value: "middle" },
-                    { label: "\u5BBD\u677E", value: "loose" }
+                    { label: "\u540C\u610F", value: "approved" },
+                    { label: "\u62D2\u7EDD", value: "rejected" }
                   ],
-                  onChange: (value) => setDensity(value)
+                  onChange: (value) => setBatchApprovalAction(value)
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Input.TextArea,
+                {
+                  value: batchApprovalComments,
+                  rows: 4,
+                  maxLength: 500,
+                  showCount: true,
+                  placeholder: "\u586B\u5199\u5BA1\u6279\u610F\u89C1",
+                  onChange: (event) => setBatchApprovalComments(event.target.value)
                 }
               )
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u8BE6\u60C5\u6253\u5F00\u65B9\u5F0F" }),
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+          import_antd32.Modal,
+          {
+            getContainer: false,
+            title: "\u5BFC\u5165\u6570\u636E",
+            open: importOpen,
+            width: 720,
+            onCancel: () => setImportOpen(false),
+            onOk: handleImportConfirm,
+            okButtonProps: { disabled: !importBase64 },
+            okText: "\u786E\u8BA4\u5BFC\u5165",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                import_antd32.Upload.Dragger,
+                {
+                  accept: ".xlsx,.xls",
+                  maxCount: 1,
+                  beforeUpload: handleImportPreview,
+                  onRemove: () => {
+                    setImportBase64("");
+                    setImportPreview([]);
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("p", { className: "text-ant-color-text-secondary", children: "\u62D6\u62FD Excel \u6587\u4EF6\u5230\u6B64\u5904\uFF0C\u6216\u70B9\u51FB\u9009\u62E9\u6587\u4EF6" })
+                }
+              ),
+              importPreview.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mt-4", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u5BFC\u5165\u9884\u89C8" }),
+                /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                  import_antd32.Table,
+                  {
+                    size: "small",
+                    dataSource: importPreview,
+                    columns: importPreviewColumns,
+                    scroll: { x: Math.max(600, (importPreviewColumns?.length || 0) * 150) },
+                    pagination: false,
+                    rowKey: (_, index) => String(index)
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+          import_antd32.Drawer,
+          {
+            getContainer: false,
+            rootStyle: { position: "absolute" },
+            styles: { body: { padding: 24, overflow: "auto" } },
+            title: recordTab === "import" ? "\u5BFC\u5165\u8BB0\u5F55" : "\u5BFC\u51FA\u8BB0\u5F55",
+            open: recordsOpen,
+            width: 720,
+            onClose: () => setRecordsOpen(false),
+            children: [
               /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
                 import_antd32.Segmented,
                 {
-                  block: true,
-                  value: detailOpenMode,
+                  value: recordTab,
                   options: [
-                    { label: "\u62BD\u5C49", value: "drawer" },
-                    { label: "\u65B0\u9875", value: "newPage" }
+                    { label: "\u5BFC\u5165\u8BB0\u5F55", value: "import" },
+                    { label: "\u5BFC\u51FA\u8BB0\u5F55", value: "export" }
                   ],
-                  onChange: (value) => setDetailOpenMode(value)
+                  onChange: (value) => loadTransferRecords(value)
                 }
-              )
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u9875\u5927\u5C0F" }),
+              ),
               /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-                import_antd32.Select,
+                import_antd32.Table,
                 {
-                  className: "w-full",
-                  value: pageSize,
-                  options: [10, 20, 50, 100].map((value) => ({ label: `${value} \u6761`, value })),
-                  onChange: setPageSize
+                  className: "mt-4",
+                  size: "small",
+                  dataSource: transferRecords,
+                  rowKey: (record) => record.id || record.recordId
                 }
               )
-            ] })
-          ] })
-        ] })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Modal,
-      {
-        title: exportScope === "selected" ? "\u5BFC\u51FA\u9009\u4E2D\u6570\u636E" : "\u5BFC\u51FA\u5168\u90E8\u6570\u636E",
-        open: exportOpen,
-        onCancel: () => setExportOpen(false),
-        footer: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(import_antd32.Space, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Button, { onClick: () => setExportOpen(false), children: "\u53D6\u6D88" }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Button,
-            {
-              type: "primary",
-              loading: exporting,
-              disabled: exportScope === "selected" && selectedRowKeys.length === 0,
-              onClick: () => handleExport(exportScope),
-              children: exportScope === "selected" ? `\u5BFC\u51FA\u9009\u4E2D (${selectedRowKeys.length})` : "\u5BFC\u51FA\u5168\u90E8"
-            }
-          )
-        ] }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-          import_antd32.Checkbox.Group,
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Drawer,
           {
-            className: "grid grid-cols-2 gap-2",
-            value: exportFields,
-            options: fields.map((field) => ({ label: field.label, value: field.fieldId })),
-            onChange: (values) => setExportFields(values.map(String))
+            getContainer: false,
+            rootStyle: { position: "absolute" },
+            styles: { body: { padding: 0, overflow: "auto" } },
+            title: "\u8BE6\u60C5",
+            open: detailOpen,
+            width: 720,
+            onClose: () => setDetailOpen(false),
+            destroyOnClose: true,
+            children: activeRecord && detailRenderer ? detailRenderer({
+              record: activeRecord,
+              formInstanceId: String(getRecordId(activeRecord)),
+              onClose: () => setDetailOpen(false)
+            }) : /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Empty, { description: "\u8BF7\u901A\u8FC7 detailRenderer \u63A5\u5165\u8BE6\u60C5\u6A21\u677F" })
           }
-        )
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Modal,
-      {
-        title: "\u6279\u91CF\u5BA1\u6279",
-        open: batchApprovalOpen,
-        onCancel: () => setBatchApprovalOpen(false),
-        onOk: handleBatchApprovalConfirm,
-        okText: batchApprovalAction === "approved" ? "\u786E\u8BA4\u901A\u8FC7" : "\u786E\u8BA4\u62D2\u7EDD",
-        confirmLoading: batchApproving,
-        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "space-y-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "text-sm text-ant-color-text-secondary", children: [
-            "\u5DF2\u9009\u62E9 ",
-            selectedRowKeys.length,
-            " \u6761\u8BB0\u5F55"
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Segmented,
-            {
-              block: true,
-              value: batchApprovalAction,
-              options: [
-                { label: "\u540C\u610F", value: "approved" },
-                { label: "\u62D2\u7EDD", value: "rejected" }
-              ],
-              onChange: (value) => setBatchApprovalAction(value)
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Input.TextArea,
-            {
-              value: batchApprovalComments,
-              rows: 4,
-              maxLength: 500,
-              showCount: true,
-              placeholder: "\u586B\u5199\u5BA1\u6279\u610F\u89C1",
-              onChange: (event) => setBatchApprovalComments(event.target.value)
-            }
-          )
-        ] })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
-      import_antd32.Modal,
-      {
-        title: "\u5BFC\u5165\u6570\u636E",
-        open: importOpen,
-        width: 720,
-        onCancel: () => setImportOpen(false),
-        onOk: handleImportConfirm,
-        okButtonProps: { disabled: !importBase64 },
-        okText: "\u786E\u8BA4\u5BFC\u5165",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Upload.Dragger,
-            {
-              accept: ".xlsx,.xls",
-              maxCount: 1,
-              beforeUpload: handleImportPreview,
-              onRemove: () => {
-                setImportBase64("");
-                setImportPreview([]);
-              },
-              children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("p", { className: "text-ant-color-text-secondary", children: "\u62D6\u62FD Excel \u6587\u4EF6\u5230\u6B64\u5904\uFF0C\u6216\u70B9\u51FB\u9009\u62E9\u6587\u4EF6" })
-            }
-          ),
-          importPreview.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { className: "mt-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { className: "mb-2 text-sm font-medium text-ant-color-text", children: "\u5BFC\u5165\u9884\u89C8" }),
-            /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-              import_antd32.Table,
-              {
-                size: "small",
-                dataSource: importPreview,
-                columns: importPreviewColumns,
-                scroll: { x: Math.max(600, (importPreviewColumns?.length || 0) * 150) },
-                pagination: false,
-                rowKey: (_, index) => String(index)
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          import_antd32.Drawer,
+          {
+            getContainer: false,
+            rootStyle: { position: "absolute" },
+            styles: { body: { padding: 0, overflow: "auto" } },
+            title: "\u65B0\u589E\u6570\u636E",
+            open: submitOpen,
+            width: 720,
+            onClose: () => setSubmitOpen(false),
+            destroyOnClose: true,
+            children: submitRenderer ? submitRenderer({
+              onClose: () => setSubmitOpen(false),
+              onSubmitted: () => {
+                setSubmitOpen(false);
+                loadData({ current: 1, pageSize });
               }
-            )
-          ] })
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
-      import_antd32.Drawer,
-      {
-        title: recordTab === "import" ? "\u5BFC\u5165\u8BB0\u5F55" : "\u5BFC\u51FA\u8BB0\u5F55",
-        open: recordsOpen,
-        width: 720,
-        onClose: () => setRecordsOpen(false),
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Segmented,
-            {
-              value: recordTab,
-              options: [
-                { label: "\u5BFC\u5165\u8BB0\u5F55", value: "import" },
-                { label: "\u5BFC\u51FA\u8BB0\u5F55", value: "export" }
-              ],
-              onChange: (value) => loadTransferRecords(value)
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-            import_antd32.Table,
-            {
-              className: "mt-4",
-              size: "small",
-              dataSource: transferRecords,
-              rowKey: (record) => record.id || record.recordId
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Drawer,
-      {
-        title: "\u8BE6\u60C5",
-        open: detailOpen,
-        width: 720,
-        onClose: () => setDetailOpen(false),
-        destroyOnClose: true,
-        children: activeRecord && detailRenderer ? detailRenderer({
-          record: activeRecord,
-          formInstanceId: String(getRecordId(activeRecord)),
-          onClose: () => setDetailOpen(false)
-        }) : /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Empty, { description: "\u8BF7\u901A\u8FC7 detailRenderer \u63A5\u5165\u8BE6\u60C5\u6A21\u677F" })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
-      import_antd32.Drawer,
-      {
-        title: "\u65B0\u589E\u6570\u636E",
-        open: submitOpen,
-        width: 720,
-        onClose: () => setSubmitOpen(false),
-        destroyOnClose: true,
-        children: submitRenderer ? submitRenderer({
-          onClose: () => setSubmitOpen(false),
-          onSubmitted: () => {
-            setSubmitOpen(false);
-            loadData({ current: 1, pageSize });
+            }) : /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Empty, { description: "\u8BF7\u901A\u8FC7 submitRenderer \u63A5\u5165\u63D0\u4EA4\u6A21\u677F" })
           }
-        }) : /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_antd32.Empty, { description: "\u8BF7\u901A\u8FC7 submitRenderer \u63A5\u5165\u63D0\u4EA4\u6A21\u677F" })
-      }
-    )
-  ] });
+        )
+      ]
+    }
+  ) });
 };
 
 // src/templates/FormSubmitTemplate.tsx
@@ -11060,7 +11440,7 @@ var InnerFormContent = ({
           data: formData,
           submissionDepartmentId: departmentId
         });
-        setPreviewRoutes(routes);
+        setPreviewRoutes(Array.isArray(routes) ? routes : []);
       } catch (error) {
         console.error("[FormSubmitTemplate] Preview failed:", error);
         setPreviewRoutes([]);
@@ -11150,56 +11530,72 @@ var InnerFormContent = ({
       }
     )
   ] }) : null;
-  const actionsNode = !submitted ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(StickyActionBar, { actions, inDrawer }) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(RuntimePageShell, { actions: actionsNode, inDrawer, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "space-y-6", children: [
-      header || /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-        SummaryPanel,
-        {
-          title: schema.formMeta.title,
-          eyebrow: formType === "process" ? "\u6D41\u7A0B\u53D1\u8D77" : "\u6570\u636E\u63D0\u4EA4",
-          status: formType === "process" ? { label: "\u5F85\u63D0\u4EA4", tone: "brand" } : void 0
-        }
-      ),
-      enableDraft && hasDraft && !submitted && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-        DraftManager,
-        {
-          hasDraft,
-          draftTimestamp,
-          onRestore: handleRestoreDraft,
-          onDiscard: clearDraft
-        }
-      ) }),
-      !submitted ? /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "rounded-lg border border-ant-border-secondary bg-ant-bg-container p-5 md:p-6", children: [
-        departmentSelector,
-        beforeForm,
-        renderForm ? renderForm({ schema, config }) : /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(FormRenderer, { columns: 2 }),
-        afterForm
-      ] }) : successInfo && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-        SubmitSuccessCard,
-        {
-          info: successInfo,
-          mode: submitSuccessMode,
-          isRedirecting,
-          countdown,
-          onContinue: handleContinue,
-          onViewDetail: handleViewDetail,
-          renderSuccess
-        }
-      ),
-      footer
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-      ProcessPreview,
-      {
-        open: previewOpen,
-        routes: previewRoutes,
-        loading: previewLoading,
-        onClose: () => setPreviewOpen(false),
-        onConfirm: handlePreviewConfirm
-      }
-    )
-  ] });
+  const actionsNode = !submitted ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+    StickyActionBar,
+    {
+      actions,
+      inDrawer,
+      position: "inline",
+      className: inDrawer ? "mt-5 -mx-4 -mb-4 rounded-b-lg md:-mx-5 md:-mb-5" : "mt-6 -mx-5 -mb-5 rounded-b-lg md:-mx-6 md:-mb-6"
+    }
+  ) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
+    RuntimePageShell,
+    {
+      inDrawer,
+      maxWidth: inDrawer ? "100%" : 1240,
+      contentClassName: inDrawer ? "px-4 py-4 md:px-5" : "py-4 md:py-6",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "space-y-6", children: [
+          header,
+          enableDraft && hasDraft && !submitted && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+            DraftManager,
+            {
+              hasDraft,
+              draftTimestamp,
+              onRestore: handleRestoreDraft,
+              onDiscard: clearDraft
+            }
+          ) }),
+          !submitted ? /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
+            "div",
+            {
+              className: `rounded-lg border border-ant-border-secondary bg-ant-bg-container ${inDrawer ? "p-4 md:p-5" : "p-5 shadow-sm md:p-6"}`,
+              children: [
+                departmentSelector,
+                beforeForm,
+                renderForm ? renderForm({ schema, config }) : /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(FormRenderer, { columns: 2 }),
+                afterForm,
+                actionsNode
+              ]
+            }
+          ) : successInfo && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+            SubmitSuccessCard,
+            {
+              info: successInfo,
+              mode: submitSuccessMode,
+              isRedirecting,
+              countdown,
+              onContinue: handleContinue,
+              onViewDetail: handleViewDetail,
+              renderSuccess
+            }
+          ),
+          footer
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+          ProcessPreview,
+          {
+            open: previewOpen,
+            routes: previewRoutes,
+            loading: previewLoading,
+            onClose: () => setPreviewOpen(false),
+            onConfirm: handlePreviewConfirm
+          }
+        )
+      ]
+    }
+  );
 };
 var FormSubmitTemplate = ({
   schema,
@@ -11246,6 +11642,7 @@ var FormSubmitTemplate = ({
 
 // src/templates/FormDetailTemplate.tsx
 var import_react63 = require("react");
+var import_dayjs6 = __toESM(require("dayjs"));
 
 // src/templates/PageSkeleton.tsx
 var import_antd34 = require("antd");
@@ -11317,6 +11714,11 @@ function FormDataBridge({
   formDataRef.current = getFormData2;
   return null;
 }
+var formatDateTime2 = (value) => {
+  if (!value || typeof value !== "string") return value || "-";
+  const parsed = (0, import_dayjs6.default)(value);
+  return parsed.isValid() ? parsed.format("YYYY-MM-DD HH:mm:ss") : value;
+};
 var InnerDetailContent = ({
   schema,
   formUuid,
@@ -11427,14 +11829,36 @@ var InnerDetailContent = ({
     renderSummary && instanceInfo ? renderSummary(instanceInfo) : /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
       SummaryPanel,
       {
-        title: instanceInfo?.title || formData?.instanceTitle || schema.formMeta.title,
+        title: instanceInfo?.title || instanceInfo?.instanceTitle || schema.formMeta.title,
         eyebrow: `\u6570\u636E\u5B9E\u4F8B ${formInstanceId?.slice(0, 8) || "-"}`,
-        creator: instanceInfo?.creator ? {
-          name: instanceInfo.creator.name,
-          avatar: instanceInfo.creator.avatar,
-          department: instanceInfo.creator.department
+        creator: instanceInfo?.creator || instanceInfo?.createdByName ? {
+          name: instanceInfo?.creator?.name || instanceInfo?.createdByName,
+          avatar: instanceInfo?.creator?.avatar,
+          department: instanceInfo?.creator?.department || instanceInfo?.createdByDepartmentName
         } : void 0,
-        createdAt: instanceInfo?.createdAt,
+        createdAt: formatDateTime2(instanceInfo?.createdAt),
+        metaItems: [
+          {
+            key: "creator",
+            label: "\u521B\u5EFA\u4EBA",
+            value: instanceInfo?.creator?.name || instanceInfo?.createdByName || "\u672A\u77E5\u7528\u6237"
+          },
+          {
+            key: "department",
+            label: "\u521B\u5EFA\u4EBA\u90E8\u95E8",
+            value: instanceInfo?.creator?.department || instanceInfo?.createdByDepartmentName || "-"
+          },
+          {
+            key: "createdAt",
+            label: "\u521B\u5EFA\u65F6\u95F4",
+            value: formatDateTime2(instanceInfo?.createdAt)
+          },
+          {
+            key: "updatedAt",
+            label: "\u66F4\u65B0\u65F6\u95F4",
+            value: formatDateTime2(instanceInfo?.updatedAt)
+          }
+        ],
         status: mode === "edit" ? { label: "\u7F16\u8F91\u4E2D", tone: "brand" } : void 0
       }
     ),