openxiangda-cli 2.0.0-alpha.182 → 2.0.0-alpha.185

package/template/apps/web/e2e/mobile-reference-fixture.tsx

@@ -1,314 +0,0 @@
-import React, { useState } from 'react';
-import ReactDOM from 'react-dom/client';
-import { BrowserRouter } from 'react-router-dom';
-import { App, ConfigProvider, Form } from 'antd';
-import {
-  RuntimeBoundary,
-  OpenXiangdaResourceDefinitionsProvider,
-} from 'openxiangda/react';
-import {
-  MobileSurfaceFieldControl,
-  SubtableField,
-  buildSubtableOperations,
-  fieldValueForData,
-  type SurfaceField,
-  type SurfaceFieldRenderers,
-  type SubtableDraftRow,
-} from 'openxiangda/field-kit';
-import { Button } from 'openxiangda/mobile';
-import type { DataResourceSurface, DataFileRef } from 'openxiangda/core';
-import 'openxiangda/react/styles.css';
-
-const options = ['选项一', '选项二', '选项三'].map((label, index) => ({
-  label,
-  value: String(index + 1),
-}));
-const field = (
-  key: string,
-  type: string,
-  widget: string,
-  extra = {}
-): SurfaceField =>
-  ({
-    key,
-    label: key,
-    type,
-    widget,
-    readCapabilities: [],
-    createCapabilities: [],
-    updateCapabilities: [],
-    ...extra,
-  } as SurfaceField);
-const childFields = {
-  choice: field('choice', 'option.single', 'select', {
-    label: '下拉单选',
-    options,
-  }),
-  quantity: field('quantity', 'number.integer', 'number', {
-    label: '数值',
-    requiredHint: true,
-    scale: 0,
-  }),
-  name: field('name', 'text.short', 'text', {
-    label: '单行文本',
-    requiredHint: true,
-  }),
-  parent_id: field('parent_id', 'uuid', 'text'),
-  row_order: field('row_order', 'number.integer', 'number'),
-};
-const childSurface: DataResourceSurface = {
-  mutationOwner: 'native',
-  generated: {
-    list: true,
-    detail: true,
-    create: true,
-    update: true,
-    delete: true,
-  },
-  fields: childFields,
-};
-const definitions = {
-  'form-items': {
-    code: 'form-items',
-    name: '表单明细',
-    capabilities: {
-      read: 'read',
-      create: 'create',
-      update: 'update',
-      delete: 'delete',
-    },
-    surface: childSurface,
-  },
-};
-const groups = [
-  {
-    title: '基础信息',
-    fields: [
-      field('单行文本', 'text.short', 'text'),
-      field('多行文本', 'text.long', 'textarea'),
-      field('数值', 'number.integer', 'number', { scale: 0 }),
-      field('评分', 'number.integer', 'rating'),
-      field('单选', 'option.single', 'radio', { options }),
-      field('复选', 'option.multiple', 'checkbox', { options }),
-    ],
-  },
-  {
-    title: '选择与时间',
-    fields: [
-      field('下拉单选', 'option.single', 'select', { options }),
-      field('下拉复选', 'option.multiple', 'multi-select', { options }),
-      field('日期', 'date', 'date'),
-      field('日期时间', 'datetime', 'datetime'),
-      field('日期区间', 'date-range', 'date-range', {
-        rangeBoundary: 'closed',
-      }),
-      field('日期时间区间', 'datetime-range', 'datetime-range', {
-        rangeBoundary: 'closed',
-      }),
-    ],
-  },
-  {
-    title: '文件与明细',
-    fields: [
-      field('图片上传', 'image', 'image', {
-        maxCount: 3,
-        maxSizeMb: 20,
-        accept: ['image/*'],
-      }),
-      field('附件', 'file', 'attachment', { maxCount: 3, maxSizeMb: 20 }),
-      field('流水号', 'serial-number', 'readonly'),
-      field('子表单', 'subtable', 'subtable', {
-        subtable: {
-          resourceCode: 'form-items',
-          foreignKey: 'parent_id',
-          orderField: 'row_order',
-          maxRows: 3,
-        },
-      }),
-    ],
-  },
-  {
-    title: '位置与确认',
-    fields: [
-      field('地址', 'address', 'address'),
-      field('定位', 'location', 'location'),
-      field('级联选择', 'cascade.single', 'cascade', {
-        options: [
-          {
-            label: '部门',
-            value: 'department',
-            children: [
-              { label: 'A部门', value: 'a' },
-              { label: 'B部门', value: 'b' },
-            ],
-          },
-        ],
-      }),
-      field('手写签名', 'signature', 'signature'),
-      field('富文本', 'text.rich', 'rich-text'),
-    ],
-  },
-];
-const file: DataFileRef = {
-  schemaVersion: 'openxiangda.data-file-ref/v2',
-  id: '11111111-1111-4111-8111-111111111111',
-  name: '使用说明.pdf',
-  size: 12680,
-  contentType: 'application/pdf',
-};
-const image: DataFileRef = {
-  ...file,
-  id: '22222222-2222-4222-8222-222222222222',
-  name: '活动图片.png',
-  contentType: 'image/png',
-  width: 640,
-  height: 480,
-};
-const initialRows: SubtableDraftRow[] = [
-  {
-    key: 'item-1',
-    id: 'item-1',
-    revision: 4,
-    state: 'persisted',
-    data: { choice: options[2], quantity: 11, name: '测试记录' },
-    originalData: { choice: options[2], quantity: 11, name: '测试记录' },
-    originalOrder: 0,
-  },
-];
-const initial = {
-  评分: 3,
-  单选: options[1],
-  复选: options.slice(1),
-  图片上传: [image],
-  附件: [file],
-  子表单: initialRows,
-  日期: '2026-09-05',
-  日期时间: '2026-09-05T09:45:33.000Z',
-  日期区间: { start: '2026-09-05', end: '2026-09-08' },
-  日期时间区间: {
-    start: '2026-09-05T09:00:00.000Z',
-    end: '2026-09-08T10:00:00.000Z',
-  },
-  富文本: '<p>已有<strong>格式内容</strong></p>',
-};
-const renderers: SurfaceFieldRenderers = {
-  signer: { value: 'acceptance-user', label: '王老师' },
-  upload: async (_field, file) => {
-    const response = await fetch('/__reference-upload-fixture', { method: 'POST', body: file, headers: { 'x-file-name': encodeURIComponent(file.name) } });
-    if (!response.ok) throw new Error('上传失败');
-    return response.json();
-  },
-  renderSubtable: ({ field, disabled, operation, recordId }) => (
-    <SubtableField
-      mobile
-      field={field}
-      disabled={disabled}
-      operation={operation}
-      parentRecordId={recordId}
-    />
-  ),
-};
-
-function MobileReferenceForm() {
-  const [form] = Form.useForm();
-  const [saved, setSaved] = useState<unknown>();
-  const [operations, setOperations] = useState<unknown>();
-  const [notice, setNotice] = useState('');
-  return (
-    <main className="oxa-mobile-entry oxa-mobile-scope reference-form">
-      <header className="oxa-mobile-header">
-        <h3>未命名表单</h3>
-      </header>
-      <Form
-        className="oxa-mobile-form"
-        form={form}
-        initialValues={initial}
-        onFinish={values => {
-          setSaved(
-            Object.fromEntries(
-              groups
-                .flatMap(group => group.fields)
-                .map(item => [
-                  item.key,
-                  fieldValueForData(item, values[item.key]),
-                ])
-            )
-          );
-          setOperations(
-            buildSubtableOperations({
-              rows: values.子表单,
-              childResourceCode: 'form-items',
-              childSurface,
-              foreignKey: 'parent_id',
-              orderField: 'row_order',
-              maxRows: 3,
-              parent: { operation: 'update', id: 'parent-1' },
-              canWrite: () => true,
-              canDelete: true,
-            })
-          );
-          setNotice('提交成功');
-        }}
-      >
-        <div className="reference-content">
-          {groups.map(group => (
-            <section key={group.title} aria-label={group.title}>
-              <h2 className="reference-group-title">{group.title}</h2>
-              <div className="reference-group">
-                {group.fields.map(field => (
-                  <div data-field-code={field.key} key={field.key}>
-                    <MobileSurfaceFieldControl
-                      field={field}
-                      operation="create"
-                      resourceCode="field-records"
-                      renderers={renderers}
-                    />
-                  </div>
-                ))}
-              </div>
-            </section>
-          ))}
-          {notice && (
-            <div className="reference-notice" role="status">
-              {notice}
-            </div>
-          )}
-        </div>
-        <footer className="oxa-actions">
-          <Button
-            onClick={() => {
-              sessionStorage.setItem(
-                'mobile-reference-draft',
-                JSON.stringify(form.getFieldsValue())
-              );
-              setNotice('已暂存');
-            }}
-          >
-            暂存
-          </Button>
-          <Button color="primary" type="submit">
-            提交
-          </Button>
-        </footer>
-        <output data-saved-values>{JSON.stringify(saved)}</output>
-        <output data-operations>{JSON.stringify(operations)}</output>
-      </Form>
-    </main>
-  );
-}
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <ConfigProvider>
-      <App>
-        <BrowserRouter>
-          <RuntimeBoundary>
-            <OpenXiangdaResourceDefinitionsProvider definitions={definitions}>
-              <MobileReferenceForm />
-            </OpenXiangdaResourceDefinitionsProvider>
-          </RuntimeBoundary>
-        </BrowserRouter>
-      </App>
-    </ConfigProvider>
-  </React.StrictMode>
-);

package/template/apps/web/e2e/mobile-reference.spec.ts

@@ -1,360 +0,0 @@
-import { expect, test, type Page } from '@playwright/test';
-import { mockPlatform } from './resource-platform-mock';
-
-const field = (page: Page, label: string) =>
-  page.locator(`[data-field-code="${label}"]`);
-const sheet = (page: Page, label: string) =>
-  page.getByRole('dialog', { name: `选择${label}`, exact: true });
-const open = async (page: Page, label: string) => {
-  await field(page, label)
-    .getByRole('button', { name: `选择${label}`, exact: true })
-    .click();
-  await expect(sheet(page, label)).toBeVisible();
-};
-const submit = async (page: Page) => {
-  await page.getByRole('button', { name: '提交', exact: true }).click();
-  await expect(page.locator('[data-saved-values]')).not.toBeEmpty();
-  return JSON.parse(
-    (await page.locator('[data-saved-values]').textContent()) || '{}'
-  );
-};
-
-test.describe('confirmed mobile form reference', () => {
-  test.beforeEach(async ({ page }) => {
-    await page.setViewportSize({ width: 390, height: 844 });
-    await mockPlatform(page.context(), true, undefined, true);
-    const uploads = new Map<string, Buffer>();
-    await page.route('**/__reference-upload-fixture', route => {
-      const id = crypto.randomUUID();
-      const body = route.request().postDataBuffer()!;
-      uploads.set(id, body);
-      return route.fulfill({ json: { schemaVersion: 'openxiangda.data-file-ref/v2', id, name: decodeURIComponent(route.request().headers()['x-file-name']), size: body.length, contentType: 'image/png' } });
-    });
-    await page.route('**/files/*/content?**', route => {
-      const id = new URL(route.request().url()).pathname.split('/files/')[1].split('/')[0];
-      const uploaded = uploads.get(id);
-      return uploaded ? route.fulfill({ contentType: 'image/png', body: uploaded }) : route.fulfill({
-        contentType: 'image/svg+xml',
-        body: '<svg xmlns="http://www.w3.org/2000/svg" width="640" height="480"><rect width="640" height="480" fill="#e7eef1"/><path d="M0 480L220 180L410 480M230 480L450 250L640 480" fill="#9badbb"/></svg>',
-      });
-    });
-    await page.route('**/files/*/preview?**', route =>
-      route.fulfill({
-        json: {
-          canPreview: true,
-          previewType: 'image',
-          file: { name: '活动图片.png' },
-        },
-      })
-    );
-    await page.goto('/mobile-reference.e2e.html');
-    await expect(
-      page.getByRole('heading', { name: '未命名表单' })
-    ).toBeVisible();
-  });
-
-  test('grouped borderless inputs, inline choices, rating and staged dropdowns', async ({
-    page,
-  }, info) => {
-    const errors: string[] = [];
-    page.on('pageerror', error => errors.push(error.message));
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-form-empty.png'),
-    });
-    await expect(field(page, '单行文本').getByRole('textbox')).toHaveCSS(
-      'border-top-width',
-      '0px'
-    );
-    await field(page, '单行文本').getByRole('textbox').fill('会议记录');
-    await field(page, '多行文本').getByRole('textbox').fill('第一行\n第二行');
-    await field(page, '数值').getByRole('textbox').fill('18');
-    await field(page, '评分')
-      .getByRole('radio', { name: '4', exact: true })
-      .click();
-    await field(page, '单选').getByText('选项三', { exact: true }).click();
-    await field(page, '复选').getByText('选项一', { exact: true }).click();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-basic-fields.png'),
-    });
-    await open(page, '下拉单选');
-    await sheet(page, '下拉单选').getByText('选项二', { exact: true }).click();
-    await sheet(page, '下拉单选')
-      .getByRole('button', { name: '取消', exact: true })
-      .click();
-    await expect(
-      field(page, '下拉单选').getByRole('button', {
-        name: '选择下拉单选',
-        exact: true,
-      })
-    ).toHaveText('请选择');
-    await open(page, '下拉单选');
-    await sheet(page, '下拉单选')
-      .getByPlaceholder('搜索', { exact: true })
-      .fill('三');
-    await sheet(page, '下拉单选').getByText('选项三', { exact: true }).click();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-single-select.png'),
-    });
-    await sheet(page, '下拉单选')
-      .getByRole('button', { name: '确定', exact: true })
-      .click();
-    await open(page, '下拉复选');
-    await sheet(page, '下拉复选').getByText('选项一', { exact: true }).click();
-    await sheet(page, '下拉复选').getByText('选项二', { exact: true }).click();
-    await expect(sheet(page, '下拉复选')).toContainText('当前已选中 2 项');
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-multi-select.png'),
-    });
-    await sheet(page, '下拉复选')
-      .getByRole('button', { name: '确定', exact: true })
-      .click();
-    const saved = await submit(page);
-    expect(saved.评分).toBe(4);
-    expect(saved.数值).toBe(18);
-    expect(saved.多行文本).toBe('第一行\n第二行');
-    expect(saved.单选).toEqual({ label: '选项三', value: '3' });
-    expect(saved.复选).toHaveLength(3);
-    expect(saved.下拉复选).toHaveLength(2);
-    expect(saved.下拉单选).toEqual({ label: '选项三', value: '3' });
-    expect(saved.富文本).toBe('<p>已有<strong>格式内容</strong></p>');
-    expect(errors).toEqual([]);
-  });
-
-  test('calendar, time wheels and range steps preserve cancellation and boundaries', async ({
-    page,
-  }, info) => {
-    await open(page, '日期时间');
-    const date = sheet(page, '日期时间');
-    await expect(date.locator('.adm-calendar')).toBeVisible();
-    await date
-      .locator('.adm-calendar-cell:not(.adm-calendar-cell-disabled)')
-      .filter({ hasText: /^7$/ })
-      .click();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-calendar.png'),
-    });
-    await date
-      .locator('.oxa-mobile-date-time-footer')
-      .getByRole('button')
-      .click();
-    await expect(date.locator('.adm-picker-view')).toBeVisible();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-time-wheels.png'),
-    });
-    await date.getByRole('button', { name: '取消', exact: true }).click();
-    expect((await submit(page)).日期时间).toBe('2026-09-05T09:45:33.000Z');
-    await open(page, '日期时间区间');
-    const range = sheet(page, '日期时间区间');
-    await expect(range).toContainText('选择开始时间');
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-range-start.png'),
-    });
-    await range.getByRole('button', { name: '下一步', exact: true }).click();
-    await expect(range).toContainText('选择结束时间');
-    await range.getByRole('button', { name: '上一步', exact: true }).click();
-    await expect(range).toContainText('选择开始时间');
-    await range.getByRole('button', { name: '下一步', exact: true }).click();
-    await range.getByRole('button', { name: '确定', exact: true }).click();
-    const saved = await submit(page);
-    expect(saved.日期时间区间).toEqual({
-      start: '2026-09-05T09:00:00.000Z',
-      end: '2026-09-08T10:00:00.000Z',
-    });
-    await open(page, '日期区间');
-    await sheet(page, '日期区间')
-      .getByRole('button', { name: '下一步', exact: true })
-      .click();
-    await sheet(page, '日期区间')
-      .getByRole('button', { name: '确定', exact: true })
-      .click();
-    expect((await submit(page)).日期区间).toEqual({
-      start: '2026-09-05',
-      end: '2026-09-08',
-    });
-  });
-
-  test('address drilldown, location, cascade, touch signature and plain rich text use canonical values', async ({
-    page,
-  }, info) => {
-    const levels = [
-      { adcode: '330000', name: '浙江省', hasChildren: true },
-      { adcode: '330100', name: '杭州市', hasChildren: true },
-      { adcode: '330110', name: '余杭区', hasChildren: true },
-      { adcode: '330110001', name: '五常街道', hasChildren: false },
-    ];
-    await page.route('**/china-divisions/**', route => {
-      const parent = new URL(route.request().url()).searchParams.get(
-        'parentAdcode'
-      );
-      return route.fulfill({
-        json: [
-          levels[
-            parent ? levels.findIndex(item => item.adcode === parent) + 1 : 0
-          ],
-        ],
-      });
-    });
-    await field(page, '地址')
-      .getByRole('button', { name: '选择行政区地址' })
-      .click();
-    const address = page.getByRole('dialog', { name: '选择行政区地址' });
-    for (const level of levels)
-      await address.getByText(level.name, { exact: true }).click();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-address-picker.png'),
-    });
-    await address.getByRole('button', { name: '确定', exact: true }).click();
-    await field(page, '地址')
-      .getByRole('textbox', { name: '详细地址' })
-      .pressSequentially('文一西路 1 号');
-    await page.context().grantPermissions(['geolocation']);
-    await page.context().setGeolocation({
-      latitude: 30.234567,
-      longitude: 120.123456,
-      accuracy: 10,
-    });
-    await field(page, '定位').getByRole('button', { name: '获取定位' }).click();
-    await expect(field(page, '定位')).toContainText('120.123456');
-    await open(page, '级联选择');
-    await sheet(page, '级联选择')
-      .getByRole('button', { name: '进入部门' })
-      .click();
-    await sheet(page, '级联选择').getByText('B部门', { exact: true }).click();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-cascade-picker.png'),
-    });
-    await sheet(page, '级联选择')
-      .getByRole('button', { name: '确定', exact: true })
-      .click();
-    await field(page, '手写签名')
-      .getByRole('button', { name: '开始签名' })
-      .click();
-    const signature = page.getByRole('dialog', {
-      name: '手写签名',
-      exact: true,
-    });
-    const canvas = signature.locator('canvas');
-    await canvas.click({ trial: true });
-    const box = (await canvas.boundingBox())!;
-    await page.mouse.move(box.x + 40, box.y + 80);
-    await page.mouse.down();
-    await page.mouse.move(box.x + 180, box.y + 120, { steps: 8 });
-    await page.mouse.move(box.x + 110, box.y + 160, { steps: 6 });
-    await page.mouse.up();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-signature-pad.png'),
-    });
-    await signature.getByRole('button', { name: '保存签名' }).click();
-    await expect(signature).toHaveCount(0);
-    await expect(field(page, '手写签名').getByRole('img', { name: '业务签名' })).toHaveJSProperty('naturalHeight', 240);
-    await field(page, '富文本')
-      .getByRole('textbox')
-      .fill('第一行 <说明>\n第二行 & 补充');
-    const saved = await submit(page);
-    expect(saved.地址.detail).toBe('文一西路 1 号');
-    expect(saved.地址.street.label).toBe('五常街道');
-    expect(saved.定位.longitude).toBe(120.123456);
-    expect(saved.定位.source).toBe('browser');
-    expect(saved.级联选择).toEqual([
-      { value: 'department', label: '部门' },
-      { value: 'b', label: 'B部门' },
-    ]);
-    expect(saved.手写签名.hash).toMatch(/^[0-9a-f]{64}$/);
-    expect(saved.手写签名.points.length).toBeGreaterThan(1);
-    expect(saved.富文本).toBe(
-      '<p>第一行 &lt;说明&gt;</p><p>第二行 &amp; 补充</p>'
-    );
-    expect(
-      await page.evaluate(
-        () => document.documentElement.scrollWidth <= innerWidth
-      )
-    ).toBe(true);
-  });
-
-  test('inline subtable validates collapsed rows and preserves update/delete revisions', async ({
-    page,
-  }, info) => {
-    const subtable = field(page, '子表单');
-    await expect(subtable.locator('.oxa-mobile-subtable-card')).toHaveCount(1);
-    const row = subtable.locator('.oxa-mobile-subtable-card').first();
-    await row
-      .getByRole('textbox', { name: '单行文本', exact: true })
-      .fill('修改后的记录');
-    await row.getByRole('button', { name: '折叠第1项', exact: true }).click();
-    await expect(
-      row.getByRole('textbox', { name: '单行文本', exact: true })
-    ).toBeHidden();
-    await subtable.getByRole('button', { name: '新增一项' }).click();
-    const second = subtable.locator('.oxa-mobile-subtable-card').nth(1);
-    await second
-      .getByRole('textbox', { name: '数值', exact: true })
-      .fill('1.5');
-    await second
-      .getByRole('button', { name: '折叠第2项', exact: true })
-      .click();
-    await page.getByRole('button', { name: '提交', exact: true }).click();
-    await expect(page.locator('[data-saved-values]')).toBeEmpty();
-    await expect(
-      second.getByRole('textbox', { name: '数值', exact: true })
-    ).toBeVisible();
-    await expect(second.getByRole('alert').first()).toBeVisible();
-    await second.getByRole('textbox', { name: '数值', exact: true }).fill('12');
-    await second
-      .getByRole('textbox', { name: '单行文本', exact: true })
-      .fill('新增记录');
-    await row.getByRole('button', { name: '展开第1项', exact: true }).click();
-    await field(page, '图片上传').scrollIntoViewIfNeeded();
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-files-and-subtable.png'),
-    });
-    await subtable.evaluate(element =>
-      window.scrollBy(0, element.getBoundingClientRect().top - 82)
-    );
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-inline-subtable.png'),
-    });
-    await submit(page);
-    const operations = JSON.parse(
-      (await page.locator('[data-operations]').textContent()) || '[]'
-    );
-    expect(operations[0]).toMatchObject({
-      operation: 'update',
-      id: 'item-1',
-      expectedRevision: 4,
-      data: { name: '修改后的记录' },
-    });
-    expect(operations[1]).toMatchObject({
-      operation: 'create',
-      data: {
-        name: '新增记录',
-        quantity: 12,
-        parent_id: 'parent-1',
-        row_order: 1,
-      },
-    });
-    await row.getByRole('button', { name: '删除', exact: true }).click();
-    await submit(page);
-    expect(
-      JSON.parse(
-        (await page.locator('[data-operations]').textContent()) || '[]'
-      )[0]
-    ).toMatchObject({ operation: 'delete', id: 'item-1', expectedRevision: 4 });
-    await page.screenshot({
-      animations: 'disabled',
-      path: info.outputPath('mobile-form-complete.png'),
-      fullPage: true,
-    });
-  });
-});