<template>
	<z-paging :refresher-enabled="false" :show-loading-more-when-reload="true" loading-more-default-text=""
		loading-more-loading-text="" loading-more-fail-text="" :empty-view-text="t('common.noData')"
		:show-loading-more-no-more-view="false" ref="paging" v-model="dataList" @query="queryList"
		class="max-w-[750px]">
		<h-dark :title="t('recharge.titleRecord')"></h-dark>
		<view class="mx-[30rpx] mt-[20rpx]">
			<navigator v-for="item in dataList" :key="item.id" hover-class="none"
				:url="'/packages/pages/recharge/order_detail?id='+item.id">
				<view class="bg-[#2C326B] mb-[20rpx] rounded-lg px-[40rpx] py-[35rpx]">
					<view class="flex justify-between mb-[20rpx]">
						<view class="w-3/5">
							<view class="">{{item.create_time}}</view>
						</view>
						<view class="text-right w-2/5">
							<view class="font-bold ">
								{{item.amount}}
							</view>
							<view class="mt-[10rpx] text-xs" v-if="item.rate != 1">
								≈ {{item.amount_act}} {{item.symbol}}
							</view>
						</view>
					</view>
					<view class="flex justify-between ">
						<view class="text-[#00D2E0]">
							<view class="">
								{{item.method_name}}
							</view>
							<view v-if="item.status==2" class="text-xs text-error mt-[12rpx]">
								{{tips.rechargeFailTips}}
							</view>
						</view>
						<view v-if="item.status==1" class="text-success">
							{{tips.finish}}
						</view>
						<view v-if="item.status==0" class="text-primary">
							{{tips.pending}}
						</view>
						<view v-if="item.status==2" class="text-error">
							{{tips.fail}}
						</view>
					</view>
				</view>
			</navigator>
		</view>
	</z-paging>
</template>

<script lang="ts" setup>
	import { ref, shallowRef, reactive } from 'vue'
	import { rechargeRecordLists } from '@/api/finance'
	import { getCurrency,getCurrency2, formatDate, formatMoney } from '@/utils/util'
	import { t } from '@/utils/util'

	//为了提高渲染速度
	const tips = reactive({
		rechargeFailTips: t('recharge.rechargeFailTips'),
		fail: t('tabs.fail'),
		pending: t('tabs.pending'),
		finish: t('tabs.finish'),
	})

	uni.setNavigationBarTitle({ title: t('recharge.titleRecord') })
	const paging = shallowRef()
	const dataList = ref<any[]>([])
	const queryList = async (pageNo : number, pageSize : number) => {
		try {
			const data = await rechargeRecordLists({
				page_no: pageNo,
				page_size: pageSize,
				date: formatDate(Math.round(Date.now() / 1000))
			})
			Object.keys(data.lists).forEach(key => {
				data.lists[key]['amount'] = getCurrency() + formatMoney(data.lists[key]['amount']) + ' ' +  getCurrency2()
			})
			paging.value.complete(data.lists)
		} catch (error) {
			paging.value.complete(false)
		}
	}
</script>

<style lang="scss">
</style>