<script setup>
	// 引入依赖
	import uniDatetimePicker from '@/uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue' 
	import uniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue' 
	import { onLoad,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app"
	// import mySwiper from "@/components/mySwiper.vue"
	import {ref,onMounted,nextTick,watch} from "vue"
	import api from '@/api/index.js'
	import util from "@/utils/index.js"
	import {useStore} from '@/store/index.js'
	// import uniIcons from '@/uni_modules/uni-icons/components/uni-icons/uni-icons.vue' 
	const store = useStore()
	// 生命周期
	onLoad((e) => {
		getList()
	})
	onPullDownRefresh(()=> { // 下拉刷新
		init()
		getList()
	})
	onReachBottom(() => { // 上滑触底
		queryParams.value.page++	
		getList()
	})
	// 变量
	const list = ref([])
	const queryParams = ref({
		page:1,
		pageSize:10,
		isFinish:0
	})
	// 函数
	function init(){
		list.value = []
		queryParams.value.page = 1
		queryParams.value.pageSize = 10
	}
	async function getList() {
		const res = await api.getTodoist(queryParams.value)
		if(res.code === 0) {
			if(res.data && res.data.length > 0) {
				list.value.push(...res.data)
			}
			else{
				queryParams.value.page--
			}
		}
		else{
			uni.showToast({
				title:"获取失败",
				icon:"error",
				duration:2000
			})
		}
	}
</script>
<template>
	<view class="todoBox page-box">
		<view class="td-item" v-for="(item,i) in list">
			<view class="td-content text-ellipsis-2">
				{{item.content}}
			</view>
			<view class="td-info small-text">
				{{util.timestampToDate(item.CreatedAt)}}
			</view>
		</view>
	</view>
</template>
<style scoped lang="scss">
	.todoBox{
		padding: 20rpx;
		.td-item{
			padding: 20rpx 0;
			border-bottom: 2rpx solid #eaeaea;
			margin-bottom: 20rpx;
			.td-content{
				padding-bottom:20rpx;
			}
			.td-info{
				text-align: right;
			}
		}
	}
</style>