122 lines
2.8 KiB
JavaScript
122 lines
2.8 KiB
JavaScript
class Home {
|
|
constructor() {
|
|
footer()
|
|
this.tabs = [];
|
|
this.index = 0
|
|
this.getHome()
|
|
this.getType()
|
|
|
|
}
|
|
|
|
async getType() {
|
|
var res;
|
|
if (localStorage.getItem("principal") == null) {
|
|
var data = await indexServe.type();
|
|
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.tabs = res
|
|
console.log( this.tabs)
|
|
// 渲染横向菜单
|
|
res.forEach((v,i) => {
|
|
if (i != 0 ) {
|
|
$(".page-wrapper").innerHTML+=`
|
|
<div class="padding swiper-slide side_${i} pitem"></div>
|
|
`
|
|
}
|
|
$(".left_menu").innerHTML+=`
|
|
<li class="${i == 0 ? 'active':''}">${v.title}</li>
|
|
`
|
|
})
|
|
|
|
var li = _(".left_menu li");
|
|
|
|
var self = this;
|
|
// 初始化页面轮播图
|
|
var page = new swiper('.page-container', {
|
|
wrapper: '.page-wrapper',
|
|
on: {
|
|
slideChangeTransitionStart(index) {
|
|
li.forEach(item => item.className ="");
|
|
li[index].classList.add("active")
|
|
if (index != 0) {
|
|
self.index = index;
|
|
self.getClassList()
|
|
}
|
|
}
|
|
}
|
|
})
|
|
|
|
// 点击菜单的事件
|
|
|
|
li.forEach((v,i) => {
|
|
v.onclick = () => {
|
|
li.forEach(item => item.className ="");
|
|
v.classList.add("active")
|
|
page.slideTo(i)
|
|
if (i != 0) {
|
|
this.index = i;
|
|
this.getClassList()
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
async getHome() {
|
|
var res = await indexServe.index();
|
|
console.log(res)
|
|
res.model.res.forEach((v,i) => {
|
|
$(".model-wrapper").innerHTML+=`
|
|
<div class="swiper-slide model-slide">
|
|
${
|
|
v.map((item,index)=>{
|
|
return `
|
|
<div class="model-item">
|
|
<div class="item-img">
|
|
<img src="${item.preview}" alt="">
|
|
<span>${item.total}</span>
|
|
</div>
|
|
<p>${item.title}</p>
|
|
</div>
|
|
`
|
|
}).toString().replaceAll(",","")
|
|
}
|
|
</div>
|
|
`
|
|
});
|
|
|
|
item(".news ul", res.newest.data)
|
|
item(".tuijian ul", res.recommended.data)
|
|
|
|
var model = new swiper('.mode-container', {
|
|
wrapper: '.model-wrapper',
|
|
})
|
|
|
|
}
|
|
|
|
async getClassList() {
|
|
if (this.tabs[this.index].content.length == 0) {
|
|
var res = await indexServe.classList({
|
|
page: this.tabs[this.index].page,
|
|
id: this.tabs[this.index].id
|
|
});
|
|
this.tabs[this.index].content = res.data
|
|
this.tabs[this.index].total_page = res.total_page
|
|
|
|
item(`.side_${this.index}`, this.tabs[this.index].content)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
new Home();
|
|
|
|
|