Files
ClassContent/历届学生/front-end-team-10/项目练习/上课项目/枸杞社/js/page/info.js
2024-09-27 02:06:13 +08:00

72 lines
2.1 KiB
JavaScript

class Info {
constructor() {
this.infoArr = []
this.likeArr = JSON.parse(localStorage.getItem("like")) == null
? []
: JSON.parse(localStorage.getItem("like"))
title(query("title"), `<i class="like iconfont icon-xin"></i>`)
this.getInfo()
this.like()
}
async getInfo() {
this.infoArr = await indexService.info({
id: query("id"),
quantity: query("quantity")
});
this.infoArr.forEach((v,i) => {
var img = document.createElement("img")
img.src = v;
img.onload = () => {
$(".imgList").innerHTML += `
<figure>
<a href="${v}" data-size="${img.width}x${img.height}">
<img src="${v}" alt="${v}" />
</a>
<figcaption itemprop="caption description">${query("title")} ${i+1}P</figcaption>
</figure>
`
}
});
initPhotoSwipeFromDOM('.imgList');
}
like() {
var res = this.likeArr.filter((v,i) => {
return query("id") == v.id
});
if (res.length != 0) {
$(".like").classList.replace("icon-xin", "icon-aixin")
}
click(".like", () => {
// 空心 未收藏 去收藏
if ($(".like").classList.contains("icon-xin")) {
$(".like").classList.replace("icon-xin", "icon-aixin")
this.likeArr.push({
id: query("id"),
quantity: query("quantity"),
img: this.infoArr[0]
});
} else {
$(".like").classList.replace("icon-aixin", "icon-xin")
this.likeArr = this.likeArr.filter((v,i) => {
return query("id") != v.id
});
}
localStorage.setItem("like", JSON.stringify(this.likeArr))
})
}
}
new Info();