<template>
    <ion-page>
        <ion-header>
            <ion-toolbar>
                <ion-buttons slot="start">
                    <ion-back-button text="" default-href="#" @click="$router.back()"></ion-back-button>
                </ion-buttons>
                <ion-title>{{ $t('title.myTeam') }}</ion-title>
            </ion-toolbar>
        </ion-header>
        <ion-content>
            <van-list
                ref="list"
                v-model:loading="loading"
                :finished="finished"
                :finished-text="$t('common.loadFinish')"
                @load="loadmore"
            >
                <TeamMember v-for="(item, i) in list" :key="i" :detail="item"></TeamMember>
            </van-list>
        </ion-content>
    </ion-page>
</template>

<script>
import TeamMember from '../components/TeamMember.vue'
import { List } from 'vant'
export default {
    components: { TeamMember },
    data() {
        return { loading: false, finished: false, page: -1, list: [] }
    },
    mounted() {
        setTimeout(() => {
            this.$refs.list.check()
        }, 50)
    },
    methods: {
        loadmore() {
            this.page++
            this.$http.get('/commission/juniors', { page: this.page, sort: 'createdAt,desc' }).then(res => {
                if (res.first) {
                    this.list = []
                }
                this.list = this.list.concat(res.content)
                this.finished = res.last
                this.loading = false
            })
        }
    }
}
</script>

<style lang="less" scoped></style>
