fix:增加项目列表

This commit is contained in:
lixg
2022-12-18 21:07:03 +08:00
parent 8c382d74b6
commit eb42c94ce6
5 changed files with 345 additions and 13 deletions

View File

@@ -2,7 +2,7 @@
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-12-11 16:57:58
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-12-17 19:19:17
* @LastEditTime: 2022-12-18 18:37:26
* @FilePath: /fe-stu/src/api/api.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
@@ -53,4 +53,7 @@ export const ASSESSMENT_SUBMIT_QUERY = assessmentId => `/assessmentSubmit/queryA
export const ASSESSMENT_QUERY = assessmentId => `/stu/task/evaluate/get`
export const ASSESSMENT_SUBMIT = '/stu/task/evaluate/commit post'
export const ACTIVITY = '/activity'
export const ACTIVITY = '/activity'
export const STUDY_RECORD = '/stu/task/thirdTask/submit post'
export const PROJECT_LIST = '/stu/project/list post'

View File

@@ -1,4 +1,12 @@
import {createApp} from 'vue'
/*
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-12-11 16:57:58
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-12-18 16:31:00
* @FilePath: /fe-stu/src/main.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

View File

@@ -100,7 +100,7 @@
</div>
</div>
</div>
<div class="goclass" @click="toFinish(value, i.name)">
<div class="goclass" @click="toFinish(value, i.name, i.stageId)">
{{
value.status === 1
? "已完成"
@@ -313,7 +313,12 @@ import medal2 from "@/assets/image/medal/medal2.png";
import medal3 from "@/assets/image/medal/medal3.png";
import img from "@/assets/image/uploadimg.png";
import { useRequest, request } from "@/api/request";
import { PROJECT_PROCESS, ROUTER_PROCESS, LINK_DETAILS } from "@/api/api";
import {
PROJECT_PROCESS,
ROUTER_PROCESS,
LINK_DETAILS,
STUDY_RECORD,
} from "@/api/api";
import { useRoute, useRouter } from "vue-router";
import store from "@/store";
import { ElMessage } from "element-plus";
@@ -393,12 +398,21 @@ const types = ref({
},
});
function toFinish(d, sName) {
function toFinish(d, sName, chapterId) {
console.log("dddddd", d);
if (!types.value.path[d.type]) {
ElMessage.error("暂时未开放");
return;
}
if (d.type == 3 || d.type == 7) {
request(STUDY_RECORD, {
studentId: data.value.userInfoBo.userId,
targetId: data.value.routerId,
logo: 2,
stageOrChapterId: chapterId,
taskId: d.projectTaskId,
});
}
if (typeof types.value.path[d.type] === "string") {
types.value.path[d.type] &&
types.value.path[d.type].startsWith("http") &&

View File

@@ -0,0 +1,298 @@
<!--
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-12-18 15:56:03
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-12-18 21:04:56
* @FilePath: /fe-stu/src/views/project/ProjectList.vue
* @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">
<el-option
v-for="item in projectClassify"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-select v-model="value" class="m-2" placeholder="Select">
<el-option
v-for="item in studyProgress"
:key="item.value"
:label="item.label"
: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>
<button
class="searchBtn"
@click="searchClick"
style="margin-left: 20px"
>
搜索
</button>
<button class="searchBtn" @click="resetClick">重置</button>
</div>
<div class="projectList" v-for="(i, k) in data" :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>
</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,
} from "@/api/api";
import { useRouter } from "vue-router";
import store from "@/store";
const projectClassify = [];
const studyProgress = [];
const pageNo = ref("");
const pageSize = ref("");
const currentPage = ref("");
const projectTotal = ref("");
//搜索--------------start-----------------------------------------
const projectname = ref(""); //项目名称
const searchTime = ref(""); //选择时间
//搜索
const searchClick = () => {
console.log("点击搜索", projectname.value, searchTime.value);
let beginTime = null;
let endTime = null;
if (searchTime.value) {
beginTime = new Date(searchTime.value[0]).getTime();
endTime = new Date(searchTime.value[1]).getTime();
}
request(PROJECT_LIST, {
// beginTime: disDetail.value.discussId,
// endTime: replayComment.value.content,
// key: projectname.value,
// pageNo: pageNo,
// pageSize: pageSize,
}).then(() => {
commonFetch();
});
};
//重置
const resetClick = () => {
searchTime.value = "";
projectname.value = "";
console.log("点击重置");
};
//搜索--------------end-----------------------------------------
const userInfo = computed(() => store.state.userInfo);
const { data } = usePage(PROJECT_LIST, {});
console.log("datadata", data);
const router = useRouter();
const goProjectDetails = (value) => {
router.push({
path: "/projectdetails",
query: { 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;
.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>

View File

@@ -116,7 +116,7 @@
:style="{
background: `${types.path[value.type] ? '#2478ff' : '#999'}`,
}"
@click="toFinish(value, i.chapterName)"
@click="toFinish(value, i.chapterName, i.chapterId)"
>
{{
value.status === 1
@@ -329,7 +329,7 @@ import medal2 from "@/assets/image/medal/medal2.png";
import medal3 from "@/assets/image/medal/medal3.png";
import img from "@/assets/image/uploadimg.png";
import { boeRequest, useRequest, request } from "@/api/request";
import { ROUTER_PROCESS, LINK_DETAILS } from "@/api/api";
import { ROUTER_PROCESS, LINK_DETAILS, STUDY_RECORD } from "@/api/api";
import { useRoute, useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { useUserInfo } from "@/api/utils";
@@ -345,7 +345,7 @@ const returnclick = () => {
const { data } = useRequest(ROUTER_PROCESS, { routerId });
console.log("data", data);
const userInfo = computed(() => store.state.userInfo);
console.log("userInfo", userInfo);
const activeName = ref("first");
const handleClick = (tab, event) => {
@@ -409,14 +409,23 @@ const types = ref({
},
});
function toFinish(d, sName) {
function toFinish(d, sName, chapterId) {
if (!types.value.path[d.type]) {
ElMessage.error("暂时未开放");
return;
}
if (d.type == 3 || d.type == 7) {
request(STUDY_RECORD, {
studentId: data.value.userInfoBo.userId,
targetId: data.value.routerId,
logo: 1,
stageOrChapterId: chapterId,
taskId: d.routerTaskId,
});
}
if (typeof types.value.path[d.type] === "string") {
// console.log("dddddd", d);
console.log("dddddd", d);
types.value.path[d.type] &&
types.value.path[d.type].startsWith("http") &&
window.open(types.value.path[d.type] + d.targetId);