houserent-front/pages/user/index.vue

<template>
	<view class="u-page">
		<view class="se-pt-30 se-pb-60 se-px-40 se-bgc-green se-c-white se-pos">
			<view class="se-flex">
				<image :src="user.headImage" class="se-br-p-50 se-bgc-f9 se-w-120 se-h-120" mode=""></image>
				<view class="se-ml-20 se-flex se-flex-v-sa se-flex-ai-fs">
					<view class="se-flex">
						<text class="se-fw-6 se-fs-30">{{user.nickName?user.nickName:'暂无昵称'}}</text>
						<!-- <view class="se-flex se-flex-ai-c se-ml-20">
							<image class="se-a-25 se-mr-10" src="@/static/image/pencil.png" mode=""></image>
							<text class="se-fs-22">修改资料</text>
						</view> -->
					</view>
					<view class="se-fs-24 se-display-ib" v-if="user.phone">
						<text>手机号:</text>
						<text class="se-ml-20">{{user.phone}}</text>
					</view>
				</view>
			</view>
			<!-- <view class="se-pos-cb se-flex se-flex-h-sb se-w-vw-82 se-br-10 se-bgc-white se-py-30 se-px-20"
				style="bottom: -90rpx;">
				<view class="se-flex se-flex-v-c  se-flex-1">
					<image src="@/static/image/46892@2x.png" class="se-a-80" mode=""></image>
					<view @click="onNavigateTo()" class=" se-ta-c se-fw-6 se-br-30 se-mt-10 se-py-5 se-px-22 se-c-black se-fs-22 ">
						我的钱包
					</view>
				</view>
				<view class="se-flex se-flex-v-c se-flex-1 ">
					<image src="@/static/image/47077@2x.png" class="se-a-80" mode=""></image>
					<view @click="onNavigateTo()" class=" se-ta-c se-fw-6 se-br-30 se-mt-10 se-py-5 se-px-22 se-c-black se-fs-22 ">
						我的预约
					</view>
				</view>
				<view class="se-flex se-flex-v-c se-flex-1 ">
					<image src="@/static/image/47065@2x.png" class="se-a-80" mode=""></image>
					<view @click="onNavigateTo()" class=" se-ta-c se-fw-6 se-br-30 se-mt-10 se-py-5 se-px-22 se-c-black se-fs-22 ">
						我的收藏
					</view>
				</view>
				<view class="se-flex se-flex-v-c se-flex-1 ">
					<image src="@/static/image/46896@2x.png" class="se-a-80" mode=""></image>
					<view @click="onNavigateTo()" class=" se-ta-c se-fw-6 se-br-30 se-mt-10 se-py-5 se-px-22 se-c-black se-fs-22 ">
						需求发布
					</view>
				</view>
			</view> -->
		</view>
		<view class="se-m-30 se-mt-30 se-pl-30 se-pr-20 se-br-20 se-bgc-white">
			<view class="se-py-30 se-px-20 se-flex se-flex-h-sb se-b-b" @click="onBrokerAccount">
				<view class="se-flex se-flex-ai-c">
					<image class="se-a-30" src="@/static/image/home4734.png" mode=""></image>
					<text class="se-ml-20 se-fs-24 se-fw-5">经纪人账号</text>
				</view>
				<view class="se-flex se-flex-ai-c">
					<uv-icon name="arrow-right"></uv-icon>
				</view>
			</view>
			<view class="se-py-30 se-px-20 se-flex se-flex-h-sb se-b-b" @click="onLandlord">
				<view class="se-flex se-flex-ai-c">
					<image class="se-a-30" src="@/static/image/home4734.png" mode=""></image>
					<text class="se-ml-20 se-fs-24 se-fw-5">房东中心</text>
				</view>
				<view class="se-flex se-flex-ai-c">
					<uv-icon name="arrow-right"></uv-icon>
				</view>
			</view>
			<view class="se-py-30 se-px-20 se-flex se-flex-h-sb se-b-b" @click="onBrokerCenter">
				<view class="se-flex se-flex-ai-c">
					<image class="se-a-30" src="@/static/image/47100.png" mode=""></image>
					<text class="se-ml-20 se-fs-24 se-fw-5">经纪人中心</text>
				</view>
				<view class="se-flex se-flex-ai-c">
					<uv-icon name="arrow-right"></uv-icon>
				</view>
			</view>
			<view class="se-py-30 se-px-20 se-flex se-flex-h-sb se-b-b" @click="onCustomerService">
				<view class="se-flex se-flex-ai-c">
					<image class="se-a-30" src="@/static/image/user49384.png" mode=""></image>
					<text class="se-ml-20 se-fs-24 se-fw-5">在线客服</text>
				</view>
				<view class="se-flex se-flex-ai-c">
					<uv-icon name="arrow-right"></uv-icon>
				</view>
			</view>
			<view class="se-py-30 se-px-20 se-flex se-flex-h-sb" @click="onVersion">
				<view class="se-flex se-flex-ai-c">
					<image class="se-a-30" src="@/static/image/47186.png" mode=""></image>
					<text class="se-ml-20 se-fs-24 se-fw-5">关于我们</text>
				</view>
				<view class="se-flex se-flex-ai-c">
					<uv-icon name="arrow-right"></uv-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { getInfo } from "@/common/api.js"
	export default {
		data() {
			return {
				user:{}
			}
		},
		onLoad() {
			
		},
		onShow() {
			this.onInfo()
		},
		methods: {
			onInfo(){
				let that = this
				that.user = uni.getStorageSync('userInfo')
				getInfo({}).then(response=>{
					that.user = response.result
					console.info('response',response)
				}).catch(error=>{
					
				})
			},
			onLandlord(){
				uni.navigateTo({
					url:"/pages_subpack/landlord-center/index"
				})
			},
			onBrokerCenter(){
				uni.navigateTo({
					url:"/pages_subpack/broker-center/index"
				})
			},
			onVersion(){
				uni.navigateTo({
					url:"/pages_subpack/version/index"
				})
			},
			onBrokerAccount(){
				uni.navigateTo({
					url:"/pages_subpack/broker-account/index"
				})
			},
			onCustomerService(){
				let that = this
				let obj = that.$utils.getkeyContent('phone')
				if (uni.canIUse('makePhoneCall')) {
					uni.makePhoneCall({
					  phoneNumber: obj.keyContent, // 电话号码
					  success: function () {
						console.log('拨打电话成功');
					  },
					  fail: function () {
						console.log('拨打电话失败');
					  }
					});
				} else {
					console.log('你的设备不支持拨打电话功能');
				}
				
			}
		}
	}
</script>

<style>
	page {
		background-color: #f5f5f5 !important;
	}

	.se-grid {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 10rpx;
		padding-bottom: 4rpx;
	}
</style>