Skip to content

P
project-online-pc
提交 45940ef6 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

优化导航

上级 6a3a52a7
隐藏空白字符变更
内嵌 并排
正在显示 包含 270 行增加 和 341 行删除
components/Head.vue
浏览文件 @ 45940ef6
...@@ -17,219 +17,24 @@ ...@@ -17,219 +17,24 @@
</div> </div>
</div> </div>
<div class="head-nav-content max-width-content"> <div class="head-nav-content max-width-content">
<ul class="nav-item-box" @mouseleave="navLeave"> <app-menu></app-menu>
<template v-for="(item, index) in navData">
<li :key="index">
<div :class="getNameActive(item)">
<template v-if="!item.path">
<template v-if="item.click">
<span @click="showEnroll">{{ item.name }}</span>
</template>
<template v-else>
{{ item.name }}
</template>
</template>
<template v-else>
<nuxt-link :to="item.path">{{ item.name }}</nuxt-link>
</template>
</div>
<div class="child-item" v-if="item.childern">
<div class="one-level">
<template v-for="(level2Item, level2Index) in item.childern">
<div
:class="$route.path === level2Item.path || level2Item.isShow ? 'li active' : 'li'"
:key="level2Index + 'level2'"
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')"
>
<template v-if="level2Item.pathType === 3">
<div @click="$message('暂未开通，尽请期待')" class="name">
{{ level2Item.name }}
</div>
<div class="el-icon-arrow-right" v-if="level2Item.childern"></div>
</template>
<template v-else>
<app-link :item="{
path: level2Item.path
}">
<div class="name">
{{ level2Item.name }}
</div>
<div class="el-icon-arrow-right" v-if="level2Item.childern"></div>
</app-link>
</template>
</div>
</template>
</div>
<!-- <template v-for="(level2Item, level2Index) in item.childern">
<div
class="two-level"
:key="level2Index + 'two-level2'"
v-if="level2Item.isShow"
@mouseenter="level3Show"
@mouseleave="level3Show(level2Item, 'out')"
>
<div
@click="goPage(level3Item.path, level3Item.pathType)"
class="name"
v-for="(level3Item, level3Index) in level2Item.childern"
:key="level3Index + level3Item"
>
{{ level3Item.name }}
</div>
</div>
</template> -->
</div>
</li>
</template>
</ul>
<div class="search-box"></div> <div class="search-box"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import AppLink from '@/components/Link' import AppLink from '@/components/Link'
import AppMenu from '@/components/Menu'
export default { export default {
components: { components: {
AppMenu,
AppLink AppLink
}, },
data() { data() {
return { return {
navData: [
{
name: '项目介绍',
path: '/project-intro/bg',
childern: [
{
name: '项目背景',
path: '/project-intro/bg'
},
{
name: '项目特色',
path: '/project-intro/charac'
},
{
name: '证书授予',
path: '/project-intro/certificate'
}
]
},
{
name: '课程与师资',
path: '/about/course',
childern: [
{
name: '课程设置',
path: '/about/course'
},
{
name: '师资力量',
path: '/about/teacher'
}
]
},
{
name: '最新动态',
path: '/news/hot',
childern: [
{
name: '热点新闻',
path: '/news/hot'
},
{
name: '教授采访',
path: '/news/interview'
}
]
},
{
name: '招生信息',
path: '/apply/relevant',
childern: [
{
name: '有关申请',
path: '/apply/relevant'
},
{
name: '费用资助',
path: '/apply/support'
},
{
name: '常见问题',
path: '/apply/problem'
}
]
},
{
name: '校友风采',
path: '/alumni/outstanding',
childern: [
{
name: '杰出校友',
path: '/alumni/outstanding'
},
{
name: '校友分享',
path: '/alumni/sharing'
}
]
},
{
name: '报名申请',
path: '/my'
}
],
time: null
} }
}, },
methods: { methods: {
goPage(path, goType) {
if (parseInt(goType) === 3) {
this.$message('暂未开通，尽请期待')
} else {
if (path) {
goType ? window.open(path) : this.$router.push({ path: path })
}
}
},
levelShow(item, isOut) {
if (item.childern) {
if (isOut) {
clearTimeout(this.time)
this.time = setTimeout(() => {
item.isShow = false
}, 500)
return
}
this.navLeave()
item.isShow = true
} else {
this.navLeave()
}
},
level3Show(item, isOut) {
if (isOut) {
item.isShow = false
} else {
clearTimeout(this.time)
}
},
navLeave() {
this.navData.map(item => {
if (item.childern) {
item.childern.map(cItem => {
cItem.isShow = false
})
}
})
this.$forceUpdate()
},
showEnroll() {
const dom = document.getElementById('show-enroll')
const dom2 = document.getElementById('show-enroll-content')
dom.style.display = 'block'
dom2.style.display = 'block'
},
logout() { logout() {
this.$store.dispatch('logout').then(() => { this.$store.dispatch('logout').then(() => {
this.$router.replace('/') this.$router.replace('/')
...@@ -246,26 +51,9 @@ export default { ...@@ -246,26 +51,9 @@ export default {
)}` )}`
}, },
registerURL() { registerURL() {
console.log(this.$route)
return `${process.env.loginURL}/register?redirect_uri=${encodeURIComponent( return `${process.env.loginURL}/register?redirect_uri=${encodeURIComponent(
location.origin + this.$route.fullPath location.origin + this.$route.fullPath
)}` )}`
},
getNameActive() {
return item => {
const currentPath = this.$route.path
if (currentPath.includes(item.path)) {
return 'name active'
} else {
let className = 'name'
if (item.childern) {
item.childern.map(cData => {
currentPath.includes(cData.path) && (className = 'name active')
})
}
return className
}
}
} }
} }
} }
...@@ -342,122 +130,7 @@ li { ...@@ -342,122 +130,7 @@ li {
height: 72px; height: 72px;
display: flex; display: flex;
align-items: center; align-items: center;
.nav-item-box {
padding-left: 11px;
display: flex;
li {
position: relative;
margin-right: 60px;
.name {
line-height: 72px;
font-size: 22px;
color: #333333;
cursor: pointer;
a {
color: #333333;
font-size: 22px;
text-decoration: none;
}
&.active {
font-weight: 500;
color: #aa1941;
a {
// font-weight: 500;
color: #aa1941;
}
}
}
&:hover {
.name {
color: #aa1941;
font-weight: 500;
a {
// font-weight: 500;
color: #aa1941;
}
}
.child-item {
.one-level {
display: block;
}
}
}
.child-item {
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
position: absolute;
top: 72px;
left: -10px;
display: flex;
background: #fff;
z-index: 999;
.one-level {
padding: 36px 24px 0;
border-top: 4px solid rgba(170, 25, 65, 1);
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
display: none;
.li {
margin-bottom: 36px;
display: flex;
justify-content: space-between;
&.active {
.name {
color: rgba(170, 25, 65, 1);
}
}
.name {
font-weight: 400;
line-height: 100%;
color: #333333;
font-size: 16px;
white-space: nowrap;
a {
color: #333333;
font-size: 16px;
}
}
.el-icon-arrow-right {
color: rgba(51, 51, 51, 1);
margin-left: 15px;
}
&:hover {
.name {
color: rgba(170, 25, 65, 1);
a {
color: rgba(170, 25, 65, 1);
}
}
.el-icon-arrow-right {
color: rgba(170, 25, 65, 1);
}
}
}
}
.two-level {
pointer-events: auto;
padding: 34px 41px 0 24px;
.name {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
&:hover {
color: rgba(170, 25, 65, 1);
}
a {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
}
}
}
}
}
}
} }
} }
</style> </style>
components/Menu.vue 0 → 100644
浏览文件 @ 45940ef6
<template>
<ul class="nav-item-box" @mouseleave="navLeave">
<template v-for="(item, index) in navData">
<li :key="index">
<div :class="getNameActive(item)">
<template v-if="!item.path">
<template v-if="item.click">
<span @click="showEnroll">{{ item.name }}</span>
</template>
<template v-else>
{{ item.name }}
</template>
</template>
<template v-else>
<nuxt-link :to="item.path">{{ item.name }}</nuxt-link>
</template>
</div>
<div class="child-item" v-if="item.childern">
<div class="one-level">
<template v-for="(level2Item, level2Index) in item.childern">
<div
:class="$route.path === level2Item.path || level2Item.isShow ? 'li active' : 'li'"
:key="level2Index + 'level2'"
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')"
>
<app-link :item="{
path: level2Item.path
}">
<div class="name">
{{ level2Item.name }}
</div>
<div class="el-icon-arrow-right" v-if="level2Item.childern"></div>
</app-link>
</div>
</template>
</div>
</div>
</li>
</template>
</ul>
</template>
<script>
import AppLink from '@/components/Link'
export default {
name: 'AppMenu',
components: { AppLink },
data() {
return {
navData: [
{
name: '项目介绍',
path: '/project-intro/bg',
childern: [
{ name: '项目背景', path: '/project-intro/bg' },
{ name: '项目特色', path: '/project-intro/charac' },
{ name: '证书授予', path: '/project-intro/certificate' }
]
},
{
name: '课程与师资',
path: '/about/course',
childern: [
{ name: '课程设置', path: '/about/course' },
{ name: '师资力量', path: '/about/teacher' }
]
},
{
name: '最新动态',
path: '/news/hot',
childern: [
{ name: '热点新闻', path: '/news/hot' },
{ name: '教授采访', path: '/news/interview' }
]
},
{
name: '招生信息',
path: '/apply/relevant',
childern: [
{ name: '有关申请', path: '/apply/relevant' },
{ name: '费用资助', path: '/apply/support' },
{ name: '常见问题', path: '/apply/problem' }
]
},
{
name: '校友风采',
path: '/alumni/outstanding',
childern: [
{ name: '杰出校友', path: '/alumni/outstanding' },
{ name: '校友分享', path: '/alumni/sharing' }
]
},
{
name: '报名申请',
path: '/my'
}
],
time: null
}
},
methods: {
navLeave() {
this.navData.map(item => {
if (item.childern) {
item.childern.map(cItem => {
cItem.isShow = false
})
}
})
this.$forceUpdate()
},
levelShow(item, isOut) {
if (item.childern) {
if (isOut) {
clearTimeout(this.time)
this.time = setTimeout(() => {
item.isShow = false
}, 500)
return
}
this.navLeave()
item.isShow = true
} else {
this.navLeave()
}
}
},
computed: {
getNameActive() {
return item => {
const currentPath = this.$route.path
if (currentPath.includes(item.path)) {
return 'name active'
} else {
let className = 'name'
if (item.childern) {
item.childern.map(cData => {
currentPath.includes(cData.path) && (className = 'name active')
})
}
return className
}
}
}
}
}
</script>
<style lang="scss" scoped>
.nav-item-box {
padding-left: 11px;
display: flex;
li {
position: relative;
margin-right: 60px;
.name {
line-height: 72px;
font-size: 22px;
color: #333333;
cursor: pointer;
a {
color: #333333;
font-size: 22px;
text-decoration: none;
}
&.active {
font-weight: 500;
color: #aa1941;
a {
// font-weight: 500;
color: #aa1941;
}
}
}
&:hover {
.name {
color: #aa1941;
font-weight: 500;
a {
// font-weight: 500;
color: #aa1941;
}
}
.child-item {
.one-level {
display: block;
}
}
}
.child-item {
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
position: absolute;
top: 72px;
left: -10px;
display: flex;
background: #fff;
z-index: 999;
.one-level {
padding: 36px 24px 0;
border-top: 4px solid rgba(170, 25, 65, 1);
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
display: none;
.li {
margin-bottom: 36px;
display: flex;
justify-content: space-between;
&.active {
.name {
color: rgba(170, 25, 65, 1);
}
}
.name {
font-weight: 400;
line-height: 100%;
color: #333333;
font-size: 16px;
white-space: nowrap;
a {
color: #333333;
font-size: 16px;
}
}
.el-icon-arrow-right {
color: rgba(51, 51, 51, 1);
margin-left: 15px;
}
&:hover {
.name {
color: rgba(170, 25, 65, 1);
a {
color: rgba(170, 25, 65, 1);
}
}
.el-icon-arrow-right {
color: rgba(170, 25, 65, 1);
}
}
}
}
.two-level {
pointer-events: auto;
padding: 34px 41px 0 24px;
.name {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
&:hover {
color: rgba(170, 25, 65, 1);
}
a {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
}
}
}
}
}
}
</style>
components/home/openClass.vue
浏览文件 @ 45940ef6
...@@ -64,7 +64,6 @@ export default { ...@@ -64,7 +64,6 @@ export default {
project_id: process.env.projectId project_id: process.env.projectId
} }
this.listData = await this.$axios.get('/api/zws/v1/cms/news', { params }).then(res => { this.listData = await this.$axios.get('/api/zws/v1/cms/news', { params }).then(res => {
console.log(res)
return res return res
}) })
}, },
......
components/home/presence.vue
浏览文件 @ 45940ef6
...@@ -137,7 +137,6 @@ export default { ...@@ -137,7 +137,6 @@ export default {
project_id: process.env.projectId project_id: process.env.projectId
} }
this.listData = await this.$axios.get('/api/zws/v1/cms/news', { params }).then(res => { this.listData = await this.$axios.get('/api/zws/v1/cms/news', { params }).then(res => {
console.log(params)
return res return res
}) })
}, },
......
components/rightAside.vue
浏览文件 @ 45940ef6
...@@ -129,7 +129,6 @@ export default { ...@@ -129,7 +129,6 @@ export default {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
postNes(params) postNes(params)
.then(res => { .then(res => {
console.log(res)
if (res && res.status === 200 && res.error === 0) { if (res && res.status === 200 && res.error === 0) {
resolve({ resolve({
type: 'enroll', type: 'enroll',
...@@ -157,7 +156,6 @@ export default { ...@@ -157,7 +156,6 @@ export default {
} }
sendCode(param) sendCode(param)
.then(res => { .then(res => {
console.log(res)
this.btnDisabledTimer() this.btnDisabledTimer()
if (res && res.code === 0) this.$message.success('验证码已发送，请注意查收') if (res && res.code === 0) this.$message.success('验证码已发送，请注意查收')
else this.$message.error('获取验证码失败，请稍后再试') else this.$message.error('获取验证码失败，请稍后再试')
...@@ -172,7 +170,6 @@ export default { ...@@ -172,7 +170,6 @@ export default {
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
checkCode(checkCodeParam).then(res => { checkCode(checkCodeParam).then(res => {
console.log(res)
if (res && res.code === 0) { if (res && res.code === 0) {
res.type = 'checkcode' res.type = 'checkcode'
resolve({ resolve({
......
modules/letter/index.vue
浏览文件 @ 45940ef6
...@@ -103,7 +103,6 @@ export default { ...@@ -103,7 +103,6 @@ export default {
// 提交推荐信 // 提交推荐信
handleAddRequest() { handleAddRequest() {
api.addLetter(this.userId, this.letterId, this.ruleForm).then(response => { api.addLetter(this.userId, this.letterId, this.ruleForm).then(response => {
console.log(response)
const { error, message } = response const { error, message } = response
if (error.toString() === '0') { if (error.toString() === '0') {
this.dialogVisible = true this.dialogVisible = true
......
modules/my/account/password.vue
浏览文件 @ 45940ef6
...@@ -95,7 +95,6 @@ export default { ...@@ -95,7 +95,6 @@ export default {
api api
.sendCode({ account: this.ruleForm.account }) .sendCode({ account: this.ruleForm.account })
.then(response => { .then(response => {
console.log(response)
if (response.code === 0) { if (response.code === 0) {
this.$message({ type: 'success', message: '验证码已发送' }) this.$message({ type: 'success', message: '验证码已发送' })
} else { } else {
......
pages/about/course.vue
浏览文件 @ 45940ef6
...@@ -170,7 +170,6 @@ export default { ...@@ -170,7 +170,6 @@ export default {
} }
}, },
mounted() { mounted() {
console.log(this.$route)
} }
} }
</script> </script>
......
pages/about/teacher.vue
浏览文件 @ 45940ef6
...@@ -121,7 +121,6 @@ export default { ...@@ -121,7 +121,6 @@ export default {
} }
}, },
mounted() { mounted() {
console.log(this.$route)
} }
} }
</script> </script>
......
pages/alumni/outstanding.vue
浏览文件 @ 45940ef6
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="alumni"> <div class="alumni">
<h5>KELLEY商学院杰出校友</h5> <h5>KELLEY商学院杰出校友</h5>
<ul class="card-list"> <ul class="card-list">
<li v-for="item in alumniList" :key="item.name"> <li v-for="(item, index) in alumniList" :key="index">
<div class="avatar"> <div class="avatar">
<img :src="item.avatar" /> <img :src="item.avatar" />
</div> </div>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论