Retired/pages/mine/history.vue

<template>
	<!-- 新鲜事页/话题分类 -->
	<view class="news-topic-cate">

		<!-- 标签 -->
		<u-sticky bgColor="#fff">
			<u-tabs class="wrap-card" ref="tabs" @change="changeTab" :list="typeList" :current="tabIndex"
				lineColor="#3c9cff" keyName='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: {
					org_id: getApp().globalData.org_id,
					type: '',
					group_id: '',
					page: 1,
					limit: 10,
				},
				// groupParams: {
				// 	type: "",
				// 	org_id: getApp().globalData.org_id,
				// },
				// groupList: [],
				assetList: [],
				typeList: [{
						type: 1,
						name: '招聘'
					},
					{
						type: 2,
						name: '技能'
					},
					{
						type: 3,
						name: '课程'
					}
				],
				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 = this.typeList[0].type
			// this.groupParams.type = this.typeList[0].type
			// this.getGroupList()
			this.getLists()
		},
		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.type = item.type
				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>