syber-lowcode-business-materials/lowcode/custom-directory/meta.ts

syber-lowcode-business-materials

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

const CustomDirectoryMeta: IPublicTypeComponentMetadata = {
  priority: 10,
  componentName: "CustomDirectory",
  title: "自定义目录",
  group: '高级组件',
  category: '通用',
  docUrl: "",
  screenshot: "",
  configure: {
    props: [
      {
        title: {
          label: "目录唯一Key"
        },
        name: "customKey",
        setter: {
          componentName: "StringSetter",
          isRequired: true,
          initialValue: "test_0001"
        }
      },
      {
        title: '文案定制',
        display: 'block',
        type: 'group',
        items: [
          {
            title: {
              label: '隐藏标题',
            },
            name: 'hideTitle',
            defaultValue: false,
            setter: 'BoolSetter',
          },
          {
            title: {
              label: "目录标题"
            },
            name: "title",
            setter: {
              componentName: "StringSetter",
              isRequired: true,
              initialValue: "通用目录"
            }
          },
          {
            title: {
              label: "目录名称"
            },
            name: "subTitle",
            setter: {
              componentName: "StringSetter",
              isRequired: true,
              initialValue: "可修改此处文案"
            }
          },
          {
            title: {
              label: "分组称谓"
            },
            name: "groupName",
            setter: {
              componentName: "StringSetter",
              isRequired: true,
              initialValue: "分组"
            }
          },
          {
            title: {
              label: "子项称谓"
            },
            name: "itemName",
            setter: {
              componentName: "StringSetter",
              isRequired: true,
              initialValue: "子项"
            }
          }
        ]
      },
      {
        title: '模式定制',
        display: 'block',
        type: 'group',
        items: [
          {
            title: {
              label: "最大层级"
            },
            name: "maxLevel",
            setter: {
              componentName: 'NumberSetter',
              isRequired: true,
              initialValue: 3,
              props: {
                min: 1,
                max: 6,
              },
            },
          },
          {
            title: {
              label: '显示分组子项数量',
            },
            name: 'showGroupNum',
            defaultValue: true,
            setter: 'BoolSetter',
          },
          {
            title: {
              label: '空分组的子项数量',
              tip: '空分组是否仍然展示子元素数量',
            },
            name: 'showEmptyMark',
            defaultValue: true,
            setter: 'BoolSetter',
          },
        ]
      },
      {
        title: '样式定制',
        display: 'block',
        type: 'group',
        items: [
          {
            title: {
              label: "每层缩进"
            },
            name: "childIndent",
            setter: {
              componentName: 'NumberSetter',
              isRequired: true,
              initialValue: 24,
              props: {
                min: 0,
                max: 100,
              },
            },
          },
          {
            title: {
              label: '隐藏分组箭头',
            },
            name: 'hideArrow',
            defaultValue: false,
            setter: 'BoolSetter',
          },
          {
            title: {
              label: '透明背景',
            },
            name: 'backgroundTransparent',
            defaultValue: false,
            setter: 'BoolSetter',
          },
        ]
      },
      {
        title: '权限(仅对预览模式做限制)',
        name: 'permission',
        setter: {
          componentName: 'ObjectSetter',
          props: {
            config: {
              items: [
                {
                  title: {
                    label: '拖拽排序',
                  },
                  name: 'couldDrag',
                  defaultValue: false,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '新增分组',
                  },
                  name: 'couldAddGroup',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '新增子项目',
                  },
                  name: 'couldAddItem',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '编辑分组',
                  },
                  name: 'couldEditGroup',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '编辑子项',
                  },
                  name: 'couldEditItem',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '删除分组',
                  },
                  name: 'couldDeleteGroup',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
                {
                  title: {
                    label: '删除子项',
                  },
                  name: 'couldDeleteItem',
                  defaultValue: true,
                  setter: 'BoolSetter',
                },
              ]
            }
          }
        }
      }
    ],
    supports: {
      style: true,
      events: [
        {
          name: 'onDirectoryDataGet',
          template:
            "\nonDirectoryDataGet(event,${extParams}){\n// 目录数据获取后的回调\nconsole.log('onDirectoryDataGet', event);}",
        },
        {
          name: 'onDirectoryTitleClick',
          template:
            "\nonDirectoryTitleClick(event,${extParams}){\n// 点击目录标题的回调\nconsole.log('onDirectoryTitleClick', event);}",
        },
        {
          name: 'onDirectoryGroupSelected',
          template:
            "\nonDirectoryGroupSelected(event,${extParams}){\n// 分组选中时的回调\nconsole.log('onDirectoryGroupSelected', event);}",
        },
        {
          name: 'onDirectoryItemSelected',
          template:
            "\nonDirectoryItemSelected(event,${extParams}){\n// 子项选中时的回调\nconsole.log('onDirectoryItemSelected', event);}",
        },
        {
          name: 'onDirectoryGroupAdd',
          template:
            "\nonDirectoryGroupAdd(event,${extParams}){\n// 分组新增成功的回调\nconsole.log('onDirectoryGroupAdd', event);}",
        },
        {
          name: 'onDirectoryItemAdd',
          template:
            "\nonDirectoryItemAdd(event,${extParams}){\n// 子项新增成功的回调\nconsole.log('onDirectoryItemAdd', event);}",
        },
        {
          name: 'onDirectoryGroupEdit',
          template:
            "\nonDirectoryGroupEdit(event,${extParams}){\n// 分组编辑成功的回调\nconsole.log('onDirectoryGroupEdit', event);}",
        },
        {
          name: 'onDirectoryItemEdit',
          template:
            "\nonDirectoryItemEdit(event,${extParams}){\n// 子项编辑成功的回调\nconsole.log('onDirectoryItemEdit', event);}",
        },
        {
          name: 'onDirectoryGroupDelete',
          template:
            "\nonDirectoryGroupDelete(event,${extParams}){\n// 分组删除成功的回调\nconsole.log('onDirectoryGroupDelete', event);}",
        },
        {
          name: 'onDirectoryItemDelete',
          template:
            "\nonDirectoryItemDelete(event,${extParams}){\n// 子项删除成功的回调\nconsole.log('onDirectoryItemDelete', event);}",
        },
      ],
    },
    component: {}
  }
};
const snippets: IPublicTypeSnippet[] = [
  {
    title: "自定义目录",
    screenshot: require('./__screenshots__/custom-directory-1.png'),
    schema: {
      componentName: "CustomDirectory",
      props: {}
    }
  }
];

export default {
  ...CustomDirectoryMeta,
  snippets
};