mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-student.git
synced 2025-12-10 03:16:47 +08:00
Merge remote-tracking branch 'origin/develop' into develop
This commit is contained in:
16
src/App.vue
16
src/App.vue
@@ -2,7 +2,7 @@
|
||||
* @Author: lixg lixg@dongwu-inc.com
|
||||
* @Date: 2022-11-21 17:28:10
|
||||
* @LastEditors: lixg lixg@dongwu-inc.com
|
||||
* @LastEditTime: 2022-12-11 20:19:39
|
||||
* @LastEditTime: 2022-12-13 18:20:41
|
||||
* @FilePath: /fe-stu/src/App.vue
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
-->
|
||||
@@ -40,10 +40,10 @@ export default defineComponent({
|
||||
|
||||
const currentRouteName = computed(() => route.name);
|
||||
|
||||
localStorage.setItem(
|
||||
"token",
|
||||
"eyJ0eXBlIjoidG9rZW4iLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC91LmJvZS5jb20iLCJpYXQiOjE2NzA3NjExNzIsImV4cCI6MTY3MDc2ODM3MiwiR2l2ZW5OYW1lIjoiYm9ldSIsInVzZXJJZCI6IjZCMDQ5RkFGLUMzMTQtN0NDRi0wRDI4LTBEMjNGNEM0MjUzMSIsInVJZCI6Ijk2NTM0MjAyNzQ5NzYwNzE2OCIsInBlcm1pc3Npb24iOiIifQ==.9e8c4d3933c3a6d9b660e0b849940c813e1c245b3d17646ff7a793100640bc42"
|
||||
);
|
||||
// localStorage.setItem(
|
||||
// "token",
|
||||
// "eyJ0eXBlIjoidG9rZW4iLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC91LmJvZS5jb20iLCJpYXQiOjE2NzA3NjExNzIsImV4cCI6MTY3MDc2ODM3MiwiR2l2ZW5OYW1lIjoiYm9ldSIsInVzZXJJZCI6IjZCMDQ5RkFGLUMzMTQtN0NDRi0wRDI4LTBEMjNGNEM0MjUzMSIsInVJZCI6Ijk2NTM0MjAyNzQ5NzYwNzE2OCIsInBlcm1pc3Npb24iOiIifQ==.9e8c4d3933c3a6d9b660e0b849940c813e1c245b3d17646ff7a793100640bc42"
|
||||
// );
|
||||
return {
|
||||
routes,
|
||||
name: currentRouteName,
|
||||
@@ -67,8 +67,8 @@ export default defineComponent({
|
||||
display: flex;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
// background-color: rgba(242, 245, 247, 1);
|
||||
background-color: #ccc;
|
||||
background-color: rgba(242, 245, 247, 1);
|
||||
// background-color: #ccc;
|
||||
#nav {
|
||||
width: 220px;
|
||||
height: 100%;
|
||||
@@ -101,7 +101,7 @@ export default defineComponent({
|
||||
main {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
padding: 30px;
|
||||
// padding: 30px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,14 +5,16 @@
|
||||
<div class="titleL">
|
||||
<div @click="returnfun" class="text">学习路径图</div>
|
||||
<div class="info" style="margin-right: 14px">
|
||||
<img style="width: 20px; height: 18px; margin-right: 10px"
|
||||
src="../../assets/image/pm.png"
|
||||
<img
|
||||
style="width: 20px; height: 18px; margin-right: 10px"
|
||||
src="../../assets/image/pm.png"
|
||||
/>
|
||||
<div style="margin-top: 1px">产品经理</div>
|
||||
</div>
|
||||
<div class="info">
|
||||
<img style="width: 18px; height: 17px; margin-right: 11px"
|
||||
src="../../assets/image/band.png"
|
||||
<img
|
||||
style="width: 18px; height: 17px; margin-right: 11px"
|
||||
src="../../assets/image/band.png"
|
||||
/>
|
||||
<div style="margin-top: 2px">Band8</div>
|
||||
</div>
|
||||
@@ -21,16 +23,18 @@
|
||||
<el-popover width="475px" trigger="hover" popper-class="lppopover">
|
||||
<div>
|
||||
<div class="finish">
|
||||
<img src="../../assets/image/circle.png"
|
||||
style="width: 20px; height: 20px"
|
||||
<img
|
||||
src="../../assets/image/circle.png"
|
||||
style="width: 20px; height: 20px"
|
||||
/>
|
||||
<div class="text">未完成</div>
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
<div v-for="(value, index) in unCompleteTaskList"
|
||||
:key="index"
|
||||
class="tasks"
|
||||
:style="{
|
||||
<div
|
||||
v-for="(value, index) in unCompleteTaskList"
|
||||
:key="index"
|
||||
class="tasks"
|
||||
:style="{
|
||||
'border-bottom':
|
||||
index === unCompleteTaskList.length - 1
|
||||
? null
|
||||
@@ -41,9 +45,9 @@
|
||||
{{ value.name }}
|
||||
</div>
|
||||
<img
|
||||
style="width: 20px; height: 20px"
|
||||
src="../../assets/image/go.png"
|
||||
@click="toUnTask(chapterId)"
|
||||
style="width: 20px; height: 20px"
|
||||
src="../../assets/image/go.png"
|
||||
@click="toUnTask(chapterId)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -54,9 +58,9 @@
|
||||
</el-popover>
|
||||
</div>
|
||||
<div
|
||||
:style="{ display: showmapdetail ? 'flex' : 'none' }"
|
||||
class="titleR"
|
||||
@click="returnfun"
|
||||
:style="{ display: showmapdetail ? 'flex' : 'none' }"
|
||||
class="titleR"
|
||||
@click="returnfun"
|
||||
>
|
||||
返回列表
|
||||
</div>
|
||||
@@ -66,27 +70,30 @@
|
||||
<div style="min-width: 770px; width: 100%">
|
||||
<el-table :data="data" style="width: 100%" @row-click="gofun">
|
||||
<el-table-column
|
||||
prop="img"
|
||||
label="缩略图"
|
||||
#default="scope"
|
||||
align="center"
|
||||
width="255"
|
||||
prop="img"
|
||||
label="缩略图"
|
||||
#default="scope"
|
||||
align="center"
|
||||
width="255"
|
||||
>
|
||||
<img :src="scope.row.picUrl" style="width: 230px; height: 155px"/>
|
||||
<img
|
||||
:src="scope.row.picUrl"
|
||||
style="width: 230px; height: 155px"
|
||||
/>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="name" label="路径名称"/>
|
||||
<el-table-column align="center" prop="name" label="路径名称" />
|
||||
<el-table-column
|
||||
align="center"
|
||||
prop="introduce"
|
||||
label="路径介绍"
|
||||
#default="scope"
|
||||
align="center"
|
||||
prop="introduce"
|
||||
label="路径介绍"
|
||||
#default="scope"
|
||||
>
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
title="路径介绍"
|
||||
:width="350"
|
||||
trigger="hover"
|
||||
:content="scope.row.remark"
|
||||
placement="top-start"
|
||||
title="路径介绍"
|
||||
:width="350"
|
||||
trigger="hover"
|
||||
:content="scope.row.remark"
|
||||
>
|
||||
<template #reference>
|
||||
<div>{{ scope.row.remark }}</div>
|
||||
@@ -94,16 +101,23 @@
|
||||
</el-popover>
|
||||
</el-table-column>
|
||||
|
||||
<<<<<<< HEAD
|
||||
<el-table-column align="center" prop="target" label="目标人群" />
|
||||
=======
|
||||
<el-table-column align="center" prop="organizationName" label="归属组织"/>
|
||||
>>>>>>> c75d463c401f71da9db53014bf96eb14db8ab0d8
|
||||
<el-table-column
|
||||
#default="scope"
|
||||
align="center"
|
||||
width="110"
|
||||
prop="state"
|
||||
label="状态"
|
||||
#default="scope"
|
||||
align="center"
|
||||
width="110"
|
||||
prop="state"
|
||||
label="状态"
|
||||
>
|
||||
<img :src="{0:nostarted,1:completed,2:ongoing}[scope.row.status]"
|
||||
style="width: 99px; height: 99px"
|
||||
<img
|
||||
:src="
|
||||
{ 0: nostarted, 1: completed, 2: ongoing }[scope.row.status]
|
||||
"
|
||||
style="width: 99px; height: 99px"
|
||||
/>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -112,11 +126,11 @@
|
||||
<!-- 路径列表-->
|
||||
<!-- 路径详情图 -->
|
||||
<div
|
||||
:style="{ display: showmapdetail ? 'flex' : 'none' }"
|
||||
class="mapdetail"
|
||||
:style="{ display: showmapdetail ? 'flex' : 'none' }"
|
||||
class="mapdetail"
|
||||
>
|
||||
<div v-for="(item,i) in detail?.rows">
|
||||
<img :src="useImage(`222_0${i+2}.png`)">
|
||||
<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;">-->
|
||||
@@ -127,46 +141,46 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import {reactive, toRefs, 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 {request, usePage, useRequest} from "@/api/request";
|
||||
import {ROUTER_CHAPTER_LIST, ROUTER_LIST, ROUTER_UNCOMPLETE_LIST} from "@/api/api";
|
||||
import {useImage} from "@/api/utils";
|
||||
import {useRouter} from "vue-router";
|
||||
import { reactive, toRefs, 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 { request, usePage, useRequest } from "@/api/request";
|
||||
import {
|
||||
ROUTER_CHAPTER_LIST,
|
||||
ROUTER_LIST,
|
||||
ROUTER_UNCOMPLETE_LIST,
|
||||
} from "@/api/api";
|
||||
import { useImage } from "@/api/utils";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
const detail = ref()
|
||||
const {data} = usePage(ROUTER_LIST, {})
|
||||
const detail = ref();
|
||||
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({
|
||||
showmapdetail: false,
|
||||
});
|
||||
const {showmapdetail} = toRefs(state)
|
||||
const { showmapdetail } = toRefs(state);
|
||||
|
||||
const returnfun = () => {
|
||||
state.showmapdetail = false;
|
||||
};
|
||||
|
||||
async function gofun({routerId}) {
|
||||
async function gofun({ routerId }) {
|
||||
// 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}})
|
||||
}
|
||||
|
||||
function toUnTask() {
|
||||
|
||||
router.push({ path: "/pathdetails", query: { routerId } });
|
||||
}
|
||||
|
||||
function toUnTask() {}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.modal {
|
||||
|
||||
}
|
||||
|
||||
.modal:after {
|
||||
|
||||
Reference in New Issue
Block a user