From 4e4339857a02878fef71b62cf17f39e1b6aa14ab Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期五, 29 十一月 2024 17:43:27 +0800 Subject: [PATCH] 加loading --- src/views/projectProcess/detail/index.vue | 17 ++++++++++++----- 1 files changed, 12 insertions(+), 5 deletions(-) diff --git a/src/views/projectProcess/detail/index.vue b/src/views/projectProcess/detail/index.vue index 811e3a0..a819527 100644 --- a/src/views/projectProcess/detail/index.vue +++ b/src/views/projectProcess/detail/index.vue @@ -1,5 +1,5 @@ <template> - <div class="app-container"> + <div class="app-container" v-loading.fullscreen.lock="loading"> <div class="top"> <div class="project-title"> <h2>椤圭洰鍚嶇О锛歿{detailData.projectName}}</h2> @@ -16,10 +16,10 @@ </div> </div> <div class="search-warp"> - <div @click="changeTab(1, 'all')" :class="{'item-warm': true, 'all-color': true, 'active': 1 === selectTabId}">鍏ㄩ儴浜嬮」锛坽{detailData.statistics.totalTaskNum}}锛�</div> - <div @click="changeTab(2, 'todo')" :class="{'item-warm': true, 'all-color': true, 'active': 2 === selectTabId}">浠e姙浜嬮」锛坽{detailData.statistics.todoTaskNum}}锛�</div> - <div @click="changeTab(3, 'current')" :class="{'item-warm': true, 'current-color': true, 'active': 3 === selectTabId}">褰撳墠鐜妭</div> - <div @click="changeTab(4, 'remaining')" :class="{'item-warm': true, 'remaining-color': true, 'active': 4 === selectTabId}">鍓╀綑浜嬮」锛坽{detailData.statistics.remainingTaskNum}}锛�</div> + <div @click="changeTab(1, 'all')" :class="{'item-warm': true, 'all-color': true, 'active': 1 === selectTabId}">鍏ㄩ儴浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.totalTaskNum}}锛�</span></div> + <div @click="changeTab(2, 'todo')" :class="{'item-warm': true, 'all-color': true, 'active': 2 === selectTabId}">浠e姙浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.todoTaskNum}}锛�</span></div> + <div @click="changeTab(3, 'todo')" :class="{'item-warm': true, 'current-color': true, 'active': 3 === selectTabId}">褰撳墠鐜妭</div> + <div @click="changeTab(4, 'remaining')" :class="{'item-warm': true, 'remaining-color': true, 'active': 4 === selectTabId}">鍓╀綑浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.remainingTaskNum}}锛�</span></div> <div @click="changeTab(5, 'timely')" :class="{'item-warm': true, 'timely-color': true, 'active': 5 === selectTabId}">鎸夋椂瀹屾垚锛�0锛�</div> <div @click="changeTab(6, 'overtime')" :class="{'item-warm': true, 'overtime-color': true, 'active': 6 === selectTabId}">瓒呮椂浜嬮」锛�0锛�</div> <div @click="changeTab(7, 'willOvertime')" :class="{'item-warm': true, 'willOvertime-color': true, 'active': 7 === selectTabId}">涓存湡浜嬮」锛�0锛�</div> @@ -37,6 +37,7 @@ </div> <div class="table"> <el-table + v-loading="tableLoading" :data="taskList" border style="width: 100%"> @@ -106,6 +107,8 @@ name: "index", data() { return { + loading: false, + tableLoading: false, detailData: {}, taskList: [], total: 0, @@ -123,6 +126,7 @@ mounted() { this.queryParams.projectId = this.$route.query.projectId this.queryParams.processDefId = this.$route.query.processDefId + this.loading = true this.getProjectProcessInfo() }, methods: { @@ -166,6 +170,7 @@ getProjectProcessDetailTaskList(this.queryParams).then(res => { this.taskList = res.data this.total = res.total + this.tableLoading =false }) }, // 鏌ヨ璇︽儏 @@ -173,9 +178,11 @@ getProjectProcessDetail(this.queryParams.projectId, this.queryParams.processDefId).then(res => { this.detailData = res.data this.taskList = res.taskList + this.loading = false }) }, changeTab(id, event) { + this.tableLoading = true let beforeId = this.selectTabId this.selectTabId = id this.queryParams.taskType = event -- Gitblit v1.8.0