UserToolbar.tsx 1.61 KB
// REQ-USR-003: 用户列表工具栏(刷新/新增/导出Excel/设置齿轮占位,BR8/BR9/BR13/D7/D10)
import { Button } from 'antd';
import {
  FileExcelOutlined,
  PlusCircleOutlined,
  ReloadOutlined,
  SettingOutlined,
} from '@ant-design/icons';
import { TEXT_ADD, TEXT_EXPORT, TEXT_REFRESH } from './constants';
import styles from './UserList.module.css';

export interface UserToolbarProps {
  onRefresh(): void;
  onAdd(): void;
  onExport(): void;
  exporting: boolean;
  loading?: boolean;
}

export default function UserToolbar({
  onRefresh,
  onAdd,
  onExport,
  exporting,
  loading = false,
}: UserToolbarProps) {
  return (
    <div className={styles.toolbar}>
      <Button
        type="text"
        icon={<ReloadOutlined />}
        loading={loading}
        onClick={() => onRefresh()}
        data-testid="btn-refresh"
      >
        {TEXT_REFRESH}
      </Button>
      <Button
        type="text"
        icon={<PlusCircleOutlined />}
        onClick={() => onAdd()}
        data-testid="btn-add"
      >
        {TEXT_ADD}
      </Button>
      <Button
        type="text"
        icon={<FileExcelOutlined />}
        loading={exporting}
        disabled={exporting}
        onClick={() => onExport()}
        data-testid="btn-export"
      >
        {TEXT_EXPORT}
      </Button>

      <span className={styles.toolbarSpacer} />

      {/* 设置齿轮:列显隐 / 偏好预留占位,无后端动作(D7) */}
      <span
        className={styles.gear}
        data-testid="btn-gear"
        role="presentation"
        aria-label="设置"
      >
        <SettingOutlined />
      </span>
    </div>
  );
}