import {
  IPublicTypeComponentMetadata,
  IPublicTypeSnippet,
} from '@alilc/lowcode-types';
import { AntdIconSetter } from "../_setters";

const PisellAppCardMeta: IPublicTypeComponentMetadata = {
  componentName: 'PisellAppCard',
  title: 'PisellAppCard',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/materials',
    version: '1.0.3',
    exportName: 'PisellAppCard',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        name: 'avatar',
        title: '头像',
        setter: 'StringSetter',
      },
      {
        name: "icon",
        title: '图标',
        setter: AntdIconSetter,
      },
      {
        name: 'tags',
        title: '标签',
        setter: {
          componentName: 'ArraySetter',
          props: {
            itemSetter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'label',
                      title: '标签文本',
                      setter: 'StringSetter',
                    },
                    {
                      name: 'type',
                      title: { label: '展示类型' },
                      setter: {
                        componentName: 'RadioGroupSetter',
                        props: {
                          options: [
                            {
                              title: '填充',
                              value: 'pill_color',
                            },
                            {
                              title: '边框',
                              value: 'pill_outline',
                            },
                          ],
                        },
                      },
                      propType: {
                        type: 'oneOf',
                        value: ['pill_color', 'pill_outline'],
                      },
                      defaultValue: 'pill_color',
                    },
                    {
                      name: 'color',
                      title: { label: '颜色' },
                      setter: [
                        {
                          componentName: 'RadioGroupSetter',
                          props: {
                            options: [
                              {
                                title: 'Success',
                                value: 'success',
                              },
                              {
                                title: 'Warning',
                                value: 'warning',
                              },
                              {
                                title: 'Error',
                                value: 'error',
                              },
                              {
                                title: 'Gray',
                                value: 'gray',
                              },
                            ],
                          },
                        },
                        'ColorSetter',
                        'StringSetter',
                      ],
                      propType: {
                        type: 'oneOf',
                        value: ['success', 'warning', 'error', 'gray'],
                      },
                      defaultValue: 'success',
                    },
                  ],
                },
              },
              initialValue: () => {
                return {
                  label: '标签1',
                  type: 'pill_color',
                  color: 'success',
                };
              },
            },
          },
        },
      },
      {
        name: 'title',
        title: '标题',
        setter: 'PisellI18nSetter',
      },
      {
        name: 'description',
        title: '描述',
        setter: 'PisellI18nSetter',
      },
      {
        name: 'bottomButtons',
        title: '底部按钮',
        setter: {
          componentName: 'ArraySetter',
          props: {
            itemSetter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'label',
                      title: '按钮文本',
                      setter: 'PisellI18nSetter',
                    },
                    {
                      name: 'type',
                      title: '按钮类型',
                      setter: {
                        componentName: 'SelectSetter',
                        props: {
                          options: [
                            {
                              title: 'primary button',
                              value: 'primary',
                            },
                            {
                              title: 'default button',
                              value: 'default',
                            },
                            {
                              title: 'dashed button',
                              value: 'dashed',
                            },
                            {
                              title: 'danger button',
                              value: 'danger',
                            },
                            {
                              title: 'link button',
                              value: 'link',
                            },
                            {
                              title: 'text button',
                              value: 'text',
                            },
                          ],
                        },
                      },
                    },
                    {
                      name: 'onClick',
                      title: '点击事件',
                      setter: 'FunctionSetter',
                    },
                    {
                      name: 'hidden',
                      title: '隐藏',
                      setter: 'BoolSetter',
                    },
                  ],
                },
              },
              initialValue: () => {
                return {
                  label: '查看详情',
                };
              },
            },
          },
        },
      },
      {
        name: 'moreActions',
        title: '更多操作',
        setter: {
          componentName: 'ArraySetter',
          props: {
            itemSetter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'label',
                      title: '操作文本',
                      setter: 'PisellI18nSetter',
                    },
                    {
                      name: 'onClick',
                      title: '点击事件',
                      setter: 'FunctionSetter',
                    },
                  ],
                },
              },
              initialValue: () => {
                return {
                  label: '查看详情',
                };
              },
            },
          },
        },
      },
    ],
    component: {
      isContainer: true,
    },
    supports: {
      style: true,
      className: true,
    },
  },
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: 'PisellAppCard',
    screenshot: '',
    schema: {
      componentName: 'PisellAppCard',
      props: {
        title: '应用名称',
        description: '这是一个示例应用描述',
        avatar:
          'https://pisell2-dev.s3.cn-north-1.amazonaws.com.cn/media/tenant-0/2025/01/21/01jj3913k6jdxt1qw6n1rxjyn5.png',
        tags: [
          {
            label: '标签1',
            type: 'pill_color',
            color: 'success',
          },
        ],
        moreActions: [
          {
            label: '查看详情',
          },
        ],
        bottomButtons: [
          {
            label: '查看详情',
          },
        ],
      },
    },
  },
];

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