|
|
|
@ -2,7 +2,7 @@ |
|
|
|
<v-page style="height:auto!important;min-height: 100%!important;"> |
|
|
|
<v-header :title="$t('auth.a1')"></v-header> |
|
|
|
<main class=" m-lg bg-panel-3 rounded-md p-x-md box-shadow"> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="form-item border-b p-md m-b-md" v-if="1==='国籍'"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.a7')}}</view> |
|
|
|
<view class="input color-light" > |
|
|
|
<v-picker :value="form.country_id" @change="selectCountry" :list="countryList" range-value="id" range-label="name"> |
|
|
|
@ -20,43 +20,73 @@ |
|
|
|
<v-input v-model="form.realname" :placeholder="$t('auth.b0')"></v-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="form-item border-b p-md m-b-md" v-if="1==='出生日期'"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.c5')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<uni-datetime-picker type="date" :placeholder="$t('auth.d4')" :clear-icon="false" v-model="form.birthday" @maskClick="maskClick" /> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.c6')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<uni-data-select |
|
|
|
:placeholder="$t('auth.d5')" |
|
|
|
v-model="form.identification_type" |
|
|
|
:localdata="id_range" |
|
|
|
@change="changeID" |
|
|
|
></uni-data-select> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.c6')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<uni-data-select |
|
|
|
:placeholder="$t('auth.d5')" |
|
|
|
v-model="form.identification_type" |
|
|
|
:localdata="id_range" |
|
|
|
@change="changeID" |
|
|
|
></uni-data-select> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.b1')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<v-input v-model="form.id_card" :placeholder="$t('auth.b2')"></v-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="form-item border-b p-md m-b-md" v-if="1==='地址'"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.c7')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<v-input v-model="form.address" :placeholder="$t('auth.c8')"></v-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="form-item border-b p-md m-b-md"> |
|
|
|
<view class="form-item border-b p-md m-b-md" v-if="1==='电话'"> |
|
|
|
<view class="label m-b-xs">{{$t('auth.c9')}}</view> |
|
|
|
<view class="input color-light"> |
|
|
|
<v-input v-model="form.phone" :placeholder="$t('auth.d0')"></v-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="p-md "> |
|
|
|
<v-button block type="blue" class="w-max rounded-md" ref="btn" @click="primaryAuth">{{$t('auth.b3')}}</v-button> |
|
|
|
<div class="form-item border-b p-md m-b-md"> |
|
|
|
<div class="color-light p-b-xs">{{$t('auth.b5')}}</div> |
|
|
|
<div class="d-flex justify-between m-t-md "> |
|
|
|
<div class="examples m-r-xs bg-panel-3 p-md rounded-sm box-shadow"> |
|
|
|
<img src="static/img/fill6.png" /> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
@click="getFile('front_img')" |
|
|
|
class="upload-box d-flex justify-center align-center rounded-sm bg-panel-3 box-shadow" |
|
|
|
> |
|
|
|
<van-icon v-if="!form.front_img" class="color-light fn-30" name="photograph" /> |
|
|
|
<img v-else :src="form.front_img" alt /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="form-item p-md m-b-md"> |
|
|
|
<div class="color-light p-b-xs">{{$t('auth.b6')}}</div> |
|
|
|
<div class="d-flex justify-between m-t-md"> |
|
|
|
<div class="examples m-r-xs bg-panel-3 p-md rounded-sm box-shadow"> |
|
|
|
<img src="static/img/fill7.png" /> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
@click="getFile('back_img')" |
|
|
|
class="upload-box d-flex justify-center align-center rounded-sm bg-panel-3 box-shadow" |
|
|
|
> |
|
|
|
<van-icon v-if="!form.back_img" class="color-light fn-30" name="photograph" /> |
|
|
|
<img v-else :src="form.back_img" alt /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<view class="p-md "> |
|
|
|
<v-button block type="yellow2" class="w-max rounded-md" ref="btn" @click="primaryAuth">{{$t('auth.b3')}}</v-button> |
|
|
|
</view> |
|
|
|
</main> |
|
|
|
|
|
|
|
@ -76,16 +106,18 @@ export default { |
|
|
|
form: { |
|
|
|
id_card: "", |
|
|
|
realname: "", |
|
|
|
birthday: "", |
|
|
|
identification_type: "", |
|
|
|
birthday: "", |
|
|
|
identification_type: "", |
|
|
|
country_id: "", |
|
|
|
country_code: "", |
|
|
|
area_code: "", |
|
|
|
address: "", |
|
|
|
phone: "" |
|
|
|
area_code: "", |
|
|
|
address: "", |
|
|
|
phone: "", |
|
|
|
front_img: "", |
|
|
|
back_img: "" |
|
|
|
}, |
|
|
|
id_range: [{ value: 0, text: this.$t('auth.d1') },{ value: 1, text: this.$t('auth.d2') },{ value: 2, text: this.$t('auth.d3') }], |
|
|
|
}; |
|
|
|
id_range: [{ value: 0, text: this.$t('auth.d1') },{ value: 1, text: this.$t('auth.d2') },{ value: 2, text: this.$t('auth.d3') }], |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
activeCountry() { |
|
|
|
@ -116,6 +148,19 @@ export default { |
|
|
|
selectCountry(value) { |
|
|
|
this.form.country_id = value |
|
|
|
}, |
|
|
|
getFile(name) { |
|
|
|
console.log(name) |
|
|
|
this.$getFile({count:9}).then((res) => { |
|
|
|
this.upLoadImg(res, name); |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 上传图片 |
|
|
|
upLoadImg(chooseImageRes, name) { |
|
|
|
Member.uploadImage(chooseImageRes).then((res) => { |
|
|
|
this.form[name] = res.data.url; |
|
|
|
this.$toast.success(this.$t('auth.c1')); |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 认证 |
|
|
|
primaryAuth() { |
|
|
|
let data = this.form; |
|
|
|
@ -123,8 +168,8 @@ export default { |
|
|
|
Profile.primaryAuth(data,{btn:this.$refs.btn}).then(() => { |
|
|
|
this.$toast.success(this.$t('auth.b4')); |
|
|
|
setTimeout(()=>{ |
|
|
|
this.$back(); |
|
|
|
}, 1500) |
|
|
|
this.$back(); |
|
|
|
}, 1500) |
|
|
|
}).catch(()=>{}); |
|
|
|
}, |
|
|
|
changeID(e){ |
|
|
|
@ -153,7 +198,8 @@ export default { |
|
|
|
// color: grey; |
|
|
|
} |
|
|
|
/deep/.uni-select__selector{ |
|
|
|
background-color: $panel-3; |
|
|
|
// background-color: $panel-3; |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
/deep/.uni-select__input-text{ |
|
|
|
color: $plain; |
|
|
|
@ -195,4 +241,26 @@ export default { |
|
|
|
border-top: 1px solid #c9c9c9; |
|
|
|
border-bottom: 1px solid #c9c9c9; |
|
|
|
} |
|
|
|
.examples { |
|
|
|
width: 130px; |
|
|
|
height: 80px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
box-sizing: border-box; |
|
|
|
border: 1px solid #cbcbcb; |
|
|
|
img { |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
} |
|
|
|
.upload-box { |
|
|
|
width: 130px; |
|
|
|
height: 80px; |
|
|
|
border: 1px solid #cbcbcb; |
|
|
|
img { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
object-fit: cover; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</style> |