This commit is contained in:
yuping
2022-12-15 14:01:34 +08:00
parent 2add4b2a6d
commit 2260e340bf
2 changed files with 81 additions and 262 deletions

View File

@@ -57,7 +57,7 @@
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="课程附件" name="first"> <el-tab-pane label="课程附件" name="first">
<div <div
v-for="(el, index) in data.planDto?.attach.split(',')" v-for="(el, index) in JSON.parse(data.planDto?.attach)"
:key="index" :key="index"
v-if="data.planDto" v-if="data.planDto"
class="enclosure" class="enclosure"
@@ -65,21 +65,21 @@
> >
<div class="enclosureL"> <div class="enclosureL">
<FileTypeImg <FileTypeImg
v-model="data.planDto.attach.split(',')[index]" v-model="el.name"
:style="{ :style="{
width: '22px', width: '22px',
height: '26px', height: '26px',
marginLeft: '10px', marginLeft: '10px',
}" }"
></FileTypeImg> ></FileTypeImg>
<div style="margin-left: 20px">{{ el }}</div> <div style="margin-left: 20px">{{ el.name }}</div>
</div> </div>
<div class="download"> <div class="download">
<img <img
style="width: 16px; height: 15px" style="width: 16px; height: 15px"
src="../../assets/image/download.png" src="../../assets/image/download.png"
/> />
<div style="margin-left: 5px" @click="download(el)">下载</div> <div style="margin-left: 5px" @click="download(el.response.data)">下载</div>
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>

View File

@@ -15,14 +15,14 @@
<div class="title"> <div class="title">
<div class="titleL">{{ i.chapterName }}</div> <div class="titleL">{{ i.chapterName }}</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> <div class="titleRT">进行中</div>
</div> </div>
<div <div
class="titleR" class="titleR"
:style="{ display: i.status === 2 ? 'flex' : 'none' }" :style="{ display: i.status === 2 ? 'flex' : 'none' }"
> >
<img src="../../assets/image/pathdetails/circle2.png" /> <img src="../../assets/image/pathdetails/circle2.png"/>
<div class="titleRT" style="color: rgba(102, 102, 102, 1)"> <div class="titleRT" style="color: rgba(102, 102, 102, 1)">
未开始 未开始
</div> </div>
@@ -114,7 +114,7 @@
:style="{ :style="{
background: `${types.path[value.type] ? '#2478ff' : '#999'}`, background: `${types.path[value.type] ? '#2478ff' : '#999'}`,
}" }"
@click="toFinish(value)" @click="toFinish(value,i.name)"
> >
{{ {{
value.status === 1 value.status === 1
@@ -151,10 +151,10 @@
<div class="notice"> <div class="notice">
请各位选课的同学提前阅读本课程的 请各位选课的同学提前阅读本课程的
教学大纲与计划课程考核要求学习要求 教学大纲与计划课程考核要求学习要求
并按给定的中学化学教学主题分好小组 <br /> 并按给定的中学化学教学主题分好小组 <br/>
每位同学在网上学习的活动轨迹都会自动被系统记录将作为大家个人线上参与的评价依据<br /> 每位同学在网上学习的活动轨迹都会自动被系统记录将作为大家个人线上参与的评价依据<br/>
请大家务必在规定的时间内提交作业否则会被系统自动记录为迟交未交则会影响线上参与的平时成 请大家务必在规定的时间内提交作业否则会被系统自动记录为迟交未交则会影响线上参与的平时成
<br /> <br/>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="共享文档" name="second"> <el-tab-pane label="共享文档" name="second">
@@ -168,7 +168,7 @@
margin-bottom: 15px; margin-bottom: 15px;
" "
> >
<img :src="value.img" style="width: 22px; height: 26px" /> <img :src="value.img" style="width: 22px; height: 26px"/>
<div class="sharedocname">{{ value.name }}</div> <div class="sharedocname">{{ value.name }}</div>
<div class="download"> <div class="download">
<img <img
@@ -199,14 +199,14 @@
class="teacheritem" class="teacheritem"
:style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }" :style="{ 'border-bottom': '1px solid rgba(56, 125, 247, 0.2)' }"
> >
<img class="peopleimg" :src="userAvatar" /> <img class="peopleimg" :src="userAvatar"/>
<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">
{{ data.userInfoBo?.userName }} {{ data.userInfoBo?.userName }}
</div> </div>
<div v-for="(item, key) in data.userInfoBo?.medal" :key="key"> <div v-for="(item, key) in data.userInfoBo?.medal" :key="key">
<img class="teacherMedal" :src="item" /> <img class="teacherMedal" :src="item"/>
</div> </div>
</div> </div>
<div class="introduce">{{ data.userInfoBo?.introduce }}</div> <div class="introduce">{{ data.userInfoBo?.introduce }}</div>
@@ -337,7 +337,7 @@
</template> </template>
<script setup> <script setup>
import { computed, reactive, ref, watch } from "vue"; import {computed, reactive, ref, watch} from "vue";
import word from "@/assets/image/file/word.png"; import word from "@/assets/image/file/word.png";
import ppt from "@/assets/image/file/ppt.png"; import ppt from "@/assets/image/file/ppt.png";
import pdf from "@/assets/image/file/pdf.png"; import pdf from "@/assets/image/file/pdf.png";
@@ -347,208 +347,27 @@ import medal1 from "@/assets/image/medal/medal1.png";
import medal2 from "@/assets/image/medal/medal2.png"; import medal2 from "@/assets/image/medal/medal2.png";
import medal3 from "@/assets/image/medal/medal3.png"; import medal3 from "@/assets/image/medal/medal3.png";
import img from "@/assets/image/uploadimg.png"; import img from "@/assets/image/uploadimg.png";
import { boeRequest, useRequest, request } from "@/api/request"; import {boeRequest, useRequest, request} from "@/api/request";
import { ROUTER_PROCESS, LINK_DETAILS } from "@/api/api"; import {ROUTER_PROCESS, LINK_DETAILS} 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 { useUserInfo } from "@/api/utils"; import {useUserInfo} from "@/api/utils";
const { const {
query: { routerId }, query: {routerId},
} = useRoute(); } = useRoute();
const router = useRouter(); const router = useRouter();
const { data } = useRequest(ROUTER_PROCESS, { routerId }); const {data} = useRequest(ROUTER_PROCESS, {routerId});
const { avatar: userAvatar } = useUserInfo( const {avatar: userAvatar} = useUserInfo(
computed(() => data.value?.userInfoBo?.userId) computed(() => data.value?.userInfoBo?.userId)
); );
const state = reactive({
course: [
{
state: 1, //1进行中 2未开始
title: "序:产品经理从初级到中级",
courseItem: [
{
id: 1,
name: "人工智能启蒙就讲解(上)",
tag: [
{
classify: 1, //1必修 2选修 3在线、测评等 4标签
name: "必修",
},
{
classify: 3,
name: "在线",
},
{
classify: 4,
name: "#通用力",
},
{
classify: 4,
name: "#前沿趋势",
},
],
progress: 90,
},
{
id: 1,
name: "人工智能启蒙就讲解(下)",
tag: [
{
classify: 2,
name: "选修",
},
{
classify: 3,
name: "测评",
},
{
classify: 4,
name: "#通用力",
},
{
classify: 4,
name: "#前沿趋势",
},
],
progress: 0,
},
],
},
{
state: 2, //1进行中 2未开始
title: "第一讲:中级产品经理的思考逻辑",
courseItem: [
{
id: 1,
name: "趣味课前小测 - MBTI测试你适合做哪个方向",
tag: [
{
classify: 1, //1必修 2选修 3在线、测评等 4标签
name: "必修",
},
{
classify: 3,
name: "测评",
},
],
progress: 48,
},
{
id: 1,
name: "趣味课前小测 - MBTI测试你适合做哪个方向",
tag: [
{
classify: 2,
name: "选修",
},
{
classify: 3,
name: "外部链接",
},
],
progress: 0,
},
],
},
{
state: 2, //1进行中 2未开始
title: "第二讲:模块化产品展示",
courseItem: [
{
id: 1,
name: "模块化产品展示相关案例与展示:如何自由组合你的思考?",
tag: [
{
classify: 1, //1必修 2选修 3在线、测评等 4标签
name: "必修",
},
{
classify: 3,
name: "测评",
},
],
progress: 48,
},
{
id: 1,
name: "社交产品如何做好模块化处理?",
tag: [
{
classify: 2,
name: "选修",
},
{
classify: 3,
name: "作业",
},
],
progress: 0,
},
{
id: 1,
name: "微信与Telegram哪个平台的功能模块化做的最好",
tag: [
{
classify: 2,
name: "选修",
},
{
classify: 3,
name: "辩论",
},
],
progress: 0,
},
],
},
],
sharedoc: [
{
id: 1,
name: "项目参考文档.doc",
img: word,
},
{
id: 2,
name: "人工智能启蒙讲解讲义.pptx",
img: ppt,
},
{
id: 3,
name: "中级产品经理必备工具.pdf",
img: pdf,
},
{
id: 4,
name: "Python学习入门讲义.zip",
img: zip,
},
{
id: 5,
name: "Axure RP10更新内容.md",
img: md,
},
],
teacher: [
{
id: 1,
name: "王星天(显示事业)",
introduce: "教师是学生的镜子,学生是老师的影子。",
peopleimg: img,
medal: [medal1, medal2, medal3],
},
],
});
const activeName = ref("first"); const activeName = ref("first");
const totalprogress = ref(30);
const compulsoryprogress = ref(10);
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 types = ref({ const types = ref({
typeName: { typeName: {
@@ -601,7 +420,7 @@ const types = ref({
}, },
}); });
function toFinish(d) { function toFinish(d, sName) {
console.log("ddd", d); console.log("ddd", d);
if (!types.value.path[d.type]) { if (!types.value.path[d.type]) {
ElMessage.error("暂时未开放"); ElMessage.error("暂时未开放");
@@ -642,7 +461,7 @@ function toFinish(d) {
} }
router.push({ router.push({
path: types.value.path[d.type], path: types.value.path[d.type],
query: { id: d.routerTaskId, type: 1, courseId: d.courseId }, query: {id: d.routerTaskId, type: 1, courseId: d.courseId, pName: data.name, sName},
}); });
} }
</script> </script>