uniProject/pages/study/index.vue

<template>
	<view>
		<swiper :circular="true" @change="onChangeTab" :duration="currentDuration" :current="current"
			class="ezy-study-swiper" :class="'ezy-study-swiper'+ currentProduct">
			<swiper-item v-for="(item,index) in zhangList" :key="index">
				<shuxueZhangjie v-if="currentProduct ==1&&typeId==2" @clickGradeTerm="clickGradeTerm"
					@handleCheckCatalogue="handleCheckCatalogue(item)" @listClick="listClick" :gradeTerm='gradeTerm'
					:options="item">
				</shuxueZhangjie>
				<yingyuZhangjie v-if="currentProduct ==2&&typeId==2" @clickGradeTerm="clickGradeTerm"
					@handleCheckCatalogue="handleCheckCatalogue(item)" @listClick="listClick" :gradeTerm='gradeTerm'
					:options="item">
				</yingyuZhangjie>
				<shuxueNewZhangjie v-if="currentProduct ==1&&typeId==1" @clickGradeTerm="clickGradeTerm"
					@handleCheckCatalogue="handleCheckCatalogue(item)" @listClick="listClick" :gradeTerm='gradeTerm'
					:options="item">
				</shuxueNewZhangjie>
			</swiper-item>
		</swiper>
		<!-- 蛋 -->
		<egg-dialog ref="eggDialogRef" @eggBtn="eggBtn"></egg-dialog>
		<catalogue ref="catalogueRef" :list=zhangList @change-zhang="handleChangeZhang"
			@listSelectJieClick="listSelectJieClick"></catalogue>
		<CustomTabBar :cardId="cardId" :currentTabNumber="0" :nianji="nianji" :zhangId="zhangId" :tipFlag="tipFlag">
		</CustomTabBar>
		<tip-small-dialog ref="goPayDialogRef" @confirm-btn="goPayPage" :content="tipContent"></tip-small-dialog>
		<tip-big-dialog ref="youkeDialogRef" @confirm-btn="ykConfirm" :imgShow="true"></tip-big-dialog>
		<dao-tip-dialog ref="daoTipDialogRef" v-if="showDaoTip" :productTip="productTipImg"
			@dao-tip-close="daoTipClose"></dao-tip-dialog>
	</view>
</template>
<script setup>
	import daoTipDialog from './daoTipDialog.vue';
	import {
		userZhangInfo,
		userLocate,
		userZhangForntInfo,
		userZhangNextInfo,
		getCommonZhangInfo
	} from "@/api/learnPlan.js"
	import {
		reactive,
		ref,
		nextTick,
		getCurrentInstance,
		onMounted
	} from "vue";
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import catalogue from "@/components/catalogue/catalogue.vue";
	import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
	import tipSmallDialog from '@/components/dialog/tipSmallDialog.vue'
	import tipBigDialog from '@/components/dialog/tipBigDialog.vue';
	import tipMiddleDialog from '@/components/dialog/tipMiddleDialog.vue';
	import dSwiper from '@/components/wSwiper/DSwiper.vue';

	import shuxueZhangjie from './product/shuxue.vue';
	import shuxueNewZhangjie from './product/shuxueNew.vue';
	import yingyuZhangjie from './product/yingyu.vue';

	import {
		useTabBarHistory
	} from '@/utils/emitEvents.js';
	import eggDialog from './eggDialog.vue'
	import {
		toast,
		getUserIdentity
	} from "@/utils/common";
	import cacheManager from "@/utils/cacheManager.js";
	const tipContent = '是否前往开通付费？'; //当前产品
	const goPayDialogRef = ref(null);
	const youkeDialogRef = ref(null);
	const dSwiperRef = ref(null);
	const eggDialogRef = ref(null);
	const current = ref(0);
	const currentDuration = ref(500)
	const YouKeContent = '您当前的身份是游客，想要体验完整内容需注册成用户!';
	const zhangId = ref(null); //游客使用
	const nianji = ref(null); //游客使用
	const cardId = ref(null); //游客使用
	const tipFlag = ref(null) //游客使用
	const catalogueRef = ref(null);
	const youkeZhangInfoData = ref(null);
	const currentProduct = ref(null);
	const localAuth = ref(null);
	const levelId = ref(null);
	const typeId = ref(null);
	const zhangList = ref(null);
	const gradeTerm = ref(null);
	let infoData = reactive({
		jieList: [],
		haveFlag: '',
		nianji: '',
		number: '',
		cardId: '',
		zhangId: '',
		zhangName: '',
		numberStr: '',
	});

	const termMapping = {
		1: ' 数学',
		2: ' 英语'
	};

	const daoTipDialogRef = ref(null);
	const showDaoTip = ref(true);
	const productTipImg = ref('');

	onLoad((options) => {
		init(options);
	})

	function listSelectJieClick(item, data, index) {

		if (cacheManager.get('auth')) {
			cacheManager.updateObject('auth', {
				currentZhang: zhangList.value.findIndex(citem => citem.zhangId == item.zhangId),
				zhangId: item.zhangId
			})
		}

		listClick(data, item, index);
	}

	function getProjectImg() {
		if (currentProduct.value == 1 && typeId.value==2) {
			// 数学
			productTipImg.value = 'static/images/study/shuxue/shuxue-tip.gif';
			getBj('shuxue')
		} else if (currentProduct.value == 2 && typeId.value==2) {
			// 英语
			productTipImg.value = 'static/images/study/yingyu/yingyu-tip.gif'
			getBj('yingyu');
		}else if (currentProduct.value == 1 && typeId.value==1) {
			// 英语
			productTipImg.value = 'static/images/study/shuxue/shuxue-tip.gif'
			getBj('shuxueNew');
		}
	}

	function getBj(data) {
		let bjType = cacheManager.get('dao-tip')[data];
		if (cacheManager.get('auth')) {
			// 非游客
			if (bjType !== 'has') {
				nextTick(() => {
					daoTipDialogRef.value.handleShow();
				})
			}
		} else {
			// 游客
			if (tipFlag.value === '0') {
				nextTick(() => {
					daoTipDialogRef.value.handleShow();
				})
			}
		}
	}

	function daoTipClose() {
		if (cacheManager.get('auth')) {
			// 非游客 记缓存
			if (currentProduct.value == 1 && typeId.value==2) {
				// 数学
				cacheManager.updateObject('dao-tip', {
					shuxue: 'has'
				})
			} else if (currentProduct.value == 2 && typeId.value==2) {
				// 英语
				cacheManager.updateObject('dao-tip', {
					yingyu: 'has'
				})
			}else if (currentProduct.value == 1 && typeId.value==1) {
				// 英语
				cacheManager.updateObject('dao-tip', {
					shuxueNew: 'has'
				})
			}
		} else {
			//游客
			tipFlag.value = '1';
		}
	}

	function onChangeTab(e) {
		console.log('e', e);
		console.log(e.detail.current);
		if (cacheManager.get('auth')) {
			infoData.zhangId = cacheManager.get('zhangInfo').zhangList[e.detail.current].zhangId
			cacheManager.updateObject('auth', {
				currentZhang: e.detail.current,
				zhangId: infoData.zhangId
			})
		}
	}

	function init(options) {
		if (cacheManager.get('auth')) {
			localAuth.value = cacheManager.get('auth');
			currentProduct.value = localAuth.value.subjectId;
			typeId.value = localAuth.value.typeId;
			console.log(localAuth.value);
			// 已登录
			if (localAuth.value.firstLogin) {
				nextTick(() => {
					eggDialogRef.value.eggShow();
				})
			}
			if (!cacheManager.get('daoPageCache').isCache) {
				console.log('不实用换葱');
				getZhangInfo()
			} else {
				console.log('shiyonghuancun');
				translateData(cacheManager.get('zhangInfo'))
				zhangList.value = cacheManager.get('zhangInfo').zhangList
				current.value = cacheManager.get('auth').currentZhang
				infoData.zhangId = cacheManager.get('zhangInfo').zhangList[current.value].zhangId
				recordZhangJie()
			}

			// 已登录付费未支付选择返回 -> 恢复弹窗
			if (options.studyWithCatalgue) {
				// 展开弹窗
				nextTick(() => {
					catalogueRef.value.showPopup({
						zhangId: infoData.zhangId
					});
				})
			}
		} else {
			zhangId.value = options.zhangId
			nianji.value = options.nianji
			cardId.value = options.cardId
			tipFlag.value = options.tipFlag;
			currentProduct.value = options.cardId
			// 未登录 游客 
			getCommonZhang(options)
			getProjectImg()
		}
	}

	function getZhangInfo(data) {
		let req = {
			levelId: localAuth.value.levelId
		}
		userZhangInfo(req).then(res => {
			cacheManager.set('zhangInfo', res.data)
			let zhang = cacheManager.get('zhangInfo').zhangList.findIndex(zhang => zhang.zhangId == localAuth
				.value.zhangId);
			console.log('zhang', zhang);
			if (zhang != -1) {
				cacheManager.updateObject('auth', {
					currentZhang: zhang
				})
			} else {
				cacheManager.updateObject('auth', {
					currentZhang: 0
				})
			}
			cacheManager.set('daoPageCache', {
				isCache: true
			})

			nextTick(() => {
				translateData(res.data)
				zhangList.value = res.data.zhangList
				current.value = cacheManager.get('auth').currentZhang
				infoData.zhangId = res.data.zhangList[current.value].zhangId
				recordZhangJie()
			})

		})
	}

	function getCommonZhang(data) {

		let req = {
			nianji: data.nianji,
			cardId: data.cardId,
			zhangId: data.zhangId,
		}
		getCommonZhangInfo(req).then(res => {
			translateData(res.data)
			youkeZhangInfoData.value = res.data
			zhangList.value = res.data.zhangList
			current.value = 0
		})
	}

	function recordZhangJie() {
		let req = {
			levelId: localAuth.value.levelId,
			userId: localAuth.value.userId,
			zhangId: infoData.zhangId,
			subjectId: currentProduct.value
		}
		userLocate(req).then(res => {

		})
	}

	function goPayPage() {
		let zhangInfoLocal = cacheManager.get('zhangInfo')
		if (!zhangInfoLocal.cardId) {
			toast("cardId 丢失请重新选择学科LevelId");
			return false
		}
		uni.redirectTo({
			url: '/pages/mall/mallPage?cardId=' + zhangInfoLocal.cardId + '&from=daoPage' + '&subjectId=' +
				zhangInfoLocal.subjectId
		})
	}

	function handleChangeZhang(data) {
		console.log(data);
		const authCode = getUserIdentity();
		if (authCode !== 'Visitor') {
			cacheManager.updateObject('auth', {
				zhangId: data.zhangId,
				currentZhang: zhangList.value.findIndex(citem => citem.zhangId == data.zhangId),
			})
		}
		currentDuration.value = 0
		setTimeout(() => {
			current.value = data.number - 1
			nextTick(() => {
				currentDuration.value = 500
			})
		}, 100)
		//	init()
	}

	function goKaoshi(data) {
		uni.redirectTo({
			// url: `/pages/unitTest/index?jieNumber=` + data.number
			url: `/pages/unitTest/index?jieId=` + data.jieId
		})
	}

	function goLookShipin(data, index) {
	
		if (!cacheManager.get('auth')) {
			console.log('zhangList.value[0].jieList', zhangList.value[0].jieList);
			console.log('zhangList.value[0].jieList.index', zhangList.value[0].jieList[index]);

			let youkeData = {
				cardId: cardId.value,
				nianji: nianji.value,
				zhangId: zhangId.value,
				tipFlag: tipFlag.value,
				jieList: zhangList.value[0].jieList[index],
				jieName: zhangList.value[0].jieList[index].jieName
			}
			uni.redirectTo({
				url: '/pages/study/lookShipin?youkePageData=' + JSON.stringify(youkeData)
			})
		} else {
			if (typeId.value == 1) {
				// 1新 2旧
				if(!data.videoId){
					toast("videoId 丢失!");
					return false
				}
				uni.redirectTo({
					url: '/pages/study/lookShipinNew?jieId=' + data.jieId
				})
			} else {
				if(!data.videoId){
					toast("videoId 丢失!");
					return false
				}
				uni.redirectTo({
					url: '/pages/study/lookShipin?jieId=' + data.jieId
				})
			}

		}
	}

	function translateData(data) {
		//	gradeTerm.value = termMapping[data.subjectId] +' · '+ data.levelName
		gradeTerm.value = data.levelName
	}

	function listClick(data, data2, index) {
		console.log('data', data); // 节内容
		console.log('data2', data2); //章内容
		if (!cacheManager.get('auth')) {
			youkeDialogRef.value.handleShow();
			return;
		}
		const authCode = getUserIdentity();
		console.log('authCode', authCode);
		if (!(authCode == 'VIP' || data.firstFlag == 1)) {
			//	debugger
			goPayDialogRef.value.handleShow();
			return false
		}

		if (data.type == 2) {
			// 最后一项
			goKaoshi(data, index)
		} else {
			goLookShipin(data, index)
		}
	}

	function handleCheckCatalogue(item) {
		catalogueRef.value.showPopup(item);
	}

	function clickGradeTerm() {
		// if(cacheManager.get('auth')){
		// 	cacheManager.updateObject('auth', {
		// 		currentZhang: 0
		// 	})
		// }
		uni.navigateTo({
			url: `/pages/selectGradesTerms/index?tipFlag=${tipFlag.value}&from='daoPage'`,
		})
	}
	// 游客弹窗---确定
	function ykConfirm() {
		uni.redirectTo({
			url: '/pages/login/index'
		});
	}

	function eggBtn() {
		console.log('点击：开启提分之旅');
		getProjectImg();
		cacheManager.updateObject('auth', {
			firstLogin: false
		})
	}
</script>
<style>
</style>