refactor(upload): components optimization (#5205)

zhangpaopao0609 · web-flow · commit 38f839328558 · 2025-03-25T00:20:29.000+08:00
* refactor(upload): component optimization

* refactor(menu): mv consts/index to types

* chore(upload): up
diff --git a/packages/components/menu/head-menu.tsx b/packages/components/menu/head-menu.tsx
@@ -20,7 +20,7 @@ import { isArray } from 'lodash-es';
 import log from '@tdesign/common-js/log/log';
 import props from './head-menu-props';
 import { MenuValue } from './type';
-import { TdMenuInterface, TdOpenType } from './consts';
+import { TdMenuInterface, TdOpenType } from './types';
 import { Tabs, TabPanel } from '../tabs';
 import Submenu from './submenu';
 import { VMenu } from './utils';
diff --git a/packages/components/menu/menu-item.tsx b/packages/components/menu/menu-item.tsx
@@ -1,6 +1,6 @@
 import { defineComponent, computed, inject, onMounted, ref, toRefs, getCurrentInstance } from 'vue';
 import props from './menu-item-props';
-import { TdMenuInterface, TdSubMenuInterface } from './consts';
+import { TdMenuInterface, TdSubMenuInterface } from './types';
 import { useTNodeJSX, useContent } from '../hooks/tnode';
 import useRipple from '../hooks/useRipple';
 import { usePrefixClass } from '../hooks/useConfig';
diff --git a/packages/components/menu/menu.tsx b/packages/components/menu/menu.tsx
@@ -1,7 +1,7 @@
 import { defineComponent, ref, computed, provide, watchEffect, watch, onMounted, toRefs } from 'vue';
 import props from './props';
 import { MenuValue } from './type';
-import { TdMenuInterface, TdOpenType } from './consts';
+import { TdMenuInterface, TdOpenType } from './types';
 import { useTNodeJSX, useContent } from '../hooks/tnode';
 import { VMenu } from './utils';
 import log from '@tdesign/common-js/log/log';
diff --git a/packages/components/menu/submenu.tsx b/packages/components/menu/submenu.tsx
@@ -14,7 +14,7 @@ import {
   Transition,
 } from 'vue';
 import props from './submenu-props';
-import { TdMenuInterface, TdSubMenuInterface, TdMenuItem } from './consts';
+import { TdMenuInterface, TdSubMenuInterface, TdMenuItem } from './types';
 import FakeArrow from '../common-components/fake-arrow';
 import useRipple from '../hooks/useRipple';
 import { usePrefixClass } from '../hooks/useConfig';
diff --git a/packages/components/menu/types.ts b/packages/components/menu/types.ts
@@ -1,6 +1,6 @@
 import { Ref, VNodeNormalizedChildren } from 'vue';
-import { MenuValue } from '../type';
-import { VMenu } from '../utils';
+import { MenuValue } from './type';
+import { VMenu } from './utils';
 
 export interface TdMenuItem {
   value: MenuValue;
diff --git a/packages/components/upload/components/README.md b/packages/components/upload/components/README.md
diff --git a/packages/components/upload/components/custom-file.tsx b/packages/components/upload/components/custom-file.tsx
@@ -1,7 +1,7 @@
 import { defineComponent, PropType, toRefs } from 'vue';
 import useDrag, { UploadDragEvents } from '../hooks/useDrag';
-import { CommonDisplayFileProps } from '../interface';
-import { commonProps } from '../constants';
+import { CommonDisplayFileProps } from '../types';
+import { commonProps } from '../consts';
 import { useContent } from '../../hooks/tnode';
 import { TdUploadProps } from '../type';
 
@@ -17,7 +17,6 @@ export interface CustomFileProps extends CommonDisplayFileProps {
 
 export default defineComponent({
   name: 'UploadCustomFile',
-
   props: {
     ...commonProps,
     dragEvents: Object as PropType<CustomFileProps['dragEvents']>,
@@ -28,7 +27,6 @@ export default defineComponent({
     triggerUpload: Function as PropType<CustomFileProps['triggerUpload']>,
     childrenNode: [String, Function] as PropType<CustomFileProps['childrenNode']>,
   },
-
   setup(props, { slots }) {
     const { classPrefix, displayFiles, accept } = toRefs(props);
     const drag = useDrag(props.dragEvents, accept);
diff --git a/packages/components/upload/components/dragger-file.tsx b/packages/components/upload/components/dragger-file.tsx
@@ -6,8 +6,8 @@ import {
 import { abridgeName, getFileSizeText } from '@tdesign/common-js/upload/utils';
 import { TdUploadProps, UploadFile } from '../type';
 import Button from '../../button';
-import { CommonDisplayFileProps } from '../interface';
-import { commonProps } from '../constants';
+import { CommonDisplayFileProps } from '../types';
+import { commonProps } from '../consts';
 import useCommonClassName from '../../hooks/useCommonClassName';
 import TLoading from '../../loading';
 import useDrag, { UploadDragEvents } from '../hooks/useDrag';
@@ -27,7 +27,6 @@ export interface DraggerProps extends CommonDisplayFileProps {
 
 export default defineComponent({
   name: 'UploadDraggerFile',
-
   props: {
     ...commonProps,
     trigger: Function as PropType<DraggerProps['trigger']>,
@@ -36,7 +35,6 @@ export default defineComponent({
     cancelUpload: Function as PropType<DraggerProps['cancelUpload']>,
     dragEvents: Object as PropType<DraggerProps['dragEvents']>,
   },
-
   setup(props, { slots }) {
     const { displayFiles, disabled, accept } = toRefs(props);
     const locale = computed(() => props.locale as UploadConfig);
diff --git a/packages/components/upload/components/image-card.tsx b/packages/components/upload/components/image-card.tsx
@@ -8,8 +8,8 @@ import {
 import Loading from '../../loading';
 import useGlobalIcon from '../../hooks/useGlobalIcon';
 import ImageViewer, { ImageViewerProps } from '../../image-viewer';
-import { CommonDisplayFileProps } from '../interface';
-import { commonProps } from '../constants';
+import { CommonDisplayFileProps } from '../types';
+import { commonProps } from '../consts';
 import { TdUploadProps, UploadFile } from '../type';
 import { abridgeName } from '@tdesign/common-js/upload/utils';
 import { UploadConfig } from '../../config-provider';
@@ -30,7 +30,6 @@ export interface ImageCardUploadProps extends CommonDisplayFileProps {
 
 export default defineComponent({
   name: 'UploadImageCard',
-
   props: {
     ...commonProps,
     multiple: Boolean,
@@ -43,7 +42,6 @@ export default defineComponent({
     onPreview: Function as PropType<ImageCardUploadProps['onPreview']>,
     showImageFileName: Boolean,
   },
-
   setup(props) {
     const { displayFiles, classPrefix, multiple, max } = toRefs(props);
     const locale = computed(() => props.locale as UploadConfig);
diff --git a/packages/components/upload/components/multiple-flow-list.tsx b/packages/components/upload/components/multiple-flow-list.tsx
@@ -16,8 +16,8 @@ import { isFunction } from 'lodash-es';
 import { isObject } from 'lodash-es';
 import useGlobalIcon from '../../hooks/useGlobalIcon';
 import ImageViewer, { ImageViewerProps } from '../../image-viewer';
-import { CommonDisplayFileProps } from '../interface';
-import { commonProps } from '../constants';
+import { CommonDisplayFileProps } from '../types';
+import { commonProps } from '../consts';
 import TButton from '../../button';
 import { UploadFile, TdUploadProps } from '../type';
 import useDrag, { UploadDragEvents } from '../hooks/useDrag';
@@ -51,7 +51,6 @@ export interface ImageFlowListProps extends CommonDisplayFileProps {
 
 export default defineComponent({
   name: 'UploadMultipleFlowList',
-
   props: {
     ...commonProps,
     showThumbnail: Boolean,
@@ -66,7 +65,6 @@ export default defineComponent({
     cancelUploadButton: Object as PropType<ImageFlowListProps['cancelUploadButton']>,
     onPreview: Function as PropType<ImageFlowListProps['onPreview']>,
   },
-
   setup(props, { slots }) {
     // locale 已经在 useUpload 中统一处理优先级
     const { uploading, disabled, displayFiles, classPrefix, accept } = toRefs(props);
diff --git a/packages/components/upload/components/normal-file.tsx b/packages/components/upload/components/normal-file.tsx
@@ -12,8 +12,8 @@ import { useTNodeJSX } from '../../hooks/tnode';
 import { UploadFile } from '../type';
 import { abridgeName } from '@tdesign/common-js/upload/utils';
 import { useGlobalIcon } from '../../hooks/useGlobalIcon';
-import { CommonDisplayFileProps } from '../interface';
-import { commonProps } from '../constants';
+import { CommonDisplayFileProps } from '../types';
+import { commonProps } from '../consts';
 import { UploadConfig } from '../../config-provider';
 
 export interface NormalFileProps extends CommonDisplayFileProps {
@@ -22,12 +22,10 @@ export interface NormalFileProps extends CommonDisplayFileProps {
 
 const NormalFile = defineComponent({
   name: 'UploadNormalFile',
-
   props: {
     multiple: Boolean,
     ...commonProps,
   },
-
   setup(props, { slots }) {
     const { theme, disabled, classPrefix } = toRefs(props);
 
diff --git a/packages/components/upload/components/style/css.js b/packages/components/upload/components/style/css.js
diff --git a/packages/components/upload/components/style/index.js b/packages/components/upload/components/style/index.js
diff --git a/packages/components/upload/consts/index.ts b/packages/components/upload/consts/index.ts
@@ -1,5 +1,5 @@
 import { PropType } from 'vue';
-import { CommonDisplayFileProps } from './interface';
+import { CommonDisplayFileProps } from '../types';
 
 export const commonProps = {
   accept: String,
diff --git a/packages/components/upload/index.ts b/packages/components/upload/index.ts
@@ -3,7 +3,7 @@ import withInstall from '../utils/withInstall';
 
 import './style';
 
-export * from './interface';
+export * from './types';
 
 export const Upload = withInstall(_Upload);
 export default Upload;
diff --git a/packages/components/upload/types.ts b/packages/components/upload/types.ts
diff --git a/packages/components/upload/upload.tsx b/packages/components/upload/upload.tsx
@@ -1,13 +1,13 @@
 import { computed, defineComponent } from 'vue';
 import { UploadIcon as TdUploadIcon } from 'tdesign-icons-vue-next';
 import props from './props';
-import NormalFile from './themes/normal-file';
-import DraggerFile from './themes/dragger-file';
-import ImageCard from './themes/image-card';
-import MultipleFlowList from './themes/multiple-flow-list';
+import NormalFile from './components/normal-file';
+import DraggerFile from './components/dragger-file';
+import ImageCard from './components/image-card';
+import MultipleFlowList from './components/multiple-flow-list';
 import Button from '../button';
-import { CommonDisplayFileProps, UploadProps } from './interface';
-import CustomFile from './themes/custom-file';
+import { CommonDisplayFileProps, UploadProps } from './types';
+import CustomFile from './components/custom-file';
 
 import { UploadDragEvents } from './hooks/useDrag';
 import useUpload from './hooks/useUpload';
@@ -17,9 +17,7 @@ import { useGlobalIcon } from '../hooks/useGlobalIcon';
 
 export default defineComponent({
   name: 'TUpload',
-
   props,
-
   setup(props: UploadProps, { slots, expose }) {
     const renderContent = useContent();
     const renderTNodeJSX = useTNodeJSX();
