提交 3f6e4992 authored 作者: 王鹏飞's avatar 王鹏飞

chore:内容优化

上级 50a15245
<template>
<div>
<div class="ranking-content-box" v-if="!isMobile">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="ranking-content-box">
<div class="title">
<div class="line"></div>
<div class="name">学校排名</div>
<div class="name">{{ $t('home.ranking.title') }}</div>
<div class="line"></div>
</div>
<ul class="content-mian">
<li v-for="(item, index) in rankingList" :key="index">
<div class="img">
<img :src="item.url" />
<div class="content-mian">
<div class="li">
<div class="item">
<div class="tit"><span>No.</span>1</div>
<div class="p" v-html="$t('home.ranking.item1Txt1')"></div>
</div>
<h5><span>No.</span>{{ item.rank }}</h5>
<p>{{ item.text }}</p>
</li>
</ul>
<div class="item">
<div class="p" v-html="$t('home.ranking.item1Txt2')"></div>
</div>
</div>
<div class="li">
<div class="item">
<div class="p" v-html="$t('home.ranking.item2Txt2')"></div>
</div>
</div>
<div class="li">
<div class="item">
<div class="tit"><span>No.</span>8</div>
<div class="p" v-html="$t('home.ranking.item3Txt1')"></div>
</div>
<div class="item">
<div class="p" v-html="$t('home.ranking.item3Txt2')"></div>
</div>
</div>
</div>
</div>
<img v-else src="https://webapp-pub.ezijing.com/project/seg-shms/h5-ranking.png" class="ranking-img" />
</div>
<!-- https://webapp-pub.ezijing.com/project/seg-shms/h5-ranking.png -->
</template>
<script>
export default {
name: 'schoolRanking',
data() {
return {
rankingList: [
{
url: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home-ranking-1.jpg',
rank: 1,
text: '2019国际卓越旅游和酒店管理教育中心综合排名'
},
{
url: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home-ranking-2.png',
rank: 4,
text: '2021 QS 世界大学酒店管理专业排名'
},
{
url: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home-ranking-2.png',
rank: 4,
text: '2021 QS 世界大学雇主声誉排名'
}
]
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
......@@ -52,72 +45,154 @@ export default {
}
</script>
<style lang="scss" scoped>
.ranking-img {
width: 100%;
display: block;
}
.ranking-content-box {
margin-top: 57px;
width: 100%;
height: 680px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/ranking-bg.png) center;
background-size: cover;
.title {
width: 996px;
display: flex;
margin: 0 auto;
justify-content: space-between;
align-items: center;
padding: 108px 0 100px;
.line {
width: 369px;
height: 1px;
background: #ffffff;
.is-pc {
.ranking-content-box {
margin-top: 57px;
width: 100%;
height: 680px;
background: url(https://webapp-pub.ezijing.com/project/kelley/home-ranking-bg.png) center;
background-size: cover;
.title {
width: 996px;
display: flex;
margin: 0 auto;
justify-content: space-between;
align-items: center;
padding: 108px 0 100px;
.line {
width: 369px;
height: 1px;
background: #ffffff;
}
.name {
font-size: 36px;
font-weight: bold;
line-height: 100%;
color: #ffffff;
}
}
.name {
font-size: 36px;
font-weight: bold;
line-height: 100%;
color: #ffffff;
.content-mian {
width: 1000px;
margin: 0 auto;
display: flex;
justify-content: space-between;
.li {
width: 250px;
display: flex;
flex-direction: column;
justify-content: flex-end;
&.mar-t {
transform: translateY(-35px);
.li-tit {
line-height: 34px;
transform: translateY(20px);
}
}
.li-tit {
text-align: center;
font-size: 30px;
line-height: 100%;
color: #fff;
}
.item {
height: 220px;
.tit {
padding-top: 46px;
font-size: 48px;
line-height: 100%;
color: #ffffff;
text-align: center;
margin-bottom: 15px;
line-height: 100%;
span {
font-size: 24px;
}
}
.p {
text-align: center;
font-size: 16px;
line-height: 30px;
color: #ffffff;
// margin-bottom: 11px;
}
}
}
}
}
.content-mian {
width: 1000px;
margin: 0 auto;
display: flex;
justify-content: space-between;
li {
width: 320px;
color: #fff;
text-align: center;
&:nth-child(1) {
.img {
img {
height: 117px;
object-fit: contain;
object-position: 60px 10px;
width: 100%;
}
.is-h5 {
.ranking-content-box {
margin-top: 0.2rem;
width: 100%;
min-height: 2.84rem;
background: url(https://webapp-pub.ezijing.com/project/kelley-h5/home-ranking-bg.png) center;
background-size: cover;
padding: 0 0.1rem;
box-sizing: border-box;
.title {
width: 3.41rem;
display: flex;
margin: 0 auto;
justify-content: space-between;
align-items: center;
padding: 0.27rem 0 0.26rem;
.line {
width: 1rem;
height: 0.01rem;
background: #ffffff;
}
.name {
font-size: 0.17rem;
font-weight: bold;
line-height: 0.33rem;
color: #ffffff;
}
}
.content-mian {
// width: 1000px;
// margin: 0 auto;
display: flex;
justify-content: space-between;
.li {
display: flex;
flex-direction: column;
justify-content: flex-end;
width: 1.05rem;
&.mar-t {
transform: translateY(-0.15rem);
.li-tit {
line-height: 0.15rem;
transform: translateY(0.1rem);
}
}
}
.img {
width: 100%;
background: #fff;
img {
width: 100%;
.li-tit {
text-align: center;
font-size: 0.13rem;
line-height: 100%;
color: #fff;
}
}
h5 {
padding: 30px 0 20px;
font-size: 32px;
span {
font-size: 16px;
.item {
.tit {
padding-top: 0.15rem;
font-size: 0.24rem;
color: #ffffff;
text-align: center;
margin-bottom: 0.03rem;
line-height: 100%;
span {
font-size: 0.12rem;
}
}
.p {
font-size: 0.1rem;
line-height: 0.16rem;
margin-bottom: 0.05rem;
color: #ffffff;
text-align: center;
}
}
}
p {
font-size: 12px;
}
}
}
}
</style>
\ No newline at end of file
</style>
......@@ -4,11 +4,11 @@
<template v-if="!searchVisible">
<div class="logo-box">
<nuxt-link to="/" class="logo">
<img src="http://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/static/ezijing/logo/ezijing-logo.svg" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/seg-shms-logo.png" />
<img src="https://webapp-pub.ezijing.com/project/caas/SEG_logo_Pantone.png" />
<img src="https://webapp-pub.ezijing.com/project/caas/caa-logo.png" />
</nuxt-link>
</div>
<div class="search" @click="toggleSearch"></div>
<!-- <div class="search" @click="toggleSearch"></div> -->
<div class="menu" :class="menuClasses" @click="toggleMenu"></div>
</template>
<div class="search-box" v-else>
......
......@@ -53,16 +53,16 @@ export default {
}
},
ranking: {
title: '学校排名',
title: '学校特色',
item1Tit: '印第安纳大学',
item2Tit: 'KELLEY 商学院',
item3Tit: 'KELLEY<br />在线金融硕士',
item1Txt1: '全球最佳研究生院排名<br />2018《美国新闻与世界报道》',
item1Txt2: '全美最佳商学院排名<br />2019《美国新闻与世界报道》',
item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校【QS排名】',
item1Txt2: '提供来自不同德语和法语的3个美丽校区',
item2Txt1: '在线硕士排名<br />2019《美国新闻与世界报道》',
item2Txt2: '学生满意度排名<br />2016《彭博商业周刊》',
item3Txt1: '在线MBA排名<br />2021《美国新闻与世界报道》',
item3Txt2: '最佳教授排名<br />2021《普林斯顿评论》'
item2Txt2: '来自64个不同国家的师生 ',
item3Txt1: '全球款待业与休闲管理院校<br/>【QS排名】',
item3Txt2: '90%校友成为款待业的管理层或在毕业五年内拥有自己的公司'
},
news: {
title: '最新动态'
......
......@@ -53,16 +53,16 @@ export default {
}
},
ranking: {
title: '学校排名',
title: '学校特色',
item1Tit: '印第安纳大学',
item2Tit: 'KELLEY 商学院',
item3Tit: 'KELLEY<br />在线金融硕士',
item1Txt1: '全球最佳研究生院排名<br />2018《美国新闻与世界报道》',
item1Txt2: '全美最佳商学院排名<br />2019《美国新闻与世界报道》',
item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校【QS排名】',
item1Txt2: '提供来自不同德语和法语的3个美丽校区',
item2Txt1: '在线硕士排名<br />2019《美国新闻与世界报道》',
item2Txt2: '学生满意度排名<br />2016《彭博商业周刊》',
item3Txt1: '在线MBA排名<br />2021《美国新闻与世界报道》',
item3Txt2: '最佳教授排名<br />2021《普林斯顿评论》'
item2Txt2: '来自64个不同国家的师生 ',
item3Txt1: '全球款待业与休闲管理院校<br/>【QS排名】',
item3Txt2: '90%校友成为款待业的管理层或在毕业五年内拥有自己的公司'
},
news: {
title: '最新动态'
......@@ -185,7 +185,7 @@ export default {
// 有关申请
apply: {
con1Tit: '申请条件',
con1Txt: '已获得专科或以上学位<br />(未达到专科学历但背景优秀者,可申请专硕连读',
con1Txt: '已获得专科或以上学位<br />(未达到专科学历但背景优秀者,可申请专硕连读',
con2Tit: '招生对象',
con2Txt: `餐饮连锁企业的高管<br />
餐饮企业的总经理及副总经理<br />
......@@ -208,16 +208,14 @@ export default {
problem: {
item1Tit: '申请和面试相关问题',
item1problem1: 'Q: 如何申请瑞士美食艺术管理大学(CAAS) MBA?大概流程是什么?',
item1answer1:
'A: 申请流程为:在线填写申请资料—初审通过—面试安排—综合评审—录取offer—学费缴纳及入学手续办理。',
item1answer1: 'A: 申请流程为:在线填写申请资料—初审通过—面试安排—综合评审—录取offer—学费缴纳及入学手续办理。',
item1problem2: 'Q: 面试多少人?录取多少人?率取比率是多少?',
item1answer2: 'A: 本项目采取现场/视频面试的方式,面试人数和录取人数视申请人数和申请资质而定。',
item1problem3: 'Q: 是否要求考生的工作经验必须属于酒店行业?',
item1answer3:
'A: 本项目对考生的行业背景无特殊要求。欢迎有志于从事餐饮行业或相关工作的考生报考。录取为综合考评,工作背景是综合考评时需要参考的一部分信息。',
item1problem4: 'Q: 英语一般可以申请吗?',
item1answer4:
'A: 建议强化英语学习,可尝试申请。面试阶段会涉及英文面试,视情况而定会安排翻译。',
item1answer4: 'A: 建议强化英语学习,可尝试申请。面试阶段会涉及英文面试,视情况而定会安排翻译。',
item1problem5: 'Q: 本项目是在职还是全职?上课安排是怎样的?',
item1answer5:
'A: 本项目为在职餐饮硕士项目,采用线上学习和线下面授相结合的学习方式。在线学习每周1-2次实时课程,面授采用周末或短期集中上课形式,中英双语授课。紫荆和CAAS双方共同负责教学内容。课程最后安排一次瑞士访学(往返交通费用自理),时间为两周左右。',
......@@ -233,7 +231,7 @@ export default {
},
// 杰出校友
outstanding: {
title1: '瑞士酒店管理大学杰出校友',
title1: '瑞士教育集团杰出校友',
title2: '紫荆-瑞士酒店管理大学优秀学生'
},
viewMore: '查看更多+',
......
......@@ -17,13 +17,13 @@
</div>
</div>
<div class="content-mod2" v-if="showIndex === 1">
<img src="https://webapp-pub.ezijing.com/project/seg-shms/project-intor-bg.jpg" class="main-banner" />
<img src="https://webapp-pub.ezijing.com/project/caas/project-intro_bg_caas_banner.png" class="main-banner" />
<div class="content-txt">
<div class="p" v-html="$t('bg.con2Txt')"></div>
</div>
</div>
<div class="content-mod2" v-if="showIndex === 2">
<img src="https://webapp-pub.ezijing.com/project/kelley/project-intro-bg-lhbx.png" class="main-banner" />
<img src="https://webapp-pub.ezijing.com/project/caas/project-intro_bg_lhbx_banner.png" class="main-banner" />
<div class="content-txt">
<div class="p" v-html="$t('bg.con3Txt')"></div>
</div>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论