|
|
@@ -1,5 +1,5 @@
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, onMounted } from 'vue'
|
|
|
+import { ref, onMounted, nextTick } from 'vue'
|
|
|
import { fetchSubjectAppInfo } from '@/services/subject/info'
|
|
|
import { type SubjectCatalogResult, querySubjectCatalog, querySubjectCatalogNoLogin } from '@/services/subject/catalog'
|
|
|
import { type SubjectCourseResult, getSubjectCoursePage, getSubjectCoursePageNoLogin } from '@/services/subject/course'
|
|
|
@@ -18,6 +18,8 @@ const dataList = ref<SubjectCatalogResult[]>([])
|
|
|
const catalog = ref<SubjectCatalogResult>()
|
|
|
const courseList = ref<SubjectCourseResult[]>()
|
|
|
const record = ref<any>()
|
|
|
+const cardsScrollView = ref<any>(null)
|
|
|
+const scrollLeft = ref<number>(0)
|
|
|
async function getDataList() {
|
|
|
console.log(user.token)
|
|
|
let res: SubjectCatalogResult[] = []
|
|
|
@@ -35,10 +37,14 @@ async function getDataList() {
|
|
|
console.log(res)
|
|
|
dataList.value = res || []
|
|
|
catalog.value = catalog.value || res?.[0] as SubjectCatalogResult
|
|
|
- handleSelect(catalog.value)
|
|
|
+ await getDetailList(catalog.value)
|
|
|
+ console.log('scrollLeft', scrollLeft.value)
|
|
|
+ // setTimeout(() => {
|
|
|
+ // cardsScrollView.value.scrollTo(scrollLeft.value, 0)
|
|
|
+ // }, 3000)
|
|
|
// courseList.value = res?.courseList || []
|
|
|
}
|
|
|
-onMounted(async () => {
|
|
|
+onShow(async () => {
|
|
|
isLoading.value = true
|
|
|
try {
|
|
|
await getDataList()
|
|
|
@@ -47,7 +53,6 @@ onMounted(async () => {
|
|
|
isLoading.value = false
|
|
|
}
|
|
|
})
|
|
|
-const cardsScrollView = ref<any>(null)
|
|
|
|
|
|
function handleDetail(item: SubjectCourseResult) {
|
|
|
if ((!item.trialPlay && !item.payFlag) || !item.platFormLock || item.studyUnitLock) return
|
|
|
@@ -65,11 +70,13 @@ function handleDetail(item: SubjectCourseResult) {
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
-// const scrollLeft = ref<any>(0)
|
|
|
async function handleSelect(val: SubjectCatalogResult) {
|
|
|
catalog.value = val
|
|
|
visible.value = false
|
|
|
- // courseList.value = []
|
|
|
+ await getDetailList(val)
|
|
|
+ cardsScrollView.value.scrollTo(0, 0)
|
|
|
+}
|
|
|
+async function getDetailList(val: SubjectCatalogResult) {
|
|
|
let res: GetPage<SubjectCourseResult> = {
|
|
|
total: 0,
|
|
|
rows: [],
|
|
|
@@ -86,50 +93,13 @@ async function handleSelect(val: SubjectCatalogResult) {
|
|
|
catalogId: val.id, pageSize: 20
|
|
|
})
|
|
|
}
|
|
|
- courseList.value = res.rows || []
|
|
|
- cardsScrollView.value.scrollTo({
|
|
|
- left: 0, // 减去顶部偏移
|
|
|
- animated: true
|
|
|
- })
|
|
|
- // uni.createSelectorQuery().select(`.category-${val.id}`).boundingClientRect().exec(async (rect) => {
|
|
|
- // if (cardsScrollView.value && rect[0]) {
|
|
|
- // cardsScrollView.value.scrollTo({
|
|
|
- // left: scrollLeft.value + rect[0].left - dict.getWindowHeight() / 2, // 减去顶部偏移
|
|
|
- // animated: true
|
|
|
- // })
|
|
|
- // }
|
|
|
- // })
|
|
|
+ courseList.value = res.rows as SubjectCourseResult[]
|
|
|
}
|
|
|
-// const debouncedOnScroll = debounce(async () => {
|
|
|
-// if(isScrolling.value){
|
|
|
-// return
|
|
|
-// }
|
|
|
-// dataList.value.forEach(async (category) => {
|
|
|
-// const selector = `.category-${category.id}`
|
|
|
-// await uni.createSelectorQuery().selectAll(selector).boundingClientRect().exec((rects) => {
|
|
|
-// for (const rect of rects[0]) {
|
|
|
-// if (rect.left <= (dict.getWindowHeight() / 2)&&rect.left>0) {
|
|
|
-// catalog.value = category
|
|
|
-// return
|
|
|
-// }
|
|
|
-// }
|
|
|
-// })
|
|
|
-// })
|
|
|
-// }, 300)
|
|
|
-// function debouncedOnScroll(e: any) {
|
|
|
-// scrollLeft.value = e.detail.scrollLeft
|
|
|
-// dataList.value.forEach(async (category) => {
|
|
|
-// const selector = `.category-${category.id}`
|
|
|
-// await uni.createSelectorQuery().selectAll(selector).boundingClientRect().exec((rects) => {
|
|
|
-// for (const rect of rects[0]) {
|
|
|
-// if (rect.left <= (dict.getWindowHeight() / 2) && rect.left > 0) {
|
|
|
-// catalog.value = category
|
|
|
-// return
|
|
|
-// }
|
|
|
-// }
|
|
|
-// })
|
|
|
-// })
|
|
|
-// }
|
|
|
+function handleScrollEnd(e: any) {
|
|
|
+ console.log('scrollend', e)
|
|
|
+ scrollLeft.value = e.detail.scrollLeft
|
|
|
+}
|
|
|
+
|
|
|
function handleClose(val: boolean) {
|
|
|
if (val) {
|
|
|
getDataList()
|
|
|
@@ -155,7 +125,8 @@ function handleClose(val: boolean) {
|
|
|
<cl-icon name="arrow-left-right-line" color="primary"></cl-icon>
|
|
|
</view>
|
|
|
<view class="boxs">
|
|
|
- <scroll-view class="scroll-view_H" direction="horizontal" :show-scrollbar="false" ref="cardsScrollView">
|
|
|
+ <scroll-view class="scroll-view_H" direction="horizontal" :show-scrollbar="false" ref="cardsScrollView"
|
|
|
+ @dragend="handleScrollEnd">
|
|
|
<view class="scroll-view-item_H bg-[white]" v-for="course in courseList || []" :key="course.id"
|
|
|
@tap="handleDetail(course)">
|
|
|
<cl-image lazy-load :src="course?.ossIconPath" mode="scaleToFill"
|
