You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
508 lines
13 KiB
508 lines
13 KiB
<template> |
|
<view class="body-background"></view> |
|
<u-navbar |
|
:title="title" |
|
:auto-back="true" |
|
left-icon-size="40rpx" |
|
:safe-area-inset-top="true" |
|
:placeholder="true" |
|
bgColor="transparent" |
|
></u-navbar> |
|
<view class="fxx-container row"> |
|
<view class="fxx-logo"> |
|
<u-image |
|
mode="widthFix" |
|
width="400" |
|
height="161.37" |
|
:src="staticImage.fxxLogo" |
|
></u-image> |
|
</view> |
|
<view class="fxx-content"> |
|
<u-form |
|
errorType="toast" |
|
labelPosition="left" |
|
:model="model" |
|
:rules="rules" |
|
ref="authForm" |
|
labelWidth="200rpx" |
|
> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="姓名" |
|
prop="userInfo.name" |
|
borderBottom |
|
> |
|
<u-input |
|
fontSize="28" |
|
placeholder="请填写您的真实姓名" |
|
v-model="model.userInfo.name" |
|
border="none" |
|
></u-input> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="姓别" |
|
prop="userInfo.sex" |
|
borderBottom |
|
> |
|
<u-radio-group |
|
v-model="model.userInfo.sex" |
|
placement="row" |
|
@change="sexChange" |
|
> |
|
<u-radio |
|
size="32" |
|
labelSize="32" |
|
activeColor="#FF9545" |
|
:customStyle="{marginRight: '40px'}" |
|
v-for="(item, index) in sexList" |
|
:key="index" |
|
:label="item.name" |
|
:name="item.id" |
|
@change="radioChange" |
|
> |
|
</u-radio> |
|
</u-radio-group> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="政治面貌" |
|
prop="userInfo.political_outlook " |
|
borderBottom |
|
> |
|
<u-text |
|
@click="openPolPicker" |
|
:text="political_outlook_name||'请选择'" |
|
size="28" |
|
:color="political_outlook_name?'#020B18':'#AFB5BE'" |
|
suffixIcon="arrow-right" |
|
:icon-style="{color:(political_outlook_name?'#020B18':'#AFB5BE')}" |
|
></u-text> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="手机号码" |
|
prop="userInfo.phone" |
|
borderBottom |
|
> |
|
<u-input |
|
fontSize="28" |
|
placeholder="请输入" |
|
v-model="model.userInfo.phone" |
|
border="none" |
|
></u-input> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="所属街道" |
|
prop="userInfo.street" |
|
borderBottom |
|
> |
|
<u-text |
|
@click="openStreetPicker" |
|
:text="model.userInfo.street||'请选择'" |
|
size="28" |
|
:color="model.userInfo.street?'#020B18':'#AFB5BE'" |
|
suffixIcon="arrow-right" |
|
:icon-style="{color:(model.userInfo.street?'#020B18':'#AFB5BE')}" |
|
></u-text> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="所属社区" |
|
prop="userInfo.community" |
|
borderBottom |
|
> |
|
<u-text |
|
@click="openCommunityPicker" |
|
:text="model.userInfo.community||'请选择'" |
|
size="28" |
|
:color="model.userInfo.community?'#020B18':'#AFB5BE'" |
|
suffixIcon="arrow-right" |
|
:icon-style="{color:(model.userInfo.community?'#020B18':'#AFB5BE')}" |
|
></u-text> |
|
</u-form-item> |
|
|
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="公司全称" |
|
prop="userInfo.company" |
|
borderBottom |
|
> |
|
<u-input |
|
fontSize="28" |
|
placeholder="请输入" |
|
v-model="model.userInfo.company" |
|
border="none" |
|
></u-input> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="职业分类" |
|
prop="userInfo.position_type" |
|
borderBottom |
|
> |
|
<u-text |
|
@click="openPositionPicker" |
|
:text="model.userInfo.position_type||'请选择'" |
|
size="28" |
|
:color="model.userInfo.position_type?'#020B18':'#AFB5BE'" |
|
suffixIcon="arrow-right" |
|
:icon-style="{color:(model.userInfo.position_type?'#020B18':'#AFB5BE')}" |
|
></u-text> |
|
</u-form-item> |
|
<u-form-item |
|
:custom-style="{ |
|
padding:'36rpx 0' |
|
}" |
|
label="身份证号码" |
|
prop="userInfo.id_card" |
|
borderBottom |
|
> |
|
<u-input |
|
fontSize="28" |
|
placeholder="请输入" |
|
v-model="model.userInfo.id_card" |
|
border="none" |
|
></u-input> |
|
</u-form-item> |
|
</u-form> |
|
<u-button |
|
type="primary" |
|
text="立即认证" |
|
shape="circle" |
|
:custom-style="{ |
|
color:'#020B18', |
|
backgroundColor:'#FF9545', |
|
border:'none', |
|
fontSize:'36', |
|
fontWeight:'400', |
|
marginTop:'48rpx' |
|
}" |
|
@click="submit" |
|
></u-button> |
|
</view> |
|
</view> |
|
|
|
<uv-picker |
|
ref="pol" |
|
:columns="[polList]" |
|
keyName="name" |
|
@confirm="selectPol"></uv-picker> |
|
<uv-picker |
|
ref="street" |
|
:columns="[streetList]" |
|
keyName="name" |
|
@confirm="selectStreet"></uv-picker> |
|
<uv-picker |
|
ref="community" |
|
:columns="[communityList]" |
|
keyName="name" |
|
@confirm="selectCommunity"></uv-picker> |
|
<uv-picker |
|
ref="position" |
|
:columns="[positionList]" |
|
keyName="name" |
|
@confirm="selectPosition"></uv-picker> |
|
</template> |
|
|
|
<script> |
|
import { |
|
imghost |
|
} from '@/config/host.js' |
|
import MzSubsection from '@/components/MzSubsection/Index.vue'; |
|
import api from '@/utils/functions.js'; |
|
import {getCommonStreet, systemConfig, webConfig} from "@/api/other"; |
|
import {fxxApply} from "@/api/user"; |
|
|
|
export default { |
|
components: { |
|
MzSubsection |
|
}, |
|
data() { |
|
return { |
|
polShow:false, |
|
model: { |
|
userInfo: { |
|
name: '', |
|
sex: 1, |
|
phone: '', |
|
company: '', |
|
political_outlook: '', |
|
street: '', |
|
community: '', |
|
id_card: '', |
|
position_type: '', |
|
}, |
|
}, |
|
rules: { |
|
'userInfo.name': { |
|
type: 'string', |
|
required: true, |
|
message: '请填写姓名', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.sex': { |
|
type: 'string', |
|
max: 1, |
|
required: true, |
|
message: '请选择男或女', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.political_outlook ': { |
|
type: 'string', |
|
required: true, |
|
message: '请选择政治面貌', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.phone': { |
|
type: 'string', |
|
required: true, |
|
message: '请输入手机号码', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.street': { |
|
type: 'string', |
|
required: true, |
|
message: '请选择街道', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.community': { |
|
type: 'string', |
|
required: true, |
|
message: '请选择社区', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.id_card': { |
|
type: 'string', |
|
required: true, |
|
message: '请输入身份证号', |
|
trigger: ['blur', 'change'] |
|
}, |
|
'userInfo.position_type ': { |
|
type: 'string', |
|
required: true, |
|
message: '请选择职业分类', |
|
trigger: ['blur', 'change'] |
|
}, |
|
}, |
|
sexList:[ |
|
{ |
|
id:1, |
|
name: '男', |
|
disabled: false, |
|
}, |
|
{ |
|
id:2, |
|
name: '女', |
|
disabled: false, |
|
}, |
|
], |
|
political_outlook_name:'', |
|
polList:[ |
|
{ |
|
id:0, |
|
name: '群众', |
|
}, |
|
{ |
|
id:1, |
|
name: '共青团员', |
|
}, |
|
{ |
|
id:2, |
|
name: '预备党员', |
|
}, |
|
{ |
|
id:3, |
|
name: '党员', |
|
}, |
|
], |
|
list: [{ |
|
name: '最新资讯' |
|
}, { |
|
name: '表彰评优' |
|
}, { |
|
name: '活动回顾' |
|
}], |
|
// 或者如下，也可以配置keyName参数修改对象键名 |
|
// list: [{name: '未付款'}, {name: '待评价'}, {name: '已付款'}], |
|
current: 1, |
|
title: '丰行侠认证', |
|
loading: true, |
|
staticImage: { |
|
bg: imghost + '/BG.png', |
|
newIcon: imghost + '/new-icon.png', |
|
fxxLogo: imghost + '/fxx-logo.png', |
|
fxx1: imghost + '/fxx-1.png', |
|
}, |
|
user: { |
|
avatar: imghost + '/banner.png', |
|
nickname: '清晨的风', |
|
coupons: 221, |
|
id: 88685, |
|
}, |
|
isTop: false, |
|
lists: [ |
|
{ |
|
id: 1, |
|
thumb: imghost + '/new-1.png', |
|
title: '全市公安机关夏季治安打击整治“彭安行动”新闻发布会召开', |
|
desc: '需要您带一点猫砂上门，谢谢', |
|
time: '2023/06/16', |
|
is_new: true |
|
}, { |
|
id: 2, |
|
thumb: imghost + '/new-2.png', |
|
title: '全市公安机关夏季治安打击整治“彭安行动”新闻发布会召开', |
|
desc: '需要您带一点猫砂上门，谢谢', |
|
time: '2023/06/16', |
|
is_new: true |
|
}, { |
|
id: 3, |
|
thumb: imghost + '/new-3.png', |
|
title: '全市公安机关夏季治安打击整治“彭安行动”111开', |
|
desc: '需要您带一点猫砂上门，谢谢', |
|
time: '2023/06/16', |
|
is_new: false |
|
}, |
|
], |
|
size: { |
|
height: 500, |
|
}, |
|
streetList:[], |
|
communityList:[], |
|
positionList:[], |
|
} |
|
}, |
|
onLoad() { |
|
|
|
}, |
|
computed: { |
|
api() { |
|
return api |
|
}, |
|
sectionStyle() { |
|
const style = {}; |
|
style.padding = '0 26rpx'; |
|
style.position = 'sticky'; |
|
style.zIndex = '9999'; |
|
style.top = api.navHeight().systemBarHeight + 'px' |
|
return style; |
|
}, |
|
listHeight() { |
|
let that = this; |
|
let height; |
|
let info = uni.createSelectorQuery().in(this).select('.subsection'); |
|
info.boundingClientRect(function (data) { |
|
that.size.height = data.height; |
|
}).exec(function (res) { |
|
|
|
}); |
|
// that.size.height = (api.navHeight().windowHeight - height); |
|
} |
|
}, |
|
methods: { |
|
openPolPicker(){ |
|
this.$refs.pol.open(); |
|
}, |
|
openStreetPicker(){ |
|
this.$refs.street.open(); |
|
}, |
|
openCommunityPicker(){ |
|
this.$refs.community.open(); |
|
}, |
|
openPositionPicker(){ |
|
this.$refs.position.open(); |
|
}, |
|
chatDetail(item) { |
|
wx.navigateTo({ |
|
url: '/pages/ChatDetail/index?id=' + item.id |
|
}); |
|
}, |
|
checkSection(index) { |
|
this.current = index; |
|
}, |
|
scrollToLower() { |
|
|
|
}, |
|
sexChange(e){ |
|
console.log(e) |
|
this.model.userInfo.sex = e; |
|
}, |
|
navTo(url) { |
|
wx.navigateTo({ |
|
url: url |
|
}) |
|
}, |
|
getPickerData(){ |
|
systemConfig({ |
|
type:'job_type' |
|
}).then(res => { |
|
this.positionList = res.data; |
|
console.log(this.positionList) |
|
}) |
|
getCommonStreet({}).then(res => { |
|
this.streetList = res.data |
|
}); |
|
}, |
|
selectPol(e){ |
|
this.political_outlook_name = e.value[0].name; |
|
this.model.userInfo.political_outlook = e.value[0].id; |
|
this.polShow = false; |
|
}, |
|
selectStreet(e){ |
|
this.model.userInfo.street = e.value[0].name; |
|
this.communityList = e.value[0].children; |
|
}, |
|
selectCommunity(e){ |
|
this.model.userInfo.community = e.value[0].name; |
|
}, |
|
selectPosition(e){ |
|
this.model.userInfo.position_type = e.value[0].name; |
|
}, |
|
submit(){ |
|
fxxApply(this.model.userInfo).then(res => { |
|
if(res.code === 200){ |
|
this.navTo('/pages/Authentication/done?id='+res.data.fxx_id+'&name='+this.model.userInfo.name) |
|
}else{ |
|
uni.$u.toast(res.msg); |
|
} |
|
}) |
|
|
|
} |
|
}, |
|
onPageScroll(res) { |
|
if (res.scrollTop <= 20) { |
|
uni.$emit('isTop', true); |
|
} else { |
|
uni.$emit('isTop', false); |
|
} |
|
}, |
|
created() { |
|
// this.listHeight(); |
|
this.getPickerData() |
|
// this.pagePadding = (api.navHeight().navPaddingTop + |
|
// api.navHeight().navHeight + (api.navHeight().headerPadding * 2)) |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
@import './components/form.scss'; |
|
</style> |