<!--
|
* @Author: 小明丶
|
* @Date: 2019-08-30 14:24:40
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2019-09-05 11:22:31
|
* @Description:
|
-->
|
/*
|
* @Author: c.y
|
* @Date: 2019-1-14 16:02:10
|
* @Last Modified by: CL
|
* @Last Modified time: 2019-01-30 11:53:21
|
* @文件说明: 手机分期创建订单
|
*/
|
<template>
|
<div class="mobile-installment h-100-g">
|
<x-header title="办理分期" :left-options="{backText:''}"></x-header>
|
<group>
|
<x-input title='客户手机号' v-model.trim="mobileInfo.userMblNo"
|
type="tel"
|
:max='11'
|
placeholder="请输入" text-align='right'></x-input>
|
<x-input title='客户姓名' v-model.trim="mobileInfo.userName" placeholder='请输入' :max='6'
|
text-align='right'></x-input>
|
<x-input title='身份证' v-model.trim="mobileInfo.idNo" placeholder='请输入' :max='18'
|
text-align='right'></x-input>
|
<selector title='手机品牌' placeholder='请选择' @on-change='other' v-model="mobileInfo.mblBrand" :options='mobileBrandList'
|
:value-map="['code','name']"
|
direction='rtl'></selector>
|
<x-input v-if="others" title='品牌名称' v-model.trim="mobileInfo.mblBrand1" placeholder='请输入' :max='10' text-align='right'></x-input>
|
|
<selector title='分期期数' placeholder='请选择' v-model="mobileInfo.term" :options='termList'
|
:value-map="['code','name']"
|
direction='rtl'></selector>
|
<x-input title='手机型号' v-model.trim="mobileInfo.mblModel" placeholder='请输入' :max='15'
|
text-align='right'></x-input>
|
<x-input title='IMEI' v-model.trim="mobileInfo.mblImei" placeholder='请输入' :max='20'
|
text-align='right'></x-input>
|
</group>
|
<f-space></f-space>
|
<group>
|
<x-input title='手机价格(元)' @input.native='blurToCalc'
|
v-model.trim.number="mobileInfo.mblAmt"
|
placeholder='最高12000元' :max='5'
|
text-align='right'></x-input>
|
<div class="vux-1px-t" v-if="mobileInfo.mblAmt">
|
<p><span>首付比例：</span>{{ firstRate }}%</p>
|
<p><span>门店收取首付：</span>{{ firstAmt }}元</p>
|
<p><span>客户分期金额：</span>{{insAmt }}元</p>
|
<p><span>每期还款金额：</span>{{ termAmt }}元</p>
|
</div>
|
</group>
|
<f-button fixed @on-click='handleCreateOrder'>提交订单</f-button>
|
</div>
|
</template>
|
|
<script>
|
import { Cell} from 'vux';
|
export default {
|
name: 'mobile-installment',
|
components: {
|
Cell
|
},
|
data() {
|
return {
|
mobileInfo: {
|
mblBrand: '', // 手机牌子
|
mblModel: '', // 型号
|
userMblNo: '', // 客户手机号
|
userName: '', // 客户姓名
|
idNo: '', // 客户身份证号---暂时添加
|
mblImei: '', // imei
|
mblAmt: '', // 手机价格
|
term:'',// 分期期数
|
mblBrand1:''
|
},
|
firstRate: '-', // 首付比例
|
firstAmt: '-', // 首付
|
insAmt: '-', // 分期金额
|
termAmt: '-', // 每期还款金额
|
mobileBrandList: [], // 手机品牌列表
|
termList: [], // 分期期数
|
others:false
|
};
|
},
|
methods: {
|
other(val){
|
if(this.mobileInfo.mblBrand == '其它'){
|
this.others = true
|
}else{
|
this.others = false;
|
}
|
},
|
//失去焦点时计算金额
|
blurToCalc(ele) {
|
let v = this.$tool;
|
if (!/^[1-9]\d{0,4}$/.test(ele.target.value)) {
|
this.firstRate = '';
|
this.firstAmt = '';
|
this.insAmt = '';
|
this.termAmt = '';
|
this.mobileInfo.mblAmt = '';
|
v.toast('请输入正确的手机价格');
|
return false;
|
} else if (Number(ele.target.value) > 12000) {
|
this.firstRate = '';
|
this.firstAmt = '';
|
this.insAmt = '';
|
this.termAmt = '';
|
this.mobileInfo.mblAmt = '';
|
v.toast('请输入12000以下价格');
|
return false;
|
}
|
if(ele.target.value){
|
this.firstRate = '-'; // 首付比例
|
this.firstAmt = '-'; // 首付
|
this.insAmt = '-'; // 分期金额
|
this.termAmt= '-'; // 每期还款金额
|
this.$api.ljOrderTrial({mblAmt: ele.target.value}).then(
|
res=>{
|
this.firstRate = res.body.firstRate;
|
this.firstAmt = this.$tool.formatMoney(res.body.firstAmt);
|
this.insAmt = this.$tool.formatMoney(res.body.insAmt);
|
this.termAmt = this.$tool.formatMoney(res.body.termAmt);
|
}, err => {
|
this.firstRate = '-'; // 首付比例
|
this.firstAmt = '-'; // 首付
|
this.insAmt = '-'; // 分期金额
|
this.termAmt= '-'; // 每期还款金额
|
}
|
)
|
}
|
},
|
// 生成订单
|
handleCreateOrder() {
|
let v = this.$tool;
|
let fieldList = [{
|
field: 'userMblNo',
|
msg: '客户手机号'
|
},
|
{
|
field: 'userName',
|
msg: '客户姓名'
|
},
|
{
|
field: 'idNo',
|
msg: '身份证'
|
},
|
{
|
field: 'mblBrand',
|
msg: '手机品牌'
|
},
|
{
|
field: 'term',
|
msg: '分期期数'
|
},
|
{
|
field: 'mblModel',
|
msg: '手机型号'
|
},
|
{
|
field: 'mblImei',
|
msg: '手机IMEI'
|
},
|
{
|
field: 'mblAmt',
|
msg: '手机价格'
|
}];
|
for (let i of fieldList) {
|
if (v.checkValEmpty(this.mobileInfo[i.field])) {
|
v.toast(`请输入${i.msg}`);
|
return false;
|
}
|
}
|
// 添加身份证号的验证 客户年龄需要20-25岁
|
let reg = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
|
if (!reg.test(this.mobileInfo.idNo)) {
|
v.toast('请输入正确的身份证号');
|
return false;
|
}
|
if(!this.checkAgeRange(this.mobileInfo.idNo)) {
|
v.toast('客户年龄需在20-55周岁之间');
|
return false;
|
}
|
|
if(this.mobileInfo.mblBrand=='其它'){
|
if (v.checkValEmpty(this.mobileInfo.mblBrand1)) {
|
v.toast(`请输入品牌名称`);
|
return false;
|
}
|
}
|
if (!v.checkPhone(this.mobileInfo.userMblNo)) {
|
v.toast('请输入正确的用户手机号');
|
return false;
|
}
|
if (!/^[1-9]\d{0,4}$/.test(this.mobileInfo.mblAmt)) {
|
v.toast('请输入正确的手机价格');
|
return false;
|
}
|
let obj = {...this.mobileInfo};
|
if(obj.mblBrand =='其它'){
|
obj.mblBrand = obj.mblBrand1
|
}
|
this.$api.ljOrderCreate(obj).then(
|
res => {
|
obj.crt = res.body.creTime;
|
obj.firstAmt = res.body.firstAmt;
|
obj.surplusAmt = res.body.surplusAmt;
|
this.$router.push({
|
path: "/mobile-submit-result",
|
query:{...obj}
|
})
|
},
|
err => err
|
);
|
},
|
// 判断客户年龄是否在20-50周岁
|
checkAgeRange (idNumber) {
|
if (idNumber.length !== 18) {
|
this.$tool.toast('请输入正确的身份证号');
|
return false;
|
}
|
// 获取当前系统时间
|
const curDate = new Date();
|
const curYear = curDate.getFullYear();
|
const curMonth = curDate.getMonth() + 1;
|
const curDay = curDate.getDate();
|
// 获取客户出生年月
|
const cusYear = Number(idNumber.substring(6, 10));
|
const cusMonth = Number(idNumber.substring(10, 12));
|
const cusDay = Number(idNumber.substring(12, 14));
|
// 周岁＝今年-出生年（已过生日）（未过生日还要-1），判断当前是否在20-55周岁之间
|
// 判断是否过生日, 先判断月，当前月小于用户生日月，那么就未过生日
|
if (curMonth < cusMonth) {
|
return curYear - cusYear - 1 >= 20 && curYear - cusYear - 1 <= 55;
|
// 如果月份相同，那么需要判断日期
|
} else if (curMonth === cusMonth) {
|
// 当前日期小于客户生日日期，还未过生日
|
if (curDay < cusDay) {
|
return curYear - cusYear - 1 >= 20 && curYear - cusYear - 1 <= 55;
|
} else {
|
// 当前日期大于等于生日日期，以过生日
|
return curYear - cusYear >= 20 && curYear - cusYear <= 55;
|
}
|
// 已过生日
|
} else {
|
return curYear - cusYear >= 20 && curYear - cusYear <= 55;
|
}
|
}
|
},
|
created() {
|
this.$api.ljOrderCreateInit().then(res => {
|
this.mobileBrandList = res.body.mblBrandList;
|
this.termList = res.body.termList;
|
this.mobileInfo.term =res.body.termList[0].code
|
}, err => err);
|
},
|
};
|
</script>
|
<style lang='less'>
|
.mobile-installment {
|
padding-bottom: 46px;
|
padding-top: 54px;
|
background-color: #f1f1f1;
|
.vux-1px-t {
|
padding-left: 15px;
|
padding-bottom: 16px;
|
color: #3a3a3a;
|
span {
|
color: #666666;
|
}
|
font-size: 12px;
|
line-height: 1.2;
|
p {
|
padding-top: 16px;
|
}
|
}
|
}
|
</style>
|
