Skip to content

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

Merge branch 'kelley-h5' into shms

上级 19c5297d a5032218
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 2375 行增加 和 645 行删除
.DS_Store
浏览文件 @ 6fb0d7cd
No preview for this file type
.gitignore
浏览文件 @ 6fb0d7cd
......@@ -88,3 +88,4 @@ sw.*
# Vim swap files
*.swp
.DS_Store
api/index.js
浏览文件 @ 6fb0d7cd
......@@ -30,3 +30,24 @@ export function checkCode(params) {
export function postNes(data) {
return httpRequest.post('/api/enrollment/v1.0/applications', data)
}
/**
* 提交留咨信息
*/
export function submit(data) {
return httpRequest.post('/api/enrollment/v1.0/applications', data)
}
/**
* 获取文章列表
*/
export function getArticleList(params) {
return httpRequest.get('/api/cms/api/v1/articles', { params })
}
/**
* 获取图文列表
*/
export function getImgTextList(params) {
return httpRequest.get('/api/cms/api/v1/img-text', { params })
}
app.html 0 → 100644
浏览文件 @ 6fb0d7cd
<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
<head>
{{ HEAD }}
<script>
;(function(win, doc) {
function resizeRoot() {
var wWidth =
screen.width > 0
? win.innerWidth >= screen.width || win.innerWidth == 0
? screen.width
: win.innerWidth
: win.innerWidth,
wFsize
wFsize = ((wWidth > 750 ? 750 : wWidth) / 375) * 100
doc.documentElement.style.fontSize = wFsize + 'px'
}
resizeRoot()
win.addEventListener('resize', resizeRoot, false)
})(window, document)
</script>
</head>
<body {{ BODY_ATTRS }}>
{{ APP }}
</body>
</html>
components/ArticleList.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="article-list">
<article-list-item v-for="(item, index) in dataList" :data="item" v-bind="$attrs" :key="index"></article-list-item>
<el-pagination
class="article-list-pagination"
layout="prev, pager, next"
:page-size="page.size"
:total="page.total"
:current-page.sync="page.currentPage"
@current-change="fetchList"
:hide-on-single-page="true"
>
</el-pagination>
</div>
</template>
<script>
import ArticleListItem from './ArticleListItem.vue'
export default {
name: 'ArticleList',
components: { ArticleListItem },
inheritAttrs: false,
props: {
remote: { type: Object, default: () => ({}) },
// 是否含有翻页
hasPagination: { type: Boolean, default: true },
// 每页多少条数据
limit: { type: Number, default: 20 }
},
data() {
return {
loading: false,
params: this.remote.params || {},
dataList: this.data,
page: { total: 0, size: this.limit, currentPage: 1 }
}
},
watch: {
'remote.params': {
immediate: true,
handler(data) {
this.params = data || {}
}
}
},
async fetch() {
await this.fetchList()
},
methods: {
fetchList() {
/**
* @param function httpRequest api接口
* @param function beforeRequest 接口请求之前
* @param function callback 接口请求成功回调
*/
const { httpRequest, beforeRequest, callback } = this.remote
if (!httpRequest) {
return
}
// 参数设置
let params = this.params
// 翻页参数设置
if (this.hasPagination) {
params.page = this.page.currentPage
params.limit = this.page.size
}
// 接口请求之前
if (beforeRequest) {
params = beforeRequest(params)
}
for (const key in params) {
if (params[key] === '' || params[key] === undefined || params[key] === undefined) {
delete params[key]
}
}
this.loading = true
return httpRequest(params)
.then(res => {
const { data = [], total = 0 } = res.data || {}
this.page.total = total
this.dataList = callback ? callback(data) : data
})
.catch(() => {
this.page.total = 0
this.dataList = []
})
.finally(() => {
this.loading = false
})
}
}
}
</script>
<style lang="scss">
.article-list-pagination {
padding: 20px;
text-align: center;
}
</style>
\ No newline at end of file
components/ArticleListItem.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="article-item">
<app-link :data="data" v-bind="$attrs">
<div class="article-item-inner">
<img :src="data.web_img_uri" class="article-item-pic" />
<div class="article-item-content">
<div class="article-item-content__date">{{ formatDate(data.start_time) }}</div>
<div class="article-item-content__title">{{ data.title }}</div>
<div class="article-item-content__text">{{ data.abstract }}</div>
</div>
</div>
</app-link>
</div>
</template>
<script>
import AppLink from '@/components/Link'
export default {
name: 'ArticleItem',
components: { AppLink },
inheritAttrs: false,
props: { data: { type: Object, required: true } },
methods: {
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
}
}
</script>
<style lang="scss">
.is-pc {
.article-item {
border-bottom: 1px solid #e6e6e6;
padding: 36px 0;
margin: 0 50px;
cursor: pointer;
}
.article-item-inner {
display: flex;
}
.article-item-pic {
width: 320px;
height: 210px;
object-fit: cover;
}
.article-item-content {
flex: 1;
overflow: hidden;
margin-left: 30px;
}
.article-item-content__date {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #aa1941;
padding-top: 13px;
}
.article-item-content__title {
font-size: 22px;
font-weight: bold;
line-height: 32px;
color: #141414;
margin-top: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.article-item-content__text {
font-size: 14px;
font-weight: 300;
line-height: 24px;
color: #666666;
margin-top: 15px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
}
.is-h5 {
.article-list-inner {
display: flex;
}
.article-item {
margin: 0.2rem;
background-color: #fff;
}
.article-item-pic {
display: block;
width: 100%;
// height: 2.99rem;
object-fit: cover;
}
.article-item-content {
padding: 0.18rem;
}
.article-item-content__date {
font-size: 0.1rem;
color: #aa1941;
line-height: 0.16rem;
}
.article-item-content__title {
margin-top: 0.1rem;
font-size: 0.14rem;
font-weight: 500;
color: #333;
line-height: 0.24rem;
}
.article-item-content__text {
margin-top: 0.2rem;
font-size: 0.1rem;
line-height: 0.2rem;
}
}
</style>
\ No newline at end of file
components/Card.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="card">
<div class="card-hd">
<div class="card-hd__title">{{ title }}</div>
<div class="card-hd__aside"><slot name="header-aside"></slot></div>
</div>
<div class="card-bd"><slot /></div>
</div>
</div>
</template>
<script>
export default {
props: { title: String },
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss">
.is-pc{
.card {
// margin: 0.2rem 0.15rem;
}
.card-hd {
display: flex;
align-items: center;
justify-content: space-between;
// margin-bottom: 0.15rem;
}
.card-hd__title {
flex: 1;
border-left: 7px solid #aa1941;
padding-left: 20px;
font-size: 32px;
font-weight: bold;
line-height: 1;
}
.card-hd__aside {
font-size: 16px;
color: #9b9b9b;
cursor: pointer;
}
.card-bd {
}
}
.is-h5{
.card {
margin: 0.2rem 0.15rem;
}
.card-hd {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.15rem;
}
.card-hd__title {
flex: 1;
border-left: 0.03rem solid #aa1941;
padding-left: 0.05rem;
font-size: 0.17rem;
font-weight: bold;
line-height: 1;
}
.card-hd__aside {
font-size: 0.1rem;
color: #9b9b9b;
}
.card-bd {
}
}
</style>
components/Link.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="link-content">
<template v-if="item.news">
<a
:target="item.news.data.uri !== '' ? '_blank' : '_self'"
:href="item.news.data.uri !== '' ? item.news.data.uri : `${item.news.path}/${item.news.data.id}`">
<slot />
</a>
</template>
<template v-else>
<nuxt-link
:to="item.path">
<slot />
</nuxt-link>
</template>
<div class="app-link">
<!-- 外部链接跳转 -->
<a :href="href" :target="target" v-if="href"><slot /></a>
<!-- 站内跳转 -->
<nuxt-link :to="path" v-else-if="path"><slot /></nuxt-link>
<!-- 事件 -->
<div v-else-if="data.onClick" @click="data.onClick"><slot /></div>
<template v-else><slot /></template>
</div>
</template>
<script>
export default {
props: { item: { type: Object } }
name: 'Link',
props: {
data: { type: Object, default: () => ({}) },
to: [String, Object, Function],
target: { type: String, default: '_blnak' }
},
computed: {
href() {
return this.data.href || this.data.uri
},
path() {
if (typeof this.to === 'function') {
return this.to(this.data)
}
return this.data.path || this.to
}
}
}
</script>
<style lang="scss" scoped>
.link-content{
height: 100%;
}
</style>
components/appFrame.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="frame-content-box">
<ul class="tab-content">
<li
v-for="(item, index) in data.slider"
:class="item.pathActive.findIndex(path => {
return $route.path.includes(path)
}) !== -1 && 'active'"
:key="index"
@click="goPage(item.path)"
>
{{ item.name }}
<div class="main-page">
<ul class="main-page-nav">
<li v-for="(item, index) in data.slider" :key="index" :class="{ 'is-active': isAcitve(item) }">
<nuxt-link :to="item.path">{{ item.name }}</nuxt-link>
</li>
</ul>
<div class="right-content">
<img v-if="data.banner" :src="data.banner" alt="" class="banner">
<div class="content-mian">
<div class="main-page-content">
<img v-if="data.banner" :src="data.banner" class="main-page-banner" />
<div class="main-content-html">
<slot></slot>
</div>
</div>
......@@ -24,75 +17,85 @@
export default {
name: 'appFrame',
props: {
data: {
type: Object
}
},
data() {
return {
}
},
mounted() {
data: { type: Object }
},
methods: {
goPage(path) {
this.$router.push({
path: path
})
isAcitve(item) {
return this.$route.fullPath.includes(item.path)
}
}
}
</script>
<style lang="scss" scoped>
.frame-content-box{
<style lang="scss">
.is-pc {
.main-page {
width: 1200px;
margin: 0 auto;
padding: 56px 0 100px;
display: flex;
justify-content: space-between;
.right-content{
width: 1000px;
.banner{
width: 100%;
display: block;
height: 320px;
}
.content-mian{
background: #fff;
}
}
.tab-content{
.main-page-nav {
width: 160px;
height: fit-content;
background: #fff;
padding-top: 35px;
padding-bottom: 43px;
li{
padding: 35px 0 44px;
margin-right: 40px;
align-self: flex-start;
li {
position: relative;
width: 100%;
height: 40px;
font-size: 22px;
line-height: 40px;
text-align: center;
color: #777777;
margin-bottom: 60px;
cursor: pointer;
&:last-child{
margin: 0;
}
&.active{
color: rgba(170, 25, 65, 1);
&::after{
&.is-active {
color: #aa1941;
&::after {
content: '';
width: 8px;
height: 40px;
background: rgba(170, 25, 65, 1);
background: #aa1941;
position: absolute;
top: 0;
left: 0;
}
}
}
li + li {
margin-top: 60px;
}
}
.main-page-content {
flex: 1;
background-color: #fff;
overflow: hidden;
}
.main-page-banner {
display: block;
height: 320px;
object-fit: cover;
}
}
.is-h5 {
.main-page-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;
}
}
}
.main-page-banner {
display: block;
height: 1.2rem;
object-fit: cover;
}
.main-page-content {
background-color: #fff;
}
}
</style>
\ No newline at end of file
components/base/h5/ApplyForm.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="app-apply-form">
<h2 class="title">报名咨询</h2>
<div class="form">
<div class="form-item">
<input type="text" class="form-input" placeholder="请输入您的姓名" v-model="ruleForm.name" />
</div>
<div class="form-item">
<input type="number" class="form-input" placeholder="请输入您的电话" maxlength="11" v-model="ruleForm.phone" />
</div>
<div class="form-item">
<select class="form-select" placeholder="请选择项目" v-model="ruleForm.project_id" disabled>
<option value="" disabled selected>请选择项目</option>
<option v-for="(item, index) in projectList" :value="item.value" :key="index">{{ item.label }}</option>
</select>
</div>
<div class="form-item">
<input type="text" class="form-input" placeholder="请输入短信验证码" maxlength="4" v-model="phoneCode" />
<input
type="button"
class="form-button"
:disabled="codeButtonDisabled"
:value="buttonText"
@click="onSendCode"
/>
</div>
<div class="form-item">
<input type="button" value="立即预约" class="form-button" @click="onSbumit" />
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api'
export default {
data() {
return {
ruleForm: { name: '', phone: '', project_id: '1001', channel: 19960 },
projectList: [
{ label: '金融工商管理硕士', value: '1000' },
{ label: '酒店及旅游业工商管理硕士', value: '1008' },
{ label: '金融硕士', value: '1001' },
{ label: '应用心理学硕士', value: '1006' },
{ label: '教育学硕士', value: '1005' },
{ label: '中国未来金融领袖计划', value: '1007' }
],
phoneCode: '',
codeButtonDisabled: false,
timer: null,
disabledTime: 60
}
},
computed: {
buttonText() {
return this.codeButtonDisabled ? `${this.disabledTime}秒后重发` : '获取验证码'
}
},
methods: {
onSbumit() {
if (!this.ruleForm.name) {
this.$notify('请输入您的姓名')
return
}
if (!this.ruleForm.phone || !/^1[3-9]\d{9}$/.test(this.ruleForm.phone)) {
this.$notify('请输入正确的手机号')
return
}
if (!this.phoneCode) {
this.$notify('请输入短信验证码')
return
}
this.checkPhoneCode().then(this.handleSubmit)
},
handleSubmit() {
api.submit(this.ruleForm).then(response => {
// this.$notify({ type: 'success', message: response.message })
this.$dialog.alert({ message: response.message }).then(() => {
this.$emit('success')
})
})
},
// 校验短信验证码
checkPhoneCode() {
return api.checkCode({ account: this.ruleForm.phone, code: this.phoneCode })
},
onSendCode() {
if (!this.ruleForm.phone || !/^1[3-9]\d{9}$/.test(this.ruleForm.phone)) {
this.$notify('请输入正确的手机号')
return
}
this.sendCode()
},
// 发送验证码
sendCode() {
this.setTimer()
api
.sendCode({ account: this.ruleForm.phone })
.then(() => {
this.$notify({ type: 'success', message: '验证码发送成功，注意查收' })
})
.catch(() => {
this.clearTimer()
})
},
setTimer() {
this.codeButtonDisabled = true
this.disabledTime = 60
this.timer = setInterval(() => {
this.disabledTime--
if (this.disabledTime <= 0) {
this.clearTimer()
}
}, 1000)
},
clearTimer() {
this.codeButtonDisabled = false
this.timer && clearInterval(this.timer)
}
},
destroyed() {
this.clearTimer()
}
}
</script>
<style lang="scss" scoped>
.app-apply-form {
min-width: 290px;
.title {
padding: 30px 0;
font-size: 20px;
color: #fff;
text-align: center;
}
}
.form-item {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.form-input {
padding: 0 10px;
width: 100%;
height: 38px;
background-color: #fff;
box-sizing: border-box;
border: none;
}
.form-select {
position: relative;
padding: 0 10px;
width: 100%;
height: 38px;
background: #fff url('https://webapp-pub.ezijing.com/www/h5/images/icon_arrows.png') no-repeat;
background-position: right 0.7em top 50%, 0 0;
background-size: 30px 30px;
box-sizing: border-box;
border: none;
}
.form-button {
padding: 0 10px;
width: 100%;
height: 38px;
font-size: 16px;
color: #aa1941;
background-color: #ffd61b;
box-sizing: border-box;
border: none;
cursor: pointer;
}
.form-input + .form-button {
margin-left: 10px;
}
</style>
components/base/h5/Card.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="card">
<div class="card-hd">
<div class="card-hd__title">{{ title }}</div>
<div class="card-hd__aside"><slot name="header-aside"></slot></div>
</div>
<div class="card-bd"><slot /></div>
</div>
</template>
<script>
export default {
props: { title: String }
}
</script>
<style lang="scss">
.card {
margin: 0.2rem 0.15rem;
}
.card-hd {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.15rem;
}
.card-hd__title {
flex: 1;
border-left: 0.03rem solid #aa1941;
padding-left: 0.05rem;
font-size: 0.17rem;
font-weight: bold;
line-height: 1;
}
.card-hd__aside {
font-size: 0.1rem;
color: #9b9b9b;
}
.card-bd {
}
</style>
components/base/h5/Menu.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<nav class="app-menu">
<ul>
<tree-item :item="item" v-for="(item, index) in list" :key="index" class="first"></tree-item>
</ul>
</nav>
</template>
<script>
import TreeItem from './TreeItem'
export default {
components: { TreeItem },
data() {
return {
list: [
{
name: '项目介绍',
children: [
{ name: '项目背景', path: '/project-intro/bg' },
{ name: '项目特色', path: '/project-intro/charac' },
{ name: '证书授权', path: '/project-intro/certificate' }
]
},
{
name: '课程与师资',
children: [
{ name: '课程设置', path: '/about/course' },
{ name: '师资力量', path: '/about/teacher' }
]
},
{
name: '最新动态',
children: [
{ name: '热点新闻', path: '/news/hot' },
{ name: '教授采访', path: '/news/interview' }
]
},
{
name: '报名申请',
children: [
{ name: '有关申请', path: '/apply/relevant' },
{ name: '费用资助', path: '/apply/support' },
{ name: '常见问题', path: '/apply/problem' }
]
},
{
name: '校友风采',
children: [
{ name: '杰出校友', path: '/alumni/outstanding' },
{ name: '校友分享', path: '/alumni/share' }
]
},
{
name: '我要报名',
onClick: () => {
this.$emit('showApplyForm')
}
}
]
}
},
methods: {
showTips() {
this.$notify({ type: 'primary', message: '暂未开通，尽请期待' })
}
}
}
</script>
<style lang="scss">
.app-menu {
// position: fixed;
// left: 0;
// right: 0;
// top: 0.62rem;
// bottom: 0;
padding: 0 0.15rem;
min-height: 100vh;
background-color: #fff;
.first > .cell .cell-title {
font-size: 0.14rem;
font-weight: bold;
}
.first > .tree-item-group {
padding: 0;
}
}
</style>
components/base/h5/RightAside.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div>
<div class="rigth-aside">
<ul class="right-aside-btns">
<li @click="showApplyForm">
<img src="https://zws-imgs-pub.ezijing.com/static/public/d434fa0ffd77892273e63e6d694cff0a.png" />
<p>我要报名</p>
</li>
<li @click="showFollow">
<img src="https://zws-imgs-pub.ezijing.com/static/public/5526b83d7526b2742f6eba7151c367db.png" />
<p>关注我们</p>
</li>
</ul>
</div>
<!-- 我要报名 -->
<van-overlay :show="applyFormVisible" @click="hideApplyForm">
<div class="dialog-box" @click.stop>
<apply-form @success="hideApplyForm"></apply-form>
</div>
</van-overlay>
<!-- 关注我们 -->
<van-overlay :show="followVisible" @click="followVisible = false">
<div class="dialog-box" @click.stop>
<h2 class="title">关注我们</h2>
<div class="follow">
<img src="https://zws-imgs-pub.ezijing.com/static/public/d2d9945d598e81c3b58aff5ce927a78a.jpg" />
<p>扫码关注 了解更多</p>
</div>
</div>
</van-overlay>
</div>
</template>
<script>
import ApplyForm from './ApplyForm'
export default {
components: { ApplyForm },
data() {
return {
applyFormVisible: false,
followVisible: false
}
},
methods: {
// 我要报名
showApplyForm() {
this.applyFormVisible = true
},
hideApplyForm() {
this.applyFormVisible = false
},
// 关注我们
showFollow() {
this.followVisible = true
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .van-overlay {
z-index: 100;
}
.rigth-aside {
position: fixed;
top: 50%;
right: 16px;
z-index: 99;
transform: translateY(-50%);
.right-aside-btns {
box-shadow: 0 2px 4px 0 rgb(0 0 0 / 10%);
li {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 0.5rem;
height: 0.5rem;
font-size: 0.1rem;
color: #999;
background-color: #fff;
cursor: pointer;
img {
width: 0.23rem;
height: 0.23rem;
}
}
li + li {
border-top: 1px solid #999;
}
}
}
.dialog-box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin: 0 auto;
width: 345px;
height: 426px;
background: url('https://webapp-pub.ezijing.com/www/h5/images/dialog_bg.png') no-repeat;
background-size: cover;
.title {
padding: 30px 0;
font-size: 20px;
color: #fff;
text-align: center;
}
}
.follow {
img {
width: 182px;
height: 182px;
}
p {
margin-top: 20px;
font-size: 12px;
color: #fff;
text-align: center;
}
}
</style>
components/base/h5/Search.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="app-search">
<div class="hot-search">
<h2 class="hot-search__title">热门搜索</h2>
<ul class="hot-search__list">
<li v-for="(item, index) in hotList" :key="index">
<app-link :data="item">{{ item.name }}</app-link>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
data() {
return {
hotList: [
{ name: '1+x', href: 'https://x.ezijing.com' },
{ name: '金融', href: 'https://kelley.ezijing.com' },
{ name: 'MBA', href: 'https://sofia.ezijing.com' },
{ name: '心理学', href: 'https://ciis.ezijing.com' },
{ name: '新闻', path: '/about/news' }
]
}
}
}
</script>
<style lang="scss">
.app-search {
padding: 0 0.15rem;
min-height: 100vh;
background-color: #fff;
}
.hot-search {
}
.hot-search__title {
padding: 0.2rem 0;
font-size: 0.12rem;
font-weight: 400;
color: #333;
border-bottom: 1px solid #999;
}
.hot-search__list {
li {
font-size: 0.14rem;
color: #333;
font-weight: 500;
line-height: 0.52rem;
border-bottom: 1px solid #999;
}
a {
display: block;
}
}
</style>
components/base/h5/TabNav.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<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>
components/base/h5/TreeItem.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<li class="tree-item">
<div class="cell" :class="{ bold: isFolder }" @click="toggle">
<div class="cell-title">
<app-link :data="item">{{ item.name }}</app-link>
</div>
<div class="cell-icon" v-if="isFolder">
<van-icon name="arrow-up" v-if="isOpen" />
<van-icon name="arrow-down" v-else />
</div>
</div>
<ul v-show="isOpen" v-if="isFolder" class="tree-item-group">
<tree-item v-for="(child, index) in item.children" :key="index" :item="child"></tree-item>
</ul>
</li>
</template>
<script>
import TreeItem from './TreeItem'
import AppLink from '@/components/Link'
export default {
name: 'TreeItem',
props: { item: Object },
components: { TreeItem, AppLink },
data: function () {
return {
isOpen: false
}
},
computed: {
isFolder: function () {
return this.item.children && this.item.children.length
}
},
methods: {
toggle: function () {
if (this.isFolder) {
this.isOpen = !this.isOpen
}
}
}
}
</script>
<style lang="scss">
.tree-item {
.cell {
display: flex;
align-items: center;
height: 0.52rem;
border-bottom: 1px solid #999;
}
.cell-title {
flex: 1;
font-size: 0.13rem;
font-weight: 400;
color: #333;
a {
display: block;
line-height: 0.52rem;
}
}
.cell-icon {
font-size: 0.14rem;
}
.tree-item-group {
padding-left: 0.1rem;
}
}
</style>
components/home/banner.vue
浏览文件 @ 6fb0d7cd
......@@ -14,8 +14,10 @@
</div>
</div>
</div>
<template v-if="!isMobile">
<div class="prev-button"></div>
<div class="next-button"></div>
</template>
</div>
</template>
<script>
......@@ -45,6 +47,9 @@ export default {
computed: {
swiper() {
return this.$refs.mySwiper.swiper
},
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
......
components/home/commonProblem.vue
浏览文件 @ 6fb0d7cd
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="common-content-box">
<m-title :data="titleParams" class="m-title"/>
<card :title="$t('home.problem.title')">
<template #header-aside
><nuxt-link to="/apply/problem">{{ $t('viewMore') }}</nuxt-link></template
>
<div class="content-mian">
<app-link :item="{ path: '/news/hot' }">
<app-link to="/apply/problem">
<div class="list-box">
<ul>
<li>
<li v-for="(item, index) in problem.itemLeft" :key="index">
<div class="icon"></div>
<div class="text">瑞士酒店管理大学给本项目毕业生颁发的学位证书与在瑞士颁发的证书有何不同？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">本项目是上课形式是怎么样？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">本项目学制多久？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">能否顺利毕业拿到证书呢？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">本项目是在职还是全职？</div>
<div class="text">{{ item }}</div>
</li>
</ul>
<ul>
<li>
<div class="icon"></div>
<div class="text">如何申请瑞士酒店管理大学酒店及旅游方向MBA？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">大概流程是什么？</div>
</li>
<li>
<li v-for="(item, index) in problem.itemRight" :key="index">
<div class="icon"></div>
<div class="text">需要提交哪些材料？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">瑞士酒店管理大学酒店及旅游方向MBA的学费是多少？</div>
</li>
<li>
<div class="icon"></div>
<div class="text">学费可以分期吗？</div>
<div class="text">{{ item }}</div>
</li>
</ul>
</div>
</app-link>
<div class="msg-box">
<el-input
type="textarea"
placeholder="请输入内容"
v-model="textarea">
</el-input>
<el-input type="textarea" placeholder="请输入内容" v-model="textarea"> </el-input>
<div class="btn">在线留言</div>
</div>
</div>
</card>
</div>
</div>
</template>
<script>
import mTitle from '@/components/home/moduleTitle'
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'commonProblem',
components: {
mTitle,
Card,
AppLink
},
data () {
data() {
return {
titleParams: {
name: '常见问题',
more: {
path: '/apply/problem'
}
problem: {
itemLeft: [
'Kelley商学院毕业生颁发的学位证书与在美国颁发的证书有何不同？',
'本项目是上课形式是怎么样？',
'本项目学制多久？',
'能否顺利毕业拿到证书呢？',
'本项目是在职还是全职？'
],
itemRight: [
'如何申请Kelley商学院金融学硕士？',
'大概流程是什么？',
'需要提交哪些材料？',
'美国印第安纳大学Kelley商学院金融学硕士的学费是多少？',
'学费可以分期吗？'
]
},
textarea: ''
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.common-content-box{
.is-pc {
.common-content-box {
width: 1200px;
margin: 0 auto;
padding-top: 77px;
.content-mian{
.content-mian {
padding-top: 50px;
.msg-box{
.msg-box {
padding-top: 40px;
box-sizing: border-box;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
::v-deep{
.el-textarea__inner{
::v-deep {
.el-textarea__inner {
background: none;
resize:none;
resize: none;
}
}
.btn{
.btn {
width: 136px;
height: 36px;
background: #AA1941;
background: #aa1941;
opacity: 1;
border-radius: 4px;
font-size: 18px;
line-height: 36px;
text-align: center;
color: #FFFFFF;
color: #ffffff;
margin-left: 57px;
cursor: pointer;
}
}
.list-box{
.list-box {
display: flex;
justify-content: space-between;
ul{
&:nth-child(2){
ul {
&:nth-child(2) {
margin-left: 8px;
}
li{
li {
display: flex;
align-items: center;
width: 600px;
height: 25px;
margin-bottom: 10px;
cursor: pointer;
&:nth-child(even){
.text{
&:nth-child(even) {
.text {
background: none;
}
}
.icon{
.icon {
width: 7px;
height: 7px;
background: #AA1941;
background: #aa1941;
border-radius: 50%;
}
.text{
.text {
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
line-height: 25px;
color: #666666;
padding-left: 4px;
width: 570px;
background: rgba(153, 153, 153, .2);
background: rgba(153, 153, 153, 0.2);
margin-left: 15px;
}
}
}
}
}
}
}
.is-h5 {
.common-content-box {
.content-mian {
.msg-box {
padding-top: 0.2rem;
box-sizing: border-box;
::v-deep {
.el-textarea__inner {
background: none;
resize: none;
}
}
input {
height: 0.29rem;
border: 0.01rem solid rgba(153, 153, 153, 0.2);
margin-top: 0.05rem;
outline: none;
width: 100%;
background: none;
padding-left: 0.2rem;
box-sizing: border-box;
font-size: 0.1rem;
color: #999999;
}
.btn {
height: 0.24rem;
background: #aa1941;
font-size: 0.12rem;
text-align: center;
color: #ffffff;
margin-top: 0.1rem;
line-height: 0.24rem;
}
}
.list-box {
ul {
li {
display: flex;
align-items: center;
padding: 0.04rem 0 0.04rem 0;
&:nth-child(even) {
.text {
background: none;
}
}
.icon {
width: 0.04rem;
height: 0.04rem;
background: #aa1941;
border-radius: 50%;
}
.text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 0.12rem;
color: #666666;
padding-left: 0.02rem;
width: 100%;
background: rgba(153, 153, 153, 0.2);
margin-left: 0.07rem;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
components/home/moduleTitle.vue
浏览文件 @ 6fb0d7cd
......@@ -5,7 +5,7 @@
<div class="text">{{ data.name }}</div>
</div>
<div v-if="data.more" class="right-text" @click="$router.push({ path: data.more.path, query: data.more.query ? data.more.query : {} })">
查看更多+
{{ $t('viewMore') }}
</div>
</div>
</template>
......
components/home/news.vue
浏览文件 @ 6fb0d7cd
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="news-content-box">
<m-title :data="titleParams" />
<card :title="$t('home.news.title')">
<template #header-aside
><nuxt-link to="/news/hot">{{ $t('viewMore') }}</nuxt-link></template
>
<div class="content-box" v-if="Object.keys(listData.first).length">
<div class="news-left">
<app-link :item="{ news: { data: listData.first, path: '/news/hot' } }">
<app-link :data="listData.first" :to="`/news/hot/${listData.first.id}`">
<img :src="listData.first.web_img_uri" alt="" />
<div class="mantle-box">
<div class="tit">{{ listData.first.title }}</div>
<div class="tit" v-if="!isMobile">{{ listData.first.title }}</div>
<div class="con-txt">{{ listData.first.abstract }}</div>
</div>
</app-link>
</div>
<ul class="news-right">
<li v-for="(item, index) in listData.list" :key="index">
<app-link :item="{ news: { data: listData.first, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="news-r-title">{{ item.title }}</div>
<div class="del">{{ item.abstract }}</div>
......@@ -21,15 +25,17 @@
</li>
</ul>
</div>
</card>
</div>
</div>
</template>
<script>
import mTitle from '@/components/home/moduleTitle'
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'news',
components: {
mTitle,
Card,
AppLink
},
async fetch() {
......@@ -53,6 +59,9 @@ export default {
listData() {
const [first = {}, ...list] = this.data
return { first, list: list || [] }
},
isMobile() {
return this.$store.state.isMobile
}
},
methods: {
......@@ -65,7 +74,8 @@ export default {
}
</script>
<style lang="scss" scoped>
.news-content-box {
.is-pc {
.news-content-box {
width: 1200px;
margin: 0 auto;
padding-top: 65px;
......@@ -79,7 +89,7 @@ export default {
position: relative;
img {
width: 100%;
height: 100%;
height: 500px;
display: block;
}
.mantle-box {
......@@ -149,5 +159,72 @@ export default {
}
}
}
}
}
.is-h5 {
.news-content-box {
.content-box {
// height: 2.18rem;
position: relative;
img {
width: 100%;
height: 100%;
display: block;
}
.news-left {
position: relative;
}
.mantle-box {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background: rgba(8, 8, 8, 0.45);
padding-bottom: 0.14rem;
.con-txt {
font-size: 0.12rem;
font-weight: bold;
line-height: 0.17rem;
color: #ffffff;
padding: 0.14rem 0.32rem 0 0.19rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
}
}
.news-right {
li {
margin-top: 0.1rem;
padding: 0.13rem 0.14rem 0.11rem 0.12rem;
background: #fff;
.time {
font-size: 0.1rem;
line-height: 100%;
color: #ab0a3d;
}
.news-r-title {
font-size: 0.14rem;
color: #333333;
margin-top: 0.1rem;
line-height: 0.21rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.del {
font-size: 0.11rem;
line-height: 0.2rem;
color: #666666;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
}
}
}
}
</style>
components/home/openClass.vue
浏览文件 @ 6fb0d7cd
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<template v-if="!isMobile">
<div class="alumni-content max-width">
<m-title :data="titleParams" class="m-title" />
<card :title="$t('home.course.title')">
<div class="swiper-content" @mouseenter="swiperStop" @mouseleave="swiperStart">
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in listData" :key="index">
<app-link :item="{ news: { data: item, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" />
<div class="text">{{ item.title }}</div>
</app-link>
......@@ -13,26 +15,41 @@
</div>
</div>
</div>
</card>
</div>
</template>
<template v-else>
<card :title="$t('home.course.title')">
<van-swipe class="my-swipe" :loop="true" :autoplay="5000" :show-indicators="false">
<template v-for="(item, index) in listData">
<van-swipe-item :key="index">
<div class="case">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" class="case-pic" />
<p class="case-title">{{ item.title }}</p>
</app-link>
</div>
</van-swipe-item>
</template>
</van-swipe>
</card>
</template>
</div>
</template>
<script>
import mTitle from '@/components/home/moduleTitle'
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'openClass',
components: {
mTitle,
Card,
AppLink
},
data() {
const _this = this
return {
titleParams: {
name: '公开课'
},
isScale: false,
listData: [],
// 轮播图配置信息, 更多请参考 swiper.js 中文网，上面很详细。
swiperOption: {
observer: true,
observeParents: true,
......@@ -58,14 +75,13 @@ export default {
computed: {
swiper() {
return this.$refs.mySwiper.swiper
}
},
created() {},
mounted() {
if (document.documentElement.clientWidth < 1400) {
// this.isScale = true
isMobile() {
return this.$store.state.isMobile
}
},
created() {},
mounted() {},
methods: {
swiperStop() {
this.swiper.autoplay.stop()
......@@ -77,11 +93,12 @@ export default {
}
</script>
<style lang="scss" scoped>
.max-width {
.is-pc {
.max-width {
width: 1200px;
margin: 0 auto;
}
.alumni-content {
}
.alumni-content {
padding-top: 89px;
.title-content {
display: flex;
......@@ -143,8 +160,29 @@ export default {
margin-top: 0;
}
}
}
}
.scale {
transform: scale(0.85);
.is-h5 {
.case {
position: relative;
}
.case-pic {
display: block;
width: 100%;
height: 1.17rem;
object-fit: cover;
}
.case-title {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 0.24rem;
padding: 0 0.1rem;
font-size: 0.1rem;
line-height: 0.24rem;
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
}
}
</style>
components/home/presence.vue
浏览文件 @ 6fb0d7cd
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="presence-content-box">
<m-title :data="titleParams" class="m-title" />
<card :title="$t('home.presence.title')" class="card-style">
<template #header-aside>
<nuxt-link to="/alumni/sharing">{{ $t('viewMore') }}</nuxt-link>
</template>
</card>
<div class="content-mian">
<div class="banner-box" @mouseenter="swiperStop" @mouseleave="swiperStart">
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in listData" :key="index">
<app-link :item="{ news: { data: item, path: '/news/hot' } }">
<van-swipe class="my-swipe" :autoplay="5000" :vertical="true" indicator-color="white">
<template v-for="(item, index) in listData">
<van-swipe-item :key="index">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" />
</app-link>
</van-swipe-item>
</template>
</van-swipe>
<div class="form-box">
<div class="title-box">
<div class="bt" v-html="$t('home.presence.tips1')"></div>
<div class="tips">{{ $t('home.presence.tips2') }}</div>
</div>
</div>
<div class="swiper-pagination swiper-pagination-bullets"></div>
</div>
</div>
<div class="enroll-box">
<div class="left-content">
<div class="tit">提交申请<br />免费领取试听课程</div>
<div class="tips">温馨提示：仅本科及以上学历可报名</div>
</div>
<div class="right-content">
<div class="form">
<div class="li">
<el-select v-model="form.years" placeholder="请选择工作年限">
<el-select v-model="form.years" :placeholder="$t('home.presence.yearsholder')">
<el-option v-for="item in yearsOptions" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
<div class="li">
<el-select v-model="form.degree" placeholder="请选择学历/学位">
<el-select v-model="form.degree" :placeholder="$t('home.presence.degreeholder')">
<el-option v-for="item in degreeOptions" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
<div class="li">
<el-input v-model="form.name" placeholder="输入您的姓名"></el-input>
<el-input v-model="form.name" :placeholder="$t('home.presence.nameholder')"></el-input>
</div>
<div class="li">
<el-input v-model="form.phone" placeholder="输入您的手机号"></el-input>
<el-input v-model="form.phone" :placeholder="$t('home.presence.phoneholder')"></el-input>
</div>
<div class="btn" @click="submit">{{ $t('home.presence.formBtn') }}</div>
</div>
<div class="btn" @click="submit">立即提交</div>
</div>
</div>
</div>
......@@ -46,13 +49,13 @@
</template>
<script>
import mTitle from '@/components/home/moduleTitle'
import Card from '@/components/Card'
import AppLink from '@/components/Link'
import { postNes } from '@/api'
export default {
name: 'presence',
components: {
mTitle,
Card,
AppLink
},
data() {
......@@ -98,30 +101,16 @@ export default {
degree: '',
name: '',
phone: '',
// channel: 19960,
project_id: process.env.newProjectId
},
value: '',
titleParams: {
name: '师生风采',
name: this.$t('home.presence.title'),
more: {
path: '/alumni/sharing'
}
},
listData: [],
swiperOption: {
speed: 400,
// autoplay: true,
delay: 3000,
loop: true,
pagination: {
el: '.swiper-pagination',
clickable: true
},
direction: 'vertical',
height: 500
// autoHeight: true
}
listData: []
}
},
async fetch() {
......@@ -131,6 +120,9 @@ export default {
computed: {
swiper() {
return this.$refs.mySwiper.swiper
},
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
......@@ -173,7 +165,12 @@ export default {
</script>
<style lang="scss" scoped>
.presence-content-box {
.is-pc {
.card-style {
width: 1200px;
margin: 0 auto;
}
.presence-content-box {
padding-top: 80px;
.m-title {
width: 1200px;
......@@ -181,30 +178,29 @@ export default {
}
.content-mian {
padding-top: 24px;
.banner-box {
.my-swipe {
height: 500px;
overflow: hidden;
img {
width: 100%;
height: 520px;
height: 100%;
display: block;
}
}
.enroll-box {
.form-box {
width: 1200px;
height: 540px;
margin: 80px auto 0;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home-apply-form-bg.png);
background: url(https://webapp-pub.ezijing.com/project/kelley/home-ssfc-bg.png);
background-size: 100% 100%;
display: flex;
justify-content: space-between;
.left-content {
.title-box {
width: 592px;
height: 223px;
background: rgba(170, 25, 65, 0.63);
box-shadow: 0px 0px 122px rgba(0, 0, 0, 0.07);
margin-top: 127px;
.tit {
.bt {
font-size: 48px;
font-weight: bold;
line-height: 58px;
......@@ -220,7 +216,7 @@ export default {
text-align: center;
}
}
.right-content {
.form {
width: 401px;
height: 382px;
background: #ffffff;
......@@ -249,5 +245,83 @@ export default {
}
}
}
}
}
.is-h5 {
.card-width {
width: 100%;
margin: 0;
::v-deep {
.card-hd {
margin: 0.2rem 0.15rem;
}
}
}
.presence-content-box {
.my-swipe {
height: 1.58rem;
img {
width: 100%;
height: 100%;
display: block;
}
}
.enroll-box {
width: 1200px;
height: 540px;
margin: 80px auto 0;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home-apply-form-bg.png);
background-size: 100% 100%;
display: flex;
justify-content: space-between;
.left-content {
width: 592px;
height: 223px;
background: rgba(170, 25, 65, 0.63);
box-shadow: 0rem 0rem 1rem rgba(0, 0, 0, 0.07);
.bt {
text-align: center;
font-size: 0.26rem;
// font-weight: bold;
line-height: 0.31rem;
color: #ffffff;
text-align: center;
padding-top: 0.16rem;
}
.tips {
font-size: 0.1rem;
line-height: 0.12rem;
color: #ffffff;
text-align: center;
padding-top: 0.1rem;
}
}
.form {
width: 2.7rem;
background: #ffffff;
margin: 0.2rem auto;
padding: 0.25rem 0.2rem;
box-sizing: border-box;
.li {
margin-bottom: 0.2rem;
}
::v-deep {
.el-select {
width: 100%;
height: 100%;
}
}
.btn {
font-size: 0.12rem;
line-height: 0.16rem;
color: #ffffff;
background: #aa1941;
border-radius: 0.02rem;
text-align: center;
cursor: pointer;
}
}
}
}
}
</style>
\ No newline at end of file
components/home/projectFeatures.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="service-content max-width-center">
<m-title :data="titleParams"/>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<card :title="$t('home.project.title')">
<ul class="nav-content">
<li v-for="(item, index) in data" :key="index" @click="goPage(item.path)">
<img :src="item.icon" alt="" class="icon">
<img :src="item.iconActive" alt="" class="icon-active">
<li v-for="(item, index) in data" :key="index">
<img :src="item.icon" class="icon" />
<img v-if="!isMobile" :src="item.iconActive" class="icon-active" />
<div class="text" v-html="item.text"></div>
</li>
</ul>
</card>
</div>
</div>
</template>
<script>
import mTitle from '@/components/home/moduleTitle'
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'projectFeatures',
components: {
mTitle,
AppLink
AppLink,
Card
},
data() {
return {
titleParams: {
name: '项目特色'
name: this.$t('home.project.title')
},
data: [
{
......@@ -61,50 +64,59 @@ export default {
}
window.open(path)
}
},
mounted() {
console.log(this.isMobile)
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.service-content{
.is-pc {
.service-content {
padding-top: 68px;
.nav-content{
.nav-content {
display: flex;
justify-content: space-between;
padding-top: 15px;
li{
li {
width: 224px;
height: 230px;
padding-top: 53px;
box-sizing: border-box;
background: #F9F8F8;
background: #f9f8f8;
// background: #fff;
// box-shadow: 0px 4px 38px rgba(142, 30, 34, 0.41);
cursor: pointer;
transition: all .3s;
img{
transition: all 0.3s;
img {
width: 80px;
height: 80px;
display: block;
margin: 0 auto;
}
.icon-active{
.icon-active {
display: none;
}
&:hover{
background: #AA1941;
&:hover {
background: #aa1941;
box-shadow: 0px 4px 20px rgba(142, 30, 34, 0.41);
.text{
.text {
color: #fff;
}
.icon{
.icon {
display: none;
}
.icon-active{
.icon-active {
display: block;
}
}
.text{
.text {
font-size: 14px;
line-height: 18px;
color: #666666;
......@@ -113,9 +125,39 @@ export default {
}
}
}
}
.max-width-center{
}
.max-width-center {
width: 1212px;
margin: 0 auto;
}
}
.is-h5 {
.service-content {
ul {
display: flex;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
}
li {
min-width: 0.78rem;
background: #ffffff;
margin-right: 0.1rem;
padding-top: 0.11rem;
img {
width: 0.4rem;
height: 0.4rem;
display: block;
margin: 0 auto;
}
.text {
font-size: 0.1rem;
line-height: 0.16rem;
color: #666666;
padding-top: 0.05rem;
text-align: center;
padding-bottom: 0.1rem;
}
}
}
}
</style>
components/layout/h5/Footer.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<footer class="main-footer">
<div class="top">
<div class="about">
<p>地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址：北京市海淀区中关村东路1号院清华科技园7号楼5层</p>
<p>联系电话：010-62793299</p>
<p>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱：service@ezijing.com</p>
</div>
<div class="link">
<template v-for="(item, index) in link">
<a :href="item.href" :key="index" target="_blank">{{ item.title }}</a>
</template>
</div>
<div class="friendlink">
友情链接：
<template v-for="(item, index) in link2">
<a :href="item.href" :key="index" target="_blank">{{ item.title }}</a>
</template>
</div>
</div>
<div class="copyright">
<p>Copyright @ 2017 Zijing Education. All rights reserved.</p>
<p>京ICP证150431号 <img src="~/assets/images/icon_jinghui.png" height="12" />京公网安备 11010802023681号</p>
<p>清控紫荆（北京）教育科技股份有限公司</p>
</div>
</footer>
</template>
<script>
export default {
data() {
return {
link: [
{ title: '中国教育部', href: 'http://www.pbc.gov.cn/' },
{ title: '教育部涉外监管网', href: 'http://www.pbc.gov.cn/' },
{ title: '印第安纳大学', href: 'http://www.pbc.gov.cn/' },
{ title: 'Kelley商学院', href: 'https://kelley.ezijing.com/' },
{ title: '紫荆教育', href: 'https://www.ezijing.com/' }
],
link2: [
{ title: '中国人民银行', href: 'http://www.pbc.gov.cn/' },
{ title: '中国涉外监管网', href: 'http://jsj.moe.gov.cn/' },
{ title: '中国银行协会', href: 'https://www.china-cba.net/' },
{ title: '中国证券投资基金业协会', href: 'https://www.amac.org.cn/' }
]
}
}
}
</script>
<style lang="scss">
.main-footer {
.top {
color: #fff;
background-color: #aa1941;
padding: 0.24rem 0.15rem;
}
.about {
p {
font-size: 0.12rem;
}
p + p {
margin-top: 10px;
}
}
.link {
margin-top: 0.22rem;
a {
font-size: 0.12rem;
margin-right: 0.2rem;
}
}
.friendlink {
margin-top: 0.22rem;
a {
font-size: 0.12rem;
line-height: 0.18rem;
margin-right: 0.1rem;
white-space: nowrap;
}
}
.copyright {
padding: 0.15rem 0 0.24rem;
p {
font-size: 0.12rem;
color: #999;
text-align: center;
}
p + p {
margin-top: 0.15rem;
}
img {
margin: -4px 5px 0;
vertical-align: middle;
}
}
}
</style>
components/layout/h5/Header.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div>
<header class="main-header">
<template v-if="!searchVisible">
<nuxt-link to="/" class="logo"></nuxt-link>
<div class="search" @click="toggleSearch"></div>
<div class="menu" :class="menuClasses" @click="toggleMenu"></div>
</template>
<div class="search-box" v-else>
<div class="search-inner">
<input type="text" placeholder="请输入关键词" class="search-input" ref="search" />
<div class="search-btn" @click="search"></div>
</div>
<div class="search-close" @click="toggleSearch"></div>
</div>
</header>
<app-search v-if="searchVisible"></app-search>
<app-menu v-show="menuVisible" @showApplyForm="showApplyForm"></app-menu>
<right-aside ref="rightAside"></right-aside>
</div>
</template>
<script>
import AppMenu from '@/components/base/h5/Menu'
import AppSearch from '@/components/base/h5/Search'
import RightAside from '@/components/base/h5/RightAside'
export default {
components: { AppMenu, AppSearch, RightAside },
data() {
return {}
},
computed: {
searchVisible() {
return this.$store.state.searchVisible
},
menuVisible() {
return this.$store.state.menuVisible
},
menuClasses() {
return {
'is-open': this.menuVisible
}
}
},
watch: {
$route() {
this.$store.commit('toggleSearch', false)
this.$store.commit('toggleMenu', false)
}
},
methods: {
toggleSearch() {
this.$store.commit('toggleMenu', false)
this.$store.commit('toggleSearch', !this.searchVisible)
this.searchVisible &&
this.$nextTick(() => {
this.$refs.search.focus()
})
},
toggleMenu() {
this.$store.commit('toggleMenu', !this.menuVisible)
},
search() {
this.$notify({ type: 'primary', message: '暂未开通，尽请期待' })
},
showApplyForm() {
this.$refs.rightAside.showApplyForm()
}
}
}
</script>
<style lang="scss">
.main-header {
position: relative;
display: flex;
align-items: center;
padding: 0.16rem 0.15rem 0.2rem;
background-color: #fff;
border-top: 0.05rem solid #aa1941;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.14);
.logo {
flex: 1;
background: url('~/assets/images/logo.png') no-repeat;
height: 0.26rem;
background-size: contain;
}
.search {
width: 0.18rem;
height: 0.18rem;
padding: 0 0.08rem;
background: url('~/assets/images/icon_search.png') no-repeat center;
background-size: 0.18rem 0.18rem;
cursor: pointer;
}
.menu {
width: 0.18rem;
height: 0.18rem;
padding: 0 0.08rem;
background: url('~/assets/images/icon_menu.png') no-repeat center;
background-size: 0.18rem 0.18rem;
cursor: pointer;
&.is-open {
background: url('~/assets/images/icon_close.png') no-repeat center;
background-size: 0.18rem 0.18rem;
}
}
.search-box {
flex: 1;
display: flex;
align-items: center;
.search-inner {
height: 0.24rem;
flex: 1;
display: flex;
border: 0.01rem solid #eaeaea;
border-radius: 0.03rem;
overflow: hidden;
}
.search-input {
flex: 1;
height: 100%;
padding: 0 0.1rem;
border: 0;
}
.search-btn {
width: 0.18rem;
height: 100%;
padding: 0 0.05rem;
background: url('~/assets/images/icon_search_hover.png') no-repeat center;
background-size: 0.18rem 0.18rem;
cursor: pointer;
}
.search-close {
margin-left: 0.02rem;
width: 0.18rem;
height: 0.18rem;
padding: 0 0.08rem;
background: url('~/assets/images/icon_close.png') no-repeat center;
background-size: 0.18rem 0.18rem;
cursor: pointer;
}
}
}
</style>
components/layout/h5/Index.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="main-layout is-h5" :class="{ 'is-fixed': isFixed }">
<app-header />
<div v-show="!isFixed">
<Nuxt />
<app-footer />
</div>
</div>
</template>
<script>
import AppHeader from './Header'
import AppFooter from './Footer'
export default {
components: { AppHeader, AppFooter },
computed: {
isFixed() {
const { searchVisible, menuVisible } = this.$store.state
return searchVisible || menuVisible
}
}
}
</script>
<style lang="scss">
.is-h5 {
&.main-layout {
max-width: 750px;
min-height: 100vh;
margin: 0 auto;
overflow: hidden;
background-color: #f9f8f8;
box-shadow: 0 1px 20px rgba(0, 0, 0, 0.04);
}
}
</style>
\ No newline at end of file
components/layout/index.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<component :is="componentName" />
</template>
<script>
import PC from './pc/Index'
import H5 from './h5/Index'
export default {
components: { PC, H5 },
computed: {
isMobile() {
return this.$store.state.isMobile
},
componentName() {
return this.isMobile ? 'H5' : 'PC'
}
}
}
</script>
components/Foot.vue → components/layout/pc/Foot.vue
浏览文件 @ 6fb0d7cd
......@@ -5,12 +5,12 @@
<div class="left-content">
<div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
中国教育部
{{ $t('foot.link1') }}
</a>
</div>
<div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
教育部涉外监管网
{{ $t('foot.link2') }}
</a>
</div>
<div>
......@@ -20,7 +20,7 @@
</div>
<div>
<a href="http://www.ezijing.com" target="_blank" >
紫荆教育
{{ $t('foot.link5') }}
</a>
</div>
<!-- <div>
......@@ -28,15 +28,15 @@
</div> -->
</div>
<div class="center-content">
<div class="address">地&nbsp;&nbsp;&nbsp;&nbsp;址：北京市海淀区中关村东路1号院清华科技园7号楼5层</div>
<div class="phone">联系电话：010-62793299</div>
<div class="mail">邮&nbsp;&nbsp;&nbsp;&nbsp;箱：service@ezijing.com</div>
<div class="address" v-html="$t('foot.address')"></div>
<div class="phone" v-html="$t('foot.contact')"></div>
<div class="mail" v-html="$t('foot.email')"></div>
</div>
<div class="right-content">
<img src="https://zws-imgs-pub.ezijing.com/static/public/734d8fd7b853b838e5e029049e2d9db3.png" alt="" class="code">
<div class="tips-txt">
<img src="https://zws-imgs-pub.ezijing.com/static/public/184235d9f6edbb39d52fc6f77339ff5b.png" alt="">
<div class="txt">微信公众号</div>
<div class="txt">{{ $t('foot.weChat') }}</div>
</div>
</div>
</div>
......@@ -92,7 +92,7 @@ export default {
.left-content{
div{
opacity: 0.7;
font-size: 22px;
font-size: 18px;
font-weight: 300;
line-height: 50px;
color: #FFFFFF;
......@@ -101,7 +101,7 @@ export default {
}
}
.center-content{
font-size: 16px;
font-size: 18px;
line-height: 32px;
color: #FFFFFF;
letter-spacing: 3px;
......
components/Head.vue → components/layout/pc/Head.vue
浏览文件 @ 6fb0d7cd
......@@ -3,17 +3,21 @@
<div class="color-bar"></div>
<div class="head-top-content">
<div class="max-width-content">
<app-link :item="{ path: '/' }">
<nuxt-link to="/">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/ciis/ezijing-logo.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/seg-shms-logo.png" />
</app-link>
</nuxt-link>
<div class="user" v-if="user.id">
<span>{{ user.realname || user.nickname }}</span
><em>|</em><span class="logout" @click="logout">退出</span>
><em>|</em><span class="logout" @click="logout">{{ $t('menu.out') }}</span>
</div>
<div class="login-btn-box" v-else>
<div class="login"><a :href="loginURL">快速登录</a></div>
<div class="register"><a :href="registerURL">注册</a></div>
<div class="login">
<a :href="loginURL">{{ $t('menu.fastLogin') }}</a>
</div>
<div class="register">
<a :href="registerURL">{{ $t('menu.register') }}</a>
</div>
</div>
<div class="language">
<span @click="switchLocale('zh-CN')">中文</span> / <span @click="switchLocale('en-US')">EN</span>
......@@ -27,12 +31,10 @@
</div>
</template>
<script>
import AppLink from '@/components/Link'
import AppMenu from '@/components/Menu'
import AppMenu from './Menu'
export default {
components: {
AppMenu,
AppLink
AppMenu
},
data() {
return {}
......@@ -90,7 +92,7 @@ li {
.max-width-content {
display: flex;
align-items: center;
::v-deep.link-content{
::v-deep{
a{
display:flex;
img {
......
components/layout/pc/Index.vue 0 → 100644
浏览文件 @ 6fb0d7cd
<template>
<div class="main-layout is-pc">
<app-header />
<Nuxt />
<app-footer v-if="hasFooter" />
<rightAside />
</div>
</template>
<script>
import AppHeader from './Head'
import AppFooter from './Foot'
export default {
props: { hasFooter: { Boolean, default: true } },
components: { AppHeader, AppFooter }
}
</script>
<style>
html {
font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
sans-serif;
font-size: 16px;
word-spacing: 1px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
}
*,
*::before,
*::after {
box-sizing: border-box;
margin: 0;
}
.button--green {
display: inline-block;
border-radius: 4px;
border: 1px solid #3b8070;
color: #3b8070;
text-decoration: none;
padding: 10px 30px;
}
.button--green:hover {
color: #fff;
background-color: #3b8070;
}
.button--grey {
display: inline-block;
border-radius: 4px;
border: 1px solid #35495e;
color: #35495e;
text-decoration: none;
padding: 10px 30px;
margin-left: 15px;
}
.button--grey:hover {
color: #fff;
background-color: #35495e;
}
</style>
components/Menu.vue → components/layout/pc/Menu.vue
浏览文件 @ 6fb0d7cd
......@@ -24,9 +24,7 @@
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')"
>
<app-link :item="{
path: level2Item.path
}">
<app-link :to="level2Item.path">
<div class="name">
{{ level2Item.name }}
</div>
......@@ -49,49 +47,49 @@ export default {
return {
navData: [
{
name: '项目介绍',
name: this.$t('menu.project'),
path: '/project-intro/bg',
childern: [
{ name: '项目背景', path: '/project-intro/bg' },
{ name: '项目特色', path: '/project-intro/charac' },
{ name: '证书授予', path: '/project-intro/certificate' }
{ name: this.$t('menu.projectChild.bg'), path: '/project-intro/bg' },
{ name: this.$t('menu.projectChild.feature'), path: '/project-intro/charac' },
{ name: this.$t('menu.projectChild.cert'), path: '/project-intro/certificate' }
]
},
{
name: '课程与师资',
name: this.$t('menu.course'),
path: '/about/course',
childern: [
{ name: '课程设置', path: '/about/course' },
{ name: '师资力量', path: '/about/teacher' }
{ name: this.$t('menu.courseChild.set'), path: '/about/course' },
{ name: this.$t('menu.courseChild.teachers'), path: '/about/teacher' }
]
},
{
name: '最新动态',
name: this.$t('menu.news'),
path: '/news/hot',
childern: [
{ name: '热点新闻', path: '/news/hot' },
{ name: '教授采访', path: '/news/interview' }
{ name: this.$t('menu.newsChild.hot'), path: '/news/hot' },
{ name: this.$t('menu.newsChild.interview'), path: '/news/interview' }
]
},
{
name: '招生信息',
name: this.$t('menu.recruit'),
path: '/apply/relevant',
childern: [
{ name: '有关申请', path: '/apply/relevant' },
{ name: '费用资助', path: '/apply/support' },
{ name: '常见问题', path: '/apply/problem' }
{ name: this.$t('menu.recruitChild.apply'), path: '/apply/relevant' },
{ name: this.$t('menu.recruitChild.cost'), path: '/apply/support' },
{ name: this.$t('menu.recruitChild.problem'), path: '/apply/problem' }
]
},
{
name: '校友风采',
name: this.$t('menu.alumni'),
path: '/alumni/outstanding',
childern: [
{ name: '杰出校友', path: '/alumni/outstanding' },
{ name: '校友分享', path: '/alumni/sharing' }
{ name: this.$t('menu.alumniChild.outstanding'), path: '/alumni/outstanding' },
{ name: this.$t('menu.alumniChild.share'), path: '/alumni/sharing' }
]
},
{
name: '报名申请',
name: this.$t('menu.enroll'),
path: '/my'
}
],
......
components/recommend.vue
浏览文件 @ 6fb0d7cd
......@@ -7,14 +7,7 @@
</div>
<ul class="list-box">
<li v-for="(item, index) in listData" :key="index">
<app-link
:item="{
news: {
data: item,
path: '/news/hot'
}
}"
>
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" alt="" />
<div class="dec">{{ item.title }}</div>
</app-link>
......
components/rightAside.vue
浏览文件 @ 6fb0d7cd
......@@ -6,14 +6,14 @@
@mouseenter="handleMsOver('enroll')"
@mouseleave="handleMsOut"
>
<p>报名咨询</p>
<p>{{ $t('aside.apply') }}</p>
</li>
<li
:class="{ wx: true, active: tabBtnActive && tabBtnTarget === 'wx' }"
@mouseenter="handleMsOver('wx')"
@mouseleave="handleMsOut"
>
<p>关注我们</p>
<p>{{ $t('aside.follow') }}</p>
</li>
</ul>
<transition
......@@ -29,9 +29,9 @@
@mouseout="handleMsOut"
>
<div class="enroll_cont" id="show-enroll-content" v-show="tabBtnTarget === 'enroll'">
<h5>报名咨询</h5>
<p><el-input v-model="formInfo.name" placeholder="请输入您的姓名" size="small"></el-input></p>
<p><el-input v-model="formInfo.phone" placeholder="请输入您的电话" size="small"></el-input></p>
<h5>{{ $t('aside.apply') }}</h5>
<p><el-input v-model="formInfo.name" :placeholder="$t('aside.name')" size="small"></el-input></p>
<p><el-input v-model="formInfo.phone" :placeholder="$t('aside.phone')" size="small"></el-input></p>
<!-- <p><el-input v-model="projectName" size="small" :readonly="true"></el-input></p> -->
<p>
<select name="" id="" v-model="formInfo.newProjectId" disabled>
......@@ -48,16 +48,16 @@
</el-select> -->
</p>
<p class="sendcode">
<el-input v-model="sendCode" placeholder="请输入验证码" size="small"></el-input
<el-input v-model="sendCode" :placeholder="$t('aside.code')" size="small"></el-input
><el-button class="btn" :disabled="isBtnDisabled" id="checkedCode" @click="getSendCode"
>获取验证码</el-button
>{{ $t('aside.codeBtn') }}</el-button
>
</p>
<p><el-button style="width: 100%" @click="submitEnroll">立即报名</el-button></p>
<p><el-button style="width: 100%" @click="submitEnroll">{{ $t('aside.formBtn') }}</el-button></p>
</div>
<div class="wx_cont" v-show="tabBtnTarget === 'wx'">
<h5>关注我们</h5>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/wx_code.jpg" />
<h5>{{ $t('aside.follow') }}</h5>
<img src="https://zws-imgs-pub.ezijing.com/static/public/d2d9945d598e81c3b58aff5ce927a78a.jpg" />
</div>
</div>
</transition>
......@@ -197,15 +197,15 @@ export default {
btnDisabledTimer() {
this.isBtnDisabled = true
let count = 60
document.querySelector('#checkedCode').innerHTML = count + '秒后重发'
document.querySelector('#checkedCode').innerHTML = count + 's'
const timer = setInterval(() => {
count--
if (count < 1) {
clearInterval(timer)
this.isBtnDisabled = false
document.querySelector('#checkedCode').innerHTML = '获取验证码'
document.querySelector('#checkedCode').innerHTML = this.$t('aside.codeBtn')
} else {
document.querySelector('#checkedCode').innerHTML = count + '秒后重发'
document.querySelector('#checkedCode').innerHTML = count + 's'
}
}, 1000)
}
......
langs/en-US.js
浏览文件 @ 6fb0d7cd
差异被折叠。
langs/zh-CN.js
浏览文件 @ 6fb0d7cd
差异被折叠。
layouts/normal.vue
浏览文件 @ 6fb0d7cd
<template>
<div>
<Head />
<Nuxt />
<rightAside />
<Foot v-if="hasFooter" />
</div>
<app-layout v-bind="$attrs"></app-layout>
</template>
<script>
import AppLayout from '@/components/layout'
export default {
props: { hasFooter: { Boolean, default: true } }
components: { AppLayout }
}
</script>
<style>
html {
font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
sans-serif;
font-size: 16px;
word-spacing: 1px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
}
*,
*::before,
*::after {
box-sizing: border-box;
margin: 0;
}
.button--green {
display: inline-block;
border-radius: 4px;
border: 1px solid #3b8070;
color: #3b8070;
text-decoration: none;
padding: 10px 30px;
}
.button--green:hover {
color: #fff;
background-color: #3b8070;
}
.button--grey {
display: inline-block;
border-radius: 4px;
border: 1px solid #35495e;
color: #35495e;
text-decoration: none;
padding: 10px 30px;
margin-left: 15px;
}
.button--grey:hover {
color: #fff;
background-color: #35495e;
}
</style>
middleware/device.js
浏览文件 @ 6fb0d7cd
export default function(context) {
const UA = process.server ? context.req.headers['user-agent'] : navigator.userAgent
const isMobile = /iphone/i.test(UA) || (/android/i.test(UA) && /mobile/i.test(UA))
isMobile && context.redirect('https://h5.ezijing.com/')
context.store.commit('setIsMobile', isMobile)
}
nuxt.config.js
浏览文件 @ 6fb0d7cd
......@@ -45,10 +45,11 @@ export default {
]
},
// Global CSS: https://go.nuxtjs.dev/config-css
css: ['@ezijing/vue-form/dist/vue-form.css', 'assets/theme/index.css', 'assets/css/base.css'],
css: ['vant/lib/index.css', '@ezijing/vue-form/dist/vue-form.css', 'assets/theme/index.css', 'assets/css/base.css'],
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: [
'@/plugins/vant',
'@/plugins/i18n',
'@/plugins/router',
'@/plugins/axios',
......
package-lock.json
浏览文件 @ 6fb0d7cd
......@@ -17,6 +17,7 @@
"qrcode.vue": "^1.7.0",
"qs": "^6.10.1",
"swiper": "^5.4.5",
"vant": "^2.12.21",
"viewerjs": "^1.9.0",
"vue-awesome-swiper": "^4.1.1",
"vue-i18n": "^8.24.4"
......@@ -1973,6 +1974,15 @@
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.12.tgz",
"integrity": "sha512-6RglhutqrGFMO1MNUXp95RBuYIuc8wTnMAV5MUhLmjTOy78ncwOw7RgeQ/HeymkKXRhZd0s2DNrM1rL7unk3MQ=="
},
"node_modules/@popperjs/core": {
"version": "2.9.2",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.9.2.tgz",
"integrity": "sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q==",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/popperjs"
}
},
"node_modules/@types/anymatch": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
......@@ -2068,6 +2078,19 @@
"node": ">=0.10.0"
}
},
"node_modules/@vant/icons": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/@vant/icons/-/icons-1.6.0.tgz",
"integrity": "sha512-4Hvq4tl4grCOJLZ0e8ZaivBV8xOcmTPmTT8BDkTrEIKqnDowRFDdsXxcHECzWmbmMx+CYGdngvd2Cq8YR9DfKA=="
},
"node_modules/@vant/popperjs": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@vant/popperjs/-/popperjs-1.1.0.tgz",
"integrity": "sha512-8MD1gz146awV/uPxYjz4pet22f7a9YVKqk7T+gFkWFwT9mEcrIUEg/xPrdOnWKLP9puXyYtm7oVfSDSefZ/p/w==",
"dependencies": {
"@popperjs/core": "^2.9.2"
}
},
"node_modules/@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
......@@ -11227,6 +11250,21 @@
"node": ">= 0.4.0"
}
},
"node_modules/vant": {
"version": "2.12.21",
"resolved": "https://registry.npmjs.org/vant/-/vant-2.12.21.tgz",
"integrity": "sha512-BvS3tLZS68drJJzs0Ymqj819BQbU3evdUYaJClGzXEXgUZb2pPFBFsD69NE0L7iHcGPYwQhRSpvg+budk8Xr7A==",
"dependencies": {
"@babel/runtime": "7.x",
"@vant/icons": "^1.5.3",
"@vant/popperjs": "^1.0.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
"vue-lazyload": "1.2.3"
},
"peerDependencies": {
"vue": ">= 2.6.0"
}
},
"node_modules/vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
......@@ -11278,6 +11316,11 @@
"resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.24.4.tgz",
"integrity": "sha512-RZE94WUAGxEiBAANxQ0pptbRwDkNKNSXl3fnJslpFOxVMF6UkUtMDSuYGuW2blDrVgweIXVpethOVkYoNNT9xw=="
},
"node_modules/vue-lazyload": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/vue-lazyload/-/vue-lazyload-1.2.3.tgz",
"integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g=="
},
"node_modules/vue-loader": {
"version": "15.9.6",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.6.tgz",
......@@ -14497,6 +14540,11 @@
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.12.tgz",
"integrity": "sha512-6RglhutqrGFMO1MNUXp95RBuYIuc8wTnMAV5MUhLmjTOy78ncwOw7RgeQ/HeymkKXRhZd0s2DNrM1rL7unk3MQ=="
},
"@popperjs/core": {
"version": "2.9.2",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.9.2.tgz",
"integrity": "sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q=="
},
"@types/anymatch": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
......@@ -14589,6 +14637,19 @@
}
}
},
"@vant/icons": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/@vant/icons/-/icons-1.6.0.tgz",
"integrity": "sha512-4Hvq4tl4grCOJLZ0e8ZaivBV8xOcmTPmTT8BDkTrEIKqnDowRFDdsXxcHECzWmbmMx+CYGdngvd2Cq8YR9DfKA=="
},
"@vant/popperjs": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@vant/popperjs/-/popperjs-1.1.0.tgz",
"integrity": "sha512-8MD1gz146awV/uPxYjz4pet22f7a9YVKqk7T+gFkWFwT9mEcrIUEg/xPrdOnWKLP9puXyYtm7oVfSDSefZ/p/w==",
"requires": {
"@popperjs/core": "^2.9.2"
}
},
"@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
......@@ -22209,6 +22270,18 @@
"resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
"integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
},
"vant": {
"version": "2.12.21",
"resolved": "https://registry.npmjs.org/vant/-/vant-2.12.21.tgz",
"integrity": "sha512-BvS3tLZS68drJJzs0Ymqj819BQbU3evdUYaJClGzXEXgUZb2pPFBFsD69NE0L7iHcGPYwQhRSpvg+budk8Xr7A==",
"requires": {
"@babel/runtime": "7.x",
"@vant/icons": "^1.5.3",
"@vant/popperjs": "^1.0.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
"vue-lazyload": "1.2.3"
}
},
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
......@@ -22254,6 +22327,11 @@
"resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.24.4.tgz",
"integrity": "sha512-RZE94WUAGxEiBAANxQ0pptbRwDkNKNSXl3fnJslpFOxVMF6UkUtMDSuYGuW2blDrVgweIXVpethOVkYoNNT9xw=="
},
"vue-lazyload": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/vue-lazyload/-/vue-lazyload-1.2.3.tgz",
"integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g=="
},
"vue-loader": {
"version": "15.9.6",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.6.tgz",
......
package.json
浏览文件 @ 6fb0d7cd
......@@ -19,6 +19,7 @@
"qrcode.vue": "^1.7.0",
"qs": "^6.10.1",
"swiper": "^5.4.5",
"vant": "^2.12.21",
"viewerjs": "^1.9.0",
"vue-awesome-swiper": "^4.1.1",
"vue-i18n": "^8.24.4"
......
pages/about/course.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="course-content-box">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="course-content-box" v-if="!isMobile">
<div class="content-mian">
<div class="border-box">
<template v-for="(item, index) in courseData">
......@@ -18,8 +19,20 @@
</template>
</div>
</div>
</app-frame>
</div>
<div class="course-content" v-else>
<div class="item-box" v-for="(item, index) in courseData" :key="index">
<div class="title">{{ item.title }}</div>
<ul>
<li v-for="(cItem, cIndex) in item.item" :key="cIndex + 'c'">
<div class="name">{{ cItem.name }}</div>
<div class="score">学分：{{ cItem.score }}</div>
</li>
</ul>
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
......@@ -32,149 +45,77 @@ export default {
return {
courseData: [
{
title: '先修课程',
title: this.$t('setCourse.tit1'),
item: [
{
name: '金融英语',
score: 0
},
{
name: '管理经济学',
score: 0
},
{
name: '会计基础与财务分析',
score: 0
}
{ name: this.$t('setCourse.t1'), score: 0 },
{ name: this.$t('setCourse.t2'), score: 0 },
{ name: this.$t('setCourse.t3'), score: 0 }
]
},
{
title: '必修课程',
title: this.$t('setCourse.tit2'),
item: [
{
name: '财务管理',
score: 3
},
{
name: '资产定价和证券估值',
score: 3
},
{
name: '决策过程中的管理会计信息',
score: 3
},
{
name: '金融风险管理',
score: 3
},
{
name: '企业估值与投资',
score: 3
},
{
name: '证券和投资分析',
score: 3
},
{
name: '国际金融管理',
score: 3
},
{
name: '高级衍生品和固定收益模型',
score: 3
},
{
name: '金融市场策略',
score: 3
},
{
name: '行为金融学',
score: 1.5
},
{
name: '国际货币体系',
score: 1.5
},
{
name: '毕业论文/毕业设计',
score: 1.5
}
{ name: this.$t('setCourse.t4'), score: 3 },
{ name: this.$t('setCourse.t5'), score: 3 },
{ name: this.$t('setCourse.t6'), score: 3 },
{ name: this.$t('setCourse.t7'), score: 3 },
{ name: this.$t('setCourse.t8'), score: 3 },
{ name: this.$t('setCourse.t9'), score: 3 },
{ name: this.$t('setCourse.t10'), score: 3 },
{ name: this.$t('setCourse.t11'), score: 3 },
{ name: this.$t('setCourse.t12'), score: 3 },
{ name: this.$t('setCourse.t13'), score: 1.5 },
{ name: this.$t('setCourse.t14'), score: 1.5 },
{ name: this.$t('setCourse.t15'), score: 1.5 }
]
},
{
title: '选修课程',
title: this.$t('setCourse.tit3'),
item: [
{
name: '创业金融系列',
score: 0
},
{
name: '财富管理系列',
score: 0
},
{
name: '企业理财系列',
score: 0
},
{
name: '互联网金融系列',
score: 0
},
{
name: 'ABS系列',
score: 0
},
{
name: '利率市场化系列',
score: 0
},
{
name: '转型与发展：金融科技系列等',
score: 0
}
{ name: this.$t('setCourse.t16'), score: 0 },
{ name: this.$t('setCourse.t17'), score: 0 },
{ name: this.$t('setCourse.t18'), score: 0 },
{ name: this.$t('setCourse.t19'), score: 0 },
{ name: this.$t('setCourse.t20'), score: 0 },
{ name: this.$t('setCourse.t21'), score: 0 },
{ name: this.$t('setCourse.t22'), score: 0 }
]
},
{
title: '美国访学',
title: this.$t('setCourse.tit4'),
item: [
{
name: '机器学习和商业应用',
score: 1.5
},
{
name: '职业发展规划',
score: 0
},
{
name: '毕业典礼',
score: 0
}
{ name: this.$t('setCourse.t23'), score: 1.5 },
{ name: this.$t('setCourse.t24'), score: 0 },
{ name: this.$t('setCourse.t25'), score: 0 }
]
}
],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/about-banner.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/about-banner.png',
slider: [
{
name: '课程设置',
path: '/about/course',
pathActive: ['/about/course']
name: this.$t('menu.courseChild.set'),
path: '/about/course'
},
{
name: '师资力量',
path: '/about/teacher',
pathActive: ['/about/teacher']
name: this.$t('menu.courseChild.teachers'),
path: '/about/teacher'
}
]
}
}
},
mounted() {
mounted() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.course-content-box {
.is-pc{
.course-content-box {
width: 1200px;
margin: 0 auto;
.content-mian {
......@@ -184,8 +125,8 @@ export default {
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
.item-box {
display: flex;
justify-content: space-between;
// display: flex;
// justify-content: space-between;
margin-bottom: 40px;
ul {
padding-bottom: 37px;
......@@ -230,5 +171,45 @@ export default {
}
}
}
}
}
.is-h5{
.course-content{
background: #fff;
padding: .38rem .28rem .2rem;
.title{
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #AA1941;
}
ul{
border-top: .01rem solid #E6E6E6;
padding-top: .1rem;
margin-top: .19rem;
margin-bottom: .24rem;
li{
height: .21rem;
box-sizing: border-box;
padding-left: .27rem;
display: flex;
align-items: center;
&:nth-child(odd) {
background: #F7F7F7;
}
.name{
font-size: 0.1rem;
color: #666666;
width: 2.17rem;
font-size: 0.1rem;
color: #666666;
}
.score{
font-size: 0.1rem;
color: #666666;
}
}
}
}
}
</style>
pages/about/teacher.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="teacher-content-box">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="teacher-content-box">
<div class="content-box">
<div class="teacher-box">
<div class="mar-t-box" v-for="(item, index) in teacherList" :key="index">
......@@ -10,15 +11,14 @@
<li :key="cIndex + '='">
<img :src="cItem.image" alt="" />
<div class="name">{{ cItem.name }}</div>
<template v-for="(text, tIndex) in cItem.intr">
<div class="p" :key="tIndex + '=='">{{ text }}</div>
</template>
<div class="p" v-html="cItem.intr"></div>
</li>
</template>
</ul>
</div>
</div>
</div>
</div>
</app-frame>
</div>
</template>
......@@ -33,99 +33,102 @@ export default {
return {
teacherList: [
{
title: '美方师资（部分）',
title: this.$t('teachers.tit1'),
list: [
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t1.png',
name: 'Ash Soni',
intr: ['印第安纳大学工商管理博士', 'KELLEY商学院副院长、教授']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t1.png',
name: this.$t('teachers.tea1Name'),
intr: this.$t('teachers.tea1Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t2.png',
name: '杨珺',
intr: ['华盛顿大学金融学博士', '香港中文大学运营管理学博士', 'KELLEY商学院公司治理研究院院长']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t2.png',
name: this.$t('teachers.tea2Name'),
intr: this.$t('teachers.tea2Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t3.png',
name: 'Cathy Bonser-neal',
intr: ['芝加哥大学博士', 'KELLEY商学院金融学副教授']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t3.png',
name: this.$t('teachers.tea3Name'),
intr: this.$t('teachers.tea3Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t4.png',
name: 'Sreeni Kamma',
intr: ['纽约州立大学布法罗分校博士', 'KELLEY商学院金融系主任']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t4.png',
name: this.$t('teachers.tea4Name'),
intr: this.$t('teachers.tea4Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t5.png',
name: 'Dubos J. masson',
intr: ['印第安纳大学金融学博士', 'KELLEY商学院金融系副教授']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t5.png',
name: this.$t('teachers.tea5Name'),
intr: this.$t('teachers.tea5Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t6.png',
name: 'Joe fisher',
intr: ['俄亥俄州立大学博士', 'KELLEY商学院教授']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t6.png',
name: this.$t('teachers.tea6Name'),
intr: this.$t('teachers.tea6Txt')
}
]
},
{
title: '中方师资（部分）',
title: this.$t('teachers.tit2'),
list: [
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t7.png',
name: '肇越',
intr: ['清华五道口经济学博士', '香港致富证券首席经济学家']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t7.png',
name: this.$t('teachers.tea7Name'),
intr: this.$t('teachers.tea7Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t8.png',
name: '梁国忠',
intr: ['复旦大学金融学硕士', '中金甲子投资基金管理有限公司', '董事长兼总经理']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t8.png',
name: this.$t('teachers.tea8Name'),
intr: this.$t('teachers.tea8Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t9.png',
name: '孙明春',
intr: ['斯坦福大学博士', '海通国际首席经济学家']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t9.png',
name: this.$t('teachers.tea9Name'),
intr: this.$t('teachers.tea9Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t10.png',
name: '洪灏',
intr: ['澳大利亚商学院金融系工商管理硕士', '交银国际董事总经理、首席策略师']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t10.png',
name: this.$t('teachers.tea10Name'),
intr: this.$t('teachers.tea10Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t11.png',
name: '王勇',
intr: ['加拿大达尔豪斯大学博士', '国家千人计划专家', '天风证券首席风险官']
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/wangyong.png',
name: this.$t('teachers.tea11Name'),
intr: this.$t('teachers.tea11Txt')
},
{
image: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/teacher-t12.png',
name: '王鹤菲',
intr: ['斯坦福大学商学院金融学博士', '中国人民大学国际学院金融学教授']
image: 'https://webapp-pub.ezijing.com/project/kelley/teacher-t12.png',
name: this.$t('teachers.tea12Name'),
intr: this.$t('teachers.tea12Txt')
}
]
}
],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/about-banner2.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/about-banner2.png',
slider: [
{
name: '课程设置',
path: '/about/course',
pathActive: ['/about/course']
name: this.$t('menu.courseChild.set'),
path: '/about/course'
},
{
name: '师资力量',
path: '/about/teacher',
pathActive: ['/about/teacher']
name: this.$t('menu.courseChild.teachers'),
path: '/about/teacher'
}
]
}
}
},
mounted() {
mounted() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.teacher-content-box {
.is-pc{
.teacher-content-box {
width: 1200px;
margin: 0 auto;
.content-box {
......@@ -161,7 +164,7 @@ export default {
}
.p {
font-size: 14px;
line-height: 100%;
// line-height: 100%;
color: #666666;
white-space: nowrap;
margin-bottom: 5px;
......@@ -170,5 +173,51 @@ export default {
}
}
}
}
}
.is-h5{
.teacher-content-box {
.content-box {
padding: .3rem .32rem .3rem;
.teacher-box {
.title {
font-size: .14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
}
ul {
display: flex;
flex-wrap: wrap;
padding-top: .15rem;
li {
width: 1.32rem;
margin-left: .3rem;
margin-bottom: .13rem;
&:nth-child(odd){
margin-left: 0;
}
img {
display: block;
width: 100%;
}
.name {
font-size: 0.14rem;
line-height: 100%;
color: #AA1941;
margin-top: .1rem;
margin-bottom: .03rem;
}
.p {
font-size: 0.1rem;
line-height: 0.13rem;
color: #666666;
margin-top: .03rem;
}
}
}
}
}
}
}
</style>
pages/alumni/sharing/_id.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="detail-content-box">
<app-frame :data="frameParams">
<div class="detail-content-box">
<div class="content-box">
<div class="back-btn" @click="$router.go(-1)">
<div class="el-icon-arrow-left"></div>
......@@ -11,8 +11,8 @@
<div class="article-content" v-html="data.content"></div>
<recommend />
</div>
</app-frame>
</div>
</app-frame>
</template>
<script>
import appFrame from '@/components/appFrame'
......@@ -28,14 +28,12 @@ export default {
frameParams: {
slider: [
{
name: '杰出校友',
path: '/alumni/outstanding',
pathActive: ['/alumni/outstanding']
name: this.$t('menu.alumniChild.outstanding'),
path: '/alumni/outstanding'
},
{
name: '校友分享',
path: '/alumni/sharing',
pathActive: ['/alumni/sharing']
name: this.$t('menu.alumniChild.share'),
path: '/alumni/sharing'
}
]
},
......
pages/alumni/sharing/index.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="sharing">
<app-frame :data="frameParams">
<newsItem :data="newsList" class="news-item" @onClick="handleClick" />
<article-list v-bind="listOptions"></article-list>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
import newsItem from '@/components/news/newsItem'
import ArticleList from '@/components/ArticleList'
import { getArticleList } from '@/api'
export default {
layout: 'normal',
components: {
appFrame,
newsItem
},
async fetch() {
const params = { project_id: process.env.newProjectId, type_tag: 'kelley_alumni_share' }
this.newsList = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => res.data.data)
},
components: { appFrame, ArticleList },
data() {
return {
newsList: [],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/alumni-sharing-banner.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/alumni-sharing-banner.png',
slider: [
{
name: '杰出校友',
name: this.$t('menu.alumniChild.outstanding'),
path: '/alumni/outstanding',
pathActive: ['/alumni/outstanding']
},
{
name: '校友分享',
name: this.$t('menu.alumniChild.share'),
path: '/alumni/sharing',
pathActive: ['/alumni/sharing']
}
]
}
}
},
methods: {
handleClick(item) {
this.$router.push({ name: 'alumni-sharing-id', params: { id: item.id } })
computed: {
listOptions() {
return {
remote: {
httpRequest: getArticleList,
params: { project_id: process.env.newProjectId, type_tag: 'kelley_alumni_share' }
},
to(item) {
return `/alumni/sharing/${item.id}`
}
}
}
}
}
</script>
<style lang="scss" scoped>
.news-item {
padding-top: 43px;
}
</style>
\ No newline at end of file
pages/apply/problem.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="problem-content-box">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="problem-content-box">
<div class="content-box">
<template v-for="(item, index) in problemList">
<div class="problem-item-box" :key="index">
......@@ -16,8 +17,9 @@
</div>
</template>
</div>
</app-frame>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
......@@ -30,74 +32,74 @@ export default {
return {
problemList: [
{
title: '申请和面试相关问题',
title: this.$t('problem.item1Tit'),
problem: [
{
tit: 'Q:如何申请美国印第安纳大学Kelley商学院金融学硕士？大概流程是什么？',
answer: 'A: 请参考网页招生简章。'
tit: this.$t('problem.item1problem1'),
answer: this.$t('problem.item1answer1')
},
{
tit: 'Q:面试多少人？录取多少人？率取比率是多少？',
answer: 'A: 本项目采取现场/视频面试的方式，面试人数和录取人数视申请人数和申请资质而定。'
tit: this.$t('problem.item1problem2'),
answer: this.$t('problem.item1answer2')
},
{
tit: 'Q:是否要求考生的工作经验必须属于金融行业？',
answer:
'A: 本项目对考生的行业没有特殊要求。只要是有志于从事金融行业和相关工作的考生都可以报考本项目。录取为综合考评，工作背景是综合评价时需要参考的一部分信息。'
tit: this.$t('problem.item1problem3'),
answer: this.$t('problem.item1answer3')
}
]
},
{
title: '报考资格相关问题',
title: this.$t('problem.item2Tit'),
problem: [
{
tit: 'Q:大专毕业后，又通过自考获得本科毕业证和学士学位，能否报考？',
answer: 'A: 可以报考，只要获得本科学位证书，按照本科毕业生身份报考即可。'
tit: this.$t('problem.item2problem1'),
answer: this.$t('problem.item2answer1')
},
{
tit: 'Q:成人教育的本科毕业生（无学位证）能否报考？',
answer: 'A: 不可以。需要获得本科学位证书才能符合相应报考条件。'
tit: this.$t('problem.item2problem2'),
answer: this.$t('problem.item2answer2')
}
]
},
{
title: '费用相关问题',
title: this.$t('problem.item3Tit'),
problem: [
{
tit: 'Q:美国印第安纳大学Kelley商学院金融学硕士项目学费是多少？ 可以分期吗？',
answer: 'A: 目前本项目的学费为24.98万元人民币，由学生在入学前向紫荆教育缴清（不可选择分期）。'
tit: this.$t('problem.item3problem1'),
answer: this.$t('problem.item3answer1')
}
]
}
],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/apply-banner3.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/apply-banner3.png',
slider: [
{
name: '有关申请',
path: '/apply/relevant',
pathActive: ['/apply/relevant']
name: this.$t('menu.recruitChild.apply'),
path: '/apply/relevant'
},
{
name: '费用资助',
path: '/apply/support',
pathActive: ['/apply/support']
name: this.$t('menu.recruitChild.cost'),
path: '/apply/support'
},
{
name: '常见问题',
path: '/apply/problem',
pathActive: ['/apply/problem']
name: this.$t('menu.recruitChild.problem'),
path: '/apply/problem'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.problem-content-box {
width: 1200px;
margin: 0 auto;
.is-pc{
.problem-content-box {
.content-box {
padding: 54px 104px 90px 87px;
.problem-item-box {
......@@ -111,7 +113,6 @@ export default {
ul {
padding-top: 30px;
li {
width: 808px;
margin-bottom: 15px;
.pro-tit {
font-size: 16px;
......@@ -129,5 +130,40 @@ export default {
}
}
}
}
}
.is-h5{
.problem-content-box {
.content-box {
padding: .22rem;
.problem-item-box {
margin-bottom: .4rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
}
ul {
padding-top: .15rem;
li {
margin-bottom: .08rem;
.pro-tit {
font-size: .12rem;
font-weight: bold;
line-height: .17rem;
color: #666666;
border-bottom: 1px solid #e6e6e6;
}
.answer {
font-size: .12rem;
line-height: .17rem;
color: #424242;
}
}
}
}
}
}
}
</style>
pages/apply/relevant.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="rele-content-box">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="rele-content-box">
<div class="content-box">
<div class="text-content">
<div class="title">申请条件</div>
<div class="con-txt">已获得本科或以上学位<br />有一定工作经验<br />托福79分/雅思6分以上</div>
<div class="title mar-t55">招生对象</div>
<div class="con-txt">
证劵、基金、银行、财富管理等相关行业人士<br />
金融相关行业有丰富工作经验的专业人士<br />
所从事的金融业务具有国际化需求的人士<br />
其他对本项目有兴趣并自身优异者
<div class="title">{{ $t('apply.con1Tit') }}</div>
<div class="con-txt" v-html="$t('apply.con1Txt')"></div>
<div class="title mar-t55">{{ $t('apply.con2Tit') }}</div>
<div class="con-txt" v-html="$t('apply.con2Txt')"></div>
</div>
<img src="https://webapp-pub.ezijing.com/project/kelley/apply-img.png" alt="" />
</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/apply-img.png" alt="" />
</div>
</app-frame>
</div>
......@@ -29,33 +26,34 @@ export default {
return {
newsList: [],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/apply-banner.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/apply-banner.png',
slider: [
{
name: '有关申请',
path: '/apply/relevant',
pathActive: ['/apply/relevant']
name: this.$t('menu.recruitChild.apply'),
path: '/apply/relevant'
},
{
name: '费用资助',
path: '/apply/support',
pathActive: ['/apply/support']
name: this.$t('menu.recruitChild.cost'),
path: '/apply/support'
},
{
name: '常见问题',
path: '/apply/problem',
pathActive: ['/apply/problem']
name: this.$t('menu.recruitChild.problem'),
path: '/apply/problem'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.rele-content-box {
width: 1200px;
margin: 0 auto;
.is-pc{
.rele-content-box {
.content-box {
img {
width: 900px;
......@@ -83,5 +81,37 @@ export default {
}
}
}
}
}
.is-h5{
.rele-content-box{
background: #fff;
padding: .3rem .2rem;
.content-box {
img {
width: 100%;
display: block;
}
padding-bottom: .5rem;
.text-content {
margin-bottom: .4rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: .25rem;
}
}
.con-txt {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
padding-top: .14rem;
}
}
}
}
}
</style>
pages/apply/support.vue
浏览文件 @ 6fb0d7cd
<template>
<div class="rele-content-box">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="rele-content-box">
<div class="content-box">
<div class="text-content">
<div class="title">学费</div>
<div class="con-txt">
本项目学费24.98万元，<br />
由学生向清华控股旗下紫荆教育一次性缴纳。
</div>
<div class="title mar-t55">贷款</div>
<div class="con-txt">
1、就读本项目的学生，可以申请多家金融机构的贷款服务。<br />
2、具体信息会在学生获得正式录取资格后公布。<br />
3、清华控股旗下紫荆教育不为学员担保贷款，不承担催款义务
<div class="title">{{ $t('cost.con1Tit') }}</div>
<div class="con-txt" v-html="$t('cost.con1Txt')"></div>
<div class="title mar-t55">{{ $t('cost.con2Tit') }}</div>
<div class="con-txt" v-html="$t('cost.con2Txt')"></div>
</div>
</div>
</div>
......@@ -30,33 +25,34 @@ export default {
return {
newsList: [],
frameParams: {
banner: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley/apply-banner2.png',
banner: 'https://webapp-pub.ezijing.com/project/kelley/apply-banner2.png',
slider: [
{
name: '有关申请',
path: '/apply/relevant',
pathActive: ['/apply/relevant']
name: this.$t('menu.recruitChild.apply'),
path: '/apply/relevant'
},
{
name: '费用资助',
path: '/apply/support',
pathActive: ['/apply/support']
name: this.$t('menu.recruitChild.cost'),
path: '/apply/support'
},
{
name: '常见问题',
path: '/apply/problem',
pathActive: ['/apply/problem']
name: this.$t('menu.recruitChild.problem'),
path: '/apply/problem'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.rele-content-box {
width: 1200px;
margin: 0 auto;
.is-pc{
.rele-content-box {
.content-box {
padding-top: 46px;
padding-bottom: 106px;
......@@ -79,5 +75,32 @@ export default {
}
}
}
}
}
.is-h5{
.rele-content-box{
background: #fff;
padding: .3rem .2rem;
.content-box {
.text-content {
padding-left: .2rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: .25rem;
}
}
.con-txt {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
padding-top: .14rem;
}
}
}
}
}
</style>
pages/index.vue
浏览文件 @ 6fb0d7cd
差异被折叠。
pages/news/hot/_id.vue
浏览文件 @ 6fb0d7cd
差异被折叠。
pages/news/hot/index.vue
浏览文件 @ 6fb0d7cd
差异被折叠。
pages/project-intro/bg.vue
浏览文件 @ 6fb0d7cd
差异被折叠。
pages/project-intro/components/TabContent.vue 0 → 100644
浏览文件 @ 6fb0d7cd
差异被折叠。
pages/project-intro/components/TabNav.vue 0 → 100644
浏览文件 @ 6fb0d7cd
差异被折叠。
plugins/vant.js 0 → 100644
浏览文件 @ 6fb0d7cd
差异被折叠。
store/index.js
浏览文件 @ 6fb0d7cd
差异被折叠。
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论