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

fix:报名申请模块还原

上级 d5bff709
No preview for this file type
...@@ -49,9 +49,9 @@ export default { ...@@ -49,9 +49,9 @@ export default {
material: {}, material: {},
progress: {}, progress: {},
submissionStage: { submissionStage: {
0: ['FILLING'], 0: ['FILLING', 'PREPAYMENT'],
1: ['INTERVIEW_APPLICATION', 'AUDITION', 'PREPAYMENT', 'INTERVIEW'], 1: ['INTERVIEW_APPLICATION', 'AUDITION', 'INTERVIEW', 'PAYMENT'],
2: ['REGISTRATION', 'PAYMENT'], 2: ['REGISTRATION'],
3: ['CLOSED'] 3: ['CLOSED']
}, },
result: {}, result: {},
...@@ -112,7 +112,7 @@ export default { ...@@ -112,7 +112,7 @@ export default {
// 申请面试 // 申请面试
toInterview() { toInterview() {
if (this.activeProgress < 1) { if (this.activeProgress < 1) {
this.$message.warning('请完成报名申请') this.$message.warning('请完成报名申请并缴报名费')
return return
} }
this.$router.push('/my/interview') this.$router.push('/my/interview')
......
...@@ -69,12 +69,6 @@ export default { ...@@ -69,12 +69,6 @@ export default {
console.log('提交失败了', data) console.log('提交失败了', data)
this.$message({ type: 'error', message: data.message }) this.$message({ type: 'error', message: data.message })
} }
},
mounted() {
if (!window.sessionStorage.isRefresh) {
window.sessionStorage.isRefresh = 1
this.$router.go(0)
}
} }
} }
</script> </script>
...@@ -38,10 +38,10 @@ export default function(_this) { ...@@ -38,10 +38,10 @@ export default function(_this) {
data: { file_type: 'ADMISSION_AGREEMENT' } data: { file_type: 'ADMISSION_AGREEMENT' }
}, },
prepend: ` prepend: `
<p><a href="https://zws-imgs-pub.ezijing.com/pc/kelley/%E5%85%A5%E5%AD%A6%E5%8D%8F%E8%AE%AE.pdf" download="入学协议">下载入学协议</a></p> <p>第一步:点击下载按键获取入学协议</p>
<p>申请者可将签字后的入学协议原件扫描或拍照后提交。</p> <p><a href="https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/%E5%85%A5%E5%AD%A6%E5%8D%8F%E8%AE%AE3.docx" target="_blank" download>下载入学协议</a></p>
<p>学员应仔细阅读《入学协议》以及课程介绍,如对入学协议或课程有异议,请第一时间与课程顾问咨询确认。请用A4纸打印后,在入学协议上签上姓名和日期,内容需显示完整、格式整齐、字迹清晰可辨。上传文件仅限“jpg,jpeg,pdf,png”格式,文件小于10Mb。</p> <p>第二步:申请者可将签字后的入学协议原件扫描或拍照后提交。学员应仔细阅读《入学协议》以及课程介绍,如对入学协议或课程有异议,请第一时间与课程顾问咨询确认。请用A4纸打印后,在入学协议上签上姓名和日期,内容需显示完整、格式整齐、字迹清晰可辨。点击下方按钮,上传文件</p>
` `
} }
] ]
} }
......
...@@ -26,8 +26,7 @@ export default function(_this) { ...@@ -26,8 +26,7 @@ export default function(_this) {
callback() { callback() {
_this.getApplication() _this.getApplication()
this.form.options.disabled = true this.form.options.disabled = true
// _this.$router.push({ path: this.$route.path, query: { active: 'application_pay' } }) _this.$router.push({ path: this.$route.path, query: { active: 'application_pay' } })
_this.$router.push({ path: '/my/interview' })
}, },
errorCallback() { errorCallback() {
_this.completeVisible = true _this.completeVisible = true
......
...@@ -11,15 +11,15 @@ export default function(_this) { ...@@ -11,15 +11,15 @@ export default function(_this) {
info(_this), info(_this),
tjx(_this), tjx(_this),
// wfzsm(_this), // wfzsm(_this),
declare(_this) declare(_this),
// { {
// id: 'application_pay', id: 'application_pay',
// title: '缴报名费', title: '缴报名费',
// show: false, show: false,
// visible() { visible() {
// return _this.visible return _this.visible
// } }
// } }
] ]
} }
} }
...@@ -84,7 +84,7 @@ export default function(_this) { ...@@ -84,7 +84,7 @@ export default function(_this) {
data: { file_type: 'ID_CARD_BACK' }, data: { file_type: 'ID_CARD_BACK' },
limit: 1, limit: 1,
accept: 'image/*', accept: 'image/*',
image: 'https://zws-imgs-pub.ezijing.com/pc/cu/id_card_back.png' image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_back.png'
}, },
rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }], rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }],
isShow(data) { isShow(data) {
...@@ -102,7 +102,7 @@ export default function(_this) { ...@@ -102,7 +102,7 @@ export default function(_this) {
data: { file_type: 'ID_CARD_FRONT' }, data: { file_type: 'ID_CARD_FRONT' },
limit: 1, limit: 1,
accept: 'image/*', accept: 'image/*',
image: 'https://zws-imgs-pub.ezijing.com/pc/cu/id_card_front.png' image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_front.png'
}, },
rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }], rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }],
isShow(data) { isShow(data) {
......
...@@ -106,7 +106,7 @@ export default function(_this) { ...@@ -106,7 +106,7 @@ export default function(_this) {
data: { file_type: 'ID_CARD_BACK' }, data: { file_type: 'ID_CARD_BACK' },
limit: 1, limit: 1,
accept: 'image/*', accept: 'image/*',
image: 'https://zws-imgs-pub.ezijing.com/pc/cu/id_card_back.png' image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_back.png'
}, },
rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }], rules: [{ type: 'array', required: true, message: '请上传身份证照片人像面', trigger: 'change' }],
isShow(data) { isShow(data) {
...@@ -124,7 +124,7 @@ export default function(_this) { ...@@ -124,7 +124,7 @@ export default function(_this) {
data: { file_type: 'ID_CARD_FRONT' }, data: { file_type: 'ID_CARD_FRONT' },
limit: 1, limit: 1,
accept: 'image/*', accept: 'image/*',
image: 'https://zws-imgs-pub.ezijing.com/pc/cu/id_card_front.png' image: 'https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/id_card_front.png'
}, },
rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }], rules: [{ type: 'array', required: true, message: '请上传身份证照片国徽面', trigger: 'change' }],
isShow(data) { isShow(data) {
......
...@@ -35,7 +35,7 @@ export default function(_this) { ...@@ -35,7 +35,7 @@ export default function(_this) {
}, },
prepend: ` prepend: `
<p>第一步:点击下载按键获取无犯罪证明模板</p> <p>第一步:点击下载按键获取无犯罪证明模板</p>
<p><a href="https://zws-imgs-pub.ezijing.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" download>下载模板</a></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> <p>第二步:打印文件后填写内容并签字上传至电脑,点击下方按钮上传文件</p>
` `
} }
......
<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">
紫荆-印第安纳大学Kelley商学院金融硕士(MSF)项目申请费<span>700</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>
...@@ -6,6 +6,6 @@ export default function(_this) { ...@@ -6,6 +6,6 @@ export default function(_this) {
return { return {
id: 'interview', id: 'interview',
title: '申请面试', title: '申请面试',
children: [byzs, xwzs, ywjl, zp(_this), { id: 'interview_pay', title: '缴报名费' }] children: [byz, cjd, zp(_this)]
} }
} }
export default {
id: 'interview_ywjl',
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 RESUME_EN = attachments.filter(item => {
return item.file_type_id === 'RESUME_EN'
})
return { RESUME_EN }
}
},
form: {
prev: { to: { query: { active: 'interview_xwzs' } } },
next: { to: { query: { active: 'interview_zp' } } },
hasButton: false,
options: {},
items: [
{
type: 'v-upload',
required: true,
model: 'RESUME_EN',
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: 'RESUME_EN' }
},
append: `
<p>请下载填写英文简历模板后上传 [<a href="https://zws-imgs-pub.ezijing.com/pc/kelley/%E8%8B%B1%E6%96%87%E7%AE%80%E5%8E%86.docx" download="英文简历模板">下载模板</a>]</p>
<p>请将英文简历填写完存为"pdf"格式上传,文件小于10MB。</p>`
}
]
}
}
...@@ -32,7 +32,6 @@ export default function(_this) { ...@@ -32,7 +32,6 @@ export default function(_this) {
this.form.options.disabled = true this.form.options.disabled = true
_this.dialogVisible = true _this.dialogVisible = true
_this.getApplication() _this.getApplication()
_this.$router.push({ path: this.$route.path, query: { active: 'interview_pay' } })
}, },
errorCallback() { errorCallback() {
_this.completeVisible = true _this.completeVisible = true
......
...@@ -13,10 +13,6 @@ ...@@ -13,10 +13,6 @@
<template #aside-append> <template #aside-append>
<div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div> <div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
</template> </template>
<!-- 报名缴费 -->
<template #content v-if="currentActive === 'interview_pay'">
<app-pay />
</template>
</vue-form> </vue-form>
<app-complete :type="1" v-model="completeVisible"></app-complete> <app-complete :type="1" v-model="completeVisible"></app-complete>
<el-dialog <el-dialog
...@@ -40,12 +36,11 @@ ...@@ -40,12 +36,11 @@
<script> <script>
import AppLayout from '../layout.vue' import AppLayout from '../layout.vue'
import getMenu from './form' import getMenu from './form'
import AppPay from './pay.vue'
import AppComplete from '../application/complete.vue' import AppComplete from '../application/complete.vue'
import * as api from '@/api/my' import * as api from '@/api/my'
export default { export default {
components: { AppLayout, AppPay, AppComplete }, components: { AppLayout, AppComplete },
data() { data() {
const menus = getMenu(this) const menus = getMenu(this)
return { return {
......
<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">注释:该申请费提交后不予退还,缴纳申请费后,申请人还需提交以下文件:</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>缴纳报名费成功,请等待审核结果。</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>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论