feat:修改路由

This commit is contained in:
lixg
2022-11-21 15:10:55 +08:00
parent f53fb920e7
commit e163cd5003
9 changed files with 184 additions and 156 deletions

View File

@@ -2,7 +2,7 @@
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-11-07 17:06:45
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-11-20 17:45:37
* @LastEditTime: 2022-11-20 18:18:11
* @FilePath: /fe-manage/src/api/index.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
@@ -69,5 +69,8 @@ export const getDiscussDetail = (obj) => http.post('/discuss/getDiscussDetail',
//获取模版列表
export const getTemplate = (obj) => http.post('/admin/project/template/list', obj)
//获取模版详细信息
export const getTemplateDetail = (obj) => http.get('/admin/project/template/detail', { params: obj })
//获取项目统计
export const getProjectCount = (projectId) => http.get('/admin/project/projectCount', { params: { projectId: projectId } })

View File

@@ -2,7 +2,7 @@
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-11-04 22:45:31
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-11-20 15:39:38
* @LastEditTime: 2022-11-21 11:51:11
* @FilePath: /fe-manage/src/api/index1.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
@@ -33,6 +33,7 @@ import qs from 'qs';
* request的Header:'Content-Type'= 'application/x-www-form-urlencoded'
* let data = {"code":"1234","name":"yyyy"};
* axios.post(`${this.$url}/test/testRequest`,qs.stringify({data})).then()
*
*
* 3.'Content-Type'= 'application/json传参格式为 raw (JSON格式)。
* (全局请求头:'Content-Type'= 'application/x-www-form-urlencoded'
@@ -55,8 +56,7 @@ export const getLearnPath = (obj) => http.post('/admin/router/list', obj);
export const handleLearnPath = (obj) => http.post('/admin/router/handle', obj);
//获取路径图统计数据
export const getLearnCount = (routerId) => http.get('/admin/router/getCount', { params: { routerId: routerId } })
//获取关卡
export const getChapter = (obj) => http.post('/admin/router/detail', { params: obj });
//新建或编辑关卡
export const editChapter = (obj) => http.post('/admin/router/editChapter', obj);
@@ -89,7 +89,8 @@ export const billboard = (obj) => http.post('/admin/project/billboard', obj);
// 获取组织结构树
export const orgtree = () => http.get('/org/tree');
//获取积分列表
export const noticeList = (projectId) => http.post(`http://localhost:8080/api/admin/project/noticeList?projectId=` + projectId + ``)
// 测试方法
// import * as api from '../../api/index'

View File

@@ -44,7 +44,7 @@
circle: selectedKeys[0] === 'sub10-1' ? false : true,
}"
></span>
<router-link to="/coursereviewedn">待审核课程</router-link>
<router-link to="/manage/coursereviewedn">待审核课程</router-link>
</a-menu-item>
<a-menu-item key="sub10-2">
<span
@@ -53,7 +53,7 @@
circle: selectedKeys[0] === 'sub10-2' ? false : true,
}"
></span>
<router-link to="/coursereviewed">已审核课程</router-link>
<router-link to="/manage/coursereviewed">已审核课程</router-link>
</a-menu-item>
<a-menu-item key="sub10-3">
<span
@@ -62,7 +62,7 @@
circle: selectedKeys[0] === 'sub10-3' ? false : true,
}"
></span>
<router-link to="/projectreviewedn">待审核项目</router-link>
<router-link to="/manage/projectreviewedn">待审核项目</router-link>
</a-menu-item>
<a-menu-item key="sub10-4">
<span
@@ -71,7 +71,7 @@
circle: selectedKeys[0] === 'sub10-4' ? false : true,
}"
></span>
<router-link to="/projectreviewed">已审核项目</router-link>
<router-link to="/manage/projectreviewed">已审核项目</router-link>
</a-menu-item>
</a-sub-menu>
@@ -82,7 +82,7 @@
src="../assets/images/navleft/studyPath.png"
/>
</div>
<router-link to="/learningpath">学习路径</router-link>
<router-link to="/manage/learningpath">学习路径</router-link>
</a-menu-item>
<a-sub-menu key="sub2" @titleClick="titleClick">
@@ -102,7 +102,7 @@
circle: selectedKeys[0] === 'sub2-1' ? false : true,
}"
></span>
<router-link to="/projectmanage">项目</router-link>
<router-link to="/manage/projectmanage">项目</router-link>
</a-menu-item>
<a-menu-item key="sub2-2">
<span
@@ -111,7 +111,7 @@
circle: selectedKeys[0] === 'sub2-2' ? false : true,
}"
></span>
<router-link to="/templatelibrary">模板库</router-link>
<router-link to="/manage/templatelibrary">模板库</router-link>
</a-menu-item>
</a-sub-menu>
@@ -132,7 +132,7 @@
circle: selectedKeys[0] === 'sub3-1' ? false : true,
}"
></span>
<router-link to="/coursemanage">课件管理</router-link>
<router-link to="/manage/coursemanage">课件管理</router-link>
</a-menu-item>
<a-menu-item key="sub3-2">
<span
@@ -141,7 +141,7 @@
circle: selectedKeys[0] === 'sub3-2' ? false : true,
}"
></span>
<router-link to="/coursewaremanage">课程管理</router-link>
<router-link to="/manage/coursewaremanage">课程管理</router-link>
</a-menu-item>
</a-sub-menu>
@@ -162,7 +162,7 @@
src="../assets/images/navleft/survey.png"
/>
</div>
<router-link to="/researchmanage">评估管理</router-link>
<router-link to="/manage/researchmanage">评估管理</router-link>
</a-menu-item>
<a-menu-item key="sub6" @titleClick="titleClick">
@@ -193,7 +193,7 @@
/>
</div>
<router-link to="/certificatecenter">证书中心</router-link>
<router-link to="/manage/certificatecenter">证书中心</router-link>
</a-menu-item>
<a-menu-item key="sub9" @titleClick="titleClick">
<div class="imgBox">
@@ -202,7 +202,7 @@
src="../assets/images/navleft/system.png"
/>
</div>
<router-link to="/systemmanage">系统管理</router-link>
<router-link to="/manage/systemmanage">系统管理</router-link>
</a-menu-item>
</a-menu>
</div>
@@ -220,15 +220,15 @@
@click="handleClick"
>
<a-menu-item key="sub1" @titleClick="titleClick">
<router-link to="/learningpath">学习</router-link>
<router-link to="/manage/learningpath">学习</router-link>
</a-menu-item>
<a-menu-item key="sub2" @titleClick="titleClick">
<router-link to="/projectmanage">项目</router-link>
<router-link to="/manage/projectmanage">项目</router-link>
</a-menu-item>
<a-menu-item key="sub3" @titleClick="titleClick">
<router-link to="/coursewaremanage">课程</router-link>
<router-link to="/manage/coursewaremanage">课程</router-link>
</a-menu-item>
<a-menu-item key="sub4" @titleClick="titleClick">
@@ -295,104 +295,104 @@ export default {
keysList: [
{
href: "/coursereviewedn",
href: "/manage/coursereviewedn",
openKeys: "sub10",
selectedKeys: "sub10-1",
pagename: "待审核课程",
},
{
href: "/coursereviewed",
href: "/manage/coursereviewed",
openKeys: "sub10",
selectedKeys: "sub10-2",
pagename: "已审核课程",
},
{
href: "/projectreviewedn",
href: "/manage/projectreviewedn",
openKeys: "sub10",
selectedKeys: "sub10-3",
pagename: "待审核项目",
},
{
href: "/projectrrviewed",
href: "/manage/projectrrviewed",
openKeys: "sub10",
selectedKeys: "sub10-4",
pagename: "已审核项目",
},
{
href: "/learningpath",
href: "/manage/learningpath",
openKeys: "sub1",
selectedKeys: "sub1",
pagename: "学习路径",
},
{
href: "/leveladd",
href: "/manage/leveladd",
openKeys: "sub1",
selectedKeys: "sub1",
pagename: "关卡",
},
{
href: "/levelcheck",
href: "/manage/levelcheck",
openKeys: "sub1",
selectedKeys: "sub1",
pagename: "查看",
},
{
href: "/leveladddetail",
href: "/manage/leveladddetail",
openKeys: "sub1",
selectedKeys: "sub1",
pagename: "创建关卡",
},
{
href: "/projectmanage",
href: "/manage/projectmanage",
openKeys: "sub2",
selectedKeys: "sub2-1",
pagename: "项目",
},
{
href: "/projectadd",
href: "/manage/projectadd",
openKeys: "sub2",
selectedKeys: "sub2-1",
pagename: "创建项目",
},
{
href: "/templatelibrary",
href: "/manage/templatelibrary",
openKeys: "sub2",
selectedKeys: "sub2-2",
pagename: "模板库",
},
{
href: "/libraryadd",
href: "/manage/libraryadd",
openKeys: "sub2",
selectedKeys: "sub2-2",
pagename: "查看",
},
{
href: "/coursemanage",
href: "/manage/coursemanage",
openKeys: "sub3",
selectedKeys: "sub3-1",
pagename: "课件管理",
},
{
href: "/coursewaremanage",
href: "/manage/coursewaremanage",
openKeys: "sub3",
selectedKeys: "sub3-2",
pagename: "课程管理",
},
{
href: "/certificatecenter",
href: "/manage/certificatecenter",
openKeys: "sub8",
selectedKeys: "sub8",
pagename: "证书中心",
},
{
href: "/systemmanage",
href: "/manage/systemmanage",
openKeys: "sub9",
selectedKeys: "sub9",
pagename: "系统管理",
},
{
href: "/researchmanage",
href: "/manage/researchmanage",
openKeys: "sub5",
selectedKeys: "sub5",
pagename: "评估管理",
@@ -434,7 +434,7 @@ export default {
watch(
() => route.fullPath,
(n) => {
console.log("监听路由", n, store.state.openpages);
console.log("监听路由", n, store.state.openpages, state.keysList);
// console.log("new:" + n.toLowerCase() + ",old:" + o);
let arr = state.keysList;
arr.map((value) => {

View File

@@ -1,25 +1,40 @@
<template>
<div class="openPages">
<draggable v-model="openList" chosenClass="chosen" forceFallback="true" ghostClass="ghost" group="openPage"
animation="500" @start="onStart" @end="onEnd" style="display: flex">
<template #item="{ element }">
<div style="position: relative">
<router-link :to="element.href" class="openItems" :style="{ background: element.active ? '#f5f7fa' : '' }">
<div :style="{
color: element.active
? 'rgba(64, 158, 255, 1)'
: 'rgba(135, 139, 146, 1)',
}">
{{ element.pagename }}
</div>
</router-link>
<div class="close" @click.stop="closePage(element)">
<img src="../assets/images/openPages/close.png" />
</div>
</div>
</template>
</draggable>
</div>
<div class="openPages">
<draggable
v-model="openList"
chosenClass="chosen"
forceFallback="true"
ghostClass="ghost"
group="openPage"
animation="500"
@start="onStart"
@end="onEnd"
style="display: flex"
>
<template #item="{ element }">
<div style="position: relative">
<router-link
:to="element.href"
class="openItems"
:style="{ background: element.active ? '#f5f7fa' : '' }"
>
<div
:style="{
color: element.active
? 'rgba(64, 158, 255, 1)'
: 'rgba(135, 139, 146, 1)',
}"
>
{{ element.pagename }}
</div>
</router-link>
<div class="close" @click.stop="closePage(element)">
<img src="../assets/images/openPages/close.png" />
</div>
</div>
</template>
</draggable>
</div>
</template>
<script>
import { reactive, toRefs } from "vue";
@@ -27,96 +42,96 @@ import { useStore } from "vuex";
import { useRouter } from "vue-router";
import draggable from "vuedraggable";
export default {
name: "OpenPages",
components: {
draggable,
},
setup() {
const store = useStore();
const $router = useRouter();
const state = reactive({
openList: store.state.openpages,
});
name: "OpenPages",
components: {
draggable,
},
setup() {
const store = useStore();
const $router = useRouter();
const state = reactive({
openList: store.state.openpages,
});
const closePage = (value) => {
console.log("点击关闭页面", value, state.openList);
state.openList.map((item, key) => {
if (item.href === value.href) {
if (state.openList.length === 1) {
if (state.openList[0].href !== "/learningpath") {
state.openList.splice(key, 1);
}
$router.push({ path: "/learningpath" });
} else {
if (value.active) {
if (key === state.openList.length - 1) {
$router.push({ path: state.openList[key - 1].href });
} else {
$router.push({ path: state.openList[key + 1].href });
}
}
state.openList.splice(key, 1);
}
}
});
store.commit("chengeOpenpages", state.openList);
};
return {
...toRefs(state),
closePage,
};
},
const closePage = (value) => {
console.log("点击关闭页面", value, state.openList);
state.openList.map((item, key) => {
if (item.href === value.href) {
if (state.openList.length === 1) {
if (state.openList[0].href !== "/manage/learningpath") {
state.openList.splice(key, 1);
}
$router.push({ path: "/manage/learningpath" });
} else {
if (value.active) {
if (key === state.openList.length - 1) {
$router.push({ path: state.openList[key - 1].href });
} else {
$router.push({ path: state.openList[key + 1].href });
}
}
state.openList.splice(key, 1);
}
}
});
store.commit("chengeOpenpages", state.openList);
};
return {
...toRefs(state),
closePage,
};
},
};
</script>
<style lang="scss">
.openPages {
width: 100%;
// height: 50px;
display: flex;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 8px 8px 0px rgba(118, 136, 166, 0.1);
overflow-x: auto;
width: 100%;
// height: 50px;
display: flex;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 8px 8px 0px rgba(118, 136, 166, 0.1);
overflow-x: auto;
.openItems {
width: 272px;
// min-width: 250px;
height: 50px;
border: 1px solid #edf2fa;
border-left: 0px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 400;
line-height: 36px;
cursor: pointer;
flex-shrink: 0;
}
.openItems {
width: 272px;
// min-width: 250px;
height: 50px;
border: 1px solid #edf2fa;
border-left: 0px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 400;
line-height: 36px;
cursor: pointer;
flex-shrink: 0;
}
.close {
width: 16px;
height: 16px;
border-radius: 8px;
.close {
width: 16px;
height: 16px;
border-radius: 8px;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 17px;
right: 27px;
}
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 17px;
right: 27px;
}
.close:hover {
background: rgba(220, 220, 220, 1);
}
.close:hover {
background: rgba(220, 220, 220, 1);
}
.chosen {
// background-color: pink;
}
.chosen {
// background-color: pink;
}
.ghost {
// background-color: red;
opacity: 0;
}
.ghost {
// background-color: red;
opacity: 0;
}
}
</style>

View File

@@ -1,16 +1,25 @@
/*
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-11-09 09:26:26
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-11-21 15:06:51
* @FilePath: /fe-manage/src/router/config.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
const routes = [];
const context = require.context("@/views", true, /\.vue$/, "lazy");
context.keys().forEach((path) => {
// console.log('path', path)
const componentName = path.replace(/.*\/([^\\.\\/]*)\.vue$/, "$1");
routes.push({
path: `/${componentName.toLowerCase()}/:id?`,
path: `/manage/${componentName.toLowerCase()}/:id?`,
name: componentName,
component: () => context(path),
meta: {
isLink: true,
},
});
// console.log('routes', routes)
});
export default routes;

View File

@@ -2,26 +2,24 @@
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-11-09 09:26:26
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-11-16 09:56:16
* @LastEditTime: 2022-11-21 14:55:13
* @FilePath: /fe-manage/src/router/index.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { createRouter,createWebHistory } from 'vue-router';
import { createRouter, createWebHistory } from 'vue-router';
import routesConfig from './config';
console.log('routesConfig', routesConfig)
const routes = [
{
path: '/',
name: '首页',
redirect: '/learningpath'
redirect: '/manage/learningpath'
},
...routesConfig
]
const router = createRouter({
history: createWebHistory(),
routes
})
base: '/manage',
routes,
})
export default router

View File

@@ -2,7 +2,7 @@
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2022-11-09 09:26:26
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2022-11-20 16:06:52
* @LastEditTime: 2022-11-21 14:50:47
* @FilePath: /fe-manage/src/store/index.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
@@ -15,7 +15,7 @@ export default createStore({
: [
{
pagename: "学习路径",
href: "/learningpath",
href: "/manage/learningpath",
active: true,
},
],

View File

@@ -785,14 +785,14 @@ export default {
console.log(`selected ${key}`, classifyList5.value);
//获取模版信息
let obj = {
projectId: Number(key),
projectTemplateId: Number(key),
};
api
.getProjectDetail(obj)
.getTemplateDetail(obj)
.then((res) => {
console.log("获取项目详情", res);
console.log("获取模版详情", res);
if (res.status === 200) {
let info = res.data.data.projectInfo;
let info = res.data.data.projectTemplateInfo;
console.log(info);
// projectName classifySelect imageUrl * classifySelect1 * remark checked classifySelect3 classifySelect4 changeChecked1 *
projectName.value = info.name;
@@ -852,7 +852,7 @@ export default {
// projectId:id?id:''
};
api
.getProjectList(obj)
.getTemplate(obj)
.then((res) => {
console.log("获取模版列表", res);
state.totalPages = Number(res.data.data.pages);
@@ -861,7 +861,7 @@ export default {
let array = classifyList5.value;
arr.map((value) => {
let obj = {
value: value.projectId,
value: value.projectTemplateId,
label: value.name,
};
array.push(obj);

View File

@@ -1047,6 +1047,8 @@ import * as apimove from "../../api/indexMovetask";
import draggable from "vuedraggable";
import { storage } from "../../api/storage";
import UnlockMode from "../../components/drawers/UnlockMode.vue";
// import * as api1 from "../../api/index1";
const drawercolumns = [
{
title: "项目名称",