Explorar o código

增加Unit选项

tanxue hai 2 meses
pai
achega
f98fd7bc22
Modificáronse 2 ficheiros con 34 adicións e 13 borrados
  1. 7 3
      common/styles/global/pages.scss
  2. 27 10
      pages/wordList/wordList.vue

+ 7 - 3
common/styles/global/pages.scss

@@ -1823,9 +1823,13 @@
 		width: 94%;height: calc(100vh - 170rpx - var(--status-bar-height));margin: 3% 3%;display: flex;flex-direction: column;
 		background-color: rgba(255, 255, 255, 0.6);border-radius:0 0 8rpx 8rpx;}
 	.word-title-box{
-		box-sizing: border-box;padding: 20rpx 24rpx;margin: 0 8rpx;text-align: justify;
-		color: #068aea;font-size: 34rpx;font-weight: bold;flex-shrink: 0;
-		border-bottom: 1rpx dashed #068aea;line-height: 1.4;}
+		display: flex;overflow-x: auto;flex-shrink: 0;margin: 0 8rpx;
+		line-height: 1.4;box-sizing: border-box;border-bottom: 1rpx dashed #068aea;
+		.title-item{margin: 0 16rpx;color: #068aea;font-size: 28rpx;position: relative;padding: 12rpx 0;}
+		.title-item.active{font-weight: bold;}
+		.title-item.active::after{content: '';width: 70%;height: 8rpx;display: block;
+		background-color:#068aea;bottom: 0rpx;left:15%;position: absolute;border-radius: 8rpx;}
+	}
 	.word-list-body{flex: 1;overflow-y: auto;box-sizing: border-box;padding: 0 24rpx;}
 	.word-num-box{
 		display: flex;align-items: center;padding: 20rpx 24rpx;box-sizing: border-box;

+ 27 - 10
pages/wordList/wordList.vue

@@ -6,7 +6,10 @@
 		</view>
 		<view class="ezy-tab-border">
 			<view class="ezy-border-body">
-				<view class="word-title-box">{{listData.jieName || ''}}</view>
+				<!-- <view class="word-title-box" v-if="listData.jieNumberList && listData.jieNumberList.length >0">
+					<view class="title-item" v-for="(item,index) in listData.jieNumberList" :key="index"  
+					@click="handleTitleClick(item,index)" :class="{active: listData.activeIndex == index}">Unit{{item.number}}</view>
+				</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">
 				<!-- 单词 -->
@@ -43,21 +46,25 @@ import cacheManager from '@/utils/cacheManager.js';
 const listData = reactive({
     count: 0, // 总数,默认值设为 0
     studyCount: 0, // 已学总数,默认值设为 0
-    jieName: '',//节名称
+    jieNumberList: [],//节名称
     title: '', // 版本+年级+学期
-    wordList: [] // 单词列表,默认值设为空数组
+    wordList: [], // 单词列表,默认值设为空数组
+	activeIndex: 0,
 });
-
+let wordJieId = ref(null); 
 let routerOpt = ref(false);
 
 onLoad((options) => {
-	console.log('options555',options);
 	routerOpt = options;
 	if (!cacheManager.get('auth')) {
 		// 游客
+		const youkeData = JSON.parse(routerOpt.youkePageData)
+		console.log('youkeData',youkeData.jieId);
+		wordJieId = youkeData.jieId
 		getWordListDataYk();
 	} else {
 		// 非游客
+		wordJieId = routerOpt.jieId
 		getWordListData();
 	}
 });
@@ -79,15 +86,26 @@ function goBack(){
 	
 }
 
+function handleTitleClick(item,index){
+	listData.activeIndex = index;
+	wordJieId = item.jieId;
+	if (!cacheManager.get('auth')) {
+		getWordListDataYk();
+	}else {
+		// 非游客
+		getWordListData();
+	}
+}
+
 function getWordListData() {
     const opt = {
-        jieId: routerOpt.jieId
+        jieId: wordJieId
     };
     getWordList(opt).then(res => {
         if (res.code === 0) {
             listData.count = res.data.count;
             listData.studyCount = res.data.studyCount;
-            listData.jieName = res.data.jieName;
+            listData.jieNumberList = res.data.jieNumberList;
             listData.title = res.data.title;
             listData.wordList = res.data.wordList;
         }
@@ -97,15 +115,14 @@ function getWordListData() {
 }
 
 function getWordListDataYk() {
-	const youkeData = JSON.parse(routerOpt.youkePageData)
     const opt = {
-        jieId: youkeData.jieId
+        jieId: wordJieId
     };
     getWordListYk(opt).then(res => {
         if (res.code === 0) {
             listData.count = res.data.count;
             listData.studyCount = res.data.studyCount;
-            listData.jieName = res.data.jieName;
+            listData.jieNumberList = res.data.jieNumberList;
             listData.title = res.data.title;
             listData.wordList = res.data.wordList;
         }