class Index {
    constructor() {
        // console.log(config.getBaseUrl());
        // this.getClassList()
        this.index = 0;
        this.principal = [];
        this.GetType()
        this.initSwiper()

        footer()
    }

    initSwiper() {
        var self = this;
        this.swiper = new Swiper('.swiper', {
            direction: 'horizontal',
            on: {
                slideChangeTransitionStart: function () {
                    _(".header_menu ul li")[this.activeIndex].addClass("active")
                    .siblings().removeClass("active");
                    self.index = this.activeIndex
                    if (this.activeIndex != 0) {
                        self.getClassList()
                    }
                },
            },
        })
    }

    async GetType() {
       
        // 第一次访问网页获取分类
        if (!getItem("principal")) {
            let { principal, additional } = await indexServe.type();
            this.principal = principal

            setItem("principal", principal)
            setItem("additional", additional)
        } else {
            this.principal = getItem("principal")
        }

        this.principal.forEach((v, i) => {
            $(".header_menu ul").html(`
                <li class="${i == 0 ? 'active' : ''}">${v.title}</li>
            `);

            $(".swiper-wrapper").html(`
              <div class="swiper-slide">
                <ul></ul>
              </div>
            `)
        });

        _(".swiper-wrapper .swiper-slide").forEach(v => {
            v.onscroll = () => {
                const {clientHeight, scrollHeight, scrollTop} = v;
                const distance = scrollHeight- scrollTop - clientHeight;
                if(distance <= 0) {
                    if (this.index != 0) {
                        this.principal[this.index].page += 1;
                        if (this.principal[this.index].page <= this.principal[this.index].total_page) {
                            this.getClassList('load_more')
                        } else {
                            // 暂无数据的样式
                        }
                    }
                }
            }
        })


        _(".header_menu ul li").tap(( { v, i }) => {
            // 链式调用
            this.swiper.slideTo(i)
        })

        this.getIndex();
    }

    async getClassList(type = 'click') {
       
        let loadData = async () => {
            let res = await indexServe.classList({
                id: this.principal[this.index].id,
                page: this.principal[this.index].page
            });
    
            this.principal[this.index].content = res.data;
            this.principal[this.index].total_page = res.total_page
            console.log(this.principal);
    
            item(
                _(".swiper-wrapper .swiper-slide ul")[this.index],
                this.principal[this.index].content
            )
        }
        this.principal=getItem("principal")
        console.log(getItem("principal"))
        if (type == 'click') {
            if (this.principal[this.index].content.length == 0) {
                loadData()

            }
        } else {
            loadData()
        }

        
    }

    async getIndex() {
        let res = await indexServe.index();
        console.log("index: ",res);

        item(_(".swiper-wrapper .swiper-slide ul")[0],res.list)
    }

}

new Index()