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

init

Browse Source
This commit is contained in:
yuping
2022-12-13 19:28:28 +08:00
parent 5d2f88034a
commit d440b5aa82
2 changed files with 60 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
src/views/roadmap/LearnPath.vue
View File

@@ -6,15 +6,15 @@
<div @click="returnfun" class="text">学习路径图</div> <div @click="returnfun" class="text">学习路径图</div>
<div class="info" style="margin-right: 14px"> <div class="info" style="margin-right: 14px">
<img <img
style="width: 20px; height: 18px; margin-right: 10px" style="width: 20px; height: 18px; margin-right: 10px"
src="../../assets/image/pm.png" src="../../assets/image/pm.png"
/> />
<div style="margin-top: 1px">产品经理</div> <div style="margin-top: 1px">产品经理</div>
</div> </div>
<div class="info"> <div class="info">
<img <img
style="width: 18px; height: 17px; margin-right: 11px" style="width: 18px; height: 17px; margin-right: 11px"
src="../../assets/image/band.png" src="../../assets/image/band.png"
/> />
<div style="margin-top: 2px">Band8</div> <div style="margin-top: 2px">Band8</div>
</div> </div>
@@ -24,17 +24,17 @@
<div> <div>
<div class="finish"> <div class="finish">
<img <img
src="../../assets/image/circle.png" src="../../assets/image/circle.png"
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
/> />
<div class="text">未完成</div> <div class="text">未完成</div>
<div class="box"></div> <div class="box"></div>
</div> </div>
<div <div
v-for="(value, index) in unCompleteTaskList" v-for="(value, index) in unCompleteTaskList"
:key="index" :key="index"
class="tasks" class="tasks"
:style="{ :style="{
'border-bottom': 'border-bottom':
index === unCompleteTaskList.length - 1 index === unCompleteTaskList.length - 1
? null ? null
@@ -45,9 +45,9 @@
{{ value.name }} {{ value.name }}
</div> </div>
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/go.png" src="../../assets/image/go.png"
@click="toUnTask(chapterId)" @click="toUnTask(chapterId)"
/> />
</div> </div>
</div> </div>
@@ -58,9 +58,9 @@
</el-popover> </el-popover>
</div> </div>
<div <div
:style="{ display: showmapdetail ? 'flex' : 'none' }" :style="{ display: showmapdetail ? 'flex' : 'none' }"
class="titleR" class="titleR"
@click="returnfun" @click="returnfun"
> >
返回列表 返回列表
</div> </div>
@@ -70,30 +70,30 @@
<div style="min-width: 770px; width: 100%"> <div style="min-width: 770px; width: 100%">
<el-table :data="data" style="width: 100%" @row-click="gofun"> <el-table :data="data" style="width: 100%" @row-click="gofun">
<el-table-column <el-table-column
prop="img" prop="img"
label="缩略图" label="缩略图"
#default="scope" #default="scope"
align="center" align="center"
width="255" width="255"
> >
<img <img
:src="scope.row.picUrl" :src="scope.row.picUrl"
style="width: 230px; height: 155px" style="width: 230px; height: 155px"
/> />
</el-table-column> </el-table-column>
<el-table-column align="center" prop="name" label="路径名称" /> <el-table-column align="center" prop="name" label="路径名称"/>
<el-table-column <el-table-column
align="center" align="center"
prop="introduce" prop="introduce"
label="路径介绍" label="路径介绍"
#default="scope" #default="scope"
> >
<el-popover <el-popover
placement="top-start" placement="top-start"
title="路径介绍" title="路径介绍"
:width="350" :width="350"
trigger="hover" trigger="hover"
:content="scope.row.remark" :content="scope.row.remark"
> >
<template #reference> <template #reference>
<div>{{ scope.row.remark }}</div> <div>{{ scope.row.remark }}</div>
@@ -102,22 +102,22 @@
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="organizationName" prop="organizationName"
label="归属组织" label="归属组织"
/> />
<el-table-column <el-table-column
#default="scope" #default="scope"
align="center" align="center"
width="110" width="110"
prop="state" prop="state"
label="状态" label="状态"
> >
<img <img
:src=" :src="
{ 0: nostarted, 1: completed, 2: ongoing }[scope.row.status] { 0: nostarted, 1: completed, 2: ongoing }[scope.row.status]
" "
style="width: 99px; height: 99px" style="width: 99px; height: 99px"
/> />
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -126,11 +126,11 @@
<!-- 路径列表--> <!-- 路径列表-->
<!-- 路径详情图 --> <!-- 路径详情图 -->
<div <div
:style="{ display: showmapdetail ? 'flex' : 'none' }" :style="{ display: showmapdetail ? 'flex' : 'none' }"
class="mapdetail" class="mapdetail"
> >
<div v-for="(item, i) in detail?.rows" :key="i"> <div v-for="(item, i) in detail?.rows" :key="i">
<img :src="useImage(`222_0${i + 2}.png`)" /> <img :src="useImage(`222_0${i + 2}.png`)"/>
</div> </div>
<!-- <div class="modal"--> <!-- <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;">--> <!-- style="width: calc(100% - 168px); height: 525px;background-image: url('../../src/assets/image/mapdetail.png');background-size: 100%;background-repeat: no-repeat;">-->
@@ -141,43 +141,46 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { reactive, toRefs, ref } from "vue"; import {reactive, toRefs, ref} from "vue";
import nostarted from "../../assets/image/nostarted.png"; import nostarted from "../../assets/image/nostarted.png";
import completed from "../../assets/image/completed.png"; import completed from "../../assets/image/completed.png";
import ongoing from "../../assets/image/ongoing.png"; import ongoing from "../../assets/image/ongoing.png";
import { request, usePage, useRequest } from "@/api/request"; import {request, usePage, useRequest} from "@/api/request";
import { import {
BASE_URL,
ROUTER_CHAPTER_LIST, ROUTER_CHAPTER_LIST,
ROUTER_LIST, ROUTER_LIST,
ROUTER_UNCOMPLETE_LIST, ROUTER_UNCOMPLETE_LIST,
} from "@/api/api"; } from "@/api/api";
import { useImage } from "@/api/utils"; import {useImage} from "@/api/utils";
import { useRouter } from "vue-router"; import {useRouter} from "vue-router";
const detail = ref(); const detail = ref();
const { data } = usePage(ROUTER_LIST, {}); const {data} = usePage(ROUTER_LIST, {});
const router = useRouter(); const router = useRouter();
const { unCompleteTaskList } = useRequest(ROUTER_UNCOMPLETE_LIST, {}); const {unCompleteTaskList} = useRequest(ROUTER_UNCOMPLETE_LIST, {});
const state = reactive({ const state = reactive({
showmapdetail: false, showmapdetail: false,
}); });
const { showmapdetail } = toRefs(state); const {showmapdetail} = toRefs(state);
const returnfun = () => { const returnfun = () => {
state.showmapdetail = false; state.showmapdetail = false;
}; };
async function gofun({ routerId }) { async function gofun({routerId}) {
// console.log(routerId) // console.log(routerId)
// const data = await request(ROUTER_CHAPTER_LIST, {stuChapterListVo: {routerId}}) // const data = await request(ROUTER_CHAPTER_LIST, {stuChapterListVo: {routerId}})
// detail.value = data.data // detail.value = data.data
// state.showmapdetail = true; // state.showmapdetail = true;
router.push({ path: "/pathdetails", query: { routerId } }); // router.push({path: "/pathdetails", query: {routerId}});
window.location.href = `${BASE_URL}/pathdetails?routerId=${routerId}`
} }
function toUnTask() {} function toUnTask() {
}
</script> </script>
<style lang="scss"> <style lang="scss">
.modal { .modal {

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

@@ -572,8 +572,7 @@ function toFinish(d) {
ElMessage.error('暂时未开放') ElMessage.error('暂时未开放')
return return
} }
window.parent.location.href = `${BASE_URL + types.value.path[d.type]}?id=${d.routerTaskId}&type=1&courseId=${d.courseId}` router.push({path: types.value.path[d.type], query: {id: d.routerTaskId, type: 1, courseId: d.courseId}})
// router.push({path: types.value.path[d.type], query: {id: d.routerTaskId, type: 1, courseId: d.courseId}})
} }
</script> </script>