<template>
    <Scroll @OnLoad="OnLoad" :over="over" :loading="loading" v-if="list.length>0">
        <slot></slot>
    </Scroll>
    <div v-else>
        <Empty v-if="emptymsg.length>0" :msg="emptymsg" />
    </div>
    
</template>
<script>
export default {
    name:"List",
    props:{
        url:{
            type:String,
            default:''
        },
        req:{
            type:Object,
            default:{}
        },
        limit:{
            type:Number,
            default:10
        },
        emptymsg:{
            type:String,
            default:'暂时没有内容哦~'
        }
    },
    data(){
        return{
            title:'',
            page:1,
            list: [],
            isinit: false,
            over: false,
            loading: false,
            next: true
        }
    },
    mounted(){
        this.ComOnLoad();
    },
    methods:{
        ComOnLoad(){
            var that = this;

            that.list = [];
            that.next = true;
            that.over = false;
            that.page = 1;
            that.layer.loading();
            that.LoadData(()=>{
                that.layer.close()
            });
        },
        LoadData(_success){
            var that = this;
            that.loading = true;
            that.next = false;
            //配置请求参数
            var reqData={
                page:that.page,
                limit:that.limit,
                ...that.req
            }
            that.$ajax.post({
                url: that.url,
                data: reqData,
                success: _res => {
                    typeof _success==="function" && _success()
                    //设置标题名称
                    if(_res.title&&_res.title.length>0) {
                        window.document.title = that.title = _res.channel.TITLE;
                    }
                    //执行回调 第一次加载完成
                    if(that.page==1) {
                        this.$emit('OnFirst',_res)
                    }
                    
                    that.loading = false;
                    that.isinit = true;
                    var oldlist = that.list || [];
                    oldlist = oldlist.concat(_res.list);

                    that.list = oldlist;
                    that.isinit = true;
                    //执行加载完后回调
                    this.$emit('OnLoad',_res,that.list)
                    
                    if (_res.next == 0) {
                        that.over = true;
                        //执行完成后回调
                        this.$emit('OnOver',_res,that.list)
                        return;
                    }
                    that.next = true;
                    that.page++;
                    
                }
            });
        },
        OnLoad() {
            console.log('触底')
            setTimeout(() => {
                if (!this.next) {
                    return;
                }
                //执行触发加载的时候
                this.$emit('OnNext',this.list)
                this.LoadData();
            }, 100);
        }
    }
}
</script>