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

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

@@ -1,69 +1,18 @@
-import {
-  ApartmentOutlined,
-  AppstoreOutlined,
-  BookOutlined,
-  DownOutlined,
-  ExperimentOutlined,
-  HomeOutlined,
-  LeftOutlined,
-  MenuUnfoldOutlined,
-  SettingOutlined,
-  TeamOutlined,
-} from '@ant-design/icons';
-import {
-  Avatar,
-  Breadcrumb,
-  Button,
-  Layout,
-  Menu,
-  Space,
-  Typography,
-  type MenuProps,
-} from 'antd';
+import { AppstoreOutlined, DatabaseOutlined, LeftOutlined, MenuUnfoldOutlined, SettingOutlined } from '@ant-design/icons';
+import { Avatar, Breadcrumb, Button, Empty, Layout, Menu, Space, Typography, type MenuProps } from 'antd';
 import type { ReactNode } from 'react';
 import { useEffect, useMemo, useState } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
+import { resourceDefinitions } from '../../../packages/contracts/src/generated.js';
 import { resolveDirectory } from './platform-client';
 import { useRuntime } from './runtime';
 
 const { Content, Header, Sider } = Layout;
+type Definition = { code: string; name: string; capabilities: { read: string }; surface: { generated?: boolean } };
+const definitions = resourceDefinitions as unknown as Record<string, Definition>;
 
-type PageMeta = { title: string; breadcrumbs: string[]; selectedKey: string };
-
-function pageMeta(pathname: string): PageMeta {
-  if (pathname === '/colleges') {
-    return {
-      title: '学院字典',
-      breadcrumbs: ['首页', '基础数据', '学院字典'],
-      selectedKey: '/colleges',
-    };
-  }
-  if (pathname.endsWith('/new')) {
-    return {
-      title: '新增仪器',
-      breadcrumbs: ['首页', '仪器管理', '仪器资源', '新增仪器'],
-      selectedKey: '/instruments',
-    };
-  }
-  if (pathname.endsWith('/edit')) {
-    return {
-      title: '编辑仪器',
-      breadcrumbs: ['首页', '仪器管理', '仪器资源', '编辑仪器'],
-      selectedKey: '/instruments',
-    };
-  }
-  if (/^\/instruments\/[^/]+$/.test(pathname)) {
-    return {
-      title: '仪器详情',
-      breadcrumbs: ['首页', '仪器管理', '仪器资源', '仪器详情'],
-      selectedKey: '/instruments',
-    };
-  }
-  return {
-    title: '仪器资源',
-    breadcrumbs: ['首页', '仪器管理', '仪器资源'],
-    selectedKey: '/instruments',
-  };
+function currentDefinition(pathname: string) {
+  return Object.values(definitions).find(definition => pathname === `/${definition.code}` || pathname.startsWith(`/${definition.code}/`) || pathname === `/m/${definition.code}` || pathname.startsWith(`/m/${definition.code}/`));
 }
 
 export function Shell({ children }: { children: ReactNode }) {
@@ -72,169 +21,48 @@ export function Shell({ children }: { children: ReactNode }) {
   const navigate = useNavigate();
   const [collapsed, setCollapsed] = useState(false);
   const [user, setUser] = useState({ label: '当前用户', description: '平台用户' });
-  const meta = pageMeta(location.pathname);
-
+  const definition = currentDefinition(location.pathname);
   useEffect(() => {
     let active = true;
-    void resolveDirectory('user', [identity.userId])
-      .then(page => {
-        const entry = page.items[0];
-        if (active && entry) {
-          setUser({
-            label: entry.label || '当前用户',
-            description: entry.description || '平台用户',
-          });
-        }
-      })
-      .catch(() => {
-        if (active) setUser({ label: '当前用户', description: '平台用户' });
-      });
-    return () => {
-      active = false;
-    };
+    void resolveDirectory('user', [identity.userId]).then(page => {
+      const entry = page.items[0];
+      if (active && entry) setUser({ label: entry.label || '当前用户', description: entry.description || '平台用户' });
+    }).catch(() => undefined);
+    return () => { active = false; };
   }, [identity.userId]);
-
-  const menuItems = useMemo<MenuProps['items']>(
-    () => [
-      {
-        key: 'overview',
-        icon: <AppstoreOutlined />,
-        label: '总览',
-        children: [
-          { key: 'workbench', icon: <HomeOutlined />, label: '工作台' },
-        ],
-      },
-      {
-        key: 'instrument-management',
-        icon: <ExperimentOutlined />,
-        label: '仪器管理',
-        children: [
-          {
-            key: '/instruments',
-            icon: <ExperimentOutlined />,
-            label: '仪器资源',
-          },
-          {
-            key: 'open-records',
-            icon: <BookOutlined />,
-            label: '开放记录',
-            disabled: true,
-          },
-        ],
-      },
-      {
-        key: 'base-data',
-        icon: <ApartmentOutlined />,
-        label: '基础数据',
-        children: hasCapability('app:instrument-center:data:colleges:read')
-          ? [
-              {
-                key: '/colleges',
-                icon: <ApartmentOutlined />,
-                label: '学院字典',
-              },
-            ]
-          : [],
-      },
-      {
-        key: 'system-settings',
-        icon: <SettingOutlined />,
-        label: '系统设置',
-        children: [
-          {
-            key: 'application-admins',
-            icon: <TeamOutlined />,
-            label: '应用管理员',
-            disabled: true,
-          },
-        ],
-      },
-    ],
-    [hasCapability]
-  );
-
+  const menuItems = useMemo<MenuProps['items']>(() => [
+    { key: 'overview', icon: <AppstoreOutlined />, label: '总览', children: [{ key: 'home', label: '首页' }] },
+    {
+      key: 'resources',
+      icon: <DatabaseOutlined />,
+      label: '数据管理',
+      children: Object.values(definitions)
+        .filter(item => item.surface.generated !== false && hasCapability(item.capabilities.read))
+        .map(item => ({ key: `/${item.code}`, icon: <DatabaseOutlined />, label: item.name })),
+    },
+    { key: 'settings', icon: <SettingOutlined />, label: '系统设置', children: [{ key: 'settings-disabled', label: '应用设置', disabled: true }] },
+  ], [hasCapability]);
   return (
     <Layout className="oxa-app-layout">
-      <Sider
-        className="oxa-sider"
-        breakpoint="lg"
-        collapsed={collapsed}
-        collapsedWidth={76}
-        collapsible
-        onBreakpoint={setCollapsed}
-        theme="light"
-        trigger={null}
-        width={240}
-      >
-        <div className="oxa-brand">
-          <div aria-hidden className="oxa-brand-mark">
-            <span />
-          </div>
-          {!collapsed && (
-            <div className="oxa-brand-copy">
-              <strong>仪器资源管理</strong>
-              <span>仪器、学院与开放管理</span>
-            </div>
-          )}
-        </div>
-        <Menu
-          className="oxa-menu"
-          defaultOpenKeys={[
-            'overview',
-            'instrument-management',
-            'base-data',
-            'system-settings',
-          ]}
-          inlineCollapsed={collapsed}
-          items={menuItems}
-          mode="inline"
-          onClick={({ key }) => {
-            if (key === 'workbench' || key === '/instruments') {
-              navigate('/instruments');
-            } else if (key === '/colleges') {
-              navigate('/colleges');
-            }
-          }}
-          selectedKeys={[meta.selectedKey]}
-        />
-        <div className="oxa-sider-footer">
-          <Button
-            aria-label={collapsed ? '展开侧边栏' : '收起侧边栏'}
-            block
-            icon={collapsed ? <MenuUnfoldOutlined /> : <LeftOutlined />}
-            onClick={() => setCollapsed(value => !value)}
-            type="text"
-          >
-            {!collapsed && '收起侧边栏'}
-          </Button>
-        </div>
+      <Sider className="oxa-sider" collapsed={collapsed} collapsedWidth={76} collapsible onBreakpoint={setCollapsed} theme="light" trigger={null} width={240}>
+        <div className="oxa-brand"><div aria-hidden className="oxa-brand-mark"><span /></div>{!collapsed && <div className="oxa-brand-copy"><strong>OpenXiangda 应用</strong><span>标准资源管理工作台</span></div>}</div>
+        <Menu className="oxa-menu" defaultOpenKeys={['overview', 'resources', 'settings']} inlineCollapsed={collapsed} items={menuItems} mode="inline" onClick={({ key }) => {
+          if (key === 'home') navigate(Object.keys(definitions)[0] ? `/${Object.keys(definitions)[0]}` : '/');
+          else if (typeof key === 'string' && key.startsWith('/')) navigate(key);
+        }} selectedKeys={definition ? [`/${definition.code}`] : []} />
+        <div className="oxa-sider-footer"><Button aria-label={collapsed ? '展开侧边栏' : '收起侧边栏'} block icon={collapsed ? <MenuUnfoldOutlined /> : <LeftOutlined />} onClick={() => setCollapsed(value => !value)} type="text">{!collapsed && '收起侧边栏'}</Button></div>
       </Sider>
       <Layout className="oxa-workspace">
         <Header className="oxa-topbar">
-          <div className="oxa-topbar-page">
-            <Breadcrumb items={meta.breadcrumbs.map(title => ({ title }))} />
-            <Typography.Title
-              data-testid={meta.title === '仪器资源' ? 'instrument-title' : undefined}
-              level={3}
-            >
-              {meta.title}
-            </Typography.Title>
-          </div>
-          <Space className="oxa-current-user" size={12}>
-            <Avatar className="oxa-current-user-avatar" size={42}>
-              {user.label.slice(0, 1)}
-            </Avatar>
-            <div className="oxa-current-user-copy">
-              <strong>{user.label}</strong>
-              <span>{user.description}</span>
-            </div>
-            <DownOutlined className="oxa-current-user-chevron" />
-          </Space>
+          <div className="oxa-topbar-page"><Breadcrumb items={[{ title: '首页' }, ...(definition ? [{ title: definition.name }] : [])]} /><Typography.Title level={3}>{definition?.name || '应用首页'}</Typography.Title></div>
+          <Space className="oxa-current-user" size={12}><Avatar className="oxa-current-user-avatar" size={42}>{user.label.slice(0, 1)}</Avatar><div className="oxa-current-user-copy"><strong>{user.label}</strong><span>{user.description}</span></div></Space>
         </Header>
-        <Content className="oxa-content">
-          <main className="oxa-main">{children}</main>
-        </Content>
+        <Content className="oxa-content"><main className="oxa-main">{children}</main></Content>
       </Layout>
     </Layout>
   );
 }
+
+export function EmptyApplicationPage() {
+  return <Shell><Empty description="还没有声明数据资源；请在 platform/data 中添加 DataResource" /></Shell>;
+}

package/template/apps/web/src/components/platform-fields/AttachmentFileList.tsx

@@ -78,7 +78,7 @@ function openIsolatedWindow(url: string) {
 
 export function AttachmentFileList({
   files,
-  resourceCode = 'instruments',
+  resourceCode = 'resources',
   removable = false,
   onRemove,
 }: {

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> & {
@@ -98,13 +101,150 @@ function normalizeFormValues(values: Record<string, unknown>, surface: DataResou
       const widget = surface.fields[key]?.widget;
       return widget === 'date' || widget === 'datetime'
         ? [key, value && typeof value === 'object' && 'format' in value
-            ? (value as { format: (pattern: string) => string }).format(widget === 'datetime' ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD')
+            ? (widget === 'datetime'
+              ? dayjs(value as never).toISOString()
+              : (value as { format: (pattern: string) => string }).format('YYYY-MM-DD'))
             : value]
         : [key, value];
     })
   );
 }
 
+function fieldWritable(
+  field: SurfaceField,
+  mode: 'create' | 'edit',
+  hasCapability: (code: string) => boolean,
+  isAppSuperAdmin: boolean
+) {
+  const capability = mode === 'create' ? field.createCapability : field.updateCapability;
+  if (isAppSuperAdmin) return true;
+  if (capability) return hasCapability(capability);
+  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 || {
@@ -152,10 +292,11 @@ function GeneratedResourceListPage({ definition, variant }: { definition: Genera
 function GeneratedDesktopList({ definition }: { definition: GeneratedDefinition }) {
   const navigate = useNavigate();
   const { message } = App.useApp();
-  const { hasCapability } = useRuntime();
+  const { hasCapability, identity } = useRuntime();
   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>>(() => [
@@ -185,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 }))} />
@@ -204,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' }); }}
@@ -224,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>
   );
@@ -244,7 +427,7 @@ function GeneratedResourceFormPage({ definition, mode, variant }: { definition:
   const { id = '' } = useParams();
   const navigate = useNavigate();
   const { message } = App.useApp();
-  const { hasCapability } = useRuntime();
+  const { hasCapability, identity } = useRuntime();
   const [form] = Form.useForm();
   const create = useCreate<ResourceRecord>();
   const update = useUpdate<ResourceRecord>();
@@ -255,17 +438,25 @@ 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(values, surface);
+    const next = normalizeFormValues(
+      Object.fromEntries(
+        Object.entries(values).filter(([key]) =>
+          fieldWritable(surface.fields[key] ? { key, ...surface.fields[key] } : { key, label: key, widget: 'text' }, mode, hasCapability, identity.isAppSuperAdmin)
+        )
+      ),
+      surface
+    );
     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.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 => { const capability = mode === 'create' ? field.createCapability : field.updateCapability; return <SurfaceFieldControl key={field.key} disabled={Boolean(capability) && !hasCapability(capability!)} 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>
   );
@@ -277,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>;
 }