@gadmin2n/schematics 0.0.68 → 0.0.70

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/config/routeRegistry.tsx

@@ -1,7 +1,7 @@
-import React, { lazy, Suspense } from "react";
-import { Outlet, Route } from "react-router-dom";
-import { Spin } from "antd";
-import generatedResources from "generated/resources";
+import React, { lazy, Suspense } from 'react';
+import { Outlet, Route } from 'react-router-dom';
+import { Spin } from 'antd';
+import generatedResources from 'generated/resources';
 
 // ─── Types ───────────────────────────────────────────────────────────────────
 
@@ -15,6 +15,13 @@ interface RouteEntry {
   wrapper?: LazyComp | AnyComp;
   index?: boolean;
   children?: Record<string, RouteEntry>;
+  /**
+   * Programmatic-only — never hand-written.
+   * Set automatically by buildDataMngtChildren (res.name) or derived via
+   * extractSourceDir() from the component's import string at index-build time.
+   * Identifies the routes/ subdirectory that owns this route group.
+   */
+  _sourceDir?: string;
 }
 
 // ─── Data-Mngt dynamic route helpers ─────────────────────────────────────────
@@ -24,12 +31,19 @@ interface RouteEntry {
  * These must NOT be auto-registered again under dataMngt.
  */
 const SYSTEM_RESOURCE_NAMES = new Set([
-  "user", "role", "page", "resource", "audit",
-  "game", "roleResource", "pageResource", "rolePages",
+  'user',
+  'role',
+  'page',
+  'resource',
+  'audit',
+  'game',
+  'roleResource',
+  'pageResource',
+  'rolePages',
 ]);
 
 /** camelCase → PascalCase  (reverses toCamelCase in seedDataMngtPages) */
-function toPascalCase(str: string): string {
+export function toPascalCase(str: string): string {
   return str.charAt(0).toUpperCase() + str.slice(1);
 }
 
@@ -41,8 +55,8 @@ function toPascalCase(str: string): string {
  */
 function toKebabCase(str: string): string {
   return str
-    .replace(/([a-z0-9])([A-Z])/g, "$1-$2")
-    .replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2")
+    .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
+    .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
     .toLowerCase();
 }
 
@@ -65,8 +79,12 @@ function buildDataMngtChildren(): Record<string, RouteEntry> {
     if (SYSTEM_RESOURCE_NAMES.has(res.name)) continue;
 
     // generated/resources stores components in meta.components
-    const { list: ListComp, show: ShowComp, edit: EditComp, create: CreateComp } =
-      (res.meta as any).components ?? {};
+    const {
+      list: ListComp,
+      show: ShowComp,
+      edit: EditComp,
+      create: CreateComp,
+    } = (res.meta as any).components ?? {};
 
     if (!ListComp) continue;
 
@@ -76,13 +94,15 @@ function buildDataMngtChildren(): Record<string, RouteEntry> {
 
     children[res.name] = {
       path: slug,
+      _sourceDir: res.name, // directory name == resource name for dataMngt routes
       // No component on the parent — React Router renders <Outlet /> so that
       // the index / show / edit / create children can each occupy the full view.
       children: {
-        list:   { path: "",          index: true, component: ListComp   as AnyComp },
-        show:   { path: "show/:id",               component: ShowComp   as AnyComp },
-        edit:   { path: "edit/:id",               component: EditComp   as AnyComp },
-        create: { path: "create",                 component: CreateComp as AnyComp },
+        list: { path: '', index: true, component: ListComp as AnyComp },
+        show: { path: 'show/:id', component: ShowComp as AnyComp },
+        edit: { path: 'edit/:id', component: EditComp as AnyComp },
+        create: { path: 'create', component: CreateComp as AnyComp },
+        clone: { path: 'clone/:id', component: CreateComp as AnyComp },
       },
     };
   }
@@ -90,7 +110,50 @@ function buildDataMngtChildren(): Record<string, RouteEntry> {
   return children;
 }
 
-// ─── Suspense wrapper ────────────────────────────────────────────────────────
+/**
+ * Extract the routes/ subdirectory name from a lazy component's import string.
+ *
+ * Works by calling toString() on the factory function — in both dev (Vite
+ * module-graph) and build (Rollup) modes the original import specifier is
+ * preserved in the stringified source.
+ *
+ * Examples:
+ *   import("routes/user")          → "user"
+ *   import("routes/iTActivityDay") → "iTActivityDay"
+ *   import("routes/page/list")     → "page"   (strip trailing page-type segment)
+ *
+ * Returns null when the string cannot be parsed (safe fallback).
+ */
+function extractSourceDir(
+  component: LazyComp | AnyComp | undefined,
+): string | null {
+  if (!component) return null;
+  try {
+    // React.lazy stores the factory in _payload._result before the promise
+    // resolves. Stringify it to find the original import() specifier.
+    const c = component as any;
+    const factory: unknown = c._payload?._result;
+    const src =
+      typeof factory === 'function'
+        ? (factory as () => unknown).toString()
+        : typeof component === 'function'
+          ? (component as () => unknown).toString()
+          : '';
+
+    const match = src.match(/import\(["'`]routes\/([^"'`]+)["'`]\)/);
+    if (!match) return null;
+
+    // Strip trailing page-type segments: list, create, edit, show, index
+    const parts = match[1].split('/');
+    const PAGE_TYPES = new Set(['list', 'create', 'edit', 'show', 'index']);
+    while (parts.length > 1 && PAGE_TYPES.has(parts[parts.length - 1])) {
+      parts.pop();
+    }
+    return parts.join('/') || null;
+  } catch {
+    return null;
+  }
+}
 
 const S = ({ children }: { children: React.ReactNode }) => (
   <Suspense fallback={<Spin size="large" />}>{children}</Suspense>
@@ -101,50 +164,50 @@ const S = ({ children }: { children: React.ReactNode }) => (
 export const routeRegistry: Record<string, RouteEntry> = {
   // ── Administration ─────────────────────────────────────────────────────────
   admin: {
-    path: "/admin",
+    path: '/admin',
     children: {
       permission: {
-        path: "permission",
+        path: 'permission',
         children: {
           // 菜单指引 — sortOrder 1020, code: admin.permission.readme
           permission_readme: {
-            path: "readme",
+            path: 'readme',
             component: lazy(() =>
-              import("routes/permissionReadme").then((m) => ({
+              import('routes/permissionReadme').then((m) => ({
                 default: m.PermissionReadmePage,
               })),
             ),
           },
           // 用户管理 — sortOrder 1030, code: admin.permission.user
           user: {
-            path: "user",
+            path: 'user',
             component: lazy(() =>
-              import("routes/user").then((m) => ({ default: m.UserListPage })),
+              import('routes/user').then((m) => ({ default: m.UserListPage })),
             ),
           },
           // 角色管理 — sortOrder 1040, code: admin.permission.role
           role: {
-            path: "role-list",
+            path: 'role-list',
             component: lazy(() =>
-              import("routes/role").then((m) => ({
+              import('routes/role').then((m) => ({
                 default: m.RoleManagementListPage,
               })),
             ),
           },
           // 页面管理 — sortOrder 1050, code: admin.permission.page
           page: {
-            path: "page-list",
+            path: 'page-list',
             component: lazy(() =>
-              import("routes/page/list").then((m) => ({
+              import('routes/page/list').then((m) => ({
                 default: m.PageManagementListPage,
               })),
             ),
           },
           // 资源管理 — sortOrder 1060, code: admin.permission.resource
           resource: {
-            path: "resource-list",
+            path: 'resource-list',
             component: lazy(() =>
-              import("routes/resource").then((m) => ({
+              import('routes/resource').then((m) => ({
                 default: m.ResourceManagementListPage,
               })),
             ),
@@ -152,61 +215,168 @@ export const routeRegistry: Record<string, RouteEntry> = {
         },
       },
       dataMngt: {
-        path: "data-mngt",
+        path: 'data-mngt',
         children: buildDataMngtChildren(),
       },
+      // Canvas
+      canvas: {
+        path: 'canvas',
+        children: {
+          list: {
+            path: '',
+            index: true,
+            component: lazy(() =>
+              import('routes/canvas').then((m) => ({
+                default: m.CanvasListPage,
+              })),
+            ),
+          },
+          edit: {
+            path: 'edit/:id',
+            component: lazy(() =>
+              import('routes/canvas').then((m) => ({
+                default: m.CanvasEditPage,
+              })),
+            ),
+          },
+        },
+      },
+      // Canvas published pages (dynamic, DB-driven)
+      'canvas-page': {
+        path: 'p/:slug',
+        component: lazy(() => import('routes/canvas-page')),
+      },
       game: {
-        path: "game-list",
+        path: 'game-list',
         children: {
-          list:   { path: "",          index: true, component: lazy(() => import("routes/game").then((m) => ({ default: m.GameList   }))) },
-          show:   { path: "show/:id",               component: lazy(() => import("routes/game").then((m) => ({ default: m.GameShow   }))) },
-          edit:   { path: "edit/:id",               component: lazy(() => import("routes/game").then((m) => ({ default: m.GameEdit   }))) },
-          create: { path: "create",                 component: lazy(() => import("routes/game").then((m) => ({ default: m.GameCreate }))) },
+          list: {
+            path: '',
+            index: true,
+            component: lazy(() =>
+              import('routes/game').then((m) => ({ default: m.GameList })),
+            ),
+          },
+          show: {
+            path: 'show/:id',
+            component: lazy(() =>
+              import('routes/game').then((m) => ({ default: m.GameShow })),
+            ),
+          },
+          edit: {
+            path: 'edit/:id',
+            component: lazy(() =>
+              import('routes/game').then((m) => ({ default: m.GameEdit })),
+            ),
+          },
+          create: {
+            path: 'create',
+            component: lazy(() =>
+              import('routes/game').then((m) => ({ default: m.GameCreate })),
+            ),
+          },
         },
       },
       // 操作日志 — sortOrder 1070, code: admin.audit
       audits: {
-        path: "audit-log-list",
+        path: 'audit-log-list',
         component: lazy(() =>
-          import("routes/audit").then((m) => ({ default: m.AuditLogPage })),
+          import('routes/audit').then((m) => ({ default: m.AuditLogPage })),
         ),
       },
     },
   },
 };
 
-// ─── Path Index (getRoutePath) ────────────────────────────────────────────────
+// ─── Path + SourceDir indices ─────────────────────────────────────────────────
 
-function buildPathIndex(
+/**
+ * Walk the registry tree once and produce two flat maps:
+ *
+ * pathIndex      : routeKey → absolute URL path  (e.g. "user" → "/admin/permission/user")
+ * sourceDirIndex : URL pattern → routes/ dir     (e.g. "/admin/permission/user" → "user")
+ *
+ * URL patterns in sourceDirIndex use ":id" for dynamic segments so they can
+ * be matched against live pathnames after replacing numeric/uuid segments.
+ */
+function buildIndices(
   entries: Record<string, RouteEntry>,
-  parentPath = "",
-): Record<string, string> {
-  const result: Record<string, string> = {};
+  parentPath = '',
+  inheritedSourceDir: string | null = null,
+): {
+  pathIndex: Record<string, string>;
+  sourceDirIndex: Record<string, string>;
+} {
+  const pathIndex: Record<string, string> = {};
+  const sourceDirIndex: Record<string, string> = {};
+
   for (const [key, entry] of Object.entries(entries)) {
-    const fullPath = entry.path.startsWith("/")
+    const fullPath = entry.path.startsWith('/')
       ? entry.path
-      : entry.path === ""
+      : entry.path === ''
         ? parentPath
-        : entry.path.startsWith("?")
+        : entry.path.startsWith('?')
           ? parentPath + entry.path
-          : parentPath + "/" + entry.path;
-    result[key] = fullPath;
+          : parentPath + '/' + entry.path;
+
+    pathIndex[key] = fullPath;
+
+    // Resolve sourceDir for this entry:
+    // Priority: explicit _sourceDir > extracted from component > inherited from parent
+    const resolved =
+      entry._sourceDir ??
+      extractSourceDir(entry.component) ??
+      inheritedSourceDir;
+
+    // Register in sourceDirIndex when we have both a real path and a sourceDir.
+    // Use the path without query-string, with dynamic segments normalised to ":id".
+    if (resolved) {
+      const pattern = fullPath.split('?')[0];
+      sourceDirIndex[pattern] = resolved;
+    }
+
     if (entry.children) {
-      Object.assign(result, buildPathIndex(entry.children, fullPath.split("?")[0]));
+      const sub = buildIndices(
+        entry.children,
+        fullPath.split('?')[0],
+        resolved,
+      );
+      Object.assign(pathIndex, sub.pathIndex);
+      Object.assign(sourceDirIndex, sub.sourceDirIndex);
     }
   }
-  return result;
+
+  return { pathIndex, sourceDirIndex };
 }
 
-const pathIndex = buildPathIndex(routeRegistry);
+const { pathIndex, sourceDirIndex } = buildIndices(routeRegistry);
 
 export function getRoutePath(pageCode: string): string | null {
   return pathIndex[pageCode] ?? null;
 }
 
+/**
+ * Given a live pathname (e.g. "/admin/permission/user" or "/admin/game-list/edit/123"),
+ * return the routes/ subdirectory that owns it (e.g. "user", "game").
+ *
+ * Matching strategy: replace trailing numeric / uuid-like segments with ":id"
+ * so the live URL aligns with the pattern stored during index build.
+ */
+export function getRouteSourceDir(pathname: string): string | null {
+  // Normalise: strip trailing slash, replace numeric/uuid segments with :id
+  const normalised = pathname
+    .replace(/\/$/, '')
+    .replace(/\/[0-9a-f]{8}-[0-9a-f-]{27,35}/gi, '/:id') // uuid
+    .replace(/\/\d+/g, '/:id'); // numeric id
+
+  return sourceDirIndex[normalised] ?? null;
+}
+
 // ─── renderRoutes() ──────────────────────────────────────────────────────────
 
-function renderEntry(key: string, entry: RouteEntry): React.ReactElement | null {
+function renderEntry(
+  key: string,
+  entry: RouteEntry,
+): React.ReactElement | null {
   let element: React.ReactNode | undefined;
   if (entry.component) {
     const Comp = entry.component;
@@ -230,7 +400,7 @@ function renderEntry(key: string, entry: RouteEntry): React.ReactElement | null
     return <Route key={key} index element={element ?? null} />;
   }
 
-  const routePath = entry.path.split("?")[0];
+  const routePath = entry.path.split('?')[0];
 
   const childRoutes = Object.entries(entry.children ?? {})
     .map(([k, e]) => renderEntry(k, e))

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/constants/layout.ts

@@ -1,14 +1,14 @@
 /** List / Create 页面顶层组件的内容区样式 */
 export const LIST_CONTENT_PROPS = {
-  style: { marginTop: "1rem" },
+  style: { marginTop: '1rem' },
 } as const;
 
 /** Show 页面顶层组件的内容区样式 */
 export const SHOW_CONTENT_PROPS = {
   style: {
-    backgroundColor: "#f5f5f5",
+    backgroundColor: '#f5f5f5',
     padding: 0,
-    marginTop: "1rem",
+    marginTop: '1rem',
   },
   bodyStyle: {
     padding: 0,

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/dev-shell/AddDataModal.tsx

@@ -0,0 +1,199 @@
+import React, { useState } from 'react';
+
+interface Props {
+  onConfirm: (prompt: string) => void;
+  onCancel: () => void;
+}
+
+const GUIDED_QUESTIONS = [
+  {
+    key: 'purpose',
+    label: '1️⃣ 这个表是用来做什么的？',
+    placeholder: '比如：记录订单 / 管理客户 / 记录库存',
+    type: 'input',
+    optional: false,
+  },
+  {
+    key: 'fields',
+    label: '2️⃣ 你会往里面"填写"哪些信息？',
+    placeholder: '比如：姓名、电话、金额、时间…',
+    type: 'textarea',
+    optional: false,
+  },
+  {
+    key: 'statuses',
+    label: '3️⃣ 有没有"固定的几种状态"？',
+    placeholder: '比如：订单有 未支付 / 已支付 / 已取消',
+    type: 'input',
+    optional: true,
+  },
+  {
+    key: 'relations',
+    label: '4️⃣ 这个数据和谁有关？',
+    placeholder: '比如：订单属于某个用户？一个用户有多个订单？',
+    type: 'input',
+    optional: true,
+  },
+  {
+    key: 'queries',
+    label: '5️⃣ 你平时会怎么查这些数据？',
+    placeholder: '比如：按用户名查、按时间查、看最近的记录',
+    type: 'input',
+    optional: true,
+  },
+  {
+    key: 'scale',
+    label: '6️⃣ 大概会有多少数据？',
+    placeholder: '比如：每天几十条 / 每天几万条',
+    type: 'input',
+    optional: true,
+  },
+  {
+    key: 'special',
+    label: '7️⃣ 有没有特殊要求？',
+    placeholder: '比如：可以删除吗？要不要保留历史记录？',
+    type: 'textarea',
+    optional: true,
+  },
+];
+
+export default function AddDataModal({ onConfirm, onCancel }: Props) {
+  const [activeTab, setActiveTab] = useState<'free' | 'guided'>('free');
+  const [freeText, setFreeText] = useState('');
+  const [answers, setAnswers] = useState<Record<string, string>>({});
+
+  function handleConfirm() {
+    if (activeTab === 'free') {
+      const text = freeText.trim();
+      if (!text) {
+        alert('请输入数据描述');
+        return;
+      }
+      onConfirm(
+        '请帮我使用 prisma-schema-update skill 添加一个新的prisma model。\n\n以下是关于这个业务数据的描述：\n' +
+          text,
+      );
+    } else {
+      if (!answers.purpose?.trim()) {
+        alert('请至少填写"这个表是用来做什么的"');
+        return;
+      }
+      const lines = [
+        '请帮我使用 prisma-schema-update skill 添加一个新的prisma model。\n\n以下是我对这个业务数据的描述：\n',
+      ];
+      GUIDED_QUESTIONS.forEach((q) => {
+        if (answers[q.key]?.trim()) {
+          lines.push(
+            q.label.replace(/（可选）/g, '').trim() +
+              '\n' +
+              answers[q.key].trim(),
+          );
+        }
+      });
+      onConfirm(lines.join('\n\n'));
+    }
+  }
+
+  return (
+    <div
+      id="add-data-modal-overlay"
+      onClick={(e) => {
+        if (e.target === e.currentTarget) onCancel();
+      }}
+    >
+      <div id="add-data-modal-card">
+        <div className="add-data-modal-header">
+          <h3>🗄️ 添加新的业务数据</h3>
+          <button className="add-data-modal-close" onClick={onCancel}>
+            ×
+          </button>
+        </div>
+
+        <div className="add-data-modal-tabs">
+          {(['free', 'guided'] as const).map((tab) => (
+            <button
+              key={tab}
+              className={
+                'add-data-modal-tab' + (activeTab === tab ? ' active' : '')
+              }
+              onClick={() => setActiveTab(tab)}
+            >
+              {tab === 'free' ? '自由描述' : '引导式填写'}
+            </button>
+          ))}
+        </div>
+
+        <div className="add-data-modal-body">
+          {activeTab === 'free' && (
+            <div className="add-data-tab-panel active">
+              <p className="add-data-hint">
+                用日常语言描述你想要的数据表，你也可以使用其他AI工具帮你生成更详细的需求，然后再输入到这边。
+              </p>
+              <textarea
+                className="add-data-free-textarea"
+                value={freeText}
+                onChange={(e) => setFreeText(e.target.value)}
+                placeholder={
+                  '我要一个订单表：\n- 用户可以下多个订单\n- 支持支付状态\n- 要能查用户订单列表\n- 未来可能有退款'
+                }
+              />
+            </div>
+          )}
+          {activeTab === 'guided' && (
+            <div className="add-data-tab-panel active">
+              <p className="add-data-hint">
+                我们来一起设计一个数据表 😊 用日常语言回答下面几个问题：
+              </p>
+              {GUIDED_QUESTIONS.map((q) => (
+                <div className="guided-question" key={q.key}>
+                  <label className="guided-question-label">
+                    {q.label}
+                    {q.optional && (
+                      <span className="guided-optional-tag">（可选）</span>
+                    )}
+                  </label>
+                  {q.type === 'textarea' ? (
+                    <textarea
+                      className="guided-question-textarea"
+                      placeholder={q.placeholder}
+                      rows={2}
+                      value={answers[q.key] || ''}
+                      onChange={(e) =>
+                        setAnswers((prev) => ({
+                          ...prev,
+                          [q.key]: e.target.value,
+                        }))
+                      }
+                    />
+                  ) : (
+                    <input
+                      className="guided-question-input"
+                      type="text"
+                      placeholder={q.placeholder}
+                      value={answers[q.key] || ''}
+                      onChange={(e) =>
+                        setAnswers((prev) => ({
+                          ...prev,
+                          [q.key]: e.target.value,
+                        }))
+                      }
+                    />
+                  )}
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        <div className="add-data-modal-footer">
+          <button className="add-data-btn-cancel" onClick={onCancel}>
+            取消
+          </button>
+          <button className="add-data-btn-confirm" onClick={handleConfirm}>
+            确认，开始生成
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}