import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types'

const NavigationMeta: IPublicTypeComponentMetadata = {
  group: '低代码组件',
  componentName: 'Navigation',
  title: '底部导航',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  category: '引导',
  npm: {
    package: '@dckj-npm/dc-material',
    version: '0.1.8',
    exportName: 'Navigation',
    main: 'src\\index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'itemArray',
            'zh-CN': '导航项',
          },
        },
        name: 'itemArray',
        setter: {
          componentName: 'ArraySetter',
          props: {
            itemSetter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      title: {
                        label: {
                          type: 'i18n',
                          'en-US': 'text',
                          'zh-CN': '名称',
                        },
                      },
                      name: 'text',
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: true,
                        initialValue: '',
                      },
                    },
                    {
                      title: {
                        label: {
                          type: 'i18n',
                          'en-US': 'icon',
                          'zh-CN': '图标',
                        },
                      },
                      name: 'icon',
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: true,
                        initialValue: '',
                      },
                    },
                    {
                      title: {
                        label: {
                          type: 'i18n',
                          'en-US': 'selectedIcon',
                          'zh-CN': '选中图标',
                        },
                      },
                      name: 'selectedIcon',
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: true,
                        initialValue: '',
                      },
                    },
                    {
                      title: '跳转页面',
                      name: 'pageId',
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: true,
                        initialValue: '',
                      },
                    },
                  ],
                  extraSetter: {
                    componentName: 'MixedSetter',
                    isRequired: false,
                    props: {},
                  },
                },
              },
            },
          },
          isRequired: true,
          initialValue: [],
        },
      },
      {
        title: {
          label: {
            type: 'i18n',
            'en-US': 'selectedColor',
            'zh-CN': '选中颜色',
          },
        },
        name: 'selectedColor',
        setter: 'ColorSetter',
      },
    ],
    supports: {
      style: true,
      events: [
        {
          name: 'onClick',
          // template: "onSearch(params,${extParams}){\n window.location.href=`http://localhost:4500/preview.html?pathId=${params.pathId}`;\n console.log(params.pathId) \n}"
        },
      ],
    },
    component: {
      disableBehaviors: ['copy'],
    },
  },
}
const snippets: IPublicTypeSnippet[] = [
  {
    title: '底部导航',
    screenshot: '',
    schema: {
      componentName: 'Navigation',
      props: {
        selectedColor: '#EB7244',
        itemArray: [
          {
            text: '首页',
            icon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048652967890259968.png',
            selectedIcon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048653089051119616.png',
          },
          {
            text: '消息',
            icon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048653230705348608.png',
            selectedIcon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048653358677757952.png',
          },
          {
            text: '礼品',
            icon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048649679614644224.png',
            selectedIcon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048650840912564224.png',
          },
          {
            text: '我的',
            icon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048650981727932416.png',
            selectedIcon:
              'https://52pupu.com/source/api/upload/936702478408355840/2024/202410/20241029/1048652834045825024.png',
          },
        ],
      },
    },
  },
]

export default {
  ...NavigationMeta,
  snippets,
}