<template>
    <div>
        <div class="layout-cont">
            <!--下拉刷新  https://vant-contrib.gitee.io/vant/#/zh-CN/pull-refresh-->
            <van-pull-refresh v-model="refreshing" @refresh="_refresh">
                <!--上拉加载 https://vant-contrib.gitee.io/vant/#/zh-CN/list-->
                <van-list
                        v-model="loading"
                        :finished="finished"
                        finished-text="没有更多了"
                        @load="_load">
                    <van-swipe-cell v-for="item in resultList" :key="item.name">
                        <div class="result-item">
                            <div>标题：{{item.title}}</div>
                            <div>内容：{{item.content}}</div>
                            <div>发送人：{{item.sender}}</div>
                            <div>创建时间：{{$dateformat(item.ctime,'yyyy-mm-dd HH:MM')}}</div>
                        </div>
                    </van-swipe-cell>
                </van-list>
            </van-pull-refresh>
        </div>
    </div>
</template>

<script>
    import {message} from '../api'

    export default {
        data() {
            return {
                resultList: [],
                page: 1,
                rows: 10,
                refreshing: false,//刷新中...
                loading: false,//加载中...
                finished: false,//没有更多数据
            }
        },
        mounted() {
            this._getData()
        },
        methods: {
            _searchParams() {
                let data = {
                    page: this.page,
                    rows: this.rows,
                    service: 'drs',
                    read: 0
                };
                return this.$serializeForm(data)
            },
            _getData: async function () {
                let result = await message.myPage(this._searchParams())
                this.resultList = [...(this.page === 1 ? [] : this.resultList), ...result.records]
                this.refreshing = false
                this.loading = false
                if (this.resultList.length === result.total) {
                    this.finished = true
                }
            },
            _refresh() {
                this.page = 1;
                this._getData()
            },
            _load() {
                this.page = this.page + 1;
                this._getData()
            },
        }
    }
</script>

<style scoped>

</style>
