|
|
|
@ -1,9 +1,10 @@ |
|
|
|
|
<template> |
|
|
|
|
<BaseContainer class="learning" :fixedNav="false"> |
|
|
|
|
<NavBar v-if="scrollTop > 20" title="学习中心" :showBack="false" /> |
|
|
|
|
<view class="learning-box"> |
|
|
|
|
<view class="swiper-box"> |
|
|
|
|
<swiper class="custom-banner" indicator-dots autoplay @click="handleBannerClick" > |
|
|
|
|
<swiper-item v-for="(item, index) in banner" :key="index" :data-url="item.url" class="swiper-item"> |
|
|
|
|
<swiper-item v-for="(item, index) in learningData.banner" :key="index" :data-url="item.url" class="swiper-item"> |
|
|
|
|
<image :data-url="item.url" mode="aspectFill" :src="item.pic" :alt="item.title" /> |
|
|
|
|
</swiper-item> |
|
|
|
|
</swiper> |
|
|
|
@ -62,61 +63,55 @@ |
|
|
|
|
<view class="practice flex"> |
|
|
|
|
2021-2022英语四级考试真题 <text>开始练习</text> |
|
|
|
|
</view> |
|
|
|
|
<view class="tab-container"> |
|
|
|
|
<view v-if="learningData.recite && learningData.recite.length > 0" class="tab-container"> |
|
|
|
|
<view class="content-title"> |
|
|
|
|
刷题过关 |
|
|
|
|
背诵过关 |
|
|
|
|
<text class="more-content">更多 ></text> |
|
|
|
|
</view> |
|
|
|
|
<view class="flex tab-content"> |
|
|
|
|
<view :data-idx="index" class="tab-item" v-for="(item, index) in categoryList" :key="item.id" @click="handleCateClick(item)"> |
|
|
|
|
<image :src="item.pic" mode="aspectFill"></image> |
|
|
|
|
<view :data-idx="index" class="tab-item" v-for="(item, index) in learningData.recite" :key="item.id" @click="handleCateClick(item)"> |
|
|
|
|
<image :src="item.image" mode="aspectFill"></image> |
|
|
|
|
<view>{{ item.name }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<advert :img="'/static/frontend/learning-advert.png'" :height="140"/> |
|
|
|
|
</view> |
|
|
|
|
<advert :img="'/static/frontend/learning-advert.png'" :height="140"/> |
|
|
|
|
<view class="tab-container"> |
|
|
|
|
<view v-if="learningData.brush_questions && learningData.brush_questions.length > 0" class="tab-container"> |
|
|
|
|
<view class="content-title"> |
|
|
|
|
视频课 |
|
|
|
|
刷题过关 |
|
|
|
|
<text class="more-content">更多 ></text> |
|
|
|
|
</view> |
|
|
|
|
<view class="flex tab-content"> |
|
|
|
|
<view :data-idx="index" class="tab-item" v-for="(item, index) in categoryList" :key="item.id" @click="handleCateClick(item)"> |
|
|
|
|
<image :src="item.pic" mode="aspectFill"></image> |
|
|
|
|
<view :data-idx="index" class="tab-item" v-for="(item, index) in learningData.brush_questions" :key="item.id" @click="handleCateClick(item)"> |
|
|
|
|
<image :src="item.image" mode="aspectFill"></image> |
|
|
|
|
<view>{{ item.name }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<advert :img="'/static/frontend/learning-advert.png'" :height="140"/> |
|
|
|
|
</view> |
|
|
|
|
<advert :img="'/static/frontend/learning-advert.png'" :height="140"/> |
|
|
|
|
<template v-for="(item, index) in indexMenu"> |
|
|
|
|
<view v-if="specialData[item.key] && specialData[item.key].length > 0" :key="index" class="special-content"> |
|
|
|
|
<view v-if="learningData[item.key] && learningData[item.key].length > 0" :key="index" class="special-content"> |
|
|
|
|
<view class="content-title"> |
|
|
|
|
{{ item.menuName }} |
|
|
|
|
<text v-if="item.menuName !== '线下课堂'" class="more-content">更多 ></text> |
|
|
|
|
<text v-if="item.menuName !== '线下课堂'" class="more-content" @click="toMoreCourse(item.key)">更多 ></text> |
|
|
|
|
</view> |
|
|
|
|
<square-style-course v-if="item.menuName === '直播课'" :specialList="specialData[item.key]" @detail="handleSpecialClick"></square-style-course> |
|
|
|
|
<offline-style-course v-if="item.menuName === '线下课堂'" :specialList="specialData[item.key]" @detail="handleOfflineClick"></offline-style-course> |
|
|
|
|
<square-style-course v-if="item.menuName === '视频课'" :specialList="learningData[item.key]" @detail="handleSpecialClick"></square-style-course> |
|
|
|
|
<square-style-course v-if="item.menuName === '直播课'" :specialList="learningData[item.key]" @detail="handleSpecialClick"></square-style-course> |
|
|
|
|
<offline-style-course v-if="item.menuName === '线下课堂'" :specialList="learningData[item.key]"></offline-style-course> |
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
<view class="special-content"> |
|
|
|
|
<view class="content-title"> |
|
|
|
|
课程 |
|
|
|
|
<text class="more-content" @click="toMoreCourse">更多 ></text> |
|
|
|
|
</view> |
|
|
|
|
<square-style-course :specialList="specialList" @detail="handleSpecialClick"></square-style-course> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<!-- <message-box title="确认收货?" @submit="console.log('提交')"></message-box> --> |
|
|
|
|
</BaseContainer> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import { getGoodsCateList, getIndexData } from "@/api/store"; |
|
|
|
|
import { getSpecialIndexData, getSpecialList } from "@/api/special"; |
|
|
|
|
import { getLearningData } from '@/api/learning'; |
|
|
|
|
import Advert from '@/components/Advert/index.vue'; |
|
|
|
|
import SquareStyleCourse from '@/components/Course/squareStyleCourse.vue'; |
|
|
|
|
import OfflineStyleCourse from '@/components/Course/offlineStyleCourse.vue'; |
|
|
|
|
import MessageBox from '@/components/Message/index.vue'; |
|
|
|
|
import store from "@/store"; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
components: { |
|
|
|
@ -127,8 +122,6 @@ import MessageBox from '@/components/Message/index.vue'; |
|
|
|
|
}, |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
banner: [], |
|
|
|
|
categoryList: [], |
|
|
|
|
loading: false, |
|
|
|
|
myExam: { |
|
|
|
|
examName: '职业技能考试', |
|
|
|
@ -146,19 +139,33 @@ import MessageBox from '@/components/Message/index.vue'; |
|
|
|
|
currentRank: '--', |
|
|
|
|
}, |
|
|
|
|
indexMenu: [ |
|
|
|
|
{ menuName: '直播课', key: 'hot_course' }, |
|
|
|
|
{ menuName: '视频课', key: 'video' }, |
|
|
|
|
{ menuName: '直播课', key: 'live' }, |
|
|
|
|
{ menuName: '线下课堂', key: 'offline_courses' }, |
|
|
|
|
], |
|
|
|
|
specialData: [], |
|
|
|
|
specialList: [], |
|
|
|
|
learningData: {}, |
|
|
|
|
scrollTop: 0, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
position() { |
|
|
|
|
return store.getters.position; |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
watch: { |
|
|
|
|
myExam: { |
|
|
|
|
deep: true, |
|
|
|
|
handler() { |
|
|
|
|
this.getLearningData(); |
|
|
|
|
}, |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onLoad() { |
|
|
|
|
this.getGoodsCateList(); |
|
|
|
|
this.getIndexData(); |
|
|
|
|
this.getSpecialIndexData(); |
|
|
|
|
this.getSpecialList(); |
|
|
|
|
this.getLearningData(); |
|
|
|
|
}, |
|
|
|
|
onPageScroll(e) { |
|
|
|
|
this.scrollTop = e.scrollTop; |
|
|
|
|
}, |
|
|
|
|
onShareAppMessage() { |
|
|
|
|
return {}; |
|
|
|
|
}, |
|
|
|
@ -168,40 +175,16 @@ import MessageBox from '@/components/Message/index.vue'; |
|
|
|
|
mounted() { |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
async getIndexData() { |
|
|
|
|
try { |
|
|
|
|
const { data } = await getIndexData(); |
|
|
|
|
this.banner = data; |
|
|
|
|
if(!this.color_one && !this.color_two){ |
|
|
|
|
this.color_one = this.banner[0].color_one; |
|
|
|
|
this.color_two = this.banner[0].color_two; |
|
|
|
|
} |
|
|
|
|
} catch (err) { } |
|
|
|
|
}, |
|
|
|
|
async getSpecialIndexData() { |
|
|
|
|
try { |
|
|
|
|
const { data, code, msg } = await getSpecialIndexData(); |
|
|
|
|
|
|
|
|
|
this.loading = false; |
|
|
|
|
if (code != 200) { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: msg, |
|
|
|
|
}); |
|
|
|
|
} else { |
|
|
|
|
console.log(data, 646); |
|
|
|
|
const { banner, category_list } = data; |
|
|
|
|
this.bannerList = banner; |
|
|
|
|
this.gradeCate = category_list; |
|
|
|
|
// .concat([{ |
|
|
|
|
// grade_id: 0, |
|
|
|
|
// name: '全部分类', |
|
|
|
|
// }]); |
|
|
|
|
this.specialData = { ...data }; |
|
|
|
|
console.log(this.gradeCate); |
|
|
|
|
} |
|
|
|
|
} catch (err) { |
|
|
|
|
this.loading = false; |
|
|
|
|
console.log(err); |
|
|
|
|
async getLearningData() { |
|
|
|
|
try { |
|
|
|
|
const { data } = await getLearningData({ |
|
|
|
|
subject_id: this.myExam.subject_id, |
|
|
|
|
city: this.position, |
|
|
|
|
}); |
|
|
|
|
console.log(data); |
|
|
|
|
this.learningData = { ...data }; |
|
|
|
|
} catch (err) { |
|
|
|
|
console.log(err); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 点击轮播图 |
|
|
|
@ -212,66 +195,28 @@ import MessageBox from '@/components/Message/index.vue'; |
|
|
|
|
url: e.target.dataset.url, |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 获取分类 |
|
|
|
|
async getGoodsCateList() { |
|
|
|
|
try { |
|
|
|
|
const { data } = await getGoodsCateList(); |
|
|
|
|
console.log(data); |
|
|
|
|
this.categoryList = data.category_list.concat([ |
|
|
|
|
{ |
|
|
|
|
name: "全部", |
|
|
|
|
id: 0, |
|
|
|
|
}, |
|
|
|
|
]); |
|
|
|
|
} catch (err) { } |
|
|
|
|
}, |
|
|
|
|
async getSpecialList() { |
|
|
|
|
try { |
|
|
|
|
const { data } = await getSpecialList({ |
|
|
|
|
grade_id: this.myExam.grade_id, |
|
|
|
|
subject_id: this.myExam.subject_id, |
|
|
|
|
page: 1, |
|
|
|
|
limit: 4, |
|
|
|
|
}); |
|
|
|
|
this.specialList = data; |
|
|
|
|
} catch (err) { |
|
|
|
|
console.log(err); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
this.loading = false; |
|
|
|
|
}, |
|
|
|
|
handleSpecialClick(item) { |
|
|
|
|
const url = item.is_light |
|
|
|
|
? '/pages/special/single_details?id=' + item.id |
|
|
|
|
: '/pages/special/details?id=' + item.id; |
|
|
|
|
|
|
|
|
|
// this.$util.checkLogin(() => { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url, |
|
|
|
|
}); |
|
|
|
|
// }, this.showLoginPage); |
|
|
|
|
}, |
|
|
|
|
handleOfflineClick(item) { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: `/pages/special/offline_details?id=${item.id}`, |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
checkRecord() { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: '/pages/learningCenter/clockRecord', |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
changeCate() { |
|
|
|
|
this.$util.checkLogin(() => { |
|
|
|
|
// this.$util.checkLogin(() => { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: '/pages/store/goodsCate?type=learning' |
|
|
|
|
}); |
|
|
|
|
}, true) |
|
|
|
|
// }, true) |
|
|
|
|
}, |
|
|
|
|
toMoreCourse() { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: `/pages/special/search?gradeId=${this.myExam.grade_id}&subjectId=${this.myExam.subject_id}` |
|
|
|
|
}) |
|
|
|
|
toMoreCourse(key) { |
|
|
|
|
if (key === 'offline_courses') { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: '/pages/activity/activity_list' |
|
|
|
|
}); |
|
|
|
|
} else { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: `/pages/special/search?gradeId=${this.myExam.grade_id}&subjectId=${this.myExam.subject_id}&specialType=${ key === 'live' ? 4 : 3}` |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|