class index {
    constructor() {
        this.principal = [];
        this.index = localStorage.getItem("index") == null ? 0 : localStorage.getItem("index");
        footer()
        this.getIndexData();
        this.GetType();
    }

    // 获取横向分类的数据
    async GetType() {
        var res;
        // 第一次访问app，本地没有缓存的principal分类，所以发送请求去获取
        if (localStorage.getItem("principal") == null) {
            var data = await indexServe.type();
            console.log("data === ", data);
            res = data.principal
            localStorage.setItem("principal", JSON.stringify(data.principal))
            localStorage.setItem("additional", JSON.stringify(data.additional))
        } else {
            res = JSON.parse(localStorage.getItem("principal"))
        }
       
        this.principal = res;

        this.principal.unshift({
            id: -1,
            page: 0,
            title: "首页",
            content: []
        })


        this.principal.forEach((v, i) => {
            v.content = [];
            // 渲染横向菜单
            $(".header_menu ul").innerHTML += `<li class="${i == this.index ? 'active_menu' : ''}">${v.title}</li>`;

            // 生成横向的轮播图
            if (i != 0) {
                $(".swiper-container .swiper-wrapper").innerHTML += `<div class="swiper-slide item_list"></div>`
            }
        });

        OnScrollBottom(".swiper-wrapper .swiper-slide", async () => {
            if (index != 0) {
                this.principal[this.index].page++;
                if (this.principal[this.index].page <= this.principal[this.index].total_page) {
                    await this.GetClassList("more")
                    if (this.principal[this.index].page == this.principal[this.index].total_page) {
                        _(".swiper-wrapper .swiper-slide")[this.index].innerHTML += `<p class="nodata">...暂无数据...</p>`
                    }
                }
                
            }
        })

        console.log(this.principal);
        this.initSwiper();
    }

    initSwiper() {
       

        // 改变激活样式的封装
        function changeAction(index) {
            _(".header_menu ul li").forEach(v => {
                v.className = ""
            });
            _(".header_menu ul li")[index].className = "active_menu"
        }

        var page = new swiper(".swiper-container", {
            time: 3,
            on: {
                slideChangeTransitionStart: (index) => {
                    this.index = index;
                    localStorage.setItem("index", this.index)
                    changeAction(index)
                    this.GetClassList()
                }
            }
        });

        _(".header_menu ul li").forEach((v, i) => {
            v.onclick = () => {
                this.index = i;
                localStorage.setItem("index", this.index)
                page.slideTo(i);
                changeAction(i);
                this.GetClassList()
            }
        });

        if (localStorage.getItem("index") != null) {
            this.GetClassList()
            page.slideTo(this.index);
        }
    }

    // type click 表示点击或者滑动
    //      more  表示滚动加载数据
    async GetClassList(type = "click") {
        var getData = async () => {
            var res = await indexServe.classList({
                page: this.principal[this.index].page,
                id: this.principal[this.index].id
            });

            this.principal[this.index].content = [
                ...this.principal[this.index].content,
                ...res.data
            ];

            this.principal[this.index].total_page = res.total_page;
            item(res.data, _(".swiper-wrapper .swiper-slide")[this.index])

        }
        if (this.index != 0) {
            if (type == "click") {
                if (this.principal[this.index].content == 0) { 
                   await getData()
                }
            } else {
                await getData()
            }
        }


    }


    async getIndexData() {
        var res = await indexServe.index();
        item(res.newest.data, $(".newest"))
        item(res.recommended.data, $(".recommended"))
    }
}

new index()