From d1b54fc5f869d74172ffbe3f484c265c7564daa8 Mon Sep 17 00:00:00 2001
From: wyx <you@example.com>
Date: Thu, 12 Jan 2023 18:05:54 +0800
Subject: [PATCH] =?UTF-8?q?style:=E4=BF=AE=E6=94=B9=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/project/ProjectManage.vue | 84 ++++++++++++++++++-----------
 1 file changed, 52 insertions(+), 32 deletions(-)

diff --git a/src/views/project/ProjectManage.vue b/src/views/project/ProjectManage.vue
index 481ed08..cf97031 100644
--- a/src/views/project/ProjectManage.vue
+++ b/src/views/project/ProjectManage.vue
@@ -40,43 +40,50 @@
 				</button>
 				<button class="searchBtn" @click="resetClick">重置</button>
 			</div>
-			<div class="projectList" v-if="!projectList.length" style="display:flex;color:#909399;">
-				<img class="img2" style="margin-left:359px;margin-top:100px;width:148px;height:220px;"
-					src="../../assets/image/notask.png" />
+			
+			<div class="projectList" v-if="isLoading==true" style="display:flex;color:#909399;">
+				
 			</div>
-			<div v-else class="projectList" v-for="(i, k) in projectList" :key="k">
-				<div style="display: flex">
-					<img style="width: 253px; height: 144px; border-radius: 4px" :src="i.picUrl" />
-					<div style="margin-left: 29px">
-						<div class="projectName" :title="i.name">
-							{{ i.name }}
-						</div>
-						<div class="progress">
-							<div class="progressNow">当前进度：</div>
-							<div style="width: 115px">
-								<el-progress :percentage="parseInt(i.finishTaskNum / i.totalTaskNum * 100)" :show-text="false"
-									:stroke-width="8" color="rgba(255, 160, 80, 1)" />
+			<div v-else>
+				{{ loading.close() }}
+				<div class="projectList" v-if="!projectList.length" style="display:flex;color:#909399;">
+					<img class="img2" style="margin-left:359px;margin-top:100px;width:148px;height:220px;"
+						src="../../assets/image/notask.png" />
+				</div>
+				<div v-else class="projectList" v-for="(i, k) in projectList" :key="k">
+					<div style="display: flex">
+						<img style="width: 253px; height: 144px; border-radius: 4px" :src="i.picUrl" />
+						<div style="margin-left: 29px">
+							<div class="projectName" :title="i.name">
+								{{ i.name }}
 							</div>
-							<div class="progressNum">
-								{{
-										(i.finishTaskNum && i.totalTaskNum) ? parseInt(i.finishTaskNum / i.totalTaskNum * 100) : 0
-								}}%
+							<div class="progress">
+								<div class="progressNow">当前进度：</div>
+								<div style="width: 115px">
+									<el-progress :percentage="parseInt(i.finishTaskNum / i.totalTaskNum * 100)" :show-text="false"
+										:stroke-width="8" color="rgba(255, 160, 80, 1)" />
+								</div>
+								<div class="progressNum">
+									{{
+											(i.finishTaskNum && i.totalTaskNum) ? parseInt(i.finishTaskNum / i.totalTaskNum * 100) : 0
+									}}%
+								</div>
 							</div>
+							<div class="studyNew" v-if="i.lastStudyTime">最新一次学习时间：{{ i.lastStudyTime }}</div>
 						</div>
-						<div class="studyNew" v-if="i.lastStudyTime">最新一次学习时间：{{ i.lastStudyTime }}</div>
 					</div>
-				</div>
-				<div class="tobestarted" v-if="i.status == 2" @click="goProjectDetails(i)">
-					待开始
-				</div>
-				<div class="gostudy" v-if="i.status == 0" @click="goProjectDetails(i)">
-					去学习
-				</div>
-				<div class="finish" v-if="i.status == 1" @click="goProjectDetails(i)">
-					已完成
-				</div>
-				<div class="tobestarted" v-if="i.status == 3" @click="goProjectDetails(i)">
-					已结束
+					<div class="tobestarted" v-if="i.status == 2" @click="goProjectDetails(i)">
+						待开始
+					</div>
+					<div class="gostudy" v-if="i.status == 0" @click="goProjectDetails(i)">
+						去学习
+					</div>
+					<div class="finish" v-if="i.status == 1" @click="goProjectDetails(i)">
+						已完成
+					</div>
+					<div class="tobestarted" v-if="i.status == 3" @click="goProjectDetails(i)">
+						已结束
+					</div>
 				</div>
 			</div>
 			<!-- <div
@@ -120,6 +127,7 @@ import { useRouter } from "vue-router";
 import store from "@/store";
 import { toDate } from "../../api/method";
 import { ElMessage } from "element-plus";
+import { ElLoading } from 'element-plus';
 
 const projectClassify = [];
 const studyProgress = [];
@@ -134,8 +142,17 @@ const endTime = ref(""); //开始时间
 const dialogVisible = ref(false)
 const userInfo = computed(() => store.state.userInfo);
 
+const isLoading = ref(false);
+
+const loading = ref(false);
 //获取项目列表--------start------------------------------------
 const getProject = () => {
+	isLoading.value = true;
+	loading.value = ElLoading.service({  
+		lock: true,
+		text: 'Loading',
+		background: 'rgba(0, 0, 0, 0.7)'
+	})
 	request(PROJECT_LIST, {
 		beginTime: beginTime.value,
 		endTime: endTime.value,
@@ -149,10 +166,13 @@ const getProject = () => {
 				projectList.value = res.data.rows;
 				projectTotal.value = Number(res.data.total);
 				console.log("projectTotal.value", projectTotal.value);
+				isLoading.value = false;
 			}
 		})
 		.catch((err) => {
 			console.log("获取失败", err);
+			projectList.value = [];
+			isLoading.value = false;
 		});
 };
 getProject();