@gadmin2n/schematics 0.0.69 → 0.0.71

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

@@ -0,0 +1,428 @@
+import React, { lazy, Suspense } from 'react';
+import { Outlet, Route } from 'react-router-dom';
+import { Spin } from 'antd';
+import generatedResources from 'generated/resources';
+
+// ─── Types ───────────────────────────────────────────────────────────────────
+
+type LazyComp = React.LazyExoticComponent<React.ComponentType<any>>;
+// Allow both lazy and eagerly-imported components (generated/resources uses the latter)
+type AnyComp = React.ComponentType<any>;
+
+interface RouteEntry {
+  path: string;
+  component?: LazyComp | AnyComp;
+  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 ─────────────────────────────────────────
+
+/**
+ * Resource names already covered by the static registry entries below.
+ * These must NOT be auto-registered again under dataMngt.
+ */
+const SYSTEM_RESOURCE_NAMES = new Set([
+  'user',
+  'role',
+  'page',
+  'resource',
+  'audit',
+  'game',
+  'roleResource',
+  'pageResource',
+  'rolePages',
+]);
+
+/** camelCase → PascalCase  (reverses toCamelCase in seedDataMngtPages) */
+export function toPascalCase(str: string): string {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+/**
+ * PascalCase → kebab-case  (same algorithm as seedDataMngtPages.ts so the
+ * generated route path always matches the page.path stored in the DB).
+ *   "Event"         → "event"
+ *   "ITActivityDay" → "it-activity-day"
+ */
+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')
+    .toLowerCase();
+}
+
+/**
+ * Build RouteEntry children for the dataMngt segment by scanning
+ * generated/resources.tsx (produced by gadmin2 on every `generate:dev`).
+ *
+ * Each business-model resource becomes:
+ *   <Route path="<slug>">
+ *     <Route index          element={<List   />} />
+ *     <Route path="show/:id"  element={<Show   />} />
+ *     <Route path="edit/:id"  element={<Edit   />} />
+ *     <Route path="create"    element={<Create />} />
+ *   </Route>
+ */
+function buildDataMngtChildren(): Record<string, RouteEntry> {
+  const children: Record<string, RouteEntry> = {};
+
+  for (const res of generatedResources) {
+    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 ?? {};
+
+    if (!ListComp) continue;
+
+    // Derive the URL slug from the PascalCase model name so it matches
+    // what seedDataMngtPages.ts writes into page.path.
+    const slug = toKebabCase(toPascalCase(res.name));
+
+    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 },
+        clone: { path: 'clone/:id', component: CreateComp as AnyComp },
+      },
+    };
+  }
+
+  return children;
+}
+
+/**
+ * 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>
+);
+
+// ─── Route Registry ──────────────────────────────────────────────────────────
+
+export const routeRegistry: Record<string, RouteEntry> = {
+  // ── Administration ─────────────────────────────────────────────────────────
+  admin: {
+    path: '/admin',
+    children: {
+      permission: {
+        path: 'permission',
+        children: {
+          // 菜单指引 — sortOrder 1020, code: admin.permission.readme
+          permission_readme: {
+            path: 'readme',
+            component: lazy(() =>
+              import('routes/permissionReadme').then((m) => ({
+                default: m.PermissionReadmePage,
+              })),
+            ),
+          },
+          // 用户管理 — sortOrder 1030, code: admin.permission.user
+          user: {
+            path: 'user',
+            component: lazy(() =>
+              import('routes/user').then((m) => ({ default: m.UserListPage })),
+            ),
+          },
+          // 角色管理 — sortOrder 1040, code: admin.permission.role
+          role: {
+            path: 'role-list',
+            component: lazy(() =>
+              import('routes/role').then((m) => ({
+                default: m.RoleManagementListPage,
+              })),
+            ),
+          },
+          // 页面管理 — sortOrder 1050, code: admin.permission.page
+          page: {
+            path: 'page-list',
+            component: lazy(() =>
+              import('routes/page/list').then((m) => ({
+                default: m.PageManagementListPage,
+              })),
+            ),
+          },
+          // 资源管理 — sortOrder 1060, code: admin.permission.resource
+          resource: {
+            path: 'resource-list',
+            component: lazy(() =>
+              import('routes/resource').then((m) => ({
+                default: m.ResourceManagementListPage,
+              })),
+            ),
+          },
+        },
+      },
+      dataMngt: {
+        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',
+        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 })),
+            ),
+          },
+        },
+      },
+      // 操作日志 — sortOrder 1070, code: admin.audit
+      audits: {
+        path: 'audit-log-list',
+        component: lazy(() =>
+          import('routes/audit').then((m) => ({ default: m.AuditLogPage })),
+        ),
+      },
+    },
+  },
+};
+
+// ─── Path + SourceDir indices ─────────────────────────────────────────────────
+
+/**
+ * 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 = '',
+  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('/')
+      ? entry.path
+      : entry.path === ''
+        ? parentPath
+        : entry.path.startsWith('?')
+          ? parentPath + entry.path
+          : 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) {
+      const sub = buildIndices(
+        entry.children,
+        fullPath.split('?')[0],
+        resolved,
+      );
+      Object.assign(pathIndex, sub.pathIndex);
+      Object.assign(sourceDirIndex, sub.sourceDirIndex);
+    }
+  }
+
+  return { pathIndex, sourceDirIndex };
+}
+
+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 {
+  let element: React.ReactNode | undefined;
+  if (entry.component) {
+    const Comp = entry.component;
+    element = (
+      <S>
+        <Comp />
+      </S>
+    );
+  } else if (entry.wrapper) {
+    const W = entry.wrapper;
+    element = (
+      <S>
+        <W>
+          <Outlet />
+        </W>
+      </S>
+    );
+  }
+
+  if (entry.index) {
+    return <Route key={key} index element={element ?? null} />;
+  }
+
+  const routePath = entry.path.split('?')[0];
+
+  const childRoutes = Object.entries(entry.children ?? {})
+    .map(([k, e]) => renderEntry(k, e))
+    .filter(Boolean);
+
+  // Sidebar-only: no element, no renderable children
+  if (!element && childRoutes.length === 0) return null;
+
+  return childRoutes.length > 0 ? (
+    <Route key={key} path={routePath} element={element ?? <Outlet />}>
+      {childRoutes}
+    </Route>
+  ) : (
+    <Route key={key} path={routePath} element={element!} />
+  );
+}
+
+// Memoized at module level — registry is static, routes never change
+const cachedRoutes: React.ReactElement[] = Object.entries(routeRegistry)
+  .map(([key, entry]) => renderEntry(key, entry))
+  .filter(Boolean) as React.ReactElement[];
+
+export function renderRoutes(): React.ReactElement[] {
+  return cachedRoutes;
+}

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

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

package/src/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>
+  );
+}