assess-app/pages/task/task.vue

<template>
	<view class="total-page page-box page-env-160 scroll_content">
		<Nav :title="'任务'" :genre="1" :back="false" :fixedHeight="105"></Nav>
		<view class="task-tabs" :style="{top:`${$tools.topHeight()}px`}">
			<Search :placeholder="'贷款人姓名或电话'"></Search>
			<view style="height: 100rpx;">
				<z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'28rpx'}"
					:bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
					:current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
			</view>
		</view>
		<!-- 带Swiper -->
		<!-- 		<swiper style="height: 100vh;" :current="current" @transition="swiperTransition"
			@animationfinish="swiperAnimationfinish">
			<swiper-item v-for="(item, index) in tabsList" :key="index">
				<EnScroll ref="scroll" :navHeight="125" @onRefresh="onRefresh" @onScrollBottom="onScrollBottom">
					<TaskItem :type="1" is_bottom></TaskItem>
				</EnScroll>
			</swiper-item>
		</swiper> -->
		<!-- 不带Swiper -->
		<EnScroll ref="scroll" :navHeight="105" is_tabHeight class="main" @onRefresh="onRefresh"
			@onScrollBottom="onScrollBottom">
			<TaskItem :type="1" is_bottom></TaskItem>
		</EnScroll>
		<Tab :tab-index="1"></Tab>
	</view>
</template>
<script>
	// 任务列表
	import TaskItem from "@/common/task/task-item.vue";

	export default {
		components: {
			TaskItem
		},
		data() {
			return {
				tabHeight: uni.getStorageSync('tab_height'),
				current: 0,
				swiperCurrent: 0,
				tabsList: [{
					name: '全部',
					dot_color: 'red',
					disabled: false
				}, {
					name: '新进',
					dot_color: 'yellow',
					disabled: false
				}, {
					name: '待办',
					dot_color: '',
					disabled: false
				}, {
					name: '完成',
					dot_color: '',
					disabled: false
				}, {
					name: '拒绝',
					dot_color: '',
					disabled: false
				}],
			}
		},
		methods: {
			tabsChange(index) {
				this.current = index;
			},
			// 下拉刷新
			onRefresh() {
				uni.showLoading({
					title: '数据加载中'
				})
				setTimeout(() => {
					uni.showToast({
						title: '加载完成',
						icon: 'none'
					})
					this.$refs.scroll.onEndPulling()
				}, 1000)
				console.log("下拉刷新");
			},
			// 滚动到底部
			onScrollBottom() {
				uni.showLoading({
					title: '数据加载中'
				})
				setTimeout(() => {
					uni.showToast({
						title: '加载完成',
						icon: 'none'
					})
				}, 1000)
				console.log("到底部了");
			},
			//swiper滑动中
			swiperTransition(e) {
				this.$refs.tabs.setDx(e.detail.dx);
			},
			//swiper滑动结束
			swiperAnimationfinish(e) {
				this.current = e.detail.current;
				this.$refs.tabs.unlockDx();
			}
		},
	}
</script>
<style lang="scss" scoped>

</style>