132 lines
3.8 KiB
JavaScript
132 lines
3.8 KiB
JavaScript
class Index {
|
|
constructor () {
|
|
this.index = 0;
|
|
this.principal = []
|
|
|
|
footer();
|
|
this.getClassList()
|
|
}
|
|
|
|
|
|
async getClassList() {
|
|
|
|
var self = this;
|
|
if (localStorage.getItem("principal") == null) {
|
|
var res = await indexServe.classList();
|
|
this.principal = res.principal
|
|
localStorage.setItem("principal", JSON.stringify(this.principal))
|
|
localStorage.setItem("additional", JSON.stringify(res.additional))
|
|
} else {
|
|
this.principal = JSON.parse(localStorage.getItem("principal"))
|
|
}
|
|
console.log("123456",this.principal)
|
|
|
|
|
|
this.principal.forEach((v,i) => {
|
|
$(".header_menu ul").html(`
|
|
<li class="${i == 0 ? 'active' : ''}">${v.title}</li>
|
|
`)
|
|
|
|
$(".page_wrapper").html(`
|
|
<div class="swiper-slide">
|
|
<div class="list">
|
|
</div>
|
|
</div>
|
|
`);
|
|
|
|
_(".swiper-wrapper .swiper-slide").forEach(v => {
|
|
v.onscroll = () => {
|
|
const {clientHeight, scrollHeight, scrollTop} = v;
|
|
const distance = scrollHeight- scrollTop - clientHeight;
|
|
if(distance <= 0) {
|
|
// 首页
|
|
console.log("滚动到底部...");
|
|
if (this.index == 0) {
|
|
this.getIndex()
|
|
} else {
|
|
this.principal[this.index].page += 1
|
|
if (this.principal[this.index].page <= this.principal[this.index].total_page) {
|
|
this.getClassListArr("more")
|
|
} else {
|
|
console.log("已经没有数据了！！！");
|
|
}
|
|
}
|
|
}
|
|
}
|
|
})
|
|
})
|
|
|
|
click(_(".header_menu ul li"), function () {
|
|
self.changeActive(this.index)
|
|
})
|
|
|
|
this.getIndex()
|
|
this.initPage()
|
|
}
|
|
|
|
async getClassListArr(type = "click") {
|
|
var getData = async () => {
|
|
var res = await indexServe.classListArr({
|
|
page: this.principal[this.index].page,
|
|
id: this.principal[this.index].id
|
|
});
|
|
|
|
this.principal[this.index].total_page = res.total_page
|
|
|
|
this.principal[this.index].content = [
|
|
...this.principal[this.index].content,
|
|
...res.data
|
|
];
|
|
|
|
item(
|
|
_(".swiper-slide .list")[this.index],
|
|
// this.principal[this.index].content
|
|
res.data
|
|
)
|
|
}
|
|
|
|
if (type == "click") {
|
|
if (this.principal[this.index].id != -1) {
|
|
if (this.principal[this.index].content.length == 0) {
|
|
getData()
|
|
}
|
|
}
|
|
} else {
|
|
getData()
|
|
}
|
|
}
|
|
|
|
changeActive(index) {
|
|
this.index = index
|
|
_(".header_menu ul li").forEach(v => v.remove("active"))
|
|
_(".header_menu ul li")[index].add("active")
|
|
this.mySwiper.slideTo(index)
|
|
}
|
|
|
|
async getIndex() {
|
|
var res = await indexServe.index();
|
|
this.principal[this.index].content = [
|
|
...this.principal[this.index].content,
|
|
...res.list
|
|
];
|
|
|
|
item(_(".swiper-slide .list")[this.index], res.list)
|
|
|
|
}
|
|
|
|
initPage() {
|
|
var self = this;
|
|
this.mySwiper = new Swiper('.swiper-container', {
|
|
direction: 'horizontal',
|
|
on:{
|
|
slideNextTransitionEnd: function() {
|
|
|
|
self.changeActive(this.activeIndex)
|
|
self.getClassListArr()
|
|
},
|
|
},
|
|
})
|
|
}
|
|
}
|
|
|
|
new Index() |