|
@@ -1,14 +1,20 @@
|
|
|
import { ElMessage } from "element-plus";
|
|
|
-import { computed, ref } from "vue";
|
|
|
+import { computed, ref, watchEffect } from "vue";
|
|
|
import mime from "mime";
|
|
|
|
|
|
export type UploadProps<T> = {
|
|
|
maxSize: number;
|
|
|
formats: string[];
|
|
|
- upload?: (file: File, onPercentage: (percentage: number) => void) => Promise<T>;
|
|
|
+ upload?: (
|
|
|
+ file: File,
|
|
|
+ onPercentage: (percentage: number) => void
|
|
|
+ ) => Promise<T>;
|
|
|
};
|
|
|
|
|
|
-const defaultUpload = (file: File, onPercentage: (percentage: number) => void) => {
|
|
|
+const defaultUpload = (
|
|
|
+ file: File,
|
|
|
+ onPercentage: (percentage: number) => void
|
|
|
+) => {
|
|
|
onPercentage(100);
|
|
|
};
|
|
|
|
|
@@ -27,17 +33,19 @@ export const useUpload = <T>(props: UploadProps<T>) => {
|
|
|
);
|
|
|
const fileRef = ref<File>();
|
|
|
|
|
|
+ (window as any).fileRef = fileRef;
|
|
|
const removeFile = () => {
|
|
|
fileRef.value = undefined;
|
|
|
return true;
|
|
|
};
|
|
|
-
|
|
|
const previewFile = () => {
|
|
|
fileRef.value && window.open(URL.createObjectURL(fileRef.value));
|
|
|
};
|
|
|
|
|
|
const upload = async (file: File) => {
|
|
|
- const fileType = file.name.substring(file.name.lastIndexOf(".")).toUpperCase();
|
|
|
+ const fileType = file.name
|
|
|
+ .substring(file.name.lastIndexOf("."))
|
|
|
+ .toUpperCase();
|
|
|
|
|
|
if (!props.formats.some((type) => type.toUpperCase() === fileType)) {
|
|
|
ElMessage.error(`请上传${format.value}`);
|
|
@@ -46,9 +54,12 @@ export const useUpload = <T>(props: UploadProps<T>) => {
|
|
|
ElMessage.error(`请上传${size.value}以内的文件`);
|
|
|
return false;
|
|
|
} else {
|
|
|
- await (props.upload || defaultUpload)(file, (val) => (percentage.value = val));
|
|
|
- percentage.value = undefined;
|
|
|
fileRef.value = file;
|
|
|
+ await (props.upload || defaultUpload)(
|
|
|
+ file,
|
|
|
+ (val) => (percentage.value = val)
|
|
|
+ );
|
|
|
+ percentage.value = undefined;
|
|
|
return true;
|
|
|
}
|
|
|
};
|