<template> <view class="user-content"> <!-- 头部 --> <view class="user-head" > <view> <open-data type="userAvatarUrl" class="user-photo"></open-data> <!-- <u-image v-show="!hasLogin" src="/static/logo.png" width="100" height="100"></u-image> --> </view> <view class="user-info"> <view v-if="hasLogin" class="user-info-item">{{userData.stationName || ''}}</view> <view v-if="hasLogin" class="user-info-item">{{userData.gatherName||''}} {{userData.gatherPhone || ''}}</view> <u-button v-else="!hasLogin" plain size="mini" shape="circle" @click="toLoginPage">立即登录</u-button> </view> </view> <!-- 列表 --> <view class="user-list"> <u-cell-group> <u-cell-item icon="file-text" icon-size="40" :icon-style="{color:'#ffaa00'}" index="0" @click="toPage" title="服务协议及隐私政策"></u-cell-item> <u-cell-item v-if="hasLogin" icon="lock" icon-size="38" :icon-style="{color:'#00aaff'}" index="1" @click="toPage" title="修改密码"></u-cell-item> <u-cell-item icon="error-circle" icon-size="38" :icon-style="{color:'#aaaaff'}" :value="version" @click="checkUpdate" title="版本检查"></u-cell-item> </u-cell-group> </view> <view class="user-list quit"> <u-cell-group> <u-cell-item v-if="hasLogin" icon="minus-circle" icon-size="40" index="3" @click="quitSys" title="退出登录"></u-cell-item> </u-cell-group> </view> </view> </template> <script> import { checkLogin, getUserInfo, logout } from '@/api/login.js' export default { data() { return { hasLogin: false, userData: {}, version: '1.0.0' // 小程序版本 }; }, onShow() { checkLogin().then(res => { this.hasLogin = res.status == 200 console.log(this.hasLogin,res,'this.hasLogin') if(this.hasLogin){ this.getUserInfo() }else{ // uni.navigateTo({ // url:"/pages/login/login" // }) } }) }, computed: { user() { return this.userData } }, onLoad() { // this.getVersion() // 开启分享 uni.showShareMenu({ withShareTicket: true, menus: ['shareAppMessage', 'shareTimeline'] }) }, methods:{ // 获取当前小程序版本 getVersion(){ const accountInfo = uni.getAccountInfoSync(); this.version = accountInfo.miniProgram.version console.log(accountInfo,accountInfo.miniProgram.appId,'ppppppppp'); // 小程序 appId }, // 检查更新 checkUpdate(){ if (uni.canIUse('getUpdateManager')) { const updateManager = uni.getUpdateManager() updateManager.onCheckForUpdate(function (res) { console.log('onCheckForUpdate====', res) // 请求完新版本信息的回调 if (res.hasUpdate) { console.log('res.hasUpdate====') updateManager.onUpdateReady(function () { uni.showModal({ title: '更新提示', content: '新版本已经准备好,是否重启应用?', success: function (res) { console.log('success====', res) // res: {errMsg: "showModal: ok", cancel: false, confirm: true} if (res.confirm) { // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启 updateManager.applyUpdate() } } }) }) updateManager.onUpdateFailed(function () { // 新的版本下载失败 uni.showModal({ title: '已经有新版本了哟~', content: '新版本已经上线啦~,请您删除当前小程序,重新搜索打开哟~' }) }) } else { uni.showToast({ title: '已是最新版本', icon: 'none' }) } }) } }, // 获取用户信息 getUserInfo(){ getUserInfo().then(res => { console.log(res,'getUserInfo') if(res.status == 200){ this.$u.vuex("vuex_userData",res.data) this.userData = res.data console.log(this.userData,'-----用户信息') } }) }, // 打开对应的页面 toPage(index){ console.log(index) let pageUrl=[ '/pages/agreement/agreement?fromPage=usercenter', '/pages/userCenter/changePwd', ] uni.navigateTo({ url: pageUrl[index] }) }, // 退出登录 quitSys(){ let _this = this uni.showModal({ title: '提示', content: '您确定要退出登录吗?', success(res) { if (res.confirm) { logout().then(res => { console.log(res,'logout') getApp().globalData.token = '' _this.$u.vuex('vuex_token','') // 关闭socket uni.reLaunch({ url: '/pages/login/login' }) }) } } }) }, toLoginPage(){ uni.navigateTo({ url: '/pages/login/login' }) } } } </script> <style lang="scss"> .user-content{ width: 100%; .user-head{ background: #0DC55F; display: flex; align-items: center; padding: 35rpx 55rpx; .user-info{ flex-grow: 1; padding: 0 20rpx; color: #FFFFFF; .user-info-item{ margin: 10rpx 0; :first-child{ font-size: 34upx; } } } .user-photo{ display: block; width: 100rpx; height: 100rpx; border-radius: 50%; overflow: hidden; } } .my-ledou{ background: #FFFFFF; border-radius: 15upx; display: flex; align-items: center; justify-content: space-between; padding: 20upx; margin: 20upx; box-shadow: 0upx 3upx 6upx #eee; .user-jifen{ display: flex; align-items: center; text{ font-size: 40upx; font-weight: bold; color: red; } >view{ &:first-child{ display: flex; align-items: center; } } } } .user-list{ border-radius: 15upx; margin: 20upx; overflow: hidden; box-shadow: 0upx 3upx 6upx #eee; .quit{ margin-top: 20upx; } } .user-btn{ padding: 85rpx 200rpx; } } </style>