更新新英语切换

pages/wordList/wordList.vue

@@ -7,11 +7,10 @@
 		</view>
 		<view class="ezy-tab-border">
 			<view class="ezy-border-body">
-				<scroll-view scroll-x="true" :scroll-left='wordLeft' class="word-title-box"
-					v-if="listData.jieNumberList && listData.jieNumberList.length >0">
+          <view  class="word-title-box" style="display: flex;overflow-x: auto;" v-if="listData.jieNumberList && listData.jieNumberList.length >0">
 					<view :id="'item-' + item.jieId" class="title-item" v-for="(item,index) in listData.jieNumberList" @click="handleTitleClick(item)"
 						:key="item.jieId" :class="{active: listData.activeIndex == index}">Unit{{item.number}}</view>
-				</scroll-view>
+          </view>
 
 				<swiper class="word-list-swiper-box" :indicator-dots="false" :autoplay="false" :circular="false" :current="listData.activeIndex"
 					@change="handleSwiperChange" :disable-touch="!swiperData.isAllowed">
@@ -22,7 +21,7 @@
 							<view class="word-num-box">
 								<icon></icon><text>{{citem.studyCount || 0}}/{{citem.count || 0}}词</text>
 							</view>
-							
+
 							<!-- 单词 -->
 							<view class="word-list-item" v-for="(item,index) in citem.wordList" :key="index"
 								@click="toWord(item)" :class="{active: item.wcFlag == 1}">
@@ -64,7 +63,7 @@
 
 <script setup>
 	import {reactive,ref,nextTick} from "vue";
-	import {toast,getDataFromStr} from "@/utils/common";
+	import {toast,getDataFromStr,useActiveDomIntoView} from "@/utils/common";
 	import {onLoad} from "@dcloudio/uni-app";
 	import {getWordZhangList,getWordZhangListYK,} from "@/api/word.js";
 	import cacheManager from '@/utils/cacheManager.js';
@@ -127,6 +126,7 @@
 
 	// Swiper 切换
 	function handleSwiperChange(e) {
+    useActiveDomIntoView('.word-title-box','.title-item.active')
 		listData.activeIndex = e.detail.current;
 		if (!swiperData.isAllowed) {
 			// 不满足条件时回退到原索引
@@ -164,7 +164,7 @@
 		}
 
 	}
-	
+
 	// 修改缓存zid  用于定位岛
 	function updataCache(data) {
 		cacheManager.updateObject('zhangInfo', {
@@ -189,7 +189,7 @@
 		updataCache(data.zhangZid)
 		getWordListData();
 	}
-	
+
 	// 返回节index
 	function findIndexByJieId(list, jieId) {
 		const findIndex = list.findIndex(item => item.jieId == jieId)
@@ -221,7 +221,6 @@
 						listData.activeIndex = findIndexByJieId(listData.jieNumberList, wordJieId);
 					}
 				})
-
 			}
 		}).catch(err => {
 			toast("获取单词列表数据失败");

utils/common.js

@@ -1,4 +1,5 @@
 import cacheManager from "./cacheManager.js"
+import {nextTick} from "vue";
 
 /**
  * 显示消息提示框
@@ -74,32 +75,32 @@ const IdentityType = {
 
 export function getUserIdentity() {
 	const auth = cacheManager.get('auth');
-	if(auth.subjectId == 2 && auth.typeId == 1){
-	if (auth) {
-		const arr = getDataFromStr(auth.levelId);
-		if ((auth.levelIdList || []).some(item => item == arr[0])) {
-			// 购买此levelId
-			return 'VIP'
+	if (auth.subjectId == 2 && auth.typeId == 1) {
+		if (auth) {
+			const arr = getDataFromStr(auth.levelId);
+			if ((auth.levelIdList || []).some(item => item == arr[0])) {
+				// 购买此levelId
+				return 'VIP'
+			}
+			// 无购买此levelId
+			return 'Not-Vip';
+		} else {
+			// 游客
+			return 'Visitor';
 		}
-		// 无购买此levelId
-		return 'Not-Vip';
 	} else {
-		// 游客
-		return 'Visitor';
-	}
-	}else{
 		//旧数学 新数学 旧英语
-	if (auth) {
-		if ((auth.levelIdList || []).some(item => item == auth.levelId)) {
-			// 购买此levelId
-			return 'VIP'
+		if (auth) {
+			if ((auth.levelIdList || []).some(item => item == auth.levelId)) {
+				// 购买此levelId
+				return 'VIP'
+			}
+			// 无购买此levelId
+			return 'Not-Vip';
+		} else {
+			// 游客
+			return 'Visitor';
 		}
-		// 无购买此levelId
-		return 'Not-Vip';
-	} else {
-		// 游客
-		return 'Visitor';
-	}
 	}
 }
 
@@ -176,4 +177,19 @@ export function getDataFromStr(strdata) {
 		return []
 	}
 	return strdata.toString().split(',')
+}
+
+export function useActiveDomIntoView(classNameParent,classNameActive) {
+	nextTick(() => {
+		const container = document.querySelector(classNameParent);
+		const highlightItem = document.querySelector(classNameActive);
+		if (highlightItem) {
+			const topPos = highlightItem.offsetLeft - container.offsetLeft;
+			container.scrollTo({
+				left: topPos,
+				behavior: 'smooth'
+			})
+		}
+	})
+
 }