@gadmin2n/schematics 0.0.87 → 0.0.89

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/helpers/form.tsx

@@ -279,7 +279,7 @@ function getElement(
         />
       </Form.Item>
     );
-  } else if (fieldType === 'AutoComplete') {
+  } else if ((fieldType as any) === 'AutoComplete') {
     element = (
       <Form.Item {...itemProps}>
         <DynamicAutoComplete

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/locales/en/common.json

@@ -157,8 +157,8 @@
     "editCode": "Edit Code",
     "duplicate": "Duplicate",
     "delete": "Delete",
-    "custom": "Ask AI...",
-    "customAction": "Ask AI...",
+    "custom": "Customize...",
+    "customAction": "Customize...",
     "customPlaceholder": "Describe what you want to do with this component",
     "components": {
       "NumCard": "Metric Card",
@@ -184,7 +184,7 @@
       "inline-right": "Inline Right"
     },
     "dataSource": {
-      "label": "Ask AI to change data source...",
+      "label": "Change data source...",
       "placeholder": "Describe the data, e.g.: revenue comparison over last 30 days"
     },
     "dataSourceModal": {

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/locales/zh_CN/common.json

@@ -159,8 +159,8 @@
     "editCode": "编辑代码",
     "duplicate": "复制",
     "delete": "删除",
-    "custom": "让 AI 修改...",
-    "customAction": "让 AI 修改...",
+    "custom": "自定义...",
+    "customAction": "自定义...",
     "customPlaceholder": "描述你想对这个组件做的修改",
     "components": {
       "NumCard": "数字卡片",
@@ -186,7 +186,7 @@
       "inline-right": "行内右对齐"
     },
     "dataSource": {
-      "label": "让 AI 修改数据来源...",
+      "label": "修改数据来源...",
       "placeholder": "描述要展示的数据，例如：近30天游戏收益对比、各部门人数分布、近90天考勤状态统计"
     },
     "dataSourceModal": {

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/plugins/devShellPlugin.ts

@@ -1,5 +1,6 @@
 import * as fs from 'fs';
 import * as path from 'path';
+import type { IncomingMessage, ServerResponse } from 'http';
 import type { Plugin } from 'vite';
 
 /**
@@ -15,7 +16,9 @@ export function devShellPlugin(): Plugin {
     name: 'dev-shell',
     apply: 'serve',
     configureServer(server) {
-      server.middlewares.use(async (req, res, next) => {
+      server.middlewares.use(async (rawReq, rawRes, next) => {
+        const req = rawReq as IncomingMessage;
+        const res = rawRes as ServerResponse;
         const url = req.url?.split('?')[0] ?? '/';
 
         // POST /canvas-patch — agent 将新组件代码通过 HMR 推送给前端画布

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

@@ -96,6 +96,15 @@ const CanvasEditPage: React.FC = () => {
     }
   }, []);
 
+  // ── 30s 自动保存：有未保存变更时，30 秒后自动调用 handleSave ──
+  useEffect(() => {
+    if (!isDirty) return;
+    const timer = setTimeout(() => {
+      handleSave();
+    }, 30_000);
+    return () => clearTimeout(timer);
+  }, [isDirty, handleSave]);
+
   // ── Back to list ──
   const handleBack = useCallback(() => {
     navigate('/admin/canvas');

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

@@ -1,6 +1,15 @@
 import React, { useState, useEffect, useCallback, useRef } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { Button, message, Tag, Spin, Modal, Input } from 'antd';
+import {
+  Button,
+  Card,
+  message,
+  Tag,
+  Spin,
+  Modal,
+  Input,
+  Typography,
+} from 'antd';
 import { PlusOutlined, DeleteOutlined, EditOutlined } from '@ant-design/icons';
 import {
   fetchCanvases,
@@ -181,166 +190,174 @@ const CanvasListPage: React.FC = () => {
       }}
     >
       {/* Header */}
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          marginBottom: 24,
-        }}
-      >
-        <h2 style={{ margin: 0, fontSize: 20, fontWeight: 600 }}>
-          {t('canvas.list.title')}
-        </h2>
-        <Button type="primary" icon={<PlusOutlined />} onClick={handleCreate}>
-          {t('canvas.list.create')}
-        </Button>
-      </div>
+      <Card style={{ marginBottom: 16 }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+          }}
+        >
+          <Typography.Title level={4} style={{ margin: 0 }}>
+            {t('canvas.list.title')}
+          </Typography.Title>
+          <Button type="primary" icon={<PlusOutlined />} onClick={handleCreate}>
+            {t('canvas.list.create')}
+          </Button>
+        </div>
+      </Card>
 
       {/* Grid */}
-      <div
-        style={{
-          display: 'grid',
-          gridTemplateColumns: 'repeat(3, 1fr)',
-          gap: 20,
-        }}
-      >
-        {canvases.map((canvas) => (
+      <Card>
+        {canvases.length > 0 ? (
           <div
-            key={canvas.id}
             style={{
-              background: '#fff',
-              borderRadius: 8,
-              overflow: 'hidden',
-              border: '1px solid #e5e5e5',
-              cursor: 'pointer',
-              transition: 'box-shadow 0.2s',
-            }}
-            onMouseEnter={(e) => {
-              (e.currentTarget as HTMLDivElement).style.boxShadow =
-                '0 4px 12px rgba(0,0,0,0.1)';
+              display: 'grid',
+              gridTemplateColumns: 'repeat(3, 1fr)',
+              gap: 20,
             }}
-            onMouseLeave={(e) => {
-              (e.currentTarget as HTMLDivElement).style.boxShadow = 'none';
-            }}
-            onClick={() => navigate(`/admin/canvas/edit/${canvas.id}`)}
           >
-            {/* Thumbnail */}
-            <div
-              style={{
-                height: 180,
-                overflow: 'hidden',
-                background: '#f0f0f0',
-                position: 'relative',
-                pointerEvents: 'none',
-              }}
-            >
-              {canvas.items.length > 0 ? (
-                <div
-                  style={{
-                    transform: 'scale(0.28)',
-                    transformOrigin: 'top left',
-                    width: 1200,
-                    height: 640,
-                  }}
-                >
-                  <IsolatedLivePreview code={buildPreviewCode(canvas)} />
-                </div>
-              ) : (
+            {canvases.map((canvas) => (
+              <div
+                key={canvas.id}
+                style={{
+                  background: '#fff',
+                  borderRadius: 8,
+                  overflow: 'hidden',
+                  border: '1px solid #e5e5e5',
+                  cursor: 'pointer',
+                  transition: 'box-shadow 0.2s',
+                }}
+                onMouseEnter={(e) => {
+                  (e.currentTarget as HTMLDivElement).style.boxShadow =
+                    '0 4px 12px rgba(0,0,0,0.1)';
+                }}
+                onMouseLeave={(e) => {
+                  (e.currentTarget as HTMLDivElement).style.boxShadow = 'none';
+                }}
+                onClick={() => navigate(`/admin/canvas/edit/${canvas.id}`)}
+              >
+                {/* Thumbnail */}
                 <div
                   style={{
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    height: '100%',
-                    color: '#bbb',
-                    fontSize: 14,
+                    height: 180,
+                    overflow: 'hidden',
+                    background: '#f0f0f0',
+                    position: 'relative',
+                    pointerEvents: 'none',
                   }}
                 >
-                  空画布
+                  {canvas.items.length > 0 ? (
+                    <div
+                      style={{
+                        transform: 'scale(0.28)',
+                        transformOrigin: 'top left',
+                        width: 1200,
+                        height: 640,
+                      }}
+                    >
+                      <IsolatedLivePreview code={buildPreviewCode(canvas)} />
+                    </div>
+                  ) : (
+                    <div
+                      style={{
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        height: '100%',
+                        color: '#bbb',
+                        fontSize: 14,
+                      }}
+                    >
+                      空画布
+                    </div>
+                  )}
                 </div>
-              )}
-            </div>
 
-            {/* Info */}
-            <div
-              style={{ padding: '12px 16px', borderTop: '1px solid #f0f0f0' }}
-            >
-              <div
-                style={{
-                  display: 'flex',
-                  justifyContent: 'space-between',
-                  alignItems: 'center',
-                  marginBottom: 8,
-                }}
-              >
-                <span
+                {/* Info */}
+                <div
                   style={{
-                    fontWeight: 500,
-                    fontSize: 14,
-                    overflow: 'hidden',
-                    textOverflow: 'ellipsis',
-                    whiteSpace: 'nowrap',
-                    maxWidth: 160,
+                    padding: '12px 16px',
+                    borderTop: '1px solid #f0f0f0',
                   }}
                 >
-                  {canvas.name}
-                </span>
-                <Tag color={canvas.publishedPageCode ? 'green' : 'default'}>
-                  {canvas.publishedPageCode
-                    ? t('canvas.list.published')
-                    : t('canvas.list.unpublished')}
-                </Tag>
-              </div>
-              <div
-                style={{
-                  display: 'flex',
-                  justifyContent: 'space-between',
-                  alignItems: 'center',
-                }}
-              >
-                <span style={{ fontSize: 12, color: '#999' }}>
-                  修改于 {new Date(canvas.updatedAt).toLocaleString('zh-CN')}
-                </span>
-                <div style={{ display: 'flex', gap: 4 }}>
-                  <Button
-                    type="text"
-                    size="small"
-                    icon={<EditOutlined />}
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      openRename(canvas);
+                  <div
+                    style={{
+                      display: 'flex',
+                      justifyContent: 'space-between',
+                      alignItems: 'center',
+                      marginBottom: 8,
                     }}
-                    style={{ fontSize: 12, color: '#666' }}
                   >
-                    {t('canvas.list.rename')}
-                  </Button>
-                  <Button
-                    type="text"
-                    size="small"
-                    danger
-                    icon={<DeleteOutlined />}
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      setDeleteConfirm(canvas);
+                    <span
+                      style={{
+                        fontWeight: 500,
+                        fontSize: 14,
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                        maxWidth: 160,
+                      }}
+                    >
+                      {canvas.name}
+                    </span>
+                    <Tag color={canvas.publishedPageCode ? 'green' : 'default'}>
+                      {canvas.publishedPageCode
+                        ? t('canvas.list.published')
+                        : t('canvas.list.unpublished')}
+                    </Tag>
+                  </div>
+                  <div
+                    style={{
+                      display: 'flex',
+                      justifyContent: 'space-between',
+                      alignItems: 'center',
                     }}
-                    style={{ fontSize: 12 }}
                   >
-                    {t('canvas.list.deleteBtn')}
-                  </Button>
+                    <span style={{ fontSize: 12, color: '#999' }}>
+                      修改于{' '}
+                      {new Date(canvas.updatedAt).toLocaleString('zh-CN')}
+                    </span>
+                    <div style={{ display: 'flex', gap: 4 }}>
+                      <Button
+                        type="text"
+                        size="small"
+                        icon={<EditOutlined />}
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          openRename(canvas);
+                        }}
+                        style={{ fontSize: 12, color: '#666' }}
+                      >
+                        {t('canvas.list.rename')}
+                      </Button>
+                      <Button
+                        type="text"
+                        size="small"
+                        danger
+                        icon={<DeleteOutlined />}
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          setDeleteConfirm(canvas);
+                        }}
+                        style={{ fontSize: 12 }}
+                      >
+                        {t('canvas.list.deleteBtn')}
+                      </Button>
+                    </div>
+                  </div>
                 </div>
               </div>
-            </div>
+            ))}
           </div>
-        ))}
-      </div>
-
-      {/* Empty state */}
-      {canvases.length === 0 && (
-        <div style={{ textAlign: 'center', color: '#999', marginTop: 80 }}>
-          <p>还没有 Canvas，点击上方按钮新建一个吧</p>
-        </div>
-      )}
+        ) : (
+          <div
+            style={{ textAlign: 'center', color: '#999', padding: '80px 0' }}
+          >
+            <p>还没有 Canvas，点击上方按钮新建一个吧</p>
+          </div>
+        )}
+      </Card>
 
       {/* 重命名 Modal */}
       <Modal

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

@@ -53,6 +53,13 @@ const COLS = 48;
 const ROW_HEIGHT = 10;
 const MARGIN_Y = 8;
 
+/** 组件库类型 → 画布实际 componentType 映射 */
+const COMPONENT_TYPE_MAP: Record<string, string> = {
+  BarChart: 'MultiChart',
+  LineChart: 'MultiChart',
+  PieChart: 'MultiChart',
+};
+
 // ─── Helpers ─────────────────────────────────────────────────────────────────
 
 /** Compute the pixel height a component should fill given a grid row count. */
@@ -234,10 +241,12 @@ const CanvasPage: React.FC<CanvasPageProps> = ({
     const id = genId();
     const maxY = layout.reduce((m, l) => Math.max(m, l.y + l.h), 0);
     const h = def.layout.h;
+    // 映射实际 componentType（BarChart/LineChart/PieChart → MultiChart）
+    const actualType = COMPONENT_TYPE_MAP[type] ?? type;
     onBothChange(
       [
         ...items,
-        { id, componentType: type, code: syncCodeHeight(def.code, h) },
+        { id, componentType: actualType, code: syncCodeHeight(def.code, h) },
       ],
       [
         ...layout,
@@ -412,10 +421,13 @@ const CanvasPage: React.FC<CanvasPageProps> = ({
           )
         : def.code;
 
+      // 映射实际 componentType（BarChart/LineChart/PieChart → MultiChart）
+      const actualType = COMPONENT_TYPE_MAP[type] ?? type;
+
       onBothChange(
         [
           ...items,
-          { id, componentType: type, code: syncCodeHeight(baseCode, h) },
+          { id, componentType: actualType, code: syncCodeHeight(baseCode, h) },
         ],
         [
           ...cleanLayout,

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

@@ -55,6 +55,8 @@ const CanvasToolbar: React.FC<CanvasToolbarProps> = ({
         borderBottom: '1px solid #eaeaea',
         flexShrink: 0,
         boxShadow: '0 1px 8px rgba(0,0,0,0.04)',
+        borderRadius: 8,
+        overflow: 'hidden',
       }}
     >
       {/* ── Header row ── */}
@@ -216,6 +218,66 @@ const CanvasToolbar: React.FC<CanvasToolbarProps> = ({
           const def = CANVAS_DEFAULTS[type];
           const variants = def?.variants ?? [];
 
+          // ── 单 variant：thumbnail 直接可拖拽，跳过 Popover ──
+          if (variants.length === 1) {
+            return (
+              <div
+                key={type}
+                draggable
+                onDragStart={(e) =>
+                  handleVariantDragStart(e, type, variants[0].code)
+                }
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  alignItems: 'center',
+                  gap: 8,
+                  cursor: 'grab',
+                  userSelect: 'none',
+                  flexShrink: 0,
+                  width: 140,
+                }}
+              >
+                <div
+                  style={{
+                    border: '1px solid #eaeaea',
+                    borderRadius: 10,
+                    overflow: 'hidden',
+                    background: '#fff',
+                    transition: 'all 200ms cubic-bezier(0.4, 0, 0.2, 1)',
+                  }}
+                  onMouseEnter={(e) => {
+                    const el = e.currentTarget;
+                    el.style.borderColor = '#4361ee';
+                    el.style.boxShadow = '0 4px 16px rgba(67,97,238,0.12)';
+                    el.style.transform = 'translateY(-3px) scale(1.03)';
+                  }}
+                  onMouseLeave={(e) => {
+                    const el = e.currentTarget;
+                    el.style.borderColor = '#eaeaea';
+                    el.style.boxShadow = 'none';
+                    el.style.transform = 'translateY(0) scale(1)';
+                  }}
+                >
+                  <ComponentThumbnail componentType={type} width={140} />
+                </div>
+                <span
+                  style={{
+                    fontSize: 11,
+                    color: '#888',
+                    fontWeight: 500,
+                    letterSpacing: '0.3px',
+                    textAlign: 'center',
+                    pointerEvents: 'none',
+                  }}
+                >
+                  {getComponentLabel(type, t)}
+                </span>
+              </div>
+            );
+          }
+
+          // ── 多 variant：保持 Popover hover 展开 ──
           const popoverContent = (
             <div
               style={{

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

@@ -3,6 +3,7 @@ import { Modal, Form, Input, TreeSelect, message } from 'antd';
 import type { SavedCanvas } from './types';
 import { publishCanvas } from './canvasApi';
 import { useTranslation } from 'react-i18next';
+import { customRequest } from 'helpers/http';
 
 interface RawPage {
   id: number;
@@ -80,13 +81,10 @@ const PublishModal: React.FC<PublishModalProps> = ({
   useEffect(() => {
     if (!open) return;
     setPagesLoading(true);
-    fetch('/api/page/findMany', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      credentials: 'include',
-      body: JSON.stringify({ where: {}, orderBy: { sortOrder: 'asc' } }),
+    customRequest<{ data: RawPage[] }>('page/findMany', 'POST', {
+      where: {},
+      orderBy: { sortOrder: 'asc' },
     })
-      .then((r) => r.json())
       .then((data) => {
         const pages: RawPage[] = data?.data ?? [];
         setTreeData(buildTree(pages, t('canvas.publishModal.rootPage')));

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/canvas/canvasApi.ts

@@ -1,7 +1,6 @@
 import type { SavedCanvas, CanvasItem } from './types';
 import type { LayoutItem } from 'react-grid-layout';
-
-const BASE = '/api/canvas';
+import { customRequest } from 'helpers/http';
 
 // 服务端返回的 Canvas 形状（createdAt 是 ISO 字符串）
 interface CanvasRecord {
@@ -29,31 +28,25 @@ function toSavedCanvas(r: CanvasRecord): SavedCanvas {
   };
 }
 
-async function request<T>(url: string, init?: RequestInit): Promise<T> {
-  const res = await fetch(url, {
-    headers: { 'Content-Type': 'application/json' },
-    credentials: 'include',
-    ...init,
-  });
-  if (!res.ok) throw new Error(`Canvas API error: ${res.status}`);
-  return res.json() as Promise<T>;
-}
-
 export async function fetchCanvases(): Promise<SavedCanvas[]> {
-  const records = await request<CanvasRecord[]>(BASE);
+  const records = await customRequest<CanvasRecord[]>('canvas', 'GET');
   return records.map(toSavedCanvas);
 }
 
 export async function fetchCanvas(id: string): Promise<SavedCanvas | null> {
-  const record = await request<CanvasRecord | null>(`${BASE}/${id}`);
+  const record = await customRequest<CanvasRecord | null>(
+    `canvas/${id}`,
+    'GET',
+  );
   if (!record) return null;
   return toSavedCanvas(record);
 }
 
 export async function createCanvas(name: string): Promise<SavedCanvas> {
-  const record = await request<CanvasRecord>(BASE, {
-    method: 'POST',
-    body: JSON.stringify({ name, items: [], layout: [] }),
+  const record = await customRequest<CanvasRecord>('canvas', 'POST', {
+    name,
+    items: [],
+    layout: [],
   });
   return toSavedCanvas(record);
 }
@@ -67,26 +60,24 @@ export async function updateCanvas(
     >
   >,
 ): Promise<void> {
-  await request(`${BASE}/${id}`, {
-    method: 'PUT',
-    body: JSON.stringify(patch),
-  });
+  await customRequest(`canvas/${id}`, 'PUT', patch);
 }
 
 export async function deleteCanvas(id: string): Promise<void> {
-  await request(`${BASE}/${id}`, { method: 'DELETE' });
+  await customRequest(`canvas/${id}`, 'DELETE');
 }
 
 export async function publishCanvas(
   id: string,
   dto: { slug: string; pageName: string; parentPageCode?: string },
 ): Promise<{ success: boolean; pageCode: string }> {
-  return request(`${BASE}/${id}/publish`, {
-    method: 'POST',
-    body: JSON.stringify(dto),
-  });
+  return customRequest<{ success: boolean; pageCode: string }>(
+    `canvas/${id}/publish`,
+    'POST',
+    dto,
+  );
 }
 
 export async function unpublishCanvas(id: string): Promise<void> {
-  await request(`${BASE}/${id}/unpublish`, { method: 'DELETE' });
+  await customRequest(`canvas/${id}/unpublish`, 'DELETE');
 }