<template >
    <view :class="[AppTheme]">
        <view>
            <view class="bgf" v-for="(item, index) in hkInfo" :key="index">
                <view class="pay-main">
                    <view class="time">{{ item.ctime }}</view>
                    <view class="price">
                        汇款金额
                        <text class="text-neutral">：￥{{ item.money }}</text>
                    </view>
                </view>
                <view class="fle-bg" v-if="item.thumb_shot != 20 && item.thumb_shot != 10 && item.thumb_shot != 50 && item.thumb_shot != 467668">
                    <view v-for="item2 in item.thumb_shot" :key="item2">
                        <image :src="item2" alt="" class="bg" @click="imgListPreview(item2)"></image>
                    </view>
                </view>
            </view>
        </view>
        <u-loadmore :status="more" />
    </view>
</template>

<script>
import fundsApi from '@/api/wall/index.js';
export default {
    data() {
        return {
            primary:this.$theme.primary,
            settingFile:getApp().globalData.siteinfo,
            nodata: '',
            more: 'more', //@value more loading前  	@value loading loading中  	@value 'noMore' 没有更多了
            p: 1,
            pagesize: 10,
            hkInfo: []
        };
    },
    onLoad() {
        this.getHkInfo();
    },
    onReachBottom() {
        this.p++;
        this.more = 'loading';
        setTimeout(() => {
            this.getHkInfo();
        }, 500);
    },

    methods: {
        imgListPreview(item) {
            let urlList = [];
            urlList.push(item); //push中的参数为 :src="item.img_url" 中的图片地址
            uni.previewImage({
                indicator: 'number',
                loop: true,
                urls: urlList
            });
        },
        getHkInfo() {
            fundsApi
                .transferindex({
                    p: this.p,
                    pagesize: this.pagesize
                })
                .then(res => {
                    if (res.status == 200) {
                        this.hkInfo = this.hkInfo.concat(res.data);
                        if (res.data.length == 0) {
                            this.more = 'noMore';
                        }
                        if (res.data.length <= 10) {
                            this.more = 'noMore';
                        }
                    }
                });
        }
    },
	onPullDownRefresh() {
		this.p=1;
		this.hkInfo = [];
		this.getHkInfo();
		setTimeout(() => {
			uni.stopPullDownRefresh();
		}, 600);
	},
	
};
</script>

<style>
page {
        background-color: #f1f1f1;
}

.aui-bar {
    position: fixed;
}

.pay-main {
    width: calc(100% - 104rpx);
    margin: 0 auto;
    margin-top: 22rpx;
    margin-bottom: 20rpx;
    display: flex;
    justify-content: space-between;
    background-color: #ffffff;
}

.pay-main .time {
    font-size: 28rpx;
    font-family: PingFang SC;
    color: rgba(153, 153, 153, 1);
}

.pay-main .price {
    font-size: 24rpx;
    font-family: PingFang SC;
    font-weight: bold;
}

.fle-bg {
    width: calc(100% - 104rpx);
    margin: 0 auto;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    background-color: #ffffff;
}

.fle-bg .bg {
    margin: 10rpx;
    width: 190rpx;
    height: 190rpx;

    border-radius: 10rpx;
}

.bgf {
    margin-top: 10rpx;
    background-color: #ffffff;
    overflow: hidden;
}
.nodata {
    text-align: center;
}
</style>