@gadmin2n/schematics 0.0.144 → 0.0.145

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

@@ -1,7 +1,8 @@
 import React, { useState, useEffect, useRef } from 'react';
-import { Modal, Input, Button, Typography } from 'antd';
-import { SendOutlined } from '@ant-design/icons';
+import { Modal, Input, Button, Typography, message } from 'antd';
+import { SendOutlined, UploadOutlined } from '@ant-design/icons';
 import type { TextAreaRef } from 'antd/es/input/TextArea';
+import { useReferenceUpload } from 'hooks';
 
 const { Text } = Typography;
 
@@ -10,7 +11,7 @@ export interface CanvasAiModalProps {
   open: boolean;
   /** 关闭回调 */
   onClose: () => void;
-  /** 提交回调，返回用户输入的 prompt（已 trim） */
+  /** 提交回调，返回用户输入的 prompt（已 trim，含参考图说明） */
   onSubmit: (prompt: string) => void;
 }
 
@@ -25,26 +26,55 @@ const CanvasAiModal: React.FC<CanvasAiModalProps> = ({
 }) => {
   const [value, setValue] = useState('');
   const textAreaRef = useRef<TextAreaRef>(null);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  // ── 页面参考图（可选，仅一张）──
+  const {
+    file: imgFile,
+    previewUrl: imgPreviewUrl,
+    uploadedPath: uploadedImgPath,
+    uploading: imgUploading,
+    error: imgUploadError,
+    select: selectImgFile,
+    upload: handleImgUpload,
+    reset: resetImg,
+  } = useReferenceUpload({ withPreview: true });
 
   useEffect(() => {
     if (open) {
       setValue('');
+      resetImg();
       requestAnimationFrame(() => {
         textAreaRef.current?.focus();
       });
     }
-  }, [open]);
+  }, [open, resetImg]);
+
+  const handleImgSelect = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const f = e.target.files?.[0] ?? null;
+    e.target.value = '';
+    selectImgFile(f);
+  };
 
   const handleSubmit = () => {
     const trimmed = value.trim();
     if (!trimmed) return;
-    onSubmit(trimmed);
+    if (imgFile && !uploadedImgPath) {
+      message.warning('请先点击"上传"，待参考图上传成功后再发送');
+      return;
+    }
+    let prompt = trimmed;
+    if (uploadedImgPath) {
+      prompt +=
+        '\n\n我提供了一张页面参考图，请用 Read 工具读取它，作为页面布局、样式和设计的参考：\n' +
+        uploadedImgPath;
+    }
+    onSubmit(prompt);
     onClose();
   };
 
   return (
     <Modal
-      title="AI 配置页面"
+      title="AI 配置"
       open={open}
       onCancel={onClose}
       footer={null}
@@ -67,6 +97,96 @@ const CanvasAiModal: React.FC<CanvasAiModalProps> = ({
         }}
         autoSize={{ minRows: 6, maxRows: 12 }}
       />
+
+      {/* 页面参考图（可选，仅一张） */}
+      <div style={{ marginTop: 12 }}>
+        <Text strong style={{ fontSize: 14 }}>
+          参考图
+        </Text>
+        <Text type="secondary" style={{ fontSize: 12, marginLeft: 4 }}>
+          （可选）
+        </Text>
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            gap: 8,
+            marginTop: 8,
+          }}
+        >
+          <input
+            ref={fileInputRef}
+            type="file"
+            accept=".png,.jpg,.jpeg,.webp,.gif"
+            style={{ display: 'none' }}
+            onChange={handleImgSelect}
+          />
+          <Button
+            icon={<UploadOutlined />}
+            onClick={() => fileInputRef.current?.click()}
+          >
+            选择文件
+          </Button>
+          <Text
+            type={imgFile ? undefined : 'secondary'}
+            style={{
+              fontSize: 14,
+              flex: 1,
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              whiteSpace: 'nowrap',
+            }}
+          >
+            {imgFile ? imgFile.name : '未选择任何文件'}
+          </Text>
+          <Button
+            onClick={handleImgUpload}
+            loading={imgUploading}
+            disabled={!imgFile || !!uploadedImgPath}
+          >
+            {uploadedImgPath ? '已上传' : '上传'}
+          </Button>
+        </div>
+        {uploadedImgPath && (
+          <Text
+            type="success"
+            style={{ fontSize: 12, display: 'block', marginTop: 4 }}
+          >
+            ✓ 已上传：{imgFile?.name}
+          </Text>
+        )}
+        {imgUploadError && (
+          <Text
+            type="danger"
+            style={{ fontSize: 12, display: 'block', marginTop: 4 }}
+          >
+            {imgUploadError}
+          </Text>
+        )}
+        {imgPreviewUrl && (
+          <img
+            src={imgPreviewUrl}
+            alt="页面参考图预览"
+            style={{
+              marginTop: 8,
+              maxWidth: '100%',
+              maxHeight: 160,
+              borderRadius: 6,
+              border: '1px solid var(--ant-color-border-secondary)',
+              objectFit: 'contain',
+              display: 'block',
+            }}
+          />
+        )}
+        <Text
+          type="secondary"
+          style={{ fontSize: 12, display: 'block', marginTop: 4 }}
+        >
+          仅支持一张图片（png/jpg/webp/gif），不超过 5MB，AI
+          会读取它作为页面设计参考
+        </Text>
+      </div>
+
       <Button
         type="primary"
         icon={<SendOutlined />}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/human-approval/DecisionModal.test.tsx

@@ -0,0 +1,50 @@
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import { DecisionModal } from './DecisionModal';
+
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: () => ({
+    matches: false,
+    addListener: () => undefined,
+    removeListener: () => undefined,
+    addEventListener: () => undefined,
+    removeEventListener: () => undefined,
+    dispatchEvent: () => false,
+  }),
+});
+
+const getComputedStyle = window.getComputedStyle;
+vi.spyOn(window, 'getComputedStyle').mockImplementation((element) =>
+  getComputedStyle(element),
+);
+
+describe('DecisionModal', () => {
+  it('shows the task content resolved by the Human Approval node', () => {
+    render(
+      <DecisionModal
+        open
+        task={{
+          title: '采购申请审批',
+          description: '请核对预算和供应商信息',
+          details: [
+            { key: 'amount', label: '申请金额', value: 1200 },
+            {
+              key: 'applicant',
+              label: '申请人',
+              value: { name: '张三' },
+            },
+          ],
+        }}
+        onCancel={vi.fn()}
+        onSubmit={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByText('采购申请审批')).toBeInTheDocument();
+    expect(screen.getByText('请核对预算和供应商信息')).toBeInTheDocument();
+    expect(screen.getByText('申请金额')).toBeInTheDocument();
+    expect(screen.getByText('1200')).toBeInTheDocument();
+    expect(screen.getByText('{"name":"张三"}')).toBeInTheDocument();
+  });
+});

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/human-approval/DecisionModal.tsx

@@ -1,9 +1,23 @@
 import React, { useEffect, useState } from 'react';
-import { Alert, Form, Input, Modal, Radio } from 'antd';
+import {
+  Alert,
+  Descriptions,
+  Form,
+  Input,
+  Modal,
+  Radio,
+  Typography,
+} from 'antd';
+
+interface ApprovalTask {
+  title: string;
+  description?: string;
+  details: Array<{ key: string; label: string; value: unknown }>;
+}
 
 interface Props {
   open: boolean;
-  requestLabel?: string;
+  task?: ApprovalTask;
   submitting?: boolean;
   onCancel(): void;
   onSubmit(input: { decision: 'APPROVE' | 'REJECT'; comment?: string }): void;
@@ -11,7 +25,7 @@ interface Props {
 
 export function DecisionModal({
   open,
-  requestLabel,
+  task,
   submitting,
   onCancel,
   onSubmit,
@@ -28,8 +42,8 @@ export function DecisionModal({
   return (
     <Modal
       open={open}
-      title="Confirm approval decision"
-      okText={decision === 'APPROVE' ? 'Confirm approval' : 'Confirm rejection'}
+      title={task?.title ?? '处理审批任务'}
+      okText={decision === 'APPROVE' ? '确认通过' : '确认拒绝'}
       okButtonProps={{ danger: decision === 'REJECT', disabled: submitting }}
       confirmLoading={submitting}
       cancelButtonProps={{ disabled: submitting }}
@@ -44,28 +58,51 @@ export function DecisionModal({
       <Alert
         type={decision === 'APPROVE' ? 'info' : 'warning'}
         showIcon
-        message={`This decision is final for ${requestLabel ?? 'this request'}.`}
+        message={task?.description || '提交后，本次审批决定不可修改。'}
         style={{ marginBottom: 16 }}
       />
+      {task?.details.length ? (
+        <Descriptions
+          column={1}
+          size="small"
+          bordered
+          style={{ marginBottom: 16 }}
+          items={task.details.map((detail) => ({
+            key: detail.key,
+            label: detail.label,
+            children: (
+              <Typography.Text>{displayValue(detail.value)}</Typography.Text>
+            ),
+          }))}
+        />
+      ) : null}
       <Form layout="vertical">
-        <Form.Item label="Decision">
+        <Form.Item label="审批决定">
           <Radio.Group
             value={decision}
             onChange={(event) => setDecision(event.target.value)}
           >
-            <Radio.Button value="APPROVE">Approve</Radio.Button>
-            <Radio.Button value="REJECT">Reject</Radio.Button>
+            <Radio.Button value="APPROVE">通过</Radio.Button>
+            <Radio.Button value="REJECT">拒绝</Radio.Button>
           </Radio.Group>
         </Form.Item>
-        <Form.Item label="Comment">
+        <Form.Item label="审批意见">
           <Input.TextArea
             rows={3}
             value={comment}
             onChange={(event) => setComment(event.target.value)}
-            placeholder="Optional context for this decision"
+            placeholder="选填，说明本次决定的原因"
           />
         </Form.Item>
       </Form>
     </Modal>
   );
 }
+
+function displayValue(value: unknown): string {
+  if (value === null || value === undefined || value === '') return '-';
+  if (typeof value === 'string') return value;
+  if (typeof value === 'number' || typeof value === 'boolean')
+    return String(value);
+  return JSON.stringify(value);
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/human-approval/inbox.tsx

@@ -1,14 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react';
-import {
-  Button,
-  Card,
-  Empty,
-  Space,
-  Table,
-  Tag,
-  Typography,
-  message,
-} from 'antd';
+import { Button, Card, Empty, Table, Tag, Typography, message } from 'antd';
 import { CheckCircleOutlined, ReloadOutlined } from '@ant-design/icons';
 import { customRequest } from 'helpers/http';
 import { PageHeader } from 'components';
@@ -27,9 +18,16 @@ interface InboxItem {
     expiresAt: string | null;
     approvalRule: Record<string, unknown>;
     rejectionRule: Record<string, unknown>;
+    task: ApprovalTask | null;
   };
 }
 
+interface ApprovalTask {
+  title: string;
+  description?: string;
+  details: Array<{ key: string; label: string; value: unknown }>;
+}
+
 export default function ApprovalInboxPage() {
   const [items, setItems] = useState<InboxItem[]>([]);
   const [loading, setLoading] = useState(false);
@@ -41,7 +39,7 @@ export default function ApprovalInboxPage() {
     try {
       setItems(await customRequest<InboxItem[]>('human-approval/inbox', 'GET'));
     } catch (error: any) {
-      message.error(error?.message ?? 'Failed to load approval tasks');
+      message.error(error?.message ?? '加载审批任务失败');
     } finally {
       setLoading(false);
     }
@@ -64,12 +62,12 @@ export default function ApprovalInboxPage() {
         input,
       );
       message.success(
-        input.decision === 'APPROVE' ? 'Request approved' : 'Request rejected',
+        input.decision === 'APPROVE' ? '已通过审批' : '已拒绝审批',
       );
       setSelected(undefined);
       await load();
     } catch (error: any) {
-      message.error(error?.message ?? 'Decision failed');
+      message.error(error?.message ?? '提交审批结果失败');
     } finally {
       setSubmitting(false);
     }
@@ -78,11 +76,11 @@ export default function ApprovalInboxPage() {
   return (
     <div style={PAGE_WRAPPER_STYLE}>
       <PageHeader
-        title="Approval tasks"
-        subtitle="Requests waiting for your decision"
+        title="审批任务"
+        subtitle="查看并处理等待你决定的任务"
         extra={
           <Button icon={<ReloadOutlined />} loading={loading} onClick={load}>
-            Refresh
+            刷新
           </Button>
         }
       />
@@ -94,42 +92,42 @@ export default function ApprovalInboxPage() {
           loading={loading}
           dataSource={items}
           locale={{
-            emptyText: <Empty description="No approval tasks waiting" />,
+            emptyText: <Empty description="暂无待处理的审批任务" />,
           }}
           columns={[
             {
-              title: 'Request',
+              title: '任务',
               render: (_, item) => (
-                <Space direction="vertical" size={0}>
+                <div style={{ display: 'grid', gap: 4 }}>
                   <Typography.Text strong>
-                    {item.request.nodeId}
-                  </Typography.Text>
-                  <Typography.Text type="secondary">
-                    Workflow run #{item.request.workflowInstanceId}
+                    {item.request.task?.title ?? '审批任务'}
                   </Typography.Text>
-                </Space>
+                  {item.request.task?.description ? (
+                    <Typography.Text type="secondary">
+                      {item.request.task.description}
+                    </Typography.Text>
+                  ) : null}
+                </div>
               ),
             },
             {
-              title: 'Status',
-              render: (_, item) => (
-                <Tag color="gold">{item.request.status}</Tag>
-              ),
+              title: '状态',
+              render: (_, item) => <Tag color="gold">待审批</Tag>,
             },
             {
-              title: 'Started',
+              title: '发起时间',
               render: (_, item) =>
                 new Date(item.request.startedAt).toLocaleString(),
             },
             {
-              title: 'Deadline',
+              title: '截止时间',
               render: (_, item) =>
                 item.request.expiresAt
                   ? new Date(item.request.expiresAt).toLocaleString()
-                  : 'No timeout',
+                  : '不限时',
             },
             {
-              title: 'Action',
+              title: '操作',
               width: 140,
               render: (_, item) => (
                 <Button
@@ -138,7 +136,7 @@ export default function ApprovalInboxPage() {
                   disabled={submitting}
                   onClick={() => setSelected(item)}
                 >
-                  Decide
+                  处理
                 </Button>
               ),
             },
@@ -147,7 +145,7 @@ export default function ApprovalInboxPage() {
       </Card>
       <DecisionModal
         open={Boolean(selected)}
-        requestLabel={selected?.request.nodeId}
+        task={selected?.request.task ?? undefined}
         submitting={submitting}
         onCancel={() => !submitting && setSelected(undefined)}
         onSubmit={decide}

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

@@ -0,0 +1,111 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import i18n from '../../../i18n';
+import { RegisterBusinessEventModal } from './RegisterBusinessEventModal';
+
+const apiMocks = vi.hoisted(() => ({
+  register: vi.fn(),
+  sources: vi.fn(),
+}));
+
+vi.mock('../node-instances/widgets/event-catalog.api', () => ({
+  eventCatalogApi: apiMocks,
+}));
+
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: () => ({
+    matches: false,
+    addListener: () => undefined,
+    removeListener: () => undefined,
+    addEventListener: () => undefined,
+    removeEventListener: () => undefined,
+    dispatchEvent: () => false,
+  }),
+});
+
+describe('RegisterBusinessEventModal', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    apiMocks.register.mockResolvedValue({});
+    apiMocks.sources.mockResolvedValue([
+      {
+        schemaName: 'public',
+        tableName: 't_hardware_asset',
+        columns: [
+          { name: 'id', dataType: 'bigint', nullable: false, primaryKey: true },
+          {
+            name: 'status',
+            dataType: 'character varying(32)',
+            nullable: false,
+            primaryKey: false,
+          },
+        ],
+      },
+    ]);
+  });
+
+  it('registers a PostgreSQL table-field listener', async () => {
+    await i18n.changeLanguage('zh_CN');
+    const onRegistered = vi.fn();
+    render(
+      <RegisterBusinessEventModal
+        open
+        onCancel={vi.fn()}
+        onRegistered={onRegistered}
+      />,
+    );
+
+    fireEvent.mouseDown(await screen.findByLabelText('数据库表'));
+    const sourceOptions = await screen.findAllByText('public.t_hardware_asset');
+    fireEvent.click(sourceOptions[sourceOptions.length - 1]);
+    await waitFor(() =>
+      expect(screen.getByLabelText('监听字段')).not.toBeDisabled(),
+    );
+    fireEvent.mouseDown(screen.getByLabelText('监听字段'));
+    const fieldOptions = await screen.findAllByText(/status/);
+    fireEvent.click(fieldOptions[fieldOptions.length - 1]);
+    fireEvent.click(screen.getByRole('button', { name: '完成登记' }));
+
+    await waitFor(() =>
+      expect(apiMocks.register).toHaveBeenCalledWith({
+        schemaName: 'public',
+        tableName: 't_hardware_asset',
+        operation: 'UPDATE',
+        watchedFields: ['status'],
+      }),
+    );
+    expect(onRegistered).toHaveBeenCalledTimes(1);
+  });
+
+  it('registers INSERT for the whole row without selecting fields', async () => {
+    await i18n.changeLanguage('zh_CN');
+    render(
+      <RegisterBusinessEventModal
+        open
+        onCancel={vi.fn()}
+        onRegistered={vi.fn()}
+      />,
+    );
+
+    fireEvent.mouseDown(await screen.findByLabelText('数据库表'));
+    const sourceOptions = await screen.findAllByText('public.t_hardware_asset');
+    fireEvent.click(sourceOptions[sourceOptions.length - 1]);
+    fireEvent.mouseDown(screen.getByLabelText('数据操作'));
+    const insertOptions = await screen.findAllByText('INSERT');
+    fireEvent.click(insertOptions[insertOptions.length - 1]);
+
+    expect(screen.queryByLabelText('监听字段')).not.toBeInTheDocument();
+    expect(screen.getByText(/任意一行插入或删除时触发/)).toBeInTheDocument();
+    fireEvent.click(screen.getByRole('button', { name: '完成登记' }));
+
+    await waitFor(() =>
+      expect(apiMocks.register).toHaveBeenCalledWith({
+        schemaName: 'public',
+        tableName: 't_hardware_asset',
+        operation: 'INSERT',
+        watchedFields: [],
+      }),
+    );
+  });
+});