|
@@ -59,6 +59,12 @@
|
|
<svg-icon name="icon-delete"></svg-icon>
|
|
<svg-icon name="icon-delete"></svg-icon>
|
|
</template>
|
|
</template>
|
|
</a-upload>
|
|
</a-upload>
|
|
|
|
+ <p
|
|
|
|
+ v-if="result.message && !result.success"
|
|
|
|
+ class="tips-info tips-error"
|
|
|
|
+ >
|
|
|
|
+ {{ result.message }}
|
|
|
|
+ </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@@ -83,7 +89,7 @@
|
|
RequestOption,
|
|
RequestOption,
|
|
UploadRequest,
|
|
UploadRequest,
|
|
} from '@arco-design/web-vue';
|
|
} from '@arco-design/web-vue';
|
|
- import axios from 'axios';
|
|
|
|
|
|
+ import axios, { AxiosError } from 'axios';
|
|
|
|
|
|
import useModal from '@/hooks/modal';
|
|
import useModal from '@/hooks/modal';
|
|
|
|
|
|
@@ -213,6 +219,14 @@
|
|
return true;
|
|
return true;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ interface UploadResultType {
|
|
|
|
+ hasError: boolean;
|
|
|
|
+ failRecords: Array<{
|
|
|
|
+ msg: string;
|
|
|
|
+ lineNum: number;
|
|
|
|
+ }>;
|
|
|
|
+ }
|
|
|
|
+
|
|
function customRequest(option: RequestOption): UploadRequest {
|
|
function customRequest(option: RequestOption): UploadRequest {
|
|
const { onProgress, onError, onSuccess, fileItem, data } = option;
|
|
const { onProgress, onError, onSuccess, fileItem, data } = option;
|
|
|
|
|
|
@@ -225,19 +239,30 @@
|
|
emit('uploading');
|
|
emit('uploading');
|
|
const uploadController = new AbortController();
|
|
const uploadController = new AbortController();
|
|
|
|
|
|
- axios
|
|
|
|
- .post(option.action as string, formData, {
|
|
|
|
|
|
+ (
|
|
|
|
+ axios.post(option.action as string, formData, {
|
|
headers: option.headers,
|
|
headers: option.headers,
|
|
signal: uploadController.signal,
|
|
signal: uploadController.signal,
|
|
onUploadProgress: ({ loaded, total }) => {
|
|
onUploadProgress: ({ loaded, total }) => {
|
|
onProgress(Math.floor((100 * loaded) / total));
|
|
onProgress(Math.floor((100 * loaded) / total));
|
|
},
|
|
},
|
|
- })
|
|
|
|
|
|
+ }) as Promise<UploadResultType>
|
|
|
|
+ )
|
|
.then((res) => {
|
|
.then((res) => {
|
|
|
|
+ // 所有excel导入的特殊处理
|
|
|
|
+ if (res.hasError) {
|
|
|
|
+ const failRecords = res.failRecords;
|
|
|
|
+ const message = failRecords
|
|
|
|
+ .map((item) => `第${item.lineNum}行:${item.msg}`)
|
|
|
|
+ .join('。');
|
|
|
|
+
|
|
|
|
+ onError({ data: { message } });
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
onSuccess(res);
|
|
onSuccess(res);
|
|
})
|
|
})
|
|
- .catch((error: Error) => {
|
|
|
|
- onError(error);
|
|
|
|
|
|
+ .catch((error: AxiosError) => {
|
|
|
|
+ onError(error.response);
|
|
});
|
|
});
|
|
|
|
|
|
return {
|
|
return {
|
|
@@ -245,36 +270,18 @@
|
|
};
|
|
};
|
|
}
|
|
}
|
|
|
|
|
|
- function handleError() {
|
|
|
|
|
|
+ function handleError(fileItem: FileItem) {
|
|
canUpload.value = false;
|
|
canUpload.value = false;
|
|
loading.value = false;
|
|
loading.value = false;
|
|
result.value = {
|
|
result.value = {
|
|
success: false,
|
|
success: false,
|
|
- message: '上传失败',
|
|
|
|
|
|
+ message: fileItem.response.data?.message || '上传错误',
|
|
};
|
|
};
|
|
emit('uploadError', result.value);
|
|
emit('uploadError', result.value);
|
|
}
|
|
}
|
|
function handleSuccess(fileItem: FileItem) {
|
|
function handleSuccess(fileItem: FileItem) {
|
|
canUpload.value = false;
|
|
canUpload.value = false;
|
|
loading.value = false;
|
|
loading.value = false;
|
|
-
|
|
|
|
- // 所有excel导入的特殊处理
|
|
|
|
- if (fileItem.response.hasError) {
|
|
|
|
- const failRecords = fileItem.response.failRecords as Array<{
|
|
|
|
- msg: string;
|
|
|
|
- lineNum: number;
|
|
|
|
- }>;
|
|
|
|
- const msg = failRecords
|
|
|
|
- .map((item) => `第${item.lineNum}行:${item.msg}`)
|
|
|
|
- .join('。');
|
|
|
|
- result.value = {
|
|
|
|
- success: false,
|
|
|
|
- message: msg,
|
|
|
|
- };
|
|
|
|
- emit('uploadError', result.value);
|
|
|
|
- return;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
result.value = {
|
|
result.value = {
|
|
success: true,
|
|
success: true,
|
|
message: '上传成功!',
|
|
message: '上传成功!',
|