提交 8101f2f1 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 新增留资提交

上级 9e70e7ad
This source diff could not be displayed because it is too large. You can view the blob instead.
<template>
<div class="form-submit">
<h2>{{ title }}</h2>
<div class="desc">
<ul>
<li>免联考</li>
<li>在职读</li>
<li>申请制入学</li>
<li>双语授课</li>
</ul>
<p>学制1-2年 <span>|</span> 海外正规院校 <span>|</span> 全球精英校友</p>
</div>
<el-form inline :model="form" :rules="rules" ref="form">
<el-form-item prop="name">
<el-input type="text" v-model="form.name" placeholder="请输入您的名字"></el-input>
</el-form-item>
<el-form-item prop="phone">
<el-input type="text" v-model="form.phone" placeholder="请输入您的手机号"></el-input>
</el-form-item>
<el-form-item prop="project_id">
<el-select v-model="form.project_id" placeholder="请选择项目">
<el-option v-for="item in projects" v-bind="item" :key="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleSubmit">立即报名</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import { postNes } from '@/api/index'
export default {
props: { type: { type: Number, default: 1 } },
data() {
return {
form: {
name: '',
phone: '',
project_id: '',
channel: this.$route.query.channel_num || 19962
},
rules: {
name: [{ required: true, message: '请输入您的名字', trigger: 'blur' }],
phone: [
{ required: true, message: '请输入您的手机号', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }
],
project_id: [{ required: true, message: '请选择项目', trigger: 'change' }]
}
}
},
computed: {
title() {
return this.type === 1 ? '选择清控紫荆教育,助您考取国际硕士学位' : '选择清控紫荆教育,助您考取国际学位'
},
projects() {
if (this.type === 1) {
return [
{ label: this.$t('aside.project4'), value: '1001' },
{ label: this.$t('aside.project5'), value: '1006' },
{ label: this.$t('aside.project6'), value: '1005' },
{ label: this.$t('aside.project1'), value: '1012' },
{ label: this.$t('aside.project3'), value: '1008' },
{ label: '餐饮管理方向MBA', value: '1015' }
]
} else {
return [
{ label: '工商管理博士项目加州浸会大学', value: '1017' },
{ label: '国际硕士1+1项目玛丽伍德大学', value: '1016' },
{ label: '国际硕士1+1项目纽约州立大学石溪分校', value: '1018' }
]
}
}
},
methods: {
handleSubmit() {
this.$refs.form.validate().then(() => {
postNes(this.form)
.then(res => {
if (res && res.status === 200 && res.error === 0) {
this.$message.success('报名提交成功')
} else {
this.$message.error('报名提交失败')
}
})
.catch(() => {
this.$message.error('报名提交失败')
})
})
}
}
}
</script>
<style lang="scss">
.form-submit {
height: 356px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: url(https://webapp-pub.ezijing.com/www/pc/form/form_bg.png) no-repeat center top;
background-size: cover;
h2 {
font-size: 40px;
font-weight: 400;
line-height: 1;
color: #010101;
}
.desc {
padding: 28px 0 50px;
display: flex;
align-items: center;
font-size: 16px;
line-height: 28px;
color: #010101;
span {
padding: 0 5px;
color: #a81840;
}
p {
padding-left: 50px;
}
}
ul {
display: flex;
li {
padding-left: 20px;
padding-right: 30px;
background: url(https://webapp-pub.ezijing.com/www/pc/form/form_check_bg.png) no-repeat left center;
background-size: 16px;
}
}
.el-input,
.el-button {
width: 280px;
height: 48px;
border-radius: 0;
}
.el-input__inner {
height: 48px;
border-radius: 0;
}
}
</style>
...@@ -4,6 +4,12 @@ ...@@ -4,6 +4,12 @@
<div class="project-list"> <div class="project-list">
<div class="project-item" v-for="(item, index) in list" :key="index"> <div class="project-item" v-for="(item, index) in list" :key="index">
<AppLink :data="item"><img :src="item.imgUrl"/></AppLink> <AppLink :data="item"><img :src="item.imgUrl"/></AppLink>
<div class="tools">
<el-button type="primary" @click="handleSubmit(item)">我要报名</el-button>
<AppLink :data="item" style="margin-left:20px;">
<el-button plain type="primary">了解详情</el-button>
</AppLink>
</div>
</div> </div>
</div> </div>
</AppCard> </AppCard>
...@@ -18,6 +24,20 @@ export default { ...@@ -18,6 +24,20 @@ export default {
components: { AppCard, AppLink }, components: { AppCard, AppLink },
data() { data() {
return {} return {}
},
methods: {
handleSubmit(data) {
if (data.onClick) {
data.onClick()
} else {
const formEl = document.querySelector('#form')
if (!formEl) return
window.scrollTo(0, formEl.offsetTop)
if (this.$parent.$refs.formSubmit) {
this.$parent.$refs.formSubmit.form.project_id = data.project_id
}
}
}
} }
} }
</script> </script>
...@@ -39,4 +59,17 @@ export default { ...@@ -39,4 +59,17 @@ export default {
box-shadow: 0px 1px 24px rgba(0, 0, 0, 0.11); box-shadow: 0px 1px 24px rgba(0, 0, 0, 0.11);
} }
} }
.tools {
position: relative;
margin-top: -20px;
padding: 20px 0;
display: flex;
justify-content: center;
border-top: 1px dashed #dcdcdc;
z-index: 1;
.el-button {
width: 110px;
padding: 10px 0;
}
}
</style> </style>
...@@ -44,7 +44,7 @@ export default { ...@@ -44,7 +44,7 @@ export default {
] ]
}, },
// Global CSS: https://go.nuxtjs.dev/config-css // Global CSS: https://go.nuxtjs.dev/config-css
css: ['element-ui/lib/theme-chalk/index.css', 'assets/css/base.css'], css: ['assets/theme/index.css', 'assets/css/base.css'],
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: [ plugins: [
......
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
<div class="banner"> <div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/internationalDegree/banner.jpg" /> <img src="https://webapp-pub.ezijing.com/www/pc/internationalDegree/banner.jpg" />
</div> </div>
<FormSubmit id="form" ref="formSubmit"></FormSubmit>
<div class="w1200"> <div class="w1200">
<div class="why"> <div class="why">
<h1 class="why-title">为什么选择紫荆的国际免联考在线学位课程?</h1> <h1 class="why-title">为什么选择紫荆的国际免联考在线学位课程?</h1>
...@@ -31,6 +32,7 @@ ...@@ -31,6 +32,7 @@
</div> </div>
</app-card> </app-card>
</div> </div>
<FormSubmit></FormSubmit>
</div> </div>
</template> </template>
...@@ -39,6 +41,7 @@ import AppCard from '@/components/AppCard.vue' ...@@ -39,6 +41,7 @@ import AppCard from '@/components/AppCard.vue'
import ProjectCard from '@/components/ProjectCard.vue' import ProjectCard from '@/components/ProjectCard.vue'
import NewsCard from '@/components/NewsCard.vue' import NewsCard from '@/components/NewsCard.vue'
import TeacherCard from '@/components/TeacherCard.vue' import TeacherCard from '@/components/TeacherCard.vue'
import FormSubmit from '@/components/FormSubmit.vue'
import qaList from '@/assets/internationalDegreeQA.js' import qaList from '@/assets/internationalDegreeQA.js'
export default { export default {
...@@ -59,7 +62,7 @@ export default { ...@@ -59,7 +62,7 @@ export default {
} }
] ]
}, },
components: { AppCard, ProjectCard, NewsCard, TeacherCard }, components: { AppCard, ProjectCard, NewsCard, TeacherCard, FormSubmit },
data() { data() {
return { return {
whyList: [ whyList: [
...@@ -97,26 +100,32 @@ export default { ...@@ -97,26 +100,32 @@ export default {
// 热门专业 // 热门专业
projectList: [ projectList: [
{ {
project_id: '1001',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_kelley.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_kelley.png',
href: 'https://kelley.ezijing.com/' href: 'https://kelley.ezijing.com/'
}, },
{ {
project_id: '1006',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_ciis.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_ciis.png',
href: 'https://ciis.ezijing.com/' href: 'https://ciis.ezijing.com/'
}, },
{ {
project_id: '1005',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_cu.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_cu.png',
href: 'https://cu.ezijing.com/' href: 'https://cu.ezijing.com/'
}, },
{ {
project_id: '1012',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_marywood.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_marywood.png',
href: 'https://marywood.ezijing.com/' href: 'https://marywood.ezijing.com/'
}, },
{ {
project_id: '1008',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_shms.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_shms.png',
href: 'https://shms.ezijing.com/' href: 'https://shms.ezijing.com/'
}, },
{ {
project_id: '1015',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_caas.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/internationalDegree/project_caas.png',
href: 'https://caas.ezijing.com/' href: 'https://caas.ezijing.com/'
} }
......
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
<div class="banner"> <div class="banner">
<img src="https://webapp-pub.ezijing.com/www/pc/studyAbroad/banner.jpg" /> <img src="https://webapp-pub.ezijing.com/www/pc/studyAbroad/banner.jpg" />
</div> </div>
<FormSubmit :type="2" id="form" ref="formSubmit"></FormSubmit>
<div class="w1200"> <div class="w1200">
<div class="why"> <div class="why">
<h1 class="why-title">为什么选择紫荆教育的国际留学课程?</h1> <h1 class="why-title">为什么选择紫荆教育的国际留学课程?</h1>
...@@ -31,6 +32,7 @@ ...@@ -31,6 +32,7 @@
</div> </div>
</app-card> </app-card>
</div> </div>
<FormSubmit :type="2"></FormSubmit>
</div> </div>
</template> </template>
...@@ -39,6 +41,7 @@ import AppCard from '@/components/AppCard.vue' ...@@ -39,6 +41,7 @@ import AppCard from '@/components/AppCard.vue'
import ProjectCard from '@/components/ProjectCard.vue' import ProjectCard from '@/components/ProjectCard.vue'
import NewsCard from '@/components/NewsCard.vue' import NewsCard from '@/components/NewsCard.vue'
import TeacherCard from '@/components/TeacherCard.vue' import TeacherCard from '@/components/TeacherCard.vue'
import FormSubmit from '@/components/FormSubmit.vue'
import qaList from '@/assets/studyAbroadQA.js' import qaList from '@/assets/studyAbroadQA.js'
export default { export default {
...@@ -58,7 +61,7 @@ export default { ...@@ -58,7 +61,7 @@ export default {
} }
] ]
}, },
components: { AppCard, ProjectCard, NewsCard, TeacherCard }, components: { AppCard, ProjectCard, NewsCard, TeacherCard, FormSubmit },
data() { data() {
return { return {
whyList: [ whyList: [
...@@ -96,23 +99,28 @@ export default { ...@@ -96,23 +99,28 @@ export default {
// 热门专业 // 热门专业
projectList: [ projectList: [
{ {
project_id: '1017',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_cbu.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_cbu.png',
href: 'https://cbu-plus.ezijing.com/' href: 'https://cbu-plus.ezijing.com/'
}, },
{ {
project_id: '1016',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_marywood_plus_1.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_marywood_plus_1.png',
href: 'https://marywood-plus.ezijing.com/' href: 'https://marywood-plus.ezijing.com/'
}, },
{ {
project_id: '1018',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_sbu.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_sbu.png',
href: 'https://sbu-plus.ezijing.com/' href: 'https://sbu-plus.ezijing.com/'
}, },
{ {
project_id: '1019',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_ucr.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_ucr.png',
onClick: this.showMessage onClick: this.showMessage
// href: 'https://cbu-plus.ezijing.com/' // href: 'https://cbu-plus.ezijing.com/'
}, },
{ {
project_id: '1016',
imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_marywood_plus_2.png', imgUrl: 'https://webapp-pub.ezijing.com/www/pc/studyAbroad/project_marywood_plus_2.png',
href: 'https://marywood-plus.ezijing.com/' href: 'https://marywood-plus.ezijing.com/'
} }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论