diff --git a/api/config.ts b/api/config.ts index 1805be1..f437afb 100644 --- a/api/config.ts +++ b/api/config.ts @@ -7,7 +7,7 @@ export const ENV = process.env.NODE_ENV || 'development'; */ const BASE_URL_MAP = { development: { - //MAIN: 'http://192.168.110.100:9300/pb/', // 张川川 + // MAIN: 'http://192.168.110.100:9300/pb/', // 张川川 MAIN: 'https://global.nuttyreading.com/', // 线上 // PAYMENT: 'https://dev-pay.example.com', // 暂时用不到 // CDN: 'https://cdn-dev.example.com', // 暂时用不到 diff --git a/api/modules/common.ts b/api/modules/common.ts index 28837c8..f8860ae 100644 --- a/api/modules/common.ts +++ b/api/modules/common.ts @@ -1,11 +1,9 @@ // api/modules/common.ts -import { mainClient } from '@/api/clients/main' +import { mainClient, skeletonClient } from '@/api/clients' import type { IApiResponse } from '@/api/types' import type { IAgreement } from '@/types/user' import { useUserStore } from '@/stores/user' - - export const commonApi = { /** * 发送邮箱验证码 @@ -40,7 +38,7 @@ export const commonApi = { */ getMessageList(isBook: number, isMedical: number, isSociology: number) { const userStore = useUserStore() - return mainClient.request({ + return skeletonClient.request({ url: userStore.token ? 'common/message/listByPage' : '/visitor/listByPage', method: 'POST', data: { isBook, isMedical, isSociology } diff --git a/api/modules/course.ts b/api/modules/course.ts index 5269bff..19752a1 100644 --- a/api/modules/course.ts +++ b/api/modules/course.ts @@ -36,7 +36,7 @@ export const courseApi = { * @returns 观看记录列表 */ getUserLateCourseList() { - return mainClient.request({ + return skeletonClient.request({ url: 'medical/home/getUserLateCourseList', method: 'POST', data: {} @@ -56,7 +56,7 @@ export const courseApi = { limit: number }) { const userStore = useUserStore() - return mainClient.request({ + return skeletonClient.request({ url: userStore.token ? 'medical/home/getMarketCourseList' : 'visitor/getMarketCourseList', method: 'POST', data diff --git a/api/modules/cousre_subject_classification.ts b/api/modules/cousre_subject_classification.ts index 59a5500..59d543e 100644 --- a/api/modules/cousre_subject_classification.ts +++ b/api/modules/cousre_subject_classification.ts @@ -8,6 +8,7 @@ import type { ICourseMedicalLabelsResponse } from '@/types/course' import { useUserStore } from '@/stores/user' +import { skeletonClient } from '../clients' const client = createRequestClient({ baseURL: SERVICE_MAP.MAIN }) @@ -36,7 +37,7 @@ export const courseSubjectClassificationApi = { * @returns 分类数据 */ getCourseSoulTree() { - return client.request({ + return skeletonClient.request({ url: 'psyche/home/getPsycheLabels', method: 'POST', data: { id: 0 } @@ -49,7 +50,7 @@ export const courseSubjectClassificationApi = { * @returns 分类数据 */ getCourseSociologyTree() { - return client.request({ + return skeletonClient.request({ url: 'sociology/home/getSociologyLabels', method: 'POST', data: { id: 0 } diff --git a/components/Skeleton/Skeleton.vue b/components/Skeleton/Skeleton.vue index f841ca2..16bb27c 100644 --- a/components/Skeleton/Skeleton.vue +++ b/components/Skeleton/Skeleton.vue @@ -19,6 +19,9 @@ import LineList from './templates/LineList.vue' import BookCard from './templates/BookCard.vue' import ImageCard from './templates/ImageCard.vue' import BookInfo from './templates/BookInfo.vue' +import Menu from './templates/Menu.vue' + + // 注册组件 const components = { @@ -28,6 +31,7 @@ const components = { 'image-card': ImageCard, 'book-card': BookCard, 'book-info': BookInfo, + 'menu': Menu } type RequestFn = () => Promise diff --git a/components/Skeleton/templates/Menu.vue b/components/Skeleton/templates/Menu.vue new file mode 100644 index 0000000..16d64ee --- /dev/null +++ b/components/Skeleton/templates/Menu.vue @@ -0,0 +1,33 @@ + + + + + \ No newline at end of file diff --git a/pages/course/index.vue b/pages/course/index.vue index 096a5cb..829ac1e 100644 --- a/pages/course/index.vue +++ b/pages/course/index.vue @@ -31,80 +31,87 @@ >{{ item }} - - - + + + + + + + @@ -143,7 +150,7 @@ - + {{ $t('courseHome.tryListen') }} - - - - + + @@ -236,34 +253,18 @@ const currentItem = ref(null) // 当前选中的一级 // 学科数据 const firstLevelCategories = ref(['医学', '心理学', '国学']) -const selectedFirstLevel = ref('医学') // 当前选中的一级分类索引 -/** - * 学科点击处理 - */ -const handleFirstLevelClick = (item: string) => { - getPrompt() - if(!uni.getStorageSync('token')) return - selectedFirstLevel.value = item - switch (item) { - case '医学': - getMedicalTags() - break - case '心理学': - getSoulCateList() - break - case '国学': - getSociologyCateList() - break - } - -} +const selectedFirstLevel = ref('医学') // 当前选中的一级分类索引 + /** * 医学 * 获取课程分类数据 */ -const getMedicalTags = async () => { +const medicineMenuSkeletonRef = ref() +const getMedicineMenus = () => { sbuMedicalTagsList.value = [] - const res = await courseSubjectClassificationApi.getCourseMedicalTree() + return courseSubjectClassificationApi.getCourseMedicalTree() +} +const getMedicineMenusSuccess = (res: any) => { if (res && res.code === 0) { if (res.labels && res.labels.length > 0) { curseTagList.value = res.labels @@ -304,27 +305,46 @@ const curseClick = (item: IMedicalTag, index: number) => { } /** - * 心理学 + * 菜单 * 获取课程分类数据 */ -const soulCateList = ref([]) -const getSoulCateList = async () => { - const res = await courseSubjectClassificationApi.getCourseSoulTree() - if (res.labels&&res.labels.length>0) { - soulCateList.value = res.labels; +const menuSkeletonRef = ref() +const getMenus = () => { + switch (selectedFirstLevel.value) { + // case '医学': + // return getMedicalTags() + case '心理学': + return courseSubjectClassificationApi.getCourseSoulTree() + case '国学': + return courseSubjectClassificationApi.getCourseSociologyTree() } } /** - * 国学 - * 获取课程分类数据 + * 学科点击处理 */ -const sociologyCateList = ref([]) -const getSociologyCateList = async () => { - const res = await courseSubjectClassificationApi.getCourseSociologyTree() - if (res.labels&&res.labels.length>0) { - sociologyCateList.value = res.labels; +const handleFirstLevelClick = (item: string) => { + getPrompt() + if(!uni.getStorageSync('token')) return + selectedFirstLevel.value = item + if (item === '医学') { + medicineMenuSkeletonRef.value.reload() + } else { + menuSkeletonRef.value?.reload() } + + // switch (item) { + // case '医学': + // getMedicalTags() + // break + // case '心理学': + // getSoulCateList() + // break + // case '国学': + // getSociologyCateList() + // break + // } + } /** @@ -399,24 +419,10 @@ const newsClick = (item: INews) => { } // 精彩试听 -const tryListenList = ref([]) // 试听课程列表 /** * 获取试听课程列表 */ -const getTryListenList = async () => { - const res = await courseApi.getMarketCourseList({ - page: 1, - limit: 6, - id: 1 - }) - if (res && res.code === 0) { - if (res.courseList && res.courseList.records && res.courseList.records.length > 0) { - tryListenList.value = res.courseList.records - } else { - tryListenList.value = [] - } - } -} +const getTryListenList = () => courseApi.getMarketCourseList({ page: 1, limit: 6, id: 1 }) /** * 登录提示语 @@ -444,8 +450,7 @@ const getTryListenList = async () => { const requestAll = async () => { if(uni.getStorageSync('token')){ getLearnCourse() - } - getMedicalTags() + } getTryListenList() getNewsList() } @@ -472,16 +477,19 @@ onMounted(() => { */ onShow(() => { // 检查是否有固定的分类选择状态 - const fixed = uni.getStorageSync('fixed') - if (fixed && currentItem.value) { - curseClick(currentItem.value, currentIndex.value) - } else { - currentIndex.value = 0 - currentItem.value = null - } + // const fixed = uni.getStorageSync('fixed') + // if (fixed && currentItem.value) { + // curseClick(currentItem.value, currentIndex.value) + // } else { + // currentIndex.value = 0 + // currentItem.value = null + // } // 刷新数据 - requestAll() + // requestAll() + if(userStore.token){ + getLearnCourse() + } }) /** @@ -673,42 +681,47 @@ $border-color: #eeeeee; box-shadow: 0rpx 0rpx 6rpx 0rpx #f9f6ea; border-radius: 10rpx; margin: 0 10rpx; + + display: flex; + align-items: center; + justify-content: space-around; + .cate_item_box { + width: 20%; + padding: 40rpx 0 30rpx; + text-align: center; - .cate_list { - display: flex; - align-items: center; - justify-content: space-around; + .cate_item_border { + width: 60rpx; + height: 60rpx; + background-size: 100% 100%; + background-image: url("@/static/soul/cate_bg.png"); + border-radius: 4rpx; + display: flex; + align-items: center; + justify-content: center; + margin: 0 auto; - .cate_item_box { - width: 20%; - padding: 40rpx 0 30rpx; + image { + width: 46rpx; + height: 46rpx; + } + } + + .cate_item_name { + margin-top: 15rpx; + font-size: 24rpx; + line-height: 34rpx; text-align: center; + color: #fff; + font-weight: bold; + } - .cate_item_border { - width: 60rpx; - height: 60rpx; - background-size: 100% 100%; - background-image: url("@/static/soul/cate_bg.png"); - border-radius: 4rpx; - display: flex; - align-items: center; - justify-content: center; - margin: 0 auto; - - image { - width: 46rpx; - height: 46rpx; - } - } - - .cate_item_name { - margin-top: 15rpx; - font-size: 24rpx; - line-height: 34rpx; - text-align: center; - color: #fff; - font-weight: bold; - } + .child-menu { + display: none; + background-color: #000; + box-shadow: 0 4rpx 12rpx rgba(51, 97, 165, 0.08); + border-radius: 0 0 20rpx 20rpx; + padding: 10rpx 0; } } } @@ -890,7 +903,6 @@ $border-color: #eeeeee; .learn { justify-content: space-between; - margin-top: 20rpx; flex-wrap: wrap; .item { @@ -917,6 +929,7 @@ $border-color: #eeeeee; .titleBox { align-items: center; + margin-bottom: 20rpx; image { width: 50rpx; diff --git a/pages/index.vue b/pages/index.vue new file mode 100644 index 0000000..ccfa04b --- /dev/null +++ b/pages/index.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/style/tailwind.css b/style/tailwind.css index e26e97b..89bafe6 100644 --- a/style/tailwind.css +++ b/style/tailwind.css @@ -217,18 +217,9 @@ .mt-2 { margin-top: calc(var(--spacing) * 2); } - .mt-2\! { - margin-top: calc(var(--spacing) * 2) !important; - } - .mt-2\.5\! { - margin-top: calc(var(--spacing) * 2.5) !important; - } .mt-3 { margin-top: calc(var(--spacing) * 3); } - .mt-3\! { - margin-top: calc(var(--spacing) * 3) !important; - } .mt-5 { margin-top: calc(var(--spacing) * 5); } @@ -238,27 +229,12 @@ .mt-20 { margin-top: calc(var(--spacing) * 20); } - .mt-20\! { - margin-top: calc(var(--spacing) * 20) !important; - } .mt-\[20rpx\]\! { margin-top: 20rpx !important; } - .mr-\[20rpx\] { - margin-right: 20rpx; - } - .mr-\[20rpx\]\! { - margin-right: 20rpx !important; - } .mb-1 { margin-bottom: calc(var(--spacing) * 1); } - .mb-1\! { - margin-bottom: calc(var(--spacing) * 1) !important; - } - .mb-1\.5\! { - margin-bottom: calc(var(--spacing) * 1.5) !important; - } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } @@ -283,12 +259,6 @@ .ml-2\.5\! { margin-left: calc(var(--spacing) * 2.5) !important; } - .ml-\[20rpx\] { - margin-left: 20rpx; - } - .ml-\[20rpx\]\! { - margin-left: 20rpx !important; - } .block { display: block; } @@ -362,9 +332,6 @@ .p-2 { padding: calc(var(--spacing) * 2); } - .p-2\.5 { - padding: calc(var(--spacing) * 2.5); - } .p-3 { padding: calc(var(--spacing) * 3); } @@ -374,9 +341,6 @@ .p-\[20rpx\] { padding: 20rpx; } - .p-\[20rpx\]\! { - padding: 20rpx !important; - } .p-\[30rpx\] { padding: 30rpx; } diff --git a/types/course.d.ts b/types/course.d.ts index e614cec..8d761ab 100644 --- a/types/course.d.ts +++ b/types/course.d.ts @@ -50,11 +50,6 @@ export interface IMarketCourseListResponse extends IApiResponse { } } -/** 消息列表响应 */ -export interface IMessageListResponse extends IApiResponse { - messages: INews[] // 消息列表 -} - /** 课程详情 */ export interface ICourseDetail { id: number