Huiqitong/src/pages/mine/index.vue

<template>
	<view class="container">
		<image style="width: 100%;" src="@/static/img/ztback.png" mode="widthFix"></image>
		<view class="main">
			<view class="head" v-if="userStore.userInfo.moblie">
				<view class="left">
					<u-avatar
						:src="url + '/' + userStore.userInfo.head_pic"
						:size="72"></u-avatar>
					<text class="name">{{userStore.userInfo.name||'无名称'}}</text>
				</view>
				<image style="width: 48rpx;height: 48rpx;" src="@/static/img/setting.png" mode=""
					@click="goeditinfo('')"></image>
			</view>
			<text v-else>请登录</text>
			<view class="editlist">
				<view class="editone" @click="goeditinfo('关联企业')">
					<view class="left">
						<image style="width: 74rpx;height: 74rpx;" src="@/static/img/glqy.png" mode=""></image>
						<text class="txt">关联企业</text>
					</view>
					<image style="width: 14.14rpx;height: 14.14rpx;" src="@/static/img/Group13.png" mode=""></image>
				</view>
				<view class="editone" @click="goeditinfo('我的申请')">
					<view class="left">
						<image style="width: 74rpx;height: 74rpx;" src="@/static/img/wdsq.png" mode=""></image>
						<text class="txt">我的申请</text>
					</view>
					<image style="width: 14.14rpx;height: 14.14rpx;" src="@/static/img/Group13.png" mode=""></image>
				</view>
				<view class="editone" @click="goeditinfo('我的课程')">
					<view class="left">
						<image style="width: 74rpx;height: 74rpx;" src="@/static/img/wdkc.png" mode=""></image>
						<text class="txt">我的课程</text>
					</view>
					<image style="width: 14.14rpx;height: 14.14rpx;" src="@/static/img/Group13.png" mode=""></image>
				</view>
			</view>
			<view class="buts">
				<view class="but" @click="outLogin">
					{{userStore.userInfo.moblie?'退出登录':'登录'}}
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		ref
	} from 'vue';
	import useUserStore from '@/store/user'
	const userStore = useUserStore()
	
	const url = ref(import.meta.env.VITE_APP_BASE_URL)

	const goeditinfo = (val) => {
		if (val === '关联企业') {
			uni.navigateTo({
				url: '/pages/mine/associatedEnterprise'
			})
		} else if (val === '我的申请') {
			uni.navigateTo({
				url: '/pages/mine/myApplication'
			})
		} else if (val === '我的课程') {
			uni.navigateTo({
				url: '/pages/mine/myCourses'
			})
		} else {
			uni.navigateTo({
				url: '/pages/mine/porsonalinfo'
			})
		}
	}
	
	const outLogin = () => {
		userStore.logOut()
	}
	onShow(() => {
		// if (uni.getStorageSync('access_token') === '') {
		// 	uni.navigateTo({
		// 		url: '/pages/login/login'
		// 	})
		// } else {
			userStore.getUserInfo()
		// }
	})
</script>

<style scoped lang="scss">
	.container {
		background-color: #FFFFFF;
		height: 100vh;
		width: 100%;
		display: grid;

		.main {
			border-radius: 60rpx 60rpx 0rpx 0rpx;
			background: #FFFFFF;
			margin-top: -350rpx;
			height: calc(100vh - 350rpx);
			padding: 0 40rpx;
			box-sizing: border-box;

			.head {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.left {
					display: flex;
					align-items: center;
					margin-top: -50rpx;

					.name {
						margin-top: 50rpx;
						font-family: Source Han Sans;
						font-size: 40rpx;
						font-weight: 350;
						text-align: center;
						letter-spacing: normal;
						/* 文本/正文 */
						color: #1A1A1A;
						margin-left: 30rpx;
					}
				}
			}

			.editlist {
				margin-top: 24rpx;

				.editone {
					width: 100%;
					height: 120rpx;
					background: #FFFFFF;
					border-bottom: 2rpx solid #f3f3f3;
					display: flex;
					align-items: center;
					justify-content: space-between;

					.left {
						display: flex;
						align-items: center;

						.txt {
							margin-left: 36rpx;
							font-family: Source Han Sans;
							font-size: 28rpx;
							font-weight: 350;
							text-align: right;
							letter-spacing: normal;
							color: #333333;
						}
					}
				}
			}

			.buts {
				width: 100%;
				display: flex;
				justify-content: center;

				.but {
					margin-top: 160rpx;
					width: 574rpx;
					height: 96rpx;
					border-radius: 248rpx;
					background: linear-gradient(90deg, #007FFF 0%, #99CCFF 100%);
					display: flex;
					align-items: center;
					justify-content: center;
					font-family: Source Han Sans;
					font-size: 36rpx;
					font-weight: 500;
					text-align: justify;
					/* 浏览器可能不支持 */
					display: flex;
					align-items: center;
					letter-spacing: normal;
					color: #FFFFFF;
				}
			}
		}
	}
</style>