TalentService-mobile/pages/activity/activityList.vue

<template>
	<view class="activity-list">
		<lwTopnav bgColor="#fff" lwColor="#000" :isShow="false" lwTitle="人才活动"></lwTopnav>
		<u-tabs style="position: fixed;width: 100%;" :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
		<scroll-view class="result-list" scroll-y>
			<u-empty marginTop="200" v-if="dataList==null||dataList.length===0" mode="list"></u-empty>
			<view style="margin-top: -30rpx;padding-top: 30rpx;" v-else>
				<Dynamics :list="dataList" />
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import lwTopnav from "@/components/lw-topnav/lw-topnav";
	import Dynamics from "@/pages/home/component/dynamics.vue";
	export default {
		components:{
			lwTopnav,Dynamics
		},
		props:{
			moduleList:{
				type: Array,
				default: []
			}
		},
		data() {
			return {
				// 导航栏列表
				list:[],
				// 列表
				dataList:[],
				form:{
					moduleName: '',
					labelName: '',
					size: 10,
					current: 1
				},
				current: 0,
				isFinish: false
			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: '人才活动'
			})
		},
		methods: {
			// 上拉刷新
			onRefresh(){
				this.form = {
					moduleName: this.moduleList[4].moduleName,
					labelName: this.list[this.current].name,
					size: 10,
					current: 1
				};
				this.isFinish = false;
				this.getDate();
			},
			// 初始化
			async init(){
				let listLabelRes = await this.$api.getLabel(this.moduleList[4].id);
				if(listLabelRes?.success){
					this.list = listLabelRes.data;
				}
				this.form.moduleName = this.moduleList[4].moduleName;
				this.form.labelName = this.list[this.current].name;
				this.getDate();
			},
			// 获取最新政策列表
			async getDate(){
				let res = await this.$api.getArticleList(this.form);
				if(res?.success){
					const { size, current, total, records } = res.data;
					if(current === 1) this.dataList = records;
					else this.dataList.push(...records);
					this.isFinish = current*size >= total;
				}
			},
			// scroll-view到底部加载更多
			onreachBottom() {
				if(this.isFinish) return;
				this.form.current++;
				this.getDate();			
			},
			// tabs切换
			change(index){
				this.current = index;
				this.form = {
					moduleName: this.moduleList[4].moduleName,
					labelName: this.list[index].name,
					size: 10,
					current: 1
				};
				this.isFinish = false;
				this.getDate();
			}
		}
	}
</script>

<style scoped lang="scss">
.activity-list{
	.result-list{
		min-height: 50vh;
		padding: 0;
		margin-top: 85rpx;
		// background-color: #f9f9f9;
		view{
			width: 100%;
			padding: 0 25rpx;
			background-color: #fff;
		}
	}
}
</style>