<template>
	<view class="balanceRecord">
		<far-bottom></far-bottom>
		<scroll-view :style="{ height: phoneHight }" :scroll-y="true" @scrolltolower="yejlLoad" >
			<!-- 循环模板 -->
			<view  v-if="list.length > 0">
				<view class="yejlMb" v-for="(item,index) in list">
					<view class="yejlMbPackage">
						<view>
							<view class="yejlMbImg" v-if="item.num>0">
								<image :src="imgfixUrls + 'merchant/rmb.png'"/>
							</view>
							<view class="yejlMbImg" v-if="item.num<0" style="background:#DDDDDD">
								<image :src="imgfixUrls + 'merchant/rmb.png'"/>
							</view>
							<view class="yejlMbInfo">
								<view><span>{{item.remark}}</span></view>
								<view><span>{{item.createtime}}</span></view>
							</view>
						</view>
						<view>
							<span v-if="item.num>0">+{{item.num}}</span>
							<span v-if="item.num<0" style="color:#999999">{{item.num}}</span>
						</view>
					</view>
				</view>
				<!-- 循环模板 -->
				<view class="tips">
					<span>{{ yejlText }}</span>
				</view>
			</view>
			
			<block v-else>
				<none-mores></none-mores>
			</block>
		</scroll-view>
		
	</view>
</template>

<script>
import App from '@/common/js/app.js';
import noneMores from '@/components/template/nonemores.vue'

// #ifdef H5
import wxApi from '@/common/js/wxApi.js';
// #endif			
	
	export default {
		components:{
			noneMores
		},
		data() {
			return {
				phoneHight:0,
				page:1,
				pagetotal:null,
				list:[],
				yejlText:'',
			};
		},
		onLoad:function(){
			this.init();
		},
		methods:{
			init(){
				let _this=this
				_this.creditRecord();
				uni.getSystemInfo({
					success(res) {
						_this.phoneHight = res.windowHeight+'px';
					}
				});
				uni.getStorage({
				    key: 'TextSubstitution',
				    success: function (res) {
				       _this.moneytext=res.data.moneytext
					   uni.setNavigationBarTitle({
					       title: res.data.moneytext+'记录'
					   });
				    }
				});
				
			},
			// 积分余额变更记录
			creditRecord(){
				let _this=this
				_this.yejlText="... ...加载中"
				let	data={
						page:_this.page,
						type:2
					};
				App._post_form('&p=member&do=creditRecord',data,res=>{
					_this.list=[..._this.list,...res.data.list];
					_this.pagetotal=res.data.pagetotal
					_this.yejlText=""
				})	
			},
			yejlLoad(){
				let _this=this
				if(_this.pagetotal==_this.page){
					_this.yejlText="没有更多数据了"
				}
				else{
					_this.page++
					_this.creditRecord();
				}
				
			}
		}
	}
</script>

<style lang="less" scoped>
page{
	background: #F6F6F6;
}	
.balanceRecord{
	font-size: 0;
}
.yejlMb{
	background: #FFFFFF;
}
.yejlMbPackage{
	border-bottom: 1upx solid rgba(246,246,246,1);
	padding: 40upx 30upx;
	display: flex;
	justify-content: space-between;
	>view{
		display: inline-block;
	}
	>view:nth-child(2){
		>span{
			line-height: 64upx;
			font-size:28upx;
				color:rgba(244,79,68,1);
		}
	}
	>view:nth-child(1){
		>view{
			display: inline-block;
			vertical-align: middle;
		}
	}
}

.yejlMbImg{
	vertical-align: middle;
	display: inline-block;
	width:64upx;
	height:64upx;
	overflow:hidden;
	border-radius:50%;
	background:#F44F44;
	>image{
			width:64upx;
			height:64upx;
	}
}
.yejlMbInfo{
	margin-left:20upx;
	>view:nth-child(1){
		>span{
			width: 400upx;
			display: inline-block;
			overflow: hidden;
			text-overflow: ellipsis;
			word-wrap: break-word;
			white-space: nowrap !important;
		}
		font-size:28upx;
		width:400upx;
		font-weight:400;
		color:rgba(51,51,51,1);
	}
	>view:nth-child(2){
		font-size:24upx;
		olor:rgba(153,153,153,1);
	}
}
.tips {
	height: 80upx;
	text-align: center;
	> span {
		line-height: 80upx;
		font-size: 28upx;
		
		
		color: black;
	}
}
</style>
