@gadmin2n/schematics 0.0.139 → 0.0.141

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

@@ -10,6 +10,7 @@ import { getDefaultFilter, HttpError } from '@refinedev/core';
 
 import { SearchOutlined } from '@ant-design/icons';
 import {
+  Card,
   DatePicker,
   Input,
   Radio,
@@ -75,145 +76,147 @@ export const AuditLogPage = () => {
         canCreate={false}
         contentProps={LIST_CONTENT_PROPS}
       >
-        <Table
-          className="audit-log-table"
-          {...tableProps}
-          rowKey="id"
-          scroll={{ x: true }}
-          pagination={{
-            ...tableProps.pagination,
-            showTotal: (total) => (
-              <PaginationTotal total={total} entityName="audit logs" />
-            ),
-          }}
-        >
-          <Table.Column
-            dataIndex="authorName"
-            title="User"
-            width="15%"
-            filterIcon={<SearchOutlined />}
-            render={(_, record: AuditLog) => {
-              return (
-                <Space>
-                  <CustomAvatar
-                    src={`https://rhrc.woa.com/photo/150/${record.authorName}.png`}
-                    name={record.authorName}
-                  />
-                  {record.authorName || 'N/A'}
-                </Space>
-              );
+        <Card className="card-table">
+          <Table
+            className="audit-log-table"
+            {...tableProps}
+            rowKey="id"
+            scroll={{ x: true }}
+            pagination={{
+              ...tableProps.pagination,
+              showTotal: (total) => (
+                <PaginationTotal total={total} entityName="audit logs" />
+              ),
             }}
-            filterDropdown={(props) => (
-              <FilterDropdown
-                {...(props as any)}
-                clearFilters={() => {
-                  props.setSelectedKeys([]);
-                  props.confirm?.();
-                }}
-              >
-                <Input />
-              </FilterDropdown>
-            )}
-            defaultFilteredValue={getDefaultFilter(
-              'authorName',
-              filters,
-              'contains',
-            )}
-          />
-          <Table.Column
-            dataIndex="action"
-            title="Action"
-            render={(_, record: AuditLog) => {
-              return (
-                <Space>
-                  <Tag color={getActionColor(record.action)}>
-                    {
-                      auditLogActionOptions.find(
-                        (option) => option.value === record.action,
-                      )?.label
-                    }
-                  </Tag>
-                </Space>
-              );
-            }}
-            filterDropdown={(props) => (
-              <FilterDropdown
-                {...(props as any)}
-                clearFilters={() => {
-                  props.setSelectedKeys([]);
-                  props.confirm?.();
-                }}
-              >
-                <Radio.Group>
-                  {auditLogActionOptions.map((option) => (
-                    <Radio key={option.value} value={option.value}>
-                      {option.label}
-                    </Radio>
-                  ))}
-                </Radio.Group>
-              </FilterDropdown>
-            )}
-            defaultFilteredValue={getDefaultFilter('action', filters, 'eq')}
-          />
-          <Table.Column
-            dataIndex="resource"
-            title="Entity"
-            filterIcon={<SearchOutlined />}
-            filterDropdown={(props) => (
-              <FilterDropdown
-                {...(props as any)}
-                clearFilters={() => {
-                  props.setSelectedKeys([]);
-                  props.confirm?.();
-                }}
-              >
-                <Input />
-              </FilterDropdown>
-            )}
-            defaultFilteredValue={getDefaultFilter(
-              'resource',
-              filters,
-              'contains',
-            )}
-          />
-          <Table.Column dataIndex="resourceId" title="Entity ID" />
-          <Table.Column
-            dataIndex="data"
-            title="Changes"
-            render={(_, record: AuditLog) => <ActionCell record={record} />}
-          />
-          <Table.Column
-            dataIndex="timestamp"
-            title="Date & Time"
-            width="15%"
-            render={(value) => (
-              <DateField
-                style={{ verticalAlign: 'middle' }}
-                value={value}
-                format="YYYY-MM-DD hh:mm:ss"
-              />
-            )}
-            filterDropdown={(props) => (
-              <FilterDropdown
-                {...(props as any)}
-                mapValue={rangePickerFilterMapper}
-                clearFilters={() => {
-                  props.setSelectedKeys([]);
-                  props.confirm?.();
-                }}
-              >
-                <DatePicker.RangePicker />
-              </FilterDropdown>
-            )}
-            sorter
-            defaultFilteredValue={getDefaultFilter(
-              'timestamp',
-              filters,
-              'between',
-            )}
-            defaultSortOrder={getDefaultSortOrder('timestamp', sorters)}
-          />
-        </Table>
+          >
+            <Table.Column
+              dataIndex="authorName"
+              title="User"
+              width="15%"
+              filterIcon={<SearchOutlined />}
+              render={(_, record: AuditLog) => {
+                return (
+                  <Space>
+                    <CustomAvatar
+                      src={`https://rhrc.woa.com/photo/150/${record.authorName}.png`}
+                      name={record.authorName}
+                    />
+                    {record.authorName || 'N/A'}
+                  </Space>
+                );
+              }}
+              filterDropdown={(props) => (
+                <FilterDropdown
+                  {...(props as any)}
+                  clearFilters={() => {
+                    props.setSelectedKeys([]);
+                    props.confirm?.();
+                  }}
+                >
+                  <Input />
+                </FilterDropdown>
+              )}
+              defaultFilteredValue={getDefaultFilter(
+                'authorName',
+                filters,
+                'contains',
+              )}
+            />
+            <Table.Column
+              dataIndex="action"
+              title="Action"
+              render={(_, record: AuditLog) => {
+                return (
+                  <Space>
+                    <Tag color={getActionColor(record.action)}>
+                      {
+                        auditLogActionOptions.find(
+                          (option) => option.value === record.action,
+                        )?.label
+                      }
+                    </Tag>
+                  </Space>
+                );
+              }}
+              filterDropdown={(props) => (
+                <FilterDropdown
+                  {...(props as any)}
+                  clearFilters={() => {
+                    props.setSelectedKeys([]);
+                    props.confirm?.();
+                  }}
+                >
+                  <Radio.Group>
+                    {auditLogActionOptions.map((option) => (
+                      <Radio key={option.value} value={option.value}>
+                        {option.label}
+                      </Radio>
+                    ))}
+                  </Radio.Group>
+                </FilterDropdown>
+              )}
+              defaultFilteredValue={getDefaultFilter('action', filters, 'eq')}
+            />
+            <Table.Column
+              dataIndex="resource"
+              title="Entity"
+              filterIcon={<SearchOutlined />}
+              filterDropdown={(props) => (
+                <FilterDropdown
+                  {...(props as any)}
+                  clearFilters={() => {
+                    props.setSelectedKeys([]);
+                    props.confirm?.();
+                  }}
+                >
+                  <Input />
+                </FilterDropdown>
+              )}
+              defaultFilteredValue={getDefaultFilter(
+                'resource',
+                filters,
+                'contains',
+              )}
+            />
+            <Table.Column dataIndex="resourceId" title="Entity ID" />
+            <Table.Column
+              dataIndex="data"
+              title="Changes"
+              render={(_, record: AuditLog) => <ActionCell record={record} />}
+            />
+            <Table.Column
+              dataIndex="timestamp"
+              title="Date & Time"
+              width="15%"
+              render={(value) => (
+                <DateField
+                  style={{ verticalAlign: 'middle' }}
+                  value={value}
+                  format="YYYY-MM-DD hh:mm:ss"
+                />
+              )}
+              filterDropdown={(props) => (
+                <FilterDropdown
+                  {...(props as any)}
+                  mapValue={rangePickerFilterMapper}
+                  clearFilters={() => {
+                    props.setSelectedKeys([]);
+                    props.confirm?.();
+                  }}
+                >
+                  <DatePicker.RangePicker />
+                </FilterDropdown>
+              )}
+              sorter
+              defaultFilteredValue={getDefaultFilter(
+                'timestamp',
+                filters,
+                'between',
+              )}
+              defaultSortOrder={getDefaultSortOrder('timestamp', sorters)}
+            />
+          </Table>
+        </Card>
       </List>
     </div>
   );

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

@@ -27,10 +27,10 @@ export const AuditShow: React.FC<IResourceComponentsProps> = () => {
   const resourceName = 'audit';
   const t = useTranslate();
 
-  const { queryResult } = useShow<Audit>({
+  const { query } = useShow<Audit>({
     meta: { select: showPrismaSelect },
   });
-  const { data, isLoading } = queryResult;
+  const { data, isLoading } = query;
   const record = data?.data;
 
   const [[fields, model]] = useState(() => {
@@ -59,10 +59,7 @@ export const AuditShow: React.FC<IResourceComponentsProps> = () => {
           <EditButton recordItemId={record?.id} />
           <CloneButton recordItemId={record?.id} />
           <DeleteButton recordItemId={record?.id} />
-          <RefreshButton
-            recordItemId={record?.id}
-            meta={{ select: showPrismaSelect }}
-          />
+          <RefreshButton recordItemId={record?.id} />
         </div>
       }
     >

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

@@ -0,0 +1,3 @@
+.canvas-cell--whiteboard-numcard .ant-card {
+  border-color: transparent !important;
+}

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

@@ -3,12 +3,16 @@ import { Tooltip } from 'antd';
 import { CopyOutlined, DeleteOutlined, MoreOutlined } from '@ant-design/icons';
 import IsolatedLivePreview from './IsolatedLivePreview';
 import { useIsAgentAllowed } from 'config/agentAllowed';
+import { normalizeLegacyWhiteboardName } from './whiteboardLayout';
+import './CanvasCell.css';
 
 interface CanvasCellProps extends React.HTMLAttributes<HTMLDivElement> {
   code: string;
   selected: boolean;
   componentType?: string;
   isPreview?: boolean;
+  isDropTarget?: boolean;
+  isWhiteboardChild?: boolean;
   onClick: (e: React.MouseEvent) => void;
   onDoubleClick: (e: React.MouseEvent) => void;
   onContextMenu: (e: React.MouseEvent) => void;
@@ -28,6 +32,8 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
       selected,
       componentType,
       isPreview,
+      isDropTarget,
+      isWhiteboardChild,
       onClick,
       onDoubleClick,
       onContextMenu,
@@ -41,21 +47,44 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
     },
     ref,
   ) => {
-    const isSection = componentType === 'Section';
+    const isBackgroundContainer =
+      componentType === 'Section' || componentType === 'Whiteboard';
     const isAgentAllowed = useIsAgentAllowed();
     const showToolbar = !isPreview && isAgentAllowed && selected;
+    const displayCode =
+      componentType === 'Whiteboard'
+        ? normalizeLegacyWhiteboardName(code)
+        : code;
+    const cellClassName = [
+      className,
+      componentType === 'NumCard' && isWhiteboardChild
+        ? 'canvas-cell--whiteboard-numcard'
+        : '',
+    ]
+      .filter(Boolean)
+      .join(' ');
 
     return (
       <div
         ref={ref}
-        className={className}
+        className={cellClassName}
         style={{
-          background: isSection ? 'transparent' : '#fff',
-          borderRadius: isSection ? 0 : 8,
+          background: isBackgroundContainer
+            ? 'transparent'
+            : 'var(--ant-color-bg-container)',
+          borderRadius: isBackgroundContainer ? 0 : 8,
           overflow: 'hidden',
-          outline: !isPreview && selected ? '2px solid #087ea4' : 'none',
-          outlineOffset: 2,
+          outline: isDropTarget
+            ? '3px solid #4361ee'
+            : !isPreview && selected
+              ? '2px solid #087ea4'
+              : 'none',
+          outlineOffset: isDropTarget ? 4 : 2,
+          boxShadow: isDropTarget
+            ? '0 0 0 8px rgba(67, 97, 238, 0.10)'
+            : 'none',
           cursor: isPreview ? 'default' : 'pointer',
+          transition: 'outline 120ms ease, box-shadow 120ms ease',
           ...style,
         }}
         onClick={(e) => {
@@ -84,7 +113,7 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
             overflow: 'hidden',
           }}
         >
-          <IsolatedLivePreview code={code} />
+          <IsolatedLivePreview code={displayCode} />
         </div>
 
         {/* 选中态悬浮工具栏 */}
@@ -101,8 +130,8 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
               alignItems: 'center',
               gap: 2,
               padding: 2,
-              background: '#fff',
-              border: '1px solid #d6e4ff',
+              background: 'var(--ant-color-bg-elevated)',
+              border: '1px solid var(--ant-color-primary-border)',
               borderRadius: 6,
               boxShadow: '0 2px 8px rgba(0,0,0,0.08)',
             }}
@@ -116,7 +145,8 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
                 }}
                 style={toolbarBtnStyle}
                 onMouseEnter={(e) =>
-                  (e.currentTarget.style.background = '#f0f5ff')
+                  (e.currentTarget.style.background =
+                    'var(--ant-color-primary-bg)')
                 }
                 onMouseLeave={(e) =>
                   (e.currentTarget.style.background = 'transparent')
@@ -134,7 +164,8 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
                 }}
                 style={toolbarBtnStyle}
                 onMouseEnter={(e) =>
-                  (e.currentTarget.style.background = '#f0f5ff')
+                  (e.currentTarget.style.background =
+                    'var(--ant-color-primary-bg)')
                 }
                 onMouseLeave={(e) =>
                   (e.currentTarget.style.background = 'transparent')
@@ -152,7 +183,8 @@ const CanvasCell = React.forwardRef<HTMLDivElement, CanvasCellProps>(
                 }}
                 style={{ ...toolbarBtnStyle, color: '#ff4d4f' }}
                 onMouseEnter={(e) =>
-                  (e.currentTarget.style.background = '#fff1f0')
+                  (e.currentTarget.style.background =
+                    'var(--ant-color-error-bg)')
                 }
                 onMouseLeave={(e) =>
                   (e.currentTarget.style.background = 'transparent')
@@ -182,7 +214,7 @@ const toolbarBtnStyle: React.CSSProperties = {
   alignItems: 'center',
   justifyContent: 'center',
   fontSize: 14,
-  color: '#555',
+  color: 'var(--ant-color-text-secondary)',
   padding: 0,
   transition: 'background 120ms ease',
 };

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

@@ -25,6 +25,12 @@ interface CategoryDef {
 }
 
 const CATEGORIES: CategoryDef[] = [
+  {
+    key: 'layout',
+    labelKey: 'layout',
+    defaultLabel: '布局',
+    types: ['Whiteboard'],
+  },
   {
     key: 'data',
     labelKey: 'data',
@@ -65,6 +71,7 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
   const { t } = useTranslation();
   const [keyword, setKeyword] = useState('');
   const [openCats, setOpenCats] = useState<Record<string, boolean>>({
+    layout: true,
     data: true,
     chart: true,
     map: true,
@@ -104,8 +111,8 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
         style={{
           width: 40,
           flexShrink: 0,
-          background: '#fff',
-          borderRight: '1px solid #eaeaea',
+          background: 'var(--ant-color-bg-container)',
+          borderRight: '1px solid var(--ant-color-border-secondary)',
           display: 'flex',
           flexDirection: 'column',
           alignItems: 'center',
@@ -126,7 +133,7 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
         <div
           style={{
             marginTop: 8,
-            color: '#bbb',
+            color: 'var(--ant-color-text-quaternary)',
             fontSize: 11,
             writingMode: 'vertical-rl',
             letterSpacing: 2,
@@ -144,8 +151,8 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
       style={{
         width: 240,
         flexShrink: 0,
-        background: '#fff',
-        borderRight: '1px solid #eaeaea',
+        background: 'var(--ant-color-bg-container)',
+        borderRight: '1px solid var(--ant-color-border-secondary)',
         display: 'flex',
         flexDirection: 'column',
         overflow: 'hidden',
@@ -158,14 +165,14 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
           alignItems: 'center',
           justifyContent: 'space-between',
           padding: '10px 12px',
-          borderBottom: '1px solid #f0f0f0',
+          borderBottom: '1px solid var(--ant-color-border-secondary)',
         }}
       >
         <span
           style={{
             fontSize: 13,
             fontWeight: 600,
-            color: '#1a1a1a',
+            color: 'var(--ant-color-text)',
             display: 'inline-flex',
             alignItems: 'center',
             gap: 6,
@@ -192,7 +199,11 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
           placeholder={t('canvas.library.searchPlaceholder', {
             defaultValue: '搜索组件',
           })}
-          prefix={<SearchOutlined style={{ color: '#bfbfbf' }} />}
+          prefix={
+            <SearchOutlined
+              style={{ color: 'var(--ant-color-text-quaternary)' }}
+            />
+          }
           value={keyword}
           onChange={(e) => setKeyword(e.target.value)}
         />
@@ -204,7 +215,7 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
           <div
             style={{
               textAlign: 'center',
-              color: '#bfbfbf',
+              color: 'var(--ant-color-text-quaternary)',
               fontSize: 12,
               padding: '24px 0',
             }}
@@ -230,7 +241,7 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
                   userSelect: 'none',
                   fontSize: 12,
                   fontWeight: 600,
-                  color: '#666',
+                  color: 'var(--ant-color-text-secondary)',
                 }}
               >
                 {open ? <CaretDownOutlined /> : <CaretRightOutlined />}
@@ -238,7 +249,11 @@ const CanvasComponentLibrary: React.FC<CanvasComponentLibraryProps> = ({
                   defaultValue: cat.defaultLabel,
                 })}
                 <span
-                  style={{ color: '#bfbfbf', fontWeight: 400, marginLeft: 2 }}
+                  style={{
+                    color: 'var(--ant-color-text-quaternary)',
+                    fontWeight: 400,
+                    marginLeft: 2,
+                  }}
                 >
                   ({cat.types.length})
                 </span>
@@ -316,9 +331,9 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
           padding: 6,
           cursor: 'pointer',
           userSelect: 'none',
-          border: '1px solid #ececec',
+          border: '1px solid var(--ant-color-border-secondary)',
           borderRadius: 8,
-          background: '#fff',
+          background: 'var(--ant-color-bg-container)',
           transition: 'all 160ms ease',
         }}
         onMouseEnter={(e) => {
@@ -327,17 +342,18 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
           e.currentTarget.style.transform = 'translateY(-1px)';
         }}
         onMouseLeave={(e) => {
-          e.currentTarget.style.borderColor = '#ececec';
+          e.currentTarget.style.borderColor =
+            'var(--ant-color-border-secondary)';
           e.currentTarget.style.boxShadow = 'none';
           e.currentTarget.style.transform = 'translateY(0)';
         }}
       >
         <div
           style={{
-            border: '1px solid #f0f0f0',
+            border: '1px solid var(--ant-color-border-secondary)',
             borderRadius: 6,
             overflow: 'hidden',
-            background: '#fafafa',
+            background: 'var(--ant-color-fill-quaternary)',
             width: 96,
           }}
         >
@@ -346,7 +362,7 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
         <span
           style={{
             fontSize: 11,
-            color: '#555',
+            color: 'var(--ant-color-text-secondary)',
             fontWeight: 500,
             textAlign: 'center',
             pointerEvents: 'none',
@@ -393,10 +409,10 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
         >
           <div
             style={{
-              border: '1px solid #e8e8e8',
+              border: '1px solid var(--ant-color-border-secondary)',
               borderRadius: 6,
               overflow: 'hidden',
-              background: '#fff',
+              background: 'var(--ant-color-bg-container)',
               transition: 'all 160ms ease',
             }}
             onMouseEnter={(e) => {
@@ -404,7 +420,8 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
               e.currentTarget.style.transform = 'translateY(-2px)';
             }}
             onMouseLeave={(e) => {
-              e.currentTarget.style.borderColor = '#e8e8e8';
+              e.currentTarget.style.borderColor =
+                'var(--ant-color-border-secondary)';
               e.currentTarget.style.transform = 'translateY(0)';
             }}
           >
@@ -417,7 +434,7 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
           <span
             style={{
               fontSize: 10,
-              color: '#666',
+              color: 'var(--ant-color-text-secondary)',
               fontWeight: 500,
               textAlign: 'center',
               pointerEvents: 'none',
@@ -434,7 +451,13 @@ const LibraryItem: React.FC<LibraryItemProps> = ({
     <Popover
       content={popoverContent}
       title={
-        <span style={{ fontSize: 12, fontWeight: 600, color: '#333' }}>
+        <span
+          style={{
+            fontSize: 12,
+            fontWeight: 600,
+            color: 'var(--ant-color-text)',
+          }}
+        >
           {getComponentLabel(type, t)}
         </span>
       }