Merge branch 'develop' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-stu into develop

This commit is contained in:
zhangyc
2022-12-23 19:59:07 +08:00
15 changed files with 2325 additions and 2387 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 161 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

View File

@@ -0,0 +1,82 @@
<template>
<div class="pathDetail" v-if="visiable" :style="{background:`url('${back}') no-repeat`}">
<div v-for="(item,i) in detail.chapterDtoList" :key="i" class="cha"
:style="{top:`${imgAttr.positions[i]?.top - (current===i?10:0)}px`,left:`${imgAttr.positions[i]?.left - (current===i?10:0)}px`}">
<div @click="toDetail(i)"
:style="{background: `url('${current===i?currentBack:nameBack}')`,width:`${current===i?278:245}px`,height:`${current===i?120:105}px`,textAlign:'center',lineHeight:'75px',color:'#FFF'}">
{{ item.name }}
</div>
</div>
</div>
</template>
<script setup>
import {computed, defineProps, ref, watch} from "vue";
import back from '@/assets/image/pathdetails/路径图背景线.png'
import nameBack from '@/assets/image/pathdetails/组 23@2x.png'
import currentBack from '@/assets/image/pathdetails/组 23(1).png'
import {useRouter} from "vue-router/dist/vue-router";
const props = defineProps({
value: String,
img: String,
detail: {
type: Object,
default: {}
}
})
const router = useRouter();
const visiable = ref(true)
const imageAttrs = {
'路径图背景-1671015331292.png': {
width: 1437,
height: 594,
positions: [
{left: -72, top: 508},
{left: 147, top: 356},
{left: 689, top: 263},
{left: 617, top: 69},
{left: 1047, top: 42},
]
}
}
const imgAttr = computed(() => imageAttrs[Object.keys(imageAttrs).find(e => props.img.includes(e))] || {})
const current = computed(() => props.detail.chapterDtoList.findIndex(e => e.chapterId === props.detail.currentStageId))
function show() {
visiable.value = true
}
function toDetail(i) {
if (current.value !== i) {
return
}
import.meta.env.MODE === "development"
? router.push({
path: "/pathdetails",
query: {routerId: props.detail.routerId, routerName: props.detail.routerName},
})
: window.open(
`${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/pathdetails&params=${encodeURIComponent(
`routerId=${props.detail.routerId}&routerName=${props.detail.routerName}`
)}`
);
}
function close() {
visiable.value = false
}
</script>
<style lang="scss">
.pathDetail {
width: 100%;
height: 1011px;
position: relative;
}
.cha {
position: absolute;
cursor: pointer;
}
</style>

View File

@@ -5,14 +5,11 @@
<div>课程列表</div>
<div style="margin-left: 6px; margin-right: 6px">/</div>
<div style="font-weight: 700">课程详情</div>
<div v-if="pName != ''" class="return">
<div style="display: flex" @click="returnclick">
<img
class="img2"
style="margin-right: 22px"
src="../../assets/image/return.png"
/>
<div class="text">返回</div>
<el-button style="color:#0073FB"> <img class="img2" style="margin-right:11px;cursor: pointer;" src="../../assets/image/return.png" />返回</el-button>
</div>
</div>
</div>
@@ -23,56 +20,31 @@
<div style="margin-left: 46px">
<div class="title">面授课{{ data.planDto?.name }}</div>
<div class="time" style="margin-top: 26px">
<img
style="width: 15px; height: 17px"
src="../../assets/image/time.png"
/>
<img style="width: 15px; height: 17px" src="../../assets/image/time.png" />
<div style="margin-left: 8px">
{{ data.planDto?.beginTime + "至" + data.planDto?.endTime }}
</div>
</div>
<div class="time" style="margin-top: 23px">
<img
style="width: 16px; height: 18px"
src="../../assets/image/position.png"
/>
<img style="width: 16px; height: 18px" src="../../assets/image/position.png" />
<div style="margin-left: 8px">{{ data.planDto?.address }}</div>
</div>
</div>
<div style="display: flex">
<botton
v-if="!isAllowSign"
class="btn"
style="margin-right: 20px; background: #999"
@click="signClick"
>签到
<botton v-if="!isAllowSign" class="btn" style="margin-right: 20px; background: #999" @click="signClick">签到
</botton>
<botton
v-if="isAllowSign"
class="btn"
style="margin-right: 20px"
:style="{
<botton v-if="isAllowSign" class="btn" style="margin-right: 20px" :style="{
background: data.signFlag ? '#999' : 'rgb(57, 146, 249)',
}"
@click="signClick"
>{{ data.signFlag ? "已签到" : "签到" }}
}" @click="signClick">{{ data.signFlag ? "已签到" : "签到" }}
</botton>
<botton
style="background: #999"
class="btn"
@click="toSurvery"
v-if="data.planDto?.evalFlag == 0"
>
<botton style="background: #999" class="btn" @click="toSurvery" v-if="data.planDto?.evalFlag == 0">
评估
</botton>
<botton
:style="{
<botton :style="{
background: `${new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
}"
class="btn"
@click="toSurvery"
v-if="data.planDto?.evalFlag && data.planDto?.evalFlag == 1"
>{{ data.isSurvery ? "已评估" : "评估" }}
}" class="btn" @click="toSurvery" v-if="data.planDto?.evalFlag && data.planDto?.evalFlag == 1">{{
data.isSurvery ? "已评估" : "评估"
}}
</botton>
</div>
</div>
@@ -172,8 +144,7 @@
cursor: pointer;
margin-left: 40px;
margin-top: 20px;
"
>
">
此课程无作业
</div>
<div class="work" v-if="data.workDto?.workName">
@@ -188,26 +159,22 @@
<div v-if="isEndSubMitWork()" class="submit" style="background: #999">
已结束
</div>
<div v-else>
<div :style="{background: new Date(data.planDto.beginTime).getTime() > new Date().getTime()?'#999':''}"
class="submit" @click="toWork" v-if="data.workDto?.workId">
<div
:style="{ background: new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : '' }"
v-else class="submit" @click="toWork" v-if="data.workDto?.workId">
交作业
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="课程考试" name="third">
<div
v-if="data.planDto?.attach === '[]'"
style="
<div v-if="data.planDto?.attach === '[]'" style="
font-size: 14px;
font-weight: 400;
line-height: 24px;
cursor: pointer;
margin-left: 40px;
margin-top: 20px;
"
>
">
此课程无考试
</div>
<div class="work" v-if="data.examinationDto?.examinationTestName">
@@ -216,16 +183,15 @@
{{ data.examinationDto?.examinationTestName }}
</div>
<div style="margin-top: 16px; display: flex">
<div
class="tag1"
v-if="data.examinationDto?.examinationFlag"
>
<div class="tag1" v-if="data.examinationDto?.examinationFlag">
必修
</div>
<div class="tag3" style="margin-left: 11px">考试</div>
</div>
</div>
<div :style="{background: new Date(data.planDto.beginTime).getTime() > new Date().getTime()?'#999':''}" class="submit" @click="toExamItem(data.examinationDto)">
<div
:style="{ background: new Date(data.planDto.beginTime).getTime() > new Date().getTime() ? '#999' : '' }"
class="submit" @click="toExamItem(data.examinationDto)">
去考试
</div>
</div>
@@ -235,10 +201,7 @@
</div>
<div class="teacher">
<div class="title">
<img
style="width: 21px; height: 23px"
src="../../assets/image/livelecturer.png"
/>
<img style="width: 21px; height: 23px" src="../../assets/image/livelecturer.png" />
<div class="text">面授课讲师</div>
<div class="box"></div>
</div>
@@ -299,7 +262,7 @@ const download = (url) => {
window.open(url);
};
const downloads = (url) => {
ElMessage.info("面授课未开始");
ElMessage.info("未到开始时间,请耐心等待!");
};
let timer = null;
//判断能否签到
@@ -363,7 +326,7 @@ const signClick = () => {
let date1 = new Date(data.value.planDto.beginTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("面授课未开始");
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
@@ -391,7 +354,7 @@ function toSurvery() {
let date1 = new Date(data.value.planDto.beginTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("面授课未开始");
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
@@ -405,6 +368,7 @@ function toSurvery() {
courseId: data.value.planDto.evaluateId,
pName: "面授课",
sName: data.value.planDto.name,
type: 3
},
});
}
@@ -427,7 +391,7 @@ function toWork() {
let date1 = new Date(data.value.planDto.beginTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("面授课未开始");
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
@@ -448,7 +412,7 @@ function toExamItem(obj) {
let date1 = new Date(data.value.planDto.beginTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("面授课未开始");
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
@@ -517,9 +481,11 @@ onUnmounted(() => {
align-items: center;
}
}
.return {
position: absolute;
right: 10%;
.text {
text-align: center;
display: flex;
@@ -527,6 +493,7 @@ onUnmounted(() => {
align-items: center;
}
}
.detailinfo {
width: 100%;
margin-top: 20px;

View File

@@ -14,11 +14,9 @@
<span class="content" style="margin-left: 31px">下一个</span>
<button class="btn btn02" style="margin-left: 6px"></button>
</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>
<el-button style="color:#0073FB"> <img class="img2" style="margin-right:11px;cursor: pointer;" src="../../assets/image/return.png" />返回</el-button>
</div>
</div>
</div>

View File

@@ -28,10 +28,7 @@
<div style="margin-left: 46px">
<div class="title">直播{{ data?.liveName }}</div>
<div class="time" style="margin-top: 26px">
<img
style="width: 15px; height: 17px"
src="../../assets/image/time.png"
/>
<img style="width: 15px; height: 17px" src="../../assets/image/time.png" />
<div style="margin-left: 8px">
{{ data?.liveStartTime + "至" + data?.liveEndTime }}
</div>
@@ -47,37 +44,23 @@
</div> -->
</div>
<div class="threeBtn">
<botton
class="btn"
style="background: rgb(59, 191, 252)"
@click="showClick"
>观看
<botton class="btn" :style="{
background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : 'rgb(59, 191, 252)'}`,
}" @click="showClick">观看
</botton>
<botton
class="btn"
:style="{
background: `${data.signFlag ? '#999' : 'rgb(57, 146, 249)'}`,
}"
@click="signClick"
>{{ data.signFlag ? "已签到" : "签到" }}
<botton class="btn" :style="{
background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : data.signFlag ? '#999' : 'rgb(57, 146, 249)'}`,
}" @click="signClick">{{ data.signFlag ? "已签到" : "签到" }}
</botton>
<botton
style="background: #999"
class="btn"
@click="commitClick"
v-if="data.isEvaluate == 0"
>
<botton style="background: #999" class="btn" @click="commitClick" v-if="data.isEvaluate == 0">
评估
</botton>
<botton
:style="{
background: `${data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
}"
class="btn"
@click="commitClick"
v-if="data.isEvaluate && data.isEvaluate == 1"
>{{ data.isSurvery ? "已评估" : "评估" }}
<botton :style="{
background: `${new Date(data.liveStartTime).getTime() > new Date().getTime() ? '#999' : data.isSurvery ? '#999' : 'rgb(57, 146, 249)'}`,
}" class="btn" @click="commitClick" v-if="data.isEvaluate && data.isEvaluate == 1">{{ data.isSurvery ? "已评估"
: "评估"
}}
</botton>
</div>
</div>
@@ -89,10 +72,7 @@
<div class="detailT">
<div class="" style="margin-left: 48px; margin-right: 48px">
<div class="title">
<img
style="width: 20px; height: 20px"
src="../../assets/image/course.png"
/>
<img style="width: 20px; height: 20px" src="../../assets/image/course.png" />
<div class="text">直播说明</div>
<div class="box"></div>
</div>
@@ -126,10 +106,7 @@
<div>
<div class="tell">
<div class="title">
<img
style="width: 21px; height: 23px"
src="../../assets/image/tv.png"
/>
<img style="width: 21px; height: 23px" src="../../assets/image/tv.png" />
<div class="text">直播公告</div>
<div class="box"></div>
</div>
@@ -137,18 +114,12 @@
</div>
<div class="teacher">
<div class="title">
<img
style="width: 21px; height: 23px"
src="../../assets/image/livelecturer.png"
/>
<img style="width: 21px; height: 23px" src="../../assets/image/livelecturer.png" />
<!-- todo #直播详情 没有直播讲师-->
<div class="text">直播讲师</div>
<div class="box"></div>
</div>
<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="teacherInfo.avatar" />
<div style="margin-left: 17px; width: 190px">
<div class="teacherName" style="margin-right: 5px">
@@ -184,7 +155,7 @@ const returnclick = () => {
};
const { data } = useRequest(TASK_BROADCAST_DETAIL, { liveId });
console.log('直播信息', data)
const teacherInfo = useUserInfo(
computed(() => data.value.userInfoBo?.userId)
);
@@ -203,6 +174,14 @@ const state = reactive({
});
const { activeName, teacher } = toRefs(state);
const signClick = () => {
if (data.value.liveStartTime) {
let date1 = new Date(data.value.liveStartTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
if (data.value.signFlag) {
return;
}
@@ -211,9 +190,17 @@ const signClick = () => {
request(TASK_BROADCAST_SIGN, { courseId: liveId, taskId, type });
};
const commitClick = () => {
if (data.value.isSurvery) {
if (data.value.liveStartTime) {
let date1 = new Date(data.value.liveStartTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
if (data.value.isSurvery) {
// return;
}
if (data.value.isEvaluate == 0) {
ElMessage.info("此直播无评估");
return;
@@ -225,11 +212,20 @@ const commitClick = () => {
courseId: data.value.assessmentId,
pName: "直播",
sName: data.value.liveName,
type: 4
},
});
};
function showClick() {
if (data.value.liveStartTime) {
let date1 = new Date(data.value.liveStartTime).getTime()
let date2 = new Date().getTime()
if (date1 > date2) {
ElMessage.info("未到开始时间,请耐心等待!");
return;
}
}
window.open(data.value.liveLink);
}
</script>
@@ -244,9 +240,11 @@ function showClick() {
line-height: 24px;
position: relative;
}
.return {
position: absolute;
right: 10%;
.text {
text-align: center;
display: flex;
@@ -254,6 +252,7 @@ function showClick() {
align-items: center;
}
}
.preNext {
position: absolute;
right: 0px;
@@ -328,6 +327,7 @@ function showClick() {
}
@media screen and (max-width: 1030px) {
// .threeBtn {
// margin-right: 30px;
// }
@@ -335,6 +335,7 @@ function showClick() {
margin-bottom: -24px;
}
}
// @media screen and(max-width:) {
// }
.time {
@@ -525,11 +526,9 @@ function showClick() {
// min-height: 557px;
background-color: rgba(255, 255, 255, 1);
border-radius: 8px;
background: linear-gradient(
180deg,
background: linear-gradient(180deg,
rgba(36, 120, 255, 0.15) 0%,
rgba(255, 255, 255) 50%
);
rgba(255, 255, 255) 50%);
.title {
display: flex;

View File

@@ -115,7 +115,7 @@
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="课程公告" name="first">
<div class="notice">
{{ data.remark || "暂无公告" }}
{{ data.notice || "暂无公告" }}
</div>
</el-tab-pane>
<!--
@@ -237,11 +237,7 @@
</div>
<!-- 详细信息 -->
<!-- 弹框提示信息 -->
<el-dialog
title=""
top="347px"
v-model="dialogVisible"
:show-close="false"
<el-dialog title="" top="347px" v-model="dialogVisible" :show-close="false"
style="display:flex;justify-content:center;align-items:center;height: 283px;padding:0;border-radius: 4px;"
width="502px">
<div style="width:288px;color:#333333;font-size: 22px;font-weight: 600;">{{ dialogVisibleTip }}</div>
@@ -378,8 +374,8 @@ function introductionPro() {
dialogVisible.value = true;
}
function toFinish(d, sName, chapterId) {
console.log("dddddd", d, sName);
function toFinish(d, sName, chapterOrStageId) {
console.log("dddddd", d, sName, chapterOrStageId);
// 作业过期判断
if (d.type == 4) {
let date1 = new Date(d.endTime).getTime();
@@ -475,6 +471,7 @@ function toFinish(d, sName, chapterId) {
courseId: d.courseId,
pName: data.value.name,
sName,
chapterOrStageId
},
});
} else if (typeof types.value.path[d.type] === "function") {
@@ -491,11 +488,13 @@ function whiteTypes(type) {
.el-dialog__header {
display: none;
}
.crumb {
color: #fff;
display: flex;
font-size: 14px;
line-height: 24px;
.return {
position: absolute;
right: 10%;

View File

@@ -64,7 +64,8 @@
</el-table-column>
<el-table-column align="center" prop="name" label="路径名称"/>
<el-table-column align="center" prop="introduce" label="路径介绍" #default="scope">
<el-popover placement="bottom-start" :width="400" title="路径介绍" trigger="hover" :content="scope.row.remark">
<el-popover placement="bottom-start" :width="400" title="路径介绍" trigger="hover"
:content="scope.row.remark">
<template #reference>
<div>{{ scope.row.remark }}</div>
</template>
@@ -86,41 +87,32 @@
</el-table>
</div>
</div>
<!-- :src="{ 0: nostarted, 1: completed, 2: ongoing }[scope.row.status]"-->
<!-- 路径列表-->
<!-- 路径详情图 -->
<div :style="{ display: showmapdetail ? 'flex' : 'none' }" class="mapdetail">
<div v-for="(item, i) in detail?.rows" :key="i">
<img :src="useImage(`222_0${i + 2}.png`)" />
</div>
<!-- <div class="modal"-->
<!-- style="width: calc(100% - 168px); height: 525px;background-image: url('../../src/assets/image/mapdetail.png');background-size: 100%;background-repeat: no-repeat;">-->
<!-- </div>-->
<PathDetailImage img="https://u-pre.boe.com/upload/路径图背景-1671015331292.png" :detail="detail"></PathDetailImage>
</div>
<!-- 路径详情图 -->
</div>
</div>
</template>
<script setup>
import { reactive, toRefs, ref, onMounted, computed } from "vue";
import {computed, ref} from "vue";
import nostarted from "../../assets/image/nostarted.png";
import completed from "../../assets/image/completed.png";
import ongoing from "../../assets/image/ongoing.png";
import { boeRequest, request, usePage, useRequest } from "@/api/request";
import {
ROUTER_CHAPTER_LIST,
ROUTER_LIST,
ROUTER_UNCOMPLETE_LIST,
} from "@/api/api";
import { useImage } from "@/api/utils";
import {usePage} from "@/api/request";
import {ROUTER_LIST,} from "@/api/api";
import {useRouter} from "vue-router";
import store from "@/store";
import PathDetailImage from "@/components/PathDetailImage.vue";
const detail = ref();
const showmapdetail = ref(false);
const currentStageId = ref();
const userInfo = computed(() => store.state.userInfo);
const {data} = usePage(ROUTER_LIST, {pageSize: 60});
console.log("datadata", data);
const router = useRouter();
const returnclick = () => {
router.back();
@@ -128,40 +120,25 @@ const returnclick = () => {
// const {unCompleteTaskList} = useRequest(ROUTER_UNCOMPLETE_LIST, {});
const state = reactive({
showmapdetail: false,
});
const { showmapdetail } = toRefs(state);
const returnfun = () => {
state.showmapdetail = false;
showmapdetail.value = false;
};
async function gofun({ routerId, name: routerName }) {
// console.log(routerId)
// const data = await request(ROUTER_CHAPTER_LIST, {stuChapterListVo: {routerId}})
// detail.value = data.data
// state.showmapdetail = true;
// router.push({path: "/pathdetails", query: {routerId}});
import.meta.env.MODE === "development"
? router.push({
path: "/pathdetails",
query: { routerId, routerName },
})
: window.open(
`${import.meta.env.VITE_BOE_PATH_DETAIL_URL}/pathdetails&params=${encodeURIComponent(
`routerId=${routerId}&routerName=${routerName}`
)}`
);
async function gofun(e) {
detail.value = e
showmapdetail.value = true;
}
function toUnTask() {
}
function toUnTask() { }
</script>
<style lang="scss">
#app div:nth-child(1) {
// background: rgba(0, 0, 0, 0) !important;
}
.modal {}
.modal {
}
.modal:after {
content: "";
@@ -178,7 +155,7 @@ function toUnTask() { }
width: 100%;
// flex: 1;
margin-top: 43px;
position: relative;
// background-color: pink;
.title {
display: flex;
@@ -266,7 +243,7 @@ function toUnTask() { }
.mapdetail {
width: calc(100% - 107px);
height: 577px;
min-height: 577px;
background: rgba(242, 245, 247, 0.6);
margin-top: 26px;
border-radius: 8px;
@@ -315,6 +292,7 @@ function toUnTask() { }
margin-left: 28px;
cursor: pointer;
}
.box-item {
width: 200px;
margin-top: 10px;

View File

@@ -74,18 +74,11 @@
<!-- {{ item.name }}-->
<!-- </div>-->
</div>
<div
class="progressBox"
:style="{ display: value.type === 1 ? 'block' : 'none' }"
>
<div v-if="value.type === 1" class="progressBox">
<div>当前进度</div>
<div class="progress">
<div style="width: 291px">
<el-progress
:percentage="value.currentRatio"
:show-text="false"
:stroke-width="8"
:color="
<el-progress :percentage="value.currentRatio * 100" :show-text="false" :stroke-width="8" :color="
{
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -93,18 +86,15 @@
3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[parseInt(value.currentRatio / 20)]
"
/>
}[parseInt(value.currentRatio * 100 / 20)]
" />
</div>
<div
style="
<div style="
font-size: 14px;
font-weight: 500;
color: #277aff;
margin-left: 10px;
"
:style="{
" :style="{
color: {
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -112,28 +102,17 @@
3: 'rgba(59, 94, 251, 1)',
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[parseInt(value.currentRatio / 20)],
}"
>
{{ value.currentRatio }}%
}[parseInt(value.currentRatio * 100 / 20)],
}">
{{ value.currentRatio * 100 }}%
</div>
</div>
</div>
</div>
<div
class="goclass"
:style="{
<div class="goclass" :style="{
background: `${types.path[value.type] ? '#2478ff' : '#999'}`,
}"
@click="toFinish(value)"
>
{{
value.status === 1
? "已完成"
: types.path[value.type]
? types.toName[value.type]
: "未开放"
}}
}" @click="toFinish(value)">
{{ value.currentRatio === 1 ? "已完成" : types.path[value.type] ? types.toName[value.type] : "未开放" }}
</div>
<!-- <div :style="{ display: value.status === 1 ? 'block' : 'none' }">-->
<!-- <div-->
@@ -194,18 +173,12 @@
<div class="detailRB">
<div class="info">
<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="box"></div>
</div>
<!-- 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" />
<div style="margin-left: 17px">
<div class="teacherName">
@@ -222,10 +195,7 @@
</div>
<div class="info" style="padding-top: 20px">
<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="box"></div>
</div>
@@ -239,11 +209,8 @@
<div>总进度</div>
<div class="progress">
<div style="width: 291px">
<el-progress
:percentage="parseInt(data.currentChapterCnt/data.totalChapterCnt * 100)"
:show-text="false"
:stroke-width="8"
:color="
<el-progress :percentage="parseInt(data.currentChapterCnt / data.totalChapterCnt * 100)"
:show-text="false" :stroke-width="8" :color="
{
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -252,12 +219,9 @@
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[(parseInt(data.currentChapterCnt / data.totalChapterCnt) * 100) / 20]
"
/>
" />
</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: {
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -266,8 +230,7 @@
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentChapterCnt / data.totalChapterCnt * 100) / 20)],
}"
>
}">
{{ parseInt(data.currentChapterCnt / data.totalChapterCnt * 100) }}%
</div>
</div>
@@ -278,11 +241,8 @@
<div>必修进度</div>
<div class="progress">
<div style="width: 291px">
<el-progress
:percentage="parseInt(data.currentReqCnt/data.totalReqCnt * 100)"
:show-text="false"
:stroke-width="8"
:color="
<el-progress :percentage="parseInt(data.currentReqCnt / data.totalReqCnt * 100)" :show-text="false"
:stroke-width="8" :color="
{
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -291,17 +251,14 @@
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)]
"
/>
" />
</div>
<div
style="
<div style="
font-size: 14px;
font-weight: 500;
color: #277aff;
margin-left: 10px;
"
:style="{
" :style="{
color: {
0: 'rgba(238, 112, 108, 1)',
1: 'rgba(255, 151, 38, 1)',
@@ -310,8 +267,7 @@
4: 'rgba(57, 219, 183, 1)',
5: 'rgba(57, 219, 183, 1)',
}[parseInt((data.currentReqCnt / data.totalReqCnt * 100) / 20)],
}"
>
}">
{{ parseInt(data.currentReqCnt / data.totalReqCnt * 100) }}%
</div>
</div>
@@ -324,11 +280,7 @@
</div>
<!-- 详细信息 -->
<!-- 弹框提示信息 -->
<el-dialog
title=""
top="347px"
v-model="dialogVisible"
:show-close="false"
<el-dialog title="" top="347px" v-model="dialogVisible" :show-close="false"
style="display:flex;justify-content:center;align-items:center;height: 283px;padding:0;border-radius: 4px;"
width="502px">
<div style="width:288px;color:#333333;font-size: 22px;font-weight: 600;">{{ dialogVisibleTip }}</div>
@@ -359,7 +311,7 @@ const returnclick = () => {
};
const { data } = useRequest(ROUTER_PROCESS, { routerId });
const userInfo = computed(() => store.state.userInfo);
console.log('lalalallala', data)
const activeName = ref("first");
const handleClick = (tab, event) => {
@@ -429,6 +381,8 @@ const types = ref({
});
function toFinish(d) {
console.log(d)
console.log(data.value.currentStageId, routerId)
if (!types.value.path[d.type]) {
ElMessage.error("暂时未开放");
return;
@@ -451,11 +405,13 @@ function toFinish(d) {
router.push({
path: types.value.path[d.type],
query: {
id: d.routerTaskId,
// id: d.routerTaskId,
id: routerId,
type: 1,
courseId: d.courseId,
pName: data.value.name,
sName: data.value.currentStageName,
chapterOrStageId: data.value.currentStageId
},
});
} else if (typeof types.value.path[d.type] === "function") {
@@ -756,9 +712,5 @@ function whiteTypes(type) {
}
}
}
.jianjie{
text-align:justify;
line-height:2,
}
}
</style>

View File

@@ -1,9 +1,7 @@
<template>
<div class="surveydetail" style="padding: 30px">
<!-- 面包屑导航 -->
<div
style="display: flex; align-items: center; justify-content: space-between"
>
<div style="display: flex; align-items: center; justify-content: space-between">
<div class="crumb">
<div>{{ pName }}</div>
<div style="margin-left: 6px; margin-right: 6px">/</div>
@@ -44,34 +42,21 @@
return a[0].orderNumber - b[0].orderNumber
}) }} -->
<div
class="question"
v-for="
<div class="question" v-for="
(value, index) in formateArr([data.assessmentEssayQuestionDtoList, data.assessmentMultipleChoiceDtoList, data.assessmentScoringQuestionDtoList, data.assessmentSingleChoiceDtoList]).sort((a, b) => {
return a[0].orderNumber - b[0].orderNumber
}) "
:key="index"
:style="{ 'margin-top': index === 0 ? '57px' : '41px' }"
>
}) " :key="index" :style="{ 'margin-top': index === 0 ? '57px' : '41px' }">
<div v-if="value[0].questionType == '4'">
<div
class="question"
v-for="(value, index) in data.assessmentScoringQuestionDtoList"
:key="index"
:style="{ 'margin-top': index === 0 ? '57px' : '41px' }"
>
<div class="question" v-for="(value, index) in data.assessmentScoringQuestionDtoList" :key="index"
:style="{ 'margin-top': index === 0 ? '57px' : '41px' }">
<div class="text">{{ value.assessmentScTitle }}</div>
<div class="answer">
<div class="answerL">完全没用</div>
<div class="answerC">
<div
class="answerCitem"
v-for="(item, key) in Array.from(
<div class="answerCitem" v-for="(item, key) in Array.from(
{ length: value.assessmentMaxScore },
(k, i) => i
)"
:key="key"
:style="{
)" :key="key" :style="{
'margin-left': key === 0 ? '15px' : '10px',
background:
value.selectAnswer === item
@@ -81,16 +66,14 @@
value.selectAnswer === item
? '#fff'
: 'rgba(86, 163, 249, 1)',
}"
@click="
}" @click="
() => {
if (data.isSubmit) {
return;
}
value.selectAnswer = item;
}
"
>
">
<div>{{ item + 1 }}</div>
</div>
</div>
@@ -100,26 +83,18 @@
</div>
<div v-else-if="value[0].questionType == '1'">
<div
class="question"
style="margin-top: 41px"
v-if="
<div class="question" style="margin-top: 41px" v-if="
data.assessmentSingleChoiceDtoList &&
data.assessmentSingleChoiceDtoList.length
"
>
">
<div class="text">
{{ data.assessmentSingleChoiceDtoList[0]?.singleStemName }}
</div>
<div
v-for="(value, index) in data.assessmentSingleChoiceDtoList"
:key="index"
style="display: flex; align-items: center"
:style="{
<div v-for="(value, index) in data.assessmentSingleChoiceDtoList" :key="index"
style="display: flex; align-items: center" :style="{
'margin-top': index === 0 ? '29px' : '22px',
cursor: 'pointer',
}"
@click="
}" @click="
() => {
if (data.isSubmit) {
return;
@@ -129,72 +104,46 @@
});
value.select = true;
}
"
>
<img
style="width: 19px; height: 18px; cursor: pointer"
:src="value.select ? checkbox : checkbox2"
/>
">
<img style="width: 19px; height: 18px; cursor: pointer" :src="value.select ? checkbox : checkbox2" />
<div class="people">{{ value.singleOptionName }}</div>
</div>
</div>
</div>
<div v-else-if="value[0].questionType == '2'">
<div
class="question"
style="margin-top: 41px"
v-if="
<div class="question" style="margin-top: 41px" v-if="
data.assessmentMultipleChoiceDtoList &&
data.assessmentMultipleChoiceDtoList.length
"
>
">
<div class="text">
{{ data.assessmentMultipleChoiceDtoList[0]?.multipleStemName }}
</div>
<div
v-for="(value, index) in data.assessmentMultipleChoiceDtoList"
:key="index"
style="display: flex; align-items: center"
:style="{
<div v-for="(value, index) in data.assessmentMultipleChoiceDtoList" :key="index"
style="display: flex; align-items: center" :style="{
'margin-top': index === 0 ? '29px' : '22px',
cursor: 'pointer',
}"
@click="
}" @click="
() => {
if (data.isSubmit) {
return;
}
value.select = !value.select;
}
"
>
<img
style="width: 19px; height: 18px; cursor: pointer"
:src="value.select ? checkbox : checkbox2"
/>
">
<img style="width: 19px; height: 18px; cursor: pointer" :src="value.select ? checkbox : checkbox2" />
<div class="people">{{ value.multipleOptionName }}</div>
</div>
</div>
</div>
<div v-else-if="value[0].questionType == '3'">
<div
class="question"
style="margin-top: 41px"
v-for="(item, i) in data.assessmentEssayQuestionDtoList"
:key="i"
>
<div class="question" style="margin-top: 41px" v-for="(item, i) in data.assessmentEssayQuestionDtoList"
:key="i">
<div class="text">{{ item.assessmentQaTitle }}</div>
<div style="width: 713px; margin-top: 31px; position: relative">
<el-input
v-model="item.content"
:autosize="{ minRows: 5, maxRows: 5 }"
resize="none"
maxlength="200"
type="textarea"
:readonly="!!data.isSubmit"
/>
<el-input v-model="item.content" :autosize="{ minRows: 5, maxRows: 5 }" resize="none" maxlength="200"
type="textarea" :readonly="!!data.isSubmit" />
<div class="words">{{ item.content?.length || 0 }}/200</div>
</div>
</div>
@@ -340,20 +289,13 @@
</div>
</div> -->
<div
style="display: flex; justify-content: center"
v-if="
<div style="display: flex; justify-content: center" v-if="
data.assessmentEssayQuestionDtoList?.length ||
data.assessmentMultipleChoiceDtoList?.length ||
data.assessmentSingleChoiceDtoList?.length ||
data.assessmentScoringQuestionDtoList?.length
"
>
<div
class="submit"
@click="submit"
:style="{ background: data.isSubmit ? '#999' : '#2478ff' }"
>
">
<div class="submit" @click="submit" :style="{ background: data.isSubmit ? '#999' : '#2478ff' }">
提交
</div>
</div>
@@ -368,8 +310,12 @@
</span></div>
<template #footer>
<span class="dialog-footer">
<el-button class="cancel" style="color: #387DF7; border: 1px solid #387DF7;padding: 8px 32px; border-radius: 4px;" @click="centerDialogVisible = false">取消</el-button>
<el-button class="back" style="background: #387DF7;box-shadow: 1px 2px 15px 1px rgba(56,125,247,0.34);border: 0px;padding: 8px 32px;" type="primary" @click="returnclick">
<el-button class="cancel"
style="color: #387DF7; border: 1px solid #387DF7;padding: 8px 32px; border-radius: 4px;"
@click="centerDialogVisible = false">取消</el-button>
<el-button class="back"
style="background: #387DF7;box-shadow: 1px 2px 15px 1px rgba(56,125,247,0.34);border: 0px;padding: 8px 32px;"
type="primary" @click="returnclick">
返回
</el-button>
</span>
@@ -386,7 +332,7 @@ import { ElMessage } from "element-plus";
import { ref } from "vue";
const {
query: { courseId, id: taskId, type, pName, sName },
query: { courseId, id: taskId, type, pName, sName, chapterOrStageId },
} = useRoute();
const router = useRouter();
const returnclick = () => {
@@ -405,7 +351,7 @@ function formateArr(arr1) {
return newarr
}
const { data } = useRequest(ASSESSMENT_QUERY(courseId), { id: courseId });
const { data } = useRequest(ASSESSMENT_QUERY(courseId), { id: courseId, type, chapterOrStageId, targetId: taskId });
console.log('我是需要排序得题目', data)
function goHome() {
@@ -417,6 +363,17 @@ const open=()=>{
centerDialogVisible.value = true
};
function submit() {
if (1 > 0) {
console.log(data)
console.log('我是提交的数据', {
targetId: taskId, // 项目、路径图或开课的Id
chapterOrStageId: chapterOrStageId, // 关卡或者阶段Id 关卡Id不允许为空
assessmentId: courseId,
taskId,
type,
result: JSON.stringify(data.value),
})
}
if (data.value.isSubmit) {
return;
}
@@ -463,6 +420,8 @@ function submit() {
}
data.value.isSubmit = !data.value.isSubmit;
request(ASSESSMENT_SUBMIT, {
targetId: taskId, // 项目、路径图或开课的Id
chapterOrStageId: chapterOrStageId, // 关卡或者阶段Id 关卡Id不允许为空
assessmentId: courseId,
taskId,
type,
@@ -481,9 +440,11 @@ function submit() {
font-size: 14px;
line-height: 24px;
}
.return {
position: absolute;
right: 10%;
.text {
text-align: center;
display: flex;
@@ -491,6 +452,7 @@ function submit() {
align-items: center;
}
}
.prevnext {
display: flex;
align-items: center;
@@ -548,6 +510,7 @@ function submit() {
align-items: center;
margin-left: 11px;
margin-right: 11px;
// justify-content: center;
.answerCitem {
width: 40px;