uniProject/pages/wordList/wordList.vue

<template>
	<view class="word-list-page">
		<view class="icon-title-navBar-box">
			<view @click="goBack" class="nav-bar-icon"></view>
			<text class="nav-bar-title">{{listData.title || ''}}</text>
		</view>
		<view class="ezy-tab-border">
			<view class="ezy-border-body">
				<view class="word-title-box">{{listData.jieName || ''}}</view>
				<view class="word-num-box"><icon></icon><text>{{listData.studyCount || 0}}/{{listData.count || 0}}词</text></view>
				<view class="word-list-body" v-if="listData.wordList && listData.wordList.length > 0">
				<!-- 单词 -->
					<view class="word-list-item" v-for="(item,index) in listData.wordList" :key="index" @click="toWord(item)">
						<view class="item-word">
							<view class="word-text">
								<text v-for="(word, wordIndex) in item.chaifen[0].split(',')" 
								:key="wordIndex" class="word-color">
								{{ word }}
								</text>
							</view>
							<view class="phonetic-alphabet">{{item.yinbiao || ''}}</view>
						</view>
						<view class="item-explain">
							<view class="item-explain-content">
								<view class="explain-text" v-for="(meaning, meaningIndex) in item.jianyi" :key="meaningIndex">{{meaning}}</view>
							</view>
						</view>
						<view class="item-arrow"><icon></icon></view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import {reactive,ref} from "vue";
import {toast} from "@/utils/common";
import {onLoad} from "@dcloudio/uni-app";
import {getWordList,getWordListYk} from "@/api/word.js";
import cacheManager from '@/utils/cacheManager.js';

const listData = reactive({
    count: 0, // 总数，默认值设为 0
    studyCount: 0, // 已学总数，默认值设为 0
    jieName: '',//节名称
    title: '', // 版本+年级+学期
    wordList: [] // 单词列表，默认值设为空数组
});

let routerOpt = ref(false);

onLoad((options) => {
	console.log('options555',options);
	routerOpt = options;
	if (!cacheManager.get('auth')) {
		// 游客
		getWordListDataYk();
	} else {
		// 非游客
		getWordListData();
	}
});

// 返回
function goBack(){
	if (!cacheManager.get('auth')) {
		// 游客
		uni.redirectTo({
			url: `/pages/study/index?levelId=${routerOpt.levelId}&typeId=${routerOpt.typeId}&subjectId=${routerOpt.subjectId}&tipFlag=${routerOpt.tipFlag}&youkeZhangId=${routerOpt.youkeZhangId}&jieId=${routerOpt.jieId}`
		})
	} else {
		// 非游客
		uni.redirectTo({
			url: `/pages/study/index`
		})
	}
	
}

function getWordListData() {
    const opt = {
        jieId: routerOpt.jieId
    };
    getWordList(opt).then(res => {
        if (res.code === 0) {
            listData.count = res.data.count;
            listData.studyCount = res.data.studyCount;
            listData.jieName = res.data.jieName;
            listData.title = res.data.title;
            listData.wordList = res.data.wordList;
        }
    }).catch(err => {
        toast("获取单词列表数据失败");
    });
}

function getWordListDataYk() {
    const opt = {
        jieId: routerOpt.jieId
    };
    getWordListYk(opt).then(res => {
        if (res.code === 0) {
            listData.count = res.data.count;
            listData.studyCount = res.data.studyCount;
            listData.jieName = res.data.jieName;
            listData.title = res.data.title;
            listData.wordList = res.data.wordList;
        }
    }).catch(err => {
        toast("获取单词列表数据失败");
    });
}

// 单词
function toWord(data){
	if (!cacheManager.get('auth')) {
		// 游客
		uni.redirectTo({
			url: `/pages/newEnglish/index?jieId=${routerOpt.jieId}&wordId=${data.id}&levelId=${routerOpt.levelId}&typeId=${routerOpt.typeId}&subjectId=${routerOpt.subjectId}&tipFlag=${routerOpt.tipFlag}&youkeZhangId=${routerOpt.youkeZhangId}&jieId=${routerOpt.jieId}`
		})
	} else {
		// 非游客
		uni.redirectTo({
			url: `/pages/newEnglish/index?jieId=${routerOpt.jieId}&wordId=${data.id}`
		})
	}
}
</script>