<template>
	<block v-if="lists.length>0">
		<view class="content">
			<view class="li" v-for="(item,index) in lists" :key="index">
				<view class="li-top">
					<text>{{item.title}}</text>
					<text style="font-weight: bold;" :style="{color:item.pay_status=='1'?'#50C758':'red'
					}">{{item.price}}</text>
				</view>
				<view class="li-top" style="margin-bottom: 0;">
					<text style="font-size: 24rpx;color: grey;">{{item.create_time}}</text>
					<text style="font-size: 24rpx;color: grey;" >{{item.status_name}}</text>
				</view>
			</view>
		</view>
	</block>
	<up-empty v-else mode="history" style="margin-top: 20vh;" text='没有更多内容了'>
	</up-empty>

	<view style="height: 50rpx;">

	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue"
	import {
		onLoad,
		onPullDownRefresh
	} from "@dcloudio/uni-app"
	import {
		getCashRecordApi
	} from "@/api/user.js"



	const mark = ref(0)

	const lists = ref([])
	let type = ref('')
	const getLists = async (isPullDown = false) => {

		let res = await getCashRecordApi({
	
		})
		lists.value = res.data


		if (isPullDown) uni.stopPullDownRefresh()

	}

	onLoad((opt) => {
		type.value = opt.type

		getLists()
	})

	onPullDownRefresh(() => {
		getLists(true)
	})
</script>

<style lang="scss">
	.content {
		background-color: white;
		width: 690rpx;
		padding: 20rpx;
		margin: 0 auto;
		box-sizing: border-box;
		margin: 0 auto;
		margin-top: 30rpx;
		border-radius: 20rpx;
		margin-bottom: 100rpx;

		.li {
			margin-top: 20rpx;
			border-bottom: 1px solid #EDF2FA;
			padding-bottom: 20rpx;

			.li-top {
				display: flex;
				justify-content: space-between;
				margin-bottom: 20rpx;
			}

		}

	}
</style>