import { Tabs, Checkbox } from 'antd';
import { PERMISSION_CATEGORY_OPTIONS } from './usersConstants';

interface Props {
  value: number[];
  onChange: (ids: number[]) => void;
  disabled?: boolean;
}

export default function UserPermissionPanel({ value, onChange, disabled = false }: Props) {
  return (
    <div data-testid="user-permission-panel">
      <Tabs
        items={[
          {
            key: 'main',
            label: '权限组',
            children: (
              <Checkbox.Group
                options={PERMISSION_CATEGORY_OPTIONS}
                value={value}
                onChange={(checked) => onChange(checked as number[])}
                disabled={disabled}
                data-testid="permission-category-group"
              />
            ),
          },
          { key: 'customer', label: '客户查看权限', disabled: true, children: null },
          { key: 'supplier', label: '供应商查看权限', disabled: true, children: null },
          { key: 'person', label: '人员查看权限', disabled: true, children: null },
        ]}
      />
    </div>
  );
}