assess-app/page_task/gain_task/gain_task.vue

<template>
	<view class="total-page page-box gain-task">
		<Nav :title="'领取任务'" :genre="1" is_fixed></Nav>
<!--		<view class="m-lr20 r-20">-->
<!--			<k-tabs-swiper class="r-20" v-model="current" :tabs="tabs" :field="'name'"   bgColor="#fff" color="#444444"-->
<!--				activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"-->
<!--				@change="changeTab" paddingItem="0 50rpx">-->
<!--			</k-tabs-swiper>-->
<!--		</view>-->
    <task-ima-tab @setProductId="setProductId" :num-type="1"></task-ima-tab>
		<EnScroll ref="scroll" :navHeight="110" class="main" @onRefresh="onRefresh" @onScrollBottom="onScrollBottom">
			<TaskItem :type="2" :task-list="taskList" is_bottom @takeTask="setTakeTask"></TaskItem>
		</EnScroll>
	</view>
</template>

<script>
	import TaskItem from "@/common/task/task-item.vue"
  import { getTaskReceiving} from "@/api/task"
  import TaskImaTab from "@/common/task/task_ima_tab.vue";

	export default {
		components: {
      TaskImaTab,
			TaskItem
		},
		data() {
			return {
				current: 0,
				tabs: [
          {
            id: 0,
            name: '全部(0)',
            product_name: '全部',
            icon: '/static/img/task/task-all.png',
            num:0
          }
        ],
				taskList: [],
				page: 1,
				totalNum: 9999,
				isAjax: false,
				productId: 0
			}
		},
		mounted() {
			this.getTaskReceiving()
		},
		methods: {
			setProductId(productId) {
				console.log('productId:' + productId)
				this.productId = productId
				this.startList()
			},
			// 下拉刷新
			startList() {
				this.taskList = [];
				this.page = 1
				this.totalNum = 99999
				this.getTaskReceiving()
			},
			async getTaskReceiving() {
				if (this.totalNum <= this.taskList.length) {
					return;
				}
				const res = await getTaskReceiving({
					'page': this.page,
					'productId': this.productId
				})
				if (res.code === 1) {
					this.totalNum = res.data.totalNum
					this.taskList.push(...res.data.items)
						++this.page
				}
			},
			setTakeTask(index) {
				console.log('index:' + index)
				this.taskList.splice(index, 1)
				uni.$emit('updateMemberInfo')
			},

			onRefresh() {
				uni.showLoading({
					title: '数据加载中'
				})
				setTimeout(() => {
					uni.showToast({
						title: '加载完成',
						icon: 'none'
					})
					this.$refs.scroll.onEndPulling()
					this.startList()
				}, 1000)
				console.log("下拉刷新");
			},
			// 滚动到底部
			onScrollBottom() {
				uni.showLoading({
					title: '数据加载中'
				})
				this.getTaskReceiving()
				setTimeout(() => {
					uni.showToast({
						title: '加载完成',
						icon: 'none'
					})
				}, 1000)
				console.log("到底部了");
			},
		}
	}
</script>

<style lang="scss" scoped>
	.gain-task {
		display: flex;
		flex-direction: column;
		min-height: 100%;
		background-image: url('https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png');
		background-repeat: no-repeat;
		background-size: 100% auto;
	}
</style>