import snippets from './snippets';

export default {
  snippets,
  componentName: 'QRCode',
  title: '二维码',
  category: '数据展示',
  docUrl: "",
  screenshot: "",
  devMode: "proCode",
  npm: {
    package: "@pisell/materials",
    version: "1.0.1",
    exportName: "QRCode",
    main: "src/index.tsx",
    destructuring: true,
    subName: "",
  },
  props: [
    {
      name: 'value',
      title: { label: '内容', tip: '内容' },
      propType: 'string',
    },
    {
      name: 'type',
      title: { label: '渲染类型', tip: '渲染类型' },
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [
            {
              title: 'Canvas',
              value: 'canvas',
            },
            {
              title: 'Svg',
              value: 'svg',
            },
          ],
        },
      },
    },
    {
      name: 'icon',
      title: { label: '二维码中图片的地址', tip: '二维码中图片的地址（目前只支持图片地址）' },
      propType: 'string',
    },
    {
      name: 'size',
      title: { label: '二维码大小', tip: '二维码大小' },
      propType: 'number',
    },
    {
      name: 'iconSize',
      title: { label: '二维码中图片的大小', tip: '二维码中图片的大小' },
      propType: 'number',
    },
    {
      name: 'color',
      description: '二维码颜色',
      propType: 'string',
      setter: 'ColorSetter',
    },
    {
      name: 'bgColor',
      description: '二维码背景颜色',
      propType: 'string',
      setter: 'ColorSetter',
    },
    {
      name: 'bordered',
      title: { label: '是否有边框', tip: '是否有边框' },
      propType: 'bool',
      setter: 'BoolSetter'
    },
    {
      name: 'errorLevel',
      title: { label: '二维码纠错等级', tip: '通常情况下二维码分为 4 个纠错级别：L级 可纠正约 7% 错误、M级 可纠正约 15% 错误、Q级 可纠正约 25% 错误、H级 可纠正约30% 错误。并不是所有位置都可以缺损，像最明显的三个角上的方框，直接影响初始定位。中间零散的部分是内容编码，可以容忍缺损。当二维码的内容编码携带信息比较少的时候，也就是链接比较短的时候，设置不同的纠错等级，生成的图片不会发生变化。' },
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [
            {
              title: 'L',
              value: 'L',
            },
            {
              title: 'M',
              value: 'M',
            },
            {
              title: 'Q',
              value: 'Q',
            },
            {
              title: 'H',
              value: 'H',
            },
          ],
        },
      },
    },
    {
      name: 'preview',
      title: { label: '预览功能', tip: '是否开启预览功能,点击放大展示' },
      propType: 'bool',
      setter: 'BoolSetter'
    },
    {
      name: 'status',
      title: { label: '二维码状态', tip: '二维码状态' },
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [
            {
              title: 'active',
              value: 'active',
            },
            {
              title: 'expired',
              value: 'expired',
            },
            {
              title: 'loading',
              value: 'loading',
            },
          ],
        },
      },
    },
  ],
  configure: {
    supports: {
      style: true,
      events: [
        {
          name: 'onRefresh',
          template: "onRefresh(event,${extParams}){\n// 刷新\nconsole.log('onClose',event);}",
        },
        {
          name: "onClick",
          template:
            "onClick(event,${extParams}){\n// 点击时的回调\nconsole.log('onClick', event);}",
        },
      ],
    },
  },
};