355 lines
7.8 KiB
Vue
355 lines
7.8 KiB
Vue
<template>
|
|
<view class="my-box">
|
|
<!-- 顶部用户信息区域 -->
|
|
<view class="user-info">
|
|
<view class="avatar-box">
|
|
<u-image v-if="userInfo.avatar" width="122rpx" height="122rpx" :src="userInfo.avatar" shape="circle"></u-image>
|
|
<u-image v-else width="122rpx" height="122rpx" src="http://static.drgyen.com/app/hc-app-power/images/my/avatar.png" shape="circle"></u-image>
|
|
</view>
|
|
<view class="info-content">
|
|
<view class="nickname">{{ userInfo.nickName }}</view>
|
|
<view class="user-id">手机号：{{ userInfo.phonenumber }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 功能列表区域 -->
|
|
<view class="function-list">
|
|
<view class="list-item" @click="goRouterFn('/pages/my/passwordModify')">
|
|
<view class="item-left">
|
|
<u-icon name="lock" color="#666666" size="32"></u-icon>
|
|
<text class="item-title">修改密码</text>
|
|
</view>
|
|
<view class="item-right">
|
|
<u-icon name="arrow-right" color="#666666" size="24"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="list-item">
|
|
<view class="item-left">
|
|
<u-icon name="integral" color="#666666" size="32"></u-icon>
|
|
<text class="item-title">版本号</text>
|
|
</view>
|
|
<view class="item-right">
|
|
<text class="item-value">v1.0.0</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 退出 -->
|
|
<view class="btn-box">
|
|
<u-button shape="circle" @click="outLoginFn" type="primary" >退出登录</u-button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
avatar: '',
|
|
userInfo: {
|
|
avatar:""
|
|
},
|
|
tenantInfo: null,
|
|
version:'1.0.0',
|
|
menuList:[
|
|
{
|
|
name:'新报警提醒',
|
|
remark:'掌握动态',
|
|
icon:"dicon-icon_gaojingjilu",
|
|
url:"./my/newAlarmRemind",
|
|
background:"linear-gradient(0deg, #D94353, #FF887C);",
|
|
twoColor: "rgba(255,79,98,0.1);"
|
|
},
|
|
{
|
|
name: "维保记录",
|
|
remark: "数智化管理",
|
|
icon: "dicon-icon_weibao",
|
|
url: "./my/maintenanceRecord",
|
|
background: "linear-gradient(0deg, #005CAE, #008CFB);",
|
|
twoColor: "rgba(0,108,204,0.1);"
|
|
},
|
|
{
|
|
name: "工程服务",
|
|
remark: "一站式对接服务",
|
|
icon: "dicon-icon_gongcheng",
|
|
url: "./my/projectServe",
|
|
background: "linear-gradient(0deg, #008C18, #00C853);",
|
|
twoColor: "rgba(0,172,36,0.1);"
|
|
},
|
|
{
|
|
name: "联系我们",
|
|
remark: "战略合作",
|
|
icon: "dicon-xiaoxi",
|
|
url: "./my/onlineServe",
|
|
background: "linear-gradient(0deg, #4E00A1, #8A00E2);",
|
|
twoColor: "rgba(99,0,211,0.1);"
|
|
},
|
|
{
|
|
name: "密码修改",
|
|
remark: "安全保护",
|
|
icon: "dicon-mima1",
|
|
url: "./my/passwordModify",
|
|
background: "linear-gradient(0deg, #03648F, #04A4E6);",
|
|
twoColor: "rgba(4,123,179,0.1);"
|
|
},
|
|
{
|
|
name: "帮助中心",
|
|
remark: "快速找到解决方案",
|
|
icon: "dicon-bangzhu",
|
|
url: "./my/help",
|
|
// url: "/pages/my/helpCenter",
|
|
background: "linear-gradient(0deg, #D38A00, #FFB700);",
|
|
twoColor: "rgba(248,163,0,0.1);"
|
|
},
|
|
{
|
|
name: "关于平台",
|
|
remark: "一目了然",
|
|
icon: "dicon-icon_guanyu",
|
|
url: "./my/about",
|
|
background: "linear-gradient(0deg, #B22C9D, #FF6EC7);",
|
|
twoColor: "rgba(213,54,189,0.1);"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
onLoad() {
|
|
// #ifdef MP-WEIXIN
|
|
const accountInfo = wx.getAccountInfoSync();
|
|
if(accountInfo.miniProgram.envVersion=='release'){
|
|
this.version = accountInfo.miniProgram.version;
|
|
}
|
|
// #endif
|
|
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/getInfo";
|
|
|
|
this.$get(getUserInfoUrl).then((res) => {
|
|
console.log(res, "res");
|
|
if (!res.data) return;
|
|
this.userInfo = res.data.user;
|
|
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 && url.indexOf('http') > 0) {
|
|
return url;
|
|
} else {
|
|
return this.$config.baseUrl + url;
|
|
}
|
|
},
|
|
// 退出登录
|
|
outLoginFn(){
|
|
// uni.clearStorageSync();
|
|
uni.removeStorageSync('userToken');
|
|
uni.reLaunch({
|
|
url:"../auth/passwordLogin"
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
page {
|
|
height: 100%;
|
|
background-color: #F5F5F5;
|
|
}
|
|
.my-box {
|
|
width: 100%;
|
|
// padding: 10rpx 45rpx 0;
|
|
font-family: Source Han Sans CN;
|
|
:not(not) {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.user-info {
|
|
padding: 40rpx 32rpx;
|
|
background-color: #FFFFFF;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.avatar-box {
|
|
margin-right: 24rpx;
|
|
}
|
|
|
|
.info-content {
|
|
flex: 1;
|
|
}
|
|
|
|
.nickname {
|
|
font-size: 16px;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
margin-bottom: 8rpx;
|
|
}
|
|
|
|
.user-id {
|
|
font-size: 14px;
|
|
color: #999999;
|
|
}
|
|
|
|
.function-list {
|
|
margin-top: 20rpx;
|
|
background-color: #FFFFFF;
|
|
}
|
|
|
|
.list-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 32rpx;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.list-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.item-left {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.item-title {
|
|
font-size: 14px;
|
|
color: #333333;
|
|
margin-left: 16rpx;
|
|
}
|
|
|
|
.item-right {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.item-value {
|
|
font-size: 14px;
|
|
color: #999999;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
|
|
.header-box {
|
|
width: 660rpx;
|
|
height: 292rpx;
|
|
border-radius: 20px;
|
|
background: url("http://static.drgyen.com/app/hc-app-power/images/my/header-bg.jpg") no-repeat;
|
|
background-size: 100% 100%;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 27rpx;
|
|
padding-top: 20rpx;
|
|
.avatar-box {
|
|
margin-right: 26rpx;
|
|
}
|
|
.userinfo-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
font-weight: 500;
|
|
color: #fff;
|
|
.header-userinfo-name {
|
|
font-size: 28rpx;
|
|
}
|
|
.header-userinfo-company {
|
|
font-size: 24rpx;
|
|
padding-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
// 菜单
|
|
.menu-box{
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
margin-top: 20rpx;
|
|
.menu-item{
|
|
width: 320rpx;
|
|
height: 200rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx 20rpx 15rpx 30rpx;
|
|
margin-bottom: 20rpx;
|
|
position: relative;
|
|
|
|
&:nth-child(2n-1) {
|
|
margin-right: 20rpx;
|
|
}
|
|
.home-menu-item-header {
|
|
display: flex;
|
|
// align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.home-menu-item-name {
|
|
font-weight: 550;
|
|
font-size: 28rpx;
|
|
}
|
|
.home-menu-item-remark {
|
|
font-size: 20rpx;
|
|
color: #999999;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.home-menu-item-right {
|
|
width: 38rpx;
|
|
height: 38rpx;
|
|
background: #EFEFEF;
|
|
border-radius: 50%;
|
|
padding-left: 2rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
.home-menu-item-value{
|
|
position: absolute;
|
|
left: 30rpx;
|
|
bottom: 26rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 550;
|
|
}
|
|
.home-menu-item-bg {
|
|
position: absolute;
|
|
right: 37rpx;
|
|
bottom: 26rpx;
|
|
font-size: 75rpx;
|
|
z-index: 99;
|
|
color: transparent;
|
|
display: inline-block;
|
|
-webkit-background-clip: text;
|
|
}
|
|
.home-menu-item-bg-two{
|
|
position: absolute;
|
|
right: 44rpx;
|
|
bottom: 26rpx;
|
|
font-size: 75rpx;
|
|
z-index: 98;
|
|
}
|
|
}
|
|
.border-box{
|
|
height:1px;
|
|
background: #E0E3E5;
|
|
}
|
|
}
|
|
|
|
.btn-box{
|
|
margin-top: 100rpx;
|
|
padding: 0 20rpx;
|
|
}
|
|
|
|
}
|
|
</style> |