租房小程序前端代码
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.
 
 
 

104 lines
3.2 KiB

<template>
<view class="se-p-30">
<uv-form labelPosition="top" :labelWidth="200" :model="form" :rules="rules" ref="form">
<uv-form-item label="姓名" prop="name" >
<uv-input v-model="form.name" type="text" placeholder="请输入姓名" customStyle="border-radius: 30px;margin-top:5px;background-color: #ffffff;padding:5px 20px;" border="none"></uv-input>
</uv-form-item>
<uv-form-item label="身份证号码" prop="idcard">
<uv-input v-model="form.idcard" type="text" placeholder="请输入身份证号码" customStyle="border-radius: 30px;margin-top:5px;background-color: #ffffff;padding:5px 20px;" border="none"></uv-input>
</uv-form-item>
<uv-form-item label="联系方式" prop="phone">
<uv-input v-model="form.phone" type="number" placeholder="请输入联系方式" customStyle="border-radius: 30px;margin-top:5px;background-color: #ffffff;padding:5px 20px;" border="none"></uv-input>
</uv-form-item>
<uv-form-item>
<view class="se-flex se-flex-v">
<text class="se-c-black se-fw-6 se-fs-30">请上传身份证正反面照片</text>
<text class="se-fs-26 se-mt-10 se-c-text">信息仅用身份核实,上传后可增加曝光机会</text>
</view>
<view class="se-my-20 se-p-20 se-flex se-flex-h-sa se-br-10" style="background: #f9f1e9;">
<image class="se-w-350 se-h-240" src="@/static/image/47719x.png" mode=""></image>
<view class="se-br-10 se-py-10 se-px-20 se-c-white se-bgc-orange" style="background-color: #FF9F39;">
点击上传
</view>
</view>
<view class="se-c-text-sub se-ta-c se-fs-24">
(确保文字清晰、可辨、避免遮挡、不全、反光)
</view>
<view class="se-my-20 se-p-20 se-flex se-flex-h-sa se-br-10" style="background: #f9f1e9;">
<image class="se-w-350 se-h-240" src="@/static/image/47719x.png" mode=""></image>
<view class="se-br-10 se-py-10 se-px-20 se-c-white se-bgc-orange" style="background-color: #FF9F39;">
点击上传
</view>
</view>
</uv-form-item>
<uv-form-item>
<uv-button type="primary" text="申请" customStyle="margin-top: 10px;border-color: #FF9F39;background-color: #FF9F39;border-radius: 30px;" @click="submit"></uv-button>
</uv-form-item>
</uv-form>
</view>
</template>
<script>
export default{
data(){
return{
form:{
name:"",
idcard:"",
phone:""
},
rules:{
name:[
{
type: 'string',
required: true,
message: '请输入姓名',
trigger: ['blur', 'change']
}
],
idcard:[
{
type: 'string',
required: true,
message: '请输入身份证号码',
trigger: ['blur', 'change']
}
],
phone:[
{
type: 'string',
required: true,
message: '请输入联系方式',
trigger: ['blur', 'change']
}
]
}
}
},
methods:{
submit() {
uni.navigateTo({
url:"/pages_subpack/successful/index"
})
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>