84 lines
2.0 KiB
Vue
84 lines
2.0 KiB
Vue
<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> |