1.请求日历数据接口,等待接口返回数据的时候全屏增加loading...

2. 导入excel时等待也需要增加loading...
This commit is contained in:
任珮宇 2024-01-29 10:35:52 +08:00
parent e3324ae28a
commit bded5fccc4

View File

@ -1,5 +1,6 @@
<template>
<div class="scheduling">
<a-spin :spinning="spinningMain">
<!-- 左侧日程列表 -->
<a-card class="scheduling-list">
<!-- 标题 -->
@ -80,7 +81,7 @@
Download Template
</a-button>
<a-upload :custom-request="onImport" accept=".xlsx, .xls" :show-upload-list="false">
<a-button type="primary">
<a-button :loading="isImport" type="primary">
<img src="@/assets/images/global/import.png" alt="" />
Import
</a-button>
@ -109,6 +110,7 @@
</a-calendar>
<!-- 日历结束 -->
</div>
</a-spin>
<!-- 增加/编辑排班弹窗 -->
<custom-modal :title="isAdd ? 'Add' : 'Edit'" :width="845" v-model="visible" :okHandler="submit" destroy-on-close>
@ -217,6 +219,8 @@ export default {
data() {
this.dateFormat = dateFormat
return {
isImport: false,
spinningMain: false,
currentMonth: moment(), //
currentDate: moment(), //
@ -255,6 +259,7 @@ export default {
methods: {
//
async getList() {
this.spinningMain = true
try {
this.isGettingList = true
const { result } = await getAction(`/sysTask/findList?yearMonth=${this.currentMonth.format('YYYY-MM')}`)
@ -262,8 +267,10 @@ export default {
this.schedulingInfo = this.scheduleList[this.currentDate.format(dateFormat)]
} catch (error) {
console.error(error)
this.spinningMain = false
} finally {
this.isGettingList = false
this.spinningMain = false
}
},
@ -407,14 +414,17 @@ export default {
},
async onImport({ file }) {
this.isImport = true
try {
const formData = new FormData()
formData.append('file', file)
const { success, failure } = await postAction('/sysTask/importExcel', formData)
this.$message.success(`${success} Success, ${failure} Fail`)
this.isImport = false
this.getList()
} catch (error) {
console.error(error)
this.isImport = false
}
},
@ -645,7 +655,11 @@ export default {
.scheduling {
height: 100%;
overflow: hidden;
//display: flex;
/deep/.ant-spin-container {
height: 100%;
display: flex;
}
&-list {
flex-shrink: 0;
width: 350px;