gepic/dist/ui/antd/select/index.js

基于vue3的设计器,可视化开发页面表单

const l = {
  component: async () => (await import("ant-design-vue")).Select,
  groupName: "表单",
  icon: "icon--epic--select",
  sort: 900,
  defaultSchema: {
    label: "选择框",
    type: "select",
    field: "select",
    input: !0,
    componentProps: {
      options: [
        {
          label: "选项1",
          value: "选项1"
        },
        {
          label: "选项2",
          value: "选项2"
        }
      ],
      placeholder: "请选择"
    }
  },
  config: {
    attribute: [
      {
        label: "字段名",
        type: "input",
        field: "field"
      },
      {
        label: "标题",
        type: "input",
        field: "label"
      },
      {
        label: "占位内容",
        type: "input",
        field: "componentProps.placeholder",
        componentProps: {
          placeholder: "请输入"
        }
      },
      {
        label: "默认值",
        type: "select",
        field: "componentProps.defaultValue"
      },
      {
        label: "尺寸",
        type: "select",
        componentProps: {
          placeholder: "请选择",
          allowClear: !0,
          options: [
            {
              label: "大号",
              value: "large"
            },
            {
              label: "中等",
              value: "middle"
            },
            {
              label: "小型",
              value: "small"
            }
          ]
        },
        field: "componentProps.size"
      },
      {
        label: "弹窗高度",
        type: "number",
        componentProps: {
          placeholder: "请输入"
        },
        field: "componentProps.listHeight"
      },
      {
        label: "模式",
        type: "select",
        componentProps: {
          options: [
            {
              label: "multiple",
              value: "multiple"
            },
            {
              label: "tags",
              value: "tags"
            },
            {
              label: "combobox",
              value: "combobox"
            }
          ],
          placeholder: "请选择",
          allowClear: !0
        },
        field: "componentProps.mode"
      },
      {
        label: "可搜索",
        type: "switch",
        field: "componentProps.showSearch"
      },
      {
        label: "选中选项后清空搜索框",
        type: "switch",
        field: "componentProps.autoClearSearchValue",
        show: ({ values: e }) => e.componentProps.mode && e.componentProps.showSearch
      },
      {
        label: "最大tag文本长度",
        type: "number",
        field: "componentProps.maxTagTextLength",
        show: ({ values: e }) => e.componentProps.mode
      },
      {
        label: "最大tag显示数",
        type: "number",
        field: "componentProps.maxTagCount",
        show: ({ values: e }) => e.componentProps.mode
      },
      {
        label: "弹出框位置",
        type: "select",
        componentProps: {
          placeholder: "请选择",
          allowClear: !0,
          options: [
            {
              label: "bottomLeft",
              value: "bottomLeft"
            },
            {
              label: "bottomRight",
              value: "bottomRight"
            },
            {
              label: "topLeft",
              value: "topLeft"
            },
            {
              label: "topRight",
              value: "topRight"
            }
          ]
        },
        field: "componentProps.placement"
      },
      {
        label: "无边框",
        type: "switch",
        componentProps: {
          checkedValue: !1,
          unCheckedValue: !0
        },
        field: "componentProps.bordered"
      },
      {
        label: "可清空",
        type: "switch",
        field: "componentProps.allowClear"
      },
      {
        label: "labelInValue",
        type: "switch",
        field: "componentProps.labelInValue"
      },
      {
        label: "禁用",
        type: "switch",
        field: "componentProps.disabled"
      },
      {
        label: "隐藏",
        type: "switch",
        field: "componentProps.hidden"
      },
      {
        label: "选项管理",
        type: "EOptionsEditor",
        layout: "vertical",
        field: "componentProps.options"
      },
      {
        label: "表单校验",
        type: "ERuleEditor",
        layout: "vertical",
        field: "rules",
        describe: "校验规则需要配合表单使用"
      }
    ],
    event: [
      {
        type: "change",
        describe: "值修改"
      },
      {
        type: "focus",
        describe: "获取焦点"
      },
      {
        type: "blur",
        describe: "失去焦点"
      }
    ],
    action: [
      {
        type: "focus",
        describe: "使 input 获取焦点"
      },
      {
        type: "blur",
        describe: "使 input 失去焦点"
      },
      {
        type: "select",
        describe: "选中 input 中的文字"
      }
    ]
  },
  bindModel: "value"
};
export {
  l as default
};