uniProject/pages/my/sxtkPage.vue

<template>
	<view class="ezy-sxtk-page">
		<view class="icon-title-navBar-box">
			<view @click="handleBack" class="nav-bar-icon"></view>
			<text class="nav-bar-title">数学题库</text>
		</view>
		<view class="ezy-tab-border sxtk-tab-border">
			<view class="tab-img"></view>
			<view class="sxtk-tab-box">
				<view v-for="(item,index) in jiaocaiData" :key="index"  class="tab-item"
				 @click="selectNianji(item,index)" :class="{'active': currentNianjiName == item.nianji}">
					<view class="tab-nianji-item">{{item.nianji}}</view>
				</view>
			</view>
			<view class="sxtk-line"></view>
			<view class="sxtk-banben-body">
				<view v-for="(item,index) in currentBanbenList" :key="index" class="banben-item"
				:class="{'active': banbenName == item}" @click="selectBanben(item,index)">
					<view class="banben-text-item">{{item}}</view>
				</view>
			</view>
			<view class="sxtk-line"></view>
			<button class="sxtk-confirm-btn" @click="handleConfirm"></button>
		</view>
		<banbenConfirmDialog ref="jiaocaiRef" @confirm-btn="jcConfirm" :content="jcContent"></banbenConfirmDialog>
		<CustomTabBar ></CustomTabBar>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app';
		import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
	import {
		selectTiku
	} from '@/api/my.js'
	import {
		toast,
		getUserIdentity
	} from "@/utils/common";
	import * as httpApi from "@/api/pdf.js"
	import {
		ref
	} from "vue";
	import banbenConfirmDialog from './banbenConfirmDialog.vue';
	let jiaocaiData = ref(null)
	let currentBanbenList = ref([])

	let currentNianjiName = ref('L1')
	let currentBanbenIndex = ref(null)
	const banbenName = ref(null)
	const jiaocaiRef = ref(null);
	const jcContent = ref(null);

	function selectNianji(item, index) {
		currentNianjiName.value = item.nianji

		currentBanbenList.value = item.banbenList
		banbenName.value = ''

	}

	function jcConfirm() {
		httpApi.getPDFUrl({
		  banben:banbenName.value,
		  nianji:currentNianjiName.value,
		}).then(res1 => {
			uni.downloadFile({
			  url: res1.data,
			  success: function (res) {
			    var filePath = res.tempFilePath;
			    uni.openDocument({
			      filePath: filePath,
			      showMenu: true,
			      success: function (res) {
			        console.log('打开文档成功');
					jiaocaiRef.value.handleClose();
			      }
			    });
			  }
			});
		})
	
		/* uni.navigateTo({
			url: '/pages/pdfPage/pdfPage?banben=' + banbenName.value + '&nianji=' + currentNianjiName.value
		}); */
	}

	function selectBanben(item, index) {

		console.log('item', item);
		if (!currentNianjiName.value) {
			toast("请选择年级")
			return false
		}

		banbenName.value = item

	}

	function handleBack() {
		uni.redirectTo({
			url: '/pages/my/index'
		});
	}

	function handleConfirm() {
		// 确认逻辑
		if (banbenName.value && currentNianjiName.value) {
			jcContent.value = "用户你好，鹅状元将为您随机生成《" + banbenName.value + "》100道试题."
			console.log('jcContent.value', jcContent.value);
			jiaocaiRef.value.handleShow();
		} else {
			toast("请选择年级和对应的教学版本")
			return false
		}
	}

	function getInfo() {
		selectTiku({}).then(res => {
			// jiaocaiData.value = [{
			// 		"nianji": "L1",
			// 		"banbenList": ["人教版"]
			// 	},
			// 	{
			// 		"nianji": "L2",
			// 		"banbenList": ["人教版222", "人教版222333"]
			// 	}
			// ]
			jiaocaiData.value = res.data
			// 默认显示第一个年级的版本列表
			if (jiaocaiData.value && jiaocaiData.value.length > 0) {
				currentBanbenList.value = jiaocaiData.value[0].banbenList
			}
		})
	}

	onLoad((options) => {
		if (options.banben && options.nianji) {
			currentNianjiName.value = options.nianji
			banbenName.value = options.banben
		}
		getInfo()
	})
</script>