qd_81fang/pages/wallet/paylist.vue

<template>
	<view class="content">
		<view class="box">
			<view class="orderItem" v-for="(item, index) in list" :key="index">
				<image class="goodImg"
					:src="item.type==0?item.pimage:'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/846cd1a69879ec4f551d44e87c7500bf.png'">
				</image>
				<view class="orderInfo">
					<view class="info1">
						<view>{{ item.type==0?item.pname:'提现'}}</view>
						<view :class="item.type==0?'color1':''">{{ item.type==0?'+'+item.money:'-'+item.money}}</view>
					</view>
					<view class="info3" v-if="item.type==0">
						<view>实付:¥{{ item.order_price }}</view>
						<view :class="true?'color1':''" v-if="item.score">+{{ item.score }}积分</view>
					</view>
					<view class="info2" v-if="item.type==0">
						<view>二级分销</view>
					</view>

					<view class="info2">
						<!-- <view>{{ parse.filterTime(item.create) }}</view> -->
						<view class="">
						{{ parse.filterTime(item.createtime) }}
						</view>
					</view>
				</view>
			</view>
			
			
			    <view v-if="!list.length" style='color:#999;text-align:center;margin:150rpx 0;font-size:30rpx'>暂无数据</view>

			
		</view>
	</view>
</template>
<script module="parse" lang="wxs">
	module.exports = {
		filterTime: function(time) {

			console.log(time)

			var nowDate = getDate(time * 1000);
			var year = nowDate.getFullYear();
			var month = nowDate.getMonth() + 1;
			var date = nowDate.getDate();
			var hours = nowDate.getHours();
			var minutes = nowDate.getMinutes();
			var seconds = nowDate.getSeconds();

			month = month > 9 ? month : '0' + month;
			date = date > 9 ? date : '0' + date;
			hours = hours > 9 ? hours : '0' + hours;
			minutes = minutes > 9 ? minutes : '0' + minutes;
			seconds = seconds > 9 ? seconds : '0' + seconds;

			return year + '-' + month + '-' + date + " " + hours + ":" + minutes + ":" + seconds;

		}
	}
</script>
<script>
	// pages/backstage/index/index.js
	var app = getApp();
	// import { request } from '../../../utils/request.js';
	export default {
		data() {
			return {
				page: 1,
				pageSize: 10,
				list: [],
				loaded: false,
			};
		}
		/**
		 * 生命周期函数--监听页面加载
		 */
		,
		onLoad: function(options) {

			// this.getlist();
		},
		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},
		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},
		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {
			this.init();
			this.getlist();
			uni.stopPullDownRefresh();
		},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {
			this.loaded || this.getlist();
		},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			
        async getlist() {
            var that = this;
			         let res = await this.$api.request('/wallet/money_log', 'GET', {
			         	page: this.page,
			         	limit: this.pageSize
			         });
					 
					 console.log(res)
			         if (res) {
			         	if (res.data.length > 0) {
			         
			         		this.list = this.list.concat(res.data);
			         
			         		this.page++;
			         		
			         	} else {
			         		this.loaded = true
			         		this.$api.msg('没有更多数据');
			         	}
			         }
        },

			init() {
				this.page = 1
				this.loaded = false
				this.list = []
			}
		}
	};
</script>
<style>
	page {
		background: #f4f5f9;
	}

	.content {
		margin: 26rpx;
		background: #fff;
		border-radius: 20rpx;
	}

	.orderItem {
		display: flex;
		align-items: center;
		padding: 30rpx 20rpx;
		border-bottom: 1px solid #e4e5ee;
		box-sizing: border-box;
	}


	.orderItem>image {
		width: 116rpx;
		height: 116rpx;
		border-radius: 12rpx;
	}

	.orderInfo {
		display: flex;
		flex-direction: column;
		flex: 1;
		justify-content: space-between;
		margin-left: 18rpx;
	}

	.info1 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 8rpx;

	}

	.info1>view:nth-child(1) {
		font-size: 28rpx;
		width: 300rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		color: #010101;
	}

	.info1>view:nth-child(2) {
		font-size: 28rpx;
	}

	.info2 {
		display: flex;
		align-items: center;
		justify-content: space-between;

		margin-top: 6rpx;
	}

	.info2>view:nth-child(1) {
		color: #9194a6;
	}


	.info3 {
		display: flex;
		align-items: center;
		justify-content: space-between;


	}

	.info3>view:nth-child(1) {
		font-size: 24rpx;

		color: #9194a6;
	}

	.info3>view:nth-child(2) {
		font-size: 28rpx;
	}



	.color1 {
		color: #EC8E02 !important;
	}

	view {
		font-size: 24rpx;
	}

	.goodImg {
		width: 100rpx;
		height: 100rpx;
		border-radius: 12rpx;
	}
</style>