* upload: add more callbacks.

easysoft · Jan 3, 2024 · 50fdba6 · 50fdba6
1 parent a5db02f
commit 50fdba6
Show file tree

Hide file tree

Showing 5 changed files with 66 additions and 9 deletions.
diff --git a/lib/upload-imgs/docs/lib/components/index.md b/lib/upload-imgs/docs/lib/components/index.md
@@ -252,20 +252,41 @@ const upload = new UploadImgs('#example4', {
 + 类型：`string`
 + 必选：否
 
+### `onDuplicated`
+
+文件重复回调。
+
++ 类型：`(name: string) => void`
++ 必选：否
+
 ### `exceededSizeHint`
 
 超出大小限制提示。
 
 + 类型：`string`
 + 必选：否
 
+### `onExceededSize`
+
+超出大小限制回调。
+
++ 类型：`(limit: number) => void`
++ 必选：否
+
 ### `exceededCountHint`
 
 超过数量限制提示。
 
 + 类型：`string`
 + 必选：否
 
+### `onExceededCount`
+
+超过数量限制回调
+
++ 类型：`(limit: number) => void`
++ 必选：否
+
 ### `totalCountText`
 
 文件数量提示。

diff --git a/lib/upload-imgs/src/vanilla/upload-imgs.ts b/lib/upload-imgs/src/vanilla/upload-imgs.ts
@@ -151,7 +151,7 @@ export class UploadImgs extends Upload<UploadImgsOptions> {
     }
 
     protected createRenameContainer(file: File) {
-        const {duplicatedHint} = this.options;
+        const {duplicatedHint, onDuplicated} = this.options;
         const $input = $('<input />')
             .addClass('input-rename-container border-primary border hidden')
             .prop('type', 'text')
@@ -167,7 +167,9 @@ export class UploadImgs extends Upload<UploadImgsOptions> {
                         return;
                     }
                     if (this.fileMap.has($input.val() as string)) {
-                        return alert(duplicatedHint);
+                        onDuplicated?.($input.val() as string);
+                        if (duplicatedHint) alert(duplicatedHint);
+                        return;
                     }
                     this.renameFileItem(file, $input.val() as string);
                     $input.addClass('hidden');
@@ -188,7 +190,9 @@ export class UploadImgs extends Upload<UploadImgsOptions> {
                     return;
                 }
                 if (this.fileMap.has($input.val() as string)) {
-                    return alert(duplicatedHint);
+                    onDuplicated?.($input.val() as string);
+                    if (duplicatedHint) alert(duplicatedHint);
+                    return;
                 }
                 this.renameFileItem(file, $input.val() as string);
                 $input.addClass('hidden');

diff --git a/lib/upload/docs/lib/components/index.md b/lib/upload/docs/lib/components/index.md
@@ -374,20 +374,41 @@ const upload = new Upload('#example8', {
 + 类型：`string`
 + 必选：否
 
+### `onDuplicated`
+
+文件重复回调。
+
++ 类型：`(name: string) => void`
++ 必选：否
+
 ### `exceededSizeHint`
 
 超出大小限制提示。
 
 + 类型：`string`
 + 必选：否
 
+### `onExceededSize`
+
+超出大小限制回调。
+
++ 类型：`(limit: number) => void`
++ 必选：否
+
 ### `exceededCountHint`
 
 超过数量限制提示。
 
 + 类型：`string`
 + 必选：否
 
+### `onExceededCount`
+
+超过数量限制回调
+
++ 类型：`(limit: number) => void`
++ 必选：否
+
 <script>
 export default {
     mounted() {

diff --git a/lib/upload/src/types/upload-options.ts b/lib/upload/src/types/upload-options.ts
@@ -31,6 +31,9 @@ export type UploadOptions = {
     defaultFileList: File[];
     limitSize: `${number}${'B' | 'KB' | 'MB' | 'GB'}` | false;
     duplicatedHint: string;
+    onDuplicated: (name: string) => void;
     exceededSizeHint: string;
+    onExceededSize: (limit: number) => void;
     exceededCountHint: string;
+    onExceededCount: (limit: number) => void;
 }>;
diff --git a/lib/upload/src/vanilla/upload.ts b/lib/upload/src/vanilla/upload.ts
@@ -215,17 +215,21 @@ export class Upload<T extends UploadOptions = UploadOptions> extends Component<T
 
     protected addFileItem(files: File[]) {
         files = this.filterFiles(files);
-        const {multiple, limitCount, exceededSizeHint, exceededCountHint, onAdd} = this.options;
+        const {multiple, limitCount, exceededSizeHint, onExceededSize, exceededCountHint, onExceededCount, onAdd} = this.options;
         if (multiple) {
             const validFiles: File[] = [];
             for (let file of files) {
                 if (limitCount && this.fileMap.size >= limitCount) {
                     onAdd?.(validFiles);
-                    return alert(exceededCountHint);
+                    onExceededCount?.(limitCount);
+                    if (exceededCountHint) alert(exceededCountHint);
+                    return;
                 }
                 if (this.currentBytes + file.size > this.limitBytes) {
                     onAdd?.(validFiles);
-                    return alert(exceededSizeHint);
+                    onExceededSize?.(this.limitBytes);
+                    if (exceededSizeHint) alert(exceededSizeHint);
+                    return;
                 }
                 file = this.renameDuplicatedFile(file);
                 const item = this.createFileItem(file);
@@ -393,7 +397,7 @@ export class Upload<T extends UploadOptions = UploadOptions> extends Component<T
     }
 
     protected createRenameContainer(file: File) {
-        const {confirmText, cancelText, duplicatedHint} = this.options;
+        const {confirmText, cancelText, duplicatedHint, onDuplicated} = this.options;
         const $renameContainer = $('<div class="input-group input-rename-container hidden"></div>');
         const $input = $('<input />')
             .addClass('form-control')
@@ -411,7 +415,9 @@ export class Upload<T extends UploadOptions = UploadOptions> extends Component<T
                     }
 
                     if (this.fileMap.has($input.val() as string)) {
-                        return alert(duplicatedHint);
+                        onDuplicated?.($input.val() as string);
+                        if (duplicatedHint) alert(duplicatedHint);
+                        return;
                     }
 
                     this.renameFileItem(file, $input.val() as string);
@@ -441,7 +447,9 @@ export class Upload<T extends UploadOptions = UploadOptions> extends Component<T
                 }
 
                 if (this.fileMap.has($input.val() as string)) {
-                    return alert(duplicatedHint);
+                    onDuplicated?.($input.val() as string);
+                    if (duplicatedHint) alert(duplicatedHint);
+                    return;
                 }
                 this.renameFileItem(file, $input.val() as string);
                 $renameContainer.addClass('hidden');