@gadmin2n/schematics 0.0.140 → 0.0.142

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

@@ -10,6 +10,7 @@ import { useGetIdentity } from '@refinedev/core';
 import {
   Table,
   Button,
+  Card,
   Space,
   Tooltip,
   Tag,
@@ -17,7 +18,6 @@ import {
   Modal,
   message,
   Tabs,
-  Typography,
 } from 'antd';
 import {
   SaveOutlined,
@@ -59,14 +59,13 @@ import { PageDetailDrawer } from './Components/PageDetailDrawer';
 import type {
   PageMenuTreeNode,
   PageResourceAssignment,
-  PageResourcePermissionSummary,
   ResourceDefinition,
 } from './types';
 import { usePageManagement } from './hooks/usePageManagement';
 import { useTranslation } from 'react-i18next';
 import { SqlModal, generatePageSql } from '../../components/SqlModal';
-
-const RESOURCE_NAME_DISPLAY_TRUNCATION_LIMIT = 40;
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 // Sparse number gap for sortOrder (allows inserting items between existing ones)
 const SORT_ORDER_GAP = 10000;
@@ -92,7 +91,7 @@ const safelyConvertToNumber = (value: unknown): number | null => {
 
 const extractPermissionActionsFromAssociation = (
   associationRecord: any,
-  resourceRecord: any,
+  _resourceRecord: any,
 ): string[] => {
   const aggregatedPermissionActions = new Set<string>();
 
@@ -295,7 +294,8 @@ export const PageManagementListPage: React.FC = () => {
             children: removeEmptyChildrenArrays(node.children),
           };
         }
-        const { children, ...nodeWithoutChildren } = node;
+        const nodeWithoutChildren = { ...node };
+        delete nodeWithoutChildren.children;
         return nodeWithoutChildren as PageMenuTreeNode;
       });
 
@@ -303,69 +303,6 @@ export const PageManagementListPage: React.FC = () => {
     return removeEmptyChildrenArrays(rootLevelNodes);
   }, [pageListData]);
 
-  const pageResourcePermissionSummaryMap = useMemo<
-    Record<number, PageResourcePermissionSummary>
-  >(() => {
-    const associationsArray: any[] = Array.isArray(
-      pageResourceAssociationsData?.data,
-    )
-      ? pageResourceAssociationsData.data
-      : [];
-    const summaryMapByPageId: Record<number, PageResourcePermissionSummary> =
-      {};
-
-    associationsArray.forEach((association: any) => {
-      const pageId = safelyConvertToNumber(association?.pageId);
-      const resourceId = safelyConvertToNumber(association?.resourceId);
-
-      if (pageId === null || resourceId === null) {
-        return;
-      }
-
-      if (!summaryMapByPageId[pageId]) {
-        summaryMapByPageId[pageId] = {
-          resourceIds: [],
-          resourceNames: [],
-          allPermissionActions: [],
-        };
-      }
-
-      const pageSummary = summaryMapByPageId[pageId];
-
-      if (!pageSummary.resourceIds.includes(resourceId)) {
-        pageSummary.resourceIds.push(resourceId);
-      }
-
-      const resourceRecord =
-        association?.resource ?? resourceLookupByIdMap[resourceId];
-      const resourceDisplayName =
-        resourceRecord?.name ||
-        resourceRecord?.code ||
-        `Resource ${resourceId}`;
-
-      if (
-        resourceDisplayName &&
-        !pageSummary.resourceNames.includes(resourceDisplayName)
-      ) {
-        pageSummary.resourceNames.push(resourceDisplayName);
-      }
-
-      extractPermissionActionsFromAssociation(
-        association,
-        resourceRecord,
-      ).forEach((permissionAction) => {
-        if (
-          permissionAction &&
-          !pageSummary.allPermissionActions.includes(permissionAction)
-        ) {
-          pageSummary.allPermissionActions.push(permissionAction);
-        }
-      });
-    });
-
-    return summaryMapByPageId;
-  }, [pageResourceAssociationsData, resourceLookupByIdMap]);
-
   const getPageResourceAssignmentsForModal = useCallback(
     (pageId: number): PageResourceAssignment[] => {
       console.log(
@@ -541,7 +478,12 @@ export const PageManagementListPage: React.FC = () => {
       );
       setSqlModal({ open: true, title: `SQL — Page: ${record.name}`, sql });
     },
-    [pageListData, pageResourceAssociationsData, resourceLookupByIdMap],
+    [
+      pageListData,
+      pageResourceAssociationsData,
+      resourceLookupByIdMap,
+      identity,
+    ],
   );
 
   // Ref for expand button click/double-click disambiguation
@@ -1001,46 +943,6 @@ export const PageManagementListPage: React.FC = () => {
     setExpandedKeys(new Set());
   }, []);
 
-  // Common column renderers for both tables
-  const renderAssignedResourcesColumn = (record: any) => {
-    const permissionSummary = pageResourcePermissionSummaryMap[record.id];
-
-    if (!permissionSummary?.resourceNames.length) {
-      return <span style={{ color: '#999' }}>No resources assigned</span>;
-    }
-
-    const joinedResourceNames = permissionSummary.resourceNames.join(', ');
-    const shouldTruncateDisplay =
-      joinedResourceNames.length > RESOURCE_NAME_DISPLAY_TRUNCATION_LIMIT;
-    const truncatedDisplayValue = shouldTruncateDisplay
-      ? `${joinedResourceNames.slice(0, RESOURCE_NAME_DISPLAY_TRUNCATION_LIMIT)}...`
-      : joinedResourceNames;
-
-    return (
-      <Tooltip title={joinedResourceNames}>
-        <span>{truncatedDisplayValue}</span>
-      </Tooltip>
-    );
-  };
-
-  const renderPermissionActionsColumn = (record: any) => {
-    const permissionSummary = pageResourcePermissionSummaryMap[record.id];
-
-    if (!permissionSummary?.allPermissionActions.length) {
-      return <span style={{ color: '#999' }}>-</span>;
-    }
-
-    return (
-      <Space size={[4, 4]} wrap>
-        {permissionSummary.allPermissionActions.map((permissionAction) => (
-          <Tag key={`${record.id}-${permissionAction}`} color="blue">
-            {permissionAction}
-          </Tag>
-        ))}
-      </Space>
-    );
-  };
-
   // Handle click on add child page button
   const handleAddChildPage = useCallback((parentPage: any) => {
     const parentPath = parentPage.path || '';
@@ -1280,48 +1182,43 @@ export const PageManagementListPage: React.FC = () => {
   );
 
   return (
-    <div>
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          marginBottom: 16,
-        }}
-      >
-        <Typography.Title level={4} style={{ margin: 0 }}>
-          Page mgnts
-        </Typography.Title>
-        <Button
-          type="primary"
-          onClick={() =>
-            setActiveModalState({
-              modalType: 'create',
-              targetPageId: null,
-            })
-          }
-        >
-          Create Page
-        </Button>
-      </div>
-
-      <Tabs
-        activeKey={activeTab}
-        onChange={setActiveTab}
-        items={[
-          {
-            key: 'regular',
-            label: `Regular Pages (${regularPagesData.length})`,
-            children: renderRegularPagesTable(),
-          },
-          {
-            key: 'virtual',
-            label: `Virtual Pages (${virtualPagesData.length})`,
-            children: renderVirtualPagesTable(),
-          },
-        ]}
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="Page mgnts"
+        extra={
+          <Button
+            type="primary"
+            onClick={() =>
+              setActiveModalState({
+                modalType: 'create',
+                targetPageId: null,
+              })
+            }
+          >
+            Create Page
+          </Button>
+        }
       />
 
+      <Card className="card-table">
+        <Tabs
+          activeKey={activeTab}
+          onChange={setActiveTab}
+          items={[
+            {
+              key: 'regular',
+              label: `Regular Pages (${regularPagesData.length})`,
+              children: renderRegularPagesTable(),
+            },
+            {
+              key: 'virtual',
+              label: `Virtual Pages (${virtualPagesData.length})`,
+              children: renderVirtualPagesTable(),
+            },
+          ]}
+        />
+      </Card>
+
       {activeModalState.modalType === 'edit' &&
         activeModalState.targetPageId && (
           <EditPageModal

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

@@ -1,4 +1,6 @@
 import { Alert, Card, Collapse, Divider, Table, Tabs, Typography } from 'antd';
+import { PageHeader } from 'components';
+import { CARD_GAP_STYLE, PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 const { Title, Paragraph, Text } = Typography;
 
@@ -333,16 +335,14 @@ const comparisonData = [
 
 export const PermissionReadmePage = () => {
   return (
-    <div>
-      <Typography>
-        <Title level={2}>菜单管理说明</Title>
-        <Paragraph>
-          本页面介绍系统的菜单、路由与权限管理机制，帮助管理员理解如何添加和配置不同类型的菜单项。
-        </Paragraph>
-      </Typography>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="菜单管理说明"
+        subtitle="本页面介绍系统的菜单、路由与权限管理机制，帮助管理员理解如何添加和配置不同类型的菜单项。"
+      />
 
       {/* ── 架构概览 ──────────────────────────────────────────────── */}
-      <Card title="菜单系统架构" style={{ marginBottom: 24 }}>
+      <Card title="菜单系统架构" style={CARD_GAP_STYLE}>
         <Paragraph>
           系统的菜单管理涉及<Text strong>前端路由注册</Text>和
           <Text strong>数据库页面配置</Text>两个部分的协作。 未匹配到
@@ -374,7 +374,7 @@ export const PermissionReadmePage = () => {
       </Card>
 
       {/* ── 核心概念 ──────────────────────────────────────────────── */}
-      <Card title="核心概念" style={{ marginBottom: 24 }}>
+      <Card title="核心概念" style={CARD_GAP_STYLE}>
         <Table
           columns={coreConceptColumns}
           dataSource={coreConceptData}
@@ -394,7 +394,7 @@ export const PermissionReadmePage = () => {
       </Card>
 
       {/* ── 四种注册方式 ──────────────────────────────────────────── */}
-      <Card title="菜单注册方式" style={{ marginBottom: 24 }}>
+      <Card title="菜单注册方式" style={CARD_GAP_STYLE}>
         <Alert
           type="info"
           showIcon
@@ -755,7 +755,8 @@ staff: {
                           目标网站必须允许被 iframe 嵌入（未设置{' '}
                           <Text code>X-Frame-Options: DENY</Text> 或{' '}
                           <Text code>
-                            Content-Security-Policy: frame-ancestors 'none'
+                            Content-Security-Policy: frame-ancestors
+                            &apos;none&apos;
                           </Text>
                           ）
                         </li>
@@ -876,7 +877,7 @@ interface DynamicMenuGroup {
       </Card>
 
       {/* ── 权限层级关系 ────────────────────────────────────────────── */}
-      <Card title="权限层级关系" style={{ marginBottom: 24 }}>
+      <Card title="权限层级关系" style={CARD_GAP_STYLE}>
         <Title level={5}>实体关系总览</Title>
         <pre
           style={{

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

@@ -1,6 +1,6 @@
 import React, { useState, useMemo } from 'react';
 import { useTable, FilterDropdown } from '@refinedev/antd';
-import { Table, Button, Space, Tooltip, Input, Typography } from 'antd';
+import { Table, Button, Card, Space, Tooltip, Input } from 'antd';
 import {
   EditOutlined,
   EyeOutlined,
@@ -17,6 +17,8 @@ import { EditModal } from './Components/EditModal';
 import { CreateModal } from './Components/CreateModal';
 import { ResourceDetailDrawer } from './Components/ResourceDetailDrawer';
 import { SqlModal, generateResourceSql } from '../../components/SqlModal';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 // System resources that cannot be modified (use Set for O(1) lookup performance)
 // System resources that cannot be modified
@@ -116,119 +118,114 @@ export const ResourceManagementListPage: React.FC = () => {
   };
 
   return (
-    <div>
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          marginBottom: 16,
-        }}
-      >
-        <Typography.Title level={4} style={{ margin: 0 }}>
-          Resource mgnts
-        </Typography.Title>
-        <Button
-          type="primary"
-          onClick={() =>
-            setShowModal({
-              type: 'create',
-              id: null,
-            })
-          }
-        >
-          Create Resource
-        </Button>
-      </div>
-      <Table {...tableProps} rowKey="id">
-        <Table.Column
-          dataIndex="code"
-          title="Code"
-          sorter={(a: Resource, b: Resource) => a.code.localeCompare(b.code)}
-          defaultFilteredValue={getDefaultFilter('code', filters, 'contains')}
-          filterDropdown={(props) => (
-            <FilterDropdown
-              {...props}
-              clearFilters={() => {
-                props.setSelectedKeys([]);
-                props.confirm?.();
-              }}
-            >
-              <Input placeholder="Search Code" />
-            </FilterDropdown>
-          )}
-          filterIcon={<SearchOutlined />}
-        />
-        <Table.Column
-          dataIndex="name"
-          title="Name"
-          sorter={(a: Resource, b: Resource) => a.name.localeCompare(b.name)}
-          defaultFilteredValue={getDefaultFilter('name', filters, 'contains')}
-          filterDropdown={(props) => (
-            <FilterDropdown
-              {...props}
-              clearFilters={() => {
-                props.setSelectedKeys([]);
-                props.confirm?.();
-              }}
-            >
-              <Input placeholder="Search Name" />
-            </FilterDropdown>
-          )}
-          filterIcon={<SearchOutlined />}
-        />
-        <Table.Column dataIndex="description" title="Description" />
-        <Table.Column
-          dataIndex="creator"
-          title="Creator"
-          sorter={(a: Resource, b: Resource) =>
-            (a.creator || '').localeCompare(b.creator || '')
-          }
-        />
-        <Table.Column
-          title="Actions"
-          render={(_, record: Resource) => {
-            const isProtected = protectedResourcesMap.get(record.id) || false;
-            return (
-              <Space>
-                <Tooltip title="View details">
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<EyeOutlined />}
-                    onClick={() => setDrawerResource(record)}
-                  />
-                </Tooltip>
-                <Tooltip
-                  title={
-                    isProtected
-                      ? 'This is a system resource and cannot be modified'
-                      : 'Edit'
-                  }
-                >
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<EditOutlined />}
-                    disabled={isProtected}
-                    onClick={() =>
-                      setShowModal({ type: 'edit', id: record.id })
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="Resource mgnts"
+        extra={
+          <Button
+            type="primary"
+            onClick={() =>
+              setShowModal({
+                type: 'create',
+                id: null,
+              })
+            }
+          >
+            Create Resource
+          </Button>
+        }
+      />
+      <Card className="card-table">
+        <Table {...tableProps} rowKey="id">
+          <Table.Column
+            dataIndex="code"
+            title="Code"
+            sorter={(a: Resource, b: Resource) => a.code.localeCompare(b.code)}
+            defaultFilteredValue={getDefaultFilter('code', filters, 'contains')}
+            filterDropdown={(props) => (
+              <FilterDropdown
+                {...props}
+                clearFilters={() => {
+                  props.setSelectedKeys([]);
+                  props.confirm?.();
+                }}
+              >
+                <Input placeholder="Search Code" />
+              </FilterDropdown>
+            )}
+            filterIcon={<SearchOutlined />}
+          />
+          <Table.Column
+            dataIndex="name"
+            title="Name"
+            sorter={(a: Resource, b: Resource) => a.name.localeCompare(b.name)}
+            defaultFilteredValue={getDefaultFilter('name', filters, 'contains')}
+            filterDropdown={(props) => (
+              <FilterDropdown
+                {...props}
+                clearFilters={() => {
+                  props.setSelectedKeys([]);
+                  props.confirm?.();
+                }}
+              >
+                <Input placeholder="Search Name" />
+              </FilterDropdown>
+            )}
+            filterIcon={<SearchOutlined />}
+          />
+          <Table.Column dataIndex="description" title="Description" />
+          <Table.Column
+            dataIndex="creator"
+            title="Creator"
+            sorter={(a: Resource, b: Resource) =>
+              (a.creator || '').localeCompare(b.creator || '')
+            }
+          />
+          <Table.Column
+            title="Actions"
+            render={(_, record: Resource) => {
+              const isProtected = protectedResourcesMap.get(record.id) || false;
+              return (
+                <Space>
+                  <Tooltip title="View details">
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<EyeOutlined />}
+                      onClick={() => setDrawerResource(record)}
+                    />
+                  </Tooltip>
+                  <Tooltip
+                    title={
+                      isProtected
+                        ? 'This is a system resource and cannot be modified'
+                        : 'Edit'
                     }
-                  />
-                </Tooltip>
-                <Tooltip title="Generate SQL">
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<CodeOutlined />}
-                    onClick={() => handleShowSql(record)}
-                  />
-                </Tooltip>
-              </Space>
-            );
-          }}
-        />
-      </Table>
+                  >
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<EditOutlined />}
+                      disabled={isProtected}
+                      onClick={() =>
+                        setShowModal({ type: 'edit', id: record.id })
+                      }
+                    />
+                  </Tooltip>
+                  <Tooltip title="Generate SQL">
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<CodeOutlined />}
+                      onClick={() => handleShowSql(record)}
+                    />
+                  </Tooltip>
+                </Space>
+              );
+            }}
+          />
+        </Table>
+      </Card>
       {showModal.type === 'edit' && showModal.id && (
         <EditModal
           id={showModal.id}