import { ComponentMetadata } from '@alilc/lowcode-types';
import snippets from './snippets';

const SaasLoginMeta: ComponentMetadata = {
  componentName: 'SaasLogin',
  title: 'Saas登录',
  docUrl: '',
  screenshot: '',
  category: '表单',
  devMode: 'proCode',
  npm: {
    package: '@pisell/private-materials',
    version: '1.0.0',
    exportName: 'SaasLogin',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  props: [],
  configure: {
    props: [
      {
        title: {
          label: 'LoginHeader',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'showLogo',
            title: { label: '显示Logo' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'logo',
            title: { label: 'Logo图片' },
            propType: 'string',
            setter: 'ImageSetter',
          },
          {
            name: 'logoPosition',
            title: { label: 'Logo位置' },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { label: '居左', value: 'left' },
                  { label: '居中', value: 'center' },
                  { label: '居右', value: 'right' },
                ],
              },
            },
            defaultValue: 'center',
          },
          {
            name: 'logoSize',
            title: { label: 'Logo尺寸' },
            propType: 'object',
            display: 'inline',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'width',
                      title: '宽度',
                      setter: 'NumberSetter',
                    },
                    {
                      name: 'height',
                      title: '高度',
                      setter: 'NumberSetter',
                    },
                  ],
                },
              },
            },
          },
        ],
      },
      {
        title: {
          label: '欢迎语',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'showWelcomeMessage',
            title: { label: '显示欢迎语' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'welcomeMessage',
            title: { label: '欢迎语文案' },
            propType: 'string',
            setter: 'PisellI18nSetter',
          },
          {
            name: 'welcomeMessageAlign',
            title: { label: '位置' },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { label: '居左', value: 'left' },
                  { label: '居中', value: 'center' },
                  { label: '居右', value: 'right' },
                ],
              },
            },
          },
        ],
      },
      {
        title: {
          label: '标题',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'showTitle',
            title: { label: '显示标题' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'title',
            title: { label: '标题文案' },
            propType: 'string',
            setter: 'PisellI18nSetter',
          },
          {
            name: 'titleAlign',
            title: { label: '位置' },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { label: '居左', value: 'left' },
                  { label: '居中', value: 'center' },
                  { label: '居右', value: 'right' },
                ],
              },
            },
          },
        ],
      },
      {
        title: {
          label: '副标题',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'showSubtitle',
            title: { label: '显示副标题' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'subtitle',
            title: { label: '副标题文案' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          {
            name: 'subtitleAlign',
            title: { label: '位置' },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { label: '居左', value: 'left' },
                  { label: '居中', value: 'center' },
                  { label: '居右', value: 'right' },
                ],
              },
            },
          },
        ],
      },
      {
        title: {
          label: 'LoginForm',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'emailLabel',
            title: { label: '邮箱标题' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          {
            name: 'emailPlaceholder',
            title: { label: '邮箱输入提示' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          {
            name: 'passwordLabel',
            title: { label: '密码标题' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          {
            name: 'passwordPlaceholder',
            title: { label: '密码输入提示' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          {
            name: 'buttonText',
            title: { label: '按钮文本' },
            propType: {
              type: 'oneOfType',
              value: ['node', 'string'],
            },
            setter: 'PisellI18nSetter',
          },
          //   {
          //     name: 'showRememberMe',
          //     title: { label: '记住密码' },
          //     propType: 'bool',
          //     defaultValue: true,
          //     setter: 'BoolSetter',
          //   },
          //   {
          //     name: 'rememberMeText',
          //     title: { label: '记住密码文案' },
          //     propType: {
          //       type: 'oneOfType',
          //       value: ['node', 'string'],
          //     },
          //     setter: ['SlotSetter', 'PisellI18nSetter', 'VariableSetter'],
          //   },
          //   {
          //     name: 'showForgotPassword',
          //     title: { label: '忘记密码' },
          //     propType: 'bool',
          //     defaultValue: true,
          //     setter: 'BoolSetter',
          //   },
          //   {
          //     name: 'forgotPasswordText',
          //     title: { label: '忘记密码文案' },
          //     propType: {
          //       type: 'oneOfType',
          //       value: ['node', 'string'],
          //     },
          //     setter: ['SlotSetter', 'PisellI18nSetter', 'VariableSetter'],
          //   },
        ],
      },
      {
        title: {
          label: '注册入口',
        },
        type: 'group',
        display: 'block',
        items: [
          {
            name: 'showRegister',
            title: { label: '显示注册入口' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'registerAlign',
            title: { label: '位置' },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { label: '居左', value: 'left' },
                  { label: '居中', value: 'center' },
                  { label: '居右', value: 'right' },
                ],
              },
            },
          },
          {
            name: 'showRegisterText',
            title: { label: '显示标题' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'registerText',
            title: { label: '标题' },
            propType: {
              type: 'oneOfType',
              value: ['string', 'object'],
            },
            setter: {
              componentName: 'PisellI18nSetter',
            },
          },
          {
            name: 'showRegisterLinkText',
            title: { label: '显示文本按钮' },
            propType: 'bool',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            name: 'registerLinkText',
            title: { label: '文本按钮文案' },
            propType: {
              type: 'oneOfType',
              value: ['string', 'object'],
            },
            setter: {
              componentName: 'PisellI18nSetter',
            },
          },
        ],
      },
    ],
    supports: {
      style: true,
      events: [
        {
          name: 'onLogin',
          description: '点击登录按钮时的回调',
        },
        {
          name: 'onGoRegister',
          description: '点击去注册按钮时的回调',
        },
      ],
    },
    component: {
      isContainer: false,
    },
  },
};

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