diff --git a/src/components/Form/index.ts b/src/components/Form/index.ts index eb7b797f..480eadef 100644 --- a/src/components/Form/index.ts +++ b/src/components/Form/index.ts @@ -13,5 +13,6 @@ export { default as ApiTree } from './src/components/ApiTree.vue' export { default as ApiRadioGroup } from './src/components/ApiRadioGroup.vue' export { default as ApiCascader } from './src/components/ApiCascader.vue' export { default as ApiTransfer } from './src/components/ApiTransfer.vue' +export { default as ImageUpload } from './src/components/ImageUpload.vue' export { BasicForm } diff --git a/src/components/Form/src/componentMap.ts b/src/components/Form/src/componentMap.ts index 0ef3d286..c7c71ac2 100644 --- a/src/components/Form/src/componentMap.ts +++ b/src/components/Form/src/componentMap.ts @@ -20,7 +20,6 @@ import type { ComponentType } from './types' /** * Component list, register here to setting it in the form */ - import ApiRadioGroup from './components/ApiRadioGroup.vue' import RadioButtonGroup from './components/RadioButtonGroup.vue' import ApiSelect from './components/ApiSelect.vue' @@ -29,6 +28,7 @@ import ApiTreeSelect from './components/ApiTreeSelect.vue' import ApiCascader from './components/ApiCascader.vue' import ApiTransfer from './components/ApiTransfer.vue' import FileUpload from './components/FileUpload.vue' +import ImageUpload from './components/ImageUpload.vue' import { BasicUpload } from '@/components/Upload' import { StrengthMeter } from '@/components/StrengthMeter' import { IconPicker } from '@/components/Icon' @@ -44,7 +44,7 @@ componentMap.set('InputSearch', Input.Search) componentMap.set('InputTextArea', Input.TextArea) componentMap.set('InputNumber', InputNumber) componentMap.set('AutoComplete', AutoComplete) - +componentMap.set('ImageUpload', ImageUpload) componentMap.set('Select', Select) componentMap.set('ApiSelect', ApiSelect) componentMap.set('ApiTree', ApiTree) @@ -67,6 +67,7 @@ componentMap.set('MonthPicker', DatePicker.MonthPicker) componentMap.set('RangePicker', DatePicker.RangePicker) componentMap.set('WeekPicker', DatePicker.WeekPicker) componentMap.set('TimePicker', TimePicker) +componentMap.set('TimeRangePicker', TimePicker.TimeRangePicker) componentMap.set('StrengthMeter', StrengthMeter) componentMap.set('IconPicker', IconPicker) componentMap.set('InputCountDown', CountdownInput) diff --git a/src/components/Form/src/components/FileUpload.vue b/src/components/Form/src/components/FileUpload.vue index 43ec3f7f..1b5c6e5d 100644 --- a/src/components/Form/src/components/FileUpload.vue +++ b/src/components/Form/src/components/FileUpload.vue @@ -57,19 +57,15 @@ const isMaxCount = computed(() => props.maxCount > 0 && fileList.value.length >= const isImageMode = computed(() => props.fileType === 'image') // 合并 props 和 attrs const bindProps = computed(() => { - // update-begin-author:liusq date:20220411 for: [issue/455]上传组件传入accept限制上传文件类型无效 const bind: any = Object.assign({}, props, unref(attrs)) - // update-end-author:liusq date:20220411 for: [issue/455]上传组件传入accept限制上传文件类型无效 bind.name = 'file' bind.listType = isImageMode.value ? 'picture-card' : 'text' bind.class = [bind.class, { 'upload-disabled': props.disabled }] bind.data = { biz: props.bizPath, ...bind.data } - // update-begin-author:taoyan date:20220407 for: 自定义beforeUpload return false,并不能中断上传过程 if (!bind.beforeUpload) bind.beforeUpload = onBeforeUpload - // update-end-author:taoyan date:20220407 for: 自定义beforeUpload return false,并不能中断上传过程 // 如果当前是图片上传模式,就只能上传图片 if (isImageMode.value && !bind.accept) bind.accept = 'image/*' diff --git a/src/components/Form/src/components/ImageUpload.vue b/src/components/Form/src/components/ImageUpload.vue new file mode 100644 index 00000000..0a57d415 --- /dev/null +++ b/src/components/Form/src/components/ImageUpload.vue @@ -0,0 +1,223 @@ + + + + + diff --git a/src/components/Form/src/types/index.ts b/src/components/Form/src/types/index.ts index dbf21c8c..5bc05cf9 100644 --- a/src/components/Form/src/types/index.ts +++ b/src/components/Form/src/types/index.ts @@ -106,9 +106,11 @@ export type ComponentType = | 'RangePicker' | 'WeekPicker' | 'TimePicker' + | 'TimeRangePicker' | 'Switch' | 'StrengthMeter' | 'Upload' + | 'ImageUpload' | 'IconPicker' | 'Render' | 'Slider'