提交 933f0e47 authored 作者: lhh's avatar lhh

update

上级 5f44ba90
No preview for this file type
import httpRequest from '@/utils/httpRequest'
// 获取新闻列表
export function getNewsList(params) {
return httpRequest.get(`/api/zws/v1/cms/news`, { params })
}
// 获取新闻详情
export function getNewsDetails(params) {
return httpRequest.get(`/api/zws/v1/cms/new`, { params })
}
/**
* 发送验证码
*/
......@@ -37,17 +27,3 @@ export function postNes(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 })
}
......@@ -22,7 +22,7 @@ body {
'Hiragino Sans GB', 'Wenquanyi Micro Hei', sans-serif;
padding: 0;
margin: 0;
background: #eee;
background: #F9F8F8;
}
p {
margin: 0;
......
<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
<template>
<div class="article-item">
<app-link :data="data" v-bind="$attrs">
<div :class="$route.path == '/alumni/sharing' ? 'article-item-inner set-list' : '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;
&.set-list{
.article-item-pic{
width: 335px;
object-fit: cover;
height: 130px;
}
.article-item-content__text{
-webkit-line-clamp: 2;
}
}
}
.app-link{
::v-deep{
a{
height: fit-content;
}
}
}
.article-item-pic {
width: 320px;
height: 100%;
// height: fit-content;
// 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: 1;
-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: fit-content;
// 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
......@@ -2,7 +2,12 @@
<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__title"
:style="`color: ${color ? color : '#333333'};border-left: 7px solid ${bColor ? bColor : '#aa1941'}; `"
>
{{ title }}
</div>
<div class="card-hd__aside"><slot name="header-aside"></slot></div>
</div>
<div class="card-bd"><slot /></div>
......@@ -12,7 +17,7 @@
<script>
export default {
props: { title: String },
props: { title: String, color: String, bColor: String },
computed: {
isMobile() {
return this.$store.state.isMobile
......@@ -22,7 +27,7 @@ export default {
</script>
<style lang="scss">
.is-pc{
.is-pc {
.card {
// margin: 0.2rem 0.15rem;
}
......@@ -48,7 +53,7 @@ export default {
.card-bd {
}
}
.is-h5{
.is-h5 {
.card {
margin: 0.2rem 0.15rem;
}
......
<template>
<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="main-page-content">
<img v-if="data.banner" :src="data.banner" class="main-page-banner" />
<div class="main-content-html">
<slot></slot>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'appFrame',
props: {
data: { type: Object }
},
methods: {
isAcitve(item) {
return this.$route.fullPath.includes(item.path)
}
}
}
</script>
<style lang="scss">
.is-pc {
.main-page {
width: 1200px;
margin: 0 auto;
padding: 56px 0 100px;
display: flex;
}
.main-page-nav {
width: 160px;
background: #fff;
padding: 35px 0 44px;
margin-right: 40px;
align-self: flex-start;
li {
position: relative;
height: 40px;
font-size: 22px;
line-height: 40px;
text-align: center;
color: #777777;
cursor: pointer;
&.is-active {
color: #aa1941;
&::after {
content: '';
width: 8px;
height: 40px;
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
......@@ -14,10 +14,10 @@
</div>
</div>
</div>
<template v-if="!isMobile">
<!-- <template v-if="!isMobile">
<div class="prev-button"></div>
<div class="next-button"></div>
</template>
</template> -->
</div>
</template>
<script>
......@@ -25,7 +25,12 @@ export default {
name: 'banner',
data() {
return {
listData: [],
listData: [
{
url: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/banner.png',
web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/banner.png'
}
],
swiperOption: {
speed: 400,
autoplay: true,
......@@ -41,8 +46,8 @@ export default {
}
},
async fetch() {
const params = { project_id: process.env.newProjectId, type_tag: 'ad_banner' }
this.listData = await this.$axios.get('/api/cms/api/v1/advertisements', { params }).then(res => res.data.data)
// const params = { project_id: process.env.newProjectId, type_tag: 'ad_banner' }
// this.listData = await this.$axios.get('/api/cms/api/v1/advertisements', { params }).then(res => res.data.data)
},
computed: {
swiper() {
......
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="common-content-box">
<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 to="/apply/problem">
<div class="list-box">
<ul>
<li v-for="(item, index) in problem.itemLeft" :key="index">
<div class="icon"></div>
<div class="text">{{ item }}</div>
</li>
</ul>
<ul>
<li v-for="(item, index) in problem.itemRight" :key="index">
<div class="icon"></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>
<div class="btn">在线留言</div>
</div> -->
</div>
</card>
</div>
</div>
</template>
<script>
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'commonProblem',
components: {
Card,
AppLink
},
data() {
return {
problem: {
itemLeft: [
'瑞士酒店管理大学、瑞士酒店管理大学MBA,毕业生颁发的学位证书与在瑞士颁发的证书有何不同?',
'本项目是怎样的上课形式?',
'本项目学制多久?',
'能否顺利毕业拿到证书呢?',
'本项目是在职还是全职?'
],
itemRight: [
'如何申请瑞士酒店管理大学、瑞士酒店管理大学MBA?',
'大概流程是什么?',
'需要提交哪些材料?',
'瑞士酒店管理大学、瑞士酒店管理大学MBA的学费是多少?',
'学费可以分期吗?'
]
},
textarea: ''
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.common-content-box {
width: 1200px;
margin: 0 auto;
padding-top: 77px;
.content-mian {
padding-top: 50px;
.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 {
background: none;
resize: none;
}
}
.btn {
width: 136px;
height: 36px;
background: #aa1941;
opacity: 1;
border-radius: 4px;
font-size: 18px;
line-height: 36px;
text-align: center;
color: #ffffff;
margin-left: 57px;
cursor: pointer;
}
}
.list-box {
display: flex;
justify-content: space-between;
ul {
&:nth-child(2) {
margin-left: 8px;
}
li {
display: flex;
align-items: center;
width: 600px;
height: 25px;
margin-bottom: 10px;
cursor: pointer;
&:nth-child(even) {
.text {
background: none;
}
}
.icon {
width: 7px;
height: 7px;
background: #aa1941;
border-radius: 50%;
}
.text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
line-height: 25px;
color: #666666;
padding-left: 4px;
width: 570px;
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
<template>
<div class="ent-box">
<card title="部分服务过学员企业" class="max-width-center">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/ent-img.png" />
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'enterprise',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.ent-box {
margin-top: 95px;
padding: 78px 0 122px;
background-color: #fff;
img{
margin-top: 56px;
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div>
<card title="上课环境" style="margin-top: 95px;" class="max-width-center">
<div class="env-list" style="margin-top: 77px;">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-1.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-2.png" style="margin: 0 9px;" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-3.png" />
</div>
<div class="env-list">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-4.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-5.png" style="margin: 0 9px;" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-6.png" />
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'environment',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.env-list {
display: flex;
margin-bottom: 9px;
img {
width: 394px;
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div class="title-content">
<div class="left-title">
<div class="line"></div>
<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>
<script>
export default {
name: 'mTitle',
props: {
data: {
type: Object
}
},
data() {
return {
}
},
methods: {
goPage(item) {
this.$router.push({
path: '/about/news-detail',
query: {
id: item.id
}
})
}
}
}
</script>
<style lang="scss" scoped>
.title-content{
display: flex;
height: 37px;
.left-title{
display: flex;
align-items: center;
.line{
width: 7px;
height: 37px;
background: #AA1941;
}
.text{
font-size: 32px;
font-weight: bold;
line-height: 34px;
color: #333;
margin-left: 20px;
}
}
.right-text{
margin-left: auto;
font-size: 16px;
color: #9B9B9B;
cursor: pointer;
}
}
</style>
\ No newline at end of file
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="news-content-box">
<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 :data="listData.first" :to="`/news/hot/${listData.first.id}`">
<img :src="listData.first.web_img_uri" alt="" />
<div class="mantle-box">
<div class="tit" v-if="!isMobile">{{ listData.first.title }}</div>
<div class="con-txt" v-html="listData.first.abstract"></div>
</div>
</app-link>
</div>
<ul class="news-right">
<li v-for="(item, index) in listData.list" :key="index">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="news-r-title" v-html="item.title"></div>
<div class="del" v-html="item.abstract"></div>
</app-link>
</li>
</ul>
</div>
</card>
</div>
</div>
</template>
<script>
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'news',
components: {
Card,
AppLink
},
async fetch() {
const params = { project_id: process.env.newProjectId, type_tag: 'article_news_hot', page: 1, limit: 4 }
await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
this.data = res.data.data || []
})
},
data() {
return {
data: [],
titleParams: {
name: '最新动态',
more: {
path: '/news/hot'
}
}
}
},
computed: {
listData() {
const [first = {}, ...list] = this.data
return { first, list: list || [] }
},
isMobile() {
return this.$store.state.isMobile
}
},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
console.log(date.getMonth())
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.news-content-box {
width: 1200px;
margin: 0 auto;
padding-top: 65px;
.content-box {
display: flex;
justify-content: space-between;
padding-top: 26px;
.news-left {
width: 780px;
height: 500px;
position: relative;
img {
width: 100%;
height: 500px;
display: block;
}
.mantle-box {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.2);
padding: 30px 37px;
.tit {
font-size: 24px;
font-weight: bold;
line-height: 100%;
color: #ffffff;
width: 696px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.con-txt {
// width: 461px;
font-size: 14px;
line-height: 24px;
color: #ffffff;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
margin-top: 10px;
}
}
}
.news-right {
li {
width: 366px;
border-bottom: 1px solid #e3e3e3;
padding-bottom: 19px;
margin-bottom: 30px;
cursor: pointer;
.time {
font-size: 16px;
font-weight: normal;
line-height: 100%;
color: #8e1e22;
}
.news-r-title {
font-size: 22px;
font-weight: bold;
line-height: 30px;
color: #333333;
margin-top: 15px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.del {
width: 350px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
line-height: 100%;
color: #999999;
margin-top: 15px;
}
}
}
}
}
}
.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>
<template>
<div class="notice-box">
<card title="报名须知" class="max-width-center">
<div class="notice-list">
<div class="notice-list_item">
<div class="item-title">学员对象</div>
<div class="item-content">
<div class="item-content_text">
企业董事长、总经理;<br />
大企业核心高管(董监高);<br />
企业规模在5000万元以上。
</div>
</div>
</div>
<div class="notice-list_item">
<div class="item-title">报名资料</div>
<div class="item-content">
<div class="item-content_text" style="line-height: 28px;">
1、报名申请表;<br />
2、最高学历学位证书复印件电子版1份;<br />
3、营业执照副本复印件电子版1份;<br />
4、名片电子版1张;<br />
5、蓝底两寸电子照片1张(六个月内);<br />
6、身份证复印件电子版件1份。
</div>
</div>
</div>
<div class="notice-list_item">
<div class="item-title">缴费/退费</div>
<div class="item-content">
<div class="item-content_text" style="line-height: 26px;">
1、缴费通知:<br />
课程费用应在收到付款通知书三个工作日内全部缴清;<br />
2、退费申请:<br />
开课前30日(含第30日)之前取消课程,将退还全部学费;<br />
在开课前30日之内取消课程,将收取应付学费总额的20%。<br />
开课后,学员因任何原因自行退出学习,学费概不退还。
</div>
</div>
</div>
<div class="notice-list_item">
<div class="item-title">教学安排</div>
<div class="item-content">
<div class="item-content_text" style="line-height: 22px;">
1、学习时间<br />
学制一年,每月一次,每次周末2-3天集中授课,10次课程<br />
时间: 09:30-12:30<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;14:30-17:30<br />
上课地点:北京、深圳<br />
2、补课方法<br />
需向班主任请假,经协调后,可安排补课。<br />
3、研修证书<br />
课程结束,经考核成绩合格者,颁发“清科企业家高级工商管理研修班结业证书”
</div>
</div>
</div>
</div>
</card>
<card title="申请流程" style="margin-top: 95px;" class="max-width-center">
<img
style="margin-top: 70px;"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/notice-process.png"
/>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'notice',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.notice-box {
margin-top: 94px;
.notice-list {
margin-top: 70px;
display: flex;
justify-content: space-between;
.notice-list_item {
width: 280px;
.item-title {
text-align: center;
width: 220px;
line-height: 50px;
background: #aa1941;
border-radius: 12px 12px 0px 0px;
font-size: 22px;
color: #ffffff;
margin: 0 auto;
}
&:nth-child(1) {
.item-content {
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/notice-bg1.png);
background-size: 100% 100%;
}
}
&:nth-child(2) {
.item-content {
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/notice-bg2.png);
background-size: 100% 100%;
}
}
&:nth-child(3) {
.item-content {
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/notice-bg3.png);
background-size: 100% 100%;
}
}
&:nth-child(4) {
.item-content {
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/notice-bg4.png);
background-size: 100% 100%;
}
}
.item-content {
width: 280px;
height: 360px;
border-radius: 8px;
overflow: hidden;
.item-content_text {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
padding: 38px 10px 0 30px;
font-size: 16px;
color: #ffffff;
line-height: 36px;
}
}
}
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<template v-if="!isMobile">
<div class="alumni-content max-width">
<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 :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" />
<div class="text">{{ item.title }}</div>
</app-link>
</div>
</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 Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'openClass',
components: {
Card,
AppLink
},
data() {
const _this = this
return {
isScale: false,
listData: [],
swiperOption: {
observer: true,
observeParents: true,
speed: 400,
autoplay: true,
delay: 3000,
loop: true,
slidesPerView: 3,
centeredSlides: true,
spaceBetween: 20,
on: {
init() {
_this.swiper.slideNext()
}
}
}
}
},
async fetch() {
const params = { project_id: process.env.newProjectId, type_tag: 'article_publish_class' }
this.listData = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => res.data.data)
},
computed: {
swiper() {
return this.$refs.mySwiper.swiper
},
isMobile() {
return this.$store.state.isMobile
}
},
created() {},
mounted() {},
methods: {
swiperStop() {
this.swiper.autoplay.stop()
},
swiperStart() {
this.swiper.autoplay.start()
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.max-width {
width: 1200px;
margin: 0 auto;
}
.alumni-content {
padding-top: 89px;
.title-content {
display: flex;
.left-title {
display: flex;
.line {
width: 6px;
height: 34px;
background: #aa1941;
}
.text {
font-size: 34px;
font-weight: bold;
line-height: 34px;
color: #424242;
margin-left: 9px;
}
}
}
.small-tit {
font-size: 24px;
font-weight: bold;
line-height: 34px;
color: #424242;
margin-top: 12px;
}
.swiper-content {
padding-top: 37px;
// width: 100%;
.swiper-slide {
position: relative;
width: 360px;
height: 230px;
margin-top: 10px;
.text {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
line-height: 40px;
background: rgba(0, 0, 0, 0.5);
padding: 0 20px;
box-sizing: border-box;
font-size: 20px;
color: #fefefe;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
img {
width: 100%;
height: 100%;
}
}
.swiper-slide-active {
width: 438px;
height: 246px;
margin-top: 0;
}
}
}
}
.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>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="presence-content-box">
<card :title="$t('home.presence.title')" class="card-style">
<template #header-aside>
<nuxt-link to="/alumni/sharing">{{ $t('viewMore') }}</nuxt-link>
</template>
</card>
<card title="报名咨询" class="card-style">
<div class="content-mian">
<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 class="title-content">
<div class="bt">报名咨询</div>
<div class="tips">申请领取试听课程</div>
</div>
</div>
<div class="form">
<div class="li">
<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>
<el-input v-model="form.company" placeholder="您的公司名称"></el-input>
</div>
<div class="li">
<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>
<el-input v-model="form.company" placeholder="您的职位"></el-input>
</div>
<div class="li">
<el-input v-model="form.name" :placeholder="$t('home.presence.nameholder')"></el-input>
......@@ -44,6 +27,7 @@
</div>
</div>
</div>
</card>
</div>
</div>
</template>
......@@ -60,45 +44,9 @@ export default {
},
data() {
return {
yearsOptions: [
{
value: '0~2',
label: '0-2年'
},
{
value: '3~5',
label: '3-5年'
},
{
value: '5~10',
label: '5-10年'
},
{
value: '10+',
label: '10年及以上'
}
],
degreeOptions: [
{
value: '2',
label: '普通本科'
},
{
value: '3',
label: '本科/学士'
},
{
value: '5',
label: '硕士'
},
{
value: '7',
label: '博士'
}
],
form: {
years: '',
degree: '',
company: '',
title: '',
name: '',
phone: '',
project_id: process.env.projectId,
......@@ -200,32 +148,41 @@ export default {
}
.form-box {
width: 1200px;
height: 540px;
margin: 80px auto 0;
background: url(https://webapp-pub.ezijing.com/project/kelley/home-ssfc-bg.png);
height: 500px;
margin: 70px auto 0;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home-ssfc-bg.png);
background-size: 100% 100%;
display: flex;
justify-content: space-between;
.title-box {
width: 592px;
height: 223px;
background: rgba(170, 25, 65, 0.63);
width: 580px;
height: 160px;
background: rgba(170, 25, 65, 0.4);
box-shadow: 0px 0px 122px rgba(0, 0, 0, 0.07);
margin-top: 127px;
margin-top: 170px;
position: relative;
.title-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 380px;
height: 200px;
background: #aa1941;
}
.bt {
font-size: 48px;
font-weight: bold;
line-height: 58px;
font-size: 22px;
line-height: 100%;
color: #ffffff;
text-align: center;
margin-top: 30px;
margin-top: 70px;
}
.tips {
font-size: 14px;
font-size: 22px;
line-height: 100%;
color: #ffffff;
margin-top: 30px;
text-align: center;
margin-top: 20px;
}
}
.form {
......
<template>
<div>
<div class="service-content max-width-center">
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<card :title="$t('home.project.title')">
......@@ -12,6 +13,21 @@
</card>
</div>
</div>
<card title="问:聚焦经营问题" class="max-width-center question-box">
<div class="q-c">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/project-ts.png" />
</div>
</card>
<div class="answer-box">
<card title="学:解决问题" class="max-width-center" color="#fff" bColor="#fff">
<div class="answer-list_all">
<div class="answer-list" v-for="(item, index) in answerList" :key="index">
<div class="answer-list_item" v-for="cItem in item" :key="cItem" v-html="cItem"></div>
</div>
</div>
</card>
</div>
</div>
</template>
<script>
import Card from '@/components/Card'
......@@ -24,34 +40,64 @@ export default {
},
data() {
return {
answerList: [
[
'《2023年中国宏观经济与政府政策解读》<br/>趋势力量',
'《股权架构设计与股权激励》<br/>治理力量',
'《全面注册制下资本运营与企业上市》<br/>资本力量',
'《品类定位升级,找到下一条增长曲线》<br/>模式力量'
],
[
'《构建激发团队的绩效管理体系》<br/>人才力量',
'《股权架构设计与股权激励》<br/>治理力量',
'《基于打胜仗的领导力》<br/>领导力量',
'《业财融合,企业战略执行的财务协同》<br/>财务力量',
'《复制成功,构建以客户为中心流程管理》<br/>流程力量'
],
[
'《财富管理与资产配置大时代背景》<br/>财富力量',
'《适合你的资产配置模型》<br/>配置力量',
'《穿越牛熊的资产配置策略》<br/>资产力量'
]
],
titleParams: {
name: this.$t('home.project.title')
},
data: [
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_first.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_first_on.png',
text: '首款“E-Blended Learning”<br />款待业MBA', path: '', pathType: 0
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_1.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_11.png',
text: '源自清华<br />国企背景',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_Authoritative.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_Authoritative_on.png',
text: '权威专业的泛<br />服务业知识体系', path: '', pathType: 0
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_2.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_22.png',
text: '真心教育<br />追求结果',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_development.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_development_on.png',
text: '国际款待业<br />职业发展服务', path: '', pathType: 0
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_3.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_33.png',
text: '名师大咖<br />真知灼见',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_abroad.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_abroad_on.png',
text: '不出国也能<br />“留学”', path: '', pathType: 0
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_4.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_44.png',
text: '营道同术<br />基业长青',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_Globally.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/home_icon_Globally_on.png',
text: '学位全球认可<br />学籍官方可查', path: '', pathType: 0
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_5.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/home_icon_55.png',
text: '财富管理<br />资产配置',
path: '',
pathType: 0
}
]
}
......@@ -78,25 +124,56 @@ export default {
<style lang="scss" scoped>
.is-pc {
.question-box {
margin: 100px auto 0 !important;
.q-c {
background: #fff;
margin-top: 80px;
}
}
.answer-box {
background-color: #aa1941;
padding: 70px 0 80px;
margin-top: 95px;
.answer-list_all {
padding-top: 70px;
display: flex;
justify-content: space-between;
.answer-list {
.answer-list_item {
width: 378px;
height: 50px;
border: 1px solid #fff;
text-align: center;
line-height: 18px;
color: #fff;
padding-top: 5px;
box-sizing: border-box;
margin-bottom: 8px;
}
}
}
}
.service-content {
padding-top: 68px;
.nav-content {
display: flex;
justify-content: space-between;
padding-top: 15px;
padding-top: 70px;
li {
width: 224px;
height: 230px;
padding-top: 53px;
width: 170px;
height: 186px;
padding-top: 30px;
box-sizing: border-box;
background: #f9f8f8;
// background: #f9f8f8;
border: 1px solid #d5d5d5;
// background: #fff;
// box-shadow: 0px 4px 38px rgba(142, 30, 34, 0.41);
cursor: pointer;
transition: all 0.3s;
img {
width: 80px;
height: 80px;
width: 64px;
height: 64px;
display: block;
margin: 0 auto;
}
......@@ -117,10 +194,10 @@ export default {
}
}
.text {
font-size: 14px;
line-height: 18px;
font-size: 16px;
line-height: 26px;
color: #666666;
margin-top: 20px;
margin-top: 23px;
text-align: center;
}
}
......
<template>
<div>
<div class="ranking-content-box" v-if="!isMobile">
<div class="title">
<div class="line"></div>
<div class="name">学校排名</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>
<h5><span>No.</span>{{ item.rank }}</h5>
<p>{{ item.text }}</p>
</li>
</ul>
</div>
<img v-else src="https://webapp-pub.ezijing.com/project/seg-shms/h5-r-0411.jpg" 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.ezijing.com/project/seg-shms/US-logo.jpg',
rank: 2,
text: '2022 QS 世界大学雇主声誉排名'
},
{
url: 'https://webapp-pub.ezijing.com/project/seg-shms/US-logo.jpg',
rank: 3,
text: '2022 QS 世界大学酒店管理专业排名'
}
]
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</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: url(https://webapp-pub.ezijing.com/project/seg-shms/Caux-Conference-and-Seminar-Centre_Caux-Village2.jpg) 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;
}
}
.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: 134px;
object-fit: contain;
object-position: 60px 10px;
width: 100%;
}
}
}
.img {
width: 100%;
background: #fff;
img {
width: 100%;
}
}
h5 {
padding: 30px 0 20px;
font-size: 32px;
span {
font-size: 16px;
}
}
p {
font-size: 12px;
}
}
}
}
</style>
\ No newline at end of file
<template>
<div class="max-width-center teacher-box">
<card title="优秀师资">
<div style="margin-top: 50px;">
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in teacherList1">
<img :src="item.img" />
<div class="name">{{ item.name }}</div>
<div class="zc">{{ item.major }}</div>
<div class="dec" v-html="item.intr"></div>
</div>
</div>
</div>
</div>
<div style="margin-top: 20px;">
<div v-swiper:mySwiper2="swiperOption2" ref="mySwiper2">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in teacherList2">
<img :src="item.img" />
<div class="name">{{ item.name }}</div>
<div class="zc">{{ item.major }}</div>
<div class="dec" v-html="item.intr"></div>
</div>
</div>
</div>
</div>
</card>
<card title="练:全程学习安排" class="max-width-center" style="margin-top: 95px;">
<div class="drill-box">
<div class="drill-l">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill1.png" />
</div>
<div class="drill-c1">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill21.png" />
<div class="drill-c1_b">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill22.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill23.png" />
</div>
</div>
<div class="drill-c2">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill31.png" />
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill32.png"
style="margin: 8px 0;"
/>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill33.png" />
</div>
<div class="drill-r">
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill41.png"
style="margin-bottom: 8px;"
/>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/tea-drill42.png" />
</div>
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'teacher',
components: {
Card
},
data() {
return {
teacherList1: [
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher1.png',
name: '刘玲玲',
major: '教授',
intr: '清华大学教授<br/>主讲:《宏观经济》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher2.png',
name: '陈晋蓉',
major: '教授',
intr: '清华大学教授<br/>主讲:《资本运营》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher3.png',
name: '肇越',
major: '首席经济学家',
intr: '香港致富证券有限公司首席经济学家<br/>清华大学五道口金融学院硕士导师<br/>主讲:《金融投资》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher4.png',
name: '王赛',
major: '合伙人',
intr: '科特勒咨询集团(KMG)管理合伙人<br/>清华大学商业模式研究中心<br/>增长实验室主任<br/>主讲:《增长五线》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher5.png',
name: '郑永强',
major: '首席财务官',
intr:
'三井住友海上火灾保险(中国)公司CFO<br/>国际注册专业会计师协会<br/>全球董事会董事<br/>主讲:《企业数字化》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher6.png',
name: '朱冠舟',
major: '实战专家',
intr: '原金蝶软件副总裁兼中央大客户事业部总经理<br/>清华、北大EMBA总裁班特聘教授<br/>主讲:《大客户销售》'
}
],
teacherList2: [
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher21.png',
name: '夏惊鸣',
major: '合伙人',
intr: '华夏基石高级合伙人<br/>中国科学院大学实践导师<br/>主讲:《领导力》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher22.png',
name: '徐怀玉',
major: '院长',
intr: '西姆国有经济研究院院长<br/>大连理工大学兼职教授<br/>主讲:《股权设计》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher23.png',
name: '程显礼',
major: '财富管理专家',
intr: '原美国金融管理学会中国区副总裁<br/>中国民营科技实业家协会高新技术产业分会理事长<br/>主讲:《财富管理》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher24.png',
name: '郝启东',
major: '合伙人',
intr: '品类咨询联合创始人<br/>北大创业训练营导师<br/>黑马学院常驻导师<br/>主讲:《品类定位升级》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher25.png',
name: '齐昊',
major: '财务管理专家',
intr:
'原TOM集团(2383HK)财务负责人<br/>原澳大利亚KAPB集团财务副总裁<br/>原阿里影业(01060HK)财务总监<br/>主讲:《财务管理》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher26.png',
name: '岳三峰',
major: '总裁教练',
intr: '北大纵横合伙人<br/>字节跳动飞书OKR教练<br/>腾讯组织发展总监<br/>主讲:《组织发展》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher31.png',
name: '赵剑海',
major: '博士',
intr:
'海朋资本创始人<br/>原IDG资本副总裁<br/>清华大学MBA校友理事会理事<br/>央视《创业英雄汇》投资人嘉宾<br/>主讲:《创业战略》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher32.png',
name: '贾奕琛',
major: '股权激励专家',
intr: '国牛投资董事长<br/>清华大学五道口金融学院特聘教授<br/>主讲:《股权激励》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/teacher33.png',
name: '王立中',
major: '院长',
intr: '深圳格物流程研究院院长<br/>原华为流程优化经理<br/>原维也纳酒店集团副总裁<br/>主讲:《流程管理》'
}
],
swiperOption: {
speed: 400,
autoplay: true,
loop: true,
slidesPerView: 4,
paginationClickable: true,
spaceBetween: 50
},
swiperOption2: {
speed: 400,
autoplay: true,
loop: true,
slidesPerView: 4,
paginationClickable: true,
spaceBetween: 50
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.teacher-box {
padding-top: 95px;
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
.swiper-slide {
width: 260px;
height: 400px;
// padding: 30px 30px 0;
background-color: #fff;
box-sizing: border-box;
img {
width: 200px;
margin: 30px auto 0;
display: block;
}
.name {
font-size: 16px;
font-weight: bold;
color: #666666;
line-height: 100%;
margin-top: 15px;
text-align: center;
}
.zc {
font-size: 16px;
font-weight: bold;
color: #666666;
line-height: 100%;
margin-top: 5px;
text-align: center;
}
.dec {
color: #666666;
line-height: 18px;
font-size: 14px;
text-align: center;
margin-top: 10px;
}
}
.drill-box {
display: flex;
margin-top: 77px;
img {
width: 100%;
display: block;
}
.drill-l {
width: 233px;
}
.drill-c1 {
width: 475px;
margin-left: 8px;
.drill-c1_b {
display: flex;
justify-content: space-between;
margin-top: 8px;
img {
width: 233px;
}
}
}
.drill-c2 {
width: 233px;
margin-left: 8px;
}
.drill-r {
width: 233px;
margin-left: 8px;
}
}
</style>
......@@ -3,26 +3,26 @@
<div class="foot-box">
<div class="foot-content">
<div class="left-content">
<div>
<!-- <div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
{{ $t('foot.link1') }}
</a>
</div>
</div> -->
<div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
{{ $t('foot.link2') }}
</a>
</div>
<div>
<!-- <div>
<a href="https://www.swisseducation.com/" target="_blank" >
瑞士酒店管理大学官网
</a>
</div>
<div>
</div> -->
<!-- <div>
<a href="http://www.ezijing.com" target="_blank" >
{{ $t('foot.link5') }}
</a>
</div>
</div> -->
<!-- <div>
合作大学官网
</div> -->
......@@ -40,9 +40,9 @@
</div>
</div>
</div>
<!-- <div class="links">
<div class="links">
友情链接:中国人民银行 中国涉外监管网 中国银行协会 中国证券投资基金业协会
</div> -->
</div>
</div>
<div class="copyright" style="height: 40px;line-height: 40px;color: rgba(153, 153, 153, 1);background: #fff;">
<div class="inner" style="width: 100%;justify-content: center;display: flex;">
......
......@@ -8,13 +8,10 @@
<img style="margin-left:20px" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/seg-shms/seg-shms-logos.png" />
</nuxt-link> -->
<div class="logo-box">
<img
@click="goWebsite"
src="http://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/static/ezijing/logo/ezijing-logo.svg"
/>
<nuxt-link to="/home" class="logo">
<img @click="goWebsite" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/logo.png" />
<!-- <nuxt-link to="/home" class="logo">
<img src="https://webapp-pub.ezijing.com/project/seg-shms/shms0402.svg" />
</nuxt-link>
</nuxt-link> -->
</div>
<div class="user" v-if="user.id">
......
<template>
<ul class="nav-item-box" @mouseleave="navLeave">
<template v-for="(item, index) in navData">
<li :key="index">
<!-- <template v-for="(item, index) in navData"> -->
<li v-for="(item, index) in navData" :key="index">
<div :class="getNameActive(item)">
<template v-if="!item.path">
<template v-if="item.click">
......@@ -17,8 +17,9 @@
</div>
<div class="child-item" v-if="item.childern">
<div class="one-level">
<template v-for="(level2Item, level2Index) in item.childern">
<template>
<div
v-for="(level2Item, level2Index) in item.childern"
:class="$route.path === level2Item.path || level2Item.isShow ? 'li active' : 'li'"
:key="level2Index + 'level2'"
@mouseenter="levelShow(level2Item)"
......@@ -35,7 +36,7 @@
</div>
</div>
</li>
</template>
<!-- </template> -->
</ul>
</template>
<script>
......@@ -48,49 +49,15 @@ export default {
navData: [
{
name: this.$t('menu.project'),
path: '/project-intro/bg',
childern: [
{ 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' }
]
path: '/emba'
},
{
name: this.$t('menu.course'),
path: '/about/course',
childern: [
{ name: this.$t('menu.courseChild.set'), path: '/about/course' },
{ name: this.$t('menu.courseChild.teachers'), path: '/about/teacher' }
]
path: '/training'
},
{
name: this.$t('menu.news'),
path: '/news/hot',
childern: [
{ name: this.$t('menu.newsChild.hot'), path: '/news/hot' },
{ name: this.$t('menu.newsChild.interview'), path: '/news/interview' }
]
},
{
name: this.$t('menu.recruit'),
path: '/apply/relevant',
childern: [
{ 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: this.$t('menu.alumni'),
path: '/alumni/outstanding',
childern: [
{ name: this.$t('menu.alumniChild.outstanding'), path: '/alumni/outstanding' },
{ name: this.$t('menu.alumniChild.share'), path: '/alumni/sharing' }
]
},
{
name: this.$t('menu.enroll'),
path: '/my/account'
path: '/contact'
}
],
time: null
......
<template>
<div class="news-content-box">
<ul class="list-content">
<template v-for="(item, index) in data">
<template v-if="item.uri">
<a :href="item.uri" target="_black" :key="index">
<li>
<img :src="item.web_img_uri" alt="" />
<div class="right-con">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.abstract }}</div>
</div>
</li>
</a>
</template>
<template v-else>
<li :key="index" @click="handleClick(item)">
<img :src="item.web_img_uri" alt="" />
<div class="right-con">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.abstract }}</div>
</div>
</li>
</template>
</template>
</ul>
</div>
</template>
<script>
export default {
props: {
data: {
type: Array
}
},
data() {
return {
listData: []
}
},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
},
handleClick(item) {
this.$emit('onClick', item)
}
},
mounted() {
console.log(this.data)
}
}
</script>
<style lang="scss" scoped>
.news-content-box {
.list-content {
width: 900px;
margin: 0 auto;
background: #fff;
li {
display: flex;
flex-wrap: wrap;
border-bottom: 1px solid #e6e6e6;
margin-bottom: 20px;
padding-bottom: 36px;
cursor: pointer;
&:hover {
.right-con {
.text {
color: #141414;
}
}
}
img {
width: 320px;
height: 210px;
display: block;
}
.right-con {
width: 550px;
margin-left: 30px;
.time {
font-size: 16px;
font-weight: 300;
line-height: 100%;
color: #aa1941;
padding-top: 13px;
}
.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;
}
.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;
}
}
}
}
}
</style>
<template>
<div>
<div class="recommend-content">
<div class="titles">
<div class="line"></div>
<div class="text">相关推荐</div>
</div>
<ul class="list-box">
<li v-for="(item, index) in listData" :key="index">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" alt="" />
<div class="dec">{{ item.title }}</div>
</app-link>
</li>
</ul>
</div>
<div class="more-btn" @click="$router.push({ path: '/news/hot' })">查看更多</div>
</div>
</template>
<script>
import AppLink from '@/components/Link'
export default {
components: {
AppLink
},
data() {
return {
data: {},
listData: []
}
},
async fetch() {
const params = {
project_id: process.env.newProjectId,
type_tag: 'article_news_hot',
is_recommend: 1,
page: 1,
limit: 3
}
this.listData = await this.$axios.get('/api/cms/api/v1/articles', { params }).then(res => {
console.log(res.data.data)
return res.data.data
})
},
methods: {
goPage(item) {
if (item.source) {
window.open(item.source)
} else {
this.$router.push({ name: 'news-hot-id', params: { id: item.id } })
}
}
}
}
</script>
<style lang="scss" scoped>
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 37px;
.titles {
display: flex;
align-items: center;
.line {
width: 6px;
height: 22px;
background: #aa1941;
}
.text {
font-size: 22px;
color: #333333;
margin-left: 10px;
}
}
.list-box {
margin-top: 50px;
display: flex;
justify-content: space-between;
li {
width: 280px;
img {
width: 280px;
height: 184px;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 16px;
line-height: 26px;
color: #333333;
margin-top: 10px;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 164px;
height: 40px;
border: 1px solid #d3d3d3;
border-radius: 8px;
line-height: 40px;
text-align: center;
font-size: 16px;
color: #999999;
margin: 50px auto 0;
cursor: pointer;
}
</style>
<template>
<div class="banner-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">
<template v-if="item.uri">
<a :href="item.uri" target="_black">
<img :src="item.web_img_uri" />
</a>
</template>
<template v-else>
<img :src="item.web_img_uri" />
</template>
</div>
</div>
</div>
<!-- <template v-if="!isMobile">
<div class="prev-button"></div>
<div class="next-button"></div>
</template> -->
</div>
</template>
<script>
export default {
name: 'banner',
data() {
return {
listData: [
{
url: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/banner.png',
web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/banner.png'
}
],
swiperOption: {
speed: 400,
autoplay: true,
delay: 3000,
observer: true,
observerParent: true,
navigation: {
nextEl: '.next-button',
prevEl: '.prev-button'
},
loop: true
}
}
},
async fetch() {
// const params = { project_id: process.env.newProjectId, type_tag: 'ad_banner' }
// this.listData = await this.$axios.get('/api/cms/api/v1/advertisements', { params }).then(res => res.data.data)
},
computed: {
swiper() {
return this.$refs.mySwiper.swiper
},
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
methods: {
swiperStop() {
this.swiper.autoplay.stop()
},
swiperStart() {
this.swiper.autoplay.start()
}
}
}
</script>
<style lang="scss" scoped>
.banner-content {
position: relative;
width: 100%;
.swiper-wrapper {
width: 100%;
display: flex;
.swiper-slide {
width: 100%;
// float: left;
img {
width: 100%;
display: block;
}
}
}
.prev-button {
position: absolute;
top: 50%;
left: 30px;
width: 20px;
height: 35px;
background: url(https://zws-imgs-pub.ezijing.com/static/public/beb733466e5ab0168b459a55d198b084.png);
background-size: 100% 100%;
z-index: 999;
cursor: pointer;
}
.next-button {
position: absolute;
top: 50%;
right: 30px;
width: 20px;
height: 35px;
background: url(https://zws-imgs-pub.ezijing.com/static/public/e97f45b23a3e5ec4913f0069cc714baf.png);
background-size: 100% 100%;
z-index: 999;
cursor: pointer;
}
}
</style>
<template>
<div class="chance-box">
<card title="挑战和机遇" class="max-width-center">
<div class="chance-list" style="margin-top: 65px;">
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-1.png" />
</div>
<div class="title">管理能力不足</div>
<div class="dec">如何快速提升企业中高层的综合管理能力,满足企业快速发展的需要</div>
</div>
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-2.png" />
</div>
<div class="title">业绩增长缓慢</div>
<div class="dec">市场竞争激烈,如何打造一个销售铁军,让企业业绩持续增长?</div>
</div>
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-3.png" />
</div>
<div class="title">员工没有战斗力</div>
<div class="dec">管理者普遍没有带人带队伍经验,如何能培养能打胜仗的领导力?</div>
</div>
</div>
<div class="chance-list" style="margin-top: 30px;">
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-4.png" />
</div>
<div class="title">面对挑战缺少经验</div>
<div class="dec">专业知识缺乏,工作效率低,如何为专业人士提供更多方法与工具?</div>
</div>
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-5.png" />
</div>
<div class="title">战略落地难</div>
<div class="dec">如何帮助所有的管理者深入理解企业战略,并保证战略目标的分解与达成?</div>
</div>
<div class="chance-list_item">
<div class="icon">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/cha-6.png" />
</div>
<div class="title">跨部门沟通不畅</div>
<div class="dec">业务流程不合理,管理者沟通能力弱,如何克服部门间沟通不畅,促进跨部门协作?</div>
</div>
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: '',
components: {
Card
},
data() {
return {}
},
async fetch() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
methods: {}
}
</script>
<style lang="scss" scoped>
.chance-box {
padding-top: 90px;
padding-bottom: 80px;
background: #f9f8f8;
}
.chance-list {
display: flex;
justify-content: space-between;
.chance-list_item {
width: 380px;
height: 320px;
box-sizing: border-box;
padding: 49px 27px 0 32px;
background: #fff;
border-bottom: 3px solid #aa1941;
box-shadow: 0px 1px 12px 1px rgba(0, 0, 0, 0.13);
.icon {
height: 75px;
}
.title {
font-size: 22px;
font-weight: bold;
color: #333333;
line-height: 100%;
}
.dec {
font-size: 16px;
color: #666666;
line-height: 32px;
margin-top: 25px;
}
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div>
<card title="企业内训课堂" style="margin-top: 95px;" class="max-width-center">
<div class="env-list" style="margin-top: 77px;">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom1.png" />
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom2.png"
style="margin: 0 9px;"
/>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom3.png" />
</div>
<div class="env-list">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom4.png" />
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom5.png"
style="margin: 0 9px;"
/>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/classroom6.png" />
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'environment',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.env-list {
display: flex;
margin-bottom: 9px;
img {
width: 394px;
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div class="course-box">
<card title="内训课程" class="max-width-center">
<div class="course-list">
<div v-for="item in list">
<div class="course-list_item" v-for="cItem in item">
<div class="course_item__title">{{ cItem.title }}</div>
<div class="course_item__list">
<p v-for="p in cItem.items">{{ p }}</p>
</div>
</div>
</div>
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: '',
components: {
Card
},
data() {
return {
list: [
[
{
title: '高层综合管理课程',
items: [
'《战略规划——企业持续成功的基因》',
'《公司治理与股权设计》',
'《领导力》',
'《集团管控》',
'《企业管理沙盘模拟》',
'《企业文化建设》',
'《企业创新管理》',
'《增长五线》',
'《基于业务领先模型(BLM)模型详解战略从制定到执行》'
]
},
{
title: '资本运营',
items: [
'《企业价值挖掘》',
'《资本运营与企业并购》',
'《公司金融与投融资决策》',
'《企业上市与IPO》',
'《企业投融资与股权设计》',
'《商业模式设计》 '
]
},
{
title: '国有企业改革专题',
items: [
'《推动国有企业高质量发展》',
'《国企混改实操路径解决混改八大难题》',
'《国有资本投资公司运行模式及经验》',
'《提升外部董事履职能力助力国企高质量发展》',
'《国有企业党建与公司治理相融合》'
]
},
{
title: '中层综合管理课程',
items: [
'《中层管人综合管理能力提升》',
'《MTP迈向卓越领导者的实学与哲学》',
'《中高管角色认知与管理基础》',
'《高绩效团队打造》',
'《高效沟通技巧》',
'《高效执行力》',
'《问题分析与解决》',
'《跨部门沟通与协作》',
'《目标管理与计划实施》',
'《非人的人力资源管理》'
]
},
{
title: '人力资源管理课程',
items: [
'《战略人力资源管理》',
'《企业人才规划与选拔技巧》',
'《金牌面试官》',
'《如何搭建落地有效的培训体系》',
'《员工关系管理与劳动法实务》',
'《企业文化建设》',
'《战略招聘管理》',
'《基于业务的培训体系建设与创新》',
'《组织结构与职位说明》'
]
},
{
title: '营销管理课程',
items: [
'《品牌战略管理》',
'《市场营销管理》',
'《商务谈判技巧》',
'《大客户销售策略》',
'《打造狼性销售团队》',
'《销售能力与技巧提升》',
'《卓越渠道管理》',
'《新零售时代店铺拜访技巧》',
'《销售管理者的人力资源管理》'
]
}
],
[
{
title: '财务管理课程',
items: [
'《报表分析与业绩评价》',
'《现金流的有效管理及控制》',
'《企业风险管理与内部控制》',
'《全面预算管理》',
'《纳税筹划与风险控制》',
'《全面成本管理与风险控制》',
'《营销管理人员的财务管理》'
]
},
{
title: '生产管理课程',
items: [
'《精益生产革新》',
'《现场问题分析与解决》',
'《生产管理沙盘实战模拟训练》',
'《制造业成本控制与实战技法》',
'《质量为王-TQM全面质量管理》',
'《供应商管理-开发、评估与绩效》',
'《卓越PMC-生产计划与物料控制》'
]
},
{
title: '银行培训课程',
items: [
'《零售银行数字化转型同业领先实践与组织体系优化模式》',
'《新常态下网点综合营销技能提升》',
'《资产配置的底层逻辑与实战方案》',
'《银行零售综合营销能力提升实战训练》',
'《小微信贷营销策略指南》',
'《大客户“攻心”营销与关系维护实战训练》',
'《银行业绩高速成长的秘密武器-TOC瓶颈突破》',
'《个人金融业务开门红怎样抓住核心指标实现突破》',
'《大堂制胜——银行大堂经理综合能力提升》'
]
},
{
title: '财富管理课程',
items: [
'《高端客户维护与心理分析》',
'《资产配置实战能力提升》',
'《宏观经济金融形势与财富管理营销》',
'《家族信托、保险金信托、大额保单营销逻辑与技巧》',
'《房地产投资分析框架与投资策略》',
'《黄金投资分析框架与投资策略》',
'《资本市场大趋势有基金营销》',
'客户关系与谈资系列',
'《富人与风水》',
'《富人与信仰》',
'《富人与健康》',
'《富人与茶》',
'《富人与香》',
'《富人与财富圈》',
'《富人与艺术品》',
'《富人与子女教育》'
]
}
]
]
}
},
async fetch() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
methods: {}
}
</script>
<style lang="scss" scoped>
.course-box {
padding-top: 100px;
// padding-bottom: 82px;
.course-list {
display: flex;
justify-content: space-between;
padding-top: 58px;
.course-list_item {
width: 580px;
border-top: 1px solid #d1d1d1;
padding-top: 26px;
display: flex;
justify-content: space-between;
margin-bottom: 30px;
.course_item__title {
font-size: 18px;
font-weight: bold;
color: #aa1941;
line-height: 36px;
}
.course_item__list {
width: 400px;
&:nth-child(odd) {
p {
background: #fff;
}
}
p {
line-height: 30px;
font-size: 14px;
color: #333333;
padding-left: 20px;
box-sizing: border-box;
&:nth-child(odd) {
background: #fff;
}
}
}
}
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div class="ent-box">
<card title="部分服务过学员企业" class="max-width-center">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/ent-img.png" />
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'enterprise',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.ent-box {
margin-top: 95px;
padding: 78px 0 122px;
background-color: #fff;
img{
margin-top: 56px;
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div>
<card title="上课环境" style="margin-top: 95px;" class="max-width-center">
<div class="env-list" style="margin-top: 77px;">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-1.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-2.png" style="margin: 0 9px;" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-3.png" />
</div>
<div class="env-list">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-4.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-5.png" style="margin: 0 9px;" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/env-6.png" />
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'environment',
components: {
Card
},
data() {
return {}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.env-list {
display: flex;
margin-bottom: 9px;
img {
width: 394px;
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div class="process-box">
<card title="内训流程" class="max-width-center">
<div class="process-list">
<div class="line"></div>
<div class="process-list_item" v-for="(item, index) in list">
<div class="process_item__order">{{ index + 1 }}</div>
<div class="process_item__content">
<div class="process__content-title">{{ item.title }}</div>
<div class="process__content-text">
{{ item.dec }}
</div>
</div>
</div>
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: '',
components: {
Card
},
data() {
return {
list: [
{
title: '聚焦企业问题,组建合作小组',
dec:
'为了解决企业最关心的问题而设计教学项目,清控紫荆教育与企业组建针对本次培训项目的联合工作小组,课程主任在企业的协助之下发现潜在的问题和挑战,进而对企业的需求做出精准的评估。'
},
{
title: '培训需求分析,了解目标与现实差距',
dec:
'旨在深入了解企业面临的经营问题与管理挑战,工作小组将对客户企业进行有针对性的需求分析,围绕双方设定的共同目标,有选择的进行访谈调研及能力测评,以此作为定制课程设计的必要前提和基础。'
},
{
title: '提交建议草案',
dec:
'基于前期访谈调研及测评的报告,工作小组将组织课程主任、教授、企业培训负责人、学员代表等共同参与课程设计的讨论,确保能够有效提升目标人群的能力,解决目标人群的实际问题。'
},
{
title: '实施定制课程,提供解决方法',
dec:
'清控紫荆教育的教学团队将按照标准的服务流程,以高标准的服务标准负责所有课程的运营事宜。保证课程内容有理论、有方法、有工具、有案例,能落地,有实效。'
},
{
title: '行动反馈,效果评估',
dec:
'为了检验,评估和进一步优化学习体验,我们将利用学员反思论文进行小组分享、管理改进行动方案小组代表汇报、学员反馈工作改进交流等多种形式督促学员将课程学习与实际工作改进结合起来,做到“知行合一”。'
}
]
}
},
async fetch() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
mounted() {},
methods: {}
}
</script>
<style lang="scss" scoped>
.process-box {
padding-top: 76px;
padding-bottom: 82px;
background-color: #fff;
.process-list {
position: relative;
margin-left: 24px;
margin-top: 62px;
.line {
position: absolute;
top: 20px;
left: 23px;
width: 1px;
height: 600px;
background-color: #aa1941;
}
.process-list_item {
display: flex;
margin-bottom: 40px;
// justify-content: space-between;
.process_item__order {
position: relative;
z-index: 9;
width: 46px;
max-height: 49px;
line-height: 49px;
text-align: center;
font-size: 30px;
color: #fff;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/lc-icon.png);
background-size: 100% 100%;
}
.process_item__content {
width: 1065px;
margin-left: 34px;
.process__content-title {
font-size: 22px;
font-weight: bold;
color: #aa1941;
line-height: 50px;
border-bottom: 1px solid #d1d1d1;
}
.process__content-text {
font-size: 16px;
color: #333333;
line-height: 26px;
margin-top: 10px;
}
}
}
}
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
</style>
<template>
<div>
<div class="service-content max-width-center">
<div class="is-pc">
<card title="我们的优势">
<ul class="nav-content">
<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>
</div>
</template>
<script>
import Card from '@/components/Card'
import AppLink from '@/components/Link'
export default {
name: 'projectFeatures',
components: {
AppLink,
Card
},
data() {
return {
answerList: [
[
'《2023年中国宏观经济与政府政策解读》<br/>趋势力量',
'《股权架构设计与股权激励》<br/>治理力量',
'《全面注册制下资本运营与企业上市》<br/>资本力量',
'《品类定位升级,找到下一条增长曲线》<br/>模式力量'
],
[
'《构建激发团队的绩效管理体系》<br/>人才力量',
'《股权架构设计与股权激励》<br/>治理力量',
'《基于打胜仗的领导力》<br/>领导力量',
'《业财融合,企业战略执行的财务协同》<br/>财务力量',
'《复制成功,构建以客户为中心流程管理》<br/>流程力量'
],
[
'《财富管理与资产配置大时代背景》<br/>财富力量',
'《适合你的资产配置模型》<br/>配置力量',
'《穿越牛熊的资产配置策略》<br/>资产力量'
]
],
titleParams: {
name: this.$t('home.project.title')
},
data: [
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-1.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-1-a.png',
text: '源自清华<br />国企背景',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-2.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-2-a.png',
text: '全方位<br />培训管理',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-3.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-3-a.png',
text: '业内<br />名师云集',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-4.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-4-a.png',
text: '全面覆盖<br />各领域课程',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-5.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-5-a.png',
text: '多维度<br />学习支持',
path: '',
pathType: 0
},
{
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-6.png',
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/ys-6-a.png',
text: '强大的<br />资源平台',
path: '',
pathType: 0
}
]
}
},
methods: {
goPage(path) {
if (path === '') {
// this.$message('暂未开通,尽请期待。')
return
}
window.open(path)
}
},
mounted() {
console.log(this.isMobile)
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.question-box {
margin: 100px auto 0 !important;
.q-c {
background: #fff;
margin-top: 80px;
}
}
.answer-box {
background-color: #aa1941;
padding: 70px 0 80px;
margin-top: 95px;
.answer-list_all {
padding-top: 70px;
display: flex;
justify-content: space-between;
.answer-list {
.answer-list_item {
width: 378px;
height: 50px;
border: 1px solid #fff;
text-align: center;
line-height: 18px;
color: #fff;
padding-top: 5px;
box-sizing: border-box;
margin-bottom: 8px;
}
}
}
}
.service-content {
padding-top: 68px;
.nav-content {
display: flex;
justify-content: space-between;
padding-top: 70px;
li {
width: 156px;
height: 186px;
padding-top: 30px;
box-sizing: border-box;
// background: #f9f8f8;
border: 1px solid #d5d5d5;
background: #fff;
// box-shadow: 0px 4px 38px rgba(142, 30, 34, 0.41);
cursor: pointer;
transition: all 0.3s;
img {
width: 64px;
height: 64px;
display: block;
margin: 0 auto;
}
.icon-active {
display: none;
}
&:hover {
background: #aa1941;
box-shadow: 0px 4px 20px rgba(142, 30, 34, 0.41);
.text {
color: #fff;
}
.icon {
display: none;
}
.icon-active {
display: block;
}
}
.text {
font-size: 16px;
line-height: 26px;
color: #666666;
margin-top: 23px;
text-align: 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>
<template>
<div class="max-width-center teacher-box">
<card title="优秀师资">
<div style="margin-top: 50px;">
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in teacherList1">
<img :src="item.img" />
<div class="name">{{ item.name }}</div>
<div class="zc">{{ item.major }}</div>
<div class="dec" v-html="item.intr"></div>
</div>
</div>
</div>
</div>
<div style="margin-top: 20px;">
<div v-swiper:mySwiper2="swiperOption2" ref="mySwiper2">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in teacherList2">
<img :src="item.img" />
<div class="name">{{ item.name }}</div>
<div class="zc">{{ item.major }}</div>
<div class="dec" v-html="item.intr"></div>
</div>
</div>
</div>
</div>
</card>
</div>
</template>
<script>
import Card from '@/components/Card'
export default {
name: 'teacher',
components: {
Card
},
data() {
return {
teacherList1: [
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-1.png',
name: '王忠民',
major: '教授',
intr: '原全国社会保障基金理事会副理事长<br/>主讲:《新经济时代下的金融科技与创新》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2.png',
name: '刘玲玲',
major: '教授',
intr: '清华大学教授<br />主讲:《宏观经济》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-3.png',
name: '周立',
major: '教授',
intr: '清华大学教授<br />主讲:《企业价值挖掘》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-4.png',
name: '陈晋蓉',
major: '教授',
intr: '清华大学教授<br/>主讲:《资本运营》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-5.png',
name: '杨百寅',
major: '教授',
intr: '清华大学教授<br/>江南大学商学院特聘教授<br/>主讲:《人力资源开发与管理 》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-6.png',
name: '冯云霞',
major: '教授',
intr: '中国人民大学教授<br />主讲:《管理沟通 》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-7.png',
name: '郑永强',
major: '首席财务官',
intr:
'三井住友海上火灾保险(中国)公司CFO<br/>国际注册专业会计师协会<br/>全球董事会董事<br/>主讲:《企业数字化》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-8.png',
name: '朱冠舟',
major: '实战专家',
intr: '原金蝶软件副总裁兼中央大客户事业部总经理<br />清华、北大EMBA总裁班特聘教授<br />主讲:《大客户销售》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-9.png',
name: '夏惊鸣',
major: '合伙人',
intr: '华夏基石高级合伙人<br />中国科学院大学实践导师 <br />主讲:《领导力》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-10.png',
name: '徐怀玉',
major: '院长',
intr: '西姆国有经济研究院院长<br />大连理工大学兼职教授<br />主讲:《股权设计》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-11.png',
name: '程显礼',
major: '财富管理专家',
intr:
'原美国金融管理学会中国区副总裁<br />中国民营科技实业家协会高新技术产业分会理事长<br />主讲:《财富管理》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-12.png',
name: '郝启东',
major: '合伙人',
intr: '品类咨询联合创始人<br />北大创业训练营导师<br />黑马学院常驻导师<br />主讲:《品类定位升级》'
}
],
teacherList2: [
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-1.png',
name: '杨杜',
major: '教授',
intr: '中国人民大学教授<br/>主讲:《BEST管理沙盘模拟 》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-2.png',
name: '张恩忠',
major: '教授',
intr: '中国人民大学教授<br/>主讲:《市场营销 》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-3.png',
name: '钱栋玉',
major: '',
intr: '原A股金轮股份执行总裁 <br/>主讲:《绩效突破:多赢绩效体系建设 '
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-4.png',
name: '高皓',
major: '主任',
intr: '清华大学国家金融研究院全球家族企业研究中心主任<br/>主讲:《财富管理》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-5.png',
name: '肇越',
major: '首席经济学家',
intr: '香港致富证券有限公司首席经济学家<br />清华大学五道口金融学院硕士导师<br />主讲:《金融投资》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-6.png',
name: '王赛',
major: '合伙人',
intr:
'科特勒咨询集团(KMG)管理合伙人<br />清华大学商业模式研究中心<br />增长实验室主任<br />主讲:《增长五线》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-7.png',
name: '齐昊',
major: '财务管理专家',
intr:
'原TOM集团(2383HK)财务负责人<br />原澳大利亚KAPB集团财务副总裁<br />原阿里影业(01060HK)财务总监<br />主讲:《财务管理》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-8.png',
name: '岳三峰',
major: '总裁教练',
intr: '北大纵横合伙人<br />字节跳动飞书OKR教练<br />腾讯组织发展总监<br />主讲:《组织发展》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-9.png',
name: '赵剑海',
major: '博士',
intr:
'海朋资本创始人<br />原IDG资本副总裁<br />清华大学MBA校友理事会理事<br />央视《创业英雄汇》投资人嘉宾<br />主讲:《创业战略》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-10.png',
name: '贾奕琛',
major: '股权激励专家',
intr: '国牛投资董事长<br />清华大学五道口金融学院特聘教授<br />主讲:《股权激励》'
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/tea-2-11.png',
name: '王立中',
major: '院长',
intr: '深圳格物流程研究院院长<br />原华为流程优化经理<br />原维也纳酒店集团副总裁<br />主讲:《流程管理》'
}
],
swiperOption: {
speed: 400,
autoplay: true,
loop: true,
slidesPerView: 4,
paginationClickable: true,
spaceBetween: 50
},
swiperOption2: {
speed: 400,
autoplay: true,
loop: true,
slidesPerView: 4,
paginationClickable: true,
spaceBetween: 50
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
},
methods: {}
}
</script>
<style lang="scss" scoped>
.teacher-box {
padding-top: 95px;
}
.max-width-center {
width: 1200px;
margin: 0 auto;
}
.swiper-slide {
width: 260px;
height: 400px;
// padding: 30px 30px 0;
background-color: #fff;
box-sizing: border-box;
img {
width: 200px;
margin: 30px auto 0;
display: block;
}
.name {
font-size: 16px;
font-weight: bold;
color: #666666;
line-height: 100%;
margin-top: 15px;
text-align: center;
}
.zc {
font-size: 16px;
font-weight: bold;
color: #666666;
line-height: 100%;
margin-top: 5px;
text-align: center;
}
.dec {
color: #666666;
line-height: 18px;
font-size: 14px;
text-align: center;
margin-top: 10px;
}
}
.drill-box {
display: flex;
margin-top: 77px;
img {
width: 100%;
display: block;
}
.drill-l {
width: 233px;
}
.drill-c1 {
width: 475px;
margin-left: 8px;
.drill-c1_b {
display: flex;
justify-content: space-between;
margin-top: 8px;
img {
width: 233px;
}
}
}
.drill-c2 {
width: 233px;
margin-left: 8px;
}
.drill-r {
width: 233px;
margin-left: 8px;
}
}
</style>
......@@ -4,9 +4,9 @@ export default {
out: '退出',
fastLogin: '快速登录',
register: '注册',
project: '项目介绍',
course: '课程与师资',
news: '最新动态',
project: 'EMBA总裁班',
course: '企业内训',
news: '联系我们',
recruit: '招生信息',
alumni: '校友风采',
enroll: '报名申请',
......@@ -87,7 +87,7 @@ export default {
// 底部
foot: {
address: '地&nbsp;&nbsp;&nbsp;&nbsp;址:北京市海淀区中关村东路1号院清华科技园7号楼5层',
contact: '联系电话:010-62793909',
contact: '联系电话:010-62793299',
email: '邮&nbsp;&nbsp;&nbsp;&nbsp;箱:service@ezijing.com',
link1: '中国教育部',
link2: '教育涉外监管信息网',
......@@ -131,7 +131,8 @@ export default {
item2Txt2: '无需联考、快速入门的学习模式',
item2Txt3: '全方位的金融职业教育课程体系',
item3Tit: '学位全球认可,学籍官方可查',
item3Txt1: '学籍官方可查,全球认可。修满学分后,授予硕士学位。学位证书与出国留学所获得的学位证书相同。学员可实现全球就业。',
item3Txt1:
'学籍官方可查,全球认可。修满学分后,授予硕士学位。学位证书与出国留学所获得的学位证书相同。学员可实现全球就业。',
item3Txt2: '全球排名顶尖师资+中国金融界权威专家',
item3Txt3: '多次被 U.S. News & World Report评为全美第一'
},
......@@ -192,7 +193,8 @@ export default {
// 有关申请
apply: {
con1Tit: '申请条件',
con1Txt: '本科及以上学历<br />大专学历,需要至少【3】年以上款待业相关行业工作经验<br />管理岗位工作经验或企业推荐信<br />一定英语基础',
con1Txt:
'本科及以上学历<br />大专学历,需要至少【3】年以上款待业相关行业工作经验<br />管理岗位工作经验或企业推荐信<br />一定英语基础',
con2Tit: '报名流程',
con2Txt: `<span>提交材料</span><br />身份证<br />
推荐信<br />
......@@ -221,18 +223,22 @@ export default {
problem: {
item1Tit: '申请和面试相关问题',
item1problem1: 'Q: 如何如何申请瑞士酒店管理大学MBA?大概流程是什么?',
item1answer1: 'A: 本项目为申请面试制;<br />申请流程为:在线填写申请资料—初审通过—面试安排—综合评审—录取offer—学费缴纳及入学手续办理。',
item1answer1:
'A: 本项目为申请面试制;<br />申请流程为:在线填写申请资料—初审通过—面试安排—综合评审—录取offer—学费缴纳及入学手续办理。',
item1problem2: 'Q: 面试多少人?录取多少人?率取比率是多少?',
item1answer2: 'A: 本项目采取现场/视频面试的方式,面试人数和录取人数视申请人数和申请资质而定。',
item1problem3: 'Q: 是否要求考生的工作经验必须属于酒店行业?',
item1answer3: 'A: 本项目对考生的行业背景无特殊要求。欢迎有志于从事酒店行业或相关工作的考生报考。录取为综合考评,工作背景是综合考评时需要参考的一部分信息。',
item1answer3:
'A: 本项目对考生的行业背景无特殊要求。欢迎有志于从事酒店行业或相关工作的考生报考。录取为综合考评,工作背景是综合考评时需要参考的一部分信息。',
item1problem4: 'Q: 英语一般可以申请吗?',
item1answer4: 'A: 建议强化英语学习,可尝试申请。面试阶段会涉及英文面试,如果被录取,会有先修课程《金融英语》供学员提前学习。',
item1answer4:
'A: 建议强化英语学习,可尝试申请。面试阶段会涉及英文面试,如果被录取,会有先修课程《金融英语》供学员提前学习。',
item1problem5: 'Q: 本项目是在职还是全职?上课安排是怎样的?',
item1answer5:
'A: 本项目为在职金融硕士项目,采用线上学习和线下面授相结合的学习方式。在线学习每周1-2次实时课程,面授采用周末或短期集中上课形式,中英双语授课。紫荆和Kelley商学院各负责教学内容的百分之五十。课程最后安排一次美国访学(往返交通费用自理),时间为两周左右。',
item1problem6: 'Q: 本项目学制多久?获得的硕士学位证书与在美国全日制就读是否相同?',
item1answer6: 'A: 本项目学制15个月,修满学分达到毕业要求,印第安纳大学KELLEY商学院颁发学位证书,与美国本土全日制就读获得的学位证书完全相同。',
item1answer6:
'A: 本项目学制15个月,修满学分达到毕业要求,印第安纳大学KELLEY商学院颁发学位证书,与美国本土全日制就读获得的学位证书完全相同。',
item2Tit: '报考资格相关问题',
item2problem1: 'Q: 大专毕业后,又通过自考获得本科毕业证和学士学位,能否报考?',
item2answer1: 'A: 可以报考,只要获得专科及以上学位证书,即可报考。',
......
<template>
<div class="letter">
<header class="header">
<div class="inner">
<div class="logo">
<router-link to="/home"
><img src="https://webapp-pub.ezijing.com/project/application/images/ezijing-logo.png"
/></router-link>
</div>
</div>
</header>
<nav class="nav">
<h1 class="title">SHMS瑞士酒店管理大学MBA项目推荐信<br />SHMS MBA Recommendation Letter</h1>
</nav>
<section class="content">
<el-form
:model="ruleForm"
:rules="rules"
ref="form"
label-width="130px"
label-position="top"
@submit.native.prevent
>
<el-form-item label="推荐人姓名/Name of Referrer" prop="provider_name">
<el-input v-model="ruleForm.provider_name" @blur="onBlur('provider_name')"></el-input>
</el-form-item>
<el-form-item label="推荐信内容/Content of Recommendation Letter" prop="letter_content">
<el-input
type="textarea"
:autosize="{ minRows: 6 }"
v-model="ruleForm.letter_content"
@blur="onBlur('letter_content')"
></el-input>
</el-form-item>
<el-form-item label="推荐人手机号/Contact Number of Referrer" prop="provider_phone_number">
<el-input v-model="ruleForm.provider_phone_number"></el-input>
</el-form-item>
<el-form-item label="推荐人工作单位/Work Place of Referrer" prop="provider_company_name">
<el-input v-model="ruleForm.provider_company_name" @blur="onBlur('provider_company_name')"></el-input>
</el-form-item>
<el-form-item label="推荐人职务/Position/Title of Referrer" prop="provider_job_title">
<el-input v-model="ruleForm.provider_job_title" @blur="onBlur('provider_job_title')"></el-input>
</el-form-item>
</el-form>
<div class="buttons">
<el-button type="primary" @click="handleSubmit">确认提交/Submit</el-button>
</div>
</section>
<el-dialog title="推荐信提交成功" :visible.sync="dialogVisible" :center="true" width="348px">
<div style="text-align: center">
<img src="https://webapp-pub.ezijing.com/project/application/images/icon_success.png" />
</div>
<template #footer>
<el-button type="primary" @click="toHome">了解项目</el-button>
</template>
</el-dialog>
</div>
</template>
<script>
import * as api from '@/api/my'
export default {
name: 'LetterIndex',
data() {
return {
ruleForm: {
provider_name: '',
letter_content: '',
provider_phone_number: '',
provider_company_name: '',
provider_job_title: ''
},
rules: {
provider_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
letter_content: [{ required: true, message: '请输入推荐信内容', trigger: 'blur' }],
provider_phone_number: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: '请输入手机号', trigger: 'blur' }],
provider_company_name: [{ required: true, message: '请输入工作单位', trigger: 'blur' }],
provider_job_title: [{ required: true, message: '请输入职务', trigger: 'blur' }]
},
dialogVisible: false,
clientWidth: 0
}
},
computed: {
userId() {
return this.$route.params.userId
},
letterId() {
return this.$route.params.letterId
},
labelPosition() {
return this.clientWidth < 768 ? 'top' : 'left'
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(() => {
this.handleAddRequest()
})
},
// 提交推荐信
handleAddRequest() {
api.addLetter(this.userId, this.letterId, this.ruleForm).then(response => {
const { error, message } = response
if (error.toString() === '0') {
this.dialogVisible = true
} else {
this.$message.error(message)
}
})
},
toHome() {
this.$router.push('/')
},
getClientWidth() {
this.clientWidth = document.body.clientWidth
},
onBlur(key) {
if (this.ruleForm[key]) {
this.ruleForm[key] = this.ruleForm[key].trim()
}
}
},
mounted() {
this.getClientWidth()
document.body.style = 'background-color:#eee;'
window.addEventListener('resize', this.getClientWidth)
},
destroyed() {
document.body.style = ''
window.removeEventListener('resize', this.getClientWidth)
}
}
</script>
<style lang="scss" scoped>
.letter {
.header {
background-color: #fff;
.inner {
max-width: 1000px;
margin: 0 auto;
}
.logo {
padding: 14px 0;
img {
height: 50px;
}
}
}
.nav {
background-color: var(--main-color);
.title {
padding: 15px 0;
font-size: 24px;
font-weight: 600;
color: #fff;
line-height: 30px;
text-align: center;
}
}
.content {
max-width: 1000px;
margin: 20px auto;
padding: 20px;
background-color: #fff;
box-sizing: border-box;
}
::v-deep .el-input {
max-width: 270px;
}
::v-deep .el-form--label-top {
.el-form-item__label {
line-height: 20px;
}
.el-input {
max-width: 100%;
}
}
::v-deep .el-input__inner,
::v-deep .el-textarea__inner {
border-radius: 0;
}
.buttons {
border-top: 1px solid #f1f1f1;
padding: 20px 0;
}
@media (max-width: 767px) {
.logo {
text-align: center;
}
.buttons {
padding: 20px 0;
.el-button {
width: 100%;
display: block;
}
}
}
}
</style>
<template>
<div class="my">
<div class="card">
<div class="result">
<div class="result-left">
<img src="https://webapp-pub.ezijing.com/project/application/images/my_icon.png" />招生办反馈
</div>
<div class="result-right">{{ result.submit_status_desc || '未收到报名信息' }}</div>
</div>
</div>
<div class="card" style="min-height: 360px">
<ul class="nav">
<li class="nav-application" @click="toApplication"></li>
<li class="nav-interview" @click="toInterview"></li>
<li class="nav-admission" @click="toAdmission"></li>
</ul>
<div class="progress">
<el-steps :active="activeProgress" finish-status="success" align-center>
<el-step v-for="(item, index) in 3" :key="index">
<template #title>{{ getProgressStatusText(index) }}</template>
</el-step>
</el-steps>
</div>
</div>
<div class="welcome" v-if="welcomeShow">
<div class="inner">
<div class="welcome-close" @click="handleClose"></div>
<div class="welcome-main">
<img src="https://webapp-pub.ezijing.com/project/application/images/welcome.png" width="350" />
<div class="welcome-content">
<h1>欢迎您报考</h1>
<h2>SHMS瑞士酒店管理大学</h2>
<div class="welcome-button" @click="handleStart">马上开始</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/my'
import Driver from 'driver.js'
import 'driver.js/dist/driver.min.css'
export default {
name: 'AppHome',
data() {
return {
material: {},
progress: {},
submissionStage: {
0: ['FILLING', 'PREPAYMENT'],
1: ['INTERVIEW_APPLICATION', 'AUDITION', 'INTERVIEW', 'PAYMENT'],
2: ['REGISTRATION'],
3: ['CLOSED']
},
result: {},
welcomeShow: false
}
},
computed: {
user() {
return this.$store.state.user
},
activeProgress() {
for (const key in this.submissionStage) {
const list = this.submissionStage[key]
if (list.includes(this.material.submission_stage)) {
return parseInt(key)
}
}
return 0
}
},
methods: {
// 获取进度值
getProgressStatusText(index) {
if (this.activeProgress === index) {
return '进行中'
} else {
return this.activeProgress > index ? '已完成' : '待进行'
}
},
// 获取报名信息
getApplication() {
api.getApplication().then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
const { material, progress } = data
this.material = material
this.progress = progress
const welcomeShowed = window.localStorage.getItem(this.user.id) === 'true'
material.attachments = material.attachments || []
if (!material.attachments.length && !welcomeShowed) {
this.welcomeShow = true
}
} else {
this.$message.error(message)
}
})
},
// 获取报名审核状态
getApplicationStatus() {
api.getApplicationStatus().then(response => {
this.result = response.data
})
},
// 报名申请
toApplication() {
this.$router.push('/my/application?active=application_info')
},
// 申请面试
toInterview() {
if (this.activeProgress < 1) {
this.$message.warning('请完成报名申请并缴报名费')
return
}
this.$router.push('/my/interview')
},
// 办理入学
toAdmission() {
if (this.activeProgress < 2) {
this.$message.warning('请等待面试结果')
return
}
this.$router.push('/my/admission')
},
handleStart() {
this.welcomeShow = false
this.createDriver()
},
handleClose() {
this.welcomeShow = false
window.localStorage.setItem(this.user.id, true)
},
createDriver() {
const driver = new Driver({
opacity: '0.8',
padding: 5,
allowClose: false,
doneBtnText: '我知道了',
nextBtnText: '下一步',
onReset: () => {
window.localStorage.setItem(this.user.id, true)
}
})
// Define the steps for introduction
driver.defineSteps([
{
element: '.nav-application',
popover: {
className: 'first-step-popover-class',
title: '第一步:',
description: '点击<span style="color:#af1b40">报名申请</span>,进入基本信息的填写。',
position: 'bottom-right'
}
},
{
element: '.nav-interview',
popover: {
title: '第二步:',
description: '点击<span style="color:#af1b40">申请面试</span>,进入面试所需材料的上传。',
position: 'bottom-right'
}
},
{
element: '.nav-admission',
popover: {
title: '第三步:',
description: '点击<span style="color:#af1b40">办理入学</span>,进入办理入学材料的上传。',
position: 'bottom-right'
}
}
])
driver.start()
}
},
beforeMount() {
this.getApplication()
this.getApplicationStatus()
}
}
</script>
<style lang="scss" scoped>
.card {
background: #fff;
border-radius: 5px;
}
.card + .card {
margin-top: 10px;
}
.nav {
display: flex;
justify-content: space-between;
padding: 40px 70px 20px;
li {
position: relative;
width: 188px;
height: 128px;
cursor: pointer;
background-repeat: no-repeat;
background-size: contain;
background-position: center 2px;
}
}
.nav-application {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_01.png');
&:hover {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_01_hover.png');
}
}
.nav-interview {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_02.png');
&:hover {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_02_hover.png');
}
}
.nav-admission {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_03.png');
&:hover {
background-image: url('https://webapp-pub.ezijing.com/project/application/images/my_03_hover.png');
}
}
.result {
min-height: 40px;
padding: 0 20px;
display: flex;
align-items: center;
}
.result-left {
line-height: 14px;
color: var(--main-color);
img {
margin-right: 10px;
}
}
.result-right {
padding-left: 40px;
color: #666;
}
.progress {
margin: 0 40px;
}
.welcome {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.8);
z-index: 999;
}
.welcome-close {
float: right;
width: 23px;
height: 23px;
background: url('https://webapp-pub.ezijing.com/project/application/images/welcome_close.png') no-repeat;
background-size: contain;
cursor: pointer;
}
.welcome-main {
display: flex;
align-items: center;
}
.welcome-content {
text-align: center;
h1 {
font-size: 40px;
font-weight: 600;
color: #fff;
line-height: 56px;
}
h2 {
font-size: 26px;
font-weight: normal;
color: #fff;
line-height: 26px;
}
}
.welcome-button {
margin-top: 40px;
display: inline-block;
padding: 10px 32px;
font-size: 20px;
font-weight: 600;
color: #fff;
line-height: 20px;
border-radius: 5px;
border: 3px solid #fff;
cursor: pointer;
&:hover {
color: #af1b40;
background-color: #fff;
}
}
</style>
<style>
div#driver-popover-item {
padding: 10px;
max-width: 178px;
min-width: auto;
}
div#driver-popover-item .driver-popover-title {
font-size: 16px;
}
.driver-close-btn,
.driver-prev-btn {
display: none !important;
}
#driver-highlighted-element-stage {
border-radius: 8px !important;
}
div#driver-popover-item .driver-popover-footer {
text-align: center;
}
div#driver-popover-item .driver-popover-footer button {
background-color: #af1b40;
line-height: 36px;
color: #fff;
border-radius: 4px;
padding: 0 26px;
text-shadow: none;
border: 0;
}
div#driver-popover-item .driver-popover-footer .driver-btn-group {
float: none;
}
.driver-highlighted-element {
pointer-events: none;
}
</style>
<template>
<app-layout>
<vue-form
:menus="menus"
:default-active="currentActive"
@page-change="handlePageChange"
@success="handleSuccess"
@error="handleError"
@back="$router.push('/my/account')"
>
<template #aside-append>
<div class="aside-payment"><a href="https://accounts.ezijing.com/payment" target="_blank">查看缴费记录</a></div>
<div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
</template>
<!-- 首页 -->
<app-home v-if="currentActive === 'account'" />
<template #content>
<!-- 基本信息 -->
<app-info v-if="currentActive === 'account_info'" />
<!-- 密码修改 -->
<app-password v-if="currentActive === 'account_password'" />
</template>
</vue-form>
</app-layout>
</template>
<script>
import AppLayout from '../layout.vue'
import AppHome from './home.vue'
import AppInfo from './info.vue'
import AppPassword from './password.vue'
export default {
components: { AppLayout, AppHome, AppInfo, AppPassword },
data() {
return {
menus: [
{
id: 'account',
title: '个人信息',
children: [
{ id: 'account_info', title: '基本信息' },
{ id: 'account_password', title: '密码修改' }
]
}
],
currentActive: 'account'
}
},
watch: {
$route: {
immediate: true,
handler(route) {
const { query = {} } = route
this.currentActive = query.active || 'account'
}
}
},
methods: {
handlePageChange(value) {
this.currentActive = value
this.$router.push({ path: this.$route.path, query: { active: value } })
console.log('页面切换了', value)
},
handleSuccess(data) {
console.log('提交成功了', data)
this.$message({ type: 'success', message: data.message })
},
handleError(data) {
console.log('提交失败了', data)
this.$message({ type: 'error', message: data.message })
}
}
}
</script>
<template>
<div>
<el-form
:model="ruleForm"
:rules="rules"
ref="form"
label-width="100px"
@submit.native.prevent
style="max-width: 680px"
>
<el-form-item label="姓名" prop="real_name">
<el-input v-model.trim="ruleForm.real_name"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="mobile">
<el-input v-model.trim="ruleForm.mobile"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleSubmit">确认修改</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import * as api from '@/api/my'
export default {
name: 'MyInfo',
data() {
return {
ruleForm: {
real_name: '',
mobile: ''
},
rules: {
real_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }]
}
}
},
methods: {
getUser() {
api.getUser().then(response => {
const data = response.data
this.ruleForm.real_name = data.realname
this.ruleForm.mobile = data.mobile
})
},
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 接口请求
handleRequest() {
this.loading = true
api.updateUser(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 成功
handleSuccess(response) {
this.$alert('基本信息修改成功', {
type: 'success',
confirmButtonText: '返回报名系统',
callback: action => {
this.$router.push('/my')
}
})
}
},
beforeMount() {
this.getUser()
}
}
</script>
<style lang="scss" scoped>
::v-deep .el-input {
max-width: 270px;
}
</style>
<template>
<div>
<el-form :model="ruleForm" :rules="rules" ref="form" label-width="100px" @submit.native.prevent>
<el-form-item label="手机号" prop="account">
<el-input v-model.trim="ruleForm.account"></el-input>
</el-form-item>
<el-form-item prop="code" label="验证码">
<el-input v-model.trim="ruleForm.code" placeholder="请输入验证码">
<countdown
slot="suffix"
size="mini"
:disabled="disabledSend"
@start="sendCodeRequest"
ref="countdown"
></countdown>
</el-input>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input type="password" v-model.trim="ruleForm.password"></el-input>
</el-form-item>
<el-form-item label="确认密码" prop="passwordR">
<el-input type="password" v-model.trim="ruleForm.passwordR"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleSubmit">确认修改</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import * as api from '@/api/my'
import countdown from '@/components/countdown.vue'
export default {
name: 'MyPassword',
components: { countdown },
data() {
const validatePass = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'))
} else if (value !== this.ruleForm.password) {
callback(new Error('两次输入密码不一致!'))
} else {
callback()
}
}
return {
ruleForm: { account: '', code: '', password: '', passwordR: '' },
rules: {
account: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
password: [
{ required: true, message: '请输入新密码', trigger: 'blur' },
{ min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
],
passwordR: [
{ required: true, message: '请输入新密码', trigger: 'blur' },
{ validator: validatePass, trigger: 'blur' }
]
}
}
},
computed: {
disabledSend() {
const value = this.ruleForm.account
return !(/^1[3-9]\d{9}$/.test(value) || /@/.test(value))
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 接口请求
handleRequest() {
this.loading = true
api.updatePassword(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 成功
handleSuccess(response) {
this.$alert('密码修改成功,快去登录吧', '提示', {
type: 'success',
confirmButtonText: '去登录',
callback: action => {
this.$router.push('/login')
}
})
},
// 验证码
sendCodeRequest() {
api
.sendCode({ account: this.ruleForm.account })
.then(response => {
if (response.code === 0) {
this.$message({ type: 'success', message: '验证码已发送' })
} else {
// 停止计时
this.$refs.countdown.stop()
this.$message({ type: 'error', message: response.msg })
}
})
.catch(this.$refs.countdown.stop)
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .el-input {
max-width: 270px;
}
</style>
<template>
<div class="collapse" :class="classes">
<div class="collapse-hd">
<div class="collapse-icon" @click="toggle">
<i class="el-icon-remove-outline" v-if="isActive"></i>
<i class="el-icon-circle-plus-outline" v-else></i>
</div>
<div class="collapse-title">
<slot name="title">{{ title }}</slot>
</div>
</div>
<div class="collapse-bd" v-show="isActive">
<slot>{{ content }}</slot>
</div>
</div>
</template>
<script>
export default {
props: {
value: { type: Boolean, default: false },
title: { type: String },
content: { type: String }
},
data() {
return {
isActive: false
}
},
computed: {
classes() {
return { 'is-active': this.isActive }
}
},
methods: {
toggle() {
this.isActive = !this.isActive
this.$emit('input', this.isActive)
}
}
}
</script>
<style lang="scss" scoped>
.collapse {
margin-top: 10px;
}
.collapse-hd {
display: flex;
font-size: 14px;
line-height: 20px;
color: #222;
}
.collapse-icon {
margin-right: 6px;
font-size: 14px;
cursor: pointer;
color: #999;
}
.collapse-bd {
padding-left: 20px;
color: #666;
p {
color: #666 !important;
}
}
</style>
import xy from './xy'
// import xfjn from './xfjn'
export default function(_this) {
return {
id: 'admission',
title: '入学办理',
children: [xy(_this)]
}
}
export default {
id: 'admission_xfjn',
title: '学费缴纳',
html: `
<p><strong>一、对公收款银行信息:</strong></p>
<p>户名:清控紫荆( 北京)教育科技股份有限公司</p>
<p>帐号:694485289</p>
<p>开户行:中国民生银行股份有限公司北京魏公村支行</p>
<p style="margin-top:30px;"><strong>二、支付宝收款账户信息:</strong></p>
<p>支付宝账号:service@ezijing.com</p>
<p>支付宝户名:清控紫荆(北京)教育科技股份有限公司</p>
`
}
export default function(_this) {
return {
id: 'admission_xy',
title: '入学协议',
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 6
const ADMISSION_AGREEMENT = attachments.filter(item => {
return item.file_type_id === 'ADMISSION_AGREEMENT'
})
return { ADMISSION_AGREEMENT }
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/submit/${process.env.projectId}`,
beforeRequest(data) {
return { submission_stage: 'REGISTRATION' }
},
callback() {
this.form.options.disabled = true
},
errorCallback() {
_this.completeVisible = true
}
},
form: {
// next: { to: { query: { active: 'admission_xfjn' } } },
submitText: '提交',
options: { disabled: false },
items: [
{
type: 'v-upload',
required: true,
model: 'ADMISSION_AGREEMENT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'ADMISSION_AGREEMENT' }
},
rules: [{ type: 'array', required: true, message: '请上传入学协议', trigger: 'change' }],
prepend: `<p>请将签字后的入学协议原件扫描或拍照后提交,完成入学。点击下方按钮,上传文件</p>`
}
]
}
}
}
<template>
<app-layout>
<vue-form
:menus="menus"
:default-active="currentActive"
@page-change="handlePageChange"
@success="handleSuccess"
@error="handleError"
@back="$router.push('/my/account')"
@prev="handlePrev"
@next="handleNext"
@uploaded="getApplication"
>
<template #aside-append>
<div class="aside-payment"><a href="https://accounts.ezijing.com/payment" target="_blank">查看缴费记录</a></div>
<div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
</template>
<!-- 入学协议 -->
<!-- <template #content v-if="currentActive === 'admission_xy'">
<app-xy />
</template> -->
</vue-form>
<!-- <el-dialog
title="办理入学资料提交成功"
:visible.sync="dialogVisible"
:center="true"
:close-on-click-modal="false"
width="348px"
>
<div class="dialog-tips">
<p>请确认是否已缴费,如未缴费点击下方缴费按钮 <br />(已缴费,请忽略)</p>
<div class="icon"><img src="https://webapp-pub.ezijing.com/project/application/images/icon_success.png" /></div>
</div>
<template #footer>
<el-button type="primary" @click="toPay">立即缴费</el-button>
<el-button type="primary" @click="dialogVisible = false">忽略</el-button>
</template>
</el-dialog> -->
</app-layout>
</template>
<script>
import AppLayout from '../layout.vue'
import getMenu from './form'
import * as api from '@/api/my'
import AppXy from './xy'
export default {
components: { AppLayout, AppXy },
data() {
const menus = getMenu(this)
return {
menus: [menus],
currentActive: 'admission_xy',
dialogVisible: false,
detail: null
}
},
watch: {
$route: {
immediate: true,
handler(route) {
const { query = {} } = route
this.currentActive = query.active || 'admission_xy'
}
},
showSubmitedDialog(value) {
this.dialogVisible = value
}
},
computed: {
isSubmited() {
if (this.detail) {
return !!this.detail.material.attachments.find(item => item.file_type_id === 'ADMISSION_AGREEMENT')
}
return false
},
showSubmitedDialog() {
return this.isSubmited && this.currentActive === 'admission_xy'
}
},
methods: {
// 获取报名信息
getApplication() {
api.getApplication().then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
this.detail = data
} else {
this.$message.error(message)
}
})
},
handlePageChange(value) {
this.currentActive = value
this.$router.push({ path: this.$route.path, query: { active: value } })
console.log('页面切换了', value)
},
handleSuccess(data) {
console.log('提交成功了', data)
this.$message({ type: 'success', message: data.message })
},
handleError(data) {
console.log('提交失败了', data)
this.$message({ type: 'error', message: data.message })
},
handlePrev(to) {
this.$router.push(to)
},
handleNext(to) {
this.$router.push(to)
},
toPay() {
this.dialogVisible = false
this.$router.push({ path: '/my/admission', query: { active: 'admission_xfjn' } })
}
},
beforeMount() {
this.getApplication()
}
}
</script>
<style lang="scss" scoped>
.dialog-tips {
text-align: center;
p {
color: #262626;
line-height: 20px;
}
.icon {
margin-top: 20px;
text-align: center;
}
}
</style>
<template>
<div class="xy">
<div class="content">
<h1>入学协议</h1>
<p>
本入学协议(以下简称“本协议”)由清控紫荆(北京)教育科技股份有限公司(以下简称“紫荆教育”或“我们”)和学员(以下简称“学员”或“您”)签订。
</p>
<p>
1.
<b>请先仔细阅读本协议内容,尤其是字体加粗部分。</b>如您对本协议内容或页面提示信息有疑问,请勿进行下一步操作。<b
>您通过页面点击或其他方式确认,即表示您已同意并签署了入学协议。本协议自您成功缴纳学费之日起生效。</b
>
</p>
<p>
2.
请悉知本协议相关的课程介绍、入学相关规章制度等资料、注册协议、所报考项目院校的规章制度、本协议明确援引的其他协议及紫荆教育已经发布的或将来可能发布的各类协议和规则,系本协议的重要组成部分,与本协议具有同等法律效力。
</p>
<p>
3. 我们有权根据需要不时地制定、修改本协议或各类规则,如本协议有任何变更,<b
>我们将通过www.ezijing.com网站公告的方式提前予以公布,变更后的协议在公告届满30日起生效。</b
>
</p>
<br />
<p><b>入学须知</b></p>
<app-collapse>
<template #title>1.本协议可能涉及以下专用词语:</template>
<p><b>项目院校</b>(是指学员通过紫荆教育所报名的学位项目的合作大学);</p>
<p>
<b>学分</b
>(学员学习完每一门课程后所获得的分数。不同的课程有不同的分数值。学分是判断学员是否完成课程的标准。根据您所选择的项目课程具体情况予以具体要求,每门课程的考核会因为课程内容和教授的教学要求而不同,具体考核将会结合作业、作业、考试或报告、课程讨论等多部分综合评判,课程任课老师、紫荆教育与学位项目合作大学有是否通过考核的最终评判权);
</p>
<p>
<b>学制</b
>(是指项目院校对学习年限的规定。根据您所选择的项目课程具体情况予以具体要求;学员应保证充足的学习时间,在规定年限内完成项目课程。);
</p>
<p>
<b>学位证书</b
>(学员获取项目院校的学位证书,需满足以下条件:符合项目院校学位证书规定的学分数量、通过项目院校学位授予标准及紫荆教育有关考核、不存在违反项目院校的规章制度的行为。另,项目院校不同及学位证书不同,则最低学分要求可能也不同。项目院校及所在的国家地区可能会有附加要求。项目院校对获取学位证书的要求具有最终解释权。);
</p>
<p><b>校友会</b>(是紫荆教育官方发起的“紫荆校友会”,学员自愿参加。);</p>
<p>
<b>知识产权</b
>(本协议项下的知识产权包括但不限于商标、专利、著作权。我们对紫荆教育的商号、商标、logo等享有知识产权。为履行本协议,我们在线上平台及线下课程中向您提供的各种形式,包括但不限于文字、软件、声音、图片、录像、表格等的作品,我们都拥有前述作品完整的知识产权;未经我们许可,您不得擅自使用、修改、复制、录像、传播、改变、散布、发行或发表上述内容,无论是否以营利为目的;您的线上课程的账号,只供您本人使用。)。
</p>
</app-collapse>
<p>2.<b>入学项目:</b></p>
<p>
<b
>项目课程为【紫荆-瑞士酒店管理大学工商管理硕士MBA第1期】。该项目学制为【2】年,自当期项目课程开课之日起计算。</b
>如学员因个人原因需要延长学习期限的,须至少提前<b>【4】</b>个月申请延期,批准后方可延期毕业。最长可延期<b>【12】</b>个月,自所报名的项目课程原定毕业之日起算。
</p>
<p>
<b>课程的总学分为【30】学分,其中必修课【30】学分,选修课【0】分。课程成绩未通过需要重修或选修其它课程。</b
>重修或选修超规定的学分的,需按学分单价缴纳相关费用。
</p>
<app-collapse>
<template #title>3.<b>教学说明:</b></template>
<p>
(1)课程安排及调整。以我们和项目院校的具体安排为准。为了确保学员获得更好的课程,我们将在认为必要时,可能更新课程安排。
</p>
<p>(2)授课教师安排及调整。我们可能会调整相关课程的任课教师,该教师如与宣传材料不符以实际任课教师为准。</p>
</app-collapse>
<app-collapse>
<template #title>4.<b>费用。</b>本项目学费共计人民币【120000】元整,包含授课费用、证书费用,不包含:</template>
<p>学习期间的交通费、食宿费、邮寄费、书本费等费用;</p>
<p>海外学习、海外毕业典礼等费用;</p>
<p>毕业服装、纪念品、校友会活动等相关费用;</p>
<p>其他本协议未明示包括在学费内的费用。</p>
<p>
贷款。如您需贷款参加学习的,请自行向第三方银行或金融机构申请。请悉知,无论何种情形,我们不会为您与第三方的借贷关系承担连带或担保责任。
</p>
<p>
退费。自缴纳学费成功之日起10个自然日内,因个人原因申请退学的,我们将退还学费的80%。若超过10个自然日再提出退费申请的,将不予退费。
</p>
</app-collapse>
<app-collapse>
<template #title>5.<b>校友会及社群管理(以下将校友会及社群统称为“校友平台”)</b></template>
<p>
<b>自愿参与官方活动。</b
>为了促进学员之间的交流,我们可能分班、分期、分项目组建官方联络组,并组织各种校友线上、线下活动,您可视情况自愿选择参加。
</p>
<p>
<b>活动许可。</b
>为避免涉嫌未经审批的非法聚会的法律风险,未经我们许可,您不得以紫荆教育校友会或社群的官方名义开展各类活动。我们不干预学员之间的非官方交流。但学员不得在类似交流活动中使用紫荆教育的商号、商标、未经注册的标识等能与紫荆教育建立直接关联的素材。学员不得自行申请紫荆教育、项目院校相关的公众号、视频号、头条号等自媒体。
</p>
<p>
<b>禁止事项。</b
>您不得利用校友平台发布任何非法的或违反社会风序良俗的信息及资料,不发布损害紫荆教育声誉及商业利益的信息;不利用校友平台恶意透露其他学员他人隐私、个人信息或资料的;不误导、欺骗其他学员;不从事违反法律法规规定或干扰校友平台正常运营的行为等。
</p>
</app-collapse>
<p>6.<b>双方的权利义务</b></p>
<p>
<b>您需保证:</b
>自愿报名本项目并攻读该项目的学位;所提供的证件及填写的相关信息真实有效;严格遵守项目学校及紫荆教育的各项规章制度;按照紫荆教育专业培养方案的要求积极完成课程学习,并通过考核;不得做出有损项目学校及紫荆教育形象的行为和言论。
</p>
<p>
<b>我们将为您提供以下服务:</b
>就读期间,提供学习指导、学位授予及其他与学习相关的支持与协调工作;负责与项目院校协调、沟通学习情况;在现有技术基础上保障线上课程得以顺利进行。
</p>
<app-collapse>
<template #title>
7.<b>协议的解除与终止。</b>在下列情形下,我们有权终止本协议,已缴纳的学费不予退还。学员因下列行为给我们造成损失的,还应赔偿损失。
</template>
<p>(1)学员报名时伪造身份、学历证件的;</p>
<p>(2)学员违反学术纪律及规章制度的;</p>
<p>(3)学员违反本协议知识产权条款的,包括但不限于违规倒卖课程、违规使用听课账号等;</p>
<p>(4)学员违反校友会、社群规则给紫荆教育或其他学员造成损失或不良声誉的;</p>
<p>(5)其他严重影响紫荆教育或项目院校的声誉或利益的行为。</p>
</app-collapse>
<p>
8.
<b>不可抗力。</b
>因台风、地震、洪水、雷电、恐怖袭击、疫情防控、政治因素、院校调整等不可抗力原因导致线下课程、海外学习等活动无法正常开展的,我们将免于承担一切责任:
</p>
<p>
9.
<b>适用法律与管辖。</b>本协议的订立、效力、解释、履行和争议的解决均受中华人民共和国法律的管辖。<b
>因本协议的解释和履行产生争议的,均应提交北京市海淀区人民法院审理。</b
>
</p>
<p>
10.<b>通知。</b>所有发给学员的通知都可通过电子邮件、常规的信件或在紫荆教育平台网站显著位置公告的方式进行传送。
</p>
</div>
<div class="footer">
<el-checkbox size="medium" v-model="checked" :disabled="!!documentUrl">已阅读并同意上述合同</el-checkbox>
<el-button type="primary" :disabled="disabled" size="medium" @click="handlePrimary">{{ buttonText }}</el-button>
</div>
</div>
</template>
<script>
import AppCollapse from './components/collapse'
import * as api from '@/api/my'
export default {
components: { AppCollapse },
data() {
return {
checked: false,
sign: {},
documentUrl: '',
timer: null
}
},
watch: {
documentUrl: {
immediate: true,
handler(value) {
this.checked = !!value
}
}
},
computed: {
buttonText() {
return this.documentUrl ? '签署完成' : '立即签署'
},
disabled() {
return !this.checked || !!this.documentUrl
}
},
methods: {
createSign() {
api.createSign({ type: 'shms-agreement' }).then(response => {
const { code, data } = response
if (code === 1) {
this.sign = data
data.flowid && this.getSignDocument(data.flowid)
} else {
this.$message.error('处理签名失败')
}
})
},
getSignDocument(flowid) {
return api.getSignDocument({ flowid, type: 'shms-agreement' }).then(response => {
const { code, data } = response
if (code === 1) {
this.documentUrl = data.url
}
return response
})
},
setTimer() {
this.timer = setInterval(() => {
this.getSignDocument(this.sign.flowid).then(response => {
if (response.code === 1) {
this.$message({ type: 'success', message: '入学协议已签署完成' })
this.clearTimer()
}
})
}, 5000)
},
clearTimer() {
this.timer && clearInterval(this.timer)
},
handlePrimary() {
if (!this.sign.shortUrl) {
this.$message({ type: 'error', message: '缺少签名地址,请联系管理员' })
return
}
this.setTimer()
this.newWindowPreview(this.sign.shortUrl)
},
// 新窗口预览
newWindowPreview(url) {
const a = document.createElement('a')
a.href = url
a.target = '_blank'
document.body.appendChild(a)
a.click()
a.remove()
}
},
beforeMount() {
this.createSign()
},
destroyed() {
this.clearTimer()
}
}
</script>
<style lang="scss" scoped>
.xy {
h1 {
font-size: 18px;
font-weight: 600;
color: #222;
line-height: 25px;
text-align: center;
padding: 0 0 10px;
}
p {
margin-top: 10px;
font-size: 14px;
line-height: 20px;
color: #222;
}
.content {
height: 248px;
overflow-x: hidden;
overflow-y: auto;
& > p {
padding-left: 20px;
}
}
.footer {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid #f1f1f1;
}
}
</style>
<template>
<el-dialog
title="您当前完成进度如下:"
width="348px"
:center="true"
:close-on-click-modal="false"
:visible.sync="dialogVisible"
@open="handleOpen"
@close="handleClose"
>
<div>
<ul v-if="detail">
<li
v-for="item in currentOptions"
:class="progress[item.code].progress === 1 ? 'is-success' : 'is-error'"
:key="item.code"
>
<span class="name">{{ item.title }}</span>
<span class="line"></span>
<span class="status">{{ progress[item.code].progress === 1 ? '已完成' : '未完成' }}</span>
<span class="view" @click="handleView(item.view.to)">立即查看</span>
</li>
</ul>
</div>
<template #footer>
<el-button type="primary" @click="dialogVisible = false">我知道啦</el-button>
</template>
</el-dialog>
</template>
<script>
import * as api from '@/api/my'
export default {
props: { value: { type: Boolean, default: false }, type: { type: Number, default: 0 } },
data() {
return {
dialogVisible: false,
detail: null,
progress: {},
options: [
[
{
title: '个人资料',
code: 'applicaitonInfo',
view: { to: { path: '/my/application', query: { active: 'application_info' } } }
},
{
title: '推荐信',
code: 'applicationTjx',
view: { to: { path: '/my/application', query: { active: 'application_tjx' } } }
}
// {
// title: '无犯罪证明',
// code: 'applicationWfzzm',
// view: { to: { path: '/my/application', query: { active: 'application_wfzzm' } } }
// }
],
[
{
title: '毕业证书',
code: 'interviewByz',
view: { to: { path: '/my/interview', query: { active: 'interview_byz' } } }
},
{
title: '成绩单',
code: 'interviewCjd',
view: { to: { path: '/my/interview', query: { active: 'interview_cjd' } } }
},
{
title: '2寸照片',
code: 'interviewZp',
view: { to: { path: '/my/interview', query: { active: 'interview_zp' } } }
},
{
title: '推荐信',
code: 'interviewTjx',
view: { to: { path: '/my/application', query: { active: 'application_tjx' } } }
}
]
]
}
},
watch: {
value: {
immediate: true,
handler(value) {
this.dialogVisible = value
}
}
},
computed: {
currentOptions() {
return this.options[this.type]
}
},
methods: {
// 获取报名信息
getApplication() {
api.getApplication(this.$route.query).then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
const { progress } = data
this.detail = data
const fillingMissedRequiredList = progress.FILLING.attachments.missed_required_list
// 个人资料
const applicaitonInfo = { progress: 0 }
const infoRequriedList = ['basic_info', 'educations', 'careers', 'answers']
for (const key of infoRequriedList) {
if (progress.FILLING[key].progress < 1) {
applicaitonInfo.progress = 0
break
}
applicaitonInfo.progress = 1
}
if (applicaitonInfo.progress === 1 && !fillingMissedRequiredList.ID_CARD_PHOTO) {
applicaitonInfo.progress = 1
} else {
applicaitonInfo.progress = 0
}
// 推荐信
const applicationTjx = { progress: 0 }
applicationTjx.progress = progress.FILLING.reco_letters ? progress.FILLING.reco_letters.progress : 0
// 无犯罪证明
const applicationWfzzm = { progress: 0 }
applicationWfzzm.progress = fillingMissedRequiredList.NO_CRIMINAL_CERT ? 0 : 1
const missedRequiredList = progress.INTERVIEW_APPLICATION.attachments.missed_required_list
// 毕业证书
const interviewByz = { progress: 0 }
interviewByz.progress = missedRequiredList.DIPLOMA_CN ? 0 : 1
// 学位证书
const interviewXwzs = { progress: 0 }
interviewXwzs.progress = missedRequiredList.DEGREE_CERT_CN ? 0 : 1
// 成绩单
const interviewCjd = { progress: 0 }
interviewCjd.progress = missedRequiredList.REPORT_CARD_CN || missedRequiredList.REPORT_CARD_EN ? 0 : 1
// 2寸照片
const interviewZp = { progress: 0 }
interviewZp.progress = missedRequiredList.PERSONAL_PHOTO_FOR_ID ? 0 : 1
// 推荐信
const interviewTjx = { progress: 0 }
interviewTjx.progress = progress.INTERVIEW_APPLICATION.reco_letters.progress
this.progress = {
applicaitonInfo,
applicationTjx,
applicationWfzzm,
interviewByz,
interviewXwzs,
interviewCjd,
interviewZp,
interviewTjx
}
} else {
this.$message.error(message)
}
})
},
handleView(to) {
this.dialogVisible = false
this.$router.push(to)
},
handleOpen() {
this.getApplication()
},
handleClose() {
this.$emit('input', this.dialogVisible)
}
}
}
</script>
<style lang="scss" scoped>
li {
padding: 10px 0;
display: flex;
align-items: center;
}
.name {
width: 80px;
text-align: right;
}
.line {
width: 40px;
height: 1px;
margin: 0 10px;
background-color: #ccc;
}
.is-success {
.status {
color: #33c011;
}
}
.is-error {
.status {
color: #af1b40;
}
}
.view {
margin-left: 40px;
color: #57acff;
text-decoration: underline;
cursor: pointer;
}
</style>
<template>
<div class="h5pay">
<el-button type="primary" @click="handlePay">去支付</el-button>
</div>
</template>
<script>
import * as api from '@/api/my'
export default {
data() {
return {
openId: window.localStorage.getItem('open_id')
}
},
computed: {
pageUrl() {
return window.location.origin + this.$route.path + '?active=application_pay'
}
},
methods: {
// 获取订单
getOrder(callback) {
api.getOrder({ wx_open_id: this.openId, payment_method: 'WX_PAY' }).then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
this.order = data
this.$emit('update', this.order)
callback && callback(this.order)
} else {
this.$message.error(message)
}
})
},
// 获取微信code
getCode() {
const redirectURI = `https://pages.ezijing.com/given/auth.html?redirect_uri=${encodeURIComponent(this.pageUrl)}`
window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx451c01d40d090d7a&redirect_uri=${redirectURI}&response_type=code&scope=snsapi_base#wechat_redirect`
},
// 获取微信openid
getOpenId(code) {
api.getOpenId({ code, identity: 'ezijing' }).then(response => {
if (response.code === 0) {
this.openId = response.openid
window.localStorage.setItem('open_id', this.openId)
this.getOrder()
} else {
this.getCode()
}
})
},
// 去支付
handlePay() {
this.getOrder(() => {
window.location.href = `https://web-pay.ezijing.com/wxpay/h5?prepay_id=${this.order.wx_prepay_id}&open_id=${
this.openId
}&redirect_uri=${encodeURIComponent(this.pageUrl)}`
})
}
},
beforeMount() {
if (!this.openId) {
const { code } = this.$route.query
code ? this.getOpenId(code) : this.getCode()
}
}
}
</script>
<style scoped>
.h5pay {
padding: 40px;
text-align: center;
}
</style>
<template>
<div class="qrpay">
<div class="qrpay-hd">
<div class="pic">
<img src="https://webapp-pub.ezijing.com/project/application/images/my_pay_01.png" />
</div>
<h1>欢迎您</h1>
<p class="t1">
申请SHMS瑞士酒店管理大学MBA项目,本项目的注册费,申请费共计<span>1000</span>元,请扫描二维码缴费以完成报名。
</p>
</div>
<div class="qrcode-error" v-if="qrcodeError">
生成二维码失败请刷新<i class="el-icon-refresh-left" @click="getOrder" title="刷新"></i>
</div>
<div class="qrcode" v-else>
<qrcode-vue :value="qrcodeValue" size="100"></qrcode-vue>
<span @click="getOrder">刷新</span>
</div>
</div>
</template>
<script>
import QrcodeVue from 'qrcode.vue'
import * as api from '@/api/my'
export default {
components: { QrcodeVue },
data() {
return {
order: { id: '', payment_url: '' },
qrcodeError: false
}
},
computed: {
// 二维码地址
qrcodeValue() {
return this.order.payment_url
}
},
methods: {
// 获取订单
getOrder() {
api.getOrder({ payment_method: 'WX_PAY_QR' }).then(response => {
const { data, error, message } = response
this.qrcodeError = error.toString() === '1'
if (error.toString() === '0') {
this.order = data
this.$emit('update', this.order)
} else {
this.$message.error(message)
}
})
}
},
beforeMount() {
this.getOrder()
}
}
</script>
<style lang="scss" scoped>
.qrpay-hd {
.pic {
text-align: center;
}
h1 {
padding: 10px 0;
font-size: 24px;
font-weight: 500;
color: #222;
line-height: 1;
text-align: center;
}
}
.qrcode {
padding: 20px 0;
text-align: center;
span {
margin-top: 10px;
font-size: 12px;
color: #999;
cursor: pointer;
}
}
.qrcode-error {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 100px;
height: 100px;
padding: 10px;
margin: 20px auto;
color: var(--main-color);
border-style: dashed;
border-width: 1px;
border-color: var(--main-color);
box-sizing: border-box;
text-align: center;
i {
margin-top: 10px;
cursor: pointer;
}
}
.t1 {
font-size: 14px;
color: #303030;
line-height: 20px;
text-align: center;
span {
color: #ffa448;
}
}
</style>
/**
* 申请声明
*/
export default function(_this) {
return {
id: 'application_declare',
title: '申请声明',
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { submission_stage: submissionStage = 'FILLING' } = data.data.material
const isSubmited = submissionStage !== 'FILLING'
this.form.options.disabled = isSubmited
if (isSubmited) {
return { isAgree: [1] }
}
return { isAgree: [] }
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/submit/${process.env.projectId}`,
callback() {
_this.getApplication()
this.form.options.disabled = true
_this.$router.push({ path: this.$route.path, query: { active: 'application_pay' } })
},
errorCallback() {
_this.completeVisible = true
}
},
form: {
prev: { to: { query: { active: 'application_tjx' } } },
submitText: '提交报名申请',
model: { isAgree: [] },
options: {},
items: [
{
type: 'v-checkbox',
values: [{ label: '同意', value: 1 }],
model: 'isAgree',
rules: [{ required: true, message: '请阅读协议', trigger: 'change' }],
prepend:
'<p>本人自愿申请SHMS瑞士酒店管理大学MBA项目,所有申请表内填写的内容属实,大专/本科学位属实,没有弄虚作假的行为。如有虚假,愿承担一切法律责任。</p>'
}
]
}
}
}
import info from './info'
import tjx from './tjx'
// import wfzsm from './wfzzm'
import declare from './declare'
export default function(_this) {
return {
id: 'application',
title: '报名申请',
children: [
info(_this),
tjx(_this),
// wfzsm(_this),
declare(_this),
{
id: 'application_pay',
title: '缴报名费',
show: false,
visible() {
return _this.visible
}
}
]
}
}
import first from './info/first'
import profile from './info/profile'
import education from './info/education'
import career from './info/career'
import honor from './info/honor'
import training from './info/training'
import answer from './info/answer'
export default function(_this) {
return {
id: 'application_info',
title: '个人资料',
tabs: [first(_this), profile(_this), education(_this), career(_this), answer(_this), training(_this), honor(_this)]
}
}
/**
* 学习目的
*/
export default function(_this) {
return {
id: 'application_info_answer',
title: '学习目的',
required: true,
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { answers = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
const [first = {}, second = {}] = answers
return {
qid1: first.qid || '1',
question1: '这个MBA项目对你将来的职业发展有什么好处?你的职业发展目标是什么?',
answer1: first.answer,
qid2: second.qid || '2',
question2: '您参加过其他的培训项目有哪些?请列出来。你是如何从这些学习经验中获益的?',
answer2: second.answer
}
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
return {
answers: [
{ qid: data.qid1, question: data.question1, answer: data.answer1 },
{ qid: data.qid2, question: data.question2, answer: data.answer2 }
]
}
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_career' } }, isSubmit: true },
next: { to: { query: { active: 'application_info', tab: 'application_info_training' } }, isSubmit: true },
options: {},
items: [
{
type: 'v-input',
label: '这个MBA项目对你将来的职业发展有什么好处?你的职业发展目标是什么?',
model: 'answer1',
attrs: { type: 'textarea', rows: '8', maxlength: '1000', style: 'width:100%' },
rules: [
{ required: true, message: '请输入', trigger: 'blur' },
{ min: 60, max: 1000, message: '长度在 60 到 1000 个字符', trigger: 'blur' }
]
},
{
type: 'v-input',
label: '您参加过其他的培训项目有哪些?请列出来。你是如何从这些学习经验中获益的?',
model: 'answer2',
attrs: { type: 'textarea', rows: '8', maxlength: '1000', style: 'width:100%' },
rules: [
{ required: true, message: '请输入', trigger: 'blur' },
{ min: 60, max: 1000, message: '长度在 60 到 1000 个字符', trigger: 'blur' }
]
}
]
}
}
}
/**
* 工作经验
*/
export default function(_this) {
return {
id: 'application_info_career',
title: '工作经验',
required: true,
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { careers: list = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
return list.length ? list : [{}]
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
const careers = data.map(item => {
return [
'start_date',
'end_date',
'company_name_cn',
'industry',
'dept_cn',
'position_cn',
'job_desc_cn'
].reduce((result, key) => {
result[key] = item[key]
return result
}, {})
})
return { careers }
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_education' } }, isSubmit: true },
next: { to: { query: { active: 'application_info', tab: 'application_info_answer' } }, isSubmit: true },
hasAdd: true,
options: { labelWidth: '140px' },
items: [
{
type: 'v-datepicker',
label: '开始时间',
model: 'start_date',
attrs: {
type: 'month',
placeholder: '请选择工作开始时间',
valueFormat: 'yyyy-MM'
},
rules: [{ required: true, message: '请选择工作开始时间', trigger: 'blur' }]
},
{
type: 'v-datepicker',
label: '结束时间',
model: 'end_date',
attrs: {
type: 'month',
placeholder: '请选择工作结束时间',
valueFormat: 'yyyy-MM'
},
rules: [{ required: true, message: '请选择工作结束时间', trigger: 'blur' }]
},
{
type: 'v-input',
label: '工作单位',
model: 'company_name_cn',
attrs: { placeholder: '请输入工作单位' },
rules: [{ required: true, message: '请输入工作单位', trigger: 'blur' }]
},
{
type: 'v-select',
values: [
{ value: '互联网/电子商务' },
{ value: '基金/证券/期货/投资' },
{ value: '保险' },
{ value: '银行' },
{ value: '信托/担保/拍卖/典当' },
{ value: '计算机软件' },
{ value: 'IT服务(系统/数据/维护)' },
{ value: '电子技术/半导体/集成电路' },
{ value: '计算机硬件' },
{ value: '通信/电信/网络设备' },
{ value: '通信/电信运营、增值服务' },
{ value: '网络游戏' },
{ value: '房地产/建筑/建材/工程' },
{ value: '家居/室内设计/装饰装潢' },
{ value: '物业管理/商业中心' },
{ value: '专业服务/咨询(财会/法律/人力资源等)' },
{ value: '广告/会展/公关' },
{ value: '中介服务' },
{ value: '检验/检测/认证' },
{ value: '外包服务' },
{ value: '快速消费品(食品/饮料/烟酒/日化)' },
{ value: '耐用消费品(服饰/纺织/皮革/家具/家电)' },
{ value: '贸易/进出口' },
{ value: '零售/批发' },
{ value: '租赁服务' },
{ value: '教育/培训/院校' },
{ value: '礼品/玩具/工艺美术/收藏品/奢侈品' },
{ value: '汽车/摩托车' },
{ value: '大型设备/机电设备/重工业' },
{ value: '加工制造(原料加工/模具)' },
{ value: '仪器仪表及工业自动化' },
{ value: '印刷/包装/造纸' },
{ value: '办公用品及设备' },
{ value: '医药/生物工程' },
{ value: '医疗设备/器械' },
{ value: '航空/航天研究与制造' },
{ value: '交通/运输,物流/仓储' },
{ value: '医疗/护理/美容/保健/卫生服务' },
{ value: '酒店/餐饮,旅游/度假,媒体/出版/影视/文化传播' },
{ value: '娱乐/体育/休闲' },
{ value: '能源/矿产/采掘/冶炼' },
{ value: '石油/石化/化工,电气/电力/水利' },
{ value: '环保' },
{ value: '政府/公共事业/非盈利机构' },
{ value: '学术/科研,农/林/牧/渔跨领域经营' },
{ value: '其他' }
],
label: '行业类别',
model: 'industry',
rules: [{ required: true, message: '请选择行业类别', trigger: 'change' }]
},
{
type: 'v-input',
label: '工作部门',
model: 'dept_cn',
attrs: { placeholder: '请输入工作部门' },
rules: [{ required: true, message: '请输入工作部门', trigger: 'blur' }]
},
{
type: 'v-input',
label: '工作职位',
model: 'position_cn',
attrs: { placeholder: '请输入工作职位' },
rules: [{ required: true, message: '请输入工作职位', trigger: 'blur' }]
},
{
type: 'v-input',
label: '工作描述',
model: 'job_desc_cn',
attrs: {
type: 'textarea',
placeholder: '请输入工作描述',
rows: '8',
maxlength: '3000'
},
rules: [{ required: true, message: '请输入工作描述', trigger: 'blur' }]
}
]
}
}
}
export default [
{ label: '中国', value: '中国' },
{ label: '阿富汗', value: '阿富汗' },
{ label: '奥兰群岛', value: '奥兰群岛' },
{ label: '阿尔巴尼亚', value: '阿尔巴尼亚' },
{ label: '阿尔及利亚', value: '阿尔及利亚' },
{ label: '美属萨摩亚', value: '美属萨摩亚' },
{ label: '安道尔', value: '安道尔' },
{ label: '安哥拉', value: '安哥拉' },
{ label: '安圭拉', value: '安圭拉' },
{ label: '安提瓜和巴布达', value: '安提瓜和巴布达' },
{ label: '阿根廷', value: '阿根廷' },
{ label: '亚美尼亚', value: '亚美尼亚' },
{ label: '阿鲁巴', value: '阿鲁巴' },
{ label: '澳大利亚', value: '澳大利亚' },
{ label: '奥地利', value: '奥地利' },
{ label: '阿塞拜疆', value: '阿塞拜疆' },
{ label: '孟加拉', value: '孟加拉' },
{ label: '巴林', value: '巴林' },
{ label: '巴哈马', value: '巴哈马' },
{ label: '巴巴多斯', value: '巴巴多斯' },
{ label: '白俄罗斯', value: '白俄罗斯' },
{ label: '比利时', value: '比利时' },
{ label: '伯利兹', value: '伯利兹' },
{ label: '贝宁', value: '贝宁' },
{ label: '百慕大', value: '百慕大' },
{ label: '不丹', value: '不丹' },
{ label: '玻利维亚', value: '玻利维亚' },
{ label: '波斯尼亚和黑塞哥维那', value: '波斯尼亚和黑塞哥维那' },
{ label: '博茨瓦纳', value: '博茨瓦纳' },
{ label: '布维岛', value: '布维岛' },
{ label: '巴西', value: '巴西' },
{ label: '文莱', value: '文莱' },
{ label: '保加利亚', value: '保加利亚' },
{ label: '布基纳法索', value: '布基纳法索' },
{ label: '布隆迪', value: '布隆迪' },
{ label: '柬埔寨', value: '柬埔寨' },
{ label: '喀麦隆', value: '喀麦隆' },
{ label: '加拿大', value: '加拿大' },
{ label: '佛得角', value: '佛得角' },
{ label: '中非', value: '中非' },
{ label: '乍得', value: '乍得' },
{ label: '智利', value: '智利' },
{ label: '圣诞岛', value: '圣诞岛' },
{ label: '科科斯(基林)群岛', value: '科科斯(基林)群岛' },
{ label: '哥伦比亚', value: '哥伦比亚' },
{ label: '科摩罗', value: '科摩罗' },
{ label: '刚果(金)', value: '刚果(金)' },
{ label: '刚果', value: '刚果' },
{ label: '库克群岛', value: '库克群岛' },
{ label: '哥斯达黎加', value: '哥斯达黎加' },
{ label: '科特迪瓦', value: '科特迪瓦' },
{ label: '克罗地亚', value: '克罗地亚' },
{ label: '古巴', value: '古巴' },
{ label: '捷克', value: '捷克' },
{ label: '塞浦路斯', value: '塞浦路斯' },
{ label: '丹麦', value: '丹麦' },
{ label: '吉布提', value: '吉布提' },
{ label: '多米尼加', value: '多米尼加' },
{ label: '厄瓜多尔', value: '厄瓜多尔' },
{ label: '埃及', value: '埃及' },
{ label: '赤道几内亚', value: '赤道几内亚' },
{ label: '厄立特里亚', value: '厄立特里亚' },
{ label: '爱沙尼亚', value: '爱沙尼亚' },
{ label: '埃塞俄比亚', value: '埃塞俄比亚' },
{ label: '法罗群岛', value: '法罗群岛' },
{ label: '斐济', value: '斐济' },
{ label: '芬兰', value: '芬兰' },
{ label: '法国', value: '法国' },
{ label: '法国大都会', value: '法国大都会' },
{ label: '法属圭亚那', value: '法属圭亚那' },
{ label: '法属波利尼西亚', value: '法属波利尼西亚' },
{ label: '加蓬', value: '加蓬' },
{ label: '冈比亚', value: '冈比亚' },
{ label: '格鲁吉亚', value: '格鲁吉亚' },
{ label: '德国', value: '德国' },
{ label: '加纳', value: '加纳' },
{ label: '直布罗陀', value: '直布罗陀' },
{ label: '希腊', value: '希腊' },
{ label: '格林纳达', value: '格林纳达' },
{ label: '瓜德罗普岛', value: '瓜德罗普岛' },
{ label: '关岛', value: '关岛' },
{ label: '危地马拉', value: '危地马拉' },
{ label: '根西岛', value: '根西岛' },
{ label: '几内亚比绍', value: '几内亚比绍' },
{ label: '几内亚', value: '几内亚' },
{ label: '圭亚那', value: '圭亚那' },
{ label: '海地', value: '海地' },
{ label: '洪都拉斯', value: '洪都拉斯' },
{ label: '匈牙利', value: '匈牙利' },
{ label: '冰岛', value: '冰岛' },
{ label: '印度', value: '印度' },
{ label: '印度尼西亚', value: '印度尼西亚' },
{ label: '伊朗', value: '伊朗' },
{ label: '伊拉克', value: '伊拉克' },
{ label: '爱尔兰', value: '爱尔兰' },
{ label: '马恩岛', value: '马恩岛' },
{ label: '以色列', value: '以色列' },
{ label: '意大利', value: '意大利' },
{ label: '牙买加', value: '牙买加' },
{ label: '日本', value: '日本' },
{ label: '泽西岛', value: '泽西岛' },
{ label: '约旦', value: '约旦' },
{ label: '哈萨克斯坦', value: '哈萨克斯坦' },
{ label: '肯尼亚', value: '肯尼亚' },
{ label: '基里巴斯', value: '基里巴斯' },
{ label: '韩国', value: '韩国' },
{ label: '朝鲜', value: '朝鲜' },
{ label: '科威特', value: '科威特' },
{ label: '吉尔吉斯斯坦', value: '吉尔吉斯斯坦' },
{ label: '老挝', value: '老挝' },
{ label: '拉脱维亚', value: '拉脱维亚' },
{ label: '黎巴嫩', value: '黎巴嫩' },
{ label: '莱索托', value: '莱索托' },
{ label: '利比里亚', value: '利比里亚' },
{ label: '利比亚', value: '利比亚' },
{ label: '列支敦士登', value: '列支敦士登' },
{ label: '立陶宛', value: '立陶宛' },
{ label: '卢森堡', value: '卢森堡' },
{ label: '马其顿', value: '马其顿' },
{ label: '马拉维', value: '马拉维' },
{ label: '马来西亚', value: '马来西亚' },
{ label: '马达加斯加', value: '马达加斯加' },
{ label: '马尔代夫', value: '马尔代夫' },
{ label: '马里', value: '马里' },
{ label: '马耳他', value: '马耳他' },
{ label: '马绍尔群岛', value: '马绍尔群岛' },
{ label: '马提尼克岛', value: '马提尼克岛' },
{ label: '毛里塔尼亚', value: '毛里塔尼亚' },
{ label: '毛里求斯', value: '毛里求斯' },
{ label: '马约特', value: '马约特' },
{ label: '墨西哥', value: '墨西哥' },
{ label: '密克罗尼西亚', value: '密克罗尼西亚' },
{ label: '摩尔多瓦', value: '摩尔多瓦' },
{ label: '摩纳哥', value: '摩纳哥' },
{ label: '蒙古', value: '蒙古' },
{ label: '黑山', value: '黑山' },
{ label: '蒙特塞拉特', value: '蒙特塞拉特' },
{ label: '摩洛哥', value: '摩洛哥' },
{ label: '莫桑比克', value: '莫桑比克' },
{ label: '缅甸', value: '缅甸' },
{ label: '纳米比亚', value: '纳米比亚' },
{ label: '瑙鲁', value: '瑙鲁' },
{ label: '尼泊尔', value: '尼泊尔' },
{ label: '荷兰', value: '荷兰' },
{ label: '新喀里多尼亚', value: '新喀里多尼亚' },
{ label: '新西兰', value: '新西兰' },
{ label: '尼加拉瓜', value: '尼加拉瓜' },
{ label: '尼日尔', value: '尼日尔' },
{ label: '尼日利亚', value: '尼日利亚' },
{ label: '纽埃', value: '纽埃' },
{ label: '诺福克岛', value: '诺福克岛' },
{ label: '挪威', value: '挪威' },
{ label: '阿曼', value: '阿曼' },
{ label: '巴基斯坦', value: '巴基斯坦' },
{ label: '帕劳', value: '帕劳' },
{ label: '巴勒斯坦', value: '巴勒斯坦' },
{ label: '巴拿马', value: '巴拿马' },
{ label: '巴布亚新几内亚', value: '巴布亚新几内亚' },
{ label: '秘鲁', value: '秘鲁' },
{ label: '菲律宾', value: '菲律宾' },
{ label: '皮特凯恩群岛', value: '皮特凯恩群岛' },
{ label: '波兰', value: '波兰' },
{ label: '葡萄牙', value: '葡萄牙' },
{ label: '波多黎各', value: '波多黎各' },
{ label: '卡塔尔', value: '卡塔尔' },
{ label: '留尼汪岛', value: '留尼汪岛' },
{ label: '罗马尼亚', value: '罗马尼亚' },
{ label: '卢旺达', value: '卢旺达' },
{ label: '俄罗斯联邦', value: '俄罗斯联邦' },
{ label: '圣赫勒拿', value: '圣赫勒拿' },
{ label: '圣基茨和尼维斯', value: '圣基茨和尼维斯' },
{ label: '圣卢西亚', value: '圣卢西亚' },
{ label: '圣文森特和格林纳丁斯', value: '圣文森特和格林纳丁斯' },
{ label: '萨尔瓦多', value: '萨尔瓦多' },
{ label: '萨摩亚', value: '萨摩亚' },
{ label: '圣马力诺', value: '圣马力诺' },
{ label: '圣多美和普林西比', value: '圣多美和普林西比' },
{ label: '沙特阿拉伯', value: '沙特阿拉伯' },
{ label: '塞内加尔', value: '塞内加尔' },
{ label: '塞舌尔', value: '塞舌尔' },
{ label: '塞拉利昂', value: '塞拉利昂' },
{ label: '新加坡', value: '新加坡' },
{ label: '塞尔维亚', value: '塞尔维亚' },
{ label: '斯洛伐克', value: '斯洛伐克' },
{ label: '斯洛文尼亚', value: '斯洛文尼亚' },
{ label: '所罗门群岛', value: '所罗门群岛' },
{ label: '索马里', value: '索马里' },
{ label: '南非', value: '南非' },
{ label: '西班牙', value: '西班牙' },
{ label: '斯里兰卡', value: '斯里兰卡' },
{ label: '苏丹', value: '苏丹' },
{ label: '苏里南', value: '苏里南' },
{ label: '斯威士兰', value: '斯威士兰' },
{ label: '瑞典', value: '瑞典' },
{ label: '瑞士', value: '瑞士' },
{ label: '叙利亚', value: '叙利亚' },
{ label: '塔吉克斯坦', value: '塔吉克斯坦' },
{ label: '坦桑尼亚', value: '坦桑尼亚' },
{ label: '泰国', value: '泰国' },
{ label: '特立尼达和多巴哥', value: '特立尼达和多巴哥' },
{ label: '东帝汶', value: '东帝汶' },
{ label: '多哥', value: '多哥' },
{ label: '托克劳', value: '托克劳' },
{ label: '汤加', value: '汤加' },
{ label: '突尼斯', value: '突尼斯' },
{ label: '土耳其', value: '土耳其' },
{ label: '土库曼斯坦', value: '土库曼斯坦' },
{ label: '图瓦卢', value: '图瓦卢' },
{ label: '乌干达', value: '乌干达' },
{ label: '乌克兰', value: '乌克兰' },
{ label: '阿拉伯联合酋长国', value: '阿拉伯联合酋长国' },
{ label: '英国', value: '英国' },
{ label: '美国', value: '美国' },
{ label: '乌拉圭', value: '乌拉圭' },
{ label: '乌兹别克斯坦', value: '乌兹别克斯坦' },
{ label: '瓦努阿图', value: '瓦努阿图' },
{ label: '梵蒂冈', value: '梵蒂冈' },
{ label: '委内瑞拉', value: '委内瑞拉' },
{ label: '越南', value: '越南' },
{ label: '瓦利斯群岛和富图纳群岛', value: '瓦利斯群岛和富图纳群岛' },
{ label: '西撒哈拉', value: '西撒哈拉' },
{ label: '也门', value: '也门' },
{ label: '南斯拉夫', value: '南斯拉夫' },
{ label: '赞比亚', value: '赞比亚' },
{ label: '津巴布韦', value: '津巴布韦' }
]
/**
* 教育背景
*/
export default function(_this) {
return {
id: 'application_info_education',
title: '教育背景',
required: true,
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { educations: list = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
return list.length ? list : [{}]
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
const educations = data.map(item => {
return ['start_date', 'end_date', 'school_name_cn', 'major_cn', 'degree'].reduce((result, key) => {
result[key] = item[key]
return result
}, {})
})
return { educations }
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_profile' } }, isSubmit: true },
next: { to: { query: { active: 'application_info', tab: 'application_info_career' } }, isSubmit: true },
hasAdd: true,
options: { labelWidth: '140px' },
items: [
{
type: 'v-datepicker',
label: '开始时间',
model: 'start_date',
attrs: {
type: 'month',
placeholder: '请选择教育开始时间',
valueFormat: 'yyyy-MM'
},
rules: [{ required: true, message: '请选择教育开始时间', trigger: 'blur' }]
},
{
type: 'v-datepicker',
label: '结束时间',
model: 'end_date',
attrs: {
type: 'month',
placeholder: '请选择教育结束时间',
valueFormat: 'yyyy-MM'
},
rules: [{ required: true, message: '请选择教育结束时间', trigger: 'blur' }]
},
{
type: 'v-input',
label: '学校名称',
model: 'school_name_cn',
attrs: { placeholder: '请输入学校名称' },
rules: [{ required: true, message: '请输入学校名称', trigger: 'blur' }]
},
{
type: 'v-input',
label: '专业名称',
model: 'major_cn',
attrs: { placeholder: '请输入专业名称' },
rules: [{ required: true, message: '请输入专业名称', trigger: 'blur' }]
},
{
type: 'v-select',
values: [
{ value: '专科' },
{ value: '本科' },
{ value: '本科/学士' },
{ value: '硕士研究生' },
{ value: '研究生/硕士' },
{ value: '博士研究生' },
{ value: '研究生/博士' },
{ value: '其他' }
],
label: '学历/学位',
model: 'degree',
rules: [{ required: true, message: '请选择学历/学位', trigger: 'change' }]
}
]
}
}
}
/**
* 个人信息
*/
export default function(_this) {
return {
id: 'application_info_first',
title: '个人信息',
required: true,
visible() {
return this.tabActive === 'application_info_first'
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const {
basic_info: basicInfo = {},
attachments = [],
submission_stage: submissionStage = 'FILLING'
} = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
const attachment = attachments.reduce(
(result, item) => {
const types = ['ID_CARD_FRONT', 'ID_CARD_BACK', 'HK_ID_CARD', 'PASSPORT', 'OTHER_ID_CARD_PHOTO']
types.forEach(type => {
if (item.file_type_id === type) {
result[type].push(item)
}
})
return result
},
{ ID_CARD_FRONT: [], ID_CARD_BACK: [], HK_ID_CARD: [], PASSPORT: [], OTHER_ID_CARD_PHOTO: [] }
)
basicInfo.id_type = basicInfo.id_type === '护照' ? '中国护照' : basicInfo.id_type
return Object.assign({}, basicInfo, attachment)
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
const basicInfo = ['phone_number', 'email', 'id_type'].reduce((result, key) => {
result[key] = data[key]
return result
}, {})
return { basic_info: basicInfo }
}
},
form: {
hasButton: false,
next: { to: { query: { active: 'application_info', tab: 'application_info_profile' } }, isSubmit: true },
options: { labelWidth: '140px' },
items: [
{
type: 'v-input',
label: '手机号',
model: 'phone_number',
attrs: { placeholder: '请输入手机号', maxlength: 11 },
rules: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: '请输入手机号', trigger: 'blur' }]
},
{
type: 'v-input',
label: '邮箱',
model: 'email',
attrs: { placeholder: '请输入邮箱' },
rules: [{ type: 'email', required: true, message: '请输入邮箱', trigger: 'blur' }]
},
{
type: 'v-select',
values: [{ value: '居民身份证' }, { value: '港澳台身份证' }, { value: '中国护照' }, { value: '其他' }],
label: '证件类型',
model: 'id_type',
attrs: { placeholder: '请选择证件类型' },
rules: [{ required: true, message: '请选择证件类型', trigger: 'change' }]
},
// 身份证照片(背面)
{
type: 'v-upload',
label: '身份证人像面',
model: 'ID_CARD_BACK',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'ID_CARD_BACK' },
limit: 1,
accept: 'image/*',
image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_back.png'
},
rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }],
isShow(data) {
return data.id_type === '居民身份证'
}
},
// 身份证照片(正面)
{
type: 'v-upload',
label: '身份证国徽面',
model: 'ID_CARD_FRONT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'ID_CARD_FRONT' },
limit: 1,
accept: 'image/*',
image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_front.png'
},
rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }],
isShow(data) {
return data.id_type === '居民身份证'
}
},
// 港澳台身份证
{
type: 'v-upload',
label: '港澳台身份证',
model: 'HK_ID_CARD',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'HK_ID_CARD' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传港澳台身份证', trigger: 'change' }],
isShow(data) {
return data.id_type === '港澳台身份证'
}
},
// 中国护照
{
type: 'v-upload',
label: '中国护照',
model: 'PASSPORT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'PASSPORT' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传中国护照', trigger: 'change' }],
isShow(data) {
return data.id_type === '中国护照'
}
},
// 其他证件
{
type: 'v-upload',
label: '其他证件',
model: 'OTHER_ID_CARD_PHOTO',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'OTHER_ID_CARD_PHOTO' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传其他证件', trigger: 'change' }],
isShow(data) {
return data.id_type === '其他'
}
}
]
}
}
}
/**
* 荣誉奖励
*/
export default function(_this) {
return {
id: 'application_info_honor',
title: '荣誉奖励',
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { honors: list = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
return list.length ? list : [{}]
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
const honors = data.map(item => {
return ['time', 'title', 'institution_cn'].reduce((result, key) => {
result[key] = item[key] || ''
return result
}, {})
})
return { honors }
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_training' } }, isSubmit: true },
next: { to: { query: { active: 'application_tjx' } }, isSubmit: true },
hasAdd: true,
options: { labelWidth: '140px' },
items: [
{
type: 'v-datepicker',
label: '获取时间',
model: 'time',
attrs: { type: 'date', valueFormat: 'yyyy-MM-dd', placeholder: '请选择获取时间' }
// rules: [{ required: true, message: '请选择获取时间', trigger: 'blur' }]
},
{
type: 'v-input',
label: '荣誉奖励',
model: 'title',
attrs: { placeholder: '请输入荣誉奖励' }
// rules: [{ required: true, message: '请输入荣誉奖励', trigger: 'blur' }]
},
{
type: 'v-input',
label: '证书颁发机构',
model: 'institution_cn',
attrs: { placeholder: '请输入证书颁发机构' }
// rules: [{ required: true, message: '请输入证书颁发机构', trigger: 'blur' }]
}
]
}
}
}
/**
* 个人信息
*/
import country from './country'
export default function(_this) {
return {
id: 'application_info_profile',
title: '个人信息',
required: true,
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const {
basic_info: basicInfo = {},
attachments = [],
submission_stage: submissionStage = 'FILLING'
} = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
const attachment = attachments.reduce(
(result, item) => {
const types = ['ID_CARD_FRONT', 'ID_CARD_BACK', 'HK_ID_CARD', 'PASSPORT', 'OTHER_ID_CARD_PHOTO']
types.forEach(type => {
if (item.file_type_id === type) {
result[type].push(item)
}
})
return result
},
{ ID_CARD_FRONT: [], ID_CARD_BACK: [], HK_ID_CARD: [], PASSPORT: [], OTHER_ID_CARD_PHOTO: [] }
)
basicInfo.id_type = basicInfo.id_type === '护照' ? '中国护照' : basicInfo.id_type
return Object.assign({}, basicInfo, attachment)
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
// let [province, city] = data.city.split('-')
// data.address_province = province
// data.address_city = city
const basicInfo = [
'phone_number',
'email',
'id_type',
'id_number',
'real_name_cn',
'real_name_en',
'gender',
'nationality',
'birthday',
'address_province',
'address_city',
'we_chat_account',
'mailing_address',
'emergency_contact_name',
'emergency_contacts_phone'
].reduce((result, key) => {
result[key] = data[key]
return result
}, {})
return { basic_info: basicInfo }
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_first' } } },
next: { to: { query: { active: 'application_info', tab: 'application_info_education' } }, isSubmit: true },
options: { labelWidth: '140px' },
items: [
{
type: 'v-input',
label: '手机号',
model: 'phone_number',
attrs: { placeholder: '请输入手机号', maxlength: 11 },
rules: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: '请输入手机号', trigger: 'blur' }]
},
{
type: 'v-input',
label: '邮箱',
model: 'email',
attrs: { placeholder: '请输入邮箱' },
rules: [{ type: 'email', required: true, message: '请输入邮箱', trigger: 'blur' }],
hint: '(后续报名信息将发送至此邮箱,请认真填写)'
},
{
type: 'v-select',
values: [{ value: '居民身份证' }, { value: '港澳台身份证' }, { value: '中国护照' }, { value: '其他' }],
label: '证件类型',
model: 'id_type',
attrs: { placeholder: '请选择证件类型' },
rules: [{ required: true, message: '请选择证件类型', trigger: 'change' }]
},
// 身份证照片(背面)
{
type: 'v-upload',
label: '身份证人像面',
model: 'ID_CARD_BACK',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'ID_CARD_BACK' },
limit: 1,
accept: 'image/*',
image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_back.png'
},
rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }],
isShow(data) {
return data.id_type === '居民身份证'
}
},
// 身份证照片(正面)
{
type: 'v-upload',
label: '身份证国徽面',
model: 'ID_CARD_FRONT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'ID_CARD_FRONT' },
limit: 1,
accept: 'image/*',
image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_front.png'
},
rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }],
isShow(data) {
return data.id_type === '居民身份证'
}
},
// 港澳台身份证
{
type: 'v-upload',
label: '港澳台身份证',
model: 'HK_ID_CARD',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'HK_ID_CARD' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传港澳台身份证', trigger: 'change' }],
isShow(data) {
return data.id_type === '港澳台身份证'
}
},
// 中国护照
{
type: 'v-upload',
label: '中国护照',
model: 'PASSPORT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'PASSPORT' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传中国护照', trigger: 'change' }],
isShow(data) {
return data.id_type === '中国护照'
}
},
// 其他证件
{
type: 'v-upload',
label: '其他证件',
model: 'OTHER_ID_CARD_PHOTO',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'OTHER_ID_CARD_PHOTO' },
limit: 1,
accept: 'image/*'
},
rules: [{ type: 'array', required: true, message: '请上传其他证件', trigger: 'change' }],
isShow(data) {
return data.id_type === '其他'
}
},
{
type: 'v-input',
label: '证件号码',
model: 'id_number',
attrs: { placeholder: '请输入证件号码' },
rules: [{ required: true, message: '请输入证件号码', trigger: 'blur' }]
},
{
type: 'v-input',
label: '姓名',
model: 'real_name_cn',
attrs: { placeholder: '请输入姓名' },
rules: [{ required: true, message: '请输入姓名', trigger: 'blur' }]
},
{
type: 'v-input',
label: '英文名',
model: 'real_name_en',
attrs: { placeholder: '请输入英文名' },
rules: [{ required: true, message: '请输入英文名', trigger: 'blur' }]
},
{
type: 'v-radio',
values: [
{ label: '男', value: '男' },
{ label: '女', value: '女' }
],
label: '性别',
model: 'gender',
rules: [{ required: true, message: '请选择性别', trigger: 'change' }]
},
{
type: 'v-select',
label: '国籍',
model: 'nationality',
values: country,
attrs: { placeholder: '请选择国籍', filterable: true },
rules: [{ required: true, message: '请选择国籍', trigger: 'blur' }]
},
{
type: 'v-datepicker',
label: '出生日期',
model: 'birthday',
attrs: { type: 'date', placeholder: '请选择出生日期', valueFormat: 'yyyy-MM-dd' },
rules: [{ required: true, message: '请选择出生日期', trigger: 'blur' }]
},
{
type: 'v-input',
label: '居住省',
model: 'address_province',
attrs: { placeholder: '请输入居住省' },
rules: [{ required: true, message: '请输入居住省', trigger: 'blur' }]
},
{
type: 'v-input',
label: '居住市',
model: 'address_city',
attrs: { placeholder: '请输入居住市' },
rules: [{ required: true, message: '请输入居住市', trigger: 'blur' }]
},
// {
// type: 'city-v-select',
// label: '现居住城市',
// model: 'city',
// separator: '-',
// rules: [{ required: true, message: '请选择居住城市', trigger: 'blur' }]
// },
{
type: 'v-input',
label: '微信号',
model: 'we_chat_account',
attrs: { placeholder: '请输入微信号' },
rules: [{ required: true, message: '请输入微信号', trigger: 'blur' }]
},
{
type: 'v-input',
label: '邮寄地址',
model: 'mailing_address',
attrs: { placeholder: '请输入邮寄地址' },
rules: [{ required: true, message: '请输入邮寄地址', trigger: 'blur' }]
},
{
type: 'v-input',
label: '紧急联系人',
model: 'emergency_contact_name',
attrs: { placeholder: '请输入紧急联系人' },
rules: [{ required: true, message: '请输入紧急联系人', trigger: 'blur' }]
},
{
type: 'v-input',
label: '紧急联系电话',
model: 'emergency_contacts_phone',
attrs: { placeholder: '请输入紧急联系电话' },
rules: [{ required: true, message: '请输入紧急联系电话', trigger: 'blur' }]
}
]
}
}
}
/**
* 所受培训
*/
export default function(_this) {
return {
id: 'application_info_training',
title: '所受培训',
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { trainings: list = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
return list.length ? list : [{}]
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
const trainings = data.map(item => {
return ['start_date', 'end_date', 'institution_cn', 'course_cn'].reduce((result, key) => {
result[key] = item[key] || ''
return result
}, {})
})
return { trainings }
}
},
form: {
prev: { to: { query: { active: 'application_info', tab: 'application_info_answer' } }, isSubmit: true },
next: { to: { query: { active: 'application_info', tab: 'application_info_honor' } }, isSubmit: true },
hasAdd: true,
options: { labelWidth: '140px' },
items: [
{
type: 'v-datepicker',
label: '开始时间',
model: 'start_date',
attrs: {
type: 'month',
placeholder: '请选择培训开始时间',
valueFormat: 'yyyy-MM'
}
// rules: [{ required: true, message: '请选择培训开始时间', trigger: 'blur' }]
},
{
type: 'v-datepicker',
label: '结束时间',
model: 'end_date',
attrs: {
type: 'month',
placeholder: '请选择培训结束时间',
valueFormat: 'yyyy-MM'
}
// rules: [{ required: true, message: '请选择培训结束时间', trigger: 'blur' }]
},
{
type: 'v-input',
label: '培训机构',
model: 'institution_cn',
attrs: { placeholder: '请输入培训机构' }
// rules: [{ required: true, message: '请输入培训机构', trigger: 'blur' }]
},
{
type: 'v-input',
label: '课程名称',
model: 'course_cn',
attrs: { placeholder: '请输入课程名称' }
// rules: [{ required: true, message: '请输入课程名称', trigger: 'blur' }]
}
]
}
}
}
/**
* 推荐信
*/
export default function(_this) {
return {
id: 'application_tjx',
title: '推荐信',
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { submission_stage: submissionStage = 'FILLING' } = data.data.material
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 3
const list = data.data.material.reco_letters || []
return list.length ? list : [{}, {}, {}]
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}/put`,
beforeRequest(data) {
// const recoLetters = data.map(item => {
// return ['provider_name', 'provider_phone_number', 'provider_email', 'provider_relationship'].reduce(
// (result, key) => {
// result[key] = item[key]
// return result
// },
// {}
// )
// })
return { reco_letters: data }
}
},
form: {
minlength: 3,
prev: { to: { query: { active: 'application_info', tab: 'application_info_honor' } }, isSubmit: true },
next: { to: { query: { active: 'application_declare' } }, isSubmit: true },
hasAdd: true,
disabled(data) {
return !!data.letter_content
},
aside: {
prepend: {
html: '<p style="color:#33C011;">推荐人已完成</p>',
visible(data) {
return !!data.letter_content
}
},
buttons: [
{
text: '再次邀请',
visible(data) {
const editable = ['PREPAYMENT', 'INTERVIEW_APPLICATION', 'AUDITION'].includes(
_this.detail.material.submission_stage
)
return data.id && !data.letter_content && editable
},
onClick(data) {
_this.sendToProvider(data)
}
},
{
text: '更换推荐人',
visible(data) {
const editable = ['PREPAYMENT', 'INTERVIEW_APPLICATION', 'AUDITION'].includes(
_this.detail.material.submission_stage
)
return data.id && !data.letter_content && editable
},
onClick(data, $form) {
$form.validate().then(() => {
_this.changeProvider(data)
})
}
}
]
},
options: { labelWidth: '140px' },
items: [
{
type: 'v-input',
label: '推荐人姓名',
model: 'provider_name',
attrs: { placeholder: '请输入推荐人姓名' },
rules: [{ required: true, message: '请输入推荐人姓名', trigger: 'blur' }]
},
{
type: 'v-input',
label: '推荐人电话',
model: 'provider_phone_number',
attrs: { placeholder: '请输入推荐人电话', maxlength: 11 },
rules: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: '请输入推荐人电话', trigger: 'blur' }]
},
{
type: 'v-input',
label: '推荐人邮箱',
model: 'provider_email',
attrs: { placeholder: '请输入推荐人邮箱' },
rules: [{ type: 'email', required: true, message: '请输入推荐人邮箱', trigger: 'blur' }]
},
{
type: 'v-select',
values: [
{ value: '老师/导师' },
{ value: '领导' },
{ value: '同学' },
{ value: '同事' },
{ value: '亲属' },
{ value: '朋友' },
{ value: '其他' }
],
label: '与推荐人关系',
model: 'provider_relationship',
rules: [{ required: true, message: '请选择与推荐人关系', trigger: 'change' }]
}
]
}
}
}
export default function(_this) {
return {
id: 'application_wfzzm',
title: '无犯罪证明',
visible() {
return _this.visible
},
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
this.form.options.disabled = submissionStage !== 'FILLING'
const NO_CRIMINAL_CERT = attachments.filter(item => {
return item.file_type_id === 'NO_CRIMINAL_CERT'
})
return { NO_CRIMINAL_CERT }
}
},
form: {
prev: { to: { query: { active: 'application_tjx' } } },
next: { to: { query: { active: 'application_declare' } } },
hasButton: false,
options: {},
items: [
{
type: 'v-upload',
required: true,
model: 'NO_CRIMINAL_CERT',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'NO_CRIMINAL_CERT' },
limit: 1
},
prepend: `
<p>第一步:点击下载按键获取无犯罪证明模板</p>
<p><a href="https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/%E6%97%A0%E7%8A%AF%E7%BD%AA%E8%AE%B0%E5%BD%95%E8%AF%81%E6%98%8E.docx" target="_blank" download>下载模板</a></p>
<p>第二步:打印文件后填写内容并签字上传至电脑,点击下方按钮上传文件</p>
`
}
]
}
}
}
<template>
<app-layout>
<vue-form
:menus="menus"
:default-active="currentActive"
:tab-active="tabActive"
@page-change="handlePageChange"
@tab-change="handleTabChange"
@success="handleSuccess"
@error="handleError"
@back="$router.push('/my/account')"
@prev="handlePrev"
@next="handleNext"
v-if="detail"
>
<template #aside-append>
<div class="aside-preview" @click="dialogVisible = true" v-if="visible">预览全部</div>
<div class="aside-payment"><a href="https://accounts.ezijing.com/payment" target="_blank">查看缴费记录</a></div>
<div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
</template>
<!-- 报名缴费 -->
<template #content v-if="currentActive === 'application_pay'">
<app-pay />
</template>
</vue-form>
<el-dialog title="预览全部" :visible.sync="dialogVisible" width="790px" class="dialog-preview">
<app-preview :hasEdit="true" @edit="handlePreviewEdit" v-if="dialogVisible" />
</el-dialog>
<app-complete v-model="completeVisible"></app-complete>
</app-layout>
</template>
<script>
import AppLayout from '../layout.vue'
import getMenu from './form'
import AppPay from './pay.vue'
import AppPreview from './preview.vue'
import AppComplete from './complete.vue'
import * as api from '@/api/my'
export default {
components: { AppLayout, AppPay, AppPreview, AppComplete },
data() {
const menus = getMenu(this)
return {
menus: [menus],
currentActive: 'application_info',
tabActive: 'application_info_profile',
dialogVisible: false,
detail: null,
completeVisible: false
}
},
watch: {
$route: {
immediate: true,
handler(route) {
const { query = {} } = route
this.currentActive = query.active || 'application_info'
this.tabActive = query.tab || 'application_info_profile'
}
}
},
computed: {
visible() {
return this.currentActive !== 'application_info' || this.tabActive !== 'application_info_first'
}
},
methods: {
// 获取报名信息
getApplication() {
api.getApplication().then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
this.detail = data
if (
!data.progress.FILLING.attachments ||
data.progress.FILLING.attachments.missed_required_list.ID_CARD_PHOTO
) {
this.tabActive = 'application_info_first'
}
const { submission_stage: submissionStage = 'FILLING' } = data.material
if (submissionStage !== 'FILLING') {
this.menus[0].children.forEach(item => {
if (item.id === 'application_pay') {
item.show = true
}
})
}
} else {
this.$message.error(message)
}
})
},
handlePageChange(value) {
this.currentActive = value
this.$router.push({ path: this.$route.path, query: { active: value } })
},
handleTabChange(value) {
this.tabActive = value
const query = Object.assign({}, this.$route.query, { tab: value })
this.$router.push({ query })
},
handleSuccess(data) {
console.log('提交成功了', data)
this.$message({ type: 'success', message: '提交成功' })
},
handleError(data) {
console.log('提交失败了', data)
this.$message({ type: 'error', message: data.message })
},
handlePrev(to) {
this.$router.push(to)
},
handleNext(to) {
this.$router.push(to)
},
handlePreviewEdit(to) {
this.$router.push(to)
this.dialogVisible = false
},
// 更换推荐人
changeProvider(data) {
api.updateProvider(data.id, data).then(response => {
const { error, message } = response
if (error.toString() === '0') {
this.$message({ type: 'success', message })
} else {
this.$message.error(message)
}
})
},
// 再次邀请推荐
sendToProvider(data) {
api.sendToProvider(data.id).then(response => {
const { error, message } = response
if (error.toString() === '0') {
this.$message({ type: 'success', message })
} else {
this.$message.error(message)
}
})
}
},
beforeMount() {
this.getApplication()
}
}
</script>
<style lang="scss" scoped>
::v-deep .aside-preview {
margin-top: -20px;
padding-left: 64px;
font-size: 14px;
font-weight: 700;
line-height: 44px;
color: #222;
cursor: pointer;
}
.dialog-preview {
::v-deep .el-dialog__body {
padding: 0;
}
}
</style>
<template>
<div class="pay">
<h5-pay @update="handleUpdateOrder" v-if="isWechat"></h5-pay>
<qrcode-pay @update="handleUpdateOrder" v-else></qrcode-pay>
<div class="pay-ft">
<p class="t2">注释:再提交1000元申请费后,申请人还需上传并提交如下文件。</p>
<p class="t2">①最高学历(学位)证书、②专科/本科中文或英文成绩单、③个人证件照(免冠、白底)</p>
<p class="t2">该申请费不退,请慎重缴费!</p>
</div>
<el-dialog
title="报名费缴费成功"
:visible.sync="dialogVisible"
:center="true"
:close-on-click-modal="false"
width="348px"
>
<div class="dialog-pay">
<p>请填写申请面试的材料,材料齐全后<br />招生办老师将给您致电预约面试日期与时间</p>
<div class="icon"><img src="https://webapp-pub.ezijing.com/project/application/images/icon_success.png" /></div>
</div>
<template #footer>
<el-button type="primary" @click="toInterview">立即预约</el-button>
</template>
</el-dialog>
</div>
</template>
<script>
import * as api from '@/api/my'
import qrcodePay from './components/qrcodePay'
import h5Pay from './components/h5Pay'
export default {
name: 'AppPay',
components: { qrcodePay, h5Pay },
data() {
const UA = window.navigator.userAgent
const isMobile = /android|iphone|ipad|ipod/i.test(UA)
return {
isWechat: isMobile && /micromessenger/i.test(UA),
order: { id: '', payment_url: '' },
dialogVisible: false,
timer: null,
paymentRecords: [] // 所有订单
}
},
computed: {
user() {
return this.$store.state.user
},
// 二维码地址
qrcodeValue() {
return this.order.payment_url
},
// 支付成功
paySuccess() {
return this.order.payment_status === 'SUCCESS'
},
// 待支付订单
orderList() {
// 筛选待支付订单
const list = this.paymentRecords.filter(item => {
return item.bill_type === 'APPLICATION_FEE' && item.payment_status === 'WAITING_FOR_PAY'
})
// 待支付订单是否有当前订单
const found = list.find(item => item.id === this.order.id)
return found ? list : [...list, this.order]
}
},
methods: {
// 获取报名信息
async getApplication() {
await api.getApplication().then(response => {
const { payment_records: paymentRecords = [] } = response.data.material
// 获取支付订单
this.paymentRecords = paymentRecords
if (paymentRecords && paymentRecords.length) {
// 获取支付成功的订单
const orderPaySuccess = paymentRecords.find(item => {
return item.bill_type === 'APPLICATION_FEE' && item.payment_status === 'SUCCESS'
})
if (orderPaySuccess) {
this.order = orderPaySuccess
this.dialogVisible = true
return
}
// 获取最后一个订单
const [lastPayment] = paymentRecords.reverse()
this.order = lastPayment
}
})
},
// 检查支付状态
checkPay(order) {
const userId = this.user.id
api.checkPay(order.id, { user_id: userId }).then(response => {
if (response.data.payment_status === 'SUCCESS') {
this.timer && clearInterval(this.timer)
this.dialogVisible = true
}
})
},
// 检测支付状态定时器
setCheckPayTimer() {
this.timer && clearInterval(this.timer)
this.timer = setInterval(() => {
if (this.paySuccess) {
this.timer && clearInterval(this.timer)
return
}
this.orderList.forEach(order => this.checkPay(order))
}, 3000)
},
// 填写个人资料
toApplication() {
this.$router.push('/my/application?active=application_info')
},
// 申请面试
toInterview() {
this.$router.push('/my/interview')
},
handleUpdateOrder(order) {
this.order = order
}
},
async mounted() {
await this.getApplication()
this.setCheckPayTimer()
},
destroyed() {
this.timer && clearInterval(this.timer)
}
}
</script>
<style lang="scss" scoped>
.pay {
max-width: 562px;
margin: 0 auto;
padding: 40px 0;
}
.t1 {
font-size: 14px;
color: #303030;
line-height: 20px;
text-align: center;
span {
color: #ffa448;
}
}
.t2 {
font-size: 12px;
color: #999;
line-height: 20px;
}
.dialog-pay {
text-align: center;
p {
color: #262626;
line-height: 20px;
}
.icon {
margin-top: 20px;
text-align: center;
}
}
</style>
<template>
<div class="preview" v-loading="loading">
<template v-if="progress.FILLING">
<div class="preview-hd">
<el-steps align-center :active="options.length">
<template v-for="item in options">
<el-step
:title="item.title"
:status="progress.FILLING[item.code] && progress.FILLING[item.code].progress === 1 ? 'success' : 'error'"
:key="item.code"
></el-step>
</template>
</el-steps>
</div>
<div class="preivew-bd">
<template v-for="item in options">
<div
class="preview-item"
:class="progress.FILLING[item.code].progress === 1 ? 'is-success' : 'is-error'"
:key="item.code"
v-if="progress.FILLING[item.code]"
>
<div class="preview-item-hd">
<div class="title">
{{ item.title }}
<template v-if="progress.FILLING[item.code].progress === 1">(已完善)</template>
<template v-else>(待完善)</template>
</div>
<div class="line"></div>
<el-button plain size="small" @click="handleEdit(item.edit.to)" v-if="hasEdit">编辑</el-button>
</div>
<div class="preview-item-bd">
<template v-if="item.computed">
<div v-html="item.computed(material[item.code])"></div>
</template>
<template v-else-if="item.isMultiple">
<div class="group" v-for="(data, index) in material[item.code]" :key="index">
<dl
v-for="subitem in item.items"
:key="subitem.code"
v-show="subitem.visible ? subitem.visible() : true"
>
<dt>{{ subitem.label }}</dt>
<dd>
<template v-if="subitem.computed">
<div v-html="subitem.computed(data)"></div>
</template>
<template v-else>{{ data[subitem.code] }}</template>
</dd>
</dl>
</div>
</template>
<template v-else>
<div class="group">
<dl v-for="subitem in item.items" :key="subitem.code">
<dt>{{ subitem.label }}</dt>
<dd>
<template v-if="subitem.computed">
<div v-html="subitem.computed(material[item.code])"></div>
</template>
<template v-else>{{ material[item.code][subitem.code] }}</template>
</dd>
</dl>
</div>
</template>
</div>
</div>
</template>
<div class="preview-item is-success" v-if="isManager">
<div class="preview-item-hd">
<div class="title">照片/附件</div>
<div class="line"></div>
</div>
<div class="preview-item-bd">
<template v-if="material.attachments">
<ul class="attachments">
<li class="attachments-item" v-for="(item, index) in material.attachments" :key="index">
<div class="inner" @click="handlePreview(item)">
<el-image :src="item.oss_sign_url" class="pic">
<template #error>
<i class="el-icon-document"></i>
</template>
</el-image>
<div class="name">{{ item.file_type_label }}</div>
<div v-if="item.status_desc">
<el-tag size="mini">{{ item.status_desc }}</el-tag>
</div>
</div>
<el-button-group v-if="hasButton" style="margin-left: 40px">
<el-button size="mini" :disabled="item.status === 'INACTIVE'" @click="handleRemove(item)"
>删除</el-button
>
<el-button size="mini" :disabled="item.status === 'LOG'" @click="handleSave(item)">存档</el-button>
</el-button-group>
</li>
</ul>
</template>
</div>
</div>
<div class="preview-item is-success" v-if="isManager">
<div class="preview-item-hd">
<div class="title">支付记录</div>
<div class="line"></div>
</div>
<div class="preview-item-bd">
<template v-if="material.payment_records">
<el-table :data="material.payment_records">
<el-table-column align="left" prop="payment_method_desc" label="支付方式"> </el-table-column>
<el-table-column align="center" prop="bill_amount" label="支付金额"> </el-table-column>
<el-table-column align="right" prop="payment_status_desc" label="支付状态"> </el-table-column>
</el-table>
</template>
</div>
</div>
</div>
</template>
<img :src="previewImageUrl" :alt="previewImageTitle" id="image" style="display: none" />
</div>
</template>
<script>
import 'viewerjs/dist/viewer.css'
import Viewer from 'viewerjs'
import * as api from '@/api/my'
// 行业类别
const industryList = [
{ label: '互联网/电子商务', value: '1 ' },
{ label: '基金/证券/期货/投资', value: '2 ' },
{ label: '保险', value: '3 ' },
{ label: '银行', value: '4 ' },
{ label: '信托/担保/拍卖/典当', value: '5 ' },
{ label: '计算机软件', value: '6 ' },
{ label: 'IT服务(系统/数据/维护)', value: '7 ' },
{ label: '电子技术/半导体/集成电路', value: '8 ' },
{ label: '计算机硬件', value: '9 ' },
{ label: '通信/电信/网络设备', value: '10' },
{ label: '通信/电信运营、增值服务', value: '11' },
{ label: '网络游戏', value: '12' },
{ label: '房地产/建筑/建材/工程', value: '13' },
{ label: '家居/室内设计/装饰装潢', value: '14' },
{ label: '物业管理/商业中心', value: '15' },
{ label: '专业服务/咨询(财会/法律/人力资源等)', value: '16' },
{ label: '广告/会展/公关', value: '17' },
{ label: '中介服务', value: '18' },
{ label: '检验/检测/认证', value: '19' },
{ label: '外包服务', value: '20' },
{ label: '快速消费品(食品/饮料/烟酒/日化)', value: '21' },
{ label: '耐用消费品(服饰/纺织/皮革/家具/家电)', value: '22' },
{ label: '贸易/进出口', value: '23' },
{ label: '零售/批发', value: '24' },
{ label: '租赁服务', value: '25' },
{ label: '教育/培训/院校', value: '26' },
{ label: '礼品/玩具/工艺美术/收藏品/奢侈品', value: '27' },
{ label: '汽车/摩托车', value: '28' },
{ label: '大型设备/机电设备/重工业', value: '29' },
{ label: '加工制造(原料加工/模具)', value: '30' },
{ label: '仪器仪表及工业自动化', value: '31' },
{ label: '印刷/包装/造纸', value: '32' },
{ label: '办公用品及设备', value: '33' },
{ label: '医药/生物工程', value: '34' },
{ label: '医疗设备/器械', value: '35' },
{ label: '航空/航天研究与制造', value: '36' },
{ label: '交通/运输,物流/仓储', value: '37' },
{ label: '医疗/护理/美容/保健/卫生服务', value: '38' },
{ label: '酒店/餐饮,旅游/度假,媒体/出版/影视/文化传播', value: '39' },
{ label: '娱乐/体育/休闲', value: '40' },
{ label: '能源/矿产/采掘/冶炼', value: '41' },
{ label: '石油/石化/化工,电气/电力/水利', value: '42' },
{ label: '环保', value: '43' },
{ label: '政府/公共事业/非盈利机构', value: '44' },
{ label: '学术/科研,农/林/牧/渔跨领域经营', value: '45' },
{ label: '其他', value: '90' }
]
export default {
name: 'Preview',
props: {
hasEdit: { type: Boolean, default: false },
isManager: { type: Boolean, default: false }
},
data() {
return {
loading: false,
previewImageUrl: '',
previewImageTitle: '',
viewer: null,
material: {},
progress: {},
options: [
{
title: '个人资料',
code: 'basic_info',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_profile' } }
},
items: [
{ label: '姓名', code: 'real_name_cn' },
{ label: '英文名', code: 'real_name_en' },
{
label: '现居住城市',
code: 'address_city',
computed(data) {
return data.address_city ? `${data.address_province}-${data.address_city}` : ''
}
},
{ label: '证件类型', code: 'id_type' },
{ label: '证件号码', code: 'id_number' },
{ label: '手机', code: 'phone_number' },
{ label: '邮箱', code: 'email' },
{ label: '性别', code: 'gender' },
{ label: '国籍', code: 'nationality' },
{ label: '生日', code: 'birthday' },
{ label: '微信号', code: 'we_chat_account' },
{ label: '邮寄地址', code: 'mailing_address' },
{ label: '紧急联系人', code: 'emergency_contact_name' },
{ label: '紧急联系人电话', code: 'emergency_contacts_phone' }
]
},
{
title: '教育背景',
code: 'educations',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_education' } }
},
isMultiple: true,
items: [
{
label: '教育时间',
code: 'start_date',
computed(data) {
return `${data.start_date}${data.end_date}`
}
},
{ label: '专业名称', code: 'major_cn' },
{ label: '学校名称', code: 'school_name_cn' },
{ label: '学历/学位', code: 'degree' }
]
},
{
title: '工作经验',
code: 'careers',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_career' } }
},
isMultiple: true,
items: [
{
label: '工作时间',
code: 'start_date',
computed(data) {
return `${data.start_date}${data.end_date}`
}
},
{ label: '工作单位', code: 'company_name_cn' },
{
label: '行业类别',
code: 'industry',
computed(data) {
const found = industryList.find(item => item.value === data.industry)
return found ? found.label : data.industry
}
},
{ label: '工作部门', code: 'dept_cn' },
{ label: '工作职位', code: 'position_cn' },
{ label: '工作描述', code: 'job_desc_cn' }
]
},
{
title: '学习目的',
code: 'answers',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_answer' } }
},
computed(data = []) {
const result = data.map(item => {
return `<dl><dt>${item.question}</dt><dd>${item.answer}</dd></dl>`
})
return `<div class="answers">${result.join('')}</div>`
}
},
{
title: '所受培训',
code: 'trainings',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_training' } }
},
isMultiple: true,
items: [
{
label: '培训时间',
code: 'start_date',
computed(data) {
return `${data.start_date}${data.end_date}`
}
},
{ label: '培训机构', code: 'institution_cn' },
{ label: '课程名称', code: 'course_cn' }
]
},
{
title: '荣誉奖励',
code: 'honors',
edit: {
to: { path: '/my/application', query: { active: 'application_info', tab: 'application_info_honor' } }
},
isMultiple: true,
items: [
{ label: '获取时间', code: 'time' },
{ label: '荣誉奖励', code: 'title' },
{ label: '证书颁发机构', code: 'institution_cn' }
]
},
{
title: '推荐信',
code: 'reco_letters',
edit: { to: { path: '/my/application', query: { active: 'application_tjx' } } },
isMultiple: true,
items: [
{ label: '推荐人姓名', code: 'provider_name' },
{ label: '推荐人电话', code: 'provider_phone_number' },
{ label: '推荐人邮箱', code: 'provider_email' },
{ label: '与推荐人关系', code: 'provider_relationship' },
{ label: '推荐人工作单位', code: 'provider_company_name', visible: () => this.isManager },
{ label: '推荐人职务', code: 'provider_job_title', visible: () => this.isManager },
{ label: '推荐信内容', code: 'letter_content', visible: () => this.isManager }
]
}
// {
// title: '无犯罪证明',
// code: 'attachments',
// edit: { to: { path: '/my/application', query: { active: 'application_wfzzm' } } },
// computed(data) {
// const found = data.find(item => item.file_type_id === 'NO_CRIMINAL_CERT')
// return found
// ? `<a href="${found.oss_sign_url}" target="_blank"><img src="${found.oss_sign_url}" style="max-width:300px;margin:10px 0;"></a>`
// : ''
// }
// }
]
}
},
computed: {
right() {
const { right = '' } = this.$route.query
return right.toUpperCase()
},
hasButton() {
return this.right.includes('X')
}
},
methods: {
// 获取报名信息
getApplication() {
this.loading = true
api.getApplication(this.$route.query).then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
const { material, progress } = data
this.material = material
const missedRequiredList = progress.FILLING.attachments.missed_required_list
progress.FILLING.attachments.progress = missedRequiredList.NO_CRIMINAL_CERT ? 0 : 1
this.progress = progress
} else {
this.$message.error(message)
}
this.loading = false
})
},
handleEdit(to) {
this.$emit('edit', to)
// this.$router.push(to)
},
// 删除
handleRemove(data) {
this.changeFileStatus(data, 'INACTIVE')
},
// 存档
handleSave(data) {
this.changeFileStatus(data, 'LOG')
},
changeFileStatus(data, status) {
api.changeFileStatus(this.material.user_id, data.id, status).then(response => {
this.getApplication()
})
},
// 预览
handlePreview(file) {
let url = file.oss_sign_url
if (!url) {
this.$message({ type: 'warning', message: '无法查看' })
return
}
url = url.replace(/^http:\/\//, 'https://')
const tempUrl = url.includes('?') ? url.split('?').shift() : url
const names = ['jpg', 'jpeg', 'png', 'gif']
const name = tempUrl.split('.').pop() || ''
if (names.includes(name.toLocaleLowerCase())) {
this.previewImageUrl = url
this.previewImageTitle = file.file_type_label
this.$nextTick(() => {
this.viewer.update()
this.viewer.show(true)
})
} else {
this.newWindowPreview(url)
}
},
// 新窗口预览
newWindowPreview(url) {
const a = document.createElement('a')
a.href = url
a.target = '_blank'
document.body.appendChild(a)
a.click()
a.remove()
},
createViewer() {
this.viewer = new Viewer(document.getElementById('image'), {
navbar: false,
toolbar: { zoomIn: true, zoomOut: true, rotateLeft: true, rotateRight: true }
})
}
},
beforeMount() {
this.getApplication()
},
mounted() {
this.createViewer()
document.body.style = 'background-color:#eee;'
},
destroyed() {
this.viewer && this.viewer.destroy()
document.body.style = ''
}
}
</script>
<style lang="scss" scoped>
.preview {
max-width: 750px;
min-height: 80vh;
padding: 20px;
margin: 0 auto;
background-color: #fff;
}
.preview-hd {
padding: 20px 0;
::v-deep .el-step__title {
font-size: 12px;
}
}
.preview-item {
margin: 20px;
}
.is-success {
color: #37a912;
.line {
background: linear-gradient(90deg, #37a912 0%, rgba(255, 218, 218, 0) 100%);
}
}
.is-error {
color: #da2a56;
.line {
background: linear-gradient(90deg, #da2a56 0%, rgba(255, 218, 218, 0) 100%);
}
}
.preview-item-hd {
display: flex;
align-items: center;
.title {
font-size: 18px;
font-weight: 600;
}
.line {
flex: 1;
height: 4px;
margin: 0 20px;
}
}
.preview-item-bd {
padding-top: 20px;
.group {
display: flex;
flex-wrap: wrap;
}
.group + .group {
margin-top: 10px;
padding-top: 20px;
border-top: 1px solid #f1f1f1;
}
dl {
flex: 50%;
display: flex;
margin-bottom: 10px;
font-size: 14px;
color: #222;
}
dt {
font-weight: bold;
}
dd {
flex: 1;
word-break: break-all;
}
}
</style>
<style lang="scss">
.preview {
.answers {
dl {
margin-bottom: 10px;
font-size: 14px;
color: #222;
& + dl {
margin-top: 20px;
}
}
dt {
font-weight: bold;
margin-bottom: 5px;
}
dd {
word-break: break-all;
}
}
.attachments-item {
display: flex;
align-items: center;
padding: 0 10px;
&:hover {
background-color: #f5f7fa;
}
.inner {
flex: 1;
padding: 10px 0;
height: 40px;
display: flex;
align-items: center;
color: #222;
cursor: pointer;
}
.pic {
width: 40px;
height: 40px;
font-size: 40px;
line-height: 40px;
text-align: center;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.name {
flex: 1;
padding: 0 10px;
}
.time {
font-size: 12px;
}
}
.attachments-item + .attachments-item {
border-top: 1px solid #ebeef5;
}
}
.viewer-toolbar > ul {
margin-bottom: 20px;
}
</style>
export default {
id: 'interview_byz',
title: '毕业证书',
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 2
const DIPLOMA_CN = attachments.filter(item => {
return item.file_type_id === 'DIPLOMA_CN'
})
return { DIPLOMA_CN }
}
},
form: {
next: { to: { query: { active: 'interview_cjd' } } },
hasButton: false,
options: {},
items: [
{
type: 'v-upload',
required: true,
model: 'DIPLOMA_CN',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'DIPLOMA_CN' }
},
append: '注意事项:需要将证书原件扫描或拍照后提交,请确保证书内容清晰可辨。'
}
]
}
}
export default {
id: 'interview_cjd',
title: '成绩单(中/英)',
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 2
return attachments.reduce(
(result, item) => {
if (item.file_type_id === 'REPORT_CARD_CN') {
result.REPORT_CARD_CN.push(item)
}
if (item.file_type_id === 'REPORT_CARD_EN') {
result.REPORT_CARD_EN.push(item)
}
return result
},
{ REPORT_CARD_CN: [], REPORT_CARD_EN: [] }
)
}
},
form: {
prev: { to: { query: { active: 'interview_byz' } } },
next: { to: { query: { active: 'interview_zp' } } },
hasButton: false,
options: { 'label-position': 'top' },
hint: `
<p>成绩单:中/英文成绩单上传一个或多个。</p>
<p>注意事项:需要将证书原件扫描或拍照后提交,请确保证书内容清晰可辨。</p>
`,
items: [
{
type: 'v-upload',
label: '中/英文成绩单',
required: true,
model: 'REPORT_CARD_CN',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'REPORT_CARD_CN' }
}
}
]
}
}
import byz from './byz'
import cjd from './cjd'
import zp from './zp'
export default function(_this) {
return {
id: 'interview',
title: '申请面试',
children: [byz, cjd, zp(_this)]
}
}
export default function(_this) {
return {
id: 'interview_zp',
title: '2寸照片',
get: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/${process.env.projectId}`,
callback(data) {
const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 2
const PERSONAL_PHOTO_FOR_ID = attachments.filter(item => {
return item.file_type_id === 'PERSONAL_PHOTO_FOR_ID'
})
return { PERSONAL_PHOTO_FOR_ID }
}
},
update: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/submit/${process.env.projectId}`,
beforeRequest(data) {
return { submission_stage: 'INTERVIEW_APPLICATION' }
},
callback() {
this.form.options.disabled = true
_this.dialogVisible = true
_this.getApplication()
},
errorCallback() {
_this.completeVisible = true
}
},
form: {
prev: { to: { query: { active: 'interview_cjd' } } },
submitText: '申请面试',
model: { submission_stage: 'INTERVIEW_APPLICATION' },
options: {},
items: [
{
type: 'v-upload',
model: 'PERSONAL_PHOTO_FOR_ID',
attrs: {
action: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/put`,
deleteAction: `${process.env.baseURL}/api/enrollment/v1.0/application-materials/attachments/${process.env.projectId}/delete`,
data: { file_type: 'PERSONAL_PHOTO_FOR_ID' }
},
prepend: '2寸照片:以电子版的形式上传文件',
append: '注意事项:需要将证书原件扫描或拍照后提交,请确保证书内容清晰可辨。'
}
]
}
}
}
<template>
<app-layout>
<vue-form
:menus="menus"
:default-active="currentActive"
@page-change="handlePageChange"
@success="handleSuccess"
@error="handleError"
@back="$router.push('/my/account')"
@prev="handlePrev"
@next="handleNext"
>
<template #aside-append>
<div class="aside-payment"><a href="https://accounts.ezijing.com/payment" target="_blank">查看缴费记录</a></div>
<div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
</template>
</vue-form>
<app-complete :type="1" v-model="completeVisible"></app-complete>
<el-dialog
title="资料提交成功"
:visible.sync="dialogVisible"
:center="true"
:close-on-click-modal="false"
width="348px"
>
<div class="dialog-tips">
<p>请注意接听招办老师的邀约电话</p>
<div class="icon"><img src="https://webapp-pub.ezijing.com/project/application/images/icon_success.png" /></div>
</div>
<template #footer>
<el-button type="primary" @click="dialogVisible = false">我知道啦</el-button>
</template>
</el-dialog>
</app-layout>
</template>
<script>
import AppLayout from '../layout.vue'
import getMenu from './form'
import AppComplete from '../application/complete.vue'
import * as api from '@/api/my'
export default {
components: { AppLayout, AppComplete },
data() {
const menus = getMenu(this)
return {
menus: [menus],
currentActive: 'interview_byz',
completeVisible: false,
dialogVisible: false,
detail: null
}
},
watch: {
$route: {
immediate: true,
handler(route) {
const { query = {} } = route
this.currentActive = query.active || 'interview_byz'
}
},
showSubmitedDialog(value) {
this.dialogVisible = value
}
},
computed: {
isSubmited() {
const stageList = [
'FILLING',
'PREPAYMENT',
'INTERVIEW_APPLICATION',
'AUDITION',
'INTERVIEW',
'PAYMENT',
'REGISTRATION',
'CLOSED'
]
if (this.detail) {
return stageList.findIndex(item => item === this.detail.material.submission_stage) > 2
}
return false
},
showSubmitedDialog() {
return this.isSubmited && this.currentActive === 'interview_zp'
}
},
methods: {
// 获取报名信息
getApplication() {
api.getApplication().then(response => {
const { data, error, message } = response
if (error.toString() === '0') {
this.detail = data
} else {
this.$message.error(message)
}
})
},
handlePageChange(value) {
this.currentActive = value
this.$router.push({ path: this.$route.path, query: { active: value } })
console.log('页面切换了', value)
},
handleSuccess(data) {
this.getApplication()
console.log('提交成功了', data)
this.$message({ type: 'success', message: data.message })
},
handleError(data) {
console.log('提交失败了', data)
this.$message({ type: 'error', message: data.message })
},
handlePrev(to) {
this.$router.push(to)
},
handleNext(to) {
this.$router.push(to)
}
},
beforeMount() {
this.getApplication()
}
}
</script>
<style lang="scss" scoped>
.dialog-tips {
text-align: center;
p {
color: #262626;
line-height: 20px;
}
.icon {
margin-top: 20px;
text-align: center;
}
}
</style>
<template>
<div style="background-color: #eee;min-width: 1200px;">
<div class="layout">
<div class="layout-hd">
<slot name="header">
<h1 class="title">在线报名</h1>
</slot>
</div>
<div class="layout-bd">
<slot></slot>
</div>
</div>
</div>
</template>
<script>
export default {
head: {
meta: [{ hid: 'viewport', name: 'viewport', content: '' }]
}
}
</script>
<style lang="scss" scoped>
.layout {
max-width: 1200px;
margin: 0 auto;
overflow: hidden;
}
.layout-hd {
.title {
padding: 20px 0;
font-size: 18px;
line-height: 1;
color: var(--main-color);
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--main-color);
}
}
.layout-bd {
margin: 20px 0;
}
::v-deep .v-layout-aside {
position: relative;
min-height: 410px;
align-self: flex-start;
.aside-logout {
span {
display: inline-block;
background: url('https://webapp-pub.ezijing.com/project/application/images/icon_logout.png') no-repeat left center;
background-size: 18px 17px;
padding-left: 33px;
}
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: 0 10px;
padding: 12px;
font-size: 12px;
color: #999;
text-align: center;
border-top: 1px solid #eee;
cursor: pointer;
}
.aside-payment {
position: absolute;
left: 0;
right: 0;
bottom: 50px;
margin: 0 10px;
padding: 12px;
font-size: 12px;
color: #57acff;
text-align: center;
}
}
</style>
......@@ -17,7 +17,7 @@ export default {
}),
// Global page headers: https://go.nuxtjs.dev/config-head
head: {
title: '紫荆教育-瑞士酒店管理大学工商管理硕士MBA(酒店及旅游方向)',
title: '紫荆教育',
htmlAttrs: {
lang: 'en'
},
......
<template>
<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">
<div class="item-box" :key="index">
<div class="title">{{ item.title }}</div>
<div class="right-content">
<ul>
<li v-for="(cItem, cIndex) in item.item" :key="cIndex + 'l'">
<div class="text">{{ cItem.name }}</div>
<div class="score">学分:{{ cItem.score }}</div>
</li>
</ul>
</div>
</div>
</template>
</div>
</div>
</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'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
courseData: [
{
title: this.$t('setCourse.tit2'),
item: [
{ name: this.$t('setCourse.t1'), score: 3 },
{ name: this.$t('setCourse.t2'), score: 3 },
{ name: this.$t('setCourse.t3'), score: 3 },
{ 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 }
]
}
],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-kcsz.png',
slider: [
{
name: this.$t('menu.courseChild.set'),
path: '/about/course'
},
{
name: this.$t('menu.courseChild.teachers'),
path: '/about/teacher'
}
]
}
}
},
mounted() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.course-content-box {
// width: 1200px;
// margin: 0 auto;
.content-mian {
padding: 106px 141px 110px 96px;
.border-box {
padding: 35px 0 51px;
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
.item-box {
display: flex;
justify-content: space-between;
margin-bottom: 40px;
ul {
padding-bottom: 37px;
border-bottom: 1px solid #e6e6e6;
}
&:last-child {
border-bottom: none;
margin-bottom: 0;
ul {
padding-bottom: 37px;
border-bottom: none;
}
}
.title {
font-size: 26px;
font-weight: bold;
line-height: 100%;
color: #aa1941;
}
.right-content {
width: 562px;
li {
height: 32px;
background: #f7f7f7;
display: flex;
align-items: center;
&:nth-child(even) {
background: none;
}
.text {
width: 397px;
padding-left: 30px;
font-size: 16px;
color: #333333;
}
.score {
font-size: 16px;
color: #424242;
}
}
}
}
}
}
}
}
.is-h5 {
.course-content {
background: #fff;
padding: 0.38rem 0.28rem 0.2rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #aa1941;
}
ul {
border-top: 0.01rem solid #e6e6e6;
padding-top: 0.1rem;
margin-top: 0.19rem;
margin-bottom: 0.24rem;
li {
height: 0.21rem;
box-sizing: border-box;
padding-left: 0.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>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="teacher-content-box">
<!-- <img class="teacher" src="https://webapp-pub.ezijing.com/project/seg-shms/all-teacher.jpg" /> -->
<div class="content-box">
<div class="teacher-box">
<div class="mar-t-box" v-for="(item, index) in teacherList" :key="index">
<div class="title">{{ item.title }}</div>
<ul>
<template v-for="(cItem, cIndex) in item.list">
<li :key="cIndex + '='">
<img :src="cItem.image" alt="" />
<div class="name">{{ cItem.name }}</div>
<div class="p" v-html="cItem.intr"></div>
</li>
</template>
</ul>
</div>
</div>
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
teacherList: [
{
title: this.$t('teachers.tit1'),
list: [
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t1.png',
name: this.$t('teachers.tea1Name'),
intr: this.$t('teachers.tea1Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t2.png',
name: this.$t('teachers.tea2Name'),
intr: this.$t('teachers.tea2Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t3.png',
name: this.$t('teachers.tea3Name'),
intr: this.$t('teachers.tea3Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t4.png',
name: this.$t('teachers.tea4Name'),
intr: this.$t('teachers.tea4Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t5.png',
name: this.$t('teachers.tea5Name'),
intr: this.$t('teachers.tea5Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t6.png',
name: this.$t('teachers.tea6Name'),
intr: this.$t('teachers.tea6Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t7.png',
name: this.$t('teachers.tea7Name'),
intr: this.$t('teachers.tea7Txt')
},
{
image: 'https://webapp-pub.ezijing.com/project/seg-shms/teacher-t8.png',
name: this.$t('teachers.tea8Name'),
intr: this.$t('teachers.tea8Txt')
}
]
}
// {
// title: this.$t('teachers.tit2'),
// list: [
// {
// 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.ezijing.com/project/kelley/teacher-t8.png',
// name: this.$t('teachers.tea8Name'),
// intr: this.$t('teachers.tea8Txt')
// },
// {
// 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.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/wangyong.png',
// name: this.$t('teachers.tea11Name'),
// intr: this.$t('teachers.tea11Txt')
// },
// {
// 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.ezijing.com/project/seg-shms/banner-bg-szll.png',
slider: [
{
name: this.$t('menu.courseChild.set'),
path: '/about/course'
},
{
name: this.$t('menu.courseChild.teachers'),
path: '/about/teacher'
}
]
}
}
},
mounted() {},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.teacher {
width: 100%;
display: block;
}
.is-pc {
.teacher-content-box {
// width: 1200px;
margin: 0 auto;
.content-box {
padding: 60px 75px 61px;
.teacher-box {
.title {
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #333333;
}
ul {
display: flex;
flex-wrap: wrap;
padding-top: 30px;
li {
width: 180px;
margin-right: 140px;
margin-bottom: 40px;
&:nth-child(3n + 3) {
margin-right: 0;
}
img {
display: block;
width: 100%;
}
.name {
font-size: 18px;
color: #aa1941;
line-height: 100%;
margin-top: 20px;
margin-bottom: 10px;
}
.p {
font-size: 14px;
// line-height: 100%;
color: #666666;
white-space: nowrap;
margin-bottom: 5px;
}
}
}
}
}
}
}
.is-h5 {
.teacher-content-box {
.content-box {
padding: 0.3rem 0.32rem 0.3rem;
.teacher-box {
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
}
ul {
display: flex;
flex-wrap: wrap;
padding-top: 0.15rem;
li {
width: 1.32rem;
margin-left: 0.3rem;
margin-bottom: 0.13rem;
&:nth-child(odd) {
margin-left: 0;
}
img {
display: block;
width: 100%;
}
.name {
font-size: 0.14rem;
line-height: 100%;
color: #aa1941;
margin-top: 0.1rem;
margin-bottom: 0.03rem;
}
.p {
font-size: 0.1rem;
line-height: 0.13rem;
color: #666666;
margin-top: 0.03rem;
}
}
}
}
}
}
}
</style>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="outstanding">
<div class="alumni">
<h5>{{ $t('outstanding.title1') }}</h5>
<ul class="card-list">
<li v-for="(item, index) in alumniList" :key="index">
<div class="avatar">
<img :src="item.avatar" />
</div>
<div class="text">
<h6>{{ item.name }}</h6>
<p v-for="it in item.post" :key="it">{{ it }}</p>
</div>
</li>
</ul>
<h5>{{ $t('outstanding.title2') }}</h5>
<ul class="card-list">
<li v-for="item in studentList" :key="item.name">
<div class="avatar">
<img :src="item.avatar" />
</div>
<div class="text">
<h6>{{ item.name }}</h6>
<p v-for="it in item.education" :key="it">{{ it }}</p>
<div v-for="it in item.post" :key="it">{{ it }}</div>
</div>
</li>
</ul>
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
alumniList: [
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc1.jpg',
name: 'Daniel Aylmer',
post: ['首席运营官', '洲际酒店集团大中华区', 'César Ritz 1995届毕业生']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc2.jpg',
name: 'Tuomas Laakso',
post: ['欧洲发展部主管', '万豪国际酒店,丽思卡尔顿酒店', '瑞士 苏黎世', 'César Ritz 1997届毕业生']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc3.jpg',
name: 'Edward Chan',
post: ['高级副总裁', '亚太区首席发展官', 'Hard Rock 硬石有限公司', 'César Ritz 1987届毕业生']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc4.jpg',
name: 'Michael Smithuis',
post: ['总经理', '费尔蒙酒店集团蒙特勒宫', '瑞士 蒙特勒', 'HTTl 1990届毕业生']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc5.jpg',
name: 'Philip Chong',
post: ['F&B 副总裁', '金沙中国有限公司', 'César Ritz 1987届毕业生']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-jc6.jpg',
name: 'Teik Kong Chong',
post: ['AVP,F&B,North China', '香格里拉酒店集团', 'César Ritz 1987届毕业生']
}
],
studentList: [
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-1.jpg',
name: '温龙',
education: ['希尔顿欢朋快乐大学', '校长', 'SHMS MBA 2020冬季班']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-2.jpg',
name: '史雪梅',
education: ['华住组织人才发展中心', '总监', 'SHMS MBA 2020冬季班']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-3.jpg',
name: '王诤言',
education: ['三亚海棠湾天房洲际度假酒店', '总经理', 'SHMS MBA 2021春季班']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-4.jpg',
name: '王洪岩',
education: ['张家港万豪酒店', '业主代表 & 副总经理', 'SHMS MBA 2021春季班']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-5.jpg',
name: '余亮',
education: ['层到酒店管理有限公司', '董事长', 'SHMS MBA 2022春季班']
},
{
avatar: 'https://webapp-pub.ezijing.com/project/seg-shms/alumni-y0402-6.jpg',
name: '张丽霞',
education: ['广州长隆酒店', '常务副总经理', 'SHMS MBA 2022春秋季班']
}
],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/project-js48-03.jpg',
slider: [
{
name: this.$t('menu.alumniChild.outstanding'),
path: '/alumni/outstanding'
},
{
name: this.$t('menu.alumniChild.share'),
path: '/alumni/sharing'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.alumni {
padding: 30px 74px;
h5 {
font-size: 22px;
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 74px;
color: #333333;
}
.card-list {
margin-bottom: 30px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
li {
width: 410px;
height: 195px;
background: #ebebeb;
display: flex;
margin: 0 20px 21px 0;
transition: 0.5s ease-in-out;
.avatar {
width: 204px;
height: 100%;
img {
width: 157px;
height: 157px;
margin: 20px 0 0 23px;
}
}
.text {
margin-top: 30px;
h6 {
font-size: 18px;
font-family: HelveticaNeueLTPro-Md;
line-height: 18px;
color: #aa1941;
margin-bottom: 10px;
}
p {
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 22px;
color: #666;
}
div {
font-size: 12px;
font-family: Source Han Sans CN;
font-weight: 300;
line-height: 18px;
color: #666;
}
}
}
li:nth-child(even) {
margin-right: 0;
}
li:hover {
background: #aa1941;
.text {
h6,
p,
div {
color: #fff;
}
}
}
}
}
}
.is-h5 {
.alumni {
padding: 0 0.16rem 0.35rem;
h5 {
font-size: 0.14rem;
font-weight: 700;
line-height: 100%;
padding: 0.2rem 0;
color: #333;
}
.card-list {
margin-bottom: 0.15rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
li {
box-sizing: border-box;
width: 1.68rem;
background: #ebebeb;
padding: 0.11rem 0.05rem;
display: flex;
margin-bottom: 0.06rem;
margin-left: 0.06rem;
&:nth-child(odd) {
margin-left: 0;
}
.avatar {
// width: 204px;
// height: 100%;
img {
width: 0.63rem;
height: 0.63rem;
display: block;
}
}
.text {
// margin-top: .3rem;
margin-left: 0.1rem;
h6 {
font-size: 0.11rem;
color: #aa1941;
font-weight: 700;
white-space: nowrap;
}
p {
font-size: 0.1rem;
line-height: 0.15rem;
color: #666;
}
div {
font-size: 0.07rem;
line-height: 0.15rem;
color: #666;
margin-top: 0.02rem;
}
}
}
li:nth-child(even) {
margin-right: 0;
}
li:hover {
background: #aa1941;
.text {
h6,
p,
div {
color: #fff;
}
}
}
}
}
}
</style>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<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>
<div class="text">返回</div>
</div>
<div class="times">{{ formatDate(data.start_time) }}</div>
<div class="titles">{{ data.title }}</div>
<div class="article-content" v-html="data.content"></div>
<recommend />
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
import recommend from '@/components/recommend'
export default {
layout: 'normal',
components: {
appFrame,
recommend
},
data() {
return {
frameParams: {
slider: [
{
name: this.$t('menu.alumniChild.outstanding'),
path: '/alumni/outstanding'
},
{
name: this.$t('menu.alumniChild.share'),
path: '/alumni/sharing'
}
]
},
data: {},
listData: []
}
},
async fetch() {
this.data = await this.$axios.get(`/api/cms/api/v1/article/${this.$route.params.id}/detail`).then(res => {
return res.data
})
},
mounted() {},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
console.log(date.getMonth())
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
::v-deep {
img {
max-width: 100%;
height: auto !important;
}
}
.is-pc {
.detail-content-box {
// background: #fff;
// box-sizing: border-box;
// margin-bottom: 100px;
.content-box {
padding: 50px 50px 94px;
}
.back-btn {
display: flex;
align-items: center;
cursor: pointer;
.el-icon-arrow-left {
color: rgba(153, 153, 153, 1);
font-size: 16px;
}
.text {
font-size: 16px;
color: #999999;
}
}
.times {
font-size: 16px;
line-height: 100%;
margin: 35px 0 16px;
color: #999999;
}
.titles {
font-size: 32px;
font-weight: bold;
color: #141414;
// height: 62px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 10px;
// line-height: 100%;
}
.article-content {
padding-top: 25px;
font-size: 14px;
line-height: 28px;
color: #333333;
img {
display: block;
width: 100%;
margin-top: 40px;
}
}
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 37px;
.titles {
display: flex;
align-items: center;
.line {
width: 6px;
height: 22px;
background: #aa1941;
}
.text {
font-size: 22px;
color: #333333;
margin-left: 10px;
}
}
.list-box {
margin-top: 50px;
display: flex;
justify-content: space-between;
li {
width: 280px;
img {
width: 280px;
height: 184px;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 16px;
line-height: 26px;
color: #333333;
margin-top: 10px;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 164px;
height: 40px;
border: 1px solid #d3d3d3;
border-radius: 8px;
line-height: 40px;
text-align: center;
font-size: 16px;
color: #999999;
margin: 50px auto 0;
cursor: pointer;
}
}
}
.is-h5 {
.detail-content-box {
// background: #fff;
// box-sizing: border-box;
// margin-bottom: 100px;
.content-box {
padding: 0.25rem 0.25rem 0.47rem;
}
.back-btn {
display: flex;
align-items: center;
cursor: pointer;
.el-icon-arrow-left {
color: rgba(153, 153, 153, 1);
font-size: 16px;
}
.text {
font-size: 0.14rem;
color: #999999;
}
}
.times {
font-size: 0.14rem;
line-height: 100%;
margin: 0.17rem 0 0.08rem;
color: #999999;
}
.titles {
font-size: 0.18rem;
font-weight: bold;
color: #141414;
// height: 62px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 0.05rem;
// line-height: 100%;
}
.article-content {
padding-top: 0.13rem;
font-size: 0.12rem;
line-height: 0.14rem;
color: #333333;
img {
display: block;
width: 100%;
margin-top: 0.2rem;
}
}
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 0.17rem;
.titles {
display: flex;
align-items: center;
.line {
width: 0.03rem;
height: 0.11rem;
background: #aa1941;
}
.text {
font-size: 0.16rem;
color: #333333;
margin-left: 0.05rem;
}
}
.list-box {
margin-top: 0.25rem;
display: flex;
justify-content: space-between;
li {
width: 1.4rem;
img {
width: 1.4rem;
height: 0.92rem;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 0.14rem;
line-height: 0.13rem;
color: #333333;
margin-top: 0.05rem;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 0.82rem;
height: 0.2rem;
border: 1px solid #d3d3d3;
border-radius: 0.04rem;
line-height: 0.2re;
text-align: center;
font-size: 0.14rem;
color: #999999;
margin: 0.25rem auto 0;
cursor: pointer;
}
}
}
</style>
<template>
<app-frame :data="frameParams">
<article-list v-bind="listOptions"></article-list>
</app-frame>
</template>
<script>
import appFrame from '@/components/appFrame'
import ArticleList from '@/components/ArticleList'
import { getArticleList } from '@/api'
export default {
layout: 'normal',
components: { appFrame, ArticleList },
data() {
return {
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-xyfx.png',
slider: [
{
name: this.$t('menu.alumniChild.outstanding'),
path: '/alumni/outstanding',
},
{
name: this.$t('menu.alumniChild.share'),
path: '/alumni/sharing',
}
]
}
}
},
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>
<template>
<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">
<div class="title">{{ item.title }}</div>
<ul>
<template v-for="(cItem, cIndex) in item.problem">
<li :key="cIndex + '='">
<div class="pro-tit">{{ cItem.tit }}</div>
<div class="answer" v-html="cItem.answer"></div>
</li>
</template>
</ul>
</div>
</template>
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
problemList: [
{
title: this.$t('problem.item1Tit'),
problem: [
{
tit: this.$t('problem.item1problem1'),
answer: this.$t('problem.item1answer1')
},
{
tit: this.$t('problem.item1problem2'),
answer: this.$t('problem.item1answer2')
},
{
tit: this.$t('problem.item1problem3'),
answer: this.$t('problem.item1answer3')
}
]
},
{
title: this.$t('problem.item2Tit'),
problem: [
{
tit: this.$t('problem.item2problem1'),
answer: this.$t('problem.item2answer1')
},
{
tit: this.$t('problem.item2problem2'),
answer: this.$t('problem.item2answer2')
}
]
},
{
title: this.$t('problem.item3Tit'),
problem: [
{
tit: this.$t('problem.item3problem1'),
answer: this.$t('problem.item3answer1')
}
]
}
],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-cjwt.png',
slider: [
{
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'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc{
.problem-content-box {
.content-box {
padding: 54px 104px 90px 87px;
.problem-item-box {
margin-bottom: 80px;
.title {
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #333333;
}
ul {
padding-top: 30px;
li {
margin-bottom: 15px;
.pro-tit {
font-size: 16px;
font-weight: bold;
line-height: 32px;
color: #666666;
border-bottom: 1px solid #e6e6e6;
}
.answer {
font-size: 16px;
line-height: 32px;
color: #424242;
}
}
}
}
}
}
}
.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>
<template>
<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">{{ $t('apply.con1Tit') }}</div>
<div class="con-txt" v-html="$t('apply.con1Txt')"></div>
<div class="title mar-t55">{{ $t('apply.con2Tit') }}</div>
<div style="padding-right:87px;">
<img src="https://webapp-pub.ezijing.com/project/seg-shms/bmlc0402.png" style="width:100%;">
</div>
<!-- <div class="con-txt" v-html="$t('apply.con2Txt')"></div> -->
</div>
</div>
</div>
<!-- <div style="padding:0 87px;">
<img src="https://webapp-pub.ezijing.com/project/seg-shms/bmlc0402.png" style="width:100%;">
</div> -->
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
newsList: [],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/project-js48-02.jpg',
slider: [
{
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'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.rele-content-box {
.content-box {
img {
width: 900px;
margin: 58px auto 0;
display: block;
}
padding-top: 46px;
padding-bottom: 106px;
.text-content {
padding-left: 87px;
.title {
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: 55px;
}
}
.con-txt {
font-size: 16px;
line-height: 34px;
color: #424242;
margin-top: 20px;
::v-deep{
span{
font-weight: bold;
}
}
}
}
}
}
}
.is-h5 {
.rele-content-box {
background: #fff;
padding: 0.3rem 0.2rem;
.content-box {
img {
width: 100%;
display: block;
}
padding-bottom: 0.5rem;
.text-content {
margin-bottom: 0.4rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: 0.25rem;
}
}
.con-txt {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
padding-top: 0.14rem;
::v-deep{
span{
font-weight: bold;
}
}
}
}
}
}
}
</style>
<template>
<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">{{ $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>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
layout: 'normal',
components: {
appFrame
},
data() {
return {
newsList: [],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-fyzz.png',
slider: [
{
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'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.rele-content-box {
.content-box {
padding-top: 46px;
padding-bottom: 106px;
.text-content {
padding-left: 87px;
.title {
font-size: 22px;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: 55px;
}
}
.con-txt {
font-size: 16px;
line-height: 34px;
color: #424242;
margin-top: 20px;
}
}
}
}
}
.is-h5 {
.rele-content-box {
background: #fff;
padding: 0.3rem 0.2rem;
.content-box {
.text-content {
padding-left: 0.2rem;
.title {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
&.mar-t55 {
margin-top: 0.25rem;
}
}
.con-txt {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
padding-top: 0.14rem;
}
}
}
}
}
</style>
<template>
<div class="contact-box">
<div class="box">
<div class="t-box">
<div class="t">EZIJING<br />BEIJING</div>
<div class="line"></div>
<div class="name">清控紫荆(北京)教育科技股份有限公司</div>
<p>联系人:孙老师 <br />电话:18610151616 <br />地址:北京市海淀区中关村东路1号院7号楼5层</p>
</div>
</div>
</div>
</template>
<script>
export default {
layout: 'normal',
components: {},
data() {
return {}
}
}
</script>
<style lang="scss" scoped>
.contact-box {
width: 100%;
height: 650px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/exed/training/contact-bg.png) center;
background-size: cover;
margin-bottom: 110px;
.box {
width: 100%;
height: 650px;
background: rgba(0, 0, 0, 0.5);
position: relative;
.t-box {
position: absolute;
top: 193px;
left: 463px;
.t {
font-size: 24px;
color: #ffffff;
line-height: 36px;
}
.line {
width: 91px;
height: 2px;
background-color: #fff;
margin: 20px 0 30px;
}
.name {
font-size: 30px;
font-weight: 500;
color: #ffffff;
line-height: 24px;
}
p {
font-size: 16px;
color: #ffffff;
line-height: 24px;
margin-top: 30px;
}
}
}
}
.container {
width: 100%;
padding-bottom: 50px;
}
</style>
<template>
<div class="container">
<!-- 轮播图 -->
<banner />
<!-- 项目特色 -->
<project-features style="background-color: #fff;" />
<!-- 优秀师资 -->
<teacher />
<!-- 上课环境 -->
<environment />
<!-- 部分服务过学员企业 -->
<enterprise />
<!-- 报名需知 -->
<notice />
<!-- 学校排名 -->
<!-- <school-ranking /> -->
<!-- 最新动态 -->
<!-- <news /> -->
<!-- 师生风采 -->
<presence />
<!-- 常见问题 -->
<!-- <common-problem /> -->
<!-- 公开课 -->
<!-- <open-class /> -->
<!-- 右侧功能栏 -->
<right-aside />
</div>
</template>
<script>
import banner from '../components/home/banner'
import projectFeatures from '../components/home/projectFeatures'
import environment from '../components/home/environment'
import teacher from '../components/home/teacher'
import enterprise from '../components/home/enterprise'
import notice from '../components/home/notice'
import presence from '../components/home/presence'
import rightAside from '../components/rightAside'
export default {
layout: 'normal',
components: {
banner,
projectFeatures,
teacher,
environment,
enterprise,
notice,
presence,
rightAside
},
data() {
return {
isScale: false
}
},
created() {},
mounted() {
if (document.documentElement.clientWidth < 1400) {
// this.isScale = true
}
}
}
</script>
<style>
.container {
width: 100%;
padding-bottom: 50px;
}
</style>
......@@ -3,41 +3,49 @@
<!-- 轮播图 -->
<banner />
<!-- 项目特色 -->
<project-features />
<project-features style="background-color: #fff;" />
<!-- 优秀师资 -->
<teacher />
<!-- 上课环境 -->
<environment />
<!-- 部分服务过学员企业 -->
<enterprise />
<!-- 报名需知 -->
<notice />
<!-- 学校排名 -->
<school-ranking />
<!-- <school-ranking /> -->
<!-- 最新动态 -->
<news />
<!-- <news /> -->
<!-- 师生风采 -->
<presence />
<!-- 常见问题 -->
<common-problem />
<!-- <common-problem /> -->
<!-- 公开课 -->
<open-class />
<!-- <open-class /> -->
<!-- 右侧功能栏 -->
<!-- <right-aside /> -->
<right-aside />
</div>
</template>
<script>
import banner from '../components/home/banner'
import projectFeatures from '../components/home/projectFeatures'
import schoolRanking from '../components/home/schoolRanking'
import news from '../components/home/news'
import environment from '../components/home/environment'
import teacher from '../components/home/teacher'
import enterprise from '../components/home/enterprise'
import notice from '../components/home/notice'
import presence from '../components/home/presence'
import commonProblem from '../components/home/commonProblem'
import openClass from '../components/home/openClass'
import rightAside from '../components/rightAside'
export default {
layout: 'normal',
components: {
banner,
projectFeatures,
schoolRanking,
news,
teacher,
environment,
enterprise,
notice,
presence,
commonProblem,
openClass,
rightAside
},
data() {
......
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<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>
<div class="text">返回</div>
</div>
<div class="times">{{ formatDate(data.start_time) }}</div>
<div class="titles">{{ data.title }}</div>
<div class="article-content" v-html="data.content"></div>
<recommend />
</div>
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
import recommend from '@/components/recommend'
export default {
layout: 'normal',
components: {
appFrame,
recommend
},
data() {
return {
frameParams: {
slider: [
{
name: this.$t('menu.newsChild.hot'),
path: '/news/hot'
},
{
name: this.$t('menu.newsChild.interview'),
path: '/news/interview'
}
]
},
data: {},
listData: []
}
},
async fetch() {
this.data = await this.$axios.get(`/api/cms/api/v1/article/${this.$route.params.id}/detail`).then(res => {
return res.data
})
},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
console.log(date.getMonth())
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
::v-deep {
img {
max-width: 100%;
height: auto !important;
}
}
.is-pc {
.detail-content-box {
// background: #fff;
// box-sizing: border-box;
// margin-bottom: 100px;
.content-box {
padding: 50px 50px 94px;
}
.back-btn {
display: flex;
align-items: center;
cursor: pointer;
.el-icon-arrow-left {
color: rgba(153, 153, 153, 1);
font-size: 16px;
}
.text {
font-size: 16px;
color: #999999;
}
}
.times {
font-size: 16px;
line-height: 100%;
margin: 35px 0 16px;
color: #999999;
}
.titles {
font-size: 32px;
font-weight: bold;
color: #141414;
// height: 62px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 10px;
// line-height: 100%;
}
.article-content {
padding-top: 25px;
font-size: 14px;
line-height: 28px;
color: #333333;
img {
display: block;
width: 100%;
margin-top: 40px;
}
}
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 37px;
.titles {
display: flex;
align-items: center;
.line {
width: 6px;
height: 22px;
background: #aa1941;
}
.text {
font-size: 22px;
color: #333333;
margin-left: 10px;
}
}
.list-box {
margin-top: 50px;
display: flex;
justify-content: space-between;
li {
width: 280px;
img {
width: 280px;
height: 184px;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 16px;
line-height: 26px;
color: #333333;
margin-top: 10px;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 164px;
height: 40px;
border: 1px solid #d3d3d3;
border-radius: 8px;
line-height: 40px;
text-align: center;
font-size: 16px;
color: #999999;
margin: 50px auto 0;
cursor: pointer;
}
}
}
.is-h5 {
.detail-content-box {
// background: #fff;
// box-sizing: border-box;
// margin-bottom: 100px;
.content-box {
padding: 0.25rem 0.25rem 0.47rem;
}
.back-btn {
display: flex;
align-items: center;
cursor: pointer;
.el-icon-arrow-left {
color: rgba(153, 153, 153, 1);
font-size: 16px;
}
.text {
font-size: 0.14rem;
color: #999999;
}
}
.times {
font-size: 0.14rem;
line-height: 100%;
margin: 0.17rem 0 0.08rem;
color: #999999;
}
.titles {
font-size: 0.18rem;
font-weight: bold;
color: #141414;
// height: 62px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 0.05rem;
// line-height: 100%;
}
.article-content {
padding-top: 0.13rem;
font-size: 0.12rem;
line-height: 0.14rem;
color: #333333;
img {
display: block;
width: 100%;
margin-top: 0.2rem;
}
}
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 0.17rem;
.titles {
display: flex;
align-items: center;
.line {
width: 0.03rem;
height: 0.11rem;
background: #aa1941;
}
.text {
font-size: 0.16rem;
color: #333333;
margin-left: 0.05rem;
}
}
.list-box {
margin-top: 0.25rem;
display: flex;
justify-content: space-between;
li {
width: 1.4rem;
img {
width: 1.4rem;
height: 0.92rem;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 0.14rem;
line-height: 0.13rem;
color: #333333;
margin-top: 0.05rem;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 0.82rem;
height: 0.2rem;
border: 1px solid #d3d3d3;
border-radius: 0.04rem;
line-height: 0.2re;
text-align: center;
font-size: 0.14rem;
color: #999999;
margin: 0.25rem auto 0;
cursor: pointer;
}
}
}
</style>
<template>
<app-frame :data="frameParams">
<article-list v-bind="listOptions"></article-list>
</app-frame>
</template>
<script>
import appFrame from '@/components/appFrame'
import ArticleList from '@/components/ArticleList'
import { getArticleList } from '@/api'
export default {
layout: 'normal',
components: { appFrame, ArticleList },
data() {
return {
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-rdxw.png',
slider: [
{
name: this.$t('menu.newsChild.hot'),
path: '/news/hot'
},
{
name: this.$t('menu.newsChild.interview'),
path: '/news/interview'
}
]
}
}
},
computed: {
listOptions() {
return {
remote: {
httpRequest: getArticleList,
params: { project_id: process.env.newProjectId, type_tag: this.$route.query.type || 'article_news_hot' }
},
to(item) {
return `/news/hot/${item.id}`
}
}
}
},
methods: {
}
}
</script>
\ No newline at end of file
<template>
<div class="detail-content-box">
<app-frame :data="frameParams">
<div class="content-box">
<div class="back-btn" @click="$router.go(-1)">
<div class="el-icon-arrow-left"></div>
<div class="text">返回</div>
</div>
<div class="times">{{ formatDate(data.start_time) }}</div>
<div class="titles">{{ data.title }}</div>
<div class="article-content" v-html="data.content"></div>
<recommend />
</div>
</app-frame>
</div>
</template>
<script>
import appFrame from '@/components/appFrame'
import recommend from '@/components/recommend'
export default {
layout: 'normal',
watchQuery: true,
components: {
appFrame,
recommend
},
data() {
return {
frameParams: {
slider: [
{
name: this.$t('menu.newsChild.hot'),
path: '/news/hot'
},
{
name: this.$t('menu.newsChild.interview'),
path: '/news/interview'
}
]
},
data: {},
listData: []
}
},
async fetch() {
this.data = await this.$axios.get(`/api/cms/api/v1/article/${this.$route.params.id}/detail`).then(res => {
return res.data
})
},
mounted() {},
methods: {
formatDate(value) {
const date = new Date(value * 1000)
console.log(date.getMonth())
return date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate()
}
}
}
</script>
<style lang="scss" scoped>
.detail-content-box {
// width: 1000px;
// background: #fff;
// box-sizing: border-box;
// margin-bottom: 100px;
.content-box {
padding: 50px 50px 94px;
}
.back-btn {
display: flex;
align-items: center;
cursor: pointer;
.el-icon-arrow-left {
color: rgba(153, 153, 153, 1);
font-size: 16px;
}
.text {
font-size: 16px;
color: #999999;
}
}
.times {
font-size: 16px;
line-height: 100%;
margin: 35px 0 16px;
color: #999999;
}
.titles {
font-size: 32px;
font-weight: bold;
color: #141414;
// height: 62px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 10px;
// line-height: 100%;
}
.article-content {
padding-top: 25px;
font-size: 14px;
line-height: 28px;
color: #333333;
img {
display: block;
width: 100%;
margin-top: 40px;
}
}
.recommend-content {
border-top: 1px solid #e6e6e6;
padding-top: 37px;
.titles {
display: flex;
align-items: center;
.line {
width: 6px;
height: 22px;
background: #aa1941;
}
.text {
font-size: 22px;
color: #333333;
margin-left: 10px;
}
}
.list-box {
margin-top: 50px;
display: flex;
justify-content: space-between;
li {
width: 280px;
img {
width: 280px;
height: 184px;
display: block;
}
.dec {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 16px;
line-height: 26px;
color: #333333;
margin-top: 10px;
}
}
}
}
.more-btn {
position: relative;
z-index: 999;
width: 164px;
height: 40px;
border: 1px solid #d3d3d3;
border-radius: 8px;
line-height: 40px;
text-align: center;
font-size: 16px;
color: #999999;
margin: 50px auto 0;
cursor: pointer;
}
}
</style>
<template>
<app-frame :data="frameParams">
<article-list v-bind="listOptions"></article-list>
</app-frame>
</template>
<script>
import appFrame from '@/components/appFrame'
import ArticleList from '@/components/ArticleList'
import { getArticleList } from '@/api'
export default {
layout: 'normal',
components: { appFrame, ArticleList },
data() {
return {
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-jscf.png',
slider: [
{
name: this.$t('menu.newsChild.hot'),
path: '/news/hot'
},
{
name: this.$t('menu.newsChild.interview'),
path: '/news/interview'
}
]
}
}
},
computed: {
listOptions() {
return {
remote: {
httpRequest: getArticleList,
params: { project_id: process.env.newProjectId, type_tag: 'kelley_interview' }
},
to(item) {
return `/news/interview/${item.id}`
}
}
}
}
}
</script>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="content-mian" v-if="isMobile">
<tab-content @tabChange="tabChange"></tab-content>
<div class="content-mod1" v-if="showIndex === 0">
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley-h5/project-mod1-banner.png"
class="main-banner"
/>
<div class="content-txt">
<!-- <div class="tit">{{ $t('bg.brief') }}</div> -->
<div class="text">
<div class="p" v-html="$t('bg.con1Txt')"></div>
</div>
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley-h5/project-mod1-img.png" alt="" />
</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" />
<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" />
<div class="content-txt">
<div class="p" v-html="$t('bg.con3Txt')"></div>
</div>
</div>
</div>
<div class="project-bg-main" v-else>
<ul class="tabs">
<li
v-for="item in list"
:key="item.name"
:class="{ 'is-active': tabActive === item.name }"
@click="tabActive = item.name"
>
{{ item.label }}
</li>
</ul>
<div class="zjjy" v-if="tabActive === 'zjjy'">
<div class="sub-banner">
<img src="https://webapp-pub.ezijing.com/project/kelley/project-intro-bg-zjjy.png" />
</div>
<div class="text" v-html="$t('bg.con1Txt')"></div>
<div class="tags">
<div
:class="{ 'tag-item': true, big: (index + 2) % 4 === 0 }"
v-for="(item, index) in tags"
:key="item.text"
>
<div class="tag-item-inner">
<p>
<span>{{ item.num }}</span
>{{ item.unit }}
</p>
<span>{{ item.text }}</span>
</div>
<el-divider direction="vertical" v-if="(index + 1) % 4 !== 0"></el-divider>
</div>
</div>
</div>
<div class="kelley" v-if="tabActive === 'kelley'">
<div class="sub-banner">
<img src="https://webapp-pub.ezijing.com/project/seg-shms/project-intor-bg.jpg" />
</div>
<div class="text" v-html="$t('bg.con2Txt')"></div>
</div>
<div class="lhbx" v-if="tabActive === 'lhbx'">
<div class="sub-banner">
<img src="https://webapp-pub.ezijing.com/project/kelley/project-intro-bg-lhbx.png" />
</div>
<div class="text" v-html="$t('bg.con3Txt')"></div>
</div>
</div>
</app-frame>
</div>
</template>
<script>
import TabNav from './components/TabNav'
import TabContent from './components/TabContent'
export default {
layout: 'normal',
components: {
TabNav,
TabContent
},
data() {
return {
showIndex: 0,
tabActive: 'zjjy',
list: [
{ name: 'zjjy', label: this.$t('bg.tabBtn1') },
{ name: 'kelley', label: this.$t('bg.tabBtn2') },
{ name: 'lhbx', label: this.$t('bg.tabBtn3') }
],
tags: [
{ num: 12, unit: this.$t('bg.unit1'), text: this.$t('bg.con1ItemT1') },
{ num: 522, unit: this.$t('bg.unit2'), text: this.$t('bg.con1ItemT2') },
{ num: 600, unit: '+', text: this.$t('bg.con1ItemT3') },
{ num: 700, unit: '+', text: this.$t('bg.con1ItemT4') },
{ num: 1000, unit: '+', text: this.$t('bg.con1ItemT5') },
{ num: 4800, unit: '+', text: this.$t('bg.con1ItemT6') },
{ num: 5000, unit: '+', text: this.$t('bg.con1ItemT7') },
{ num: 500, unit: this.$t('bg.unit3'), text: this.$t('bg.con1ItemT8') }
],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-xmbj.png',
slider: [
{
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'
}
]
}
}
},
methods: {
tabChange(n) {
this.showIndex = n
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.project-bg-main {
padding: 42px 64px 50px;
.tabs {
margin-top: 42px;
display: flex;
justify-content: space-between;
li {
background: #fbfbfb;
width: 32%;
height: 83px;
line-height: 83px;
border-top: 8px solid #fbfbfb;
font-size: 26px;
font-family: Source Han Sans CN;
color: #333;
text-align: center;
cursor: pointer;
}
li.is-active {
border-color: #aa1941;
color: #aa1941;
background-color: #fff;
box-shadow: 0px 1px 25px rgba(0, 0, 0, 0.06);
}
}
.sub-banner {
margin-top: 18px;
height: 302px;
img {
width: 100%;
height: 100%;
}
}
.text {
font-size: 16px;
font-family: Source Han Sans CN;
line-height: 32px;
color: #424242;
letter-spacing: 1px;
margin-top: 40px;
}
.tags {
width: 780px;
margin: 40px auto 0;
display: flex;
flex-direction: row;
flex-wrap: wrap;
// justify-content: space-between;
.tag-item {
width: 180px;
margin-bottom: 10px;
.tag-item-inner {
display: inline-block;
text-align: center;
width: calc(100% - 17px);
p {
font-size: 20px;
color: #aa1941;
span {
font-size: 28px;
font-weight: bold;
}
}
> span {
font-size: 16px;
line-height: 34px;
color: #666666;
}
}
.el-divider {
height: 100%;
float: right;
}
}
.tag-item.big {
width: 240px;
}
}
}
}
::v-deep {
// .is-h5{
.main-page-content {
background-color: #eee !important;
// }
}
}
.is-h5 {
.content-mian {
padding: 0 0.16rem;
.content-mod1 {
padding-top: 0.18rem;
img {
width: 100%;
display: block;
}
.content-txt {
background: #fff;
padding: 0 0.16rem 0.42rem;
margin-bottom: 0.36rem;
.tit {
font-size: 0.14rem;
font-weight: bold;
line-height: 100%;
color: #333333;
padding-top: 0.23rem;
padding-bottom: 0.1rem;
}
.text {
.p {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
}
}
img {
width: 2.59rem;
margin-left: 0.08rem;
margin-top: 0.27rem;
display: block;
}
}
}
.content-mod2 {
margin-top: 0.18rem;
background: #fff;
img {
width: 100%;
}
.content-txt {
background: #fff;
padding: 0 0.16rem 0.42rem;
margin-bottom: 0.36rem;
.p {
font-size: 0.12rem;
line-height: 0.24rem;
color: #424242;
margin-top: 0.35rem;
}
}
}
}
}
</style>
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<div class="certificate">
<div class="checkbox">
<p><i></i>{{ $t('cert.txt1') }}</p>
<!-- <p><i></i>{{ $t('cert.txt2') }}</p> -->
</div>
<p class="text">{{ $t('cert.txt3') }}</p>
<img src="https://webapp-pub.ezijing.com/project/seg-shms/SHMS_MBA_Diploma.jpg" />
<p class="certificate-title">{{ $t('cert.txt4') }}</p>
<p class="certificate-des">{{ $t('cert.txt5') }}</p>
</div>
</app-frame>
</div>
</template>
<script>
export default {
layout: 'normal',
data() {
return {
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/project-js48-01.jpg',
slider: [
{
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'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.certificate {
padding: 40px;
text-align: center;
.checkbox {
display: flex;
width: 450px;
margin: 0 auto;
justify-content: center;
p {
width: 50%;
text-align: center;
font-size: 22px;
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 34px;
color: #424242;
i {
display: inline-block;
width: 22px;
height: 22px;
background: url('https://webapp-pub.ezijing.com/project/kelley/project-intro-certificate-icon.png');
background-size: 22px 22px;
margin-right: 10px;
vertical-align: middle;
}
}
}
.text {
text-align: center;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #424242;
margin-top: 40px;
}
img {
display: block;
width: 376px;
height: 291px;
margin: 40px auto;
}
.certificate-title {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #424242;
margin-top: 26px;
}
.certificate-des {
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 34px;
color: #aa1941;
}
}
}
.is-h5 {
.certificate {
padding: 0.3rem 0.52rem;
text-align: center;
.checkbox {
display: flex;
// width: 450px;
margin: 0 auto;
p {
width: 50%;
text-align: center;
// font-size: .12rem;
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 0.17rem;
color: #424242;
i {
display: inline-block;
width: 0.18rem;
height: 0.18rem;
background: url('https://webapp-pub.ezijing.com/project/kelley/project-intro-certificate-icon.png');
background-size: 0.18rem 0.18rem;
margin-right: 0.05rem;
vertical-align: middle;
}
}
}
.text {
text-align: center;
font-size: 0.12rem;
color: #424242;
margin-top: 0.2rem;
}
img {
display: block;
width: 100%;
display: block;
// height: 291px;
margin: 0.2rem auto;
}
.certificate-title {
font-size: 0.12rem;
color: #424242;
margin-top: 0.13rem;
}
.certificate-des {
color: #aa1941;
}
}
}
</style>
\ No newline at end of file
<template>
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<app-frame :data="frameParams">
<ul class="card">
<li v-for="item in list" :key="item.title">
<div class="left">
<img :src="item.img" />
</div>
<div class="right">
<h5>{{ item.title }}</h5>
<p v-for="text in item.texts" :key="text">{{ text }}</p>
</div>
</li>
</ul>
</app-frame>
</div>
</template>
<script>
export default {
layout: 'normal',
data() {
return {
list: [
{
img: 'https://webapp-pub.ezijing.com/project/kelley/project-intro-charac-icon1.png',
title: this.$t('feature.item1Tit'),
texts: [
this.$t('feature.item1Txt1'),
this.$t('feature.item1Txt2'),
this.$t('feature.item1Txt3'),
this.$t('feature.item1Txt4')
]
},
{
img: 'https://webapp-pub.ezijing.com/project/kelley/project-intro-charac-icon2.png',
title: this.$t('feature.item2Tit'),
texts: [this.$t('feature.item2Txt1')]
},
{
img: 'https://webapp-pub.ezijing.com/project/kelley/project-intro-charac-icon3.png',
title: this.$t('feature.item3Tit'),
texts: [this.$t('feature.item3Txt1')]
}
],
frameParams: {
banner: 'https://webapp-pub.ezijing.com/project/seg-shms/banner-bg-xmts.png',
slider: [
{
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'
}
]
}
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
}
}
}
</script>
<style lang="scss" scoped>
.is-pc {
.card {
width: 763px;
margin: 0 auto 0;
padding: 80px 0 30px;
li {
height: 205px;
background: #f9f8f8;
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.09);
margin-bottom: 50px;
display: flex;
.left {
width: 212px;
// background:#fcfcfc;
img {
width: 120px;
height: 120px;
margin: 43px 0 0 47px;
}
}
.right {
width: calc(100% - 212px);
padding-top: 20px;
h5 {
font-size: 22px;
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 44px;
color: #333333;
}
p {
color: #424242;
font-size: 16px;
font-family: Source Han Sans CN;
line-height: 36px;
}
}
}
}
}
.is-h5 {
.card {
background: #fff;
// padding: .24rem .15rem .56rem;
li {
background: #f9f8f8;
box-shadow: 0 0 0 rgb(0 0 0 / 9%);
margin-bottom: 0.16rem;
display: flex;
align-items: center;
box-sizing: border-box;
padding: 0.16rem 0.14rem 0.1rem;
.left {
img {
width: 0.72rem;
height: 0.72rem;
display: block;
}
}
.right {
margin-left: 0.23rem;
h5 {
font-size: 0.12rem;
font-weight: 700;
line-height: 100%;
color: #333;
margin-bottom: 0.16rem;
}
p {
font-size: 0.1rem;
font-family: Source Han Sans CN;
line-height: 100%;
color: #424242;
margin-bottom: 0.1rem;
}
}
}
}
}
</style>
\ No newline at end of file
<template>
<ul class="tab-content">
<li
v-for="(item, index) in items"
:key="index"
:class="activeIndex === index && 'active'"
@click="tabChange(index)"
>
{{ item }}
</li>
</ul>
</template>
<script>
export default {
data() {
return {
items: [this.$t('bg.tabBtn1'), this.$t('bg.tabBtn2'), this.$t('bg.tabBtn3')],
activeIndex: 0
}
},
methods: {
tabChange(n) {
this.activeIndex = n
this.$emit('tabChange', n)
}
}
}
</script>
<style lang="scss" scoped>
.tab-content{
padding-top: .2rem;
display: flex;
justify-content: space-between;
li{
width: 1.1rem;
height: 0.75rem;
line-height: .75rem;
background: #FFFFFF;
text-align: center;
font-size: 0.13rem;
font-weight: bold;
color: #333333;
position: relative;
&.active{
color: #AA1941;
&::after{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 0.04rem;
background: #AA1941
}
}
}
}
</style>
<template>
<tab-nav :list="list" v-bind="$attrs"></tab-nav>
</template>
<script>
import TabNav from '@/components/base/h5/TabNav'
export default {
components: { TabNav },
data() {
return {
list: [
{ name: this.$t('menu.projectChild.bg'), path: '/project/bg', value: '1' },
{ name: this.$t('menu.projectChild.feature'), path: '/project/charac', value: '2' },
{ name: this.$t('menu.projectChild.cert'), path: '/project/certificate', value: '3' }
]
}
}
}
</script>
<style>
</style>
<template>
<div class="container">
<!-- 轮播图 -->
<banner />
<!-- 挑战和机遇 -->
<chance />
<!-- 内训流程 -->
<process />
<!-- 内训课程 -->
<course />
<!-- 优秀师资 -->
<teacher />
<!-- 企业 -->
<enterprise />
<!-- 课堂 -->
<classroom />
<!-- 优势 -->
<projectFeatures />
<!-- 上课环境 -->
<environment />
<!-- 报名 -->
<presence />
</div>
</template>
<script>
import banner from '../components/training/banner'
import chance from '../components/training/chance'
import process from '../components/training/process'
import course from '../components/training/course'
import teacher from '../components/training/teacher'
import enterprise from '../components/training/enterprise'
import classroom from '../components/training/classroom'
import projectFeatures from '../components/training/projectFeatures'
import environment from '../components/training/environment'
import presence from '../components/home/presence'
// import rightAside from '../components/rightAside'
export default {
layout: 'normal',
components: {
banner,
chance,
process,
course,
teacher,
enterprise,
classroom,
projectFeatures,
environment,
presence
// projectFeatures,
// teacher,
// environment,
// enterprise,
// notice,
// presence,
// rightAside
},
data() {
return {
isScale: false
}
},
created() {},
mounted() {
if (document.documentElement.clientWidth < 1400) {
// this.isScale = true
}
}
}
</script>
<style>
.container {
width: 100%;
padding-bottom: 50px;
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论