assess-app/pages/loan/loan.vue

<template>
	<view class="total-page page_env page-box sys-list-background-color">
		<view class="task-bg">
			<Nav :title="'贷后管理'" :genre="1" :back="false" is_fixed></Nav>
			<view>
				<Search :placeholder="'贷款人姓名或电话'"></Search>
				<view class="page-box-bg-fff m-lr20 r-20">
					<z-tabs ref="tabs" :list="tabsList"
						:active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
						:bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
						:current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
				</view>
			</view>
			<EnScroll ref="scroll" :navHeight="108" is_tabHeight @onRefresh="onRefresh"
				@onScrollBottom="onScrollBottom">
<!--				<TaskItem :type="3" is_bottom></TaskItem>-->
			</EnScroll>
			<Tab :tab-index="2"></Tab>
		</view>
	</view>

</template>
<script>
	// 任务列表
	import TaskItem from "@/common/task/task-item.vue";
  import {getLoanList} from "@/api/task";
  import tools from "@/service/tools";

	export default {
		components: {
			TaskItem
		},
		data() {
			return {
				current: 0,
				tabsList: [{
					name: '全部',
					disabled: false
				}, {
					name: '已完成(6)',
					dot_color: 'red',
					is_dot: true,
					disabled: false
				}, {
					name: '未完成(6)',
					dot_color: '#000',
					is_dot: true,
					disabled: false
				}],
        searchText:"",
        fromData:{
          status:0,
          interest_rate:'',//利率区间 数组或者字符串，连接
          residue_num:'',//剩余期数
          product_name:'',//产品名称
          phone:'',//电话号码
          name:'',//客户名称
          productId:'',//产品ID
          page:1,
        },
        total:0,
        list:[],
			}
		},
		watch: {


		},
    mounted() {
      this.getList()
    },
		methods: {
      getList(){
        getLoanList(this.fromData).then((res)=>{
          if(res.code === 1){
            this.list = [...this.list,...res.data.items]
            this.total = res.data.total
          }else{
            tools.error(res.msg)
          }
        })
      },
			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("到底部了");
			},
		},
	}
</script>
<style lang="scss" scoped>
	// .page-box{
	//   height: 100vh;
	//   background-image: url("https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/index/index-bg.png?imageMogr2/quality/20");
	//   background-repeat: no-repeat;
	//   background-size: 100% auto;
	//   display: flex;
	//   flex-direction: column;
	//   .top-data{
	//     flex: 1;
	//     overflow: hidden;
	//     .top-row{
	//       height: 680rpx;
	//     }
	//   }

	//   .bottom-data{

	//   }

	// }
</style>