openxiangda-cli 2.0.0-alpha.57 → 2.0.0-alpha.59

package/template/apps/web/package.json

@@ -15,10 +15,12 @@
     "@refinedev/core": "5.0.12",
     "antd": "6.4.3",
     "dayjs": "1.11.18",
-    "openxiangda-contracts": "2.0.0-alpha.26",
+    "docx-preview": "0.3.7",
+    "openxiangda-contracts": "2.0.0-alpha.28",
     "react": "19.2.8",
     "react-dom": "19.2.8",
-    "react-router-dom": "7.8.2"
+    "react-router-dom": "7.8.2",
+    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
   },
   "devDependencies": {
     "@playwright/test": "1.62.1",

package/template/apps/web/scripts/check.mjs

@@ -20,9 +20,9 @@ const lines = files.reduce(
   0
 );
 if (files.length > 18) throw new Error(`WEB_SOURCE_FILE_BUDGET_EXCEEDED:${files.length}>18`);
-if (lines > 1_600) throw new Error(`WEB_BUSINESS_LOC_BUDGET_EXCEEDED:${lines}>1600`);
+if (lines > 4_300) throw new Error(`WEB_BUSINESS_LOC_BUDGET_EXCEEDED:${lines}>4300`);
 const source = files.map(file => readFileSync(file, 'utf8')).join('\n');
-for (const marker of ['@umijs/', 'openxiangda-' + 'admin', 'openxiangda-' + 'user', 'instrument_query', 'instrument_save', 'function.invoke', 'role' + '-session']) {
+for (const marker of ['@umijs/', 'openxiangda-' + 'admin', 'openxiangda-' + 'user', 'instrument_query', 'instrument_save', 'function.invoke', 'role' + '-session', 'college-' + 'am', 'user-' + 'wang', 'dept-' + 'am-test']) {
   if (source.includes(marker)) throw new Error(`WEB_FORBIDDEN_MARKER:${marker}`);
 }
 const playwright = readFileSync(join(root, 'playwright.config.ts'), 'utf8');

package/template/apps/web/scripts/verify-build.mjs

@@ -13,8 +13,20 @@ const gzip = javascript.reduce(
   (bytes, file) => bytes + gzipSync(readFileSync(file), { level: 9 }).byteLength,
   0
 );
-if (gzip > 600_000) throw new Error(`WEB_JS_GZIP_BUDGET_EXCEEDED:${gzip}>600000`);
+if (gzip > 750_000) throw new Error(`WEB_JS_GZIP_BUDGET_EXCEEDED:${gzip}>750000`);
 if (names.some(name => name.endsWith('.map'))) throw new Error('WEB_SOURCE_MAP_FORBIDDEN');
 const html = readFileSync(join(dist, 'index.html'), 'utf8');
 if (!html.includes('<div id="root"></div>')) throw new Error('WEB_ROOT_MISSING');
-process.stdout.write(`Verified Vite build: ${total} bytes, ${gzip} gzip bytes.\n`);
+const initialNames = [
+  ...html.matchAll(/(?:src|href)="\.\/assets\/([^"]+\.js)"/g),
+].map(match => match[1]);
+const initialGzip = [...new Set(initialNames)].reduce((bytes, name) => {
+  const file = join(assets, name);
+  return bytes + gzipSync(readFileSync(file), { level: 9 }).byteLength;
+}, 0);
+if (initialGzip > 600_000) {
+  throw new Error(`WEB_INITIAL_JS_GZIP_BUDGET_EXCEEDED:${initialGzip}>600000`);
+}
+process.stdout.write(
+  `Verified Vite build: ${total} bytes, ${gzip} total gzip bytes, ${initialGzip} initial gzip bytes.\n`
+);

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

@@ -0,0 +1,371 @@
+import {
+  ApartmentOutlined,
+  BankOutlined,
+  UserOutlined,
+} from '@ant-design/icons';
+import { Avatar, Select, Space, Spin, Tag, Typography } from 'antd';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import {
+  resolveCollegeScope,
+  resolveDirectory,
+  searchCollegeScope,
+  searchDirectory,
+  type DirectoryKind,
+} from './platform-client';
+
+type Source = DirectoryKind | 'college';
+type Option = {
+  value: string;
+  label: string;
+  selectable: boolean;
+  description?: string;
+  path?: string[];
+  source: Source;
+};
+
+function mergeOptions(current: Option[], incoming: Option[]) {
+  const merged = new Map(current.map(option => [option.value, option]));
+  for (const option of incoming) merged.set(option.value, option);
+  return [...merged.values()];
+}
+
+function directoryOption(
+  source: DirectoryKind,
+  item: {
+    id: string;
+    label: string;
+    selectable: boolean;
+    description?: string;
+    path?: Array<{ label: string }>;
+  }
+): Option {
+  return {
+    source,
+    value: item.id,
+    label: item.label,
+    selectable: item.selectable,
+    ...(item.description ? { description: item.description } : {}),
+    ...(item.path?.length
+      ? { path: item.path.map(entry => entry.label) }
+      : {}),
+  };
+}
+
+async function searchSource(
+  source: Source,
+  operation: 'create' | 'update',
+  keyword: string,
+  cursor?: string
+) {
+  if (source === 'college') {
+    const page = await searchCollegeScope(operation, { keyword, cursor });
+    return {
+      items: page.items.map(item => ({ ...item, source }) as Option),
+      nextCursor: page.nextCursor,
+    };
+  }
+  const page = await searchDirectory(source, { keyword, cursor });
+  return {
+    items: page.items.map(item => directoryOption(source, item)),
+    nextCursor: page.nextCursor,
+  };
+}
+
+async function resolveSource(
+  source: Source,
+  operation: 'create' | 'update',
+  values: string[]
+) {
+  if (source === 'college') {
+    return (await resolveCollegeScope(operation, values)).items.map(
+      item => ({ ...item, source }) as Option
+    );
+  }
+  return (await resolveDirectory(source, values)).items.map(item =>
+    directoryOption(source, item)
+  );
+}
+
+function optionIcon(option: Pick<Option, 'source' | 'label'>) {
+  if (option.source === 'user') {
+    return (
+      <Avatar className="oxa-selector-avatar" size={28}>
+        {option.label.slice(0, 1) || <UserOutlined />}
+      </Avatar>
+    );
+  }
+  return option.source === 'college' ? (
+    <BankOutlined className="oxa-selector-icon" />
+  ) : (
+    <ApartmentOutlined className="oxa-selector-icon" />
+  );
+}
+
+function optionDescription(option: Option) {
+  if (option.path?.length) return option.path.join(' / ');
+  return option.description || '';
+}
+
+export function AuthoritativeSelector({
+  value,
+  onChange,
+  source,
+  operation,
+  multiple = false,
+  disabled = false,
+  id,
+  placeholder,
+}: {
+  value?: string | string[];
+  onChange?: (value: string | string[] | undefined) => void;
+  source: Source;
+  operation: 'create' | 'update';
+  multiple?: boolean;
+  disabled?: boolean;
+  id?: string;
+  placeholder: string;
+}) {
+  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 requestSequence = useRef(0);
+  const values = useMemo(
+    () => (Array.isArray(value) ? value : value ? [value] : []),
+    [value]
+  );
+
+  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)
+      .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;
+    };
+  }, [operation, options, source, values]);
+
+  useEffect(() => {
+    if (disabled) return;
+    if (source !== 'college' && keyword.trim().length < 2) {
+      setCursor(null);
+      return;
+    }
+    const sequence = ++requestSequence.current;
+    const timer = window.setTimeout(() => {
+      setLoading(true);
+      setError('');
+      void searchSource(source, operation, keyword)
+        .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);
+        });
+    }, 300);
+    return () => window.clearTimeout(timer);
+  }, [disabled, keyword, operation, source, values]);
+
+  const loadNext = () => {
+    if (!cursor || loading) return;
+    const nextCursor = cursor;
+    setLoading(true);
+    setError('');
+    void searchSource(source, operation, keyword, nextCursor)
+      .then(page => {
+        setOptions(current => mergeOptions(current, page.items));
+        setCursor(page.nextCursor);
+      })
+      .catch(reason =>
+        setError(reason instanceof Error ? reason.message : String(reason))
+      )
+      .finally(() => setLoading(false));
+  };
+
+  return (
+    <Select
+      allowClear
+      className={`oxa-authoritative-selector oxa-selector-${source}`}
+      disabled={disabled}
+      id={id}
+      labelRender={({ label, value: selectedValue }) => {
+        const selected = options.find(
+          option => option.value === String(selectedValue)
+        );
+        return selected?.label || label || '读取中…';
+      }}
+      loading={loading}
+      maxTagCount="responsive"
+      mode={multiple ? 'multiple' : undefined}
+      notFoundContent={
+        loading ? (
+          <Spin size="small" />
+        ) : error ? (
+          <Typography.Text type="danger">{error}</Typography.Text>
+        ) : source !== 'college' && keyword.trim().length < 2 ? (
+          '请输入至少 2 个字符'
+        ) : (
+          '无可选数据'
+        )
+      }
+      onChange={next => {
+        onChange?.(next || undefined);
+        if (!multiple) setOpen(false);
+      }}
+      onOpenChange={setOpen}
+      onPopupScroll={event => {
+        const element = event.currentTarget;
+        if (
+          element.scrollTop + element.clientHeight >=
+          element.scrollHeight - 16
+        )
+          loadNext();
+      }}
+      open={open}
+      optionRender={option => {
+        const item = options.find(
+          current => current.value === String(option.value)
+        );
+        if (!item) return option.label;
+        const description = optionDescription(item);
+        return (
+          <Space className="oxa-selector-option" size={10}>
+            {optionIcon(item)}
+            <span className="oxa-selector-option-copy">
+              <strong>{item.label}</strong>
+              {description && <small>{description}</small>}
+            </span>
+          </Space>
+        );
+      }}
+      options={options.map(option => ({
+        label: option.label,
+        value: option.value,
+        disabled: !option.selectable,
+      }))}
+      placeholder={placeholder}
+      prefix={
+        source === 'user' ? (
+          <UserOutlined />
+        ) : source === 'college' ? (
+          <BankOutlined />
+        ) : (
+          <ApartmentOutlined />
+        )
+      }
+      showSearch={{
+        filterOption: false,
+        onSearch: next => {
+          setKeyword(next);
+          setOpen(true);
+        },
+      }}
+      status={error ? 'error' : undefined}
+      tagRender={({ label, value: selectedValue, closable, onClose }) => {
+        const selected = options.find(
+          option => option.value === String(selectedValue)
+        );
+        return (
+          <Tag
+            className="oxa-selector-tag"
+            closable={closable}
+            onClose={onClose}
+            onMouseDown={event => {
+              event.preventDefault();
+              event.stopPropagation();
+            }}
+          >
+            {selected && optionIcon(selected)}
+            <span>{selected?.label || label || '读取中…'}</span>
+            {selected?.description && <small>{selected.description}</small>}
+          </Tag>
+        );
+      }}
+      value={value}
+    />
+  );
+}
+
+export function ResolvedValueText({
+  source,
+  value,
+}: {
+  source: Source;
+  value?: string | string[];
+}) {
+  const values = useMemo(
+    () => (Array.isArray(value) ? value : value ? [value] : []),
+    [value]
+  );
+  const [items, setItems] = useState<Option[]>([]);
+  const [failed, setFailed] = useState(false);
+  useEffect(() => {
+    if (values.length === 0) {
+      setItems([]);
+      return;
+    }
+    let active = true;
+    setFailed(false);
+    void resolveSource(source, 'update', values)
+      .then(next => {
+        if (active) setItems(next);
+      })
+      .catch(() => {
+        if (active) setFailed(true);
+      });
+    return () => {
+      active = false;
+    };
+  }, [source, values]);
+  if (values.length === 0) return <>-</>;
+  if (failed) return <Typography.Text type="danger">目录解析失败</Typography.Text>;
+  if (!items.length) return <>读取中…</>;
+  const ordered = values.map(value => items.find(item => item.value === value));
+  return (
+    <span className={`oxa-resolved-values oxa-resolved-${source}`}>
+      {ordered.map((item, index) =>
+        item ? (
+          <span className="oxa-resolved-item" key={item.value}>
+            {optionIcon(item)}
+            <span>
+              <strong>{item.label}</strong>
+              {optionDescription(item) && <small>{optionDescription(item)}</small>}
+            </span>
+          </span>
+        ) : (
+          <Typography.Text key={values[index]} type="secondary">
+            目录项不可用
+          </Typography.Text>
+        )
+      )}
+    </span>
+  );
+}

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

@@ -0,0 +1,181 @@
+import { EditOutlined, PlusOutlined } from '@ant-design/icons';
+import {
+  App,
+  Button,
+  Card,
+  Drawer,
+  Form,
+  Input,
+  Result,
+  Space,
+  Switch,
+  Table,
+  Tag,
+} from 'antd';
+import { useEffect, useState } from 'react';
+import { Shell } from './Shell';
+import {
+  collegeDataApi,
+  type CollegeRecord,
+} from './platform-client';
+import { useRuntime } from './runtime';
+
+const capabilities = {
+  read: 'app:instrument-center:data:colleges:read',
+  create: 'app:instrument-center:data:colleges:create',
+  update: 'app:instrument-center:data:colleges:update',
+} as const;
+
+export function CollegePage() {
+  const { hasCapability } = useRuntime();
+  const { message } = App.useApp();
+  const [form] = Form.useForm<{ name: string; enabled: boolean }>();
+  const [rows, setRows] = useState<CollegeRecord[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [editing, setEditing] = useState<CollegeRecord>();
+  const [open, setOpen] = useState(false);
+  const [loadError, setLoadError] = useState('');
+  const refresh = async () => {
+    setLoading(true);
+    setLoadError('');
+    try {
+      setRows((await collegeDataApi.list()).rows);
+    } catch (error) {
+      const reason = error instanceof Error ? error.message : String(error);
+      setLoadError(reason);
+      message.error(reason);
+    } finally {
+      setLoading(false);
+    }
+  };
+  useEffect(() => {
+    if (hasCapability(capabilities.read)) void refresh();
+  }, []);
+  if (!hasCapability(capabilities.read)) {
+    return (
+      <Shell>
+        <Result status="403" title="当前平台用户无学院字典权限" />
+      </Shell>
+    );
+  }
+  const submit = async () => {
+    const values = await form.validateFields();
+    if (editing) {
+      await collegeDataApi.update(editing.id, editing.revision, values);
+    } else {
+      await collegeDataApi.create(values);
+    }
+    setOpen(false);
+    setEditing(undefined);
+    form.resetFields();
+    message.success(editing ? '学院已更新' : '学院已创建');
+    await refresh();
+  };
+  return (
+    <Shell>
+      <Card>
+        <div className="oxa-page-heading">
+          <div>
+            <h1 className="oxa-title">学院字典</h1>
+            <div className="oxa-muted">
+              仪器归属保存学院记录 UUID；停用不会改写已有仪器
+            </div>
+          </div>
+          {hasCapability(capabilities.create) && (
+            <Button
+              icon={<PlusOutlined />}
+              onClick={() => {
+                setEditing(undefined);
+                form.setFieldsValue({ name: '', enabled: true });
+                setOpen(true);
+              }}
+              type="primary"
+            >
+              新增学院
+            </Button>
+          )}
+        </div>
+        {loadError ? (
+          <Result
+            extra={<Button onClick={() => void refresh()}>重新加载</Button>}
+            status="error"
+            subTitle={loadError}
+            title="学院字典暂不可用"
+          />
+        ) : (
+          <Table<CollegeRecord>
+            dataSource={rows}
+            loading={loading}
+            pagination={false}
+            rowKey="id"
+            columns={[
+            { title: '学院名称', dataIndex: 'name' },
+            {
+              title: '状态',
+              dataIndex: 'enabled',
+              render: value => (
+                <Tag color={value ? 'green' : 'default'}>
+                  {value ? '启用' : '停用'}
+                </Tag>
+              ),
+            },
+            {
+              title: '操作',
+              render: (_, record) =>
+                hasCapability(capabilities.update) ? (
+                  <Button
+                    icon={<EditOutlined />}
+                    onClick={() => {
+                      setEditing(record);
+                      form.setFieldsValue({
+                        name: record.name,
+                        enabled: record.enabled,
+                      });
+                      setOpen(true);
+                    }}
+                  >
+                    编辑
+                  </Button>
+                ) : null,
+            },
+            ]}
+          />
+        )}
+      </Card>
+      <Drawer
+        className="oxa-dictionary-drawer"
+        destroyOnHidden
+        extra={
+          <Space>
+            <Button onClick={() => setOpen(false)}>取消</Button>
+            <Button
+              onClick={() =>
+                void submit().catch(error => message.error(error.message))
+              }
+              type="primary"
+            >
+              保存
+            </Button>
+          </Space>
+        }
+        onClose={() => setOpen(false)}
+        open={open}
+        size={520}
+        title={editing ? '编辑学院' : '新增学院'}
+      >
+        <Form form={form} layout="vertical">
+          <Form.Item
+            label="学院名称"
+            name="name"
+            rules={[{ required: true, message: '请输入学院名称' }]}
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item label="启用" name="enabled" valuePropName="checked">
+            <Switch />
+          </Form.Item>
+        </Form>
+      </Drawer>
+    </Shell>
+  );
+}