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

export const DataVStatistic: IPublicTypeComponentMetadata = {
  componentName: 'DataVStatistic',
  title: 'DataVStatistic',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  group: '云仓大屏',
  category: '其他',
  npm: {
    package: '@ztocwst/datav-materials',
    version: '0.1.1',
    exportName: 'DataVStatistic',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        name: 'loading',
        title: '数值是否加载中',
        setter: 'BoolSetter',
        defaultValue: false,
      },
      {
        name: 'decimalSeparator',
        title: { label: '设置小数点', tip: '设置小数点' },
        setter: 'StringSetter',
        defaultValue: '.',
      },
      {
        name: 'formatter',
        title: { label: '自定义数值展示', tip: '自定义数值展示' },
        setter: 'FunctionSetter',
      },
      {
        name: 'groupSeparator',
        title: { label: '设置千分位标识符', tip: '设置千分位标识符' },
        setter: 'StringSetter',
        defaultValue: '',
      },
      {
        name: 'precision',
        title: { label: '数值精度', tip: '数值精度' },
        setter: 'NumberSetter',
      },
      {
        name: 'prefix',
        title: { label: '设置数值的前缀', tip: '设置数值的前缀' },
        setter: ['I18nSetter', 'SlotSetter'],
      },
      {
        name: 'suffix',
        title: { label: '设置数值的后缀', tip: '设置数值的后缀' },
        setter: ['I18nSetter', 'SlotSetter'],
      },
      {
        name: 'title',
        title: { label: '数值的标题', tip: '数值的标题' },
        setter: ['I18nSetter', 'SlotSetter'],
      },
      //   {
      //     name: 'titleSuffix',
      //     title: '标题后缀',
      //     setter: ['I18nSetter', 'SlotSetter'],
      //   },
      //   {
      //     name: 'titleExtra',
      //     title: '标题附加内容',
      //     setter: ['I18nSetter', 'SlotSetter'],
      //   },
      {
        name: 'value',
        title: { label: '数值内容', tip: '数值内容' },
        setter: ['I18nSetter', 'NumberSetter'],
      },
      //   {
      //     name: 'valueExtra',
      //     title: '值附加内容',
      //     setter: ['I18nSetter', 'SlotSetter'],
      //   },
      {
        name: 'style',
        title: { label: '设置组件的样式', tip: '设置组件的样式' },
        display: 'accordion',
        type: 'group',
        items: [
          {
            name: 'style',
            title: { label: '设置组件的样式', tip: '设置组件的样式' },
            // 不显示title
            display: 'plain',
            description: '返回上级',
            setter: {
              componentName: 'StyleSetter',
            },
            defaultValue: {
              display: 'flex',
	            alignItems: 'center'
            },
          },
        ],
      },
      {
        name: 'titleStyle',
        title: { label: '设置标题的样式', tip: '设置标题的样式' },
        display: 'accordion',
        type: 'group',
        items: [
          {
            name: 'titleStyle',
            title: { label: '设置标题的样式', tip: '设置标题的样式' },
            // 不显示title
            display: 'plain',
            description: '返回上级',
            setter: {
              componentName: 'StyleSetter',
              props: {
                showModuleList: ['font', 'color'],
              },
            },
          },
        ],
      },
      {
        name: 'valueStyle',
        title: { label: '设置数值的样式', tip: '设置数值的样式' },
        // 这里与pointer-block子节点复用（pointer-block需要再drawer里显示，用不了entry），所以改为了accordion
        display: 'accordion',
        type: 'group',
        items: [
          {
            name: 'valueStyle',
            title: { label: '设置数值的样式', tip: '设置数值的样式' },
            // 不显示title
            display: 'plain',
            description: '返回上级',
            setter: {
              componentName: 'StyleSetter',
              props: {
                showModuleList: ['font', 'color'],
              },
            },
          },
        ],
      },
    ],
    supports: {
      style: true,
    },
    component: {
      // isContainer: true,
    },
  },
};
const snippets: IPublicTypeSnippet[] = [
  {
    title: '统计数值',
    screenshot: 'https://files.ztocwst.com/download/1ccd07aeea7c4d73b0b2ff3cfcb7802a?isShow=true',
    schema: {
      componentName: 'DataVStatistic',
      props: {
        title: '待处理件数',
        value: 16589,
        style: {
          display: 'flex',
          alignItems: 'center',
          // justifyContent: 'center',
        },
      },
    },
  },
];

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