提交 38abaf15 authored 作者: 王鹏飞's avatar 王鹏飞

update

上级 28cc719e
* {
margin: 0;
padding: 0;
}
body {
font-family: Source Han Sans CN;
font-size: 14px;
color: #424242;
background-color: #f9f8f8;
}
a {
color: currentColor;
text-decoration: none;
}
.main-layout {
max-width: 750px;
margin: 0 auto;
overflow: hidden;
}
.main-container {
margin: 0 0.15rem 0.3rem;
}
.main-banner {
display: block;
height: 1.2rem;
object-fit: cover;
}
.main-content .title {
padding: 0.3rem 0 0.1rem;
font-size: 0.14rem;
font-weight: 500;
color: #333;
}
.main-content p {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
}
......@@ -15,94 +15,39 @@ export default {
list: [
{
name: '关于紫荆',
path: '/about/introduce',
children: [
{
name: '紫荆简介',
path: '/about/introduce'
},
{
name: '文化理念',
path: '/about/culture'
},
{
name: '新闻中心',
path: '/about/news'
},
{
name: '联系我们',
path: '/about/contact'
}
{ name: '紫荆简介', path: '/about/introduce' },
{ name: '文化理念', path: '/about/culture' },
{ name: '新闻中心', path: '/about/news' },
{ name: '联系我们', path: '/about/contact' }
]
},
{
name: '学位教育',
children: [
{
name: '本科',
children: [
{
name: '海外留学SHMS',
path: '',
pathType: 3
}
]
},
{ name: '本科', children: [{ name: '海外留学SHMS', onClick: this.showTips }] },
{
name: '硕士',
children: [
{
name: '金融硕士MSF',
path: 'https://kelley.ezijing.com',
pathType: 1
},
{
name: '教育学硕士Med(早教-蒙台梭利)',
path: 'https://cu.ezijing.com',
pathType: 1
},
{
name: '应用心理学MAP',
path: 'https://ciis.ezijing.com',
pathType: 1
},
{
name: '未来金融领袖计划',
path: 'https://cfflp.ezijing.com',
pathType: 1
}
{ name: '金融硕士MSF', href: 'https://kelley.ezijing.com' },
{ name: '教育学硕士Med(早教-蒙台梭利)', href: 'https://cu.ezijing.com' },
{ name: '应用心理学MAP', href: 'https://ciis.ezijing.com' },
{ name: '未来金融领袖计划', href: 'https://cfflp.ezijing.com' }
]
},
{
name: 'MBA',
children: [
{
name: '通用MBA',
pathType: 3
},
{
name: '金融MBA',
path: 'https://sofia.ezijing.com',
pathType: 1
},
{
name: '酒店与旅游工商管理MBA',
path: 'https://shms.ezijing.com',
pathType: 1
}
{ name: '通用MBA', onClick: this.showTips },
{ name: '金融MBA', href: 'https://sofia.ezijing.com' },
{ name: '酒店与旅游工商管理MBA', href: 'https://shms.ezijing.com' }
]
},
{
name: '博士',
children: [
{
name: '心理学博士DBA(即将推出)',
pathType: 3
},
{
name: '工商管理学博士EDD(即将推出)',
pathType: 3
}
{ name: '心理学博士DBA(即将推出)', onClick: this.showTips },
{ name: '工商管理学博士EDD(即将推出)', onClick: this.showTips }
]
}
]
......@@ -113,75 +58,41 @@ export default {
{
name: '1+x',
children: [
{
name: '金融产品数字化营销证书',
path: 'http://x.ezijing.com',
pathType: 1
},
{
name: '数字金融客户服务证书',
pathType: 3
},
{
name: '酒店及旅游业的数字化营销证书',
pathType: 3
},
{
name: '青少年儿童心理以及行为指导证书',
pathType: 3
}
{ name: '金融产品数字化营销证书', href: 'https://x.ezijing.com' },
{ name: '数字金融客户服务证书', onClick: this.showTips },
{ name: '酒店及旅游业的数字化营销证书', onClick: this.showTips },
{ name: '青少年儿童心理以及行为指导证书', onClick: this.showTips }
]
},
{
name: '专业共建',
pathType: 3
},
{
name: '校企合作',
pathType: 3
},
{
name: '产业学院',
pathType: 3
},
{
name: '双高建设',
pathType: 3
},
{ name: '专业共建', onClick: this.showTips },
{ name: '校企合作', onClick: this.showTips },
{ name: '产业学院', onClick: this.showTips },
{ name: '双高建设', onClick: this.showTips },
{
name: '在线教育解决方案',
children: [
{
name: '产品技术',
pathType: 3
},
{
name: '技术支持',
pathType: 3
},
{
name: '联合运营',
pathType: 3
}
{ name: '产品技术', onClick: this.showTips },
{ name: '技术支持', onClick: this.showTips },
{ name: '联合运营', onClick: this.showTips }
]
}
]
},
{
name: '校友会',
path: '/alumnus',
children: [
{
name: '校友会',
path: '/alumnus'
}
{ name: '校友会', path: '/alumnus' },
{ name: '校友风采', path: '/alumnus' }
]
},
{
name: '我要报名'
}
{ name: '我要报名' }
]
}
},
methods: {
showTips() {
this.$notify({ type: 'primary', message: '暂未开通,尽请期待' })
}
}
}
</script>
......
<template>
<nav>
<ul class="app-tab-nav">
<li v-for="(item, index) in list" :key="index" :class="{ 'is-active': item.value === active }">
<nuxt-link :to="item.path">{{ item.name }}</nuxt-link>
</li>
</ul>
</nav>
</template>
<script>
export default {
props: { list: { type: Array, default: () => [] }, active: { type: String } },
data() {
return {}
}
}
</script>
<style lang="scss">
.app-tab-nav {
display: flex;
li {
margin-left: 0.3rem;
font-size: 0.14rem;
line-height: 0.38rem;
color: #333;
&.is-active {
border-bottom: 0.02rem solid #aa1941;
}
}
}
</style>
......@@ -2,7 +2,21 @@
<li class="tree-item">
<div class="cell" :class="{ bold: isFolder }" @click="toggle">
<div class="cell-title">
{{ item.name }}
<!-- 站内跳转 -->
<template v-if="item.path">
<nuxt-link :to="item.path">
{{ item.name }}
</nuxt-link>
</template>
<!-- 外部链接跳转 -->
<template v-else-if="item.href">
<a :href="item.href" target="_blank">{{ item.name }}</a>
</template>
<!-- 事件 -->
<template v-else-if="item.onClick">
<div @click="item.onClick">{{ item.name }}</div>
</template>
<template v-else>{{ item.name }}</template>
</div>
<div class="cell-icon" v-if="isFolder">
<van-icon name="arrow-up" v-if="isOpen" />
......@@ -54,6 +68,10 @@ export default {
font-size: 0.13rem;
font-weight: 400;
color: #333;
a {
display: block;
line-height: 0.52rem;
}
}
.cell-icon {
font-size: 0.14rem;
......
<template>
<div class="news-item">
<div class="news-item-pic"></div>
<div class="news-item-content">
<div class="news-item-content__date"></div>
<div class="news-item-content__title"></div>
</div>
</div>
</template>
<script>
export default {
props: { item: { type: Object } },
methods: {}
}
</script>
<style lang="scss">
.news-item {
background-color: #fff;
}
.news-item-pic {
height: 2.99rem;
}
</style>
<template>
<tab-nav :list="list" v-bind="$attrs"></tab-nav>
</template>
<script>
import TabNav from '@/components/TabNav'
export default {
components: { TabNav },
data() {
return {
list: [
{ name: '紫荆简介', path: '/about/introduce', value: '1' },
{ name: '文化理念', path: '/about/culture', value: '2' },
{ name: '新闻中心', path: '/about/news', value: '3' },
{ name: '联系我们', path: '/about/contact', value: '4' }
]
}
}
}
</script>
<style>
</style>
......@@ -13,24 +13,3 @@ export default {
components: { AppHeader, AppFooter }
}
</script>
<style>
* {
margin: 0;
padding: 0;
}
body {
font-size: 14px;
color: #424242;
background-color: #f9f8f8;
}
.main-layout {
max-width: 750px;
margin: 0 auto;
overflow: hidden;
}
a {
color: currentColor;
text-decoration: none;
}
</style>
<template>
<div class="main-container">
<h1 v-if="error.statusCode === 404">Page not found</h1>
<h1 v-else>An error occurred</h1>
<NuxtLink to="/">返回首页</NuxtLink>
</div>
</template>
<script>
export default {
props: ['error'],
layout: 'error',
middleware: [
function ({ redirect }) {
return redirect(301, '/el?e=rnf')
}
]
}
</script>
......@@ -37,7 +37,7 @@ export default {
},
// Global CSS: https://go.nuxtjs.dev/config-css
css: ['vant/lib/index.css'],
css: ['vant/lib/index.css', '@/assets/css/base.css'],
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: ['@/plugins/vant'],
......
<template>
<div>
<tab-nav active="4"></tab-nav>
<div class="main-container">
<div class="main-content">
<h1 class="title">联系我们</h1>
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址:北京市海淀区中关村东路1号院7号楼5层</p>
<p>联系电话:010-62793299</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:service@ezijing.com</p>
</div>
<div class="main-content">
<h1 class="title">关注我们</h1>
<ul class="follow">
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/5c4a58f1d41f786e7713a5a84069404d.png" />
<div class="name">紫荆企业微信</div>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/b4de41c51c1a897ee4bca574d7bf0d50.png" />
<div class="name">紫荆官方微博</div>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/85fb47e859d152f1021bc6b94154ce91.png" />
<div class="name">紫荆官方抖音</div>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/e2ffbf6b9d7fd6fd66d2487e7c33540c.png" />
<div class="name">紫荆小鹅通</div>
</li>
</ul>
</div>
</div>
</div>
</template>
<script>
import TabNav from '@/components/about/TabNav'
export default {
props: { acitve: String },
components: { TabNav }
}
</script>
<style lang="scss" scoped>
.follow {
display: flex;
justify-content: space-between;
li {
width: 0.65rem;
img {
display: block;
width: 100%;
}
.name {
margin-top: 0.09rem;
font-size: 0.1rem;
text-align: center;
color: #666;
}
}
}
</style>
<template>
<div>
<tab-nav active="2"></tab-nav>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/h5/images/about_banner_02.png" class="main-banner" />
<div class="video">
<video
src="https://zws-imgs-pub.ezijing.com/static/public/630810d0c5276d1195325d88d40a0034.mp4"
preload="auto"
controls
></video>
</div>
<div class="main-container">
<div class="main-content">
<h1 class="title">企业荣誉</h1>
<ul class="honor">
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/9f22659632f43c0b1bb93d6adf49bd4c.png" />
<p>2015年<br />将五道口金融学院在线教育中心商业化成立清控紫荆教育</p>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/48b2ab5dfc414d3f6c8500e8328f6b28.png" />
<p>2015年9月<br />签约索菲亚大学推出在线MBA学位项目</p>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/a37b13b8fa98ee448850bbb32a5fcd2f.png" />
<p>行业技术优秀服务商<br />——在线教育资讯网</p>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/00cdb23e91efa803bb711058e251e962.png" />
<p>综合实力突出教育集团<br />——中国教育网</p>
</li>
<li>
<img src="https://zws-imgs-pub.ezijing.com/static/public/5fdb3a042efcb0f8fb0eea8d4376eacc.png" />
<p>年度城市教育行业影响力机构<br />——巨量引擎</p>
</li>
</ul>
</div>
</div>
</div>
</template>
<script>
import TabNav from '@/components/about/TabNav'
export default {
props: { acitve: String },
components: { TabNav }
}
</script>
<style lang="scss" scoped>
.video {
background: #aa1941;
padding: 0.2rem 0.15rem;
video {
width: 100%;
height: 1.94rem;
}
}
.honor {
display: flex;
flex-wrap: wrap;
margin-top: 0.2rem;
li {
margin-bottom: 0.3rem;
padding: 0 0.12rem;
width: 50%;
box-sizing: border-box;
img {
width: 100%;
}
p {
font-size: 0.1rem;
line-height: 0.2rem;
}
}
}
</style>
<template>
<div>
<tab-nav active="1"></tab-nav>
<img
src="https://zws-imgs-pub.ezijing.com/static/public/e9de7416bef8822d5557afdfcda69f8a.png"
class="main-banner"
/>
<div class="main-container">
<div class="main-content">
<h1 class="title">紫荆简介</h1>
<p>
紫荆教育全称是清控紫荆(北京)教育科技股份有限公司,由清华控股有限公司于2015年以清华大学五道口金融学院相关知识产权创设而成。“紫荆”二字取自清华大学校花“紫荆花”,寓意“自强不息,向美而行”。
</p>
<p>
紫荆教育以教育为本、以科技赋能、以专业化为基础,以国际化为目标,提供高端国际学位教育、职业教育和在线教育解决方案,为我国培养高质量的国际化人才和产业人才。
</p>
</div>
<div class="total">
<ul>
<li>
<p class="t1"><span>12</span></p>
<p class="t2">国际合作院校</p>
</li>
<li>
<p class="t1"><span>522</span></p>
<p class="t2">线上课程</p>
</li>
</ul>
<ul>
<li>
<p class="t1"><span>600</span>+</p>
<p class="t2">金融机构/协会/政府/学校</p>
</li>
<li>
<p class="t1"><span>700</span>+</p>
<p class="t2">国内外师资团队</p>
</li>
</ul>
<ul>
<li>
<p class="t1"><span>5000</span>+</p>
<p class="t2">学位学员</p>
</li>
<li>
<p class="t1"><span>500万</span>+</p>
<p class="t2">人次学习</p>
</li>
</ul>
<ul>
<li>
<p class="t1"><span>1000</span>+</p>
<p class="t2">学术直播课</p>
</li>
<li>
<p class="t1"><span>4800</span>+</p>
<p class="t2">总研发课时</p>
</li>
</ul>
</div>
<div class="tabs">
<ul class="tab-nav">
<li :class="{ 'is-active': indexActive === 0 }" @click="changeIndex(0)">
<p class="t1">专业化</p>
<p class="t2">长期思维&nbsp;&nbsp;严谨治学</p>
</li>
<li :class="{ 'is-active': indexActive === 1 }" @click="changeIndex(1)">
<p class="t1">科技化</p>
<p class="t2">源自清华&nbsp;&nbsp;持续投入</p>
</li>
<li :class="{ 'is-active': indexActive === 2 }" @click="changeIndex(2)">
<p class="t1">国际化</p>
<p class="t2">放眼全球&nbsp;&nbsp;国际合作</p>
</li>
</ul>
<div class="tab-content" v-show="indexActive === 0">
<span>8</span>年深耕教育产业,完善的教学管理体系和内控体系; <br />
<span>12</span>所国际合作大学,<span>16</span>个国际学位项目,互认学分; <br />
<span>600+</span>金融机构政府、协会等合作单位; <br />
<span>50+</span>课程研发人员,<span>700+</span>师资团队,<span>4800+</span>总研发课时。
</div>
<div class="tab-content" v-show="indexActive === 1">
源自清华 持续投入 <span>50+</span>技术研发团队,<br /><span>1亿+</span>累计研发投入;<br />
<span>500万+</span>总学习人次,<span>24</span>小时在线;<br />
<span>1000+</span>次直播,<span>10000+</span>题库,<br />
大数据智能学习分析、作业评判、智能化营销数据分配。
</div>
<div class="tab-content" v-show="indexActive === 2">
<span>WSCUC、AACSB、EQUIS…</span>认证<br />
<span>30</span>余位哈佛、清华、哥伦比亚等国际一流大学人才组成的国际化团队;<br />
<span>40%</span>员工有研究生学历<br />
<span>5</span
>大洲<span>16</span>个国家/地区国际校友网络<br />覆盖全国<span>380+</span>省、市、自治区及行政特区
</div>
</div>
</div>
</div>
</template>
<script>
import TabNav from '@/components/about/TabNav'
export default {
components: { TabNav },
data() {
return {
indexActive: 0
}
},
methods: {
changeIndex(n) {
this.indexActive = n
}
}
}
</script>
<style lang="scss" scoped>
.total {
padding-top: 0.3rem;
ul {
display: flex;
li {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
height: 0.48rem;
margin-bottom: 0.2rem;
.t1 {
font-size: 0.16rem;
font-weight: 500;
color: #aa1941;
span {
font-size: 0.23rem;
}
}
.t2 {
font-size: 0.11rem;
color: #666;
}
&:first-child {
padding-right: 0.3rem;
text-align: right;
}
&:last-child {
padding-left: 0.3rem;
text-align: left;
}
}
li + li {
border-left: 1px solid #c3c3c3;
}
}
}
.tabs {
margin-top: 0.3rem;
.tab-nav {
display: flex;
li {
position: relative;
flex: 1;
height: 0.75rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
background: #fbfbfb;
cursor: pointer;
&.is-active {
background: #fff;
border-top: 0.04rem solid #aa1941;
box-shadow: 0px 1px 13px rgba(0, 0, 0, 0.06);
&::after {
content: '';
position: absolute;
left: 50%;
bottom: -0.2rem;
width: 0;
height: 0;
border-left: 0.1rem solid transparent;
border-right: 0.1rem solid transparent;
border-bottom: 0.1rem solid #fff;
transform: translateX(-50%);
z-index: 1;
}
}
.t1 {
font-size: 0.13rem;
font-weight: 500;
color: #aa1941;
text-align: center;
}
.t2 {
margin-top: 0.1rem;
font-size: 0.1rem;
color: #424242;
text-align: center;
}
}
li + li {
margin-left: 0.07rem;
}
}
.tab-content {
position: relative;
padding: 0.24rem;
margin-top: 0.2rem;
font-size: 0.12rem;
line-height: 0.3rem;
color: #333;
background: #fff;
box-shadow: 0px 1px 13px rgba(0, 0, 0, 0.06);
box-sizing: border-box;
span {
font-size: 0.2rem;
font-weight: bold;
color: #aa1941;
}
}
}
</style>
<template>
<div>
<tab-nav active="3"></tab-nav>
<img
src="https://zws-imgs-pub.ezijing.com/static/public/a72ef577c9bae694c6bfc33e5bfc93af.png"
class="main-banner"
/>
</div>
</template>
<script>
import TabNav from '@/components/about/TabNav'
export default {
props: { acitve: String },
components: { TabNav }
}
</script>
<style>
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论