property/user_ui/mine/pages/house/addaddress.vue

<template>
	<view class="address">
		<uni-forms ref="form" :model="datainfo">
			<view class="adrbox">
				<uni-forms-item label="智能填写" name="realName">
					<uni-easyinput type="textarea" autoHeight v-model="text" :inputBorder='false' placeholder="粘贴信息至此处可自动识别信息并填写" />
				</uni-forms-item>
				<uni-forms-item label="收货人"  name="phonenumber">
					<view class="flexc">
						<uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="收货人姓名" />
						<view class="rimg">
							<image :src="rimg"></image>
						</view>
					</view>
				</uni-forms-item>
				<uni-forms-item label="手机号码"  name="phonenumber">
					<view class="flexc">
						<uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="手机号码" />
						<view class="rimg">
							<image :src="rimg"></image>
						</view>
					</view>
				</uni-forms-item>
				<uni-forms-item label="收货人姓名"  name="phonenumber">
					<view class="flexc">
						<uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="省、市、区、街道" />
						<view class="rimg">
							<image :src="rimg"></image>
						</view>
					</view>
				</uni-forms-item>
				<uni-forms-item label="详细地址"  name="phonenumber">
					<view class="flexc">
						<uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="小区、门牌号等" />
						<view class="rimg">
							<image :src="rimg"></image>
						</view>
					</view>
				</uni-forms-item>
			</view>
			<view class="adrbox mjbox">
				<view class="tit mb15">住宅面积</view>
				<view class="adrlist flexcw">
					<view v-for="(ite,idx) in mjlist" :class="tabval==ite.val?'act':''" :key="idx" @click="getTabFn(ite.val)">{{ite.tit}}</view>
				</view>
			</view>
			<view class="adrbox">
				<uni-forms-item label="设置为默认地址" name="realName">
					<view class="flexc" @click="checkflag=!checkflag">
						<view class="flex1"></view>
						<image :src="check" v-if="checkflag" class="checkimg"></image>
						<image :src="ncheck" v-else class="checkimg"></image>
					</view>
				</uni-forms-item>
			</view>
			
		</uni-forms>
		
		<view class="rhbtn mt30" @click="getAddFn">确定</view>
	<loading></loading>	
	</view>
</template>

<script>
	import config from '@/config'
	const baseUrl = config.baseUrl
	import { checkPermi,checkRole } from "@/utils/permission"; // 权限判断函数
	export default{
		components:{},
		data(){
			return{
				rimg:require('@/static/images/rimg.png'),
				check: require('@/mine/static/check.png'),
				ncheck: require('@/mine/static/ncheck.png'),
				list:[],
				text:"",
				datainfo:{},
				mjlist:[{tit:'80m²以内',val:'0'},{tit:'80-90m²',val:'1'},{tit:'90-119m²',val:'2'},{tit:'120-139m²',val:'3'},{tit:'140-159m²',val:'4'},{tit:'160m²以上',val:'5'},],
				checkflag:true,
				tabval:'0'
			}
		},
		onLoad: function() {
		
		},
		methods:{
			checkPermi,checkRole,
			getAddFn(){
				// this.$tab.navigateTo("/mine/pages/house/addaddress")
			},
			getTabFn(val){
				this.tabval=val
			},
			getDataFn(){
				return
				var params={
					pageSize:this.pageSize,
					pageNum: this.pageNum,
				}
				params.noticeType=this.tabidx
				getNoticeList(params).then(res=>{
					if(res.code==200){
						
					}else{
						this.$toast(res.msg)
					}
				})
				
			},
		}
	}
</script>
<style>
	page{background: #F3F3F0;}
</style>
<style lang="scss" scoped>
.address /deep/ .uni-forms-item{min-height: 106rpx;box-sizing: border-box;display: flex;align-items: center;margin-bottom: 0;border-bottom: 2rpx solid #E6E6E6;padding:10rpx 0;}
.address /deep/ .uni-forms-item:last-child{border-bottom: none;}
.address /deep/ .uni-forms-item__label{font-weight: bold;font-size: 26rpx;color: #222327;flex: 0 0 auto;width: auto !important;}
.address /deep/ .uni-easyinput{flex: 1;text-align: right;font-size: 26rpx;color: #222327;}
.address /deep/ .uni-easyinput__content-textarea{min-height: 140rpx;font-size: 26rpx;background: #F4F4F4;
border-radius: 10rpx;padding: 20rpx 14rpx;text-align: left;}
.address /deep/ .uni-easyinput__placeholder-class{font-size: 26rpx;color: #AAAAAA;}
.address /deep/ .uni-input-input{font-size: 26rpx;}
.address /deep/ .uni-textarea-textarea{font-size: 26rpx;}
.address /deep/ .is-disabled{color: #222327;background-color: #ffffff !important;}
.address{min-height: 100vh;padding: 20rpx 18rpx;display: flex;flex-direction: column;}
.adrbox{background: #FFFFFF;border-radius: 20rpx;padding:0 30rpx;margin-bottom: 24rpx;
	.rimg{width: 16rpx;height: 28rpx;flex: 0 0 auto;margin-left: 20rpx;
		image{width: 100%;height: 100%;}
	}
	&.mjbox{
		padding: 36rpx  24rpx 18rpx;
		.tit{font-weight: bold;font-size: 26rpx;color: #272727;padding-left: 18rpx;}
		.adrlist{
			view{font-weight: bold;font-size: 26rpx;color: #666666;min-width: 198rpx;padding: 0 10rpx;box-sizing: border-box;margin: 0 12rpx 24rpx;height: 64rpx;display: flex;align-items: center;justify-content: center;border-radius: 10rpx;border: 2rpx solid #C1C1C1;
			&.act{background: #DFEAFF;border: 2rpx solid #0256FD;color: #0256FD;}
			}
		}
	}
	
	.checkimg{width: 80rpx;height: 40rpx;margin-right: 8rpx;}
}

</style>