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

214 lines
6.5 KiB

<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 @click="onHead" :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" style="align-items: center;">
<text class="se-fw-6 se-fs-30">{{userInfo.nickName?userInfo.nickName:'暂无昵称'}}</text>
<!-- 会员状态 -->
<view class="" v-if="vipInfo.title" style="display: flex;background-color: #fff;
color: #0f0;
font-size: 24rpx;
align-items: center;
border-radius: 20rpx;
padding: 4rpx 10rpx;">
{{vipInfo.title}}
</view>
<!-- <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="userInfo.phone">
<text>手机号:</text>
<text class="se-ml-20">{{userInfo.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 class="se-py-30 se-px-20 se-flex se-flex-h-sb se-b-t" @click="onLogOut">
<view class="se-flex se-flex-ai-c">
<text class="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>
export default {
data() {
return {}
},
onLoad() {
},
onShow() {
this.$store.commit('getUserInfo')
},
methods: {
onHead() {
uni.navigateTo({
url: "/pages/login/index?back=" + 1
})
},
openMemberPage() {
uni.navigateTo({
url: "/pages_subpack/member/index"
})
},
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"
})
},
onLogOut() {
uni.showModal({
title: "温馨提示",
content: "确定退出当前登录",
cancelText: "取消",
confirmText: "确定",
success: (res) => {
console.info(res)
if (res.confirm == true) {
uni.removeStorageSync("userInfo")
uni.removeStorageSync("token")
uni.removeStorageSync("sessionKey")
uni.navigateTo({
url: "/pages/auth/index"
})
}
}
})
},
onCustomerService() {
let that = this
let obj = that.$utils.getkeyContent('phone')
if (uni.canIUse('makePhoneCall')) {
uni.makePhoneCall({
phoneNumber: this.configList.phone, // 电话号码
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>