<template>
	<app-layout :haveBackground="false">
		<view class="main-between info_card" v-show="info">
			<view class="main-left">
				<image style="width: 91rpx;height: 91rpx;border-radius: 50%;margin-right: 25rpx;" :src="info.avatar" mode=""></image>
				<view class="main-between-y">
					<view class="main-left name cross-center">
					<text style="width: 330rpx;" class="t-omit">{{info.name}}</text>
					<!-- <image style="width: 21rpx;height: 29rpx;margin: 0 28rpx 0 7rpx;" src="https://t17.9026.com/web/statics/image/sale/sex0.png" mode=""></image> -->
					<!-- <image style="width: 21rpx;height: 29rpx;margin: 0 28rpx 0 7rpx;" src="https://t17.9026.com/web/statics/image/sale/sex1.png" mode=""></image> -->
						<image style="width: 96rpx;height: 31rpx;" :src="info.is_verify==1?'https://t17.9026.com/web/statics/image/index/ysm.png':''" mode=""></image>
					</view>
					<view>{{info.mobile}}</view>
				</view>
			</view>
			<navigator :url="`/pages/sale/cusmter/addCustomer?id=${info.id}`" hover-class="none">
			<view class="cross-center edit">
				<image style="width: 27rpx;height: 26rpx;" src="https://t17.9026.com/web/statics/image/sale/edit.png" mode=""></image>编辑
			</view>
			</navigator>
		</view>
		<view class="lp_info" v-show="info">
			<view class="title">楼盘信息</view>
			<view class="main-between item">
				<view class="left t-omit">区域信息</view>
				<view class="right t-omit-two" >{{userEstate.estate.address}}</view>
			</view>
			<view class="main-between item">
				<view class="left t-omit">楼盘名称</view>
				<view  class="right t-omit-two">{{userEstate.estate.name}}</view>
			</view>
			<view class="main-between item">
				<view class="left t-omit">楼盘性质</view>
				<view  class="right t-omit">{{userEstate.estate.property==1?'住宅用房':'非住宅用房'}}</view>
			</view>
			<view class="main-between item">
				<view class="left t-omit">户号</view>
				<view class="right t-omit-two">{{userEstate.estate_no}}{{userEstate.room_no}}</view>
			</view>
		</view>
		<u-popup v-model="show" mode="center" border-radius="14" @close="show = false">
			<view class="model">
				<view class="tei">是否确认并认证该用户楼盘信息？</view>
				<view class="main-between">
					<navigator :url="`/pages/sale/cusmter/addCustomer?id=${info.id}`" @click="show = false" hover-class="none">
					<view class=" btn left">去认证</view>
					</navigator>
					<view class=" btn right" @click="show = false">信息有误</view>
				</view>
				<view class="qx" @click="show = false">取消认证</view>
			</view>
		</u-popup>
		<!-- <navigator url="" hover-class="navigator-hover"> -->
			<button class="addPro" v-if="info.is_verify!=1" type="default" @click="show=true">客户楼盘信息认证</button>
		<!-- </navigator> -->
	</app-layout>
</template>

<script>
	import uPopup from '../../../components/basic-component/u-popup/u-popup.vue';
	export default {
		components:{
			uPopup
		},
		data() {
			return {
				id:'',
				show:false,
				
				info:'',
				userEstate:'',
			};
		},
		onShow() {
			this.$showLoading()
			this.$request({
				url:this.$api.sale.customer_detail,
				data:{
					sale_customer_id:this.id
				},
				method:'post'
			}).then(res=>{
				if(res.code===0){
					this.info=res.data
					this.userEstate=res.data.userEstate[res.data.userEstate.length-1]
				}
				this.$hideLoading()
			})
		},
		onLoad(option) {
			this.id=option.id
		}
	}
</script>

<style lang="scss" scoped>
	.model{
		width: 631rpx;
		height: 371rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 60rpx 40rpx 30rpx;
		.tei{
			font-size: 32rpx;
			font-weight: bold;
			color: #222222;
			text-align: center;
		}
		.btn{
			width: 256rpx;
			height: 80rpx;
			border-radius: 40rpx;
			font-size: 28rpx;
			font-weight: bold;
			text-align: center;
			line-height: 80rpx;
			margin: 45rpx 0 75rpx;
		}
		.left{
			background: #A18353;
			color: #FFFFFF;
		}
		.right{
			border: 2px solid #A18353;
			color: #A18353;
		}
		.qx{
			font-size: 32rpx;
			font-weight: bold;
			color: #999999;
			text-align: center;
		}
	}
	.addPro {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 100rpx;
		background: #999999;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
	
	.info_card{
		width: 678rpx;
		height: 167rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 33rpx 38rpx;
		margin: 24rpx auto;
		.name{
			width: 360rpx;
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #222222;
		}
		.phone{
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #222222;
		}
		.edit{
			image{
				width: 27rpx;
				height: 26rpx;
				margin-right: 13rpx;
			}
			font-size: 26rpx;
			font-weight: 500;
			color: #838584;
			line-height: 70rpx;
		}
	}
	.lp_info{
		width: 678rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 31rpx 33rpx;
		margin: 0 auto;
		.title{
			font-size: 34rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #222222;
		}
		.item{
			min-height: 45rpx;
			line-height: 45rpx;
			padding: 23rpx 0;
			.left{
				width: 170rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #666666;
			}
			.right{
				width: 460rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #222222;
			}
		}
	}
</style>
