@gadmin2n/schematics 0.0.69 → 0.0.71

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/BulkActions.tsx

@@ -0,0 +1,287 @@
+import React from 'react';
+import { Button, Popconfirm, Space } from 'antd';
+import { agentAttrs } from './agentPanel/agentAttributes';
+import { useAgent } from './agentPanel/AgentContext';
+import { ExportButton } from '@refinedev/antd';
+import { RowAction } from '../hooks/types';
+
+export interface BulkActionsRenderContext {
+  /** Number of selected items */
+  selectedCount: number;
+  /** Selected row keys */
+  selectedRowKeys: React.Key[];
+  /** Handler for update action */
+  onUpdate: (values: any) => Promise<void>;
+  /** Handler for delete action */
+  onDelete: () => Promise<void>;
+  /** Handler for export action */
+  onExport?: () => void;
+  /** Loading states */
+  updateLoading: boolean;
+  deleteLoading: boolean;
+  exportLoading: boolean;
+  /** Translation function */
+  t: (key: string, defaultValue?: string) => string;
+  /** Resource name */
+  resourceName: string;
+}
+
+export interface BulkActionsProps {
+  /** Array of selected row keys */
+  selectedRowKeys: React.Key[];
+  /** Row selection actions from config */
+  actions?: RowAction[];
+  /** Handler for status change actions */
+  onUpdateSelected?: (values: any) => Promise<void>;
+  /** Handler for delete action */
+  onDeleteSelected?: () => Promise<void>;
+  /** Handler for export action */
+  onExportSelected?: () => void;
+  /** Loading states */
+  updateLoading?: boolean;
+  deleteLoading?: boolean;
+  exportLoading?: boolean;
+  /** Translation function */
+  t?: (key: string, defaultValue?: string) => string;
+  /** Resource name for i18n keys */
+  resourceName?: string;
+  /** Show delete button */
+  showDelete?: boolean;
+  /** Show export button */
+  showExport?: boolean;
+  /** Custom children - if provided, replaces entire default UI */
+  children?:
+    | React.ReactNode
+    | ((context: BulkActionsRenderContext) => React.ReactNode);
+
+  // Render props for fine-grained customization
+  /** Custom render for update buttons */
+  renderUpdateButton?: (
+    action: RowAction,
+    onClick: () => void,
+    loading: boolean,
+  ) => React.ReactNode;
+  /** Custom render for delete button */
+  renderDeleteButton?: (
+    onClick: () => void,
+    loading: boolean,
+  ) => React.ReactNode;
+  /** Custom render for export button */
+  renderExportButton?: (
+    onClick: () => void,
+    loading: boolean,
+  ) => React.ReactNode;
+  /** Custom render for selection count */
+  renderSelectionCount?: (count: number) => React.ReactNode;
+  /** Additional actions to render after default actions */
+  extraActions?: React.ReactNode;
+}
+
+/**
+ * Bulk actions component for selected rows
+ *
+ * @example
+ * // Basic usage
+ * <BulkActions
+ *   selectedRowKeys={selectedRowKeys}
+ *   onUpdateSelected={updateSelectedItems}
+ *   onDeleteSelected={deleteSelectedItems}
+ *   t={t}
+ *   resourceName="audit"
+ * />
+ *
+ * @example
+ * // With custom render props
+ * <BulkActions
+ *   {...props}
+ *   renderDeleteButton={(onClick, loading) => (
+ *     <MyCustomDeleteButton onClick={onClick} loading={loading} />
+ *   )}
+ *   renderSelectionCount={(count) => (
+ *     <Badge count={count} />
+ *   )}
+ * />
+ *
+ * @example
+ * // Completely custom UI using children
+ * <BulkActions
+ *   selectedRowKeys={selectedRowKeys}
+ *   onUpdateSelected={updateSelectedItems}
+ *   onDeleteSelected={deleteSelectedItems}
+ * >
+ *   {({ selectedCount, onDelete, updateLoading }) => (
+ *     <MyCustomBulkActionsUI
+ *       count={selectedCount}
+ *       onDelete={onDelete}
+ *       loading={updateLoading}
+ *     />
+ *   )}
+ * </BulkActions>
+ */
+export const BulkActions: React.FC<BulkActionsProps> = ({
+  selectedRowKeys,
+  actions = [],
+  onUpdateSelected,
+  onDeleteSelected,
+  onExportSelected,
+  updateLoading = false,
+  deleteLoading = false,
+  exportLoading = false,
+  t = (key, defaultValue) => defaultValue || key,
+  resourceName = '',
+  showDelete = true,
+  showExport = true,
+  children,
+  renderUpdateButton,
+  renderDeleteButton,
+  renderExportButton,
+  renderSelectionCount,
+  extraActions,
+}) => {
+  const agent = useAgent();
+  const inspecting = agent?.inspecting ?? false;
+
+  if (selectedRowKeys.length === 0 && !inspecting) {
+    return null;
+  }
+
+  // Inspect-mode preview: render a placeholder when no rows are selected
+  if (selectedRowKeys.length === 0 && inspecting) {
+    return (
+      <Space
+        {...agentAttrs({ type: 'list-bulk-actions', resource: resourceName })}
+        style={{
+          opacity: 0.6,
+          border: '1px dashed #1890ff',
+          padding: '4px 8px',
+          borderRadius: 4,
+        }}
+      >
+        <Button disabled>导出</Button>
+        <Button danger disabled>
+          删除
+        </Button>
+        <span style={{ marginLeft: 8 }}>批量操作（检查模式预览）</span>
+      </Space>
+    );
+  }
+
+  const context: BulkActionsRenderContext = {
+    selectedCount: selectedRowKeys.length,
+    selectedRowKeys,
+    onUpdate: onUpdateSelected || (async () => {}),
+    onDelete: onDeleteSelected || (async () => {}),
+    onExport: onExportSelected,
+    updateLoading,
+    deleteLoading,
+    exportLoading,
+    t,
+    resourceName,
+  };
+
+  // If children is a function, call it with context
+  if (typeof children === 'function') {
+    return <>{children(context)}</>;
+  }
+
+  // If children is provided as ReactNode, render it directly
+  if (children) {
+    return <>{children}</>;
+  }
+
+  // Default rendering
+  const statusActions = actions.filter(
+    (action) => action.action === 'CHANGE_STATUS',
+  );
+
+  const defaultUpdateButton = (
+    action: RowAction,
+    onClick: () => void,
+    loading: boolean,
+  ) => (
+    <Popconfirm
+      key={action.desc}
+      placement="top"
+      onConfirm={onClick}
+      title={t('buttons.confirm', 'Are you sure?')}
+      okText={t('buttons.sure', 'Yes')}
+      cancelText={t('buttons.cancel', 'No')}
+    >
+      <Button type="default" loading={loading}>
+        {t(`resources.${resourceName}.actions.${action.desc}`, action.desc)}
+      </Button>
+    </Popconfirm>
+  );
+
+  const defaultDeleteButton = (onClick: () => void, loading: boolean) => (
+    <Popconfirm
+      placement="top"
+      onConfirm={onClick}
+      title={t('buttons.confirm', 'Are you sure?')}
+      okText={t('buttons.sure', 'Yes')}
+      cancelText={t('buttons.cancel', 'No')}
+    >
+      <Button danger loading={loading}>
+        {t('buttons.delete', 'Delete')}
+      </Button>
+    </Popconfirm>
+  );
+
+  const defaultExportButton = (onClick: () => void, loading: boolean) => (
+    <ExportButton onClick={onClick} loading={loading} icon={<></>} />
+  );
+
+  const defaultSelectionCount = (count: number) => (
+    <span style={{ marginLeft: 8 }}>
+      {t('table.selected', 'Selected') +
+        ' ' +
+        count +
+        ' ' +
+        t('table.items', 'items')}
+    </span>
+  );
+
+  return (
+    <Space
+      {...agentAttrs({ type: 'list-bulk-actions', resource: resourceName })}
+    >
+      {statusActions.map((action) =>
+        renderUpdateButton
+          ? renderUpdateButton(
+              action,
+              () => onUpdateSelected?.(action.values),
+              updateLoading,
+            )
+          : defaultUpdateButton(
+              action,
+              () => onUpdateSelected?.(action.values),
+              updateLoading,
+            ),
+      )}
+
+      {/* Export selected */}
+      {showExport &&
+        onExportSelected &&
+        (renderExportButton
+          ? renderExportButton(onExportSelected, exportLoading)
+          : defaultExportButton(onExportSelected, exportLoading))}
+
+      {/* Delete selected */}
+      {showDelete &&
+        onDeleteSelected &&
+        (renderDeleteButton
+          ? renderDeleteButton(onDeleteSelected, deleteLoading)
+          : defaultDeleteButton(onDeleteSelected, deleteLoading))}
+
+      {/* Extra actions */}
+      {extraActions}
+
+      {/* Selection count */}
+      {renderSelectionCount
+        ? renderSelectionCount(selectedRowKeys.length)
+        : defaultSelectionCount(selectedRowKeys.length)}
+    </Space>
+  );
+};
+
+export default BulkActions;

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/ListPageHeader.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import { Space } from 'antd';
+import { CreateButton, ExportButton, ImportButton } from '@refinedev/antd';
+import { agentAttrs } from './agentPanel/agentAttributes';
+
+export interface ListPageHeaderProps {
+  /** Show import button */
+  showImport?: boolean;
+  /** Show export button */
+  showExport?: boolean;
+  /** Show create button */
+  showCreate?: boolean;
+  /** Import button props */
+  importProps?: any;
+  /** Export handler */
+  onExport?: () => void;
+  /** Export loading state */
+  exportLoading?: boolean;
+  /** Custom buttons to render before default buttons */
+  extraButtons?: React.ReactNode;
+  /** Custom buttons to render after default buttons */
+  extraButtonsAfter?: React.ReactNode;
+  /** Resource name for agent inspector */
+  resourceName?: string;
+}
+
+/**
+ * Default header buttons for list page
+ */
+export const ListPageHeader: React.FC<ListPageHeaderProps> = ({
+  showImport = true,
+  showExport = true,
+  showCreate = true,
+  importProps,
+  onExport,
+  exportLoading = false,
+  extraButtons,
+  extraButtonsAfter,
+  resourceName = '',
+}) => {
+  return (
+    <div {...agentAttrs({ type: 'list-header', resource: resourceName })}>
+      <Space>
+        {extraButtons}
+        {showImport && importProps && <ImportButton {...importProps} />}
+        {showExport && onExport && (
+          <ExportButton onClick={onExport} loading={exportLoading} />
+        )}
+        {showCreate && <CreateButton type="primary" />}
+        {extraButtonsAfter}
+      </Space>
+    </div>
+  );
+};
+
+export default ListPageHeader;

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/RowActions.tsx

@@ -0,0 +1,318 @@
+import React from 'react';
+import { DownOutlined } from '@ant-design/icons';
+import { Button, Dropdown, Popconfirm, Space } from 'antd';
+import {
+  CloneButton,
+  DeleteButton,
+  EditButton,
+  ShowButton,
+} from '@refinedev/antd';
+import { RowAction } from '../hooks/types';
+import { whenIsTrue } from '@gadmin2n/react-common';
+
+export interface RowActionsRenderContext<T = any> {
+  /** Current record */
+  record: T;
+  /** Record ID */
+  recordId: number | string;
+  /** Translation function */
+  t: (key: string, defaultValue?: string) => string;
+  /** Resource name */
+  resourceName: string;
+  /** Update handler */
+  onUpdate: (values: any) => void;
+  /** Is update loading */
+  updateLoading: boolean;
+}
+
+export interface RowActionsProps<T = any> {
+  /** Current record */
+  record: T;
+  /** Record ID field name */
+  idField?: keyof T;
+  /** Row actions from config */
+  actions?: RowAction[];
+  /** Handler for row update */
+  onUpdate?: (id: number, values: any) => void;
+  /** Is update loading */
+  updateLoading?: boolean;
+  /** Translation function */
+  t?: (key: string, defaultValue?: string) => string;
+  /** Resource name for i18n keys */
+  resourceName?: string;
+  /** Show edit button */
+  showEdit?: boolean;
+  /** Show detail/show button */
+  showDetail?: boolean;
+  /** Show clone button */
+  showClone?: boolean;
+  /** Show delete button */
+  showDelete?: boolean;
+  /** Show history/log button */
+  showHistory?: boolean;
+  /** Custom children - if provided, replaces entire default UI */
+  children?:
+    | React.ReactNode
+    | ((context: RowActionsRenderContext<T>) => React.ReactNode);
+
+  // Render props for fine-grained customization
+  /** Custom render for edit button */
+  renderEditButton?: (recordId: number | string) => React.ReactNode;
+  /** Custom render for detail/show button */
+  renderDetailButton?: (recordId: number | string) => React.ReactNode;
+  /** Custom render for clone button */
+  renderCloneButton?: (recordId: number | string) => React.ReactNode;
+  /** Custom render for delete button */
+  renderDeleteButton?: (recordId: number | string) => React.ReactNode;
+  /** Custom render for history/log button */
+  renderHistoryButton?: (recordId: number | string) => React.ReactNode;
+  /** Custom render for status action buttons */
+  renderStatusAction?: (
+    action: RowAction,
+    record: T,
+    onConfirm: () => void,
+    loading: boolean,
+    disabled: boolean,
+  ) => React.ReactNode;
+  /** Custom render for more dropdown trigger */
+  renderMoreTrigger?: () => React.ReactNode;
+  /** Extra dropdown items to add */
+  extraDropdownItems?: Array<{ key: string; label: React.ReactNode }>;
+  /** Extra primary actions (rendered before More dropdown) */
+  extraPrimaryActions?: React.ReactNode;
+  /** Log button component (optional, for backward compatibility) */
+  LogButton?: React.ComponentType<any>;
+}
+
+/**
+ * Row actions component with edit, show, and more dropdown
+ *
+ * @example
+ * // Basic usage
+ * <RowActions
+ *   record={record}
+ *   actions={tableConfig.rowActions.actions}
+ *   t={t}
+ *   resourceName="audit"
+ * />
+ *
+ * @example
+ * // With custom render props
+ * <RowActions
+ *   {...props}
+ *   renderEditButton={(id) => <MyEditButton id={id} />}
+ *   renderDeleteButton={(id) => <MyDeleteButton id={id} />}
+ * />
+ *
+ * @example
+ * // Completely custom UI using children
+ * <RowActions record={record}>
+ *   {({ record, recordId, onUpdate }) => (
+ *     <MyCustomActionsUI
+ *       record={record}
+ *       onEdit={() => navigate(`/edit/${recordId}`)}
+ *       onUpdate={onUpdate}
+ *     />
+ *   )}
+ * </RowActions>
+ */
+export function RowActions<T extends { id: number | string }>({
+  record,
+  idField = 'id' as keyof T,
+  actions = [],
+  onUpdate,
+  updateLoading = false,
+  t = (key, defaultValue) => defaultValue || key,
+  resourceName = '',
+  showEdit = true,
+  showDetail = true,
+  showClone = true,
+  showDelete = true,
+  showHistory = false,
+  children,
+  renderEditButton,
+  renderDetailButton,
+  renderCloneButton,
+  renderDeleteButton,
+  renderHistoryButton,
+  renderStatusAction,
+  renderMoreTrigger,
+  extraDropdownItems = [],
+  extraPrimaryActions,
+  LogButton,
+}: RowActionsProps<T>) {
+  const recordId = record[idField] as number | string;
+
+  const context: RowActionsRenderContext<T> = {
+    record,
+    recordId,
+    t,
+    resourceName,
+    onUpdate: (values) => onUpdate?.(Number(recordId), values),
+    updateLoading,
+  };
+
+  // If children is a function, call it with context
+  if (typeof children === 'function') {
+    return <>{children(context)}</>;
+  }
+
+  // If children is provided as ReactNode, render it directly
+  if (children) {
+    return <>{children}</>;
+  }
+
+  // Default rendering
+  const statusActions = actions.filter(
+    (action) => action.action === 'CHANGE_STATUS',
+  );
+
+  // Default button renderers
+  const defaultEditButton = (id: number | string) => (
+    <EditButton icon={false} type="text" size="small" recordItemId={id} />
+  );
+
+  const defaultDetailButton = (id: number | string) => (
+    <ShowButton icon={false} type="text" size="small" recordItemId={id}>
+      {t('table.detail', 'Detail')}
+    </ShowButton>
+  );
+
+  const defaultCloneButton = (id: number | string) => (
+    <CloneButton icon={false} type="text" size="small" recordItemId={id} />
+  );
+
+  const defaultDeleteButton = (id: number | string) => (
+    <DeleteButton icon={false} type="text" size="small" recordItemId={id} />
+  );
+
+  const defaultHistoryButton = (id: number | string) =>
+    LogButton ? (
+      <LogButton
+        hideText={false}
+        icon={false}
+        type="text"
+        size="small"
+        recordItemId={id}
+      />
+    ) : null;
+
+  const defaultStatusAction = (
+    action: RowAction,
+    _record: T,
+    onConfirm: () => void,
+    loading: boolean,
+    disabled: boolean,
+  ) => (
+    <Popconfirm
+      placement="top"
+      title={t('buttons.confirm', 'Are you sure?')}
+      onConfirm={onConfirm}
+      okText={t('buttons.sure', 'Yes')}
+      cancelText={t('buttons.cancel', 'No')}
+      disabled={disabled}
+    >
+      <Button loading={loading} size="small" type="text" disabled={disabled}>
+        {t(`resources.${resourceName}.actions.${action.desc}`, action.desc)}
+      </Button>
+    </Popconfirm>
+  );
+
+  const defaultMoreTrigger = () => (
+    <Button type="text" size="small">
+      {t('table.more', 'More')}
+      <DownOutlined />
+    </Button>
+  );
+
+  // Build dropdown items
+  const dropdownItems = [
+    // Status change actions
+    ...statusActions.map((action) => {
+      const disabled = !whenIsTrue(action.when, record);
+      const onConfirm = () => onUpdate?.(Number(recordId), action.values);
+
+      return {
+        key: action.desc,
+        label: renderStatusAction
+          ? renderStatusAction(
+              action,
+              record,
+              onConfirm,
+              updateLoading,
+              disabled,
+            )
+          : defaultStatusAction(
+              action,
+              record,
+              onConfirm,
+              updateLoading,
+              disabled,
+            ),
+      };
+    }),
+    // Clone button
+    ...(showClone
+      ? [
+          {
+            key: 'clone',
+            label: renderCloneButton
+              ? renderCloneButton(recordId)
+              : defaultCloneButton(recordId),
+          },
+        ]
+      : []),
+    // History/Log button
+    ...(showHistory || LogButton
+      ? [
+          {
+            key: 'history',
+            label: renderHistoryButton
+              ? renderHistoryButton(recordId)
+              : defaultHistoryButton(recordId),
+          },
+        ]
+      : []),
+    // Delete button
+    ...(showDelete
+      ? [
+          {
+            key: 'delete',
+            label: renderDeleteButton
+              ? renderDeleteButton(recordId)
+              : defaultDeleteButton(recordId),
+          },
+        ]
+      : []),
+    // Extra items
+    ...extraDropdownItems,
+  ].filter((item) => item.label != null);
+
+  return (
+    <Space>
+      {/* Edit button */}
+      {showEdit &&
+        (renderEditButton
+          ? renderEditButton(recordId)
+          : defaultEditButton(recordId))}
+
+      {/* Show/Detail button */}
+      {showDetail &&
+        (renderDetailButton
+          ? renderDetailButton(recordId)
+          : defaultDetailButton(recordId))}
+
+      {/* Extra primary actions */}
+      {extraPrimaryActions}
+
+      {/* More dropdown */}
+      {dropdownItems.length > 0 && (
+        <Dropdown menu={{ items: dropdownItems as any }} trigger={['click']}>
+          {renderMoreTrigger ? renderMoreTrigger() : defaultMoreTrigger()}
+        </Dropdown>
+      )}
+    </Space>
+  );
+}
+
+export default RowActions;