xdesign-vue-next
Version:
XDesign Component for vue-next
1 lines • 11 kB
Source Map (JSON)
{"version":3,"file":"normal-file.mjs","sources":["../../../src/upload/themes/normal-file.tsx"],"sourcesContent":["import { defineComponent, toRefs, computed } from 'vue';\nimport TLoading from '../../loading';\nimport Link from '../../link';\nimport { useTNodeJSX } from '../../hooks/tnode';\nimport { UploadFile } from '../type';\nimport { abridgeName } from '../../_common/js/upload/utils';\nimport { CommonDisplayFileProps } from '../interface';\nimport { commonProps } from '../constants';\nimport { UploadConfig } from '../../config-provider';\n\nexport interface NormalFileProps extends CommonDisplayFileProps {\n multiple: boolean;\n}\n\nconst NormalFile = defineComponent({\n name: 'UploadNormalFile',\n\n props: {\n multiple: Boolean,\n ...commonProps,\n },\n\n setup(props, { slots }) {\n const { theme, disabled, classPrefix } = toRefs(props);\n\n const locale = computed(() => props.locale as UploadConfig);\n\n const renderTNodeJSX = useTNodeJSX();\n\n const uploadPrefix = `${classPrefix.value}-upload`;\n\n const renderProgress = (percent: number) => (\n <div class={`${uploadPrefix}__single-progress`}>\n <TLoading />\n {props.showUploadProgress && <span class={`${uploadPrefix}__single-percent`}>{percent || 0}%</span>}\n </div>\n );\n\n // 文本型预览\n const renderFilePreviewAsText = (files: UploadFile[]) => {\n if (theme.value !== 'file') return null;\n if (!props.multiple && files[0]?.status === 'fail' && props.autoUpload) {\n return null;\n }\n return files.map((file, index) => {\n const fileName = props.abridgeName && file.name ? abridgeName(file.name, ...props.abridgeName) : file.name;\n return (\n <div\n class={`${uploadPrefix}__single-display-text ${uploadPrefix}__display-text--margin`}\n key={file.name + index + file.percent + file.status}\n >\n {file.url ? (\n <Link href={file.url} target=\"_blank\" hover=\"color\" size=\"small\" class={`${uploadPrefix}__single-name`}>\n {fileName}\n </Link>\n ) : (\n <span class={`${uploadPrefix}__single-name`}>{fileName}</span>\n )}\n {file.status === 'fail' && (\n <div class={`${uploadPrefix}__flow-status ${uploadPrefix}__file-fail`}>\n <icon-ri-error-warning-fill />\n </div>\n )}\n {file.status === 'waiting' && (\n <div class={`${uploadPrefix}__flow-status ${uploadPrefix}__file-waiting`}>\n <icon-ri-time-fill />\n </div>\n )}\n {file.status === 'progress' && renderProgress(file.percent)}\n {!disabled.value && file.status !== 'progress' && (\n <icon-ri-close-line\n class={`${uploadPrefix}__icon-delete`}\n onClick={({ e }: { e: MouseEvent }) => props.onRemove({ e, file, index })}\n />\n )}\n </div>\n );\n });\n };\n\n // 输入框型预览\n const renderFilePreviewAsInput = () => {\n if (theme.value !== 'file-input') return;\n const file: UploadFile = props.displayFiles[0] || [];\n const inputTextClass = [\n `${classPrefix.value}-input__inner`,\n { [`${uploadPrefix}__placeholder`]: !props.displayFiles[0] },\n ];\n const disabledClass = disabled.value ? `${classPrefix.value}-is-disabled` : '';\n const fileName =\n props.abridgeName?.length && file?.name ? abridgeName(file.name, ...props.abridgeName) : file?.name;\n return (\n <div class={`${uploadPrefix}__single-input-preview ${classPrefix.value}-input ${disabledClass}`}>\n <div class={inputTextClass}>\n <span\n class={[\n `${uploadPrefix}__single-input-text`,\n { [props.placeholderClass]: props.placeholder && !file?.name },\n ]}\n >\n {file?.name ? fileName : props.placeholder}\n </span>\n {file?.status === 'progress' && renderProgress(file.percent)}\n {file?.status === 'waiting' && (\n <icon-ri-time-fill class={`${uploadPrefix}__status-icon ${uploadPrefix}__file-waiting`} />\n )}\n {file.status === 'success' && <icon-ri-checkbox-circle-fill class={`${uploadPrefix}__status-icon`} />}\n {file?.name && file.status === 'fail' && (\n <icon-ri-error-warning-fill class={`${uploadPrefix}__status-icon ${uploadPrefix}__file-fail`} />\n )}\n {Boolean(!disabled.value && file.name) && (\n <icon-ri-close-circle-fill\n class={`${uploadPrefix}__single-input-clear`}\n onClick={({ e }: { e: MouseEvent }) => props.onRemove({ e, file, index: 0 })}\n />\n )}\n </div>\n </div>\n );\n };\n\n return () => {\n const classes = [`${uploadPrefix}__single`, `${uploadPrefix}__single-${theme.value}`];\n const fileListDisplay = renderTNodeJSX('fileListDisplay', { params: { files: props.displayFiles } });\n const { displayFiles } = props;\n\n return (\n <div class={classes}>\n {theme.value === 'file-input' && renderFilePreviewAsInput()}\n\n {slots.default?.()}\n\n {theme.value === 'file' && props.placeholder && !displayFiles[0] && (\n <small class={[props.tipsClasses, props.placeholderClass]}>{props.placeholder}</small>\n )}\n\n {fileListDisplay || renderFilePreviewAsText(displayFiles)}\n\n {props.sizeOverLimitMessage && <small class={props.errorClasses}>{props.sizeOverLimitMessage}</small>}\n\n {/* 单文件上传失败要显示失败的原因 */}\n {!props.multiple && displayFiles[0]?.status === 'fail' && theme.value === 'file' ? (\n <small class={[props.errorClasses, props.placeholderClass]}>\n {displayFiles[0].response?.error || locale.value.progress.failText}\n </small>\n ) : null}\n </div>\n );\n };\n },\n});\n\nexport default NormalFile;\n"],"names":["_isVNode","name","props","multiple","setup","_createVNode","_resolveComponent","e","file","index","params"],"mappings":"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"}