mirror of
https://github.com/kuaifan/dootask.git
synced 2026-01-03 18:28:11 +00:00
fix：审批中心 - 添加loading效果
This commit is contained in:
weifashi
parent
b16b214099
commit
7582727753
@ -7,9 +7,9 @@
|
|||||||
<div class="approve-nav">
|
<div class="approve-nav">
|
||||||
<h1>{{$L('审批中心')}}</h1>
|
<h1>{{$L('审批中心')}}</h1>
|
||||||
</div>
|
</div>
|
||||||
<Button type="primary" @click="addApply">{{$L("添加申请")}}</Button>
|
<Button :loading="addLoadIng" type="primary" @click="addApply">{{$L("添加申请")}}</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Tabs :value="tabsValue" @on-click="tabsClick" style="margin: 0 20px;height: 100%;" size="small">
|
<Tabs :value="tabsValue" @on-click="tabsClick" style="margin: 0 20px;height: 100%;" size="small">
|
||||||
<TabPane :label="$L('待办') + (unreadTotal > 0 ? ('('+unreadTotal+')') : '')" name="unread" style="height: 100%;">
|
<TabPane :label="$L('待办') + (unreadTotal > 0 ? ('('+unreadTotal+')') : '')" name="unread" style="height: 100%;">
|
||||||
<div class="approve-main-search">
|
<div class="approve-main-search">
|
||||||
@ -19,7 +19,7 @@
|
|||||||
</Select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="noData" v-if="unreadList.length==0">{{$L('暂无数据')}}</div>
|
<div v-if="unreadList.length==0" class="noData" >{{$L('暂无数据')}}</div>
|
||||||
<div v-else class="approve-mains">
|
<div v-else class="approve-mains">
|
||||||
<div class="approve-main-left">
|
<div class="approve-main-left">
|
||||||
<div class="approve-main-list">
|
<div class="approve-main-list">
|
||||||
@ -65,7 +65,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="noData" v-if="notifyList.length==0">{{$L('暂无数据')}}</div>
|
<div v-if="notifyList.length==0" class="noData">{{$L('暂无数据')}}</div>
|
||||||
<div v-else class="approve-mains">
|
<div v-else class="approve-mains">
|
||||||
<div class="approve-main-left">
|
<div class="approve-main-left">
|
||||||
<div class="approve-main-list">
|
<div class="approve-main-list">
|
||||||
@ -90,7 +90,7 @@
|
|||||||
</Select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="noData" v-if="initiatedList.length==0">{{$L('暂无数据')}}</div>
|
<div v-if="notifyList.length==0" class="noData">{{$L('暂无数据')}}</div>
|
||||||
<div v-else class="approve-mains">
|
<div v-else class="approve-mains">
|
||||||
<div class="approve-main-left">
|
<div class="approve-main-left">
|
||||||
<div class="approve-main-list">
|
<div class="approve-main-list">
|
||||||
@ -105,7 +105,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--详情-->
|
<!--详情-->
|
||||||
@ -193,8 +193,8 @@ import {mapState} from 'vuex'
|
|||||||
export default {
|
export default {
|
||||||
components:{list,listDetails,DrawerOverlay,ImgUpload},
|
components:{list,listDetails,DrawerOverlay,ImgUpload},
|
||||||
name: "approve",
|
name: "approve",
|
||||||
data(){
|
data() {
|
||||||
return{
|
return {
|
||||||
minDate: new Date(2020, 0, 1),
|
minDate: new Date(2020, 0, 1),
|
||||||
maxDate: new Date(2025, 10, 1),
|
maxDate: new Date(2025, 10, 1),
|
||||||
currentDate: new Date(2021, 0, 17),
|
currentDate: new Date(2021, 0, 17),
|
||||||
@ -204,62 +204,63 @@ export default {
|
|||||||
pageSize: 250,
|
pageSize: 250,
|
||||||
total: 0,
|
total: 0,
|
||||||
noText: '',
|
noText: '',
|
||||||
loadIng:false,
|
loadIng: false,
|
||||||
|
addLoadIng: false,
|
||||||
|
|
||||||
tabsValue:"",
|
tabsValue: "",
|
||||||
//
|
//
|
||||||
approvalType:"all",
|
approvalType: "all",
|
||||||
approvalList:[
|
approvalList: [
|
||||||
{value:"all",label:this.$L("全部审批")},
|
{ value: "all", label: this.$L("全部审批") },
|
||||||
{value:"请假",label:this.$L("请假")},
|
{ value: "请假", label: this.$L("请假") },
|
||||||
{value:"加班申请",label:this.$L("加班申请")},
|
{ value: "加班申请", label: this.$L("加班申请") },
|
||||||
],
|
],
|
||||||
searchState:"all",
|
searchState: "all",
|
||||||
searchStateList:[
|
searchStateList: [
|
||||||
{value:"all",label:this.$L("全部状态")},
|
{ value: "all", label: this.$L("全部状态") },
|
||||||
{value:1,label:this.$L("审批中")},
|
{ value: 1, label: this.$L("审批中") },
|
||||||
{value:2,label:this.$L("已通过")},
|
{ value: 2, label: this.$L("已通过") },
|
||||||
{value:3,label:this.$L("已拒绝")},
|
{ value: 3, label: this.$L("已拒绝") },
|
||||||
{value:4,label:this.$L("已撤回")}
|
{ value: 4, label: this.$L("已撤回") }
|
||||||
],
|
],
|
||||||
//
|
//
|
||||||
unreadTotal:0,
|
unreadTotal: 0,
|
||||||
unreadList: [],
|
unreadList: [],
|
||||||
doneList:[],
|
doneList: [],
|
||||||
notifyList:[],
|
notifyList: [],
|
||||||
initiatedList: [],
|
initiatedList: [],
|
||||||
//
|
//
|
||||||
details:{},
|
details: {},
|
||||||
detailsShow:false,
|
detailsShow: false,
|
||||||
//
|
//
|
||||||
addTitle:'',
|
addTitle: '',
|
||||||
addShow:false,
|
addShow: false,
|
||||||
startTimeOpen:false,
|
startTimeOpen: false,
|
||||||
endTimeOpen:false,
|
endTimeOpen: false,
|
||||||
addData: {
|
addData: {
|
||||||
department_id:0,
|
department_id: 0,
|
||||||
applyType: '',
|
applyType: '',
|
||||||
type: '',
|
type: '',
|
||||||
startTime: "2023-04-20",
|
startTime: "2023-04-20",
|
||||||
startTimeHour:"09",
|
startTimeHour: "09",
|
||||||
startTimeMinute:"00",
|
startTimeMinute: "00",
|
||||||
endTime: "2023-04-20",
|
endTime: "2023-04-20",
|
||||||
endTimeHour:"18",
|
endTimeHour: "18",
|
||||||
endTimeMinute:"00",
|
endTimeMinute: "00",
|
||||||
other:""
|
other: ""
|
||||||
},
|
},
|
||||||
addRule: {
|
addRule: {
|
||||||
department_id:{ type: 'number',required: true, message: this.$L('请选择部门！'), trigger: 'change' },
|
department_id: { type: 'number', required: true, message: this.$L('请选择部门！'), trigger: 'change' },
|
||||||
applyType: { type: 'string',required: true, message: this.$L('请选择申请类型！'), trigger: 'change' },
|
applyType: { type: 'string', required: true, message: this.$L('请选择申请类型！'), trigger: 'change' },
|
||||||
type: { type: 'string',required: true, message: this.$L('请选择假期类型！'), trigger: 'change' },
|
type: { type: 'string', required: true, message: this.$L('请选择假期类型！'), trigger: 'change' },
|
||||||
startTime: { type: 'string',required: true, message: this.$L('请选择开始时间！'), trigger: 'change' },
|
startTime: { type: 'string', required: true, message: this.$L('请选择开始时间！'), trigger: 'change' },
|
||||||
endTime:{ type: 'string',required: true, message: this.$L('请选择结束时间！'), trigger: 'change' },
|
endTime: { type: 'string', required: true, message: this.$L('请选择结束时间！'), trigger: 'change' },
|
||||||
description:{ type: 'string',required: true, message: this.$L('请输入事由！'), trigger: 'change' },
|
description: { type: 'string', required: true, message: this.$L('请输入事由！'), trigger: 'change' },
|
||||||
},
|
},
|
||||||
selectTypes:["年假","事假","病假","调休","产假","陪产假","婚假","丧假","哺乳假"],
|
selectTypes: ["年假", "事假", "病假", "调休", "产假", "陪产假", "婚假", "丧假", "哺乳假"],
|
||||||
|
|
||||||
//
|
//
|
||||||
showDateTime:false
|
showDateTime: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -320,7 +321,9 @@ export default {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.__tabsClick = setTimeout(() => { this.__tabsClick =null; },time)
|
this.__tabsClick = setTimeout(() => { this.__tabsClick =null; },time)
|
||||||
|
if(time == 0){
|
||||||
|
this.loadIng = true;
|
||||||
|
}
|
||||||
this.tabsValue = val || this.tabsValue
|
this.tabsValue = val || this.tabsValue
|
||||||
if(val!=""){
|
if(val!=""){
|
||||||
this.approvalType = this.searchState = "all"
|
this.approvalType = this.searchState = "all"
|
||||||
@ -392,7 +395,7 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.loadIng = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -425,7 +428,7 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.loadIng = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -458,7 +461,7 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.loadIng = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -492,12 +495,13 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.loadIng = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// 添加申请
|
// 添加申请
|
||||||
addApply(){
|
addApply(){
|
||||||
|
this.addLoadIng = true;
|
||||||
this.$store.dispatch("call", {
|
this.$store.dispatch("call", {
|
||||||
url: 'users/basic',
|
url: 'users/basic',
|
||||||
data: {
|
data: {
|
||||||
@ -516,12 +520,11 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.addLoadIng = false;
|
||||||
});
|
});
|
||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
|
this.addLoadIng = false;
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
|
||||||
this.loadIng--;
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -529,7 +532,7 @@ export default {
|
|||||||
onInitiate(){
|
onInitiate(){
|
||||||
this.$refs.initiateRef.validate((valid) => {
|
this.$refs.initiateRef.validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
this.loadIng = 1;
|
this.loadIng = true;
|
||||||
var obj = JSON.parse(JSON.stringify(this.addData))
|
var obj = JSON.parse(JSON.stringify(this.addData))
|
||||||
|
|
||||||
obj.startTime = obj.startTime +" "+ obj.startTimeHour + ":" + obj.startTimeMinute;
|
obj.startTime = obj.startTime +" "+ obj.startTimeHour + ":" + obj.startTimeMinute;
|
||||||
@ -557,14 +560,12 @@ export default {
|
|||||||
}).catch(({msg}) => {
|
}).catch(({msg}) => {
|
||||||
$A.modalError(msg);
|
$A.modalError(msg);
|
||||||
}).finally(_ => {
|
}).finally(_ => {
|
||||||
this.loadIng--;
|
this.loadIng = false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user