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.
263 lines
8.2 KiB
263 lines
8.2 KiB
<template>
|
|
<view class="se-p-40 se-bgc-white">
|
|
<uv-form labelPosition="left" :model="form" :rules="rules" ref="form" labelWidth="60" labelStyle="font-size:26rpx;">
|
|
<uv-form-item label="姓名" prop="name" >
|
|
<uv-input v-model="form.name" type="text" placeholder="请输入请输入真实姓名" customStyle="border-radius: 5px;margin-top:5px;background-color: #f5f5f5;padding:5px 10px;"></uv-input>
|
|
</uv-form-item>
|
|
<uv-form-item label="手机号" prop="phone">
|
|
<uv-input v-model="form.phone" type="text" placeholder="请输入手机号码" customStyle="border-radius: 5px;margin-top:5px;background-color: #f5f5f5;padding:5px 10px;"></uv-input>
|
|
</uv-form-item>
|
|
<uv-form-item label="从业年限" prop="seniority">
|
|
<uv-input v-model="form.seniority" type="text" placeholder="请输入从业年限" customStyle="border-radius: 5px;margin-top:5px;background-color: #f5f5f5;padding:5px 10px;"></uv-input>
|
|
</uv-form-item>
|
|
<uv-form-item label="标签" prop="tag">
|
|
<uv-input v-model="form.tag" type="text" placeholder="多个标签用空格隔开" customStyle="border-radius: 5px;margin-top:5px;background-color: #f5f5f5;padding:5px 10px;"></uv-input>
|
|
</uv-form-item>
|
|
<uv-form-item label="主营地区" prop="address" @click="handleAreaChange()">
|
|
<uv-input v-model="form.address" @click="handleAreaChange()" disabled disabledColor="#ffffff" placeholder="请选择所在地区" border="none">
|
|
</uv-input>
|
|
<template v-slot:right>
|
|
<uv-icon name="arrow-right"></uv-icon>
|
|
</template>
|
|
</uv-form-item>
|
|
<uv-form-item label="所属门店" prop="shop" @click="handleshopChange()">
|
|
<uv-input v-model="form.shop" @click="handleshopChange()" disabled disabledColor="#ffffff" placeholder="请选择所属门店" border="none">
|
|
</uv-input>
|
|
<template v-slot:right>
|
|
<uv-icon name="arrow-right"></uv-icon>
|
|
</template>
|
|
</uv-form-item>
|
|
|
|
<uv-form-item label="头像" labelWidth="250" prop="isheadImg" labelPosition="top">
|
|
<uv-upload customStyle="margin-top:20rpx;" :fileList="form.headImgList" @afterRead="afterheadImgRead" @delete="deleteOwnershipPic" name="1"
|
|
multiple :maxCount="10"></uv-upload>
|
|
</uv-form-item>
|
|
<uv-form-item label="身份证,工作证件" labelWidth="250" prop="isPicList" labelPosition="top">
|
|
<uv-upload customStyle="margin-top:20rpx;" :fileList="form.picList" @afterRead="afterRead" @delete="deletePic" name="1"
|
|
multiple :maxCount="10"></uv-upload>
|
|
</uv-form-item>
|
|
<uv-form-item labelPosition="top">
|
|
<uv-checkbox-group @change="checkboxChange" v-model="checked">
|
|
<uv-checkbox name="1" activeColor="#FF9F39" label-size="12" shape="circle" label="我已经阅读并了解"></uv-checkbox>
|
|
<text class="se-c-orange" @click="open()">《经纪人申请协议》</text>
|
|
</uv-checkbox-group>
|
|
</uv-form-item>
|
|
<uv-form-item>
|
|
<uv-button type="primary" text="申请成为经纪人" customStyle="margin-top: 30px;border:1rpx solid #FF9F39;background-color: #FF9F39;border-radius: 30px;" @click="submit"></uv-button>
|
|
</uv-form-item>
|
|
</uv-form>
|
|
<!-- 地址 -->
|
|
<citySelect ref="citySelectRef" :zIndex="0" @city-change="handleCityChange"></citySelect>
|
|
<uv-popup ref="popup" :round="20" mode="center" bg-color="transparent" :close-on-click-overlay="false">
|
|
<view class="se-w-600 se-bgc-white se-br-40 se-p-40">
|
|
<!-- <view class="se-flex se-flex-h-c">
|
|
<image class="se-a-80" src="@/static/image/6588.png" mode=""></image>
|
|
</view> -->
|
|
<view class="se-flex se-flex-h-c se-fs-34 se-fw-6 se-c-black se-mt-40">
|
|
经纪人申请协议
|
|
</view>
|
|
<view class="se-lh-40 se-mt-40 se-fs-24 se-c-99">
|
|
<text>请您务必审慎阅读、充分理解用户协议和隐私政策各条款，包括但不限于用户注意事项、用户行为规范以及为了向你提供服务而收集、使用、存储你个人信息的情况等。你可阅读</text>
|
|
<text class="se-c-black se-fw-6" @click="handleOpenPrivacyContract()">《租房小程序用户服务协议》</text>
|
|
<text>和</text>
|
|
<text class="se-c-black se-fw-6" @click="handleOpenPrivacyContract()">《租房小程序平台隐私权政策》</text>
|
|
<text>了解详细信息。如你同意，请点击下方按钮开始接受我们的服务。</text>
|
|
</view>
|
|
<view class="se-flex se-flex-h-sb se-mt-40">
|
|
<view @click="onCancel" class="se-br-20 se-flex-1 se-flex-h-c se-h-80 se-lh-80 se-ta-c se-fs-32 se-c-66 se-bgc-f5">
|
|
<text>不同意</text>
|
|
</view>
|
|
<view @click="onAgree" class="se-br-20 se-ml-20 se-flex-1 se-flex-h-c se-h-80 se-lh-80 se-ta-c se-fs-32 se-c-white se-bgc-orange">
|
|
<text class="se-ml-10">同意</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uv-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import citySelect from "@/components/cityselect/index.vue"
|
|
export default{
|
|
components:{
|
|
citySelect
|
|
},
|
|
data(){
|
|
return{
|
|
checked:[],
|
|
form:{
|
|
title:"",//姓名
|
|
phone:"",//手机号
|
|
seniority:"",//从业年限
|
|
tag:"",//标签
|
|
address:"",//所属位置
|
|
shop:"",//门店
|
|
isheadImg:"",
|
|
headImgList:[],
|
|
isPicList:"",
|
|
picList:[],
|
|
},
|
|
rules:{
|
|
title:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入姓名',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
phone:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入手机号',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
seniority:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入从业年限',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
tag:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入标签',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
address:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入所在地区',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
shop:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请输入所属门店',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
|
|
isheadImg:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请选择头像',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
isPicList:[
|
|
{
|
|
type: 'string',
|
|
required: true,
|
|
message: '请选择身份证，工作证件',
|
|
trigger: ['blur', 'change']
|
|
}
|
|
],
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
'form.headImgList'(newValue, oldValue) {
|
|
if (newValue.length > 0) {
|
|
this.form.isheadImg = '有'
|
|
} else {
|
|
this.form.isheadImg = ''
|
|
}
|
|
},
|
|
'form.picList'(newValue, oldValue) {
|
|
if (newValue.length > 0) {
|
|
this.form.isPicList = '有'
|
|
} else {
|
|
this.form.isPicList = ''
|
|
}
|
|
}
|
|
},
|
|
onReady() {
|
|
this.$refs.form.setRules(this.rules)
|
|
},
|
|
methods:{
|
|
open(){
|
|
this.$refs.popup.open();
|
|
},
|
|
checkboxChange(n) {
|
|
console.log('change', n);
|
|
},
|
|
onCancel(){
|
|
this.$refs.popup.close();
|
|
this.checked=[];
|
|
},
|
|
onAgree(){
|
|
this.$refs.popup.close();
|
|
this.checked=['1'];
|
|
},
|
|
deletePic(event) {
|
|
this.form.picList.splice(event.index, 1)
|
|
},
|
|
async afterRead(e) {
|
|
let self = this
|
|
e.file.forEach(file => {
|
|
self.$Oss.ossUpload(file.url).then(url => {
|
|
self.form.picList.push({
|
|
url
|
|
})
|
|
})
|
|
})
|
|
},
|
|
deleteOwnershipPic(event) {
|
|
this.form.headImgList.splice(event.index, 1)
|
|
},
|
|
async afterheadImgRead(e) {
|
|
let self = this
|
|
e.file.forEach(file => {
|
|
self.$Oss.ossUpload(file.url).then(url => {
|
|
self.form.headImgList.push({
|
|
url
|
|
})
|
|
})
|
|
})
|
|
},
|
|
handleAreaChange(){
|
|
this.$refs.citySelectRef.open()
|
|
},
|
|
handleCityChange(e) {
|
|
this.form.address = e.province.label + '-' + e.city.label + '-' + e.area.label;
|
|
},
|
|
submit() {
|
|
if(this.checked.length==0){
|
|
return uni.showToast({
|
|
icon: "none",
|
|
title: "请勾选隐私协议"
|
|
})
|
|
}
|
|
this.$refs.form.validate().then(res => {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '校验通过'
|
|
})
|
|
}).catch(errors => {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '校验失败'
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page{
|
|
background-color: #f5f5f5;
|
|
|
|
}
|
|
</style>
|