import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
import { default as ColorArraySetter } from '../setter/ColorArraySetter';
import { default as CenterTabsSetter } from '../setter/CenterTabsSetter';
import Api from './api';

const BarChartMeta: IPublicTypeComponentMetadata = {
  componentName: 'BarChart',
  title: '柱状图',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  category: '图表',
  group: '精选组件',
  npm: {
    package: 'temp-materials',
    exportName: 'BarChart',
    main: 'src\\index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      // 常用配置
      {
        title: '常用配置',
        type: 'group',
        display: 'accordion',
        items: [
          // 柱体布局type
          {
            name: 'adjust',
            display: 'plain',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'type',
                      title: {
                        label: '柱体图类型',
                        tip: '设置主体图的展示类型',
                      },
                      setter: {
                        defaultValue: 'dodge',
                        componentName: 'RadioGroupSetter',
                        props: {
                          options: [
                            { title: '分组图', value: 'dodge' },
                            { title: '层叠图', value: 'stack' },
                          ],
                        },
                      },
                    },
                  ],
                },
              },
              initialValue: {
                type: 'dodge',
              },
            },
          },
          // 是否是条形图
          {
            title: {
              label: '条形图',
              tip: '是否以条形图形式展示',
            },
            name: 'isBar',
            setter: {
              componentName: 'BoolSetter',
              isRequired: false,
              initialValue: false,
            },
          },
          // 柱体圆角
          {
            name: 'barCircle',
            title: {
              label: '柱体圆角',
              tip: '是否开启柱体圆角(条形图不生效)',
            },
            condition: (target) => {
              return !target.parent.getPropValue('isBar');
            },
            setter: {
              componentName: 'BoolSetter',
              isRequired: true,
              initialValue: true,
            },
          },
          // 柱体图样式
          {
            name: 'styleType',
            title: {
              label: '柱体图样式',
              tip: '设置主体图样式,可选择智能样式和自定义样式',
            },
            setter: {
              componentName: 'RadioGroupSetter',
              props: {
                options: [
                  { title: '智能显示', value: 'smart' },
                  { title: '自定义', value: 'custom' },
                ],
              },
              initialValue: 'smart',
            },
          },
          // 柱体样式
          {
            name: 'theme',
            display: 'plain',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'size',
                      title: {
                        label: '柱形粗细',
                        tip: '设置柱体图的粗细,范围是0-100',
                      },
                      condition: (target) => {
                        return target.parent.parent.getPropValue('styleType') === 'custom';
                      },
                      setter: {
                        defaultValue: 15,
                        componentName: 'NumberSetter',
                        prop: {
                          min: 0,
                          max: 100,
                        },
                      },
                    },
                    {
                      name: 'maxColumnWidth',
                      title: {
                        label: '最大宽度',
                        tip: '设置柱体图允许的最大宽度',
                      },
                      condition: (target) => {
                        return target.parent.parent.getPropValue('styleType') === 'custom';
                      },
                      setter: {
                        defaultValue: 20,
                        componentName: 'NumberSetter',
                        prop: {
                          min: 0,
                          max: 100,
                        },
                      },
                    },
                    {
                      name: 'minColumnWidth',
                      title: {
                        label: '最小宽度',
                        tip: '设置柱体图允许的最小宽度',
                      },
                      condition: (target) => {
                        return target.parent.parent.getPropValue('styleType') === 'custom';
                      },
                      setter: {
                        defaultValue: 10,
                        componentName: 'NumberSetter',
                        prop: {
                          min: 0,
                          max: 100,
                        },
                      },
                    },
                  ],
                },
              },
              initialValue: {
                maxColumnWidth: 20,
                minColumnWidth: 10,
                size: 15,
              },
            },
          },
          //系列颜色
          {
            name: 'color',
            title: {
              label: '图表套色',
              tip: '设置图表的系列颜色,按系列顺序一一对应',
            },
            setter: {
              componentName: ColorArraySetter,
              isRequired: false,
              initialValue:
                '#2A8BFF,#F99300,#2DA84F,#FCD000,#7367EE,#72C4EC,#6D748F,#F9785A,#1F7D9A,#FBAAA6',
            },
          },
          // 标题
          {
            title: {
              label: '显示标题',
              tip: '是否显示标题',
            },
            name: 'hasTitle',
            setter: {
              componentName: 'BoolSetter',
              isRequired: true,
              initialValue: true,
            },
          },
          // 标题文本
          {
            title: {
              label: '标题文本',
              tip: '需要展示的标题文本,不填时,取所选数据集为标题',
            },
            name: 'titleText',
            setter: {
              componentName: 'StringSetter',
              initialValue: '',
            },
          },
        ],
      },
      // 坐标轴
      {
        title: '坐标轴',
        type: 'group',
        display: 'accordion',
        items: [
          {
            display: 'plain',
            name: 'axisType',
            setter: {
              componentName: CenterTabsSetter,
            },
          },
          // x轴
          {
            title: '横坐标',
            name: 'xAxis',
            condition: (target) => {
              return target.parent.getPropValue('axisType') === 'xAxis';
            },
            display: 'plain',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      title: {
                        label: '显示横轴',
                        tip: '控制横轴显示和隐藏',
                      },
                      name: 'visible',
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '标题',
                        tip: '控制标题显示和隐藏',
                      },
                      name: 'showTitle',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: false,
                      },
                    },
                    {
                      title: {
                        label: '标题内容',
                        tip: '设置横轴标题内容文本',
                      },
                      name: 'title',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('showTitle') &&
                          target.parent.getPropValue('visible')
                        );
                      },
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: false,
                        initialValue: '横轴标题',
                      },
                    },
                    {
                      title: {
                        label: '轴线',
                        tip: '是否显示横轴轴线',
                      },
                      name: 'line',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '刻度线',
                        tip: '是否显示横轴刻度线',
                      },
                      name: 'tickLine',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '网格线',
                        tip: '是否显示横轴网格线',
                      },
                      name: 'grid',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: false,
                      },
                    },
                    {
                      title: {
                        label: '轴标签',
                        tip: '是否显示横轴轴标签样式',
                      },
                      name: 'label',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '标签样式',
                        tip: '选择横轴轴标签样式设置方式',
                      },
                      name: 'labelType',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('label')
                        );
                      },
                      setter: {
                        componentName: 'RadioGroupSetter',
                        isRequired: false,
                        initialValue: 'defalut',
                        props: {
                          options: [
                            { label: '默认显示', value: 'defalut' },
                            { label: '自定义', value: 'custom' },
                          ],
                        },
                      },
                    },
                    {
                      title: {
                        label: '颜色',
                        tip: '设置横轴轴标签颜色',
                      },
                      name: 'labelColor',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'ColorSetter',
                        isRequired: false,
                        initialValue: '#171A1D',
                      },
                    },
                    {
                      title: {
                        label: '大小',
                        tip: '设置横轴轴标签文字大小',
                      },
                      name: 'labelSize',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 14,
                        props: {
                          min: 10,
                          max: 36,
                        },
                      },
                    },
                    {
                      title: {
                        label: '最大长度',
                        tip: '设置横轴轴标签最大长度展示方式',
                      },
                      name: 'labelLength',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'RadioGroupSetter',
                        isRequired: false,
                        initialValue: 'percent',
                        props: {
                          options: [
                            { label: '百分比', value: 'percent' },
                            { label: '固定值', value: 'fixed' },
                          ],
                        },
                      },
                    },
                    {
                      title: {
                        label: '占比',
                        tip: '设置横轴轴标签最大长度占比',
                      },
                      name: 'labelPercentWidth',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          target.parent.getPropValue('labelLength') === 'percent'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 30,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '长度',
                        tip: '设置横轴轴标签长度',
                      },
                      name: 'labelFixedWidth',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          target.parent.getPropValue('labelLength') === 'fixed'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 100,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '自动旋转',
                        tip: '横轴轴标签文本角度是否自动旋转',
                      },
                      name: 'autoRotate',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '旋转角度',
                        tip: '设置横轴轴标签文本角度',
                      },
                      name: 'labelRotateAngle',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          !target.parent.getPropValue('autoRotate')
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 0,
                        props: {
                          min: 0,
                          max: 360,
                        },
                      },
                    },
                    {
                      title: {
                        label: '自动稀疏',
                        tip: '是否开启横轴标签文本自动稀疏',
                      },
                      name: 'autoHide',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                  ],
                },
              },
            },
          },
          // y轴
          {
            title: '纵坐标',
            name: 'yAxis',
            condition: (target) => {
              return target.parent.getPropValue('axisType') === 'yAxis';
            },
            display: 'plain',
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      title: {
                        label: '显示纵轴',
                        tip: '是否显示纵轴',
                      },
                      name: 'visible',
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '标题',
                        tip: '是否显示纵轴标题',
                      },
                      name: 'showTitle',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: false,
                      },
                    },
                    {
                      title: {
                        label: '标题内容',
                        tip: '设置纵轴标题内容文本',
                      },
                      name: 'title',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('showTitle') &&
                          target.parent.getPropValue('visible')
                        );
                      },
                      setter: {
                        componentName: 'StringSetter',
                        isRequired: false,
                        initialValue: '纵轴标题',
                      },
                    },
                    {
                      title: {
                        label: '轴线',
                        tip: '是否显示纵轴轴线',
                      },
                      name: 'line',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '刻度线',
                        tip: '是否显示纵轴刻度线',
                      },
                      name: 'tickLine',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '网格线',
                        tip: '是否显示纵轴网格线',
                      },
                      name: 'grid',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: false,
                      },
                    },
                    {
                      title: {
                        label: '轴标签',
                        tip: '是否显示纵轴轴标签样式',
                      },
                      name: 'label',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '标签样式',
                        tip: '选择纵轴轴标签样式设置方式',
                      },
                      name: 'labelType',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('label')
                        );
                      },
                      setter: {
                        componentName: 'RadioGroupSetter',
                        isRequired: false,
                        initialValue: 'defalut',
                        props: {
                          options: [
                            { label: '默认显示', value: 'defalut' },
                            { label: '自定义', value: 'custom' },
                          ],
                        },
                      },
                    },
                    {
                      title: {
                        label: '颜色',
                        tip: '设置纵轴轴标签颜色',
                      },
                      name: 'labelColor',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'ColorSetter',
                        isRequired: false,
                        initialValue: '#171A1D',
                      },
                    },
                    {
                      title: {
                        label: '大小',
                        tip: '设置纵轴轴标签文字大小',
                      },
                      name: 'labelSize',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 14,
                        props: {
                          min: 10,
                          max: 36,
                        },
                      },
                    },
                    {
                      title: {
                        label: '最大长度',
                        tip: '设置纵轴轴标签最大长度展示方式',
                      },
                      name: 'labelLength',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'RadioGroupSetter',
                        isRequired: false,
                        initialValue: 'percent',
                        props: {
                          options: [
                            { label: '百分比', value: 'percent' },
                            { label: '固定值', value: 'fixed' },
                          ],
                        },
                      },
                    },
                    {
                      title: {
                        label: '占比',
                        tip: '设置纵轴轴标签最大长度占比',
                      },
                      name: 'labelPercentWidth',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          target.parent.getPropValue('labelLength') === 'percent'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 30,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '长度',
                        tip: '设置纵轴轴标签长度',
                      },
                      name: 'labelFixedWidth',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          target.parent.getPropValue('labelLength') === 'fixed'
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 100,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '自动旋转',
                        tip: '纵轴轴标签文本角度是否自动旋转',
                      },
                      name: 'autoRotate',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '旋转角度',
                        tip: '设置纵轴轴标签文本角度',
                      },
                      name: 'labelRotateAngle',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom' &&
                          !target.parent.getPropValue('autoRotate')
                        );
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        initialValue: 0,
                        props: {
                          min: 0,
                          max: 360,
                        },
                      },
                    },
                    {
                      title: {
                        label: '自动稀疏',
                        tip: '是否开启纵轴标签文本自动稀疏',
                      },
                      name: 'autoHide',
                      condition: (target) => {
                        return (
                          target.parent.getPropValue('visible') &&
                          target.parent.getPropValue('labelType') === 'custom'
                        );
                      },
                      setter: {
                        componentName: 'BoolSetter',
                        isRequired: false,
                        initialValue: true,
                      },
                    },
                    {
                      title: {
                        label: '最小值',
                        tip: '设置纵轴可显示数值的最小值',
                      },
                      name: 'min',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '最大值',
                        tip: '设置纵轴可显示数值的最大值',
                      },
                      name: 'max',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        props: {
                          min: 0,
                        },
                      },
                    },
                    {
                      title: {
                        label: '刻度数',
                        tip: '设置纵轴分段刻度数',
                      },
                      name: 'tickCount',
                      condition: (target) => {
                        return target.parent.getPropValue('visible');
                      },
                      setter: {
                        componentName: 'NumberSetter',
                        isRequired: false,
                        props: {
                          min: 0,
                        },
                        initialValue: 5,
                      },
                    },
                  ],
                },
              },
              isRequired: true,
            },
          },
        ],
      },
      // 图例
      {
        title: '图例',
        display: 'accordion',
        name: 'legend',
        setter: {
          componentName: 'ObjectSetter',
          props: {
            config: {
              items: [
                {
                  title: {
                    label: '显示图例',
                    tip: '是否显示图表图例',
                  },
                  name: 'visible',
                  setter: {
                    componentName: 'BoolSetter',
                    isRequired: false,
                    initialValue: true,
                  },
                },
                // 显示位置
                {
                  title: {
                    label: '显示位置',
                    tip: '设置图例的展示位置',
                  },
                  name: 'position',
                  condition: (target) => {
                    return target.parent.getPropValue('visible');
                  },
                  setter: [
                    {
                      componentName: 'SelectSetter',
                      props: {
                        options: [
                          { title: '上', value: 'top' },
                          { title: '上左', value: 'top-left' },
                          { title: '上右', value: 'top-right' },
                          { title: '左', value: 'left' },
                          { title: '左上', value: 'left-top' },
                          { title: '左下', value: 'left-bottom' },
                          { title: '右', value: 'right' },
                          { title: '右上', value: 'right-top' },
                          { title: '右下', value: 'right-bottom' },
                          { title: '下', value: 'bottom' },
                          { title: '下左', value: 'bottom-left' },
                          { title: '下右', value: 'bottom-right' },
                        ],
                      },
                    },
                  ],
                  defaultValue: 'bottom',
                },
                //是否分页
                {
                  title: {
                    label: '是否分页',
                    tip: '图例数量过多时是否开启分页(数量过少时不会分页)',
                  },
                  name: 'flipPage',
                  condition: (target) => {
                    return target.parent.getPropValue('visible');
                  },
                  setter: {
                    componentName: 'BoolSetter',
                    isRequired: false,
                    initialValue: true,
                  },
                },
              ],
            },
          },
        },
      },
      // 标签数据
      {
        title: '标签数据',
        name: 'label',
        display: 'accordion',
        setter: {
          componentName: 'ObjectSetter',
          props: {
            config: {
              items: [
                // 显示图例
                {
                  title: {
                    label: '显示标签',
                    tip: '是否在图表中显示标签',
                  },
                  name: 'visible',
                  setter: {
                    componentName: 'BoolSetter',
                    isRequired: true,
                    initialValue: true,
                  },
                },
                {
                  title: {
                    label: '展示样式',
                    tip: '选择智能显示样式或自定义配置标签样式',
                  },
                  name: 'displayType',
                  setter: [
                    {
                      componentName: 'RadioGroupSetter',
                      props: {
                        options: [
                          { title: '智能显示', value: 'smart' },
                          { title: '自定义', value: 'custom' },
                        ],
                      },
                    },
                  ],
                  defaultValue: 'smart',
                },
                {
                  name: 'style',
                  condition: (target) => {
                    return (
                      target.parent.getPropValue('visible') &&
                      target.parent.getPropValue('displayType') === 'custom'
                    );
                  },
                  display: 'plain',
                  setter: {
                    componentName: 'ObjectSetter',
                    props: {
                      config: {
                        items: [
                          {
                            title: {
                              title: '标签字号',
                              tip: '设置标签的字体大小,范围10-30',
                            },
                            name: 'fontSize',
                            setter: {
                              componentName: 'NumberSetter',
                              isRequired: false,
                              props: {
                                min: 10,
                                max: 30,
                              },
                              initialValue: 12,
                            },
                          },
                          {
                            title: {
                              label: '自动颜色',
                              tip: '标签颜色是否使用默认值',
                            },
                            name: 'autoFill',
                            setter: {
                              componentName: 'BoolSetter',
                              isRequired: true,
                              initialValue: true,
                            },
                          },
                          {
                            title: {
                              label: '文本颜色',
                              tip: '设置标签文本颜色',
                            },
                            name: 'fill',
                            condition: (target) => {
                              return !target.parent.getPropValue('autoFill');
                            },
                            setter: {
                              componentName: 'ColorSetter',
                              isRequired: false,
                              initialValue: '#000000',
                            },
                          },
                          {
                            title: {
                              label: '自动位置',
                              tip: '是否根据布局动态匹配标签位置',
                            },
                            name: 'autoPosition',
                            setter: {
                              componentName: 'BoolSetter',
                              isRequired: true,
                              initialValue: true,
                            },
                          },
                          {
                            title: {
                              label: '显示位置',
                              tip: '自主设置文本位置',
                            },
                            name: 'position',
                            condition: (target) => {
                              return !target.parent.getPropValue('autoPosition');
                            },
                            setter: [
                              {
                                componentName: 'SelectSetter',
                                props: {
                                  options: [
                                    { title: '顶部', value: 'top' },
                                    { title: '中间', value: 'middle' },
                                    { title: '底部', value: 'bottom' },
                                    { title: '左边', value: 'left' },
                                    { title: '右边', value: 'right' },
                                  ],
                                },
                              },
                            ],
                            defaultValue: 'middle',
                          },
                        ],
                      },
                    },
                  },
                },
              ],
            },
          },
        },
      },
      // 缩略轴
      {
        title: '缩略轴',
        name: 'slider',
        display: 'accordion',
        setter: {
          componentName: 'ObjectSetter',
          props: {
            config: {
              items: [
                // 显示图例
                {
                  title: {
                    label: '显示缩略轴',
                    tip: '是否显示缩略轴',
                  },
                  name: 'visible',
                  setter: {
                    componentName: 'BoolSetter',
                    isRequired: true,
                  },
                  defaultValue: false,
                },
                {
                  title: {
                    label: '起始范围',
                    tip: '设置缩略周起始范围,范围0-1,需小于结束范围',
                  },
                  name: 'start',
                  condition: (target) => {
                    return target.parent.getPropValue('visible');
                  },
                  setter: {
                    componentName: 'NumberSetter',
                    isRequired: true,
                    props: {
                      min: 0,
                      max: 1,
                      step: 0.1,
                    },
                    initialValue: 0,
                  },
                },
                {
                  title: {
                    label: '结束范围',
                    tip: '设置缩略轴结束范围,范围0-1,需大于结束范围',
                  },
                  name: 'end',
                  condition: (target) => {
                    return target.parent.getPropValue('visible');
                  },
                  setter: {
                    componentName: 'NumberSetter',
                    isRequired: true,
                    props: {
                      min: 0,
                      max: 1,
                      step: 0.1,
                    },
                    initialValue: 1,
                  },
                },
              ],
            },
          },
        },
      },
      // 提示信息
      {
        title: '提示信息',
        name: 'tooltip',
        display: 'accordion',
        setter: {
          componentName: 'ObjectSetter',
          props: {
            config: {
              items: [
                {
                  title: {
                    label: '开启',
                    tip: '是否开启提示信息',
                  },
                  name: 'visible',
                  setter: {
                    componentName: 'BoolSetter',
                    isRequired: false,
                  },
                  defaultValue: true,
                },
              ],
            },
          },
        },
      },
    ],
    supports: {
      style: true,
    },
    component: {},
    advanced: {
      context: {
        dataSourceProps: [
          { label: '横轴', props: 'xaxis', limit: 1 },
          { label: '纵轴', props: 'yaxis', limit: 99 },
          { label: '分组', props: 'group', limit: 1 },
          // { label: '参考线', props: 'line', limit: 99 },
        ],
        datasetProps: [
          { label: '条件过滤', props: 'filter', type: 'filter_btn' },
          { label: '显示前', props: 'limit', type: 'num_limit' },
        ],
      },
    },
  },
};
const snippets: IPublicTypeSnippet[] = [
  {
    title: '柱状图',
    screenshot: '',
    schema: {
      componentName: 'BarChart',
      props: {
        data: Api.defalutData,
        color: '#2A8BFF,#F99300,#2DA84F,#FCD000,#7367EE,#72C4EC,#6D748F,#F9785A,#1F7D9A,#FBAAA6',
        adjust: {
          type: 'dodge',
        },
        barCircle: true,
        yAxis: {
          visible: true,
          showTitle: false,
          title: '纵轴标题',
          line: true,
          tickLine: true,
          grid: false,
          label: true,
          labelType: 'defalut',
          labelColor: '#171A1D',
          labelSize: 14,
          labelLength: 'percent',
          labelPercentWidth: 30,
          labelFixedWidth: 100,
          autoRotate: true,
          autoHide: true,
          labelRotateAngle: 0,
          min: null,
          max: null,
          tickCount: 5,
        },
        hasTitle: true,
        titleText: '',
      },
    },
  },
];

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