<script setup>
	/**
	 * 积分变动明细
	 */

	import {
		ref,
		reactive,
		computed,
	} from 'vue'
	import {
		onLoad,
		onReachBottom,
		onPullDownRefresh
	} from '@dcloudio/uni-app'
	import {
		useStore
	} from 'vuex'
	// 顶部
	import apex from '/components/header/apex'
	import durian from '@/api/durian.js';
	// 工具库
	import util from '@/common/js/util.js'
	const store = useStore()

	//积分变动记录
	const scrollLog = reactive({
		data: [],
		pageNum: 1,
		pageSize: 30,
		total: 0,
	})
	// 榴莲树id
	const id = ref('')
	// 用户信息
	const userinfo = computed(() => {
		let result = store.state.userinfo
		return result
	})

	onLoad((option) => {
		if (option.id) id.value = option.id
		// 获取列表
		getList()
	})

	onPullDownRefresh(() => {
		// 刷新列表
		refreshList()
	})

	onReachBottom(() => {
		// 获取更多列表
		getMoreList()
	})

	// 刷新列表
	function refreshList() {
		scrollLog.homePageSize = 1
		getList()
	}

	// 获取更多列表
	function getMoreList() {
		if (scrollLog.total <= scrollLog.data.length) return
		scrollLog.pageNum++
		getList()
	}

	// 积分变动明细
	function getList() {
		durian.getMyFruitLog({
			query: {
				pageNum: scrollLog.pageNum,
				pageSize: scrollLog.pageSize,
				userId: userinfo.value.userId,
			}
		}).then(rs => {
			if (rs.code == 200) {
				// 第一页
				if (scrollLog.pageNum == 1) scrollLog.data.length = 0
				// 合并
				scrollLog.data.push(...rs.rows)
				// 总数
				scrollLog.total = rs.total
				return
			}
			util.alert({
				content: rs.msg,
				showCancel: false,
			})
		}).finally(() => {
			// 停止下拉刷新
			uni.stopPullDownRefresh()
		})
	}
</script>

<template>
	<view class="app">
		<view class="list">
			<view class="li" v-for="(item,index) in scrollLog.data" :key="index">
				<view class="item rows ptb30 plr20 bfff">
					<view class="col oh f1">
						<view class="c333 f36">{{item.context}}</view>
						<view class="mt20 c666 f28">{{item.createTime}}</view>
					</view>
					<view class="change fs0 c333 f36" v-if="Number(item.scroll) != 0">
						<text v-if="Number(item.scroll) > 0">+</text>
						<text>{{item.scroll}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

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