|
@@ -0,0 +1,248 @@
|
|
|
|
+<template>
|
|
|
|
+ <div id="partyStudy" class="app">
|
|
|
|
+ <van-sticky :offset-top="0">
|
|
|
|
+ <van-nav-bar :title="dataInfo.name" left-arrow @click-left="goBack" />
|
|
|
|
+ </van-sticky>
|
|
|
|
+ <van-tabs v-model="active">
|
|
|
|
+ <van-tab title="理论创新">
|
|
|
|
+ <van-pull-refresh
|
|
|
|
+ v-model="isLoadingTextList"
|
|
|
|
+ @refresh="onRefreshTextList"
|
|
|
|
+ >
|
|
|
|
+ <van-list
|
|
|
|
+ v-if="textList.length"
|
|
|
|
+ v-model="loadingTextList"
|
|
|
|
+ :finished="finishedTextList"
|
|
|
|
+ offset="10"
|
|
|
|
+ loading-text="加载中"
|
|
|
|
+ finished-text="没有更多了"
|
|
|
|
+ @load="
|
|
|
|
+ () => getTextList({ lastId: textList[textList.length - 1].id })
|
|
|
|
+ "
|
|
|
|
+ >
|
|
|
|
+ <div
|
|
|
|
+ v-for="item in textList"
|
|
|
|
+ :key="'text' + item.id"
|
|
|
|
+ @click="() => toUrl(item)"
|
|
|
|
+ >
|
|
|
|
+ <keep-alive>
|
|
|
|
+ <component :is="item.assemblyName" :item="item"></component>
|
|
|
|
+ </keep-alive>
|
|
|
|
+ </div>
|
|
|
|
+ </van-list>
|
|
|
|
+ </van-pull-refresh>
|
|
|
|
+ </van-tab>
|
|
|
|
+ <van-tab title="视频学习">
|
|
|
|
+ <van-pull-refresh
|
|
|
|
+ v-model="isLoadingVideoList"
|
|
|
|
+ @refresh="onRefreshVideoList"
|
|
|
|
+ >
|
|
|
|
+ <van-list
|
|
|
|
+ v-if="videoList.length"
|
|
|
|
+ v-model="loadingVideoList"
|
|
|
|
+ :finished="finishedVideoList"
|
|
|
|
+ offset="10"
|
|
|
|
+ loading-text="加载中"
|
|
|
|
+ finished-text="没有更多了"
|
|
|
|
+ @load="
|
|
|
|
+ () => getVideoList({ lastId: videoList[videoList.length - 1].id })
|
|
|
|
+ "
|
|
|
|
+ >
|
|
|
|
+ <div
|
|
|
|
+ v-for="item in videoList"
|
|
|
|
+ :key="'video' + item.id"
|
|
|
|
+ @click="() => toUrl(item)"
|
|
|
|
+ >
|
|
|
|
+ <keep-alive>
|
|
|
|
+ <component :is="item.assemblyName" :item="item"></component>
|
|
|
|
+ </keep-alive>
|
|
|
|
+ </div>
|
|
|
|
+ </van-list>
|
|
|
|
+ </van-pull-refresh>
|
|
|
|
+ </van-tab>
|
|
|
|
+ <van-tab title="有声读物">
|
|
|
|
+ <van-pull-refresh
|
|
|
|
+ v-model="isLoadingAudioList"
|
|
|
|
+ @refresh="onRefreshAudiolList"
|
|
|
|
+ >
|
|
|
|
+ <van-list
|
|
|
|
+ v-if="audioList.length"
|
|
|
|
+ v-model="loadingAudioList"
|
|
|
|
+ :finished="finishedAudioList"
|
|
|
|
+ offset="10"
|
|
|
|
+ loading-text="加载中"
|
|
|
|
+ finished-text="没有更多了"
|
|
|
|
+ @load="
|
|
|
|
+ () => getAudioList({ lastId: audioList[audioList.length - 1].id })
|
|
|
|
+ "
|
|
|
|
+ >
|
|
|
|
+ <div
|
|
|
|
+ v-for="item in audioList"
|
|
|
|
+ :key="'audio' + item.id"
|
|
|
|
+ @click="() => toUrl(item)"
|
|
|
|
+ >
|
|
|
|
+ <keep-alive>
|
|
|
|
+ <component :is="item.assemblyName" :item="item"></component>
|
|
|
|
+ </keep-alive>
|
|
|
|
+ </div>
|
|
|
|
+ </van-list>
|
|
|
|
+ </van-pull-refresh>
|
|
|
|
+ </van-tab>
|
|
|
|
+ </van-tabs>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import {
|
|
|
|
+ PullRefresh as vanPullRefresh,
|
|
|
|
+ NavBar as vanNavBar,
|
|
|
|
+ Sticky as vanSticky,
|
|
|
|
+ Tabs as vanTabs,
|
|
|
|
+ List as vanList,
|
|
|
|
+ Tab as vanTab
|
|
|
|
+} from "vant";
|
|
|
|
+import "vant/lib/pull-refresh/style";
|
|
|
|
+import "vant/lib/nav-bar/style";
|
|
|
|
+import "vant/lib/sticky/style";
|
|
|
|
+import "vant/lib/tabs/style";
|
|
|
|
+import "vant/lib/list/style";
|
|
|
|
+import "vant/lib/tab/style";
|
|
|
|
+import listItemBig from "../../components/ListItem/ListItemBig";
|
|
|
|
+import listItem from "../../components/ListItem/ListItem";
|
|
|
|
+import { currentUrlToParams } from "@/utils/common.js";
|
|
|
|
+import { articleList } from "@/api/article/article.js";
|
|
|
|
+const baseData = {
|
|
|
|
+ video: 8,
|
|
|
|
+ audio: 13,
|
|
|
|
+ text: 14
|
|
|
|
+};
|
|
|
|
+export default {
|
|
|
|
+ name: "app",
|
|
|
|
+ data: function() {
|
|
|
|
+ return {
|
|
|
|
+ isLoadingTextList: false,
|
|
|
|
+ loadingTextList: false,
|
|
|
|
+ finishedTextList: false,
|
|
|
|
+ isLoadingVideoList: false,
|
|
|
|
+ loadingVideoList: false,
|
|
|
|
+ isLoadingAudioList: false,
|
|
|
|
+ loadingAudioList: false,
|
|
|
|
+ finishedAudioList: false,
|
|
|
|
+ finishedVideoList: false,
|
|
|
|
+ active: "理论创新",
|
|
|
|
+ dataInfo: {},
|
|
|
|
+ textList: [],
|
|
|
|
+ videoList: [],
|
|
|
|
+ audioList: []
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ goBack() {
|
|
|
|
+ history.go(-1);
|
|
|
|
+ },
|
|
|
|
+ toUrl(item) {
|
|
|
|
+ let url =
|
|
|
|
+ item.videoFlag === "V"
|
|
|
|
+ ? "videoDetail"
|
|
|
|
+ : item.videoFlag === "A"
|
|
|
|
+ ? "newsDetail"
|
|
|
|
+ : "audioDetail";
|
|
|
|
+ url += ".html?id=" + item.id;
|
|
|
|
+ window.parent
|
|
|
|
+ ? (window.parent.location.href = url)
|
|
|
|
+ : (window.location.href = url);
|
|
|
|
+ },
|
|
|
|
+ onRefreshTextList() {
|
|
|
|
+ this.textList = [];
|
|
|
|
+ this.isLoadingTextList = true;
|
|
|
|
+ this.finishedTextList = false;
|
|
|
|
+ this.getTextList();
|
|
|
|
+ },
|
|
|
|
+ onRefreshVideoList() {
|
|
|
|
+ this.videoList = [];
|
|
|
|
+ this.isLoadingVideoList = true;
|
|
|
|
+ this.finishedVideoList = false;
|
|
|
|
+ this.getVideoList();
|
|
|
|
+ },
|
|
|
|
+ onRefreshAudiolList() {
|
|
|
|
+ this.audioList = [];
|
|
|
|
+ this.isLoadingAudioList = true;
|
|
|
|
+ this.finishedAudioList = false;
|
|
|
|
+ this.getAudioList();
|
|
|
|
+ },
|
|
|
|
+ formData(objData) {
|
|
|
|
+ let video = Math.random() > 0.5 ? "listItemBig" : "listItem";
|
|
|
|
+ if (objData.videoFlag === "V") {
|
|
|
|
+ video = "listItemBig";
|
|
|
|
+ }
|
|
|
|
+ return {
|
|
|
|
+ id: objData.id,
|
|
|
|
+ url: objData.imgUrl,
|
|
|
|
+ title: objData.title,
|
|
|
|
+ orisource: objData.origSource,
|
|
|
|
+ releaseTime: objData.publishTime,
|
|
|
|
+ read: objData.read,
|
|
|
|
+ assemblyName: video,
|
|
|
|
+ videoFlag: objData.videoFlag,
|
|
|
|
+ subTitle: objData.normalizedContent
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ newList(list) {
|
|
|
|
+ const viewList = [];
|
|
|
|
+ list.map(v => {
|
|
|
|
+ viewList.push(this.formData(v));
|
|
|
|
+ });
|
|
|
|
+ return viewList;
|
|
|
|
+ },
|
|
|
|
+ getVideoList(params) {
|
|
|
|
+ articleList(params || {}, baseData.video).then(res => {
|
|
|
|
+ const list = this.newList(res || []);
|
|
|
|
+ this.videoList = [...this.videoList, ...list];
|
|
|
|
+ this.isLoadingVideoList = false;
|
|
|
|
+ this.loadingVideoList = false;
|
|
|
|
+ if ((res && res.length === 0) || !res) this.finishedVideoList = true;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ getAudioList(params) {
|
|
|
|
+ articleList(params || {}, baseData.audio).then(res => {
|
|
|
|
+ const list = this.newList(res || []);
|
|
|
|
+ this.audioList = [...this.audioList, ...list];
|
|
|
|
+ this.isLoadingAudioList = false;
|
|
|
|
+ this.loadingAudioList = false;
|
|
|
|
+ if ((res && res.length === 0) || !res) this.finishedAudioList = true;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ getTextList(params) {
|
|
|
|
+ articleList(params || {}, baseData.text).then(res => {
|
|
|
|
+ console.log(res);
|
|
|
|
+ const list = this.newList(res || []);
|
|
|
|
+ this.textList = [...this.textList, ...list];
|
|
|
|
+ this.isLoadingTextList = false;
|
|
|
|
+ this.loadingTextList = false;
|
|
|
|
+ if ((res && res.length === 0) || !res) this.finishedTextList = true;
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ this.dataInfo = currentUrlToParams();
|
|
|
|
+ this.getAudioList();
|
|
|
|
+ this.getTextList();
|
|
|
|
+ this.getVideoList();
|
|
|
|
+ },
|
|
|
|
+ beforeDestroy: function() {},
|
|
|
|
+ components: {
|
|
|
|
+ vanPullRefresh,
|
|
|
|
+ listItemBig,
|
|
|
|
+ vanNavBar,
|
|
|
|
+ vanSticky,
|
|
|
|
+ listItem,
|
|
|
|
+ vanList,
|
|
|
|
+ vanTabs,
|
|
|
|
+ vanTab
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+<style lang="scss">
|
|
|
|
+.app {
|
|
|
|
+}
|
|
|
|
+</style>
|