|
|
@@ -0,0 +1,155 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ 英语 英语 英语 英语 英语
|
|
|
+ <view class="study-school-year" @click="clickGradeTerm">{{gradeTerm}}</view>
|
|
|
+ <view class="ezy-study-wrap" @touchstart="onTouchStart" @touchend="onTouchEnd">
|
|
|
+ <view class="chapter-box" @click="handleCheckCatalogue">{{options.numberStr}}</view>
|
|
|
+ <view class="chapter-title-box">{{options.zhangName}}</view>
|
|
|
+ <view>
|
|
|
+ <view class="brand-item" v-for="(item, index) in options.jieList" :key="item.jieId"
|
|
|
+ @click="listClick(item, index)" :class="{ 'brand-active': index === 0 }">
|
|
|
+ <view class="brand-icon">
|
|
|
+ {{ item.number }}
|
|
|
+ </view>
|
|
|
+ <view v-if="item.daeFlag">
|
|
|
+ <template v-if="growthType ==0">蛋</template>
|
|
|
+ <template v-if="growthType ==1">小鹅</template>
|
|
|
+ <template v-if="growthType ==2">中鹅</template>
|
|
|
+ <template v-if="growthType ==3">大鹅</template>
|
|
|
+ </view>
|
|
|
+ <!-- 如果用户不是 VIP 且不是第一项，则添加 brand-lock 类 -->
|
|
|
+ <view v-if="!(isVip=='VIP' || item.number == 'Lesson 1')" class="brand-lock"></view>
|
|
|
+ <view class="brand-content">
|
|
|
+ {{ item.jieName }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+ import {
|
|
|
+ reactive,
|
|
|
+ ref,
|
|
|
+ watch,
|
|
|
+ getCurrentInstance,
|
|
|
+ onMounted
|
|
|
+ } from "vue";
|
|
|
+ import cacheManager from "@/utils/cacheManager.js";
|
|
|
+ import {
|
|
|
+ toast,
|
|
|
+ getUserIdentity
|
|
|
+ } from "@/utils/common";
|
|
|
+ const $emit = defineEmits(['clickGradeTerm', 'onLeft', 'onRight', 'handleCheckCatalogue', 'listClick'])
|
|
|
+ const props = defineProps({
|
|
|
+ options: {
|
|
|
+ type: Object,
|
|
|
+ },
|
|
|
+ })
|
|
|
+ const isVip = getUserIdentity();
|
|
|
+ const growthType = cacheManager.get('auth').growthType;
|
|
|
+ const gradeMapping = {
|
|
|
+ 1: '一年级',
|
|
|
+ 2: '二年级',
|
|
|
+ 3: '三年级',
|
|
|
+ 4: '四年级',
|
|
|
+ 5: '五年级',
|
|
|
+ 6: '六年级'
|
|
|
+ };
|
|
|
+
|
|
|
+ const termMapping = {
|
|
|
+ 1: ' 数学',
|
|
|
+ 2: ' 英语'
|
|
|
+ };
|
|
|
+
|
|
|
+ let startX = ref(0);
|
|
|
+ let isSliding = ref(false);
|
|
|
+ let endX = ref(0);
|
|
|
+ let gradeTerm = ref('');
|
|
|
+
|
|
|
+ function clickGradeTerm() {
|
|
|
+ $emit('clickGradeTerm');
|
|
|
+ }
|
|
|
+
|
|
|
+ function listClick(data) {
|
|
|
+ $emit('listClick', data);
|
|
|
+ }
|
|
|
+
|
|
|
+ function translateData(data) {
|
|
|
+ return gradeMapping[data.nianji] + termMapping[data.cardId]
|
|
|
+ }
|
|
|
+
|
|
|
+ function handleCheckCatalogue() {
|
|
|
+ $emit('handleCheckCatalogue');
|
|
|
+ }
|
|
|
+
|
|
|
+ function onTouchStart(event) {
|
|
|
+ console.log(event.touches.length);
|
|
|
+ isSliding.value = false
|
|
|
+ if (event.touches.length === 1) {
|
|
|
+ isSliding.value = true;
|
|
|
+ startX.value = event.touches[0].pageX;
|
|
|
+ } else {
|
|
|
+ isSliding.value = false;
|
|
|
+ event.preventDefault()
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function onSwipeLeft(event) {
|
|
|
+ console.log('11111');
|
|
|
+ if (cacheManager.get('auth')) {
|
|
|
+ $emit('onLeft');
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function onSwipeRight(event) {
|
|
|
+ console.log('22222');
|
|
|
+ if (cacheManager.get('auth')) {
|
|
|
+ $emit('onRight');
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function onTouchEnd(event) {
|
|
|
+ if (isSliding.value) {
|
|
|
+ const distanceX = event.changedTouches[0].clientX - startX.value
|
|
|
+ if (distanceX > 0) {
|
|
|
+ onSwipeLeft();
|
|
|
+ } else if (distanceX < 0) {
|
|
|
+ onSwipeRight();
|
|
|
+ }
|
|
|
+ isSliding.value = false
|
|
|
+ } else {
|
|
|
+ console.log('error');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ function dataRecom(data){
|
|
|
+ if(data&&data.jieList.length>0){
|
|
|
+ data.jieList.some(item => {
|
|
|
+ if (item.studyFlag == 0) {
|
|
|
+ item.daeFlag = true;
|
|
|
+ return true; // 返回 true 以终止 some 循环
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ console.log(data);
|
|
|
+ console.log("1111");
|
|
|
+ }
|
|
|
+ watch(() => props.options, (newVal, oldVal) => {
|
|
|
+ console.log('New options:', newVal);
|
|
|
+ console.log('Old options:', oldVal);
|
|
|
+ // 在这里可以根据新的 options 做一些操作，比如发起请求等
|
|
|
+ gradeTerm.value = translateData(newVal);
|
|
|
+ dataRecom(newVal)
|
|
|
+ }, {
|
|
|
+ deep: true,
|
|
|
+ immediate: true
|
|
|
+ });
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+
|
|
|
+</style>
|
wangguoyu