@gadmin2n/schematics 0.0.144 → 0.0.145

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/business-events/index.test.tsx

@@ -0,0 +1,73 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { MemoryRouter, Route, Routes } from 'react-router-dom';
+import i18n from '../../../i18n';
+import BusinessEventCatalogPage from './index';
+
+const apiMocks = vi.hoisted(() => ({
+  overview: vi.fn(),
+  unregister: vi.fn(),
+}));
+
+vi.mock('../node-instances/widgets/event-catalog.api', () => ({
+  eventCatalogApi: apiMocks,
+}));
+
+vi.mock('./RegisterBusinessEventModal', () => ({
+  RegisterBusinessEventModal: () => null,
+}));
+
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: () => ({
+    matches: false,
+    addListener: () => undefined,
+    removeListener: () => undefined,
+    addEventListener: () => undefined,
+    removeEventListener: () => undefined,
+    dispatchEvent: () => false,
+  }),
+});
+
+describe('BusinessEventCatalogPage', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    apiMocks.overview.mockResolvedValue([
+      {
+        registrationCode: 'asset-disposal-status',
+        label: 'public.t_hardware_asset · UPDATE',
+        schemaName: 'public',
+        tableName: 't_hardware_asset',
+        operation: 'UPDATE',
+        watchedFields: ['status'],
+        primaryKeyFields: ['id'],
+        isEnabled: true,
+        fields: [],
+        subscribers: [],
+      },
+    ]);
+  });
+
+  it('opens the selected business event detail page', async () => {
+    await i18n.changeLanguage('zh_CN');
+    render(
+      <MemoryRouter initialEntries={['/admin/workflow/business-events']}>
+        <Routes>
+          <Route
+            path="/admin/workflow/business-events"
+            element={<BusinessEventCatalogPage />}
+          />
+          <Route
+            path="/admin/workflow/business-events/show/:registrationCode"
+            element={<div>业务事件运行记录</div>}
+          />
+        </Routes>
+      </MemoryRouter>,
+    );
+
+    fireEvent.click(
+      await screen.findByText('public.t_hardware_asset · UPDATE'),
+    );
+    expect(screen.getByText('业务事件运行记录')).toBeInTheDocument();
+  });
+});

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/business-events/index.tsx

@@ -0,0 +1,359 @@
+import { PlusOutlined, ReloadOutlined } from '@ant-design/icons';
+import {
+  Badge,
+  Button,
+  Card,
+  Empty,
+  Input,
+  Popconfirm,
+  Space,
+  Table,
+  Tag,
+  Typography,
+  message,
+} from 'antd';
+import type { TableColumnsType } from 'antd';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE, SEARCH_CARD_PROPS } from 'constants/layout';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import {
+  eventCatalogApi,
+  type BusinessEventCatalogItem,
+  type BusinessEventField,
+} from '../node-instances/widgets/event-catalog.api';
+import '../workflow-ui.css';
+import './business-events.css';
+import { RegisterBusinessEventModal } from './RegisterBusinessEventModal';
+import { formatWorkflowUtcDateTime } from '../utils/workflowDateTime';
+
+export default function BusinessEventCatalogPage() {
+  const { t } = useTranslation('workflow');
+  const navigate = useNavigate();
+  const [events, setEvents] = useState<BusinessEventCatalogItem[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [query, setQuery] = useState('');
+  const [registrationOpen, setRegistrationOpen] = useState(false);
+  const [unregistering, setUnregistering] = useState<string>();
+
+  const load = useCallback(async () => {
+    setLoading(true);
+    try {
+      setEvents(await eventCatalogApi.overview());
+    } catch (error: any) {
+      message.error(error?.message ?? t('eventCatalog.loadFailed'));
+    } finally {
+      setLoading(false);
+    }
+  }, [t]);
+
+  useEffect(() => void load(), [load]);
+
+  const unregister = async (event: BusinessEventCatalogItem) => {
+    setUnregistering(event.registrationCode);
+    try {
+      await eventCatalogApi.unregister(event.registrationCode);
+      message.success(t('eventCatalog.registration.unregisterSuccess'));
+      await load();
+    } catch (error: any) {
+      message.error(
+        error?.message ?? t('eventCatalog.registration.unregisterFailed'),
+      );
+    } finally {
+      setUnregistering(undefined);
+    }
+  };
+
+  const filteredEvents = useMemo(() => {
+    const keyword = query.trim().toLowerCase();
+    return events.filter((event) => {
+      if (!keyword) return true;
+      return [
+        event.registrationCode,
+        event.label,
+        event.schemaName,
+        event.tableName,
+        event.operation,
+        ...event.fields.flatMap((field) => [
+          field.path,
+          field.label,
+          field.description,
+        ]),
+      ].some((value) => value?.toLowerCase().includes(keyword));
+    });
+  }, [events, query]);
+
+  const columns: TableColumnsType<BusinessEventCatalogItem> = [
+    {
+      title: t('eventCatalog.event'),
+      dataIndex: 'registrationCode',
+      key: 'registrationCode',
+      width: 300,
+      render: (_, event) => (
+        <Space direction="vertical" size={2}>
+          <Typography.Link
+            strong
+            onClick={() =>
+              navigate(
+                `/admin/workflow/business-events/show/${encodeURIComponent(
+                  event.registrationCode,
+                )}`,
+              )
+            }
+          >
+            {event.label}
+          </Typography.Link>
+          <Typography.Text code>
+            {event.operation === 'UPDATE'
+              ? event.watchedFields.join(', ')
+              : t('eventCatalog.registration.allFields')}
+          </Typography.Text>
+        </Space>
+      ),
+    },
+    {
+      title: t('eventCatalog.availableData'),
+      key: 'availableData',
+      width: 230,
+      render: (_, event) => (
+        <Space direction="vertical" size={2}>
+          <Typography.Text>
+            {t('eventCatalog.fieldCount', { count: event.fields.length })}
+          </Typography.Text>
+          {event.defaultKeyPath && (
+            <Typography.Text type="secondary" style={{ fontSize: 12 }}>
+              {t('eventCatalog.defaultKey', {
+                field: event.defaultKeyPath,
+              })}
+            </Typography.Text>
+          )}
+        </Space>
+      ),
+    },
+    {
+      title: t('eventCatalog.subscribers'),
+      key: 'subscribers',
+      width: 220,
+      render: (_, event) =>
+        event.subscribers.length > 0 ? (
+          <Space wrap size={[4, 4]}>
+            {event.subscribers.map((subscriber) => (
+              <Tag key={subscriber.workflowId}>{subscriber.workflowName}</Tag>
+            ))}
+          </Space>
+        ) : (
+          <Typography.Text type="secondary">
+            {t('eventCatalog.noSubscribers')}
+          </Typography.Text>
+        ),
+    },
+    {
+      title: t('eventCatalog.latestDelivery'),
+      key: 'latestDelivery',
+      width: 210,
+      render: (_, event) => <LatestDelivery event={event} />,
+    },
+    {
+      title: t('eventCatalog.registration.actions'),
+      key: 'actions',
+      width: 120,
+      fixed: 'right',
+      render: (_, event) => (
+        <Popconfirm
+          title={t('eventCatalog.registration.unregisterTitle', {
+            event: event.label,
+          })}
+          description={t('eventCatalog.registration.unregisterDescription')}
+          okText={t('eventCatalog.registration.unregisterConfirm')}
+          cancelText={t('eventCatalog.registration.cancel')}
+          okButtonProps={{ danger: true }}
+          onConfirm={() => unregister(event)}
+        >
+          <Button
+            danger
+            type="link"
+            loading={unregistering === event.registrationCode}
+          >
+            {t('eventCatalog.registration.unregister')}
+          </Button>
+        </Popconfirm>
+      ),
+    },
+  ];
+
+  return (
+    <div className="workflow-page-stack" style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title={t('eventCatalog.title')}
+        subtitle={t('eventCatalog.subtitle')}
+        extra={
+          <Space>
+            <Button icon={<ReloadOutlined />} onClick={load} loading={loading}>
+              {t('eventCatalog.refresh')}
+            </Button>
+            <Button
+              type="primary"
+              icon={<PlusOutlined />}
+              onClick={() => setRegistrationOpen(true)}
+            >
+              {t('eventCatalog.registration.register')}
+            </Button>
+          </Space>
+        }
+      />
+
+      <Card {...SEARCH_CARD_PROPS}>
+        <div className="workflow-event-catalog__filters">
+          <Input.Search
+            allowClear
+            value={query}
+            placeholder={t('eventCatalog.searchPlaceholder')}
+            onChange={(event) => setQuery(event.target.value)}
+            className="workflow-event-catalog__search"
+          />
+          <Typography.Text type="secondary" style={{ fontSize: 12 }}>
+            {t('eventCatalog.resultCount', { count: filteredEvents.length })}
+          </Typography.Text>
+        </div>
+      </Card>
+
+      <Card className="card-table">
+        <Table<BusinessEventCatalogItem>
+          rowKey="registrationCode"
+          loading={loading}
+          columns={columns}
+          dataSource={filteredEvents}
+          scroll={{ x: 1080 }}
+          pagination={{ pageSize: 20, showSizeChanger: false }}
+          locale={{
+            emptyText: (
+              <Empty
+                image={Empty.PRESENTED_IMAGE_SIMPLE}
+                description={
+                  <Space direction="vertical" size={2}>
+                    <Typography.Text>
+                      {t(
+                        events.length === 0
+                          ? 'eventCatalog.emptyTitle'
+                          : 'eventCatalog.noMatchTitle',
+                      )}
+                    </Typography.Text>
+                    <Typography.Text type="secondary">
+                      {t(
+                        events.length === 0
+                          ? 'eventCatalog.emptyDescription'
+                          : 'eventCatalog.noMatchDescription',
+                      )}
+                    </Typography.Text>
+                  </Space>
+                }
+              />
+            ),
+          }}
+          expandable={{
+            rowExpandable: (event) => event.fields.length > 0,
+            expandedRowRender: (event) => <EventFields fields={event.fields} />,
+          }}
+        />
+      </Card>
+
+      <RegisterBusinessEventModal
+        open={registrationOpen}
+        onCancel={() => setRegistrationOpen(false)}
+        onRegistered={() => {
+          setRegistrationOpen(false);
+          void load();
+        }}
+      />
+    </div>
+  );
+}
+
+function LatestDelivery({ event }: { event: BusinessEventCatalogItem }) {
+  const { t } = useTranslation('workflow');
+  const delivery = event.latestDelivery;
+  if (!delivery) {
+    return (
+      <Typography.Text type="secondary">
+        {t('eventCatalog.notTriggered')}
+      </Typography.Text>
+    );
+  }
+
+  const state =
+    delivery.status === 'COMPLETED'
+      ? 'delivered'
+      : delivery.status === 'FAILED' || delivery.status === 'PARTIAL_FAILED'
+        ? 'failed'
+        : 'pending';
+  const badgeStatus = {
+    failed: 'error',
+    delivered: 'success',
+    pending: 'processing',
+  }[state] as 'error' | 'success' | 'processing';
+
+  return (
+    <Space direction="vertical" size={2}>
+      <Badge
+        status={badgeStatus}
+        text={t(`eventCatalog.deliveryStates.${state}`)}
+      />
+      <Typography.Text type="secondary" style={{ fontSize: 12 }}>
+        {formatWorkflowUtcDateTime(delivery.createdAt)}
+      </Typography.Text>
+      {delivery.lastError && (
+        <Typography.Text
+          type="danger"
+          ellipsis={{ tooltip: delivery.lastError }}
+          className="workflow-event-catalog__delivery-error"
+        >
+          {delivery.lastError}
+        </Typography.Text>
+      )}
+    </Space>
+  );
+}
+
+function EventFields({ fields }: { fields: BusinessEventField[] }) {
+  const { t } = useTranslation('workflow');
+
+  return (
+    <div className="workflow-event-catalog__fields">
+      <div className="workflow-event-catalog__fields-heading">
+        <Typography.Text strong>
+          {t('eventCatalog.fieldsTitle')}
+        </Typography.Text>
+        <Typography.Text type="secondary" style={{ fontSize: 12 }}>
+          {t('eventCatalog.fieldsDescription')}
+        </Typography.Text>
+      </div>
+      <div
+        className="workflow-event-catalog__field-row workflow-event-catalog__field-row--header"
+        aria-hidden="true"
+      >
+        <span>{t('eventCatalog.field')}</span>
+        <span>{t('eventCatalog.displayName')}</span>
+        <span>{t('eventCatalog.type')}</span>
+        <span>{t('eventCatalog.requirement')}</span>
+      </div>
+      {fields.map((field) => (
+        <div className="workflow-event-catalog__field-row" key={field.path}>
+          <Typography.Text code>{field.path}</Typography.Text>
+          <Typography.Text>{field.label}</Typography.Text>
+          <Typography.Text type="secondary">{field.type}</Typography.Text>
+          <Space wrap size={[4, 4]}>
+            {field.primaryKey && (
+              <Tag color="blue">{t('eventCatalog.primaryKey')}</Tag>
+            )}
+            <Tag>
+              {field.nullable
+                ? t('eventCatalog.nullable')
+                : t('eventCatalog.required')}
+            </Tag>
+          </Space>
+        </div>
+      ))}
+    </div>
+  );
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/CanvasZoomControls.tsx

@@ -0,0 +1,46 @@
+import { ExpandOutlined } from '@ant-design/icons';
+import { Panel, useReactFlow, useViewport } from '@xyflow/react';
+import { Button, Slider, Tooltip } from 'antd';
+import { useTranslation } from 'react-i18next';
+
+export function CanvasZoomControls() {
+  const { t } = useTranslation('workflow');
+  const { fitView, zoomTo } = useReactFlow();
+  const { zoom } = useViewport();
+  const percentage = Math.round(Math.min(zoom, 2) * 100);
+
+  return (
+    <Panel
+      position="bottom-left"
+      className="workflow-canvas__zoom-controls nodrag nopan"
+    >
+      <div className="workflow-canvas__zoom-slider">
+        <span className="workflow-canvas__zoom-percentage">{percentage}%</span>
+        <Slider
+          min={20}
+          max={200}
+          step={1}
+          value={percentage}
+          tooltip={{ open: false }}
+          aria-label={t('editor.zoomPercentage', { percentage })}
+          onChange={(nextPercentage) => void zoomTo(nextPercentage / 100)}
+        />
+      </div>
+      <Tooltip title={t('editor.fitCanvas')}>
+        <Button
+          type="text"
+          icon={<ExpandOutlined />}
+          aria-label={t('editor.fitCanvas')}
+          onClick={() =>
+            void fitView({
+              padding: 0.18,
+              minZoom: 0.2,
+              maxZoom: 1,
+              duration: 180,
+            })
+          }
+        />
+      </Tooltip>
+    </Panel>
+  );
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/CreateNodeInstanceDrawer.tsx

@@ -14,6 +14,7 @@ import { SchemaForm } from '../node-instances/schema-form/SchemaForm';
 import { schemaConfigDefaults } from '../node-instances/schema-form/schema-defaults';
 import type { WorkflowNodeInstance, WorkflowNodeType } from '../types';
 import { useTranslation } from 'react-i18next';
+import { useWorkflowFormValidation } from '../useWorkflowFormValidation';
 
 interface Props {
   open: boolean;
@@ -29,6 +30,7 @@ export function CreateNodeInstanceDrawer({
   onCreated,
 }: Props) {
   const { t } = useTranslation('workflow');
+  const formValidation = useWorkflowFormValidation();
   const [form] = Form.useForm();
   const [submitting, setSubmitting] = useState(false);
   const [schemaError, setSchemaError] = useState<Error | null>(null);
@@ -105,7 +107,12 @@ export function CreateNodeInstanceDrawer({
       <Typography.Paragraph type="secondary">
         {t('nodeInstance.createAndUseDescription')}
       </Typography.Paragraph>
-      <Form form={form} layout="vertical" disabled={submitting}>
+      <Form
+        form={form}
+        layout="vertical"
+        disabled={submitting}
+        {...formValidation}
+      >
         <Form.Item
           name="name"
           label={t('nodeInstance.instanceName')}
@@ -146,6 +153,7 @@ export function CreateNodeInstanceDrawer({
           schema={nodeType?.configSchema ?? null}
           uiSchema={nodeType?.uiSchema ?? null}
           disabled={submitting}
+          validate={false}
           onSchemaError={setSchemaError}
         />
       </Form>

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/CustomNode.test.tsx

@@ -1,11 +1,37 @@
 import { ReactFlowProvider } from '@xyflow/react';
-import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
 import '../../../i18n';
 import { CustomNode } from './CustomNode';
 
 describe('CustomNode', () => {
-  it('shows the node type separately from its custom label', () => {
+  it('does not expose an IN handle on trigger nodes', () => {
+    const { container } = render(
+      <ReactFlowProvider>
+        <CustomNode
+          {...({
+            id: 'trigger-1',
+            data: {
+              label: '手动触发',
+              type: 'manual_trigger',
+              category: 'TRIGGER',
+              isSelected: false,
+              readonly: false,
+            },
+          } as any)}
+        />
+      </ReactFlowProvider>,
+    );
+
+    expect(container.querySelector('.react-flow__handle.target')).toBeNull();
+    expect(
+      container.querySelector('.react-flow__handle.source'),
+    ).toBeInTheDocument();
+    expect(screen.queryByText('IN')).not.toBeInTheDocument();
+    expect(screen.getByText('OUT')).toBeInTheDocument();
+  });
+
+  it('shows only the custom node label', () => {
     render(
       <ReactFlowProvider>
         <CustomNode
@@ -23,7 +49,82 @@ describe('CustomNode', () => {
       </ReactFlowProvider>,
     );
 
-    expect(screen.getByText('人工审批节点')).toBeInTheDocument();
     expect(screen.getByText('MyOA 人工审批')).toBeInTheDocument();
+    expect(screen.queryByText('人工审批节点')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('workflow-node-category-bar')).toBeNull();
+  });
+
+  it('widens a Switch node as branches are added', () => {
+    const props = {
+      id: 'switch-1',
+      data: {
+        label: '按状态分支',
+        type: 'switch',
+        category: 'CONDITION',
+        outputs: ['pending', 'default'],
+        isSelected: false,
+        readonly: false,
+      },
+    } as any;
+    const { rerender } = render(
+      <ReactFlowProvider>
+        <CustomNode {...props} />
+      </ReactFlowProvider>,
+    );
+
+    expect(screen.getByText('按状态分支').parentElement).toHaveStyle({
+      minWidth: '190px',
+    });
+
+    rerender(
+      <ReactFlowProvider>
+        <CustomNode
+          {...props}
+          data={{
+            ...props.data,
+            outputs: ['pending', 'approved', 'rejected', 'default'],
+          }}
+        />
+      </ReactFlowProvider>,
+    );
+
+    expect(screen.getByText('按状态分支').parentElement).toHaveStyle({
+      minWidth: '352px',
+    });
+  });
+
+  it('shows deletion on the selected editable node', () => {
+    const onDelete = vi.fn();
+    const props = {
+      id: 'approval-1',
+      data: {
+        label: 'MyOA 人工审批',
+        type: 'approval',
+        category: 'APPROVAL',
+        isSelected: false,
+        readonly: false,
+        onDelete,
+      },
+    } as any;
+    const { rerender } = render(
+      <ReactFlowProvider>
+        <CustomNode {...props} />
+      </ReactFlowProvider>,
+    );
+
+    expect(
+      screen.queryByRole('button', { name: /删除节点|Delete node/ }),
+    ).not.toBeInTheDocument();
+
+    rerender(
+      <ReactFlowProvider>
+        <CustomNode {...props} data={{ ...props.data, isSelected: true }} />
+      </ReactFlowProvider>,
+    );
+    fireEvent.click(
+      screen.getByRole('button', { name: /删除节点|Delete node/ }),
+    );
+
+    expect(onDelete).toHaveBeenCalledWith('approval-1');
   });
 });