hz/fe-student
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-student.git synced 2025-12-11 03:46:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/develop' into develop

Browse Source
This commit is contained in:
yuping
2023-02-23 15:00:12 +08:00
parent 33cbb25234 2167b33c2f
commit 7eae401bdb
2 changed files with 253 additions and 304 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
src/views/project/ProjectDetails.vue
View File

@@ -18,7 +18,7 @@
<div v-else class="title"> <div v-else class="title">
<div class="titleL">{{ i.stageName }}</div> <div class="titleL">{{ i.stageName }}</div>
<div class="titleR" :style="{ display: 'flex' }"> <div class="titleR" :style="{ display: 'flex' }">
<img src="../../assets/image/pathdetails/circle.png"/> <img src="../../assets/image/pathdetails/circle.png" />
<div class="titleRT" <div class="titleRT"
:style="(i.statusName === '已完成' || i.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'"> :style="(i.statusName === '已完成' || i.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'">
{{ i.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }} {{ i.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }}
@@ -26,11 +26,9 @@
</div> </div>
</div> </div>
<div v-if="i.id == '0' && i.taskProcessList?.length == 0"></div> <div v-if="i.id == '0' && i.taskProcessList?.length == 0"></div>
<div v-else class="course" <div v-else class="course" v-for="(value, index) in (i.taskProcessList.sort((a, b) => { return a.id - b.id; })).filter(
v-for="(value, index) in (i.taskProcessList.sort((a,b)=>{ return a.id - b.id; })).filter(
(e) => !whiteTypes(e.type) (e) => !whiteTypes(e.type)
)" )" :key="index">
:key="index">
<div style="width: 70%"> <div style="width: 70%">
<div v-if="value.name.length > 50" class="coursename" :title="value.name"> <div v-if="value.name.length > 50" class="coursename" :title="value.name">
<el-popover ref="popover" placement="right" trigger="hover" :width="300" :content="value.name"> <el-popover ref="popover" placement="right" trigger="hover" :width="300" :content="value.name">
@@ -62,11 +60,7 @@
<div>当前进度</div> <div>当前进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress <el-progress :percentage="parseInt(value.currentRatio)" :show-text="false" :stroke-width="8" :color="
:percentage="parseInt(value.currentRatio)"
:show-text="false"
:stroke-width="8"
:color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)', 1: 'rgba(255, 151, 38, 1)',
@@ -75,7 +69,7 @@
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt(parseInt(value.currentRatio) / 20)] }[parseInt(parseInt(value.currentRatio) / 20)]
"/> " />
</div> </div>
<div style="font-size: 14px;font-weight: 500;color: #277aff;margin-left: 10px;color:#677d86;"> <div style="font-size: 14px;font-weight: 500;color: #277aff;margin-left: 10px;color:#677d86;">
{{ parseInt(value.currentRatio) }}% {{ parseInt(value.currentRatio) }}%
@@ -84,7 +78,7 @@
</div> </div>
</div> </div>
<div class="goclass" @click="toFinish(value, i.stageName, i.id)" <div class="goclass" @click="toFinish(value, i.stageName, i.id)"
:style="{background:(value.statusName !=='已结束' && (value.statusName || data.unlockMode === 1)) ?'#2478ff':'#999'}"> :style="{ background: (value.statusName !== '已结束' && (value.statusName || data.unlockMode === 1)) ? '#2478ff' : '#999' }">
{{ value.statusName || (data.unlockMode === 1 ? TASK_TYPES.toName[value.type] : '未解锁') }} {{ value.statusName || (data.unlockMode === 1 ? TASK_TYPES.toName[value.type] : '未解锁') }}
</div> </div>
<!-- <div :style="{ display: value.status === 1 ? 'block' : 'none' }">--> <!-- <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
@@ -119,23 +113,17 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="共享文档" name="second"> <el-tab-pane label="共享文档" name="second">
<div style="padding: 19px 30px 17px 28px"> <div style="padding: 19px 30px 17px 28px">
<div <div v-for="(value, index) in JSON.parse(data.attach ? data.attach : '[]')" :key="index" style="
v-for="(value, index) in JSON.parse(data.attach?data.attach:'[]')"
:key="index"
style="
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 15px;"> margin-bottom: 15px;">
<!-- <img :src="value.img" style="width: 22px; height: 26px"/> --> <!-- <img :src="value.img" style="width: 22px; height: 26px"/> -->
<FileTypeImg <FileTypeImg
:v-model="value.name? value.name : value.slice(value.lastIndexOf('/')+1,value.indexOf('-')) + value.slice(value.lastIndexOf('.'))" :v-model="value.name ? value.name : value.slice(value.lastIndexOf('/') + 1, value.indexOf('-')) + value.slice(value.lastIndexOf('.'))"
:style="{width: '22px',height: '26px'}"></FileTypeImg> :style="{ width: '22px', height: '26px' }"></FileTypeImg>
<div class="sharedocname">{{ value.name }}</div> <div class="sharedocname">{{ value.name }}</div>
<div class="download"> <div class="download">
<img <img src="../../assets/image/download.png" style="width: 16px; height: 15px" />
src="../../assets/image/download.png"
style="width: 16px; height: 15px"
/>
<div style="margin-left: 7px" @click="downloadFile(value.response.data)">下载</div> <div style="margin-left: 7px" @click="downloadFile(value.response.data)">下载</div>
</div> </div>
</div> </div>
@@ -148,13 +136,13 @@
<div class="detailRB"> <div class="detailRB">
<div class="info"> <div class="info">
<div class="title"> <div class="title">
<img style="width: 21px; height: 20px" src="../../assets/image/pathdetails/info.png"/> <img style="width: 21px; height: 20px" src="../../assets/image/pathdetails/info.png" />
<div class="text" style="margin-left: 7px">个人信息</div> <div class="text" style="margin-left: 7px">个人信息</div>
<div class="box"></div> <div class="box"></div>
</div> </div>
<!-- todo #路径详情 个人信息缺少img和介绍--> <!-- todo #路径详情 个人信息缺少img和介绍-->
<div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }"> <div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }">
<img class="peopleimg" :src="userInfo?.avatar"/> <img class="peopleimg" :src="userInfo?.avatar" />
<div style="margin-left: 17px"> <div style="margin-left: 17px">
<div class="teacherName"> <div class="teacherName">
<div style="margin-right: 5px"> <div style="margin-right: 5px">
@@ -167,7 +155,7 @@
</div> </div>
<div class="info" style="padding-top: 20px"> <div class="info" style="padding-top: 20px">
<div class="title"> <div class="title">
<img style="width: 18px; height: 17px" src="../../assets/image/pathdetails/study.png"/> <img style="width: 18px; height: 17px" src="../../assets/image/pathdetails/study.png" />
<div class="text" style="margin-left: 9px">学习进度</div> <div class="text" style="margin-left: 9px">学习进度</div>
<div class="box"></div> <div class="box"></div>
</div> </div>
@@ -182,8 +170,8 @@
<div>总进度</div> <div>总进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress :percentage="parseInt(data.totalProgress * 100)" :show-text="false" :stroke-width="8" <el-progress :percentage="parseInt((data.totalProgress ? data.totalProgress : 0) * 100)"
:color=" :show-text="false" :stroke-width="8" :color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)', 1: 'rgba(255, 151, 38, 1)',
@@ -191,11 +179,11 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.totalProgress * 100) / 20)] }[parseInt(((data.totalProgress ? data.totalProgress : 0) * 100) / 20)]
"/> " />
</div> </div>
<div style="font-size: 14px; font-weight: 500; margin-left: 10px;color:#677d86;"> <div style="font-size: 14px; font-weight: 500; margin-left: 10px;color:#677d86;">
{{ parseInt(data.totalProgress * 100) }}% {{ parseInt(data.totalProgress ? data.totalProgress > 1 ? 1 : data.totalProgress : 0 * 100) }}%
</div> </div>
</div> </div>
</div> </div>
@@ -205,8 +193,8 @@
<div>必修进度</div> <div>必修进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress :percentage="parseInt(data.compulsoryProgress * 100)" :show-text="false" <el-progress :percentage="parseInt((data.compulsoryProgress ? data.compulsoryProgress : 0) * 100)"
:stroke-width="8" :color=" :show-text="false" :stroke-width="8" :color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)', 1: 'rgba(255, 151, 38, 1)',
@@ -214,15 +202,17 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.compulsoryProgress * 100) / 20)] }[parseInt(((data.compulsoryProgress ? data.compulsoryProgress : 0) * 100) / 20)]
"/> " />
</div> </div>
<div style=" <div style="
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: #277aff; color: #277aff;
margin-left: 10px;color:#677d86;"> margin-left: 10px;color:#677d86;">
{{ parseInt(data.compulsoryProgress * 100) }}% {{
parseInt(((data.compulsoryProgress ? data.compulsoryProgress : 0) > 1 ? 1 : (data.compulsoryProgress ? data.compulsoryProgress : 0))
* 100) }}%
</div> </div>
</div> </div>
</div> </div>
@@ -235,34 +225,21 @@
<div class="info"> <div class="info">
<div <div
style="display:flex;justify-content: space-between;align-items: center;height: 56px;padding-left: 27px;padding-right: 27px;"> style="display:flex;justify-content: space-between;align-items: center;height: 56px;padding-left: 27px;padding-right: 27px;">
<div <div @click="tabChange(1)"
@click="tabChange(1)" style="font-size: 14px;color: rgba(51, 51, 51, 1);font-weight: 600;cursor: pointer;" :style="{}">积分排行榜
style="font-size: 14px;color: rgba(51, 51, 51, 1);font-weight: 600;cursor: pointer;"
:style="{}"
>积分排行榜
</div> </div>
<!-- <div style="font-size: 14px;color: rgba(51, 51, 51, 1);font-weight: 600;">完成度排行榜</div> --> <!-- <div style="font-size: 14px;color: rgba(51, 51, 51, 1);font-weight: 600;">完成度排行榜</div> -->
<el-select <el-select @change="choiceStatus" v-model="stateValue" class="m-2" mode="tags" placeholder="完成度排行榜"
@change="choiceStatus"
v-model="stateValue"
class="m-2"
mode="tags"
placeholder="完成度排行榜"
style="width: 130px;border: 0px solid red !important; box-shadow:none !important; "> style="width: 130px;border: 0px solid red !important; box-shadow:none !important; ">
<el-option <el-option v-for="item in studyProgress" :key="item.value" :label="item.label" :value="item.value" />
v-for="item in studyProgress"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<!-- line --> <!-- line -->
<div style="display: flex;height: 1px;background-color: #ecf5ff;justify-content: space-between;"> <div style="display: flex;height: 1px;background-color: #ecf5ff;justify-content: space-between;">
<div v-if="tabValue==1" style="width:90px;height: 2px;background-color: #409EFF;margin-left: 18px;"></div> <div v-if="tabValue == 1" style="width:90px;height: 2px;background-color: #409EFF;margin-left: 18px;"></div>
<div v-else style="width:90px;height: 2px;background-color: rgba(0,0,0,0);margin-left: 18px;"></div> <div v-else style="width:90px;height: 2px;background-color: rgba(0,0,0,0);margin-left: 18px;"></div>
<div v-if="tabValue!==1" <div v-if="tabValue !== 1" style="width:146px;height: 2px;background-color: #409EFF;margin-right: 18px;">
style="width:146px;height: 2px;background-color: #409EFF;margin-right: 18px;"></div> </div>
<div v-else style="width:146px;height: 2px;background-color: rgba(0,0,0,0);margin-right: 18px;"></div> <div v-else style="width:146px;height: 2px;background-color: rgba(0,0,0,0);margin-right: 18px;"></div>
</div> </div>
<!-- line --> <!-- line -->
@@ -292,39 +269,20 @@
</div> </div>
<!-- 学员列表 --> <!-- 学员列表 -->
<div> <div>
<div <div v-for="(item, i) in tableRankData" :key="i"
v-for="(item,i) in tableRankData" :key="i"
style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;"> style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;">
<div <div
style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;position: relative;"> style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;position: relative;">
{{ i + 1 == 1 || i + 1 == 2 || i + 1 == 3 ? '' : i + 1 }} {{ i + 1 == 1 || i + 1 == 2 || i + 1 == 3 ? '' : i + 1 }}
<img <img v-if="i + 1 == 1" style="width: 24px; height: 24px;" src="../../assets/image/rank1.png" />
v-if="i + 1 == 1" <img v-if="i + 1 == 2" style="width: 24px; height: 24px;" src="../../assets/image/rank2.png" />
style="width: 24px; height: 24px;" <img v-if="i + 1 == 3" style="width: 24px; height: 24px;" src="../../assets/image/rank3.png" />
src="../../assets/image/rank1.png" <img v-if="i + 1 == myIndex" style="width: 24px; height: 24px;position: absolute;left:110px;"
/> src="../../assets/image/rankme.png" />
<img
v-if="i + 1 == 2"
style="width: 24px; height: 24px;"
src="../../assets/image/rank2.png"
/>
<img
v-if="i + 1 == 3"
style="width: 24px; height: 24px;"
src="../../assets/image/rank3.png"
/>
<img
v-if="i + 1 == myIndex"
style="width: 24px; height: 24px;position: absolute;left:110px;"
src="../../assets/image/rankme.png"
/>
</div> </div>
<div <div
style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:34%;display: flex;justify-content: center;align-items: center;"> style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:34%;display: flex;justify-content: center;align-items: center;">
<img <img style="width: 28px; height: 28px;border-radius: 28px;" :src="item?.avatar" />
style="width: 28px; height: 28px;border-radius: 28px;"
:src="item?.avatar"
/>
{{ item.name }} {{ item.name }}
</div> </div>
<div <div
@@ -334,8 +292,7 @@
</div> </div>
<!-- 我的排名 --> <!-- 我的排名 -->
<div <div v-if="myIndex > tableRankData.length"
v-if="myIndex > tableRankData.length"
style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;"> style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;">
<div <div
style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;"> style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;">
@@ -351,23 +308,17 @@
</div> </div>
</div> </div>
<div <div v-if="myIndex > tableRankData.length"
v-if="myIndex > tableRankData.length"
style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;"> style="display: flex;justify-content: center;align-items: center;width: 100%;position: relative;top:-60px;margin-bottom: 38px;">
<div <div
style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;"> style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:30%;display: flex;justify-content: center;align-items: center;">
{{ myIndex }} {{ myIndex }}
<img <img style="width: 24px; height: 24px;position: absolute;left:110px;"
style="width: 24px; height: 24px;position: absolute;left:110px;" src="../../assets/image/rankme.png" />
src="../../assets/image/rankme.png"
/>
</div> </div>
<div <div
style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:34%;display: flex;justify-content: center;align-items: center;"> style="font-size: 14px;color:rgba(36, 120, 255, 1);font-weight: 600;width:34%;display: flex;justify-content: center;align-items: center;">
<img <img style="width: 28px; height: 28px;border-radius: 28px;" :src="tableRankData[myIndex - 1]?.avatar" />
style="width: 28px; height: 28px;border-radius: 28px;"
:src="tableRankData[myIndex-1]?.avatar"
/>
{{ tableRankData[myIndex - 1]?.name }} {{ tableRankData[myIndex - 1]?.name }}
</div> </div>
<div <div
@@ -397,26 +348,26 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import {computed, onMounted, ref, watch} from "vue"; import { computed, onMounted, ref, watch } from "vue";
import {ElLoading, ElMessage} from 'element-plus' import { ElLoading, ElMessage } from 'element-plus'
import {request} from "@/api/request"; import { request } from "@/api/request";
import {CompletionList, EvaluationToLearn, PointList, STUDY_RECORD, SubmitExternalExam, QueryEvaluationTaskStatusOne} from "@/api/api"; import { CompletionList, EvaluationToLearn, PointList, STUDY_RECORD, SubmitExternalExam, QueryEvaluationTaskStatusOne } from "@/api/api";
import {useRoute, useRouter} from "vue-router"; import { useRoute, useRouter } from "vue-router";
import {PROJECT, TASK_TYPES} from "@/api/CONST"; import { PROJECT, TASK_TYPES } from "@/api/CONST";
import FileTypeImg from "@/components/FileTypeImg.vue"; import FileTypeImg from "@/components/FileTypeImg.vue";
import {UPDATE_CURRENT_TASK} from "@/api/api"; import { UPDATE_CURRENT_TASK } from "@/api/api";
import {useStore} from "vuex"; import { useStore } from "vuex";
const { const {
query: {courseId, projectId}, query: { courseId, projectId },
} = useRoute(); } = useRoute();
const router = useRouter(); const router = useRouter();
const {commit, dispatch, state} = useStore() const { commit, dispatch, state } = useStore()
const store = useStore() const store = useStore()
const userInfo = computed(()=>state.userInfo) const userInfo = computed(() => state.userInfo)
const data = computed(()=>state.projectInfo) const data = computed(() => state.projectInfo)
onMounted(() => { onMounted(() => {
dispatch('getProjectInfo', {projectId}) dispatch('getProjectInfo', { projectId })
}) })
const tableRankData = ref([]) const tableRankData = ref([])
@@ -438,8 +389,8 @@ const choiceStatus = (e) => {
tabValue.value = e tabValue.value = e
stateValue.value = e stateValue.value = e
// 获取个人完成度 // 获取个人完成度
request(CompletionList, {projectId: projectId, type: e === 2 ? 0 : 1}).then(res => { request(CompletionList, { projectId: projectId, type: e === 2 ? 0 : 1 }).then(res => {
tableRankData.value =res.data.datas tableRankData.value = res.data.datas
myIndex.value = res.data.myIndex myIndex.value = res.data.myIndex
myRate.value = res.data.myRate myRate.value = res.data.myRate
myRateStr.value = res.data.myRateStr myRateStr.value = res.data.myRateStr
@@ -452,17 +403,17 @@ const tabChange = (tabs) => {
stateValue.value = undefined; stateValue.value = undefined;
tabValue.value = tabs; tabValue.value = tabs;
// 获取项目积分 // 获取项目积分
request(PointList, {projectId: projectId}).then(res => { request(PointList, { projectId: projectId }).then(res => {
tableRankData.value =res.data.datas tableRankData.value = res.data.datas
myIndex.value = res.data.myIndex myIndex.value = res.data.myIndex
myPoint.value = res.data.myPointsCount myPoint.value = res.data.myPointsCount
}) })
tableRankData.value =12 tableRankData.value = 12
} }
const myIndex = ref('') const myIndex = ref('')
const myPoint = ref('') const myPoint = ref('')
// 获取项目积分 // 获取项目积分
request(PointList, {projectId: projectId}).then(res => { request(PointList, { projectId: projectId }).then(res => {
tableRankData.value = res.data.datas tableRankData.value = res.data.datas
myIndex.value = res.data.myIndex myIndex.value = res.data.myIndex
myPoint.value = res.data.myPointsCount myPoint.value = res.data.myPointsCount
@@ -472,7 +423,7 @@ const activeName = ref("first");
const handleClick = (tab, event) => { const handleClick = (tab, event) => {
console.log(tab, event); console.log(tab, event);
}; };
const path = {1: "path"}; const path = { 1: "path" };
const dialogVisible = ref(false); const dialogVisible = ref(false);
const dialogVisibleTip = ref('该任务无法学习，请联系管理员进行替换！'); const dialogVisibleTip = ref('该任务无法学习，请联系管理员进行替换！');
@@ -623,7 +574,7 @@ async function toFinish(d, sName, chapterOrStageId) {
} }
// 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04 // 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04
if (d.type == 10) { if (d.type == 10) {
if(d.quizTaskId==null){ if (d.quizTaskId == null) {
// 肯定没有完成测评 // 肯定没有完成测评
// 调用接口 跳转页面 // 调用接口 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {
@@ -654,7 +605,7 @@ async function toFinish(d, sName, chapterOrStageId) {
console.log(err) console.log(err)
}) })
return return
}else{ } else {
// 进行中 或者 已完成 // 进行中 或者 已完成
// 调用接口 判断当前测评状态 跳转页面 // 调用接口 判断当前测评状态 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {
@@ -665,10 +616,10 @@ async function toFinish(d, sName, chapterOrStageId) {
}).then(res => { }).then(res => {
console.log(res) console.log(res)
if (res.code == 200) { if (res.code == 200) {
if(res.data.complete_status==2){ if (res.data.complete_status == 2) {
ElMessage.error("您已完成测评") ElMessage.error("您已完成测评")
return return
}else{ } else {
// 重新查询跳转 // 重新查询跳转
// 调用接口 跳转页面 // 调用接口 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {
@@ -713,7 +664,7 @@ async function toFinish(d, sName, chapterOrStageId) {
return; return;
} }
//更新学员当前任务 //更新学员当前任务
await request(UPDATE_CURRENT_TASK, {id: d.id, type: PROJECT, pid: projectId, name: d.name}) await request(UPDATE_CURRENT_TASK, { id: d.id, type: PROJECT, pid: projectId, name: d.name })
if (d.type == 3 || d.type == 7 || (d.type === 5 && d.examType === 2)) { if (d.type == 3 || d.type == 7 || (d.type === 5 && d.examType === 2)) {
d.status !== 1 && await request(STUDY_RECORD, { d.status !== 1 && await request(STUDY_RECORD, {
studentId: userInfo.value.id, studentId: userInfo.value.id,

104
src/views/roadmap/PathDetails.vue
View File

@@ -7,8 +7,7 @@
<div class="pdname"> <div class="pdname">
{{ data.name }} {{ data.name }}
<el-popover v-if="data.chapterRemark" ref="popover" popper-class="jianjie" placement="right" trigger="hover" <el-popover v-if="data.chapterRemark" ref="popover" popper-class="jianjie" placement="right" trigger="hover"
:width="300" :width="300" :content="data.chapterRemark">
:content="data.chapterRemark">
<template #reference><span style="font-size: 16px;font-weight: 600;">关卡说明></span></template> <template #reference><span style="font-size: 16px;font-weight: 600;">关卡说明></span></template>
</el-popover> </el-popover>
</div> </div>
@@ -20,15 +19,14 @@
<div class="title"> <div class="title">
<div class="titleL">{{ data.currentStageName }}</div> <div class="titleL">{{ data.currentStageName }}</div>
<div class="titleR" :style="{ display: 'flex' }"> <div class="titleR" :style="{ display: 'flex' }">
<img :src="data.currentChapterCnt ? circle : circle2"/> <img :src="data.currentChapterCnt ? circle : circle2" />
<div class="titleRT" <div class="titleRT"
:style="(data.statusName === '已完成' || data.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'"> :style="(data.statusName === '已完成' || data.statusName === '进行中') ? 'color:#0060ff' : 'color:#999'">
{{ data.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }} {{ data.statusName || (data.unlockMode === 1 ? '未开始' : '未解锁') }}
</div> </div>
</div> </div>
</div> </div>
<div class="course" v-for="(value, index) in data.taskBoList?.filter((e) => !whiteTypes(e.type))" <div class="course" v-for="(value, index) in data.taskBoList?.filter((e) => !whiteTypes(e.type))" :key="index">
:key="index">
<div style="width: 70%"> <div style="width: 70%">
<div v-if="value.name.length > 50" class="coursename" :title="value.name"> <div v-if="value.name.length > 50" class="coursename" :title="value.name">
<el-popover ref="popover" placement="right" trigger="hover" :width="300" :content="value.name"> <el-popover ref="popover" placement="right" trigger="hover" :width="300" :content="value.name">
@@ -63,8 +61,7 @@
<div>当前进度</div> <div>当前进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress :percentage="parseInt(value.currentRatio)" :show-text="false" :stroke-width="8" <el-progress :percentage="parseInt(value.currentRatio)" :show-text="false" :stroke-width="8" :color="
:color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)', 1: 'rgba(255, 151, 38, 1)',
@@ -73,7 +70,7 @@
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt(parseInt(value.currentRatio) / 20)] }[parseInt(parseInt(value.currentRatio) / 20)]
"/> " />
</div> </div>
<div style="font-size: 14px;font-weight: 500;color: #277aff;margin-left: 10px;" :style="{ <div style="font-size: 14px;font-weight: 500;color: #277aff;margin-left: 10px;" :style="{
color: { color: {
@@ -84,14 +81,14 @@
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt(parseInt(value.currentRatio) / 20)], }[parseInt(parseInt(value.currentRatio) / 20)],
}"> }">
{{ parseInt(value.currentRatio) }}% {{ parseInt(value.currentRatio) }}%
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="goclass" <div class="goclass"
:style="{background:(value.statusName !=='已结束' && (value.statusName || data.unlockMode === 1)) ?'#2478ff':'#999'}" :style="{ background: (value.statusName !== '已结束' && (value.statusName || data.unlockMode === 1)) ? '#2478ff' : '#999' }"
@click="toFinish(value)"> @click="toFinish(value)">
{{ value.statusName || (data.unlockMode === 1 ? TASK_TYPES.toName[value.type] : '未解锁') }} {{ value.statusName || (data.unlockMode === 1 ? TASK_TYPES.toName[value.type] : '未解锁') }}
</div> </div>
@@ -123,25 +120,19 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="共享文档" name="second" v-if="data.attachSwitch =='1'"> <el-tab-pane label="共享文档" name="second" v-if="data.attachSwitch == '1'">
<div style="padding: 19px 30px 17px 28px"> <div style="padding: 19px 30px 17px 28px">
<div <div v-for="(value, index) in JSON.parse(data.attach ? data.attach : '[]')" :key="index" style="
v-for="(value, index) in JSON.parse(data.attach?data.attach:'[]')"
:key="index"
style="
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 15px;"> margin-bottom: 15px;">
<!-- <img :src="value.img" style="width: 22px; height: 26px"/> --> <!-- <img :src="value.img" style="width: 22px; height: 26px"/> -->
<FileTypeImg <FileTypeImg
:v-model="value.name? value.name : value.slice(value.lastIndexOf('/')+1,value.indexOf('-')) + value.slice(value.lastIndexOf('.'))" :v-model="value.name ? value.name : value.slice(value.lastIndexOf('/') + 1, value.indexOf('-')) + value.slice(value.lastIndexOf('.'))"
:style="{width: '22px',height: '26px'}"></FileTypeImg> :style="{ width: '22px', height: '26px' }"></FileTypeImg>
<div class="sharedocname">{{ value.name }}</div> <div class="sharedocname">{{ value.name }}</div>
<div class="download"> <div class="download">
<img <img src="../../assets/image/download.png" style="width: 16px; height: 15px" />
src="../../assets/image/download.png"
style="width: 16px; height: 15px"
/>
<div style="margin-left: 7px" @click="downloadFile(value.response.data)">下载</div> <div style="margin-left: 7px" @click="downloadFile(value.response.data)">下载</div>
</div> </div>
</div> </div>
@@ -154,13 +145,13 @@
<div class="detailRB"> <div class="detailRB">
<div class="info"> <div class="info">
<div class="title"> <div class="title">
<img style="width: 21px; height: 20px" src="../../assets/image/pathdetails/info.png"/> <img style="width: 21px; height: 20px" src="../../assets/image/pathdetails/info.png" />
<div class="text" style="margin-left: 7px">个人信息</div> <div class="text" style="margin-left: 7px">个人信息</div>
<div class="box"></div> <div class="box"></div>
</div> </div>
<!-- todo #路径详情 个人信息缺少img和介绍--> <!-- todo #路径详情 个人信息缺少img和介绍-->
<div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }"> <div class="teacheritem" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }">
<img class="peopleimg" :src="userInfo?.avatar"/> <img class="peopleimg" :src="userInfo?.avatar" />
<div style="margin-left: 17px"> <div style="margin-left: 17px">
<div class="teacherName"> <div class="teacherName">
<div style="margin-right: 5px"> <div style="margin-right: 5px">
@@ -176,7 +167,7 @@
</div> </div>
<div class="info" style="padding-top: 20px"> <div class="info" style="padding-top: 20px">
<div class="title"> <div class="title">
<img style="width: 18px; height: 17px" src="../../assets/image/pathdetails/study.png"/> <img style="width: 18px; height: 17px" src="../../assets/image/pathdetails/study.png" />
<div class="text" style="margin-left: 9px">学习进度</div> <div class="text" style="margin-left: 9px">学习进度</div>
<div class="box"></div> <div class="box"></div>
</div> </div>
@@ -192,7 +183,8 @@
<div>总进度</div> <div>总进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress :percentage="parseInt(data.currentChapterCnt / data.totalChapterCnt * 100)" <el-progress
:percentage="parseInt((data.currentChapterCnt ? data.currentChapterCnt : 0 / data.totalChapterCnt ? data.totalChapterCn : 0) * 100)"
:show-text="false" :stroke-width="8" :color=" :show-text="false" :stroke-width="8" :color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
@@ -201,8 +193,8 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[(parseInt(data.currentChapterCnt / data.totalChapterCnt) * 100) / 20] }[(parseInt(data.currentChapterCnt ? data.currentChapterCnt : 0 / data.totalChapterCnt ? data.totalChapterCnt : 0) * 100) / 20]
"/> " />
</div> </div>
<div style="font-size: 14px; font-weight: 500; margin-left: 10px" :style="{ <div style="font-size: 14px; font-weight: 500; margin-left: 10px" :style="{
color: { color: {
@@ -212,9 +204,12 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentChapterCnt / data.totalChapterCnt * 100) / 20)], }[parseInt(((data.currentChapterCnt ? data.currentChapterCnt : 0 / data.totalChapterCnt ? data.totalChapterCnt : 0) * 100) / 20)],
}"> }">
{{ parseInt(data.currentChapterCnt / data.totalChapterCnt * 100) }}% {{ parseInt((data.currentChapterCnt ? data.currentChapterCnt : 0 /
data.totalChapterCnt ? data.totalChapterCnt : 0) > 1 ? 1 : (data.currentChapterCnt ?
data.currentChapterCnt : 0 /
data.totalChapterCnt ? data.totalChapterCnt : 0) * 100) }}%
</div> </div>
</div> </div>
</div> </div>
@@ -224,8 +219,9 @@
<div>必修进度</div> <div>必修进度</div>
<div class="progress"> <div class="progress">
<div style="width: 291px"> <div style="width: 291px">
<el-progress :percentage="parseInt(data.currentReqCnt / data.totalReqCnt * 100)" :show-text="false" <el-progress
:stroke-width="8" :color=" :percentage="parseInt((data.currentReqCnt ? data.currentReqCnt : 0 / data.totalReqCnt ? data.totalReqCnt : 0) * 100)"
:show-text="false" :stroke-width="8" :color="
{ {
0: 'rgba(238, 112, 108, 1)', 0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)', 1: 'rgba(255, 151, 38, 1)',
@@ -233,8 +229,8 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)] }[parseInt(((data.currentReqCnt ? data.currentReqCnt : 0 / data.totalReqCnt ? data.totalReqCnt : 0) * 100) / 20)]
"/> " />
</div> </div>
<div style=" <div style="
font-size: 14px; font-size: 14px;
@@ -249,9 +245,11 @@
3: 'rgba(59, 94, 251, 1)', 3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)', 4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)', 5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)], }[parseInt(((data.currentReqCnt ? data.currentReqCnt : 0 / data.totalReqCnt ? data.totalReqCnt : 0) * 100) / 20)],
}"> }">
{{ parseInt(data.currentReqCnt?data.currentReqCnt:0 / data.totalReqCnt?data.totalReqCnt:0 * 100) }}% {{ parseInt((data.currentReqCnt ? data.currentReqCnt : 0 / data.totalReqCnt ? data.totalReqCnt :
0) > 1 ? 1 : (data.currentReqCnt ? data.currentReqCnt : 0 / data.totalReqCnt ? data.totalReqCnt : 0) *
100) }}%
</div> </div>
</div> </div>
</div> </div>
@@ -276,39 +274,39 @@
</template> </template>
<script setup> <script setup>
import {computed, onMounted, ref} from "vue"; import { computed, onMounted, ref } from "vue";
import circle from '@/assets/image/pathdetails/circle.png'; import circle from '@/assets/image/pathdetails/circle.png';
import circle2 from '@/assets/image/pathdetails/circle2.png'; import circle2 from '@/assets/image/pathdetails/circle2.png';
import {request} from "@/api/request"; import { request } from "@/api/request";
import {STUDY_RECORD, UPDATE_CURRENT_TASK, QueryEvaluationTaskStatusOne, EvaluationToLearn} from "@/api/api"; import { STUDY_RECORD, UPDATE_CURRENT_TASK, QueryEvaluationTaskStatusOne, EvaluationToLearn } from "@/api/api";
import {useRoute, useRouter} from "vue-router"; import { useRoute, useRouter } from "vue-router";
import {ElMessage} from "element-plus"; import { ElMessage } from "element-plus";
import {ROUTER, TASK_TYPES} from "@/api/CONST"; import { ROUTER, TASK_TYPES } from "@/api/CONST";
import FileTypeImg from "@/components/FileTypeImg.vue"; import FileTypeImg from "@/components/FileTypeImg.vue";
import {useStore} from "vuex"; import { useStore } from "vuex";
const { const {
query: {routerId, routerName}, query: { routerId, routerName },
} = useRoute(); } = useRoute();
const router = useRouter(); const router = useRouter();
const returnclick = () => { const returnclick = () => {
router.back(); router.back();
}; };
const {commit, dispatch, state} = useStore() const { commit, dispatch, state } = useStore()
const userInfo = computed(() => state.userInfo) const userInfo = computed(() => state.userInfo)
const data = computed(() => state.routerInfo) const data = computed(() => state.routerInfo)
console.log(data) console.log(data)
const activeName = ref("first"); const activeName = ref("first");
onMounted(() => { onMounted(() => {
dispatch('getRouterInfo', {routerId}) dispatch('getRouterInfo', { routerId })
}) })
const handleClick = (tab, event) => { const handleClick = (tab, event) => {
console.log(tab, event); console.log(tab, event);
}; };
const path = {1: "path"}; const path = { 1: "path" };
const dialogVisible = ref(false); const dialogVisible = ref(false);
const dialogVisibleTip = ref(''); const dialogVisibleTip = ref('');
@@ -431,7 +429,7 @@ async function toFinish(d) {
} }
} }
//更新学员当前任务 //更新学员当前任务
await request(UPDATE_CURRENT_TASK, {id: d.id, type: ROUTER, pid: routerId, name: d.name}) await request(UPDATE_CURRENT_TASK, { id: d.id, type: ROUTER, pid: routerId, name: d.name })
if (d.type === 3 || d.type === 7 || (d.type === 5 && d.examType === 2)) { if (d.type === 3 || d.type === 7 || (d.type === 5 && d.examType === 2)) {
d.status !== 1 && await request(STUDY_RECORD, { d.status !== 1 && await request(STUDY_RECORD, {
studentId: userInfo.value.id, studentId: userInfo.value.id,
@@ -445,7 +443,7 @@ async function toFinish(d) {
// 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04 // 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04
if (d.type == 10) { if (d.type == 10) {
if(d.quizTaskId==null){ if (d.quizTaskId == null) {
// 肯定没有完成测评 // 肯定没有完成测评
// 调用接口 跳转页面 // 调用接口 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {
@@ -476,7 +474,7 @@ async function toFinish(d) {
console.log(err) console.log(err)
}) })
return return
}else{ } else {
// 进行中 或者 已完成 // 进行中 或者 已完成
// 调用接口 判断当前测评状态 跳转页面 // 调用接口 判断当前测评状态 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {
@@ -487,10 +485,10 @@ async function toFinish(d) {
}).then(res => { }).then(res => {
console.log(res) console.log(res)
if (res.code == 200) { if (res.code == 200) {
if(res.data.complete_status==2){ if (res.data.complete_status == 2) {
ElMessage.error("您已完成测评") ElMessage.error("您已完成测评")
return return
}else{ } else {
// 重新查询跳转 // 重新查询跳转
// 调用接口 跳转页面 // 调用接口 跳转页面
console.log('我是查询测评跳转链接所传递得参数', { console.log('我是查询测评跳转链接所传递得参数', {