Skip to content

C
confucius
Commit 9fd75e30 authored by 黄奎's avatar 黄奎
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/luochao/confucius

parents 63bb0792 a441de99
Hide whitespace changes
Inline Side-by-side
Showing with 451 additions and 3 deletions
src/App.vue
View file @ 9fd75e30
...@@ -12,7 +12,7 @@ export default { ...@@ -12,7 +12,7 @@ export default {
<style> <style>
@import url('~assets/css/font.css'); @import url('~assets/css/font.css');
@import url('//at.alicdn.com/t/font_2077629_i2jhncmmilc.css'); @import url('//at.alicdn.com/t/font_2077629_cuetpapmdg.css');
html, html,
body, body,
......
src/layouts/myCourse.vue 0 → 100644
View file @ 9fd75e30
<style>
.classD1{
width: 138px;
height:78px;
border-radius: 6px;
margin: 0 auto;
margin-top: 15px;
overflow: hidden;
}
.text_Degree{
font-size: 16px;
text-align: center;
width: 100%;
line-height: 21px;
margin-top: 12px;
color:#181E33;
}
.nav-content{
margin-top: 8px;
padding-bottom: 30px;
}
.nav-content ul{
border-bottom:2px solid #F8F8F8;
padding:12px 0;
}
.nav-content ul li{
width: 100%;
height: 54px;
position: relative;
padding-left:47px;
height: 54px;
line-height: 54px;
font-size: 14px;
color: #737886;
cursor: pointer;
}
.nav-content ul li i {
display: inline-block;
font-size: 18px;
color:#737886;
margin-right: 6px;
position: relative;
top:1px;
}
.nav-content ul li:hover {
background: #f6f9fd;
}
.checkedLi{
background-color: #f6f9fd;
color:#3B90FF!important;
}
.checkedLi i{
color:#3B90FF!important;
}
</style>
<template>
<q-layout view="lHh Lpr lFf">
<q-header bordered reveal height-hint="98" class="head-bg">
<q-toolbar style="height:60px;" class="q-pr-lg q-pl-lg">
<q-avatar style="width:38px">
<img :src="logo">
</q-avatar>
<q-toolbar-title style="font-family:perfectFont;margin-right:50px">
{{name}}
</q-toolbar-title>
<q-tabs v-model="tab" @input="changeNavs" inline-label
style="margin:0 auto; font-family:perfectFont;height:60px;flex:1;justify-content: left;" class="text-white"
shrink stretch v-if="userInfo">
<q-tab v-for="(x, i) in userInfo.MenuList" class="q-mr-md" :key="i" @click="setNavs(i)" :name="`navs_${i}`"
:label="x.MenuName" :icon="x.MenuIcon" />
</q-tabs>
<div class="q-pl-lg">
<q-btn-dropdown flat color="primary" size="xs">
<template v-slot:label>
<q-icon left name="iconfont icon-message" class="text-white" style="font-size:20px;">
<q-badge color="negative" floating>4</q-badge>
</q-icon>
</template>
<q-list bordered padding class="rounded-borders" style="max-width: 350px">
<q-item-label header>Folders</q-item-label>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="folder" color="primary" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">Photos</q-item-label>
<q-item-label caption>February 22nd, 2019</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" color="green" />
</q-item-section>
</q-item>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="folder" color="orange" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">Movies</q-item-label>
<q-item-label caption>March 1st, 2019</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" />
</q-item-section>
</q-item>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="folder" color="teal" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">Photos</q-item-label>
<q-item-label caption>January 15th, 2019</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" />
</q-item-section>
</q-item>
<q-separator spaced />
<q-item-label header>Files</q-item-label>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="assignment" color="grey" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">Expenses spreadsheet</q-item-label>
<q-item-label caption>March 2nd, 2019</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" />
</q-item-section>
</q-item>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="place" color="grey" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">Places to visit</q-item-label>
<q-item-label caption>February 22, 2019</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" color="amber" />
</q-item-section>
</q-item>
<q-item clickable v-ripple>
<q-item-section avatar top>
<q-avatar icon="library_music" color="grey" text-color="white" />
</q-item-section>
<q-item-section>
<q-item-label lines="1">My favorite song</q-item-label>
<q-item-label caption>Singing it all day</q-item-label>
</q-item-section>
<q-item-section side>
<q-icon name="info" />
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
<q-btn-dropdown flat color="primary" size="xs" v-if="userInfo">
<template v-slot:label>
<q-avatar size="28px">
<img :src="userInfo.UserIcon">
</q-avatar>
</template>
<div class="row no-wrap q-pa-md">
<div class="column">
<div class="text-h6 q-mb-md">Settings</div>
<q-list bordered padding v-if="userCenterMenuList&&userCenterMenuList.length>0">
<q-item v-for="(uItem,uIndex) in userCenterMenuList" :to="uItem.MenuUrl" :key="uIndex">
<q-item-section avatar>
<q-icon :name="uItem.MenuIcon" />
</q-item-section>
<q-item-section>{{uItem.MenuName}}</q-item-section>
</q-item>
</q-list>
</div>
<q-separator vertical inset class="q-mx-lg" />
<div class="column items-center">
<q-avatar size="72px">
<img :src="userInfo.UserIcon">
</q-avatar>
<div class="text-subtitle1 q-mt-md q-mb-xs">{{userInfo.AccountName}}</div>
<q-btn color="primary" label="登出系统" push size="sm" v-close-popup @click="logout" />
</div>
</div>
</q-btn-dropdown>
</div>
</q-toolbar>
</q-header>
<q-page-container class="window-height">
<div class="row items-stretch full-height">
<div style="box-shadow: 2px 0 10px 0 rgba(237,238,240,0.50);font-family:perfectFont;"
class="text-subtitle2 second-menu-bg" :style="{'width':isExpend?'40px':'180px'}">
<div class="full-width left-menu-box q-pt-md">
<q-list style="width:180px;overflow:hidden">
<div class="classD1">
<img style="width:100%;height:100%;" src="../assets/images/myimg/topBg.jpg" alt="">
</div>
<div class="text_Degree">0-N3直通车</div>
<div class="nav-content">
<ul>
<li class="checkedLi">
<i style="font-size:20px;" class="iconfont icon-PPT"></i>教案
</li>
<li>
<i class="iconfont icon-tiku"></i>题库
</li>
<li>
<i class="iconfont icon-icon_zhangjielianxi"></i>章节
</li>
</ul>
</div>
</q-list>
</div>
</div>
<div class="col" style="background: #f2f4f7;">
<q-scroll-area class="fit" :thumb-style="thumbStyle" :bar-style="barStyle" visible style="">
<router-view style="margin:20px" />
</q-scroll-area>
</div>
</div>
</q-page-container>
</q-layout>
</template>
<script>
import {
mapGetters
} from 'vuex'
export default {
name: 'myCourse',
components: {
},
data() {
return {
leftDrawerOpen: false,
tab: "navs_0",
currentPath: "",
thumbStyle: {
right: '0px',
borderRadius: '0px',
backgroundColor: '#1d1d1d',
width: '6px',
opacity: 1
},
barStyle: {
right: '0px',
borderRadius: '0px',
backgroundColor: '#999',
width: '6px',
opacity: 0.5
},
contentStyle2: {
backgroundColor: 'rgba(0,0,0,0.02)',
color: '#555'
},
isExpend: false,
contentActiveStyle2: {
backgroundColor: '#eee',
color: 'black'
},
thumbStyle2: {
right: '0px',
borderRadius: '5px',
backgroundColor: '#027be3',
width: '5px',
opacity: 0.75
},
userCenterMenuList: [], //用户中心菜单
}
},
watch: {
$route: {
handler: function (route) {
this.currentPath = route.path
},
immediate: true
},
userInfo: {
handler: function (newVal) {
let i = this.tab.split('_')[1];
if (newVal && newVal.UserCenterList) {
this.userCenterMenuList = newVal.UserCenterList;
}
},
immediate: true
}
},
computed: {
...mapGetters([
'userInfo',
'logo',
'name'
]),
},
mounted() {
let i = 0
if (sessionStorage.getItem("current_navs")) {
i = sessionStorage.getItem("current_navs")
}
this.tab = `navs_${i}`
},
methods: {
logout() {
this.$store
.dispatch('LogOut')
.then(() => {
this.$router.push('/login')
})
.catch(() => {})
},
changeNavs(val) {
let i = val.split('_')[1]
},
setNavs(val) {
//防止页面数据丢失
sessionStorage.setItem("current_navs", val)
this.tab = `navs_${val}`
this.secondNavs = this.userInfo.MenuList[val].SubList
this.$router.push({
path: this.userInfo.MenuList[val].MenuUrl
})
}
},
}
</script>
<style>
.full-width {
height: 100%;
}
.head-bg {
background-image: url('~assets/images/page/top.png');
background-position: right;
background-repeat: no-repeat;
background-size: auto 100%;
}
.second-menu-bg {
background-image: url('~assets/images/page/left.png');
background-position: bottom;
background-repeat: no-repeat;
background-size: 100% auto;
height: 100%;
}
.hide-scrollbar {
scrollbar-width: 5px !important;
-ms-overflow-style: marquee, panner !important;
}
.suojin {
height: 40px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, .5);
}
.suojin i {
font-size: 24px;
color: #636363;
}
.left-menu-box {
overflow-x: hidden;
overflow-y: auto;
max-height: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.3);
}
.left-menu-box::-webkit-scrollbar {
width: 4px;
height: 4px;
}
.left-menu-box::-webkit-scrollbar-thumb {
border-radius: 4px;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #bbb;
}
/* .left-menu-box::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 10px;
background: #EDEDED;
} */
@keyframes shouqidonghua {
from {
width: 180px;
}
to {
width: 60px;
}
}
.changeShowqidonghua {
animation: shouqidonghua 0.5s linear;
width: 60px !important;
overflow-x: hidden;
}
@keyframes shouqidonghua {
from {
width: 180px;
}
to {
width: 60px;
}
}
.changeShowqidonghua {
animation: shouqidonghua 0.5s linear;
width: 60px !important;
overflow-x: hidden;
}
</style>
src/pages/course/course.vue
View file @ 9fd75e30
...@@ -58,6 +58,8 @@ ...@@ -58,6 +58,8 @@
@click="gotoSub(props.row,'chapter')"></q-btn> @click="gotoSub(props.row,'chapter')"></q-btn>
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑" <q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="EditCourse(props.row)" /> @click="EditCourse(props.row)" />
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="详情"
@click="goMycourse()" />
</q-td> </q-td>
</template> </template>
</q-table> </q-table>
...@@ -238,6 +240,12 @@ ...@@ -238,6 +240,12 @@
//关闭弹窗 //关闭弹窗
closeMenuSaveForm() { closeMenuSaveForm() {
this.isShowCourseForm = false this.isShowCourseForm = false
},
//跳转至我的课程
goMycourse(){
this.$router.push({
path: '/myCourse',
});
} }
} }
} }
......
src/pages/course/question.vue
View file @ 9fd75e30
<style>
.page-content p{
margin:16px 0 0 0!important;
}
</style>
<template> <template>
<div class="page-body"> <div class="page-body">
<div class="page-search row items-center"> <div class="page-search row items-center">
...@@ -42,10 +47,10 @@ ...@@ -42,10 +47,10 @@
</template> </template>
<template v-slot:body-cell-optioned="props"> <template v-slot:body-cell-optioned="props">
<q-td :props="props"> <q-td :props="props">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="删除"
@click="setQuestionStatus(props.row)"></q-btn>
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑" <q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="EditQuestion(props.row)" /> @click="EditQuestion(props.row)" />
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="删除"
@click="setQuestionStatus(props.row)"></q-btn>
</q-td> </q-td>
</template> </template>
</q-table> </q-table>
......
src/router/routes.js
View file @ 9fd75e30
...@@ -452,6 +452,14 @@ const routes = [{ ...@@ -452,6 +452,14 @@ const routes = [{
}, },
] ]
}, },
{
path:"/myCourse",
component: () =>
import("layouts/myCourse.vue"),
children:[
]
},
// Always leave this as last one, // Always leave this as last one,
// but you can also remove it // but you can also remove it
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment