openxiangda-cli 2.0.0-alpha.89 → 2.0.0-alpha.91

package/template/apps/web/src/components/resource/GeneratedResourceCrud.tsx

@@ -1,1184 +0,0 @@
-import {
-  ArrowRightOutlined,
-  ColumnHeightOutlined,
-  DeleteOutlined,
-  EditOutlined,
-  EyeOutlined,
-  ExportOutlined,
-  PlusOutlined,
-  ReloadOutlined,
-  SearchOutlined,
-  SettingOutlined,
-  UpOutlined,
-  DownOutlined,
-} from '@ant-design/icons';
-import { useCreate, useDelete, useList, useOne, useUpdate } from '@refinedev/core';
-import {
-  App,
-  Alert,
-  Button,
-  Card,
-  Collapse,
-  Descriptions,
-  Dropdown,
-  Empty,
-  Form,
-  Input,
-  Popconfirm,
-  Result,
-  Select,
-  Space,
-  Spin,
-  Table,
-  Tooltip,
-  Typography,
-  type MenuProps,
-  type TableColumnsType,
-} from 'antd';
-import type {
-  DataAuditEntry,
-  DataResourceSurface,
-  DataTransactionOperation,
-  SubjectProfile,
-  UserReferenceValue,
-} from 'openxiangda-contracts/browser';
-import { useEffect, useMemo, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
-import { resourceDefinitions } from '../../../../../packages/contracts/src/generated.js';
-import {
-  MobileResourceDetailPage,
-  MobileResourceFormPage,
-  MobileResourceListPage,
-  ResourceDetailPage,
-  ResourceFormPage,
-  ResourceListPage,
-} from './StandardResourcePages';
-import {
-  listSurfaceFields,
-  MobileSurfaceFieldControl,
-  SurfaceFieldControl,
-  SurfaceFieldValue,
-  SurfaceFilterControl,
-  type SurfaceField,
-} from './SurfaceFields';
-import {
-  createNativeResourceClient,
-  transactNativeData,
-  type GenericResourceQuery,
-} from '../../platform-client';
-import { normalizeFormValues, normalizeRecordForForm } from '../platform-fields/field-form-codec';
-import { DirectoryIdentityText } from '../../AuthoritativeSelector';
-import { useRuntime } from '../../runtime';
-import { ResourceBatchActions, ResourceImportButton } from './ResourceBatchActions';
-import {
-  SubtableField,
-  SubtableValueDisplay,
-} from '../platform-fields/SubtableField';
-import {
-  buildSubtableOperations,
-  type SubtableDraftRow,
-} from '../platform-fields/subtable-value';
-import type { GeneratedResourceDefinition } from './generated-resource-definition';
-
-type ResourceRecord = Record<string, unknown> & {
-  id: string;
-  revision: number;
-  updated_at?: string;
-};
-
-const definitions = resourceDefinitions as unknown as Record<
-  string,
-  GeneratedResourceDefinition
->;
-
-function signatureSigner(profile: SubjectProfile | null): UserReferenceValue | undefined {
-  if (!profile) return undefined;
-  return {
-    label: profile.displayName,
-    value: profile.userId,
-    ...(profile.avatarUrl ? { avatarUrl: profile.avatarUrl } : {}),
-    ...(profile.jobNumber ? { employeeNo: profile.jobNumber } : {}),
-    ...(profile.affiliatedDepartment
-      ? {
-          departments: [{
-            label: profile.affiliatedDepartment.name,
-            value: profile.affiliatedDepartment.id,
-          }],
-        }
-      : {}),
-  };
-}
-
-function definitionFor(resourceCode: string) {
-  return definitions[resourceCode];
-}
-
-function fieldFor(surface: DataResourceSurface, key: string): SurfaceField {
-  const field = surface.fields[key];
-  return field
-    ? { key, ...field }
-    : {
-        key,
-        label: key,
-        type: 'text.short',
-        widget: 'text',
-        readCapabilities: [],
-        createCapabilities: [],
-        updateCapabilities: [],
-      };
-}
-
-function fieldsBySection(surface: DataResourceSurface) {
-  const groups = new Map<string, SurfaceField[]>();
-  for (const [key, field] of Object.entries(surface.fields)) {
-    if (field.system) continue;
-    const section = field.section || 'default';
-    groups.set(section, [...(groups.get(section) || []), { key, ...field }]);
-  }
-  return [...groups.entries()].map(([section, fields]) => ({
-    section,
-    fields,
-  }));
-}
-
-function fieldWriteAuthorized(field: SurfaceField, mode: 'create' | 'edit', hasCapability: (code: string) => boolean, isAppSuperAdmin: boolean) {
-  if (isAppSuperAdmin) return true;
-  const capabilities = mode === 'create' ? field.createCapabilities : field.updateCapabilities;
-  return capabilities.length > 0 && capabilities.every(hasCapability);
-}
-
-function fieldWritable(field: SurfaceField, mode: 'create' | 'edit', hasCapability: (code: string) => boolean, isAppSuperAdmin: boolean) {
-  return field.widget !== 'readonly' && fieldWriteAuthorized(field, mode, hasCapability, isAppSuperAdmin);
-}
-
-function fieldReadable(field: SurfaceField, hasCapability: (code: string) => boolean, isAppSuperAdmin: boolean) {
-  return isAppSuperAdmin || (field.readCapabilities.length > 0 && field.readCapabilities.every(hasCapability));
-}
-
-function auditOperationLabel(operation: DataAuditEntry['operation']) {
-  return operation === 'created' ? '创建' : operation === 'deleted' ? '删除' : '更新';
-}
-
-function auditValue(field: SurfaceField, value: unknown) {
-  if (value === undefined || value === null || value === '') {
-    return <Typography.Text type="secondary">-</Typography.Text>;
-  }
-  return <SurfaceFieldValue field={field} value={value} />;
-}
-
-function auditChangeFields(entry: DataAuditEntry, surface: DataResourceSurface) {
-  const fields = fieldsBySection(surface).flatMap((group) => group.fields);
-  const source = entry.changes || entry.record || entry.before || {};
-  return fields.filter((field) => Object.prototype.hasOwnProperty.call(source, field.key));
-}
-
-async function exportResourceRows(
-  code: string,
-  name: string,
-  surface: DataResourceSurface,
-  fields: SurfaceField[],
-  query: Partial<GenericResourceQuery>,
-  sort: { field: string; order: 'asc' | 'desc' }
-) {
-  const client = createNativeResourceClient(code, surface);
-  const exported = await client.exportCsv({
-    page: 1,
-    pageSize: 200,
-    keyword: query.keyword,
-    searchField: query.searchField,
-    filters: query.filters,
-    sort,
-  }, fields.map((field) => field.key));
-  const url = URL.createObjectURL(exported.blob);
-  const anchor = document.createElement('a');
-  anchor.href = url;
-  anchor.download = exported.fileName || `${name}.csv`;
-  anchor.click();
-  window.setTimeout(() => URL.revokeObjectURL(url), 0);
-  return { rowLimit: exported.rowLimit };
-}
-
-function AuditEntry({ entry, surface, readable }: { entry: DataAuditEntry; surface: DataResourceSurface; readable: (field: SurfaceField) => boolean }) {
-  const fields = auditChangeFields(entry, surface).filter(readable);
-  const changes = entry.changes || entry.record || entry.before || {};
-  return (
-    <div className="oxa-audit-entry">
-      <div className="oxa-audit-heading">
-        <strong>{auditOperationLabel(entry.operation)}</strong>
-        <Typography.Text type="secondary">版本 {entry.revision}</Typography.Text>
-      </div>
-      <div className="oxa-audit-meta">
-        <span>操作人</span>
-        {entry.actor.principalType === 'application' ? (
-          <Typography.Text>
-            应用服务
-            {entry.actor.oauthClientId ? `（${entry.actor.oauthClientId}）` : ''}
-          </Typography.Text>
-        ) : (
-          <DirectoryIdentityText id={entry.actor.userId} source="user" />
-        )}
-        <span>时间</span>
-        <Typography.Text>{new Date(entry.occurredAt).toLocaleString('zh-CN')}</Typography.Text>
-      </div>
-      {fields.length ? (
-        <div className="oxa-audit-changes">
-          {fields.map((field) => {
-            const before = entry.operation === 'created' ? undefined : entry.before?.[field.key];
-            const after = entry.operation === 'deleted' ? undefined : changes[field.key];
-            return (
-              <div className="oxa-audit-change" key={field.key}>
-                <Typography.Text strong>{field.label}</Typography.Text>
-                <div className="oxa-audit-change-values">
-                  {auditValue(field, before)}
-                  <ArrowRightOutlined />
-                  {auditValue(field, after)}
-                </div>
-              </div>
-            );
-          })}
-        </div>
-      ) : (
-        <Typography.Text type="secondary">未发生字段变化</Typography.Text>
-      )}
-    </div>
-  );
-}
-
-function useGeneratedList(
-  definition: GeneratedResourceDefinition,
-  readableFieldCodes: Set<string>
-) {
-  const { code, surface } = definition;
-  const declaredDefaultSort = surface.list?.defaultSort?.field;
-  const defaultSortField =
-    (declaredDefaultSort && readableFieldCodes.has(declaredDefaultSort)
-      ? declaredDefaultSort
-      : Object.keys(surface.fields).find((field) => readableFieldCodes.has(field))) || 'id';
-  const defaultSortOrder = surface.list?.defaultSort?.order || 'asc';
-  const defaultPageSize = surface.list?.defaultPageSize || 20;
-  const defaultSearchField = (surface.list?.searchableFields || []).find((field) =>
-    readableFieldCodes.has(field)
-  );
-  const [page, setPage] = useState(1);
-  const [pageSize, setPageSize] = useState(defaultPageSize);
-  const [draft, setDraft] = useState<Partial<GenericResourceQuery>>({ searchField: defaultSearchField });
-  const [query, setQuery] = useState<Partial<GenericResourceQuery>>({});
-  const [sort, setSort] = useState({
-    field: defaultSortField,
-    order: defaultSortOrder as 'asc' | 'desc',
-  });
-  useEffect(() => {
-    setPage(1);
-    setPageSize(defaultPageSize);
-    setDraft({ searchField: defaultSearchField });
-    setQuery({});
-    setSort({
-      field: defaultSortField,
-      order: defaultSortOrder as 'asc' | 'desc',
-    });
-  }, [code, defaultPageSize, defaultSearchField, defaultSortField, defaultSortOrder]);
-  const list = useList<ResourceRecord>({
-    resource: code,
-    pagination: { currentPage: page, pageSize },
-    sorters: [sort],
-    meta: { query },
-  });
-  return {
-    draft,
-    list,
-    page,
-    pageSize,
-    query,
-    setDraft,
-    setPage,
-    setPageSize,
-    setQuery,
-    setSort,
-    sort,
-  };
-}
-
-export function GeneratedResourcePage({
-  resourceCode,
-  mode = 'list',
-  variant = 'desktop',
-  definition: providedDefinition,
-}: {
-  resourceCode: string;
-  mode?: 'list' | 'create' | 'edit' | 'detail';
-  variant?: 'desktop' | 'mobile';
-  definition?: GeneratedResourceDefinition;
-}) {
-  const definition = providedDefinition || definitionFor(resourceCode);
-  if (!definition || definition.surface.generated === false) {
-    return <Result status="404" title="未声明可生成的资源页面" />;
-  }
-  const pageKey = `${variant}:${mode}:${resourceCode}`;
-  if (mode === 'list') return <GeneratedResourceListPage key={pageKey} definition={definition} variant={variant} />;
-  if (mode === 'detail') return <GeneratedResourceDetailPage key={pageKey} definition={definition} variant={variant} />;
-  return <GeneratedResourceFormPage key={pageKey} definition={definition} mode={mode} variant={variant} />;
-}
-
-function GeneratedResourceListPage({ definition, variant }: { definition: GeneratedResourceDefinition; variant: 'desktop' | 'mobile' }) {
-  return variant === 'mobile' ? <GeneratedMobileList definition={definition} /> : <GeneratedDesktopList definition={definition} />;
-}
-
-function GeneratedDesktopList({ definition }: { definition: GeneratedResourceDefinition }) {
-  const navigate = useNavigate();
-  const { message } = App.useApp();
-  const { hasCapability, identity } = useRuntime();
-  const { code, name, surface, capabilities } = definition;
-  const fields = listSurfaceFields(surface.fields).filter((field) =>
-    fieldReadable(field, hasCapability, identity.isAppSuperAdmin)
-  );
-  const readableFieldCodes = new Set(
-    Object.entries(surface.fields)
-      .filter(([, field]) => fieldReadable({ key: '', ...field }, hasCapability, identity.isAppSuperAdmin))
-      .map(([key]) => key)
-  );
-  const state = useGeneratedList(definition, readableFieldCodes);
-  const [exporting, setExporting] = useState(false);
-  const [filtersExpanded, setFiltersExpanded] = useState(false);
-  const [density, setDensity] = useState<'small' | 'middle' | 'large'>('middle');
-  const [visibleColumnKeys, setVisibleColumnKeys] = useState<string[]>(() => fields.map((field) => field.key));
-  const [selectedRowKeys, setSelectedRowKeys] = useState<string[]>([]);
-  const remove = useDelete();
-  const rows = (state.list.result.data || []) as unknown as ResourceRecord[];
-  useEffect(() => {
-    setVisibleColumnKeys(fields.map((field) => field.key));
-    setFiltersExpanded(false);
-    setDensity('middle');
-    setSelectedRowKeys([]);
-  }, [code]);
-  useEffect(() => {
-    setSelectedRowKeys([]);
-  }, [code, state.page, state.pageSize, state.query, state.sort.field, state.sort.order]);
-  const formFields = fieldsBySection(surface).flatMap((group) => group.fields);
-  const importWritableFieldCodes = formFields
-    .filter((field) => field.widget !== 'readonly' && fieldWritable(field, 'create', hasCapability, identity.isAppSuperAdmin))
-    .map((field) => field.key);
-  const batchWritableFields = formFields.filter(
-    (field) => !['file', 'readonly'].includes(field.widget || '') && fieldWritable(field, 'edit', hasCapability, identity.isAppSuperAdmin)
-  );
-  const selectedRows = rows.filter((row) => selectedRowKeys.includes(row.id));
-  const canBatch = hasCapability(capabilities.update) || hasCapability(capabilities.delete);
-  const columns = useMemo<TableColumnsType<ResourceRecord>>(
-    () => [
-      ...fields
-        .filter((field) => visibleColumnKeys.includes(field.key))
-        .map((field) => ({
-          title: field.label,
-          dataIndex: field.key,
-          key: field.key,
-          sorter: Boolean(field.sortable),
-          render: (value: unknown, record: ResourceRecord) => (
-            <SurfaceFieldValue
-              field={field}
-              resourceCode={code}
-              value={value}
-              renderers={{
-                renderValue: ({ value: current }) =>
-                  field.key === fields[0]?.key ? (
-                    <a onClick={() => navigate(`/${code}/${record.id}`)}>{String(current || '-')}</a>
-                  ) : undefined,
-              }}
-            />
-          ),
-        })),
-      {
-        title: '更新时间',
-        dataIndex: 'updated_at',
-        key: 'updated_at',
-        render: (value) => (value ? new Date(String(value)).toLocaleString('zh-CN') : '-'),
-      },
-      {
-        title: '操作',
-        key: 'actions',
-        fixed: 'right' as const,
-        render: (_: unknown, record: ResourceRecord) => (
-          <Space size={4}>
-            <Button aria-label="查看" icon={<EyeOutlined />} onClick={() => navigate(`/${code}/${record.id}`)} size="small" type="text" />
-            {hasCapability(capabilities.update) && (
-              <Button
-                aria-label="编辑"
-                icon={<EditOutlined />}
-                onClick={() => navigate(`/${code}/${record.id}/edit`)}
-                size="small"
-                type="text"
-              />
-            )}
-            {hasCapability(capabilities.delete) && (
-              <Popconfirm
-                onConfirm={() =>
-                  remove.mutate(
-                    {
-                      resource: code,
-                      id: record.id,
-                      meta: { expectedRevision: record.revision },
-                    },
-                    {
-                      onSuccess: () => {
-                        message.success('已删除');
-                        void state.list.query.refetch();
-                      },
-                    }
-                  )
-                }
-                title={`确定删除${name}？`}
-              >
-                <Button aria-label="删除" danger icon={<DeleteOutlined />} size="small" type="text" />
-              </Popconfirm>
-            )}
-          </Space>
-        ),
-      },
-    ],
-    [
-      capabilities.delete,
-      capabilities.update,
-      code,
-      fields,
-      hasCapability,
-      message,
-      name,
-      navigate,
-      remove,
-      state.list.query,
-      visibleColumnKeys,
-    ]
-  );
-  const handleExport = async () => {
-    setExporting(true);
-    try {
-      const result = await exportResourceRows(code, name, surface, fields, state.query, state.sort);
-      message.success(`导出已生成（最多 ${result.rowLimit} 条）`);
-    } catch (error) {
-      message.error(error instanceof Error ? error.message : '导出失败');
-    } finally {
-      setExporting(false);
-    }
-  };
-  const filterFields = (surface.list?.filterFields || []).filter((field) =>
-    readableFieldCodes.has(field)
-  );
-  const searchableFields = (surface.list?.searchableFields || []).filter((field) =>
-    readableFieldCodes.has(field)
-  );
-  const hasMoreFilters = filterFields.length > 2;
-  const columnMenu: MenuProps = {
-    items: fields.map((field) => ({ key: field.key, label: field.label })),
-    multiple: true,
-    selectable: true,
-    selectedKeys: visibleColumnKeys,
-    onSelect: ({ selectedKeys }) => setVisibleColumnKeys(selectedKeys.map(String)),
-    onDeselect: ({ selectedKeys }) => {
-      if (selectedKeys.length) setVisibleColumnKeys(selectedKeys.map(String));
-      else message.info('至少保留一列');
-    },
-  };
-  const densityMenu: MenuProps = {
-    items: [
-      { key: 'large', label: '宽松' },
-      { key: 'middle', label: '标准' },
-      { key: 'small', label: '紧凑' },
-    ],
-    selectable: true,
-    selectedKeys: [density],
-    onClick: ({ key }) => setDensity(key as typeof density),
-  };
-  return (
-    <ResourceListPage
-      createCapability={capabilities.create}
-      createPath={`/${code}/new`}
-      readCapability={capabilities.read}
-      resource={code}
-      surface={surface}
-      title={name}
-    >
-      {state.list.query.isError && (
-        <Alert
-          action={
-            <Button onClick={() => void state.list.query.refetch()} size="small">
-              重试
-            </Button>
-          }
-          description={state.list.query.error instanceof Error ? state.list.query.error.message : '请稍后重试或联系平台管理员'}
-          showIcon
-          title="数据读取失败"
-          type="error"
-        />
-      )}
-      <section aria-label="数据筛选" className="oxa-search-panel">
-        <div className="oxa-filter-grid">
-          <div className="oxa-filter-item">
-            <Select
-              allowClear
-              options={searchableFields.map((key) => ({
-                label: fieldFor(surface, key).label,
-                value: key,
-              }))}
-              placeholder="搜索字段"
-              value={state.draft.searchField}
-              onChange={(value) => state.setDraft((item) => ({ ...item, searchField: value }))}
-            />
-          </div>
-          <div className="oxa-filter-item">
-            <Input
-              allowClear
-              onChange={(event) =>
-                state.setDraft((item) => ({
-                  ...item,
-                  keyword: event.target.value,
-                }))
-              }
-              onPressEnter={() => {
-                state.setPage(1);
-                state.setQuery(state.draft);
-              }}
-              placeholder="关键词"
-              prefix={<SearchOutlined />}
-              value={state.draft.keyword}
-            />
-          </div>
-          {filterFields.map((key, index) => {
-            const field = fieldFor(surface, key);
-            return (
-              <div className={`oxa-filter-item${index >= 2 && !filtersExpanded ? ' is-collapsed' : ''}`} key={key}>
-                <SurfaceFilterControl
-                  field={field}
-                  resourceCode={code}
-                  onChange={(value) =>
-                    state.setDraft((item) => ({
-                      ...item,
-                      filters: { ...item.filters, [key]: value },
-                    }))
-                  }
-                  value={state.draft.filters?.[key]}
-                />
-              </div>
-            );
-          })}
-        </div>
-        <div className="oxa-filter-actions">
-          <Button
-            icon={<SearchOutlined />}
-            loading={state.list.query.isFetching}
-            onClick={() => {
-              state.setPage(1);
-              state.setQuery(state.draft);
-            }}
-            type="primary"
-          >
-            查询
-          </Button>
-          <Button
-            onClick={() => {
-              state.setDraft({});
-              state.setQuery({});
-              state.setPage(1);
-            }}
-          >
-            重置
-          </Button>
-          {hasMoreFilters && (
-            <Button
-              icon={filtersExpanded ? <UpOutlined /> : <DownOutlined />}
-              onClick={() => setFiltersExpanded((value) => !value)}
-              type="link"
-            >
-              {filtersExpanded ? '收起筛选' : `更多筛选（${filterFields.length - 2}）`}
-            </Button>
-          )}
-        </div>
-      </section>
-      <div className="oxa-list-toolbar">
-        <Space className="oxa-list-toolbar-primary" wrap>
-          {hasCapability(capabilities.create) && (
-            <Button icon={<PlusOutlined />} onClick={() => navigate(`/${code}/new`)} type="primary">
-              新增{name}
-            </Button>
-          )}
-          {hasCapability(capabilities.create) && (
-            <ResourceImportButton
-              code={code}
-              name={name}
-              surface={surface}
-              writableFieldCodes={importWritableFieldCodes}
-              onCompleted={() => state.list.query.refetch()}
-            />
-          )}
-          <Button icon={<ExportOutlined />} loading={exporting} onClick={() => void handleExport()}>
-            导出
-          </Button>
-        </Space>
-        <Space className="oxa-list-toolbar-secondary" size={4}>
-          <Tooltip title="刷新">
-            <Button
-              aria-label="刷新数据"
-              icon={<ReloadOutlined />}
-              loading={state.list.query.isFetching}
-              onClick={() => void state.list.query.refetch()}
-              type="text"
-            />
-          </Tooltip>
-          <Dropdown menu={columnMenu} trigger={['click']}>
-            <Button icon={<SettingOutlined />} type="text">
-              列设置
-            </Button>
-          </Dropdown>
-          <Dropdown menu={densityMenu} trigger={['click']}>
-            <Button icon={<ColumnHeightOutlined />} type="text">
-              密度
-            </Button>
-          </Dropdown>
-        </Space>
-      </div>
-      <ResourceBatchActions
-        canDelete={hasCapability(capabilities.delete)}
-        code={code}
-        name={name}
-        onClear={() => setSelectedRowKeys([])}
-        onCompleted={() => state.list.query.refetch()}
-        rows={selectedRows}
-        surface={surface}
-        writableFields={batchWritableFields}
-      />
-      <Table<ResourceRecord>
-        columns={columns}
-        dataSource={rows}
-        loading={state.list.query.isFetching}
-        locale={{ emptyText: <Empty description={`暂无${name}`} /> }}
-        rowKey="id"
-        rowSelection={
-          canBatch
-            ? {
-                selectedRowKeys,
-                onChange: (keys) => {
-                  const next = keys.map(String);
-                  if (next.length > 100) message.warning('单次最多选择 100 条记录');
-                  setSelectedRowKeys(next.slice(0, 100));
-                },
-              }
-            : undefined
-        }
-        scroll={{ x: 'max-content' }}
-        size={density}
-        onChange={(_, __, sorter) => {
-          const item = Array.isArray(sorter) ? sorter[0] : sorter;
-          if (item?.field && item.order)
-            state.setSort({
-              field: String(item.field),
-              order: item.order === 'ascend' ? 'asc' : 'desc',
-            });
-        }}
-        pagination={{
-          current: state.page,
-          pageSize: state.pageSize,
-          total: state.list.result.total || 0,
-          showSizeChanger: true,
-          onChange: (next, size) => {
-            state.setPage(next);
-            state.setPageSize(size);
-          },
-        }}
-      />
-    </ResourceListPage>
-  );
-}
-
-function GeneratedMobileList({ definition }: { definition: GeneratedResourceDefinition }) {
-  const navigate = useNavigate();
-  const { hasCapability, identity } = useRuntime();
-  const { message } = App.useApp();
-  const { code, name, surface, capabilities } = definition;
-  const readableFieldCodes = new Set(
-    Object.entries(surface.fields)
-      .filter(([, field]) => fieldReadable({ key: '', ...field }, hasCapability, identity.isAppSuperAdmin))
-      .map(([key]) => key)
-  );
-  const state = useGeneratedList(definition, readableFieldCodes);
-  const [exporting, setExporting] = useState(false);
-  const rows = (state.list.result.data || []) as unknown as ResourceRecord[];
-  const fields = listSurfaceFields(surface.fields)
-    .filter((field) => fieldReadable(field, hasCapability, identity.isAppSuperAdmin))
-    .slice(0, 4);
-  const handleExport = async () => {
-    setExporting(true);
-    try {
-      const result = await exportResourceRows(code, name, surface, fields, state.query, state.sort);
-      message.success(`导出已生成（最多 ${result.rowLimit} 条）`);
-    } catch (error) {
-      message.error(error instanceof Error ? error.message : '导出失败');
-    } finally {
-      setExporting(false);
-    }
-  };
-  return (
-    <MobileResourceListPage
-      createCapability={capabilities.create}
-      createPath={`/${code}/new`}
-      description={`${code} 资源`}
-      onExport={() => void handleExport()}
-      readCapability={capabilities.read}
-      resource={code}
-      surface={surface}
-      title={name}
-    >
-      {state.list.query.isError && (
-        <Alert
-          action={
-            <Button onClick={() => void state.list.query.refetch()} size="small">
-              重试
-            </Button>
-          }
-          description={state.list.query.error instanceof Error ? state.list.query.error.message : '请稍后重试或联系平台管理员'}
-          showIcon
-          title="数据读取失败"
-          type="error"
-        />
-      )}
-      <div className="oxa-mobile-filter">
-        <Input
-          allowClear
-          placeholder="关键词"
-          value={state.draft.keyword}
-          onChange={(event) => state.setDraft((item) => ({ ...item, keyword: event.target.value }))}
-          onPressEnter={() => {
-            state.setPage(1);
-            state.setQuery(state.draft);
-          }}
-        />
-        <Button
-          loading={state.list.query.isFetching}
-          icon={<SearchOutlined />}
-          onClick={() => {
-            state.setPage(1);
-            state.setQuery(state.draft);
-          }}
-          type="primary"
-        >
-          查询
-        </Button>
-      </div>
-      {state.list.query.isFetching ? (
-        <div className="oxa-page-loading">
-          <Spin />
-        </div>
-      ) : rows.length ? (
-        <div className="oxa-mobile-record-list">
-          {rows.map((record) => (
-            <Card className="oxa-mobile-record-card" key={record.id} size="small">
-              <div className="oxa-mobile-record-heading">
-                <a onClick={() => navigate(`/${code}/${record.id}`)}>{String(record[fields[0]?.key || 'id'] || '-')}</a>
-              </div>
-              <div className="oxa-mobile-record-fields">
-                {fields.slice(1).map((field) => (
-                  <div key={field.key}>
-                    <Typography.Text type="secondary">{field.label}</Typography.Text>
-                    <div>
-                      <SurfaceFieldValue field={field} resourceCode={code} value={record[field.key]} />
-                    </div>
-                  </div>
-                ))}
-              </div>
-              <Space>
-                <Button onClick={() => navigate(`/${code}/${record.id}`)} size="small">
-                  查看
-                </Button>
-                {hasCapability(capabilities.update) && (
-                  <Button onClick={() => navigate(`/${code}/${record.id}/edit`)} size="small">
-                    编辑
-                  </Button>
-                )}
-              </Space>
-            </Card>
-          ))}
-        </div>
-      ) : (
-        <Card>
-          <Empty description={`暂无${name}`} />
-        </Card>
-      )}
-      <div className="oxa-mobile-pagination">
-        <Button disabled={state.page <= 1} onClick={() => state.setPage((item) => item - 1)}>
-          上一页
-        </Button>
-        <Typography.Text>第 {state.page} 页</Typography.Text>
-        <Button disabled={rows.length < (surface.list?.defaultPageSize || 20)} onClick={() => state.setPage((item) => item + 1)}>
-          下一页
-        </Button>
-      </div>
-    </MobileResourceListPage>
-  );
-}
-
-function GeneratedResourceFormPage({
-  definition,
-  mode,
-  variant,
-}: {
-  definition: GeneratedResourceDefinition;
-  mode: 'create' | 'edit';
-  variant: 'desktop' | 'mobile';
-}) {
-  const { id = '' } = useParams();
-  const navigate = useNavigate();
-  const { message } = App.useApp();
-  const { hasCapability, identity } = useRuntime();
-  const [form] = Form.useForm();
-  const create = useCreate<ResourceRecord>();
-  const update = useUpdate<ResourceRecord>();
-  const [transactionPending, setTransactionPending] = useState(false);
-  const query = useOne<ResourceRecord>({
-    resource: definition.code,
-    id,
-    queryOptions: { enabled: mode === 'edit' },
-  });
-  const record = query.result;
-  const { code, name, surface, capabilities } = definition;
-  useEffect(() => {
-    if (record) form.setFieldsValue(normalizeRecordForForm(record, surface));
-  }, [form, record, surface]);
-  const listPath = `/${code}`;
-  const detailPath = `/${code}/${id}`;
-  const Page = variant === 'mobile' ? MobileResourceFormPage : ResourceFormPage;
-  const FieldControl = variant === 'mobile' ? MobileSurfaceFieldControl : SurfaceFieldControl;
-  if (!hasCapability(mode === 'create' ? capabilities.create : capabilities.update))
-    return <Result status="403" title="当前平台用户无此操作权限" />;
-  const submit = async (values: Record<string, unknown>) => {
-    const writableValues = Object.fromEntries(
-      Object.entries(values).filter(([key]) =>
-        fieldWritable(
-          fieldFor(surface, key),
-          mode,
-          hasCapability,
-          identity.isAppSuperAdmin
-        )
-      )
-    );
-    const subtableFields = Object.entries(surface.fields)
-      .map(([key, field]) => ({ key, ...field }))
-      .filter(
-        field =>
-          field.type === 'subtable' &&
-          fieldWritable(
-            field,
-            mode,
-            hasCapability,
-            identity.isAppSuperAdmin
-          )
-      );
-    const next = normalizeFormValues(
-      Object.fromEntries(
-        Object.entries(writableValues).filter(
-          ([key]) => surface.fields[key]?.type !== 'subtable'
-        )
-      ),
-      surface
-    );
-    if (subtableFields.length > 0) {
-      if (mode === 'edit' && (!record?.id || !Number.isSafeInteger(record.revision))) {
-        throw new Error('OPENXIANGDA_SUBTABLE_PARENT_REVISION_REQUIRED');
-      }
-      const operations: DataTransactionOperation[] = [
-        mode === 'create'
-          ? { operation: 'create', resourceCode: code, data: next }
-          : {
-              operation: 'update',
-              resourceCode: code,
-              id: record!.id,
-              expectedRevision: record!.revision,
-              data: next,
-            },
-      ];
-      for (const subtableField of subtableFields) {
-        const config = subtableField.subtable;
-        const childDefinition = config
-          ? definitionFor(config.resourceCode)
-          : undefined;
-        if (!config || !childDefinition) {
-          throw new Error(`OPENXIANGDA_SUBTABLE_DEFINITION_MISSING:${subtableField.key}`);
-        }
-        operations.push(
-          ...buildSubtableOperations({
-            rows: Array.isArray(writableValues[subtableField.key])
-              ? writableValues[subtableField.key] as SubtableDraftRow[]
-              : [],
-            childResourceCode: config.resourceCode,
-            childSurface: childDefinition.surface,
-            foreignKey: config.foreignKey,
-            orderField: config.orderField,
-            maxRows: config.maxRows,
-            parent: mode === 'create'
-              ? { operation: 'create', operationIndex: 0 }
-              : { operation: 'update', id: record!.id },
-            canWrite: (fieldCode, childField, childOperation) =>
-              fieldWriteAuthorized(
-                { key: fieldCode, ...childField },
-                childOperation === 'create' ? 'create' : 'edit',
-                hasCapability,
-                identity.isAppSuperAdmin
-              ),
-            canDelete:
-              identity.isAppSuperAdmin ||
-              hasCapability(childDefinition.capabilities.delete),
-          })
-        );
-      }
-      if (operations.length > 100) {
-        throw new Error('OPENXIANGDA_DATA_TRANSACTION_TOO_LARGE');
-      }
-      setTransactionPending(true);
-      try {
-        const result = await transactNativeData(operations);
-        const parent = result.items[0];
-        if (!parent || parent.operation === 'emitEvent') {
-          throw new Error('OPENXIANGDA_SUBTABLE_PARENT_RESULT_MISSING');
-        }
-        message.success(mode === 'create' ? `${name}已创建` : '修改已保存');
-        navigate(mode === 'create' ? listPath : `/${code}/${parent.id}`);
-      } finally {
-        setTransactionPending(false);
-      }
-      return;
-    }
-    if (mode === 'create') {
-      await create.mutateAsync({ resource: code, values: next });
-      message.success(`${name}已创建`);
-      navigate(listPath);
-    } else {
-      const result = await update.mutateAsync({
-        resource: code,
-        id,
-        values: next,
-        meta: { expectedRevision: record?.revision },
-      });
-      message.success('修改已保存');
-      navigate(`/${code}/${result.data.id}`);
-    }
-  };
-  return (
-    <Page
-      backLabel={mode === 'edit' ? `返回${name}详情` : `返回${name}`}
-      backPath={mode === 'edit' ? detailPath : listPath}
-      capability={mode === 'create' ? capabilities.create : capabilities.update}
-      detailPath={record ? detailPath : undefined}
-      loading={mode === 'edit' && query.query.isFetching}
-      mode={mode}
-      notFound={mode === 'edit' && !record}
-      resource={code}
-      surface={surface}
-      title={name}
-    >
-      <Form
-        className={variant === 'mobile' ? 'oxa-mobile-form' : 'oxa-form-full'}
-        form={form}
-        initialValues={undefined}
-        layout="vertical"
-        onFinish={(values) => void submit(values as Record<string, unknown>)}
-      >
-        <div className="oxa-sections">
-          {fieldsBySection(surface).map((group) => ({
-            ...group,
-            fields: group.fields.filter((field) =>
-              fieldReadable(field, hasCapability, identity.isAppSuperAdmin) ||
-              fieldWritable(field, mode, hasCapability, identity.isAppSuperAdmin)
-            ),
-          })).filter((group) => group.fields.length > 0).map((group) => (
-            <Card className="oxa-section-card" key={group.section} title={group.section === 'default' ? '基本信息' : group.section}>
-              <div className="oxa-grid">
-                {group.fields.map((field) => (
-                  <FieldControl
-                    key={field.key}
-                    disabled={!fieldWritable(field, mode, hasCapability, identity.isAppSuperAdmin)}
-                    field={field}
-                    operation={mode === 'create' ? 'create' : 'update'}
-                    resourceCode={code}
-                    recordId={record?.id}
-                    renderers={{
-                      renderSubtable: (context) => (
-                        <SubtableField
-                          disabled={context.disabled}
-                          field={context.field}
-                          mobile={variant === 'mobile'}
-                          operation={context.operation}
-                          parentRecordId={context.recordId}
-                        />
-                      ),
-                      signer: signatureSigner(identity.subjectProfile),
-                      upload: (current, file, recordId) => createNativeResourceClient(code, surface).upload(current.key, file, recordId),
-                    }}
-                  />
-                ))}
-              </div>
-            </Card>
-          ))}
-        </div>
-        <div className="oxa-actions">
-          <Button onClick={() => navigate(mode === 'edit' ? detailPath : listPath)}>取消</Button>
-          <Button htmlType="submit" loading={create.mutation.isPending || update.mutation.isPending || transactionPending} type="primary">
-            {mode === 'create' ? '保存' : '保存修改'}
-          </Button>
-        </div>
-      </Form>
-    </Page>
-  );
-}
-
-function GeneratedResourceDetailPage({ definition, variant }: { definition: GeneratedResourceDefinition; variant: 'desktop' | 'mobile' }) {
-  const { id = '' } = useParams();
-  const navigate = useNavigate();
-  const { hasCapability, identity } = useRuntime();
-  const query = useOne<ResourceRecord>({
-    resource: definition.code,
-    id,
-    queryOptions: { retry: false },
-  });
-  const record = query.result;
-  const [auditEntries, setAuditEntries] = useState<DataAuditEntry[]>([]);
-  const [auditLoading, setAuditLoading] = useState(false);
-  const [auditError, setAuditError] = useState('');
-  const [auditExpanded, setAuditExpanded] = useState(false);
-  const [auditLoadedFor, setAuditLoadedFor] = useState('');
-  useEffect(() => {
-    if (!record || !auditExpanded || auditLoadedFor === record.id) return;
-    let active = true;
-    setAuditLoading(true);
-    setAuditError('');
-    void createNativeResourceClient(definition.code, definition.surface)
-      .audit(record.id)
-      .then((page) => {
-        if (active) {
-          setAuditEntries(page.items || []);
-          setAuditLoadedFor(record.id);
-        }
-      })
-      .catch((reason) => {
-        if (!active) return;
-        setAuditEntries([]);
-        setAuditError(reason instanceof Error ? reason.message : String(reason));
-      })
-      .finally(() => {
-        if (active) setAuditLoading(false);
-      });
-    return () => {
-      active = false;
-    };
-  }, [auditExpanded, auditLoadedFor, definition.code, definition.surface, record]);
-  const auditContent = auditError ? (
-    <Alert
-      action={
-        <Button
-          onClick={() => {
-            setAuditError('');
-            setAuditLoadedFor('');
-          }}
-          size="small"
-        >
-          重试
-        </Button>
-      }
-      description={auditError}
-      showIcon
-      title="变更记录读取失败"
-      type="error"
-    />
-  ) : auditLoading ? (
-    <div className="oxa-audit-loading">
-      <Spin size="small" /> 正在读取操作记录
-    </div>
-  ) : auditEntries.length ? (
-    auditEntries.slice(0, 5).map((entry) => (
-      <AuditEntry
-        entry={entry}
-        key={entry.id}
-        readable={(field) => fieldReadable(field, hasCapability, identity.isAppSuperAdmin)}
-        surface={definition.surface}
-      />
-    ))
-  ) : (
-    <Typography.Text type="secondary">暂无变更记录</Typography.Text>
-  );
-  const content = record ? (
-    <div className="oxa-detail-layout">
-      <div className="oxa-detail-main">
-        {fieldsBySection(definition.surface).map((group) => ({
-          ...group,
-          fields: group.fields.filter((field) =>
-            fieldReadable(field, hasCapability, identity.isAppSuperAdmin)
-          ),
-        })).filter((group) => group.fields.length > 0).map((group) => (
-          <Card className="oxa-section-card" key={group.section} title={group.section === 'default' ? '基本信息' : group.section}>
-            <Descriptions
-              column={{ xs: 1, sm: 2, lg: 3 }}
-              items={group.fields.map((field) => ({
-                key: field.key,
-                label: field.label,
-                span: field.type === 'subtable' ? 3 : 1,
-                children: field.type === 'subtable' ? (
-                  <SubtableValueDisplay
-                    field={field}
-                    mobile={variant === 'mobile'}
-                    parentRecordId={record.id}
-                  />
-                ) : (
-                  <SurfaceFieldValue
-                    field={field}
-                    resourceCode={definition.code}
-                    value={record[field.key]}
-                  />
-                ),
-              }))}
-            />
-          </Card>
-        ))}
-        <div id={`${definition.code}-audit`}>
-          <Collapse
-            activeKey={auditExpanded ? ['audit'] : []}
-            className="oxa-audit-collapse"
-            expandIconPlacement="end"
-            items={[
-              {
-                key: 'audit',
-                label: (
-                  <div className="oxa-audit-collapse-heading">
-                    <strong>操作记录</strong>
-                    <span>查看创建、更新和删除的字段变化</span>
-                  </div>
-                ),
-                children: auditContent,
-              },
-            ]}
-            onChange={(keys) => setAuditExpanded((Array.isArray(keys) ? keys : [keys]).includes('audit'))}
-          />
-        </div>
-      </div>
-    </div>
-  ) : null;
-  const hero = record ? (
-    <div>
-      <Typography.Title level={variant === 'mobile' ? 3 : 2}>{definition.name}详情</Typography.Title>
-    </div>
-  ) : null;
-  const props = {
-    auditTargetId: `${definition.code}-audit`,
-    backLabel: `返回${definition.name}`,
-    backPath: `/${definition.code}`,
-    editCapability: definition.capabilities.update,
-    editPath: `/${definition.code}/${id}/edit`,
-    error: query.query.isError || (!query.query.isFetching && !record) ? query.query.error?.message || '记录不存在' : undefined,
-    hero,
-    loading: query.query.isFetching,
-    meta: record ? <span>最近更新 {record.updated_at ? new Date(record.updated_at).toLocaleString('zh-CN') : '-'}</span> : null,
-    onAuditOpen: () => setAuditExpanded(true),
-    readCapability: definition.capabilities.read,
-    resource: definition.code,
-    surface: definition.surface,
-    title: definition.name,
-  };
-  return variant === 'mobile' ? (
-    <MobileResourceDetailPage {...props}>{content}</MobileResourceDetailPage>
-  ) : (
-    <ResourceDetailPage {...props}>{content}</ResourceDetailPage>
-  );
-}