1
0
mirror of https://gitee.com/bookshelfplus/bookshelfplus synced 2025-09-01 22:53:29 +08:00
Code Issues Projects Releases Wiki Activity GitHub Gitee
Files
bookshelfplus/bookshelfplus-frontend/views/category-details.html

104 lines
3.3 KiB
HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%- include("./component/header.html"); %>
<style>
.main {
width: 80vw !important;
max-width: initial !important;
}
#book-table {
width: 100%;
/* border: 1px solid black; */
margin-top: 30px;
line-height: 2.3em;
}
tr:hover {
background-color: #f5f5f5;
}
tr a {
cursor: pointer;
/* cursor: alias; */
}
/* 在分类下隐藏书籍的分类 */
tr>*:nth-child(2) {
display: none;
}
</style>
</head>
<body>
<%- include("./component/navbar.html"); %>
<main class="main">
<!-- <h1><%= headText %></h1> -->
<div id="container">
<!-- <a href="./book">书本详情页</a> -->
</div>
<hr style="margin: 30px 0;">
<h3>该分类下的书籍</h3>
<div id="container-book">
<table id="book-table" style="width: 100%;"></table>
</div>
</main>
<%- include("./component/footer.html"); %>
<!-- 获取参数 -->
<script src="/assets/javascripts/getParams.js"></script>
<!-- 渲染表格 -->
<script src="/assets/javascripts/renderTable.js"></script>
<!-- 搜索书籍 -->
<script src="/assets/javascripts/searchBooks.js"></script>
<script>
var requestParams = getParams();
var searchbox = document.getElementById("searchInput");
var categoryId = requestParams["id"] ?? "";
console.log("categoryId", categoryId);
if (categoryId === "") {
location.href = "/search";
}
search({
tableElementId: "book-table",
searchText: null,
categoryId: categoryId
});
</script>
<script>
getRequest("/category/get", { id: categoryId })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;
var data = axiosData.data;
if (status === "success") {
console.log(data)
if (data.description == "")
data.description = "暂无描述";
var topCategory = data.parentId !== 0 ? `<a href="/category?id=${data.parentId}">上级分类</a>` : "";
document.getElementById("container").innerHTML = `
<div class="grid">
<div class="grid-item">
<h1>${data.name}</h1>
<p>分类ID: ${data.id}</p>
<p>${topCategory}</p>
</div>
<div class="grid-item">
<h2>简介</h2>
<p>${data.description}</p>
</div>
</div>`;
// 渲染后重新获取一次字体
fontmin(getPageText());
} else {
alert(`出错啦!${data.errMsg} (错误码: ${data.errCode}) `);
}
}).catch(function (error) {
console.log(error);
alert("无法连接到服务器,请检查网络连接!");
});
</script>
</body>
</html>