From f387d3691b8fcdd45a580e7d65b9d96c1461e550 Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Fri, 23 Dec 2022 08:58:50 +0800
Subject: [PATCH] fix

---
 src/views/project/ProjectManage.vue | 521 ++++++++++++++--------------
 1 file changed, 254 insertions(+), 267 deletions(-)

diff --git a/src/views/project/ProjectManage.vue b/src/views/project/ProjectManage.vue
index 92d5690..29c8cdc 100644
--- a/src/views/project/ProjectManage.vue
+++ b/src/views/project/ProjectManage.vue
@@ -7,11 +7,11 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
-  <div class="projectManage">
-    <div class="content">
-      <div class="title">我的项目</div>
-      <div class="search">
-        <!-- <el-select v-model="value" class="m-2" placeholder="Select">
+	<div class="projectManage">
+		<div class="content">
+			<div class="title">我的项目</div>
+			<div class="search">
+				<!-- <el-select v-model="value" class="m-2" placeholder="Select">
           <el-option
             v-for="item in projectClassify"
             :key="item.value"
@@ -27,88 +27,61 @@
             :value="item.value"
           />
         </el-select> -->
-        <div style="width: 200px; margin-right: 20px">
-          <el-input v-model="projectname" placeholder="请输入项目名称" />
-        </div>
-        <div style="width: 420px">
-          <el-date-picker
-            v-model="searchTime"
-            type="datetimerange"
-            start-placeholder="开始时间"
-            end-placeholder="结束时间"
-            @change="selectTime"
-          />
-        </div>
+				<div style="width: 200px; margin-right: 20px">
+					<el-input v-model="projectname" placeholder="请输入项目名称" />
+				</div>
+				<div style="width: 420px">
+					<el-date-picker v-model="searchTime" type="datetimerange" start-placeholder="开始时间" end-placeholder="结束时间"
+						@change="selectTime" />
+				</div>
 
-        <button
-          class="searchBtn"
-          @click="searchClick"
-          style="margin-left: 20px"
-        >
-          搜索
-        </button>
-        <button class="searchBtn" @click="resetClick">重置</button>
-      </div>
-      <div class="projectList" v-if="projectList.length==0" style="display:flex;color:#909399;">
-        <img
-            class="img2"
-            style="margin-left: 675px;margin-top: 165px;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="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">最新一次学习时间：{{ 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>
-      </div>
-      <!-- <div
+				<button class="searchBtn" @click="searchClick" style="margin-left: 20px">
+					搜索
+				</button>
+				<button class="searchBtn" @click="resetClick">重置</button>
+			</div>
+			<div class="projectList" v-if="projectList.length == 0" style="display:flex;color:#909399;">
+				<img class="img2" style="margin-left: 675px;margin-top: 165px;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="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">最新一次学习时间：{{ 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>
+			</div>
+			<!-- <div
         style="display: flex; justify-content: center; margin-top: 30px"
         v-if="projectTotal > 10"
       >
@@ -123,17 +96,17 @@
           />
         </div>
       </div> -->
-    </div>
-  </div>
+		</div>
+	</div>
 </template>
 <script setup>
 import { reactive, toRefs, ref, onMounted, computed } from "vue";
 
 import { boeRequest, request, usePage, useRequest } from "@/api/request";
 import {
-  ROUTER_CHAPTER_LIST,
-  PROJECT_LIST,
-  ROUTER_UNCOMPLETE_LIST,
+	ROUTER_CHAPTER_LIST,
+	PROJECT_LIST,
+	ROUTER_UNCOMPLETE_LIST,
 } from "@/api/api";
 
 import { useRouter } from "vue-router";
@@ -154,24 +127,24 @@ const userInfo = computed(() => store.state.userInfo);
 
 //获取项目列表--------start------------------------------------
 const getProject = () => {
-  request(PROJECT_LIST, {
-    beginTime: beginTime.value,
-    endTime: endTime.value,
-    key: projectname.value,
-    pageNo: currentPage.value,
-    pageSize: pageSize.value,
-  })
-    .then((res) => {
-      console.log("获取成功", res);
-      if (res.code === 200) {
-        projectList.value = res.data.rows;
-        projectTotal.value = Number(res.data.total);
-        console.log("projectTotal.value", projectTotal.value);
-      }
-    })
-    .catch((err) => {
-      console.log("获取失败", err);
-    });
+	request(PROJECT_LIST, {
+		beginTime: beginTime.value,
+		endTime: endTime.value,
+		key: projectname.value,
+		pageNo: currentPage.value,
+		pageSize: pageSize.value,
+	})
+		.then((res) => {
+			console.log("获取成功", res);
+			if (res.code === 200) {
+				projectList.value = res.data.rows;
+				projectTotal.value = Number(res.data.total);
+				console.log("projectTotal.value", projectTotal.value);
+			}
+		})
+		.catch((err) => {
+			console.log("获取失败", err);
+		});
 };
 getProject();
 
@@ -180,175 +153,189 @@ getProject();
 
 //搜索
 const searchClick = () => {
-  console.log("点击搜索", projectname.value, searchTime.value);
+	console.log("点击搜索", projectname.value, searchTime.value);
 
-  if (searchTime.value) {
-    beginTime.value = toDate(
-      new Date(searchTime.value[0]).getTime() / 1000,
-      "Y-M-D h:m:s"
-    );
-    endTime.value = toDate(
-      new Date(searchTime.value[1]).getTime() / 1000,
-      "Y-M-D h:m:s"
-    );
-  }
-  console.log("beginTime", beginTime.value, endTime.value);
-  getProject();
+	if (searchTime.value) {
+		beginTime.value = toDate(
+			new Date(searchTime.value[0]).getTime() / 1000,
+			"Y-M-D h:m:s"
+		);
+		endTime.value = toDate(
+			new Date(searchTime.value[1]).getTime() / 1000,
+			"Y-M-D h:m:s"
+		);
+	}
+	console.log("beginTime", beginTime.value, endTime.value);
+	getProject();
 };
 //重置
 const resetClick = () => {
-  searchTime.value = "";
-  projectname.value = "";
-  currentPage.value = 1;
-  beginTime.value = "";
-  endTime.value = "";
-  getProject();
-  console.log("点击重置");
+	searchTime.value = "";
+	projectname.value = "";
+	currentPage.value = 1;
+	beginTime.value = "";
+	endTime.value = "";
+	getProject();
+	console.log("点击重置");
 };
 //搜索--------------end-----------------------------------------
 const router = useRouter();
 const goProjectDetails = (value) => {
-  import.meta.env.MODE === "development"
-      ? router.push({
-        path: "/projectdetails",
-        query: { projectId: value.projectId },
-      })
-      : window.open(
-          `${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/projectdetails&params=${encodeURIComponent(
-              `projectId=${routerId}`
-          )}`
-      );
+	import.meta.env.MODE === "development"
+		? router.push({
+			path: "/projectdetails",
+			query: { projectId: value.projectId },
+		})
+		: window.open(
+			`${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/projectdetails&params=${encodeURIComponent(
+				`projectId=${value.projectId}`
+			)}`
+		);
 };
 </script>
 <style lang="scss">
 .projectManage {
-  width: 100%;
-  min-height: 800px;
-  //border-radius: 8px;
-  background-color: rgba(255, 255, 255, 1);
-  display: flex;
-  // background-color: #ccc;
-  .content {
-    width: 100%;
-    // flex: 1;
-    margin-top: 50px;
-    margin-left: 81px;
-    .title {
-      font-size: 18px;
-      font-weight: 600;
-      color: #333333;
-      line-height: 25px;
-    }
-    .search {
-      margin-top: 31px;
-      display: flex;
-      align-items: center;
-      .searchBtn {
-        width: 100px;
-        height: 35px;
-        border-radius: 8px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        background: #387df7;
-        border: 1px solid #387df7;
-        color: #ffffff;
-        cursor: pointer;
-        margin-left: 10px;
-      }
-    }
-    .projectList {
-      margin-top: 40px;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      overflow-x: auto;
-      .projectName {
-        width: 270px;
-        margin-top: 12px;
-        font-size: 18px;
-        font-weight: 600;
-        color: #333333;
-        line-height: 25px;
-        margin-bottom: 40px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      .progress {
-        display: flex;
-        align-items: center;
-        .el-progress-bar__outer {
-          background-color: rgba(255, 160, 80, 0.19);
-        }
-        .progressNow {
-          font-size: 14px;
-          font-weight: 400;
-          color: #333333;
-          line-height: 20px;
-          margin-right: 20px;
-        }
-        .progressNum {
-          font-size: 12px;
-          font-weight: 400;
-          color: #999999;
-          line-height: 17px;
-          margin-left: 26px;
-        }
-      }
-      .studyNew {
-        margin-top: 16px;
-        font-size: 14px;
-        font-weight: 400;
-        color: #999999;
-        line-height: 20px;
-      }
-      .tobestarted {
-        width: 140px;
-        height: 40px;
-        border-radius: 4px;
-        border: 1px solid #387df7;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #387df7;
-        line-height: 22px;
-        cursor: pointer;
-        margin-right: 120px;
-      }
-      .gostudy {
-        width: 140px;
-        height: 40px;
-        background: #387df7;
-        box-shadow: 1px 2px 15px 1px rgba(56, 125, 247, 0.34);
-        border-radius: 4px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #ffffff;
-        line-height: 22px;
-        margin-right: 120px;
-        cursor: pointer;
-      }
-      .finish {
-        width: 140px;
-        height: 40px;
-        background: rgba(56, 125, 247, 0.6);
-        border-radius: 4px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 16px;
-        font-weight: 400;
-        color: #ffffff;
-        line-height: 22px;
-        cursor: pointer;
-      }
-    }
-  }
+	width: 100%;
+	min-height: 800px;
+	//border-radius: 8px;
+	background-color: rgba(255, 255, 255, 1);
+	display: flex;
+
+	// background-color: #ccc;
+	.content {
+		width: 100%;
+		// flex: 1;
+		margin-top: 50px;
+		margin-left: 81px;
+
+		.title {
+			font-size: 18px;
+			font-weight: 600;
+			color: #333333;
+			line-height: 25px;
+		}
+
+		.search {
+			margin-top: 31px;
+			display: flex;
+			align-items: center;
+
+			.searchBtn {
+				width: 100px;
+				height: 35px;
+				border-radius: 8px;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				background: #387df7;
+				border: 1px solid #387df7;
+				color: #ffffff;
+				cursor: pointer;
+				margin-left: 10px;
+			}
+		}
+
+		.projectList {
+			margin-top: 40px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			overflow-x: auto;
+
+			.projectName {
+				width: 270px;
+				margin-top: 12px;
+				font-size: 18px;
+				font-weight: 600;
+				color: #333333;
+				line-height: 25px;
+				margin-bottom: 40px;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
+
+			.progress {
+				display: flex;
+				align-items: center;
+
+				.el-progress-bar__outer {
+					background-color: rgba(255, 160, 80, 0.19);
+				}
+
+				.progressNow {
+					font-size: 14px;
+					font-weight: 400;
+					color: #333333;
+					line-height: 20px;
+					margin-right: 20px;
+				}
+
+				.progressNum {
+					font-size: 12px;
+					font-weight: 400;
+					color: #999999;
+					line-height: 17px;
+					margin-left: 26px;
+				}
+			}
+
+			.studyNew {
+				margin-top: 16px;
+				font-size: 14px;
+				font-weight: 400;
+				color: #999999;
+				line-height: 20px;
+			}
+
+			.tobestarted {
+				width: 140px;
+				height: 40px;
+				border-radius: 4px;
+				border: 1px solid #387df7;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #387df7;
+				line-height: 22px;
+				cursor: pointer;
+				margin-right: 120px;
+			}
+
+			.gostudy {
+				width: 140px;
+				height: 40px;
+				background: #387df7;
+				box-shadow: 1px 2px 15px 1px rgba(56, 125, 247, 0.34);
+				border-radius: 4px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #ffffff;
+				line-height: 22px;
+				margin-right: 120px;
+				cursor: pointer;
+			}
+
+			.finish {
+				width: 140px;
+				height: 40px;
+				background: rgba(56, 125, 247, 0.6);
+				border-radius: 4px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 16px;
+				font-weight: 400;
+				color: #ffffff;
+				line-height: 22px;
+				cursor: pointer;
+			}
+		}
+	}
 }
 </style>