class index {
    constructor() {
        this.mySwiper = null;
        this.tjmsg = [ { title: '推荐'}, { title: '时令'},{ title: '食肉'}, { title: '素食'}, { title: '烘焙'} ];
        this.GetBanner();
        this.GetThreeMeals();
        this.GetindexType();
        this.Getmenu();

    }

    async Getmenu() {
        var res = await indexServe.typee();
        res.forEach(v=>{
            $(".menu").append(`<li>
            <a href="${v.href}">
              <img src="${v.img}" alt="">
              <p>${v.title}</p>
            </a>
         </li>`)
        })
    }

    async GetindexType() {
        this.tjmsg.forEach((v, i)=>{
            $(".tj .food_list").append(`<li class="${i == 0 ? 'active' : ''}">${v.title}</li>`);
        });
        this.Updatelist();
        console.log("11")
        var self = this
        $(".tj .food_list li").click(function () {
            $(this).addClass("active").siblings().removeClass("active");
            var type = $('.tj .food_list li').index($(this))
            self.Updatelist(type+1)
            
        });

    }

    async Updatelist(type,page){
        var res = await indexServe.indexType(
            {
                type:type,
                page:page
            }
        );
        $(".tj .food_content").html("");

        FoodList(res,$(".tj .food_content"))
    }

    async GetBanner() {
        var res = await indexServe.indexBanner();
        res.forEach(v=>{
            $(".banner .swiper-wrapper").append(`<div class="swiper-slide">
                <a href="${v.url}">
                    <img src="${v.img}" alt="">
                </a>
            </div>`)
        })
        this.initindexBanner();
    }

    async GetThreeMeals() {
        var res = await indexServe.threeMeals();
        res.forEach((v, i) => {
            $(".threeMeals .food_list").append(`<li class="${i == 0 ? 'active' : ''}">${v.title}</li>`);
        });
        FoodList(res,$(".threeMeals_content .swiper-wrapper"))
        var self = this;
       

        var self = this;
        $(".threeMeals .food_list li").click(function () {
            $(this).addClass("active").siblings().removeClass("active");
            self.mySwiper.slideTo($(this).index())
        });

        this.initThreeMealsSwiper()
    }

    initThreeMealsSwiper() {
        this.mySwiper = new Swiper('.threeMeals_content', {
           // direction: 'horizontal', // 垂直切换选项
            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
            },
            on: {
                slideChangeTransitionEnd: function () {
                    $(".threeMeals .food_list li").eq(this.activeIndex).addClass("active").siblings().removeClass("active")
                },
            },
        })
    }

    initindexBanner() {
        var ndexBannerSwiper = new Swiper('.banner', {
        //    direction: 'horizontal', // 垂直切换选项
            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
            },
        })
    }
}

new index()