完成报表中心
This commit is contained in:
Zzzz
@@ -0,0 +1,147 @@
|
||||
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Reports - MZH Library</title>
|
||||
<link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/app.css">
|
||||
</head>
|
||||
<body>
|
||||
<%@ include file="/WEB-INF/jsp/common/header.jspf" %>
|
||||
<main class="page-shell">
|
||||
<section class="dashboard-hero catalog-hero" aria-labelledby="reports-title">
|
||||
<div>
|
||||
<p class="eyebrow">Reports</p>
|
||||
<h1 id="reports-title">Report center</h1>
|
||||
<p>Review collection inventory, borrowing health, overdue loans, and popular books.</p>
|
||||
</div>
|
||||
<a class="button button-secondary" href="${pageContext.request.contextPath}/borrowing">Borrowing records</a>
|
||||
</section>
|
||||
|
||||
<c:if test="${not empty errorMessage}">
|
||||
<div class="message message-error" role="alert">
|
||||
<c:out value="${errorMessage}" />
|
||||
</div>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${not empty reportCenter}">
|
||||
<section class="report-grid" aria-label="Report summary">
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Inventory</p>
|
||||
<h2>Total titles</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.inventorySummary.totalTitles}" /></p>
|
||||
</article>
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Inventory</p>
|
||||
<h2>Total copies</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.inventorySummary.totalCopies}" /></p>
|
||||
</article>
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Inventory</p>
|
||||
<h2>Available copies</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.inventorySummary.availableCopies}" /></p>
|
||||
</article>
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Attention</p>
|
||||
<h2>Unavailable or empty</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.inventorySummary.unavailableOrEmptyTitles}" /></p>
|
||||
</article>
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Borrowing</p>
|
||||
<h2>Currently borrowed</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.borrowingSummary.activeLoans}" /></p>
|
||||
</article>
|
||||
<article class="report-card">
|
||||
<p class="eyebrow">Borrowing</p>
|
||||
<h2>Returned records</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.borrowingSummary.returnedLoans}" /></p>
|
||||
</article>
|
||||
<article class="report-card report-card-alert">
|
||||
<p class="eyebrow">Borrowing</p>
|
||||
<h2>Overdue loans</h2>
|
||||
<p class="report-metric"><c:out value="${reportCenter.borrowingSummary.overdueLoans}" /></p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<section class="table-panel" aria-labelledby="overdue-report-title">
|
||||
<h2 id="overdue-report-title">Overdue list</h2>
|
||||
<c:choose>
|
||||
<c:when test="${empty reportCenter.overdueRows}">
|
||||
<p class="empty-state">No active overdue borrowing records.</p>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<div class="table-scroll">
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Reader</th>
|
||||
<th scope="col">Book</th>
|
||||
<th scope="col">Due date</th>
|
||||
<th scope="col">Overdue days</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<c:forEach var="row" items="${reportCenter.overdueRows}">
|
||||
<tr>
|
||||
<td>
|
||||
<strong><c:out value="${row.readerIdentifier}" /></strong>
|
||||
<div class="muted-text"><c:out value="${row.readerName}" /></div>
|
||||
</td>
|
||||
<td>
|
||||
<strong><c:out value="${row.bookIdentifier}" /></strong>
|
||||
<div class="muted-text"><c:out value="${row.bookTitle}" /></div>
|
||||
</td>
|
||||
<td><c:out value="${row.dueAtText}" /></td>
|
||||
<td>
|
||||
<span class="status-pill status-overdue">
|
||||
<c:out value="${row.overdueDays}" /> days
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</section>
|
||||
|
||||
<section class="table-panel" aria-labelledby="popular-report-title">
|
||||
<h2 id="popular-report-title">Popular borrowing ranking</h2>
|
||||
<c:choose>
|
||||
<c:when test="${empty reportCenter.popularBooks}">
|
||||
<p class="empty-state">No borrowing records are available for ranking yet.</p>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<div class="table-scroll">
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Book</th>
|
||||
<th scope="col">Author</th>
|
||||
<th scope="col">Borrow records</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<c:forEach var="row" items="${reportCenter.popularBooks}">
|
||||
<tr>
|
||||
<td>
|
||||
<strong><c:out value="${row.bookIdentifier}" /></strong>
|
||||
<div class="muted-text"><c:out value="${row.title}" /></div>
|
||||
</td>
|
||||
<td><c:out value="${row.author}" /></td>
|
||||
<td><c:out value="${row.borrowCount}" /></td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</section>
|
||||
</c:if>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user