import snippets from './snippets';

const PisellBatchActionBarMeta = {
  componentName: 'PisellBatchActionBar',
  title: '批量操作栏',
  category: '数据操作',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.3',
    exportName: 'PisellBatchActionBar',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      // ========== 基础属性 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Basic',
            'zh-CN': '基础属性',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'className',
            title: {
              label: '类名',
              tip: 'className | 自定义类名',
            },
            propType: 'string',
            setter: 'StringSetter',
          },
          {
            name: 'style',
            title: {
              label: '样式',
              tip: 'style | 自定义样式',
            },
            propType: 'object',
            setter: 'StyleSetter',
          },
        ],
      },
      // ========== 选择状态 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Selection State',
            'zh-CN': '选择状态',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'selectedKeys',
            title: {
              label: '选中项Key数组',
              tip: 'selectedKeys | 选中的 key 数组，必填，用于感知选择状态',
            },
            propType: {
              type: 'arrayOf',
              value: 'string',
            },
            setter: ['JsonSetter', 'VariableSetter'],
          },
          {
            name: 'selectedRows',
            title: {
              label: '选中项数据数组',
              tip: 'selectedRows | 选中的行数据数组，可选，用于传递给操作回调',
            },
            propType: {
              type: 'arrayOf',
              value: 'object',
            },
            setter: ['JsonSetter', 'VariableSetter'],
          },
          {
            name: 'total',
            title: {
              label: '总数据量',
              tip: 'total | 总数据量，用于判断全选状态',
            },
            propType: 'number',
            setter: ['NumberSetter', 'VariableSetter'],
          },
          {
            name: 'currentPageTotal',
            title: {
              label: '当前页数据量',
              tip: 'currentPageTotal | 当前页数据量，用于判断全选当前页状态',
            },
            propType: 'number',
            setter: ['NumberSetter', 'VariableSetter'],
          },
          {
            name: 'currentPageKeys',
            title: {
              label: '当前页Key数组',
              tip: 'currentPageKeys | 当前页数据 key 数组，用于判断全选当前页状态',
            },
            propType: {
              type: 'arrayOf',
              value: 'string',
            },
            setter: ['JsonSetter', 'VariableSetter'],
          },
        ],
      },
      // ========== 布局模式 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Layout Mode',
            'zh-CN': '布局模式',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'position',
            title: {
              label: '布局模式',
              tip: 'position | 布局模式：sticky-top（吸顶）、sticky-bottom（吸底）、float（悬浮，默认）、inline（内嵌）',
            },
            propType: {
              type: 'oneOf',
              value: ['sticky-top', 'sticky-bottom', 'float', 'inline'],
            },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { title: '吸顶', value: 'sticky-top' },
                  { title: '吸底', value: 'sticky-bottom' },
                  { title: '悬浮', value: 'float' },
                  { title: '内嵌', value: 'inline' },
                ],
              },
            },
            defaultValue: 'float',
          },
          {
            name: 'offset',
            title: {
              label: '偏移量',
              tip: 'offset | 吸顶/吸底时的偏移量',
            },
            propType: 'number',
            setter: ['NumberSetter', 'VariableSetter'],
            defaultValue: 0,
          },
        ],
      },
      // ========== 默认操作按钮配置 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Default Actions',
            'zh-CN': '默认操作按钮',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'showSelectedCount',
            title: {
              label: '显示选中数量',
              tip: 'showSelectedCount | 是否显示选中数量提示',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'selectedCountText',
            title: {
              label: '选中数量文案',
              tip: 'selectedCountText | 选中数量提示文案，支持字符串模板（使用 {count} 占位符）或函数形式',
            },
            propType: {
              type: 'oneOfType',
              value: ['string', 'func'],
            },
            setter: ['PisellI18nSetter', 'FunctionSetter', 'VariableSetter'],
          },
          {
            name: 'defaultActions.showDefaultActions',
            title: {
              label: '显示默认按钮',
              tip: 'defaultActions.showDefaultActions | 是否显示默认操作按钮（全选、反选、取消选择、删除）',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'defaultActions.showSelectAll',
            title: {
              label: '显示全选按钮',
              tip: 'defaultActions.showSelectAll | 是否显示全选按钮',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'defaultActions.showInvert',
            title: {
              label: '显示反选按钮',
              tip: 'defaultActions.showInvert | 是否显示反选按钮',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'defaultActions.showClear',
            title: {
              label: '显示取消选择按钮',
              tip: 'defaultActions.showClear | 是否显示取消选择按钮',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'defaultActions.showDelete',
            title: {
              label: '显示删除按钮',
              tip: 'defaultActions.showDelete | 是否显示删除按钮',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
        ],
      },
      // ========== 自定义操作按钮 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Custom Actions',
            'zh-CN': '自定义操作按钮',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'actions',
            title: {
              label: '操作按钮配置',
              tip: 'actions | 自定义操作按钮配置数组',
            },
            propType: {
              type: 'arrayOf',
              value: 'object',
            },
            setter: ['JsonSetter', 'VariableSetter'],
          },
          {
            name: 'actionOrder',
            title: {
              label: '按钮排序',
              tip: 'actionOrder | 操作按钮排序，通过 key 数组控制按钮顺序',
            },
            propType: {
              type: 'arrayOf',
              value: 'string',
            },
            setter: ['JsonSetter', 'VariableSetter'],
          },
        ],
      },
      // ========== 溢出处理 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Overflow',
            'zh-CN': '溢出处理',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'enableOverflow',
            title: {
              label: '启用溢出折叠',
              tip: 'enableOverflow | 是否启用溢出折叠',
            },
            propType: 'bool',
            setter: 'BoolSetter',
            defaultValue: true,
          },
          {
            name: 'overflowThreshold',
            title: {
              label: '溢出阈值',
              tip: 'overflowThreshold | 溢出折叠阈值（按钮数量）',
            },
            propType: 'number',
            setter: ['NumberSetter', 'VariableSetter'],
            defaultValue: 5,
          },
          {
            name: 'moreText',
            title: {
              label: '更多按钮文案',
              tip: 'moreText | "更多"按钮文案，默认使用国际化文本',
            },
            propType: 'string',
            setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
          },
        ],
      },
      // ========== 事件回调 ==========
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'Events',
            'zh-CN': '事件回调',
          },
        },
        display: 'block',
        type: 'group',
        items: [
          {
            name: 'onSelectAll',
            title: {
              label: '全选回调',
              tip: 'onSelectAll | 全选回调',
            },
            propType: 'func',
            setter: 'FunctionSetter',
          },
          {
            name: 'onInvert',
            title: {
              label: '反选回调',
              tip: 'onInvert | 反选回调，将当前选中的变为未选中，未选中的变为选中',
            },
            propType: 'func',
            setter: 'FunctionSetter',
          },
          {
            name: 'onClear',
            title: {
              label: '清空选择回调',
              tip: 'onClear | 清空选择回调',
            },
            propType: 'func',
            setter: 'FunctionSetter',
          },
          {
            name: 'onDelete',
            title: {
              label: '删除回调',
              tip: 'onDelete | 删除选中项回调，点击删除按钮并确认后触发',
            },
            propType: 'func',
            setter: 'FunctionSetter',
          },
          {
            name: 'deleteConfirmConfig',
            title: {
              label: '删除确认配置',
              tip: 'deleteConfirmConfig | 删除确认弹窗配置',
            },
            propType: 'object',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '弹窗标题',
                      setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
                    },
                    {
                      name: 'description',
                      title: '弹窗描述',
                      setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
                    },
                    {
                      name: 'okText',
                      title: '确认按钮文案',
                      setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
                    },
                    {
                      name: 'cancelText',
                      title: '取消按钮文案',
                      setter: ['PisellI18nSetter', 'StringSetter', 'VariableSetter'],
                    },
                  ],
                },
              },
            },
          },
          {
            name: 'onActionClick',
            title: {
              label: '自定义操作回调',
              tip: 'onActionClick | 自定义操作按钮点击回调，当 actions 中的按钮被点击时触发',
            },
            propType: 'func',
            setter: 'FunctionSetter',
          },
        ],
      },
    ],
    component: {
      isContainer: false,
    },
    supports: {
      style: true,
      className: true,
      events: [
        {
          name: 'onSelectAll',
          template: 'onSelectAll(${extParams}){\n// 全选回调\nconsole.log(\'onSelectAll\');}',
        },
        {
          name: 'onInvert',
          template: 'onInvert(${extParams}){\n// 反选回调\nconsole.log(\'onInvert\');}',
        },
        {
          name: 'onClear',
          template: 'onClear(${extParams}){\n// 清空选择回调\nconsole.log(\'onClear\');}',
        },
        {
          name: 'onDelete',
          template: 'onDelete(selectedKeys, selectedRows, ${extParams}){\n// 删除回调\nconsole.log(\'onDelete\', selectedKeys, selectedRows);}',
        },
        {
          name: 'onActionClick',
          template: 'onActionClick(key, selectedKeys, selectedRows, ${extParams}){\n// 自定义操作按钮点击回调\nconsole.log(\'onActionClick\', key, selectedKeys, selectedRows);}',
        },
      ],
    },
  },
};

export default {
  ...PisellBatchActionBarMeta,
  snippets,
};