adultDeviceApp/pages/me/me.vue

<template>
	<view class="content">
		<view class="header-con" :style="{background:appTheme}">
			<view class="header" v-if="token">
				<image :src="user.headimg" class="headimage" />
				<text>{{user.name||user.name}}</text>
			</view>
			<view class="header2" v-else @click="handleLogin">
				<view class="text"><text>登录</text>查看更多信息</view>
			</view>
		</view>
		<!-- 列表 -->
		<view class="infolist">
			<view class="item borderRadius" @click="handleEditClick">
				<view class="left">
					性别
				</view>
				<view class="right"><text>{{user.sex==0?"未知":user.sex==1?'男':'女'}}</text>
					<icon class="t-icon t-icon-bianji3"></icon>
				</view>
			</view>
			<view class="item borderRadius" @click="handleEditClick">
				<view class="left">
					年龄(岁)
				</view>
				<view class="right"><text>{{user.age?user.age:user.mage?user.mage:0}}</text>
					<icon class="t-icon t-icon-bianji3"></icon>
				</view>
			</view>
			<view class="item borderRadius" @click="handleEditClick">
				<view class="left">
					身高(cm)
				</view>
				<view class="right"><text>{{user.height?user.height:0}}</text>
					<icon class="t-icon t-icon-bianji3"></icon>
				</view>
			</view>
		</view>
		<!--  -->
		<view class="wxlist borderRadius">
			<view class="list" @tap="navTo('/pageTwo/me/manage')">
				<view class="item border-bottom">
					<view class="left">
						<i class="t-icon t-icon-shoucang"></i>
						<view class="name">成员管理</view>
					</view>
					<view class="right">
						<image src="../../static/arrow-right.png" class="iconfont"></image>
					</view>
				</view>
			</view>
			<!--  -->
			<view class="list" @tap="navTo('/pageTwo/me/history')">
				<view class="item border-bottom">
					<view class="left">
						<i class="t-icon t-icon-gonglve"></i>
						<view class="name">历史记录</view>
					</view>
					<view class="right">
						<image src="../../static/arrow-right.png" class="iconfont"></image>
					</view>
				</view>
			</view>
			<!--  -->
			<view class="list" @tap="navTo('/pageTwo/me/feedBack')">
				<view class="item border-bottom">
					<view class="left">
						<i class="t-icon t-icon-pinglun"></i>
						<view class="name">意见反馈</view>
					</view>
					<view class="right">
						<image src="../../static/arrow-right.png" class="iconfont"></image>
					</view>
				</view>
			</view>
			<!--  -->
			<view class="list" @click="handleClick('device')">
				<view class="item border-bottom">
					<view class="left">
						<icon class="t-icon t-icon-shouhou"></icon>
						<view class="name">设备管理</view>
					</view>
					<view class="right">
						<image src="../../static/arrow-right.png" class="iconfont"></image>
					</view>
				</view>
			</view>
			<!--  -->
			<view class="list" @click="handleClick('adult')" v-if="configBox.isshowchild">
				<view class="item border-bottom">
					<view class="left">
						<icon class="t-icon t-icon-hezuo"></icon>
						<view class="name">儿童测量</view>
					</view>
					<view class="right">
						<image src="../../static/arrow-right.png" class="iconfont"></image>
					</view>
				</view>
			</view>
		</view>
		<view class="btn ml-15 mr-15" v-if="token" @click="handleOutLogin">退出登录</view>
		<SignUp></SignUp>
		<userPopup></userPopup>
	</view>
</template>
<script>
	import {
		mapState
	} from "vuex";
	import SignUp from '@/components/signup/signup.vue';
	import userPopup from '@/components/userLogin.vue'
	export default {
		data() {
			return {
				token: null,
			}
		},
		components: {
			userPopup,
			SignUp,
		},
		computed: {
			...mapState(["user", "configBox", "appTheme"]),
		},
		onTabItemTap() {
			this.$store.commit("changeEdit", false);
		},
		onLoad() {
			// 导航栏颜色
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.appTheme,
			})
			// 
			this.token = uni.getStorageSync("token")
		},
		methods: {
			handleLogin() {
				if (!uni.getStorageSync('token')) {
					uni.redirectTo({
						url: '/pageTwo/login/login'
					})
					// that.$store.commit("changeUserLogin", true)
					return
				}
			},
			handleOutLogin() {
				let that = this
				uni.showModal({
					title: '友情提示',
					content: '是否退出登录？',
					success: function(res) {
						if (res.confirm) {
							that.$model.getoutlogin({
								sessionid: uni.getStorageSync('sessionid')
							}).then((res) => {
								that.$tools.msg(res.message)
								if (res.code != 0) return
								console.log('确定退出', res)
								uni.clearStorageSync()
								uni.setStorageSync('sessionid', null)
								that.$store.commit("changeLogout", false);
								uni.reLaunch({
									url: "/pages/index/index"
								})
							})
						} else if (res.cancel) {
							that.$tools.msg("您已取消操作！");
						}
					},
				})
			},
			handleClick(ind) {
				let that = this
				if (!uni.getStorageSync('token')) {
					uni.redirectTo({
						url: '/pageTwo/login/login'
					})
					// that.$store.commit("changeUserLogin", true)
					return
				}
				if (ind == 'adult' && that.configBox.referappid) {
					console.log("跳转儿童小程序", uni.getStorageSync('userid'))
					uni.navigateToMiniProgram({
						appId: that.configBox.referappid,
						path: 'pages/index/index?userid=' + uni.getStorageSync('userid'),
						extraData: {},
					})
					return
				}
				if (ind == 'device' && that.configBox.businessappid) {
					uni.navigateToMiniProgram({
						appId: that.configBox.businessappid,
						path: 'pages/index/index',
						extraData: {},
					})
					return
				}
			},
			navTo(url) {
				if (!uni.getStorageSync('token')) {
					uni.redirectTo({
						url: '/pageTwo/login/login'
					})
					// that.$store.commit("changeUserLogin", true)
					return
				}
				uni.navigateTo({
					url
				})
			},
			handleEditClick() {
				if (!uni.getStorageSync('token')) {
					uni.redirectTo({
						url: '/pageTwo/login/login'
					})
					// that.$store.commit("changeUserLogin", true)
					return
				}
				this.$store.commit("changeEdit", true);
			},
		}
	}
</script>
<style scoped="scoped" lang="scss">
	.content {
		min-height: 100vh;
		margin-top: 110px;
	}

	.header-con {
		height: 95px !important;
	}

	.wxlist {
		height: auto;
		overflow: hidden;
		position: relative;
		margin: 0 15px;
		padding: 0 15px;
		background: #fff;
		border-radius: 10px;

		.item {
			width: auto;
			font-size: 14px;
			line-height: 55px;
			height: 55px;
			display: flex;
			justify-content: space-between;
			align-items: center;
			position: relative;
			// border-bottom: 1px solid #dfdfdf;

			.left {
				display: flex;

				.name {
					float: left;
					color: #333;
					position: absolute;
					left: 27px;
					top: 0;
				}
			}
		}
	}

	.infolist {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 15px;

		.item {
			width: 30%;
			padding: 10px 0;
			text-align: center;
			background: #fff;
			border-radius: 10px;
			position: relative;
		}

		.right {
			display: flex;
			justify-content: center;
			margin-top: 5px;

			text {
				display: inline-block;
				font-size: 16px;
				color: #666;
				font-weight: 700;
			}


		}
	}

	.btn {
		width: auto;
		margin-top: 50px;
	}

	/deep/ .header {
		justify-content: center;
		flex-wrap: wrap;
		margin-top: 0;
	}

	/deep/ .header text {
		background: inherit;
		border: none;
		width: 100%;
		display: block;
		color: #fff;
		text-align: center;
		margin-right: 0;
		font-size: 16px;
	}

	.iconfont {
		width: 16px;
		height: 16px;
	}
</style>