uniProject/pages/my/index.vue

<template>
	<view class="mobile-my-page">
		<view class="user-info-box">
		    <view class="user-img-box">
		        <img class="head-img" :src="myInfoData.userImg" v-if="myInfoData.userImg">
		        <icon class="phone-default-userImg" v-else></icon>
		    </view>
		    <view class="user-content-box">
		        <view class="user-name">{{myInfoData.userName}}</view>
		        <view class="user-info">
		            <view>{{myInfoData.realName}}</view><text v-if="myInfoData.realName && myInfoData.orgName"></text>
		            <view>{{myInfoData.orgName}}</view><text v-if="myInfoData.orgName && myInfoData.positionName"></text>
		            <view>{{myInfoData.positionName}}</view>
		        </view>
		    </view>
		</view>
		
		<!-- <view class="my-list-box">
			<view class="list-row" @click="goToPage('xuefen')">
				<icon class="list-icon xuefen-icon"></icon>
				<text>学分</text>
				<text class="row-content">{{myInfoData.credit}}分</text>
			</view>
			<view class="list-row" @click="goToPage('xiaoxi')">
				<icon class="list-icon xiaoxi-icon"></icon>
				<text>消息</text>
				<text class="row-content">{{myInfoData.countNotice}}条</text>
			</view>
			<view class="list-row" @click="goToPage('zhengshu')">
				<icon class="list-icon zhengshu-icon"></icon>
				<text>证书</text>
				<text class="row-content">{{myInfoData.countCert}}个</text>
			</view>
		</view>
		
		<view class="my-list-box">
			<view class="list-row" @click="goToPage('cuoti')">
				<icon class="list-icon cuoti-icon"></icon>
				<text>错题</text>
			</view>
			<view class="list-row" @click="goToPage('baoming')">
				<icon class="list-icon baoming-icon"></icon>
				<text>报名</text>
			</view>
			<view class="list-row" @click="goToPage('sxtcs')">
				<icon class="list-icon sxtcs-icon"></icon>
				<text>摄像头测试</text>
			</view>
			<view class="list-row" @click="goToPage('sxtsm')">
				<icon class="list-icon sxtsm-icon"></icon>
				<text>摄像头说明</text>
			</view>
			<view class="list-row" @click="goToPage('shezhi')">
				<icon class="list-icon shezhi-icon"></icon>
				<text>设置</text>
			</view>
		</view> -->
		
		<!-- 退出登录 后续删除 -->
		<view @click="quitClick" class="exit-login-btn">退出登录</view>
		<view>
			<cameraCommon ref="cameraCommonRef"></cameraCommon>
		</view>
		<view>
			<shexiangtoushuoming ref="shexiangtoushuomingRef" :content="messageContent"  title="注意" okBtn="知道了"></shexiangtoushuoming>
		</view>
	</view>
</template>

<script setup>
	import {reactive,ref} from "vue";
	import {toast} from "@/utils/common";
	import {getMineInfo,logout} from '@/api/my.js'
	import {onLoad,onShow} from '@dcloudio/uni-app';
	import cacheManager from '@/utils/cacheManager.js';
	import cameraCommon from "@/components/dialog/cameraCommon.vue";
	import shexiangtoushuoming from "@/components/dialog/shexiangtoushuoming.vue";
	let myInfoData = reactive({
		userImg: '',
		realName: '',
		orgName: '',
		userName: '',
		positionName:'',
		credit:'',
		countCert:'',
		countNotice:'',

	});
	const cameraCommonRef = ref(null)
	const shexiangtoushuomingRef = ref(null)
	const messageContent = ref('请在考试前使用摄像头测试功能，测试摄像头是否可以正常工作，在测试前请先确保摄像头设备可以正常使用.')
	onLoad(() => {})
	
	onShow(() => {getMyInit()})
	
	function getMyInit() {
		getUserInfo();
	}
	
	function getUserInfo(){
		getMineInfo({}).then(res => {
			myInfoData.userImg= res.data.icon;
			myInfoData.realName = res.data.realName;
			myInfoData.orgName = res.data.orgName;
			myInfoData.userName = res.data.userName;
			myInfoData.positionName = res.data.positionName;
			myInfoData.credit = res.data.credit;
			myInfoData.countCert = res.data.countCert;
			myInfoData.countNotice = res.data.countNotice;
		})
	}
	
	function goToPage(data){
		switch (data) {
			// 学分
			case 'xuefen':
			    uni.navigateTo({
			    	url:'/pages/my/credit'
			    })
			break;
			
			// 消息
			case 'xiaoxi':
			    uni.navigateTo({
			    	url:'/pages/my/mesList?from=my'
			    })
			break;
			
			// 证书
			case 'zhengshu':
			    uni.navigateTo({
			    	url:'/pages/my/zhengshu'
			    })
			break;
			
			// 错题
			case 'cuoti':
			    uni.navigateTo({
			    	url:'/pages/cuoti/index'
			    })
			break;
			
			// 报名
			case 'baoming':
			    uni.navigateTo({
			    	url:'/pages/baoming/index'
			    })
			break;
			
			// 摄像头测试
			case 'sxtcs':
			cameraCommonRef.value.handleShow()
			    // uni.navigateTo({
			    // 	url:'/pages/admin/my/myInfo?from=my'
			    // })
			break;
			
			// 摄像头说明
			case 'sxtsm':
			  shexiangtoushuomingRef.value.handleShow()
			break;
			
			// 设置
			case 'shezhi':
			    uni.navigateTo({
			    	url:'/pages/my/setting'
			    })
			break;
		}
	}
	
	// 退出登录 后续删除
	function quitClick(){
		uni.showModal({
				title: '提示',
				content: '你确定要执行这个操作吗？',
				success: (res) => {
				  if (res.confirm) {
					// 确定
					quit()
				  } else if (res.cancel) {
					// 取消
				  }
				}
			  });
		
		 }
		 
	function quit (){
			logout().then(res => {
				console.log(res,'res');
				toast('退出登录成功')
				cacheManager.clearAll();
				uni.navigateTo({
					url: '/pages/login'
				});
			}).catch(err => {
				console.log(err,'err');
			toast('退出登录失败，请稍后重试')
		})
		
	}
</script>

<style>

</style>