This commit is contained in:
wuyx
2022-12-23 09:15:51 +08:00
5 changed files with 287 additions and 272 deletions

View File

@@ -271,6 +271,7 @@ const showFileList = computed(() => {
return fileList.value.length return fileList.value.length
}) })
const handleClick = () => { const handleClick = () => {
console.log(fileList.value, uploadRef.value) console.log(fileList.value, uploadRef.value)
if (!sbValue.value.content) { if (!sbValue.value.content) {

View File

@@ -2,9 +2,16 @@
<div class="pathdetails" style="padding: 30px"> <div class="pathdetails" style="padding: 30px">
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div class="crumb"> <div class="crumb">
<div>{{data.name}}</div> <div>{{data.name}}</div>
<div style="margin-left: 6px; margin-right: 6px">/</div> <div style="margin-left: 6px; margin-right: 6px">/</div>
<div style="font-weight: 700">项目详情</div> <div style="font-weight: 700">项目详情</div>
<div class="return">
<div style="display: flex" @click="returnclick">
<img class="img2" style="margin-right: 22px;cursor: pointer;" src="../../assets/image/return.png" />
<div style="cursor: pointer;" class="text">返回</div>
</div>
</div>
</div> </div>
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div class="pdname"> <div class="pdname">
@@ -75,7 +82,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="goclass" @click="toFinish(value, i.name, i.stageId)"> <div class="goclass" @click="toFinish(value, i.stageName, i.stageId)">
{{ {{
value.status === 1 value.status === 1
? "已完成" ? "已完成"
@@ -373,7 +380,7 @@ function introductionPro() {
} }
function toFinish(d, sName, chapterId) { function toFinish(d, sName, chapterId) {
console.log("dddddd", d); console.log("dddddd", d, sName);
// 作业过期判断 // 作业过期判断
if (d.type == 4) { if (d.type == 4) {
let date1 = new Date(d.endTime).getTime(); let date1 = new Date(d.endTime).getTime();
@@ -490,6 +497,17 @@ function whiteTypes(type) {
display: flex; display: flex;
font-size: 14px; font-size: 14px;
line-height: 24px; line-height: 24px;
.return {
position: absolute;
right: 10%;
.text {
text-align: center;
display: flex;
flex-direction: row;
align-items: center;
}
}
} }
.pdname { .pdname {

View File

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

View File

@@ -5,6 +5,13 @@
<div>{{ routerName }}</div> <div>{{ routerName }}</div>
<div style="margin-left: 6px; margin-right: 6px">/</div> <div style="margin-left: 6px; margin-right: 6px">/</div>
<div style="font-weight: 700">路径图详情</div> <div style="font-weight: 700">路径图详情</div>
<div class="return">
<div style="display: flex" @click="returnclick">
<img class="img2" style="margin-right: 22px;cursor: pointer;" src="../../assets/image/return.png" />
<div style="cursor: pointer;" class="text">返回</div>
</div>
</div>
</div> </div>
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div class="pdname"> <div class="pdname">
@@ -448,7 +455,7 @@ function toFinish(d) {
type: 1, type: 1,
courseId: d.courseId, courseId: d.courseId,
pName: data.value.name, pName: data.value.name,
sName:data.currentStageName, sName:data.value.currentStageName,
}, },
}); });
} else if (typeof types.value.path[d.type] === "function") { } else if (typeof types.value.path[d.type] === "function") {

View File

@@ -413,6 +413,10 @@ function formateArr(arr1) {
const { data } = useRequest(ASSESSMENT_QUERY(courseId), { id: courseId }); const { data } = useRequest(ASSESSMENT_QUERY(courseId), { id: courseId });
console.log('我是需要排序得题目', data ) console.log('我是需要排序得题目', data )
function goHome() {
}
const centerDialogVisible =ref(false); const centerDialogVisible =ref(false);
const open=()=>{ const open=()=>{
centerDialogVisible.value = true centerDialogVisible.value = true