diff --git a/src/components/FormCreate/src/components/useCurrencySelect.tsx b/src/components/FormCreate/src/components/useCurrencySelect.tsx index 8da0b696..82d708c6 100644 --- a/src/components/FormCreate/src/components/useCurrencySelect.tsx +++ b/src/components/FormCreate/src/components/useCurrencySelect.tsx @@ -37,6 +37,11 @@ export const useCurrencySelect = (option: CurrencySelectProps) => { type: String, default: 'select' } + // // 是否多选 + // multiple: { + // type: Boolean, + // default: false + // } }, setup(props) { const attrs = useAttrs() @@ -79,15 +84,14 @@ export const useCurrencySelect = (option: CurrencySelectProps) => { onMounted(async () => { await getOptions() }) + // TODO puhui999: 单下拉多选的时候页面会卡住报错,下次解决 const buildSelect = () => { return ( - <> - - {options.value.map((item, index) => ( - - ))} - - + + {options.value.map((item, index) => ( + + ))} + ) } const buildCheckbox = () => { @@ -98,13 +102,11 @@ export const useCurrencySelect = (option: CurrencySelectProps) => { ] } return ( - <> - - {options.value.map((item, index) => ( - - ))} - - + + {options.value.map((item, index) => ( + + ))} + ) } const buildRadio = () => { @@ -115,15 +117,13 @@ export const useCurrencySelect = (option: CurrencySelectProps) => { ] } return ( - <> - - {options.value.map((item, index) => ( - - {item.label} - - ))} - - + + {options.value.map((item, index) => ( + + {item.label} + + ))} + ) } return () => ( diff --git a/src/components/FormCreate/src/useFormCreateDesigner.ts b/src/components/FormCreate/src/useFormCreateDesigner.ts index 69772bd5..3875b72c 100644 --- a/src/components/FormCreate/src/useFormCreateDesigner.ts +++ b/src/components/FormCreate/src/useFormCreateDesigner.ts @@ -25,6 +25,30 @@ export const useFormCreateDesigner = async (designer: Ref) => { const uploadFileRule = useUploadFileRule() const uploadImgRule = useUploadImgRule() const uploadImgsRule = useUploadImgsRule() + + /** + * 构建表单组件 + */ + const buildFormComponents = () => { + // 移除自带的上传组件规则,使用 uploadFileRule、uploadImgRule、uploadImgsRule 替代 + designer.value?.removeMenuItem('upload') + // 移除自带的富文本组件规则,使用 editorRule 替代 + designer.value?.removeMenuItem('fc-editor') + const components = [editorRule, uploadFileRule, uploadImgRule, uploadImgsRule] + components.forEach((component) => { + // 插入组件规则 + designer.value?.addComponent(component) + // 插入拖拽按钮到 `main` 分类下 + designer.value?.appendMenuItem('main', { + icon: component.icon, + name: component.name, + label: component.label + }) + }) + } + + const userSelectRule = useSelectRule({ name: 'UserSelect', label: '用户选择器' }) + const deptSelectRule = useSelectRule({ name: 'DeptSelect', label: '部门选择器' }) const dictSelectRule = useDictSelectRule() const restfulSelectRule = useSelectRule({ name: 'RestfulSelect', @@ -56,46 +80,15 @@ export const useFormCreateDesigner = async (designer: Ref) => { } ] }) - - /** - * 构建表单组件 - */ - const buildFormComponents = () => { - // 移除自带的上传组件规则,使用 uploadFileRule、uploadImgRule、uploadImgsRule 替代 - designer.value?.removeMenuItem('upload') - // 移除自带的富文本组件规则,使用 editorRule 替代 - designer.value?.removeMenuItem('fc-editor') - // 移除自带的下拉选择器组件,使用 currencySelectRule 替代 - designer.value?.removeMenuItem('select') - designer.value?.removeMenuItem('radio') - designer.value?.removeMenuItem('checkbox') - const components = [ - editorRule, - uploadFileRule, - uploadImgRule, - uploadImgsRule, - dictSelectRule, - restfulSelectRule - ] - components.forEach((component) => { - // 插入组件规则 - designer.value?.addComponent(component) - // 插入拖拽按钮到 `main` 分类下 - designer.value?.appendMenuItem('main', { - icon: component.icon, - name: component.name, - label: component.label - }) - }) - } - - const userSelectRule = useSelectRule({ name: 'UserSelect', label: '用户选择器' }) - const deptSelectRule = useSelectRule({ name: 'DeptSelect', label: '部门选择器' }) /** * 构建系统字段菜单 */ const buildSystemMenu = () => { - const components = [userSelectRule, deptSelectRule] + // 移除自带的下拉选择器组件,使用 currencySelectRule 替代 + designer.value?.removeMenuItem('select') + designer.value?.removeMenuItem('radio') + designer.value?.removeMenuItem('checkbox') + const components = [userSelectRule, deptSelectRule, dictSelectRule, restfulSelectRule] const menu: Menu = { name: 'system', title: '系统字段',