pda-cli/src/pages/sys/user/index.vue

<template>
	<view class="wrap">
		<common-navbar title="我的" backgroundColor="#5b95ff" titleColor="#ffffff" :showBack="false">
		</common-navbar>
		<view class="header">
			<view class="userinfo">
				<view class="image" @click="navTo('info')">
					<!-- <image :src="avatarUrl"></image> -->
					<u-avatar size="100"  src="/static/aidex/images/user01.png"></u-avatar>
					</view>
				<view class="info" style="display: flex;justify-content: space-between;">
					<view>
						<view class="username">{{loginUserName}}</view>
						<!--view class="usercode">普通员工</view-->
					</view>
					<view class="sign-in-images"><image src="/static/aidex/images/sign-in.png"></image></view>
				</view>
			</view>
		<!--
			<u-row class="userinfo-topbox" gutter="16" justify="center">
				<u-col span="4" text-align="center">
					<view class="number">9,999<em>元</em></view>
					<view>余额</view>
				</u-col>
				<u-col span="4" text-align="center"  @click="navTo('/pages/sys/application/recharge')">
					<view><u-icon size="28px" color="#ffffff" name="rmb-circle"></u-icon></view>
					<view>充值</view>
				</u-col>
				<u-col span="4" text-align="center" @click="navTo('/pages/sys/application/balance-details')">
					<view>
						<view class="iconfont icon-faan" style="font-size: 24px;color:#ffffff;"></view>
					</view>
					<view>余额明细</view>
				</u-col>
			</u-row>
			!-->
		</view>
		<view class="list">
			<u-gap height="20" bg-color="#f5f5f5"></u-gap>
			<u-cell-group class="personal-list" :border="false">
				<u-cell-item icon="question-circle" :iconStyle="{ color: '#ff8d06' }" title="常见问题" :center="true" @click="navTo('problem')"></u-cell-item>
				<u-cell-item icon="kefu-ermai" :iconStyle="{ color: '#5f8dff' }" title="意见反馈" :center="true" @click="navTo('comment')"></u-cell-item>
				<u-cell-item icon="map" :iconStyle="{ color: '#316ede' }" title="账号安全" :center="true" @click="navTo('pwd')"></u-cell-item>
				<u-cell-item icon="scan" :iconStyle="{ color: '#36cfc9' }" title="扫描设置" :center="true" @click="navTo('scan-settings')"></u-cell-item>
				<u-cell-item icon="order" :iconStyle="{ color: '#59bdf9' }" title="清除缓存" :center="true" @click="navTo('clear-cache')"></u-cell-item>
			</u-cell-group>
			<u-gap height="20" bg-color="#f5f5f5"></u-gap>
			<u-cell-group class="personal-list" :border="false">
				<u-cell-item icon="reload" :iconStyle="{ color: '#19be6b' }" title="版本更新" :center="true" @click="upgrade"></u-cell-item>
				<u-cell-item icon="setting" :iconStyle="{ color: '#2767dc' }" title="系统设置" :center="true" @click="navTo('setting')"></u-cell-item>
			</u-cell-group>
		</view>
		<view class="app-meta">
			<text class="app-name">{{ appName }}</text>
			<text class="app-version">版本 {{ appVersion }}</text>
		</view>
	</view>
</template>
<script>
		import CommonNavbar from "@/components/common-navbar/index";
		import app_upgrade from '@/uni_modules/app-upgrade/js_sdk/index.js';
		import config from '@/common/config.js';
		import manifest from '@/manifest.json';
/**
 * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
 */
export default {
	components: {
	  CommonNavbar,
	},
	data() {
		return {
			loginUserName:'',	
			iconSize: 38
		};
	},
	onLoad(e) {
		this.loginUserName = getApp().globalData.UserName || (this.vuex_user && this.vuex_user.user_name) || '';
	},

	computed: {
		appName() {
			return manifest.name || '';
		},
		appVersion() {
			return manifest.versionName || '';
		},
		avatarUrl() {
			// let url = this.vuex_user.avatarUrl || '/ctxPath/static/images/user1.jpg';
			// url = url.replace('/ctxPath/', this.vuex_config.baseUrl + '/');
			let url = this.vuex_config.baseUrl+ this.vuex_user.avatar ||  '/static/aidex/tabbar/my_2.png';
			url = this.replaceAll(url,'\\','/');
			return url + '?t=' + new Date().getTime();
		}
	},
	methods: {
		navTo(url) {
			uni.navigateTo({
				url: url
			});
		},
		logout() {
			this.$u.api.logout().then(res => {
				this.$u.toast(res.msg);
				if (res.code == '200' || res.code == '401') {
					let self = this;
					setTimeout(() => {
						uni.reLaunch({
							url: '/pages/sys/login/index'
						});
					}, 500);
				}
			});
		},
		upgrade(){
			// #ifdef APP-PLUS
			app_upgrade(async () => {
				const appInfo = await new Promise((resolve) => {
					plus.runtime.getProperty(plus.runtime.appid, (inf) => {
						resolve(inf);
					});
				});
				const res = await this.$u.api.upgradeCheck({
					app_name: config.upgradeName,
					current_version: appInfo.version
				});
				if (!res.download_url) {
					this.$u.toast('当前版本已是最新版');
					return;
				}
				return {
					changelog: res.message + '，最新版本：' + res.latest_version,
					status: res.need_update ? 1 : 0,
					path: res.download_url
				};
			}, 1);
			// #endif
			// #ifndef APP-PLUS
			this.$u.toast('小程序端或H5端已是最新版，无需检查更新！');
			// #endif
		}
	}
};
</script>
<style lang="scss">
@import '@/common/pda-typography.scss';
@import 'index.scss';
page {
	background-color: #f5f5f5;
}
.header {
	.userinfo {
		position: relative;
		padding: 20rpx 30rpx 24rpx;
		align-items: center;
	}
	.info {
		flex: 1;
		min-width: 0;
		align-items: center;
	}
	.username {
		font-size: $pda-font-body;
		line-height: 1.3;
	}
}
.list {
	.personal-list {
		::v-deep .u-cell {
			min-height: $pda-row-min-height;
			padding: 24rpx 30rpx;
			box-sizing: border-box;
		}
		::v-deep .u-cell_title {
			color: #202328;
			font-size: $pda-font-body;
			line-height: 1.3;
		}
		::v-deep .u-cell__left-icon-wrap {
			margin-right: 20rpx;
		}
		::v-deep .u-cell__right-icon-wrap {
			flex-shrink: 0;
		}
	}
}
.sign-in-images{
	width: 125rpx;
	height:50rpx;
	flex-shrink: 0;
	uni-image, image {
		width: 125rpx;
		height:50rpx;
	}
}
.app-meta {
	padding: 48rpx 30rpx 40rpx;
	text-align: center;
}
.app-name {
	display: block;
	color: #242820;
	font-size: $pda-font-body;
	font-weight: 700;
	line-height: 1.4;
}
.app-version {
	display: block;
	margin-top: 8rpx;
	color: #8a8f86;
	font-size: $pda-font-nav-sub;
	line-height: 1.3;
}
</style>