225 lines
4.8 KiB
Vue
225 lines
4.8 KiB
Vue
<template>
|
||
<!-- 新鲜事页/话题分类 -->
|
||
<view class="news-topic-cate">
|
||
<u-navbar placeholder>
|
||
<u-icon slot="left" @click="nav" name="arrow-left" color="#000000" size="22"></u-icon>
|
||
<view slot="center" style="margin-right: 100rpx;">
|
||
<u-search v-model="queryParams.asset_name" placeholder="搜索您想要的内容" @search='search'
|
||
:showAction="false"></u-search>
|
||
</view>
|
||
</u-navbar>
|
||
<!-- 标签 -->
|
||
<u-sticky customNavHeight='88px' bgColor="#fff">
|
||
<u-tabs class="wrap-card" ref="tabs" @change="changeTab" :list="groupList" :current="tabIndex"
|
||
lineColor="#3c9cff" keyName='group_name' :activeStyle="{color:'#3c9cff'}"
|
||
:inactiveStyle="{color:'#909399'}" lineWidth="30" :scrollable="false">
|
||
</u-tabs>
|
||
</u-sticky>
|
||
<!-- 图文列表 -->
|
||
<!-- 有内容 -->
|
||
<view v-if="assetList.length > 0">
|
||
<topic-list @click.native="goTopicDetail(item1)" :item="item1" v-for="(item1,index1) in assetList"
|
||
:key="index1"></topic-list>
|
||
<u-loadmore :status="status"></u-loadmore>
|
||
</view>
|
||
<!-- 无内容 -->
|
||
<view v-else>
|
||
<view class="default-img">
|
||
<image style='width: 400rpx;height: 200rpx' src="../../static/img/demo/default-img.png" mode="">
|
||
</image>
|
||
<text class="desc">暂无内容，去其他的看看吧</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
topicList
|
||
} from "@/utils/data/data.js"
|
||
import TopicList from "@/pages/news/cpns/topic-lists.vue"
|
||
import {
|
||
groupList,
|
||
assetList,
|
||
assetInfo
|
||
} from '@/api/train.js'
|
||
export default {
|
||
components: {
|
||
TopicList
|
||
},
|
||
data() {
|
||
return {
|
||
// 标签栏
|
||
tabIndex: 0,
|
||
queryParams: {
|
||
asset_name: "",
|
||
org_id: getApp().globalData.org_id,
|
||
type: '',
|
||
group_id: '',
|
||
page: 1,
|
||
limit: 10,
|
||
},
|
||
groupParams: {
|
||
type: "",
|
||
org_id: getApp().globalData.org_id,
|
||
},
|
||
groupList: [],
|
||
assetList: [],
|
||
count: 0,
|
||
status: 'loadmore',
|
||
}
|
||
},
|
||
onReachBottom() {
|
||
if (this.assetList.length >= that.count) {
|
||
this.status = 'nomore';
|
||
return
|
||
}
|
||
this.page++
|
||
this.status = 'loading';
|
||
this.getList()
|
||
|
||
},
|
||
onLoad(options) {
|
||
this.queryParams.type = options.type
|
||
this.groupParams.type = options.type
|
||
this.getGroupList()
|
||
},
|
||
methods: {
|
||
getGroupList() {
|
||
var that = this
|
||
groupList(that.groupParams).then(res => {
|
||
that.groupList = res.data
|
||
that.queryParams.group_id = res.data[0].group_id
|
||
that.getLists()
|
||
})
|
||
},
|
||
|
||
async getLists() {
|
||
var that = this
|
||
try {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
var res = await assetList(that.queryParams)
|
||
uni.hideLoading()
|
||
if (res.code == 0) {
|
||
if (res.data.length < that.queryParams.limit) {
|
||
that.status = 'nomore'
|
||
}
|
||
that.assetList = that.assetList.concat(res.data)
|
||
that.count = res.count
|
||
}
|
||
|
||
} catch (err) {
|
||
uni.showToast({
|
||
title: err.msg,
|
||
icon: 'none'
|
||
})
|
||
uni.hideLoading()
|
||
}
|
||
},
|
||
getPdfInfo(item) {
|
||
// pdf文档
|
||
uni.showLoading({
|
||
title: '加载文档中..'
|
||
})
|
||
assetInfo({
|
||
id: item.asset_id
|
||
}).then(res => {
|
||
uni.downloadFile({
|
||
url: res.data.pdf_url,
|
||
success: function(res) {
|
||
uni.openDocument({
|
||
filePath: res.tempFilePath,
|
||
fileType: 'pdf',
|
||
showMenu: true,
|
||
success: function(res) {
|
||
uni.hideLoading()
|
||
},
|
||
fail: function(err) {
|
||
uni.hideLoading()
|
||
}
|
||
});
|
||
},
|
||
complete: function(r) {
|
||
uni.hideLoading()
|
||
}
|
||
});
|
||
})
|
||
},
|
||
|
||
goTopicDetail(item) {
|
||
console.log(item,'item');
|
||
switch (item.type) {
|
||
case 1:
|
||
uni.navigateTo({
|
||
url: '/pages/home/detail?assets_id=' + item.asset_id
|
||
})
|
||
break;
|
||
case 2:
|
||
this.getPdfInfo(item)
|
||
break;
|
||
case 3:
|
||
// 课程
|
||
uni.navigateTo({
|
||
url: '/pages/news/course?assets_id=' + item.asset_id
|
||
})
|
||
break;
|
||
default:
|
||
break;
|
||
}
|
||
|
||
|
||
},
|
||
|
||
// tab栏切换
|
||
changeTab(item) {
|
||
this.tabIndex = item.index
|
||
this.swiperIndex = item.index
|
||
this.page = 1
|
||
this.assetList = []
|
||
this.queryParams.group_id = item.group_id
|
||
this.getLists()
|
||
},
|
||
nav() {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},
|
||
search() {
|
||
this.page = 1
|
||
this.assetList = []
|
||
this.getLists()
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
background-color: #f7f8ff;
|
||
}
|
||
|
||
.news-topic-cate {
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: calc(100vh - var(--window-top));
|
||
width: 100%;
|
||
}
|
||
|
||
.default-img {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-top: 350rpx;
|
||
|
||
.desc {
|
||
font-family: PingFang SC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #595959;
|
||
margin-top: 30rpx;
|
||
}
|
||
}
|
||
</style> |