gy-app-shop/pages/oneselfUser/myCenter.vue

204 lines
5.4 KiB
Vue

<style lang="scss" scoped>
.my-ctn{
width: 100%;
height: 100%;
padding: $paddingTB $paddingLR;
:not(not) {
box-sizing: border-box;
}
.header{
width: 100%;
height: 260rpx;
border-radius: 16rpx;
box-shadow: $box-shadow;
background-color: #fff;
margin-top: 20rpx;
position: relative;
&-userinfo{
text-align: center;
padding-top: 110rpx;
&-name{
font-size: 28rpx;
font-size: $uni-font-size-lg;
color: #000000;
padding-top: 10rpx;
}
&-company{
font-size: $uni-font-size-sm;
color: #aaa;
padding-top: 10rpx;
}
}
&-userinfo-avatar{
padding: 15rpx;
background-color: #fff;
width: 130rpx;
height: 130rpx;
border-radius: 50%;
margin: 0 auto;
position: absolute;
left: 50%;
top: -20rpx;
transform: translateX(-50%);
}
}
.function{
box-shadow: $box-shadow;
border-radius: $uni-border-radius-lg;
margin-top: 50rpx;
padding: 20rpx;
&-top{
display: flex;
border-top: 1px solid #ddd;
&:first-child{
border-top: none
}
&-box{
flex: 1;
text-align: center;
padding: 40rpx 0;
&:first-child{
border-right: 1px solid #ddd;
}
}
}
}
}
</style>
<template>
<view class="my-ctn">
<headerBg></headerBg>
<view class="header">
<view class="header-userinfo" v-if="userInfo">
<view class="header-userinfo-avatar">
<template v-if="userInfo.avatar.length > 0">
<u-image width="100rpx" height="100rpx" :src="getUrl(userInfo.avatar)" shape="circle"></u-image>
</template>
<template v-else>
<u-image width="100rpx" height="100rpx" src="/static/images/my/headImg.png" shape="circle"></u-image>
</template>
</view>
<view class="header-userinfo-name">{{userInfo && userInfo.nickName || userInfo.userName}}</view>
<view class="header-userinfo-company">{{tenantInfo && tenantInfo.tenantName || ""}}</view>
</view>
</view>
<view class="function">
<view class="function-top">
<view class="function-top-box" @click="goRouterFn('../tabBar/my/newAlarmRemind')">
<view class="function-top-box-icon pb10">
<tui-icon name="baojingjilu" size="80" ></tui-icon>
</view>
<view class="function-top-box-text">新报警提醒</view>
</view>
<view class="function-top-box" @click="goRouterFn('../tabBar/my/maintenanceRecord')">
<view class="function-top-box-icon pb10">
<tui-icon name="weibaojilu" size="80"></tui-icon>
</view>
<view class="function-top-box-text">维保记录</view>
</view>
</view>
<view class="function-top">
<view class="function-top-box" @click="goRouterFn('../tabBar/my/projectServe')">
<view class="function-top-box-icon pb10">
<tui-icon name="muluxiangmu" size="80"></tui-icon>
</view>
<view class="function-top-box-text">工程服务</view>
</view>
<view class="function-top-box" @click="goRouterFn('../tabBar/my/onlineServe')">
<view class="function-top-box-icon pb10">
<tui-icon name="zixun" size="80" ></tui-icon>
</view>
<view class="function-top-box-text">在线服务</view>
</view>
</view>
<view class="function-top">
<view class="function-top-box" @click="goRouterFn('../tabBar/my/help')">
<view class="function-top-box-icon pb10">
<tui-icon name="bangzhu" size="80"></tui-icon>
</view>
<view class="function-top-box-text">帮助</view>
</view>
<view class="function-top-box" @click="goRouterFn('../tabBar/my/setup')">
<view class="function-top-box-icon pb10">
<tui-icon name="shezhi" size="80"></tui-icon>
</view>
<view class="function-top-box-text">设置</view>
</view>
</view>
</view>
</view>
</template>
<script>
import headerBg from "@/components/headerBg/headerBg.vue"
export default {
data() {
return {
avatar: 'https://cdn.uviewui.com/uview/example/fade.jpg',
userInfo: null,
tenantInfo:null,
tabbar:[
{
"pagePath": "/pages/tabBar/home",
"text": "首页",
"iconPath": "/static/images/toolbar/home.png",
"selectedIconPath": "/static/images/toolbar/act-home.png"
},{
"pagePath": "/pages/tabBar/project",
"text": "项目",
"iconPath": "/static/images/toolbar/project.png",
"selectedIconPath": "/static/images/toolbar/act-project.png"
},{
"pagePath": "/pages/tabBar/alarm",
"text": "报警",
"iconPath": "/static/images/toolbar/alarm.png",
"selectedIconPath": "/static/images/toolbar/act-alarm.png"
},{
"pagePath": "/pages/tabBar/my",
"text": "我的",
"iconPath": "/static/images/toolbar/my.png",
"selectedIconPath": "/static/images/toolbar/act-my.png"
}]
}
},
components:{headerBg},
created() {
this.getUserInfoFn();
},
methods: {
getUserInfoFn(){
// let userToken = uni.getStorageSync("userToken");
let userType = uni.getStorageSync("userType");
// let getUserInfoUrl = userType === "企业用户"?"/system/personal/profile":"/system/user/profile";
let getUserInfoUrl = "/system/user/profile";
this.$get(getUserInfoUrl).then((res)=>{
console.log(res,"res");
if(!res.data) return;
this.userInfo = res.data;
this.tenantInfo = res.data.tenant;
uni.setStorageSync("tenantInfo",res.data.tenant)
uni.setStorageSync("userInfo",this.userInfo)
})
},
goRouterFn(url){
console.log(url,"url");
uni.navigateTo({
url:url
})
},
getUrl(url) {
if(url.indexOf('http') > 0){
return url;
}else {
return this.$config.baseUrl + url;
}
}
}
}
</script>