/* 详情页和独立页面需要用到的JS */
console.time('Wallpaper.js执行时长');
document.addEventListener('DOMContentLoaded', () => {
/* 是否正在请求 */
let isLoading = false;
/* 查询字段 */
let queryData = {
cid: '',
start: 0,
count: 30
};
/* 总页数 */
let total = 0;
/* 获取壁纸分类 */
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: {
routeType: 'wallpaper_type'
},
success(res) {
let htmlStr = '';
if (res.code !== 1) return (htmlStr = '壁纸抓取失败！请联系作者！');
res.data.forEach(_ => (htmlStr += `${_.name}`));
$('.joe_wallpaper__type-list').html(htmlStr);
$('.joe_wallpaper__type-list .item').first().click();
queryData.cid = $('.joe_wallpaper__type-list .item').first().attr('data-cid');
}
});
/* 切换类目 */
$('.joe_wallpaper__type-list').on('click', '.item', function () {
const cid = $(this).attr('data-cid');
if (queryData.cid === cid || isLoading) return;
$(this).addClass('active').siblings().removeClass('active');
queryData.cid = cid;
queryData.start = 0;
getList();
});
/* 渲染DOM */
function getList() {
isLoading = true;
$('.joe_wallpaper__loading').css('display', 'flex');
$('.joe_wallpaper__list').html('');
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: {
routeType: 'wallpaper_list',
cid: queryData.cid,
start: queryData.start,
count: queryData.count
},
success(res) {
let htmlStr = '';
if (res.code !== 1) return;
res.data.forEach(_ => {
htmlStr += `
`;
});
$('.joe_wallpaper__list').html(htmlStr);
new LazyLoad('.wallpaper_lazyload');
total = res.total;
isLoading = false;
$('.joe_wallpaper__loading').css('display', 'none');
initPagination();
}
});
}
/* 初始化分页 */
function initPagination() {
let htmlStr = '';
if (queryData.start / queryData.count !== 0) htmlStr += ``;
htmlStr += ``;
if (queryData.start != total) htmlStr += ``;
if (queryData.start < total) htmlStr += ``;
$('.joe_wallpaper__pagination').html(htmlStr);
}
/* 切换分页 */
$('.joe_wallpaper__pagination').on('click', '.joe_wallpaper__pagination-item', function () {
const start = $(this).attr('data-start');
if (!start || isLoading) return;
queryData.start = Number(start);
getList();
});
console.timeEnd('Wallpaper.js执行时长');
});