<template>
|
<view style="background: #F7F7F7;">
|
<view class="content" v-if="!show">
|
<steps style="margin-bottom: 10rpx;" :active="2"></steps>
|
<view class="info">
|
<view class="title">单位信息</view>
|
<uv-form :labelStyle='lstyle' :model="userInfo" ref="form" labelWidth="100" style="padding:0 30rpx;">
|
|
|
<uv-form-item label="职业" prop="professionInfoStr" borderBottom @click="openPicker('professionInfo')">
|
<uv-input v-model="userInfo.professionInfoStr" disabled border="none" disabledColor="none" placeholder="请选择"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="单位名称" prop="companyName" borderBottom>
|
<uv-input v-model="userInfo.companyName" border="none" placeholder="请输入单位名称"></uv-input>
|
</uv-form-item>
|
<uv-form-item label="公司所属行业" prop="companyTradeStr" borderBottom @click="openPicker('companyTrade')">
|
<uv-input v-model="userInfo.companyTradeStr" disabled border="none" disabledColor="none" placeholder="请选择"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="公司性质" prop="companyNatureStr" borderBottom @click="openPicker('companyNature')">
|
<uv-input v-model="userInfo.companyNatureStr" disabled border="none" disabledColor="none" placeholder="请选择"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
|
<uv-form-item label="单位省市" prop="liveCityStr" borderBottom @click="openPicker('pickerCity')">
|
<uv-input v-model="userInfo.liveCityStr" disabled border="none" disabledColor="none" placeholder="请先选择"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="单位区县" prop="areasStr" borderBottom @click="openAreas">
|
<uv-input maxlength="20" v-model="userInfo.areasStr" disabled border="none" disabledColor="none" placeholder="请先选择省市"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="单位详细地址 " prop="=companyAddress" borderBottom>
|
<uv-input v-model="userInfo.companyAddress" border="none" placeholder="请输入单位详细地址"></uv-input>
|
<!-- <InputAutocomplete style="width: 100%;"></InputAutocomplete>-->
|
</uv-form-item>
|
<uv-form-item label="单位工作" prop="workStartTime" borderBottom >
|
|
<view style="display: flex;flex-direction: row;width: 100%;justify-content: space-between">
|
<view :class="userInfo.workStartTime?'':'inp'" style=" text-align: center;font-size: 28rpx" @click="openPicker('workStartTime')">
|
{{ userInfo.workStartTime? userInfo.workStartTime.replace(/-/g, '.') : '开始时间' }}
|
</view>
|
<view style="display: flex;justify-content: center">
|
<text class="splitter"></text>
|
</view>
|
<view :class="userInfo.workEndTime?'':'inp'" style="text-align: center;font-size: 28rpx" @click="openPicker('workEndTime')">
|
{{ userInfo.workEndTime? userInfo.workEndTime.replace(/-/g, '.') : '结束时间' }}
|
</view>
|
</view>
|
|
</uv-form-item>
|
|
|
<uv-form-item label="公司电话" prop="companyPhone" borderBottom>
|
<uv-input v-model="userInfo.companyPhone" border="none" placeholder="请填写公司电话"></uv-input>
|
</uv-form-item>
|
|
|
|
|
</uv-form>
|
|
|
</view>
|
|
<view style="display: flex;flex-direction: row;margin-top: 20rpx;">
|
<uv-checkbox-group
|
v-model="protocolChecked">
|
<uv-checkbox size="14" :name="1">
|
<view style="display: flex;flex-direction: row;font-size: 24rpx">
|
我已阅读并同意<text class="protocol" @click="openAgreement">《用户隐私协议》</text>
|
</view>
|
</uv-checkbox>
|
</uv-checkbox-group>
|
|
</view>
|
<uv-button
|
:disabled="loading"
|
|
:loading="loading"
|
color="linear-gradient(104deg, #6d89ff 0%, #2865f2 100%), linear-gradient(270deg, #4766fe 0%, #7d9fff 100%)"
|
shape="circle" type="primary" text="下一步" customStyle="margin-top: 54rpx;height:100rpx" @click="submit"></uv-button>
|
</view>
|
|
|
|
<pickerCity ref="pickerCity" @confirm="getValueCity"></pickerCity>
|
<areas :cityCode="cityCode" ref="areas" @confirm="getValueAreas"></areas>
|
|
<professionInfo ref="professionInfo" @confirm="getValueProfessionInfo"></professionInfo>
|
<companyTrade ref="companyTrade" @confirm="getValueCompanyTrade"></companyTrade>
|
<companyNature ref="companyNature" @confirm="getValueCompanyNature"></companyNature>
|
|
<uv-datetime-picker ref="workStartTime" mode="date" :formatter="formatter" @confirm="getValueWorkStartTime"/>
|
|
<uv-datetime-picker ref="workEndTime" mode="date" :formatter="formatter" @confirm="getValueWorkEndTime"/>
|
|
<agreement ref="agreement"></agreement>
|
<sfkef></sfkef> <view v-if="show" class="step-d">
|
<view class="text-container"><rich-text :nodes="text"></rich-text></view>
|
<view class="but">
|
<uv-button
|
:disabled="true"
|
customStyle="height:100rpx"
|
v-if="readTime!=0" color="#EEEEEE" type="primary" shape="circle">
|
<text style="font-size: 34rpx;color: #666666">请仔细阅读该协议({{readTime}}s)</text>
|
</uv-button>
|
<uv-button @click="sub" customStyle="height:100rpx" v-else type="primary" shape="circle">
|
<text style="font-size: 34rpx" >确认提交</text>
|
</uv-button>
|
</view>
|
</view>
|
</view>
|
</template>
|
<script>
|
import { timeFormat } from '@/uni_modules/uv-ui-tools/libs/function/index.js';
|
import pickerCity from "@/components/picker/index.vue";
|
import areas from "@/components/picker/areas.vue";
|
import professionInfo from "@/components/picker/professionInfo.vue";
|
import companyTrade from "@/components/picker/companyTrade.vue";
|
import companyNature from "@/components/picker/companyNature.vue";
|
import steps from "@/components/steps/index.vue";
|
import agreement from "@/components/agreement/index.vue";
|
import stepsD from "@/pages/apply/steps-d.vue";
|
import sfkef from "@/components/sfkef/index.vue";
|
import InputAutocomplete from "@/components/input-autocomplete/input-autocomplete.vue";
|
|
import {appFourAddCompanyInfo, getPlatformProtocolNew, checkUserStatus} from "@/api/modules/user";
|
|
export default {
|
components: {
|
steps,
|
pickerCity,areas,
|
agreement,professionInfo,companyTrade,companyNature,stepsD,InputAutocomplete,sfkef
|
},
|
|
|
data() {
|
return {
|
agree:false,
|
show:false,
|
readTime:7,
|
text:null,
|
|
|
cityCode:'',
|
list: [],
|
loading:false,
|
protocolChecked:[1],
|
showAreas:false,
|
lstyle:{
|
color:'#252938',
|
fontSize:'28rpx',
|
fontWeight:'800'
|
},
|
userInfo: {
|
professionInfoStr:'',
|
professionInfo:'',
|
companyName:'',
|
companyTradeStr:'',
|
companyNatureStr:'',
|
companyNature:'',
|
|
companyPhone:'',
|
liveCityStr:'',
|
companyAddress:'',
|
workStartTime:'',
|
workEndTime:''
|
|
|
|
},
|
|
|
}
|
},
|
onShow() {
|
this.loading = false;
|
},
|
created() {
|
|
uni.getLocation({
|
type: 'wgs84',
|
success: function (res) {
|
uni.setStorageSync('lng', res.longitude)
|
uni.setStorageSync('lat', res.latitude)
|
}
|
});
|
checkUserStatus().then(res=>{
|
uni.setStorageSync('customerId', res.customerId);
|
});
|
getPlatformProtocolNew().then(res=>{
|
this.list = res;
|
});
|
|
},
|
methods: {
|
sub(){
|
this.show = false;
|
|
},
|
formatter(type, value) {
|
if (type === 'year') {
|
return `${value}年`
|
}
|
if (type === 'month') {
|
return `${value}月`
|
}
|
if (type === 'day') {
|
return `${value}日`
|
}
|
return value
|
},
|
openAgreement() {
|
this.$refs.agreement.open();
|
},
|
|
submitFinal(){
|
this.loading = true;
|
uni.showToast({
|
title:'授权成功',
|
duration:2000,
|
icon:'none'
|
});
|
|
|
|
let pro = {
|
id: uni.getStorageSync('customerId'),
|
phone: uni.getStorageSync('phone'),
|
|
|
companyTrade:this.companyTradeBox['value'][0].value,
|
companyNature:this.companyNatureBox['value'][0].code,
|
companyName: this.userInfo.companyName,
|
|
companyProvince:this.cityBox['value'][0]['title'],
|
companyCity:this.cityBox['value'][1]['title'],
|
companyArea:this.userInfo.areasStr,
|
companyAddress:this.userInfo.companyAddress,
|
|
|
companyPhone:this.userInfo.companyPhone,
|
professionInfo:this.userInfo.professionInfo,
|
|
|
loanAmount: 110000,
|
loanTerm: 24,
|
companyAreaCode: this.areasBox['value'][0].areaId,
|
workStartTime:this.userInfo.workStartTime,
|
workEndTime:this.userInfo.workEndTime,
|
|
lng:uni.getStorageSync('lng'),
|
lat:uni.getStorageSync('lat'),
|
|
|
gpsProvince:'',
|
gpsCity:'',
|
gpsArea:'',
|
|
}
|
appFourAddCompanyInfo(pro).then(res=>{
|
uni.reLaunch({
|
url:'/pages/approve/index'
|
})
|
|
})
|
|
},
|
|
|
|
|
// 获取Picker的值
|
|
getValueCity(e){
|
console.log(e);
|
this.cityBox = e;
|
this.userInfo.liveCityStr = `${e['value'][0]['title']} ${e['value'][1]['title']}`;
|
this.cityCode = `${e['value'][1]['code']}`;
|
this.userInfo.areas = '';
|
this.userInfo.areasStr = '';
|
|
},
|
getValueAreas(e){
|
this.userInfo.areasStr = e['value'][0].name
|
this.areasBox = e
|
},
|
getValueProfessionInfo(e){
|
this.userInfo.professionInfoStr = e['value'][0].text
|
this.userInfo.professionInfo = e['value'][0].value
|
this.professionInfoBox = e
|
},
|
getValueCompanyTrade(e){
|
console.log(e,'----------');
|
this.userInfo.companyTradeStr = e['value'][0].text
|
this.companyTradeBox = e
|
},
|
getValueCompanyNature(e){
|
this.userInfo.companyNatureStr = e['value'][0].text
|
this.companyNatureBox = e
|
},
|
getValueWorkStartTime(e){
|
console.log(e.value/1000);
|
|
this.userInfo.workStartTime =timeFormat(e.value/1000, 'yyyy-mm-dd');
|
},
|
getValueWorkEndTime(e){
|
this.userInfo.workEndTime =timeFormat(e.value, 'yyyy-mm-dd');
|
},
|
|
|
|
|
|
|
|
|
// 提交
|
submit() {
|
|
|
if(!this.protocolChecked[0]){
|
uni.showToast({
|
icon: 'none',
|
title: '请先阅读并同意《用户隐私协议》'
|
})
|
return
|
}
|
if(!this.userInfo.professionInfoStr){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择职业'
|
})
|
return;
|
}
|
if(!this.userInfo.companyName){
|
uni.showToast({
|
icon: 'none',
|
title: '请输入单位名称'
|
})
|
return;
|
}
|
if(!this.userInfo.companyTradeStr){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择公司所属行业'
|
})
|
return;
|
}
|
if(!this.userInfo.companyNatureStr){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择公司性质'
|
})
|
return;
|
}
|
if(!this.userInfo.liveCityStr){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择单位省市'
|
})
|
return;
|
}
|
if(!this.userInfo.areasStr){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择单位区县'
|
})
|
return;
|
}
|
if(!this.userInfo.companyAddress){
|
uni.showToast({
|
icon: 'none',
|
title: '请输入单位详细地址 '
|
})
|
return;
|
}
|
if(!this.userInfo.workStartTime){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择入职时间'
|
})
|
return;
|
}
|
if(!this.userInfo.workEndTime){
|
uni.showToast({
|
icon: 'none',
|
title: '请选择离职时间'
|
})
|
return;
|
}
|
if(!this.userInfo.companyPhone){
|
uni.showToast({
|
icon: 'none',
|
title: '请输入公司电话'
|
})
|
return;
|
}
|
this.loading = true;
|
uni.navigateTo({
|
url: '/pages/apply/steps-d'
|
});
|
|
|
|
},
|
|
|
// 打开Picker
|
openPicker(dom){
|
this.$refs[dom].open()
|
},
|
|
|
openAreas() {
|
console.log(this.$refs.areasLi);
|
if(!this.cityBox){
|
uni.showToast({
|
icon: 'none',
|
title: '请先选择居住省市'
|
})
|
return
|
}
|
this.showAreas = true;
|
this.$nextTick(() => {
|
if (this.$refs.areas) {
|
this.$refs.areas.open();
|
if (this.cityCode !== null && this.cityCode !== undefined) {
|
this.$refs.areas.setCityCode(this.cityCode);
|
}
|
} else {
|
|
}
|
})
|
|
},
|
|
|
},
|
watch:{
|
|
'areasBox':{
|
handler(newVal,oldVal){
|
console.log(newVal);
|
this.userInfo.areas = newVal['value'][0].areaId
|
}
|
},
|
'cityBox':{
|
handler(newVal,oldVal){
|
this.userInfo.liveCity = newVal['value'][1]['code']
|
}
|
}
|
},
|
}
|
</script>
|
<style scoped lang="scss">
|
.inp{
|
color: rgb(192, 196, 204);
|
}
|
.content{
|
margin: 30rpx;
|
.info{
|
background: #fff;
|
border-radius: 16rpx;
|
padding-top: 40rpx;
|
.title{
|
font-size: 34rpx;
|
color: #252938;
|
font-weight: bold;
|
position: relative;
|
padding-left: 36rpx;
|
&:after{
|
content: '';
|
position: absolute;
|
bottom: -10rpx;
|
left: 0;
|
width: 6rpx;
|
height: 100%;
|
background: #2865F2;
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
}
|
}
|
}
|
}
|
|
.scroll-view_H {
|
}
|
|
.scroll-view-item_H {
|
display: inline-block;
|
text-align: center;
|
// width: 136rpx;
|
padding: 0 28rpx;
|
margin-bottom: 20rpx;
|
margin-right: 20rpx;
|
height: 70rpx;
|
line-height: 70rpx;
|
width: auto;
|
background: #edf0f7;
|
border-radius: 8px;
|
font-size: 24rpx;
|
color: #8b8d96;
|
|
&.active {
|
// background: #fe4a49;
|
background: #2865F2;
|
color: #fff;
|
}
|
}
|
.protocol{
|
|
font-size: 24rpx;color: #207ef5;
|
}
|
.splitter {
|
display: flex;
|
justify-content: center;
|
width: 10rpx;
|
height: 2rpx;
|
background: #252938;
|
margin-left: 24rpx;
|
margin-right: 24rpx;
|
}
|
|
|
.step-d{
|
.text-container{
|
padding: 40rpx 20rpx;
|
margin-bottom: 160rpx;
|
}
|
.but{
|
background: white;
|
width: 100%;
|
padding: 30rpx;
|
position: fixed;
|
bottom: 0;
|
}
|
}
|
|
</style>
|