提交 61a0b195 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 新增DBA菜单

上级 8f1bc7d6
...@@ -406,6 +406,17 @@ export default { ...@@ -406,6 +406,17 @@ export default {
// pathType: 1 // pathType: 1
// } // }
// ] // ]
},
{
name: 'DBA',
isShow: false,
children: [
{
name: '科创方向DBA',
path: 'https://ppai.ezijing.com/',
pathType: 1
}
]
} }
] ]
}, },
...@@ -497,8 +508,8 @@ export default { ...@@ -497,8 +508,8 @@ export default {
this.isEn = this.$cookies.get('lang') === 'en-US' this.isEn = this.$cookies.get('lang') === 'en-US'
this.$store.dispatch('checkLogin') this.$store.dispatch('checkLogin')
if (this.isEn) { if (this.isEn) {
this.navData.map((item) => { this.navData.map(item => {
item?.children?.map((it) => { item?.children?.map(it => {
if (it.isShowChild === false) { if (it.isShowChild === false) {
it.children = '' it.children = ''
} }
...@@ -556,9 +567,9 @@ export default { ...@@ -556,9 +567,9 @@ export default {
} }
}, },
navLeave() { navLeave() {
this.navData.map((item) => { this.navData.map(item => {
if (item.children) { if (item.children) {
item.children.map((cItem) => { item.children.map(cItem => {
cItem.isShow = false cItem.isShow = false
}) })
} }
...@@ -576,14 +587,14 @@ export default { ...@@ -576,14 +587,14 @@ export default {
}, },
computed: { computed: {
getNameActive() { getNameActive() {
return (item) => { return item => {
const currentPath = this.$route.path const currentPath = this.$route.path
if (currentPath.includes(item.path)) { if (currentPath.includes(item.path)) {
return 'name active' return 'name active'
} else { } else {
let className = 'name' let className = 'name'
if (item.children) { if (item.children) {
item.children.map((cData) => { item.children.map(cData => {
cData.path === currentPath && (className = 'name active') cData.path === currentPath && (className = 'name active')
}) })
} }
......
<template> <template>
<AppCard :title="title" style="margin-top:50px;"> <AppCard :title="title" style="margin-top: 50px">
<template #header-aside><nuxt-link :to="baseUrl" v-if="baseUrl">查看更多+</nuxt-link></template> <template #header-aside><nuxt-link :to="baseUrl" v-if="baseUrl">查看更多+</nuxt-link></template>
<div class="project-list"> <div :class="className ? className : 'project-list'">
<div class="project-item" v-for="(item, index) in list" :key="index"> <div class="project-item" v-for="(item, index) in list" :key="index">
<!-- <AppLink :data="item"><img :src="item.imgUrl"/></AppLink> --> <!-- <AppLink :data="item"><img :src="item.imgUrl"/></AppLink> -->
<div <div
class="project-item-pic" class="project-item-pic"
:style=" :style="isEn ? `background:url(${item.imgUrlEn}) no-repeat center / 100% 100%;` : `background:url(${item.imgUrl}) no-repeat center / 100% 100%; `">
isEn
? `background:url(${item.imgUrlEn}) no-repeat center / 100% 100%;`
: `background:url(${item.imgUrl}) no-repeat center / 100% 100%; `
"
>
<!-- <img :src="item.imgUrl" /> --> <!-- <img :src="item.imgUrl" /> -->
<ul class="tools"> <ul class="tools">
<li @click="handleSubmit(item)">{{ isEn ? 'Register' : '我要报名' }}</li> <li @click="handleSubmit(item)">{{ isEn ? 'Register' : '我要报名' }}</li>
...@@ -37,7 +32,7 @@ import AppLink from '@/components/Link.vue' ...@@ -37,7 +32,7 @@ import AppLink from '@/components/Link.vue'
export default { export default {
name: 'ProjectCard', name: 'ProjectCard',
props: { list: { type: Array, default: () => [] }, title: String, baseUrl: String }, props: { list: { type: Array, default: () => [] }, title: String, baseUrl: String, className: String },
components: { AppCard, AppLink }, components: { AppCard, AppLink },
data() { data() {
return { return {
...@@ -66,49 +61,96 @@ export default { ...@@ -66,49 +61,96 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.project-list { .project-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
row-gap: 20px;
column-gap: 20px;
.project-item {
background-color: #fff;
.project-item-pic {
height: 360px;
overflow: hidden;
position: relative;
}
img {
width: 100%;
}
&:hover {
box-shadow: 0px 3px 24px rgba(0, 0, 0, 0.3);
}
.tools {
position: absolute;
bottom: 20px;
left: 0;
display: flex;
justify-content: center;
width: 100%;
li {
flex: 1;
font-size: 16px;
font-weight: 400;
color: #4d4d4d;
text-align: center;
cursor: pointer;
// &:hover {
// font-weight: 500;
// color: #333333;
// }
}
li:first-child {
color: #af1c40;
}
li + li {
border-left: 1px solid #c9c9c9;
}
}
}
}
.project-list2 {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
row-gap: 37px; row-gap: 37px;
column-gap: 37px; column-gap: 37px;
} .project-item {
.project-item { background-color: #fff;
background-color: #fff; .project-item-pic {
.project-item-pic { height: 230px;
height: 230px; overflow: hidden;
overflow: hidden; position: relative;
position: relative;
}
img {
width: 100%;
}
&:hover {
box-shadow: 0px 3px 24px rgba(0, 0, 0, 0.3);
}
.tools {
position: absolute;
bottom: 15px;
right: 0;
display: flex;
justify-content: center;
width: 350px;
li {
flex: 1;
font-size: 16px;
font-weight: 400;
color: #4d4d4d;
text-align: center;
cursor: pointer;
// &:hover {
// font-weight: 500;
// color: #333333;
// }
} }
li:first-child { img {
color: #af1c40; width: 100%;
} }
li + li { &:hover {
border-left: 1px solid #c9c9c9; box-shadow: 0px 3px 24px rgba(0, 0, 0, 0.3);
}
.tools {
position: absolute;
bottom: 15px;
right: 0;
display: flex;
justify-content: center;
width: 350px;
li {
flex: 1;
font-size: 16px;
font-weight: 400;
color: #4d4d4d;
text-align: center;
cursor: pointer;
// &:hover {
// font-weight: 500;
// color: #333333;
// }
}
li:first-child {
color: #af1c40;
}
li + li {
border-left: 1px solid #c9c9c9;
}
} }
} }
} }
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
</div> </div>
<FormSubmit :type="2" id="form" ref="formSubmit"></FormSubmit> <FormSubmit :type="2" id="form" ref="formSubmit"></FormSubmit>
<div class="w1200"> <div class="w1200">
<ProjectCard :title="isEn ? 'Popular Programs' : '热门专业'" :list="projectList"></ProjectCard> <ProjectCard className="project-list2" :title="isEn ? 'Popular Programs' : '热门专业'" :list="projectList"></ProjectCard>
<!-- <div class="why"> <!-- <div class="why">
<h1 class="why-title">为什么选择紫荆教育的国际留学课程?</h1> <h1 class="why-title">为什么选择紫荆教育的国际留学课程?</h1>
<div class="why-list"> <div class="why-list">
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论