108 lines
3.0 KiB
JavaScript
108 lines
3.0 KiB
JavaScript
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() |