uniProject/pages/my/index.vue

<template>
	<view class="ezy-my-page">
		<view class="my-head-box">
			<icon class="head-img-box" :style="{backgroundImage: 'url(' + myInfoData.icon + ')'}"></icon>
			<view class="head-content-box">
				<text>{{myInfoData.nickName}}</text>
				<view class="ezy-jf-box" v-if="loginFlag">
					<icon class="jf-icon"></icon>
					<text class="jf-text">{{myInfoData.credit}}</text>
				</view>
			</view>
		</view>
		<swiper class="my-hyqy-swiper" circular :indicator-dots="hyqyData.indicatorDots" :autoplay="hyqyData.autoplay"
			:interval="hyqyData.interval" :duration="hyqyData.duration" indicator-color="#5195d3"
			indicator-active-color="#83d9ff" v-if="bannerArr">
			<!-- 1.数学 2.英语-->
			<swiper-item v-for="(item, index) in bannerArr" :key="index" class="hyqy-box" @click="hyqyBtn(item)">
				<img :src="item.addCover" class="hyqy-box-img" />
			</swiper-item>
		</swiper>
		<view class="my-list-box">
			<view class="list-row" @click="telClick">
				<icon class="list-icon tel-icon"></icon>
				<text>手机号码</text>
			</view>
			<view class="list-row" @click="checkWrong">
				<icon class="list-icon error-icon"></icon>
				<text>我的错题</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="orderClick">
				<icon class="list-icon order-icon"></icon>
				<text>我的订单</text>
			</view>
			<view class="list-row" @click="aboutClick">
				<icon class="list-icon about-icon"></icon>
				<text>关于我们</text>
			</view>
			<view class="list-row" @click="cpscClick">
				<icon class="list-icon cpsc-icon"></icon>
				<text>产品商城</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="sxtkClick">
				<icon class="list-icon sxtk-icon"></icon>
				<text>数学题库</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="xxjlClick">
				<icon class="list-icon sxtk-icon"></icon>
				<text>学习记录</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="xxscClick">
				<icon class="list-icon sxtk-icon"></icon>
				<text>学习时长</text>
			</view>
			<view v-if="appleCode=='true'&&currentPlatform=='ios'" class="list-row" @click="duihuamaDuihuan">
				<icon class="list-icon duihuanma-icon"></icon>
				<text>兑换码</text>
			</view>
			<view v-if="currentPlatform=='android'" class="list-row" @click="duihuamaDuihuan">
				<icon class="list-icon duihuanma-icon"></icon>
				<text>兑换码</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="yonghuzhuxiao">
				<icon class="list-icon zhuxiao-icon"></icon>
				<text>用户注销</text>
			</view>
			<view v-if="loginFlag" class="list-row" @click="yinsizhengce">
				<icon class="list-icon yszc-icon"></icon>
				<text>隐私政策</text>
			</view>
			<view class="list-row" @click="kefudianhua">
				<icon class="list-icon kfdh-icon"></icon>
				<text>客服与投诉</text>
			</view>
			<view class="list-row" @click="exitLogin">
				<icon class="list-icon login-out-icon"></icon>
				<text>退出登录</text>
			</view>
			<view class="list-row" @click="yingyongshezhi">
				<icon class="list-icon login-out-icon"></icon>
				<text>应用设置</text>
			</view>
		</view>
		<CustomTabBar :levelId="levelId" :currentTabNumber="3" :typeId="typeId" :subjectId="subjectId"
			:tipFlag="tipFlag">
		</CustomTabBar>
		<tip-small-dialog ref="exitDialogRef" @confirm-btn="exitBtn" :content="tipContent"></tip-small-dialog>
		<tip-big-dialog ref="youkeDialogRef" @confirm-btn="ykConfirm" :imgShow="true"></tip-big-dialog>
		<tip-small-dialog ref="zhuxiaoDialogRef" @confirm-btn="zhuxiaoBtn" :content="zhuxiaoContent"></tip-small-dialog>
		<duihuanmaDialog ref="duihuanmaDialogRef" @confirm-btn="duihuanmaBtn" title="兑换"></duihuanmaDialog>
		<tel-dialog @telClose="telClose" @bindBtn="bindBtn" v-if="telDialogFlag"></tel-dialog>
		<agree-content-dialog ref="agreeContentDialogRef" :agreeType="agreeType"></agree-content-dialog>
		<tip-small-dialog ref="kefuDialogRef" :title="kefuTitle" @confirm-btn="kefuBtn" :content="kefuContent"
			class="kefu-dialog"></tip-small-dialog>
	</view>
</template>

<script setup>
	import agreeContentDialog from '@/pages/login/agreeContentDialog.vue';
	import {
		toast,
		getUserIdentity
	} from "@/utils/common";
	import cacheManager from '@/utils/cacheManager.js';
	import {
		logout
	} from '@/api/login.js'
	import {
		myInfo,
		zhuxiao,
		duihuanmaCode,
		myCardList,
		commonCardList
	} from '@/api/my.js'
	import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
	import {
		getCurrentInstance
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		reactive,
		ref
	} from "vue";
	import tipSmallDialog from '@/components/dialog/tipSmallDialog.vue';
	import duihuanmaDialog from '@/components/dialog/duihuanmaDialog.vue';
	import tipMiddleDialog from '@/components/dialog/tipMiddleDialog.vue';
	import tipBigDialog from '@/components/dialog/tipBigDialog.vue';
	import telDialog from './telDialog.vue'
	import {
		MESSAGE_VISITER_TO_LOGIN
	} from "@/utils/constant.js"
	import {
		onShow
	} from '@dcloudio/uni-app';
	onShow(() => {
		if (!cacheManager.get('auth')) {
			youkeFun();
		} else {
			// 非游客
			noYoukeFun();
		}
	})
	const agreeType = ref(null);
	const agreeContentDialogRef = ref(null);
	const subjectId = ref(null); //游客使用
	const levelId = ref(null); //游客使用
	const typeId = ref(null); //游客使用
	const tipFlag = ref(null); //游客使用
	const tipContent = '你确定要执行这个操作吗？';
	const zhuxiaoContent = '你确定要执行这个操作吗？';
	const duihuanmaContent = '你确定要执行这个操作吗？';
	let hyqyData = reactive({
		indicatorDots: true,
		autoplay: true,
		interval: 10000,
		duration: 500
	});
	let loginFlag = ref(false);
	let telDialogFlag = ref(false);
	let myInfoData = reactive({
		userImg: '',
		userName: '',
		credit: '',
		vipFlag: '',
		nickName: '',
		icon: '',
	});
	let routerOpt = ref(false);
	let appleCode = ref(null);
	let currentPlatform = ref(null);
	const exitDialogRef = ref(null);
	const youkeDialogRef = ref(null);
	const zhuxiaoDialogRef = ref(null);
	const duihuanmaDialogRef = ref(null);
	const bannerArr = ref(null);

	const kefuDialogRef = ref(null);
	const kefuTitle = '提示';
	const kefuContent = '客服电话：17304117625';

	const exitLogin = () => {
		exitDialogRef.value.handleShow();
	}

	// 退出按钮
	const exitBtn = () => {
		if (loginFlag.value) {
			logout().then(res => {
				toast('退出登录成功')
				cacheManager.clearAll();
				uni.reLaunch({
					url: '/pages/login/index'
				});
			}).catch(err => {
				toast('退出登录失败，请稍后重试')
			})
		} else {
			uni.reLaunch({
				url: '/pages/login/index'
			});
		}

	}

	const zhuxiaoBtn = () => {
		let req = {

		}
		zhuxiao().then(res => {
			cacheManager.clearAll();
			toast('用户注销成功')
			uni.redirectTo({
				url: '/pages/login/index'
			});
		}).catch(err => {
			toast('失败，请稍后重试')
		})
	}

	function yonghuzhuxiao() {
		zhuxiaoDialogRef.value.handleShow();
	}

	function duihuamaDuihuan() {
		duihuanmaDialogRef.value.handleShow();
	}

	function duihuanmaBtn(data) {
		console.log('data', data);
		let req = {
			code: data
		}
		duihuanmaCode(req).then(res => {
			if (res.code == 0) {
				toast('兑换成功')
				const localList = cacheManager.get('auth').levelIdList || []
				const mergeList = [...new Set([...localList, ...res.data.levelIdList])]
				cacheManager.updateObject('auth', {
					levelIdList: mergeList
				})
				uni.redirectTo({
					url: '/pages/my/index'
				})
			} else {
				toast('兑换失败请重试或联系管理员')
				return false
			}
		}).catch(err => {

		})
	}

	function yinsizhengce() {
		agreeType.value = 'ystk'
		agreeContentDialogRef.value.handleShow();
	}

	function kefudianhua() {
		kefuDialogRef.value.handleShow();
	}

	function kefuBtn() {
		kefuDialogRef.value.handleClose();
	}
	// 游客弹窗---确定

	function ykConfirm() {
		uni.redirectTo({
			url: '/pages/login/index'
		});
	}

	function yingyongshezhi() {
		if (loginFlag.value) {
			const AuthCode = getUserIdentity();
			if (AuthCode == 'Visitor') {
				youkeDialogRef.value.handleShow();
				return;
			}
			uni.redirectTo({
				url: '/pages/my/yingyongshezhi'
			});
		} else {
			youkeDialogRef.value.handleShow();
		}
	}

	// 手机号码
	function telClick() {
		if (loginFlag.value) {
			telDialogFlag.value = true;
		} else {
			youkeDialogRef.value.handleShow();
		}

	}

	// 手机号码绑定
	function bindBtn() {
		telDialogFlag.value = false;
		myGetAuth()
	}

	// 关闭手机号码弹窗
	function telClose() {
		telDialogFlag.value = false;
	}

	// 关于我们
	function aboutClick() {
		if (loginFlag.value) {
			uni.redirectTo({
				url: '/pages/my/aboutPage'
			});
		} else {
			uni.redirectTo({
				url: `/pages/my/aboutPage?levelId=${routerOpt.levelId}&typeId=${routerOpt.typeId}&subjectId=${routerOpt.subjectId}&tipFlag=${routerOpt.tipFlag}`
			});
		}
	}


	function sxtkClick() {
		uni.redirectTo({
			url: '/pages/my/sxtkPage'
		});
	}

	function xxjlClick() {
		uni.redirectTo({
			url: '/pages/my/xuexiJilu'
		});
	}

	function xxscClick() {
		uni.redirectTo({
			url: '/pages/my/xuexishichang'
		});
	}
	// 产品商城
	function cpscClick() {

		if (loginFlag.value) {
			uni.redirectTo({
				url: '/pages/mall/mallPage'
			});
		} else {
			uni.redirectTo({
				url: `/pages/mall/mallPage?levelId=${routerOpt.levelId}&typeId=${routerOpt.typeId}&subjectId=${routerOpt.subjectId}&tipFlag=${routerOpt.tipFlag}`
			});
		}

	}

	// 订单
	function orderClick() {
		if (loginFlag.value) {
			uni.redirectTo({
				url: '/pages/pay/order'
			});
		} else {
			youkeDialogRef.value.handleShow();
		}
	}

	// 获取用户数据
	function getMyInfo() {
		myInfo({}).then(res => {

			myInfoData.userName = res.data.userName;
			myInfoData.credit = res.data.credit;

			myInfoData.nickName = res.data.nickName;

			if (res.data.nickName) {
				myInfoData.nickName = res.data.nickName;
			} else {
				myInfoData.nickName = '鹅状元';
			}
			if (res.data.icon) {
				myInfoData.icon = res.data.icon;
			} else {
				getUserImg(res.data.growthType)
			}
		})
		getMyCardList();
	}
	// 登录人员的cardlist
	function getMyCardList() {
		myCardList({}).then(res => {
			bannerArr.value = res.data;
		})
	}
	// 游客的cardList
	function getCommonCardList() {
		commonCardList({}).then(res => {
			bannerArr.value = res.data;
		})
	}

	// 获取用户头像
	function getUserImg(data) {
		switch (data) {
			case 0:
				myInfoData.icon = 'static/images/my/head-img0.png'
				break;
			case 1:
				myInfoData.icon = 'static/images/my/head-img1.png'
				break;
			case 2:
				myInfoData.icon = 'static/images/my/head-img2.png'
				break;
			case 3:
				myInfoData.icon = 'static/images/my/head-img3.png'
				break;
			default:
				myInfoData.icon = 'static/images/my/head-unlogin-img.png'
				break;

		}
	}
	// 点击card
	function hyqyBtn(data) {
		if (loginFlag.value) {

			uni.redirectTo({
				url: '/pages/mall/mallPage?cardId=' + data.id + '&subjectId=' + data.subjectId + '&from=myPage'
			})
		} else {
			uni.redirectTo({
				url: `/pages/mall/mallPage?levelId=${routerOpt.levelId}&typeId=${routerOpt.typeId}&cardId=${data.id}&subjectId=${data.subjectId}&tipFlag=${routerOpt.tipFlag}`
			});
		}


	}

	// 判断是否是游客
	function myGetAuth() {
		let LocalStorage = cacheManager.get('auth');
		if (LocalStorage) {
			// 非游客
			noYoukeFun()
		} else {
			youkeFun();
		}
	}

	// 游客
	function youkeFun() {
		// 获取广告
		getCommonCardList();
		levelId.value = routerOpt.levelId
		typeId.value = routerOpt.typeId
		subjectId.value = routerOpt.subjectId
		tipFlag.value = routerOpt.tipFlag
		// my游客
		loginFlag.value = false;
		myInfoData.userName = '游客';
		myInfoData.nickName = '鹅状元';
		myInfoData.icon = 'static/images/my/head-unlogin-img.png'
	}

	// 非游客
	function noYoukeFun() {
		loginFlag.value = true;
		getMyInfo();
	}

	function isIOSorAndroid() {
		const systemInfo = uni.getSystemInfoSync();

		console.log('systemInfo', systemInfo);

		if (systemInfo.platform == 'ios') {
			return currentPlatform.value = 'ios'
		} else {
			return currentPlatform.value = 'android'
		}
	}

	onLoad((options) => {
		if (!cacheManager.get('auth')) {
			// 游客
			routerOpt = options;
		} else {
			appleCode.value = cacheManager.get("auth").appleCode.toString()
			isIOSorAndroid()
		}
	})

	function checkWrong() {
		if (loginFlag.value) {
			const AuthCode = getUserIdentity();
			if (AuthCode == 'Visitor') {
				youkeDialogRef.value.handleShow();
				return;
			}
			uni.redirectTo({
				url: '/pages/wrong/index'
			})
		} else {
			youkeDialogRef.value.handleShow();
		}
	}
</script>