openxiangda-cli 2.0.0-alpha.62 → 2.0.0-alpha.66

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "openxiangda-cli",
-  "version": "2.0.0-alpha.62",
+  "version": "2.0.0-alpha.66",
   "description": "Thin application-level CLI for OpenXiangda 2.0.",
   "type": "module",
   "main": "./dist/index.js",
@@ -23,9 +23,9 @@
   ],
   "dependencies": {
     "@oclif/core": "4.13.3",
-    "openxiangda-contracts": "2.0.0-alpha.30",
-    "openxiangda-devkit-core": "2.0.0-alpha.38",
-    "openxiangda-mcp": "2.0.0-alpha.38"
+    "openxiangda-contracts": "2.0.0-alpha.31",
+    "openxiangda-devkit-core": "2.0.0-alpha.41",
+    "openxiangda-mcp": "2.0.0-alpha.41"
   },
   "devDependencies": {
     "tsx": "4.23.12",

package/template/apps/server/Dockerfile

@@ -4,7 +4,8 @@ RUN corepack enable
 COPY package.json pnpm-lock.yaml pnpm-workspace.yaml tsconfig.base.json ./
 COPY apps/server/package.json apps/server/package.json
 COPY packages/contracts/package.json packages/contracts/package.json
-RUN pnpm --filter @app/server... install --frozen-lockfile --ignore-scripts
+RUN node -e "const fs=require('node:fs'); const p=JSON.parse(fs.readFileSync('package.json','utf8')); delete p.devDependencies; fs.writeFileSync('package.json', JSON.stringify(p));"
+RUN pnpm --filter @app/server --filter @app/contracts install --no-frozen-lockfile --ignore-scripts
 COPY apps/server apps/server
 COPY packages/contracts packages/contracts
 RUN pnpm --filter @app/server... build

package/template/apps/server/package.json

@@ -15,7 +15,7 @@
     "@nestjs/common": "11.1.29",
     "@nestjs/core": "11.1.29",
     "@nestjs/platform-fastify": "11.1.29",
-    "openxiangda-nest": "2.0.0-alpha.36",
+    "openxiangda-nest": "2.0.0-alpha.37",
     "reflect-metadata": "0.2.2",
     "rxjs": "7.8.2"
   },

package/template/apps/web/package.json

@@ -16,7 +16,7 @@
     "antd": "6.4.3",
     "dayjs": "1.11.18",
     "docx-preview": "0.3.7",
-    "openxiangda-contracts": "2.0.0-alpha.30",
+    "openxiangda-contracts": "2.0.0-alpha.31",
     "react": "19.2.8",
     "react-dom": "19.2.8",
     "react-router-dom": "7.8.2",

package/template/apps/web/src/AuthoritativeSelector.tsx

@@ -107,6 +107,19 @@ function optionDescription(option: Option) {
   return option.description || '';
 }
 
+export type AuthoritativeSelectorProps = {
+  value?: string | string[];
+  onChange?: (value: string | string[] | undefined) => void;
+  source: Source;
+  operation: 'create' | 'update';
+  multiple?: boolean;
+  disabled?: boolean;
+  id?: string;
+  placeholder: string;
+  resourceCode?: string;
+  labelField?: string;
+};
+
 export function AuthoritativeSelector({
   value,
   onChange,
@@ -118,18 +131,7 @@ export function AuthoritativeSelector({
   placeholder,
   resourceCode,
   labelField,
-}: {
-  value?: string | string[];
-  onChange?: (value: string | string[] | undefined) => void;
-  source: Source;
-  operation: 'create' | 'update';
-  multiple?: boolean;
-  disabled?: boolean;
-  id?: string;
-  placeholder: string;
-  resourceCode?: string;
-  labelField?: string;
-}) {
+}: AuthoritativeSelectorProps) {
   const [options, setOptions] = useState<Option[]>([]);
   const [keyword, setKeyword] = useState('');
   const [cursor, setCursor] = useState<string | null>(null);
@@ -199,6 +201,30 @@ export function AuthoritativeSelector({
     return () => window.clearTimeout(timer);
   }, [disabled, keyword, labelField, operation, resourceCode, source, values]);
 
+  useEffect(() => {
+    if (disabled || !open || keyword.trim().length >= 2) return;
+    const sequence = ++requestSequence.current;
+    setLoading(true);
+    setError('');
+    void searchSource(source, operation, '', undefined, resourceCode, labelField)
+      .then(page => {
+        if (sequence !== requestSequence.current) return;
+        setOptions(current => {
+          const selected = current.filter(option => values.includes(option.value));
+          return mergeOptions(selected, page.items);
+        });
+        setCursor(page.nextCursor);
+      })
+      .catch(reason => {
+        if (sequence === requestSequence.current) {
+          setError(reason instanceof Error ? reason.message : String(reason));
+        }
+      })
+      .finally(() => {
+        if (sequence === requestSequence.current) setLoading(false);
+      });
+  }, [disabled, keyword, labelField, open, operation, resourceCode, source, values]);
+
   const loadNext = () => {
     if (!cursor || loading) return;
     const nextCursor = cursor;
@@ -236,7 +262,7 @@ export function AuthoritativeSelector({
         ) : error ? (
           <Typography.Text type="danger">{error}</Typography.Text>
         ) : keyword.trim().length < 2 ? (
-          '请输入至少 2 个字符'
+          '暂无可选数据，可输入至少 2 个字符搜索'
         ) : (
           '无可选数据'
         )
@@ -245,7 +271,10 @@ export function AuthoritativeSelector({
         onChange?.(next || undefined);
         if (!multiple) setOpen(false);
       }}
-      onOpenChange={setOpen}
+      onOpenChange={next => {
+        setOpen(next);
+        if (!next) setKeyword('');
+      }}
       onPopupScroll={event => {
         const element = event.currentTarget;
         if (
@@ -319,6 +348,225 @@ export function AuthoritativeSelector({
   );
 }
 
+/**
+ * Mobile reference picker. It deliberately avoids Ant Design Select so that
+ * resource references have a touch-friendly, full-width interaction on
+ * phones. The search and resolve calls are the same authoritative platform
+ * APIs used by the desktop selector.
+ */
+export function MobileAuthoritativeSelector({
+  value,
+  onChange,
+  source,
+  operation,
+  multiple = false,
+  disabled = false,
+  id,
+  placeholder,
+  resourceCode,
+  labelField,
+}: AuthoritativeSelectorProps) {
+  const [options, setOptions] = useState<Option[]>([]);
+  const [keyword, setKeyword] = useState('');
+  const [cursor, setCursor] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+  const [open, setOpen] = useState(false);
+  const [draftValues, setDraftValues] = useState<string[]>([]);
+  const requestSequence = useRef(0);
+  const values = useMemo(
+    () => (Array.isArray(value) ? value : value ? [value] : []),
+    [value]
+  );
+
+  useEffect(() => {
+    setDraftValues(values);
+  }, [open, values]);
+
+  useEffect(() => {
+    const missing = values.filter(
+      selected => !options.some(option => option.value === selected)
+    );
+    if (missing.length === 0) return;
+    let active = true;
+    setLoading(true);
+    void resolveSource(source, operation, missing, resourceCode, labelField)
+      .then(items => {
+        if (active) setOptions(current => mergeOptions(current, items));
+      })
+      .catch(reason => {
+        if (active) setError(reason instanceof Error ? reason.message : String(reason));
+      })
+      .finally(() => {
+        if (active) setLoading(false);
+      });
+    return () => {
+      active = false;
+    };
+  }, [labelField, operation, options, resourceCode, source, values]);
+
+  useEffect(() => {
+    if (disabled || !open) return;
+    const trimmed = keyword.trim();
+    if (trimmed.length > 0 && trimmed.length < 2) return;
+    const sequence = ++requestSequence.current;
+    const timer = window.setTimeout(() => {
+      setLoading(true);
+      setError('');
+      void searchSource(source, operation, trimmed, undefined, resourceCode, labelField)
+        .then(page => {
+          if (sequence !== requestSequence.current) return;
+          setOptions(current => {
+            const selected = current.filter(option => values.includes(option.value));
+            return mergeOptions(selected, page.items);
+          });
+          setCursor(page.nextCursor);
+        })
+        .catch(reason => {
+          if (sequence === requestSequence.current) {
+            setError(reason instanceof Error ? reason.message : String(reason));
+          }
+        })
+        .finally(() => {
+          if (sequence === requestSequence.current) setLoading(false);
+        });
+    }, trimmed ? 300 : 0);
+    return () => window.clearTimeout(timer);
+  }, [disabled, keyword, labelField, open, operation, resourceCode, source, values]);
+
+  const loadNext = () => {
+    if (!cursor || loading) return;
+    const nextCursor = cursor;
+    setLoading(true);
+    setError('');
+    void searchSource(source, operation, keyword.trim(), nextCursor, resourceCode, labelField)
+      .then(page => {
+        setOptions(current => mergeOptions(current, page.items));
+        setCursor(page.nextCursor);
+      })
+      .catch(reason => setError(reason instanceof Error ? reason.message : String(reason)))
+      .finally(() => setLoading(false));
+  };
+
+  const selectedItems = values
+    .map(selected => options.find(option => option.value === selected))
+    .filter((item): item is Option => Boolean(item));
+  const selectedLabel = selectedItems.length
+    ? selectedItems.map(item => item.label).join('、')
+    : values.length
+      ? (loading ? '读取中…' : values.join('、'))
+      : `请选择${placeholder}`;
+
+  const toggleValue = (nextValue: string) => {
+    const item = options.find(option => option.value === nextValue);
+    if (!item?.selectable) return;
+    if (!multiple) {
+      onChange?.(nextValue);
+      setOpen(false);
+      return;
+    }
+    setDraftValues(current =>
+      current.includes(nextValue)
+        ? current.filter(itemValue => itemValue !== nextValue)
+        : [...current, nextValue]
+    );
+  };
+
+  return (
+    <>
+      <button
+        aria-haspopup="dialog"
+        className="oxa-mobile-reference-trigger"
+        disabled={disabled}
+        id={id}
+        onClick={() => {
+          setDraftValues(values);
+          setKeyword('');
+          setOpen(true);
+        }}
+        type="button"
+      >
+        <span className={values.length ? '' : 'oxa-mobile-reference-placeholder'}>
+          {selectedLabel}
+        </span>
+        <span aria-hidden="true">⌄</span>
+      </button>
+      {open && (
+        <div
+          aria-label={placeholder}
+          aria-modal="true"
+          className="oxa-mobile-reference-backdrop"
+          onClick={() => setOpen(false)}
+          role="dialog"
+        >
+          <div className="oxa-mobile-reference-sheet" onClick={event => event.stopPropagation()}>
+            <div className="oxa-mobile-reference-header">
+              <strong>{placeholder}</strong>
+              <button onClick={() => setOpen(false)} type="button">关闭</button>
+            </div>
+            <input
+              autoFocus
+              className="oxa-mobile-input oxa-mobile-reference-search"
+              onChange={event => setKeyword(event.target.value)}
+              placeholder={`搜索${placeholder}`}
+              type="search"
+              value={keyword}
+            />
+            {error && <div className="oxa-mobile-reference-error">{error}</div>}
+            {loading && <div className="oxa-mobile-reference-loading">加载中…</div>}
+            {!loading && !error && options.length === 0 && (
+              <div className="oxa-mobile-reference-empty">
+                {keyword.trim().length < 2 ? '请输入至少 2 个字符搜索' : '暂无可选数据'}
+              </div>
+            )}
+            <div aria-multiselectable={multiple} className="oxa-mobile-reference-options" role="listbox">
+              {options.map(option => {
+                const selected = (multiple ? draftValues : values).includes(option.value);
+                const description = optionDescription(option);
+                return (
+                  <button
+                    aria-selected={selected}
+                    className={`oxa-mobile-reference-option${selected ? ' is-selected' : ''}`}
+                    disabled={!option.selectable}
+                    key={option.value}
+                    onClick={() => toggleValue(option.value)}
+                    role="option"
+                    type="button"
+                  >
+                    {optionIcon(option)}
+                    <span className="oxa-mobile-reference-option-copy">
+                      <strong>{option.label}</strong>
+                      {description && <small>{description}</small>}
+                    </span>
+                    {selected && <span aria-hidden="true">✓</span>}
+                  </button>
+                );
+              })}
+            </div>
+            {cursor && (
+              <button className="oxa-mobile-reference-more" onClick={loadNext} type="button">
+                {loading ? '加载中…' : '加载更多'}
+              </button>
+            )}
+            {multiple && (
+              <button
+                className="oxa-mobile-reference-confirm"
+                onClick={() => {
+                  onChange?.(draftValues.length ? draftValues : undefined);
+                  setOpen(false);
+                }}
+                type="button"
+              >
+                确定（{draftValues.length}）
+              </button>
+            )}
+          </div>
+        </div>
+      )}
+    </>
+  );
+}
+
 export function ResolvedValueText({
   source,
   value,

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

@@ -1,4 +1,5 @@
 import {
+  ArrowRightOutlined,
   DeleteOutlined,
   EditOutlined,
   EyeOutlined,
@@ -8,6 +9,7 @@ import {
 import { useCreate, useDelete, useList, useOne, useUpdate } from '@refinedev/core';
 import {
   App,
+  Alert,
   Button,
   Card,
   Descriptions,
@@ -45,6 +47,7 @@ import {
   type SurfaceField,
 } from './SurfaceFields';
 import { createNativeResourceClient, type GenericResourceQuery } from '../../platform-client';
+import { ResolvedValueText } from '../../AuthoritativeSelector';
 import { useRuntime } from '../../runtime';
 
 type ResourceRecord = Record<string, unknown> & {
@@ -119,6 +122,129 @@ function fieldWritable(
   return mode === 'create';
 }
 
+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));
+}
+
+function exportCellValue(field: SurfaceField, value: unknown) {
+  if (value === undefined || value === null || value === '') return '';
+  if (field.widget === 'boolean') return value ? '是' : '否';
+  if (field.options && !Array.isArray(value)) {
+    return field.options.find(option => option.value === value)?.label || String(value);
+  }
+  if (Array.isArray(value)) {
+    return value.map(item => field.options?.find(option => option.value === item)?.label || String(item)).join('、');
+  }
+  if (field.widget === 'date' || field.widget === 'datetime') {
+    const parsed = new Date(String(value));
+    if (!Number.isNaN(parsed.getTime())) return parsed.toLocaleString('zh-CN', { hour12: false });
+  }
+  if (typeof value === 'object' && value && 'id' in value) return String((value as { id: unknown }).id);
+  return String(value);
+}
+
+function csvCell(value: string) {
+  return /[\r\n,"]/.test(value) ? `"${value.replaceAll('"', '""')}"` : value;
+}
+
+async function exportResourceRows(
+  code: string,
+  name: string,
+  surface: DataResourceSurface,
+  query: Partial<GenericResourceQuery>,
+  sort: { field: string; order: 'asc' | 'desc' },
+) {
+  const client = createNativeResourceClient(code, surface);
+  const fields = listSurfaceFields(surface.fields);
+  const rows: ResourceRecord[] = [];
+  const pageSize = 500;
+  let page = 1;
+  let total = 0;
+  do {
+    const result = await client.list({
+      page,
+      pageSize,
+      keyword: query.keyword,
+      searchField: query.searchField,
+      filters: query.filters,
+      sort,
+    });
+    rows.push(...(result.rows as ResourceRecord[]));
+    total = result.total;
+    page += 1;
+  } while (rows.length < total && rows.length < 10000 && page <= 20);
+  const header = fields.map(field => csvCell(field.label)).join(',');
+  const body = rows.map(row => fields.map(field => csvCell(exportCellValue(field, row[field.key]))).join(','));
+  const blob = new Blob([`\uFEFF${[header, ...body].join('\r\n')}`], { type: 'text/csv;charset=utf-8' });
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement('a');
+  anchor.href = url;
+  anchor.download = `${name}-${dayjs().format('YYYYMMDD-HHmmss')}.csv`;
+  anchor.click();
+  URL.revokeObjectURL(url);
+  return { count: rows.length, truncated: rows.length < total };
+}
+
+function AuditEntry({ entry, surface }: { entry: DataAuditEntry; surface: DataResourceSurface }) {
+  const fields = auditChangeFields(entry, surface);
+  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>
+        ) : (
+          <ResolvedValueText source="user" value={entry.actor.userId} />
+        )}
+        <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: GeneratedDefinition) {
   const { code, surface } = definition;
   const defaultSort = surface.list?.defaultSort || {
@@ -170,6 +296,7 @@ function GeneratedDesktopList({ definition }: { definition: GeneratedDefinition
   const state = useGeneratedList(definition);
   const { code, name, surface, capabilities } = definition;
   const fields = listSurfaceFields(surface.fields);
+  const [exporting, setExporting] = useState(false);
   const remove = useDelete();
   const rows = (state.list.result.data || []) as unknown as ResourceRecord[];
   const columns = useMemo<TableColumnsType<ResourceRecord>>(() => [
@@ -199,17 +326,37 @@ function GeneratedDesktopList({ definition }: { definition: GeneratedDefinition
       ),
     },
   ], [capabilities.delete, capabilities.update, code, fields, hasCapability, message, name, navigate, remove, state.list.query]);
+  const handleExport = async () => {
+    setExporting(true);
+    try {
+      const result = await exportResourceRows(code, name, surface, state.query, state.sort);
+      message.success(result.truncated ? `已导出 ${result.count} 条（最多导出 10000 条）` : `已导出 ${result.count} 条`);
+    } catch (error) {
+      message.error(error instanceof Error ? error.message : '导出失败');
+    } finally {
+      setExporting(false);
+    }
+  };
   return (
     <ResourceListPage
       createCapability={capabilities.create}
       createPath={`/${code}/new`}
       description={`由 ${code} 资源 Surface 自动生成的标准 CRUD 页面`}
-      onExport={() => message.info('导出将使用当前 Data API 查询条件')}
+      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 : '请稍后重试或联系平台管理员'}
+          message="数据读取失败"
+          showIcon
+          type="error"
+        />
+      )}
       <div className="oxa-filter-grid">
         <Select allowClear options={(surface.list?.searchableFields || []).map(key => ({ label: fieldFor(surface, key).label, value: key }))} placeholder="搜索字段" value={state.draft.searchField} onChange={value => state.setDraft(item => ({ ...item, searchField: value }))} />
         <Input allowClear prefix={<SearchOutlined />} placeholder="关键词" value={state.draft.keyword} onChange={event => state.setDraft(item => ({ ...item, keyword: event.target.value }))} />
@@ -218,14 +365,14 @@ function GeneratedDesktopList({ definition }: { definition: GeneratedDefinition
           return <SurfaceFilterControl key={key} field={field} value={state.draft.filters?.[key]} onChange={value => state.setDraft(item => ({ ...item, filters: { ...item.filters, [key]: value } }))} />;
         })}
         <Space>
-          <Button type="primary" icon={<SearchOutlined />} onClick={() => { state.setPage(1); state.setQuery(state.draft); }}>查询</Button>
+          <Button loading={state.list.query.isFetching} type="primary" icon={<SearchOutlined />} onClick={() => { state.setPage(1); state.setQuery(state.draft); }}>查询</Button>
           <Button onClick={() => { state.setDraft({}); state.setQuery({}); state.setPage(1); }}>重置</Button>
         </Space>
       </div>
       <Table<ResourceRecord>
         columns={columns}
         dataSource={rows}
-        loading={state.list.query.isLoading}
+        loading={state.list.query.isFetching}
         locale={{ emptyText: <Empty description={`暂无${name}`} /> }}
         rowKey="id"
         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' }); }}
@@ -238,17 +385,39 @@ function GeneratedDesktopList({ definition }: { definition: GeneratedDefinition
 function GeneratedMobileList({ definition }: { definition: GeneratedDefinition }) {
   const navigate = useNavigate();
   const { hasCapability } = useRuntime();
+  const { message } = App.useApp();
   const { code, name, surface, capabilities } = definition;
   const state = useGeneratedList(definition);
+  const [exporting, setExporting] = useState(false);
   const rows = (state.list.result.data || []) as unknown as ResourceRecord[];
   const fields = listSurfaceFields(surface.fields).slice(0, 4);
+  const handleExport = async () => {
+    setExporting(true);
+    try {
+      const result = await exportResourceRows(code, name, surface, state.query, state.sort);
+      message.success(result.truncated ? `已导出 ${result.count} 条（最多导出 10000 条）` : `已导出 ${result.count} 条`);
+    } catch (error) {
+      message.error(error instanceof Error ? error.message : '导出失败');
+    } finally {
+      setExporting(false);
+    }
+  };
   return (
-    <MobileResourceListPage createCapability={capabilities.create} createPath={`/${code}/new`} description={`${code} 资源`} readCapability={capabilities.read} resource={code} surface={surface} title={name}>
+    <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 : '请稍后重试或联系平台管理员'}
+          message="数据读取失败"
+          showIcon
+          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 icon={<SearchOutlined />} onClick={() => { state.setPage(1); state.setQuery(state.draft); }} type="primary">查询</Button>
+        <Button loading={state.list.query.isFetching} icon={<SearchOutlined />} onClick={() => { state.setPage(1); state.setQuery(state.draft); }} type="primary">查询</Button>
       </div>
-      {state.list.query.isLoading ? <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} 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>}
+      {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} 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>
   );
@@ -269,6 +438,7 @@ function GeneratedResourceFormPage({ definition, mode, variant }: { definition:
   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 next = normalizeFormValues(
@@ -283,10 +453,10 @@ function GeneratedResourceFormPage({ definition, mode, variant }: { definition:
     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.isLoading} mode={mode} notFound={mode === 'edit' && !record} recordSummary={record ? `${name} · 当前版本 ${record.revision}` : undefined} resource={code} surface={surface} title={name}>
+    <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} recordSummary={record ? `${name} · 当前版本 ${record.revision}` : undefined} 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 => <Card className="oxa-section-card" key={group.section} title={group.section === 'default' ? '基本信息' : group.section}><div className="oxa-grid">{group.fields.map(field => <SurfaceFieldControl key={field.key} disabled={!fieldWritable(field, mode, hasCapability, identity.isAppSuperAdmin)} field={field} operation={mode === 'create' ? 'create' : 'update'} recordId={record?.id} renderers={{ 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" type="primary">{mode === 'create' ? '保存' : '保存修改'}</Button></div>
+        <div className="oxa-sections">{fieldsBySection(surface).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'} recordId={record?.id} renderers={{ 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} type="primary">{mode === 'create' ? '保存' : '保存修改'}</Button></div>
       </Form>
     </Page>
   );
@@ -298,9 +468,31 @@ function GeneratedResourceDetailPage({ definition, variant }: { definition: Gene
   const query = useOne<ResourceRecord>({ resource: definition.code, id, queryOptions: { retry: false } });
   const record = query.result;
   const [auditEntries, setAuditEntries] = useState<DataAuditEntry[]>([]);
-  useEffect(() => { if (!record) return; void createNativeResourceClient(definition.code, definition.surface).audit(record.id).then(page => setAuditEntries(page.items || []), () => setAuditEntries([])); }, [definition, record]);
-  const content = record ? <div className="oxa-detail-layout"> <div className="oxa-detail-main">{fieldsBySection(definition.surface).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, children: <SurfaceFieldValue field={field} value={record[field.key]} /> }))} /></Card>)}</div><aside className="oxa-detail-aside"><Card className="oxa-section-card" id={`${definition.code}-audit`} title="最近变更">{auditEntries.length ? auditEntries.slice(0, 5).map(entry => <div className="oxa-audit-entry" key={`${entry.occurredAt}-${entry.operation}`}><strong>{entry.operation}</strong><span>{new Date(entry.occurredAt).toLocaleString('zh-CN')}</span></div>) : <Typography.Text type="secondary">暂无变更记录</Typography.Text>}</Card></aside></div> : null;
+  const [auditLoading, setAuditLoading] = useState(false);
+  const [auditError, setAuditError] = useState('');
+  useEffect(() => {
+    if (!record) return;
+    let active = true;
+    setAuditLoading(true);
+    setAuditError('');
+    void createNativeResourceClient(definition.code, definition.surface).audit(record.id)
+      .then(page => {
+        if (active) setAuditEntries(page.items || []);
+      })
+      .catch(reason => {
+        if (!active) return;
+        setAuditEntries([]);
+        setAuditError(reason instanceof Error ? reason.message : String(reason));
+      })
+      .finally(() => {
+        if (active) setAuditLoading(false);
+      });
+    return () => {
+      active = false;
+    };
+  }, [definition.code, definition.surface, record?.id]);
+  const content = record ? <div className="oxa-detail-layout"> <div className="oxa-detail-main">{fieldsBySection(definition.surface).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, children: <SurfaceFieldValue field={field} value={record[field.key]} /> }))} /></Card>)}</div><aside className="oxa-detail-aside"><Card className="oxa-section-card" id={`${definition.code}-audit`} loading={auditLoading} title="最近变更">{auditError ? <Alert message="变更记录读取失败" description={auditError} type="error" showIcon /> : auditEntries.length ? auditEntries.slice(0, 5).map(entry => <AuditEntry entry={entry} key={entry.id} surface={definition.surface} />) : <Typography.Text type="secondary">暂无变更记录</Typography.Text>}</Card></aside></div> : null;
   const hero = record ? <div><Typography.Title level={variant === 'mobile' ? 3 : 2}>{definition.name}详情</Typography.Title><Typography.Text type="secondary">{record.id} · 版本 {record.revision}</Typography.Text></div> : null;
-  const props = { backLabel: `返回${definition.name}`, backPath: `/${definition.code}`, editCapability: definition.capabilities.update, editPath: `/${definition.code}/${id}/edit`, error: query.query.isError || (!query.query.isLoading && !record) ? query.query.error?.message || '记录不存在' : undefined, hero, loading: query.query.isLoading, meta: record ? <><span>版本 {record.revision}</span><span>最近更新 {record.updated_at ? new Date(record.updated_at).toLocaleString('zh-CN') : '-'}</span></> : null, readCapability: definition.capabilities.read, resource: definition.code, surface: definition.surface, title: definition.name };
+  const props = { 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.revision}</span><span>最近更新 {record.updated_at ? new Date(record.updated_at).toLocaleString('zh-CN') : '-'}</span></> : null, readCapability: definition.capabilities.read, resource: definition.code, surface: definition.surface, title: definition.name };
   return variant === 'mobile' ? <MobileResourceDetailPage {...props} auditTargetId={`${definition.code}-audit`}>{content}</MobileResourceDetailPage> : <ResourceDetailPage {...props} auditTargetId={`${definition.code}-audit`}>{content}</ResourceDetailPage>;
 }

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

@@ -21,8 +21,12 @@ import type {
   DataFileRef,
 } from 'openxiangda-contracts/browser';
 import { useEffect, useMemo, useRef, useState, type ReactNode } from 'react';
-import { AuthoritativeSelector, ResolvedValueText } from '../../AuthoritativeSelector';
-import { AttachmentFileList } from '../platform-fields/AttachmentFileList';
+import {
+  AuthoritativeSelector,
+  MobileAuthoritativeSelector,
+  ResolvedValueText,
+} from '../../AuthoritativeSelector';
+import { AttachmentFileList, formatManagedFileSize } from '../platform-fields/AttachmentFileList';
 import { PlatformDirectoryPicker } from '../platform-fields/PlatformDirectoryPicker';
 
 export type SurfaceField = DataFieldSurface & { key: string };
@@ -321,7 +325,7 @@ export function MobileSurfaceFieldControl({
       break;
     case 'resource':
       control = (
-        <AuthoritativeSelector
+        <MobileAuthoritativeSelector
           disabled={disabled}
           labelField={field.reference?.kind === 'resource' ? field.reference.labelField : undefined}
           multiple={field.multiple}
@@ -340,6 +344,7 @@ export function MobileSurfaceFieldControl({
           field={field}
           maxCount={field.maxCount}
           multiple={field.multiple}
+          mobile
           onUpload={renderers?.upload}
           recordId={recordId}
         />
@@ -407,6 +412,20 @@ function isFileRef(value: unknown): value is DataFileRef {
   return Boolean(value && typeof value === 'object' && 'id' in value);
 }
 
+type MobilePendingUpload = {
+  id: string;
+  file: File;
+  status: 'uploading' | 'error';
+  error?: string;
+};
+
+let mobileUploadSequence = 0;
+
+function createMobileUploadId() {
+  mobileUploadSequence += 1;
+  return `mobile-upload-${Date.now()}-${mobileUploadSequence}`;
+}
+
 function ManagedFileField({
   field,
   value,
@@ -417,6 +436,7 @@ function ManagedFileField({
   maxCount = 1,
   accept,
   onUpload,
+  mobile = false,
 }: {
   field: SurfaceField;
   value?: DataFileRef | DataFileRef[];
@@ -427,9 +447,13 @@ function ManagedFileField({
   maxCount?: number;
   accept?: string | string[];
   onUpload?: SurfaceFieldRenderers['upload'];
+  mobile?: boolean;
 }) {
   const [uploading, setUploading] = useState(false);
   const [uploadError, setUploadError] = useState('');
+  const [mobilePending, setMobilePending] = useState<MobilePendingUpload[]>([]);
+  const mobileInputRef = useRef<HTMLInputElement | null>(null);
+  const mobileActiveUploads = useRef(0);
   const refs = useMemo(() => (Array.isArray(value) ? value : value ? [value] : []), [value]);
   const refsRef = useRef(refs);
   useEffect(() => {
@@ -438,6 +462,91 @@ function ManagedFileField({
   if (!onUpload) {
     return <Alert type="info" showIcon message="该文件字段尚未配置上传能力" />;
   }
+  if (mobile) {
+    const acceptValue = Array.isArray(accept) ? accept.join(',') : accept;
+    const uploadOne = async (item: MobilePendingUpload) => {
+      setMobilePending(current => current.map(entry => entry.id === item.id ? { ...entry, status: 'uploading', error: undefined } : entry));
+      mobileActiveUploads.current += 1;
+      setUploading(true);
+      try {
+        const uploaded = await onUpload(field, item.file, recordId);
+        const next = multiple ? [...refsRef.current, uploaded].slice(0, maxCount) : uploaded;
+        refsRef.current = Array.isArray(next) ? next : next ? [next] : [];
+        onChange?.(next);
+        setMobilePending(current => current.filter(entry => entry.id !== item.id));
+      } catch (error) {
+        setMobilePending(current => current.map(entry => entry.id === item.id ? { ...entry, status: 'error', error: error instanceof Error ? error.message : String(error) } : entry));
+      } finally {
+        mobileActiveUploads.current = Math.max(0, mobileActiveUploads.current - 1);
+        setUploading(mobileActiveUploads.current > 0);
+      }
+    };
+    const selectFiles = (files: File[]) => {
+      const pendingCount = mobilePending.length;
+      const available = Math.max(0, maxCount - refsRef.current.length - pendingCount);
+      const selected = multiple ? files.slice(0, available) : files.slice(0, 1);
+      if (!selected.length) return;
+      const items = selected.map(file => ({ id: createMobileUploadId(), file, status: 'uploading' as const }));
+      setMobilePending(current => multiple ? [...current, ...items] : items);
+      items.forEach(item => void uploadOne(item));
+    };
+    return (
+      <div className="oxa-file-field oxa-mobile-file-field">
+        <input
+          ref={mobileInputRef}
+          accept={acceptValue}
+          disabled={disabled || uploading || mobilePending.some(item => item.status === 'uploading') || refs.length + mobilePending.length >= maxCount}
+          multiple={multiple}
+          onChange={event => {
+            selectFiles(Array.from(event.target.files || []));
+            event.currentTarget.value = '';
+          }}
+          style={{ display: 'none' }}
+          type="file"
+        />
+        {(!maxCount || refs.length + mobilePending.length < maxCount) && (
+          <Button
+            className="oxa-mobile-file-button"
+            disabled={disabled || uploading || mobilePending.some(item => item.status === 'uploading')}
+            icon={<UploadOutlined />}
+            onClick={() => mobileInputRef.current?.click()}
+          >
+            上传文件
+          </Button>
+        )}
+        {mobilePending.length > 0 && (
+          <div className="oxa-mobile-pending-files">
+            {mobilePending.map(item => (
+              <div className="oxa-mobile-pending-file" key={item.id}>
+                <span className="oxa-mobile-pending-file-copy">
+                  <strong className="oxa-mobile-pending-file-name" title={item.file.name}>{item.file.name}</strong>
+                  <small>{formatManagedFileSize(item.file.size)} · {item.status === 'error' ? '上传失败' : '上传中…'}</small>
+                </span>
+                {item.status === 'error' ? (
+                  <>
+                    <span className="oxa-mobile-pending-error">{item.error || '上传失败'}</span>
+                    <Button onClick={() => void uploadOne(item)} size="small" type="link">重试</Button>
+                    <Button onClick={() => setMobilePending(current => current.filter(entry => entry.id !== item.id))} size="small" type="link">移除</Button>
+                  </>
+                ) : (
+                  <span className="oxa-mobile-pending-status">上传中…</span>
+                )}
+              </div>
+            ))}
+          </div>
+        )}
+        {refs.length ? (
+          <AttachmentFileList files={refs} onRemove={file => {
+            const next = refs.filter(item => item.id !== file.id);
+            refsRef.current = next;
+            onChange?.(multiple ? next : undefined);
+          }} removable={!disabled} />
+        ) : (
+          <div className="oxa-file-empty">尚未上传文件</div>
+        )}
+      </div>
+    );
+  }
   const uploadProps = {
     accept: Array.isArray(accept) ? accept.join(',') : accept,
     disabled,

package/template/apps/web/src/main.tsx

@@ -1,5 +1,5 @@
 import { Refine } from '@refinedev/core';
-import { App as AntdApp, ConfigProvider } from 'antd';
+import { App as AntdApp, ConfigProvider, Spin } from 'antd';
 import zhCN from 'antd/locale/zh_CN';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
@@ -11,11 +11,22 @@ import { FilePreviewPage } from './FilePreviewPage';
 import { EmptyApplicationPage } from './Shell';
 import { RuntimeBoundary } from './runtime';
 import { applicationBasename } from './runtime-meta';
+import { useGlobalRequestLoading } from './platform-client';
 import './styles.css';
 
 const codes = Object.keys(resourceDefinitions);
 const firstPath = codes[0] ? `/${codes[0]}` : '/';
 
+function GlobalRequestLoading() {
+  const loading = useGlobalRequestLoading();
+  return loading ? (
+    <div aria-live="polite" className="oxa-global-request-loading">
+      <Spin size="small" />
+      <span>正在加载…</span>
+    </div>
+  ) : null;
+}
+
 const resourceRoutes = codes.flatMap(resourceCode => [
   <Route key={`${resourceCode}-list`} path={`/${resourceCode}`} element={<GeneratedResourcePage resourceCode={resourceCode} />} />,
   <Route key={`${resourceCode}-new`} path={`/${resourceCode}/new`} element={<GeneratedResourcePage mode="create" resourceCode={resourceCode} />} />,
@@ -31,6 +42,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <ConfigProvider locale={zhCN} theme={{ token: { borderRadius: 8, colorBgLayout: '#f3f7fd', colorPrimary: '#1677ff', colorText: '#172033', fontSize: 14 }, components: { Card: { headerFontSize: 16 }, Layout: { bodyBg: '#f3f7fd', headerBg: '#ffffff', siderBg: '#ffffff' }, Menu: { itemBorderRadius: 8, itemSelectedBg: '#eaf3ff' } } }}>
       <AntdApp>
+        <GlobalRequestLoading />
         <RuntimeBoundary>
           <BrowserRouter basename={applicationBasename()}>
             <Refine dataProvider={applicationProvider} resources={codes.map(code => ({ name: code, list: `/${code}`, create: `/${code}/new`, edit: `/${code}/:id/edit`, show: `/${code}/:id` }))}>

package/template/apps/web/src/platform-client.ts

@@ -12,30 +12,62 @@ import {
   type DirectoryResolveRequest,
 } from 'openxiangda-contracts/browser';
 import { applicationCode, runtimeMount } from './runtime-meta';
+import { useSyncExternalStore } from 'react';
 
 interface PlatformEnvelope<T> {
   code: number;
   message?: string;
   errorCode?: string;
+  requestId?: string;
   data: T;
 }
 
-async function request<T>(path: string, init?: RequestInit): Promise<T> {
-  const response = await fetch(path, {
-    credentials: 'include',
-    ...init,
-    headers: {
-      accept: 'application/json',
-      ...(init?.body ? { 'content-type': 'application/json' } : {}),
-      ...init?.headers,
+let globalRequestCount = 0;
+const globalRequestListeners = new Set<() => void>();
+
+function beginGlobalRequest() {
+  globalRequestCount += 1;
+  globalRequestListeners.forEach(listener => listener());
+}
+
+function endGlobalRequest() {
+  globalRequestCount = Math.max(0, globalRequestCount - 1);
+  globalRequestListeners.forEach(listener => listener());
+}
+
+export function useGlobalRequestLoading() {
+  return useSyncExternalStore(
+    listener => {
+      globalRequestListeners.add(listener);
+      return () => globalRequestListeners.delete(listener);
     },
-  });
-  const payload = (await response.json().catch(() => null)) as PlatformEnvelope<T> | T | null;
-  const envelope = payload && typeof payload === 'object' && 'code' in payload ? payload as PlatformEnvelope<T> : null;
-  if (!response.ok || (envelope && envelope.code !== 200)) {
-    throw new Error(`${envelope?.errorCode || `HTTP_${response.status}`}: ${envelope?.message || '平台请求失败'}`);
+    () => globalRequestCount > 0,
+    () => false,
+  );
+}
+
+async function request<T>(path: string, init?: RequestInit): Promise<T> {
+  beginGlobalRequest();
+  try {
+    const response = await fetch(path, {
+      credentials: 'include',
+      ...init,
+      headers: {
+        accept: 'application/json',
+        ...(init?.body ? { 'content-type': 'application/json' } : {}),
+        ...init?.headers,
+      },
+    });
+    const payload = (await response.json().catch(() => null)) as PlatformEnvelope<T> | T | null;
+    const envelope = payload && typeof payload === 'object' && 'code' in payload ? payload as PlatformEnvelope<T> : null;
+    if (!response.ok || (envelope && envelope.code !== 200)) {
+      const requestId = envelope?.requestId ? ` (requestId: ${envelope.requestId})` : '';
+      throw new Error(`${envelope?.errorCode || `HTTP_${response.status}`}: ${envelope?.message || '平台请求失败'}${requestId}`);
+    }
+    return envelope ? envelope.data : payload as T;
+  } finally {
+    endGlobalRequest();
   }
-  return envelope ? envelope.data : payload as T;
 }
 
 export interface RuntimeIdentity {

package/template/apps/web/src/styles.css

@@ -24,6 +24,25 @@ body {
   place-items: center;
 }
 
+.oxa-global-request-loading {
+  position: fixed;
+  z-index: 1200;
+  top: 14px;
+  left: 50%;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 7px 13px;
+  border: 1px solid #dbe7f7;
+  border-radius: 999px;
+  background: rgba(255, 255, 255, 0.96);
+  box-shadow: 0 8px 24px rgba(31, 59, 102, 0.15);
+  color: #355070;
+  font-size: 13px;
+  pointer-events: none;
+  transform: translateX(-50%);
+}
+
 .oxa-app-layout {
   min-height: 100vh;
   background: #f3f7fd;
@@ -1075,6 +1094,61 @@ body {
 .oxa-audit-entry {
   display: grid;
   gap: 4px;
+  padding: 10px 0;
+  border-bottom: 1px solid #edf0f5;
+}
+
+.oxa-audit-entry:last-child {
+  border-bottom: 0;
+}
+
+.oxa-audit-heading,
+.oxa-audit-meta,
+.oxa-audit-change-values {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.oxa-audit-heading {
+  justify-content: space-between;
+}
+
+.oxa-audit-meta {
+  flex-wrap: wrap;
+  color: #7b879b;
+  font-size: 12px;
+}
+
+.oxa-audit-meta .ant-typography {
+  font-size: 12px;
+}
+
+.oxa-audit-changes {
+  display: grid;
+  gap: 7px;
+  margin-top: 4px;
+}
+
+.oxa-audit-change {
+  display: grid;
+  gap: 3px;
+  padding: 7px 8px;
+  border-radius: 6px;
+  background: #f7f9fc;
+}
+
+.oxa-audit-change-values {
+  min-width: 0;
+  color: #47566f;
+  font-size: 12px;
+}
+
+.oxa-audit-change-values > :not(svg) {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .oxa-audit-entry > span {
@@ -1082,6 +1156,214 @@ body {
   font-size: 12px;
 }
 
+.oxa-mobile-reference-trigger {
+  display: flex;
+  width: 100%;
+  min-height: 42px;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding: 9px 12px;
+  border: 1px solid #d9dfe9;
+  border-radius: 8px;
+  background: #fff;
+  color: #1f2b3d;
+  font: inherit;
+  text-align: left;
+}
+
+.oxa-mobile-reference-trigger:disabled {
+  background: #f5f7fa;
+  color: #9aa5b5;
+}
+
+.oxa-mobile-reference-placeholder {
+  color: #9aa5b5;
+}
+
+.oxa-mobile-reference-backdrop {
+  position: fixed;
+  z-index: 1200;
+  inset: 0;
+  display: flex;
+  align-items: flex-end;
+  background: rgb(15 23 42 / 42%);
+}
+
+.oxa-mobile-reference-sheet {
+  display: grid;
+  width: 100%;
+  max-height: min(78vh, 640px);
+  gap: 12px;
+  padding: 16px 16px max(16px, env(safe-area-inset-bottom));
+  overflow: auto;
+  border-radius: 16px 16px 0 0;
+  background: #fff;
+  box-shadow: 0 -8px 32px rgb(15 23 42 / 18%);
+}
+
+.oxa-mobile-reference-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: #1f2b3d;
+}
+
+.oxa-mobile-reference-header button,
+.oxa-mobile-reference-more,
+.oxa-mobile-reference-confirm {
+  border: 0;
+  background: transparent;
+  color: #2d6cdf;
+  font: inherit;
+}
+
+.oxa-mobile-reference-search {
+  width: 100%;
+}
+
+.oxa-mobile-reference-options {
+  display: grid;
+  gap: 4px;
+}
+
+.oxa-mobile-reference-option {
+  display: flex;
+  min-height: 48px;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 4px;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: #1f2b3d;
+  font: inherit;
+  text-align: left;
+}
+
+.oxa-mobile-reference-option.is-selected {
+  background: #edf4ff;
+}
+
+.oxa-mobile-reference-option:disabled {
+  color: #aab3c0;
+  opacity: 0.7;
+}
+
+.oxa-mobile-reference-option-copy {
+  display: grid;
+  min-width: 0;
+  flex: 1;
+  gap: 2px;
+}
+
+.oxa-mobile-reference-option-copy small {
+  overflow: hidden;
+  color: #7b879b;
+  font-size: 12px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.oxa-mobile-reference-loading,
+.oxa-mobile-reference-empty,
+.oxa-mobile-reference-error {
+  padding: 12px 4px;
+  color: #7b879b;
+  font-size: 13px;
+  text-align: center;
+}
+
+.oxa-mobile-reference-error {
+  color: #cf3c46;
+}
+
+.oxa-mobile-reference-more,
+.oxa-mobile-reference-confirm {
+  min-height: 42px;
+  border-radius: 8px;
+  background: #f0f5ff;
+  font-weight: 600;
+  text-align: center;
+}
+
+.oxa-mobile-reference-confirm {
+  background: #2d6cdf;
+  color: #fff;
+}
+
+.oxa-mobile-file-field {
+  display: grid;
+  gap: 8px;
+}
+
+.oxa-mobile-file-button {
+  display: inline-flex !important;
+  width: 100%;
+  min-height: 42px;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid #d9dfe9 !important;
+  border-radius: 8px;
+  background: #fff !important;
+  color: #2d6cdf;
+  font-weight: 600;
+}
+
+.oxa-mobile-file-button.ant-btn:disabled {
+  background: #f5f7fa;
+  color: #9aa5b5;
+}
+
+.oxa-mobile-pending-files {
+  display: grid;
+  gap: 8px;
+}
+
+.oxa-mobile-pending-file {
+  display: flex;
+  min-height: 42px;
+  align-items: center;
+  gap: 8px;
+  padding: 7px 9px;
+  border: 1px solid #dbe3ee;
+  border-radius: 8px;
+  background: #fbfcfe;
+  font-size: 13px;
+}
+
+.oxa-mobile-pending-file-name {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.oxa-mobile-pending-file-copy {
+  display: grid;
+  min-width: 0;
+  flex: 1;
+  gap: 2px;
+}
+
+.oxa-mobile-pending-file-copy small {
+  color: #7b879b;
+  font-size: 12px;
+}
+
+.oxa-mobile-pending-status {
+  color: #2d6cdf;
+  white-space: nowrap;
+}
+
+.oxa-mobile-pending-error {
+  max-width: 42%;
+  overflow: hidden;
+  color: #cf3c46;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 @media (max-width: 1280px) {
   .oxa-grid,
   .oxa-filter-grid {

package/template/apps/web/test/contracts.test.ts

@@ -20,9 +20,21 @@ test('standard surfaces keep authoritative directory/resource selectors and mobi
   const crud = readFileSync(new URL('../src/components/resource/GeneratedResourceCrud.tsx', import.meta.url), 'utf8');
   assert.match(surface, /PlatformDirectoryPicker/);
   assert.match(surface, /source="resource"/);
+  assert.match(surface, /MobileAuthoritativeSelector/);
+  assert.match(surface, /oxa-mobile-file-field/);
+  assert.match(surface, /mobilePending/);
+  assert.match(surface, /上传中/);
+  assert.match(surface, /重试/);
+  assert.match(surface, /AttachmentFileList files=\{refs\}/);
   assert.match(selector, /searchResource|resolveResource/);
+  assert.match(selector, /role="dialog"/);
+  assert.match(selector, /oxa-mobile-reference-sheet/);
   assert.match(crud, /MobileResourceListPage/);
   assert.match(crud, /fieldWritable/);
+  assert.match(crud, /exportResourceRows/);
+  assert.match(crud, /text\/csv;charset=utf-8/);
+  assert.match(crud, /数据读取失败/);
+  assert.match(crud, /state\.list\.query\.refetch/);
 });
 
 test('runtime metadata stays mount-scoped', () => {

package/template/package.json

@@ -21,9 +21,9 @@
     "build": "pnpm --recursive build"
   },
   "devDependencies": {
-    "openxiangda-cli": "2.0.0-alpha.62",
-    "openxiangda-contracts": "2.0.0-alpha.30",
-    "openxiangda-devkit-core": "2.0.0-alpha.38",
+    "openxiangda-cli": "2.0.0-alpha.66",
+    "openxiangda-contracts": "2.0.0-alpha.31",
+    "openxiangda-devkit-core": "2.0.0-alpha.41",
     "typescript": "5.9.3"
   }
 }