39ef32a9ac
Fixes display bug where P0 issues were shown as P2 due to JavaScript treating 0 as falsy. Also adds P0 to the priority filter dropdown. Changes: - Replace || with ?? operator for priority defaults in monitor UI - Add P0 option to priority filter selector Co-authored-by: Zack Rosen <zjrosen@users.noreply.github.com>
126 lines
4.9 KiB
HTML
126 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>bd monitor - Issue Tracker</title>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.min.css">
|
|
<link rel="stylesheet" href="/static/css/styles.css">
|
|
</head>
|
|
<body>
|
|
<div class="loading-overlay" id="loading-overlay">
|
|
<div class="spinner"></div>
|
|
</div>
|
|
|
|
<div class="header">
|
|
<div>
|
|
<h1>bd monitor</h1>
|
|
<p>Real-time issue tracking dashboard</p>
|
|
</div>
|
|
<div class="connection-status disconnected" id="connection-status">
|
|
<span class="connection-dot disconnected" id="connection-dot"></span>
|
|
<span id="connection-text">Connecting...</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="error-message" id="error-message"></div>
|
|
|
|
<div class="main-container">
|
|
<div class="card stats-card">
|
|
<h2>Statistics</h2>
|
|
<div class="stats-grid" id="stats-grid">
|
|
<div class="stat-item" id="stat-item-total">
|
|
<div class="stat-value" id="stat-total">-</div>
|
|
<div class="stat-label">Total Issues</div>
|
|
</div>
|
|
<div class="stat-item" id="stat-item-in-progress">
|
|
<div class="stat-value" id="stat-in-progress">-</div>
|
|
<div class="stat-label">In Progress</div>
|
|
</div>
|
|
<div class="stat-item" id="stat-item-open">
|
|
<div class="stat-value" id="stat-open">-</div>
|
|
<div class="stat-label">Open</div>
|
|
</div>
|
|
<div class="stat-item" id="stat-item-closed">
|
|
<div class="stat-value" id="stat-closed">-</div>
|
|
<div class="stat-label">Closed</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card filters-card">
|
|
<div class="filter-controls">
|
|
<div class="filter-group">
|
|
<div class="label-with-action">
|
|
<label for="filter-status">Status</label>
|
|
</div>
|
|
<select id="filter-status" multiple>
|
|
<option value="open" selected>Open</option>
|
|
<option value="in_progress">In Progress</option>
|
|
<option value="closed">Closed</option>
|
|
</select>
|
|
<button id="toggle-status" class="button-link" title="Toggle Select All/None">Select All</button>
|
|
</div>
|
|
<div class="filter-group">
|
|
<label for="filter-priority">Priority</label>
|
|
<select id="filter-priority" multiple>
|
|
<option value="0" selected>P0</option>
|
|
<option value="1" selected>P1</option>
|
|
<option value="2" selected>P2</option>
|
|
<option value="3" selected>P3</option>
|
|
</select>
|
|
<button id="toggle-priority" class="button-link" title="Toggle Select All/None">Select All</button>
|
|
</div>
|
|
<div class="filter-group search-group">
|
|
<label for="filter-text">Search</label>
|
|
<input type="text" id="filter-text" placeholder="Search issues...">
|
|
<button id="clear-text" class="button-link" title="Clear Search">Clear</button>
|
|
</div>
|
|
<div class="filter-group action-group">
|
|
<button class="reload-button" id="reload-button" title="Reload all data">
|
|
🔄 Reload
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card issues-card">
|
|
<h2>Issues</h2>
|
|
<table id="issues-table">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Title</th>
|
|
<th>Status</th>
|
|
<th>Priority</th>
|
|
<th>Type</th>
|
|
<th>Assignee</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="issues-tbody">
|
|
<tr><td colspan="6"><div class="spinner"></div></td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile card view -->
|
|
<div class="issues-card-view" id="issues-card-view">
|
|
<div class="spinner"></div>
|
|
</div>
|
|
|
|
<!-- Modal for issue details -->
|
|
<div id="issue-modal" class="modal">
|
|
<div class="modal-content">
|
|
<span class="close">×</span>
|
|
<h2 id="modal-title">Issue Details</h2>
|
|
<div id="modal-body">
|
|
<p>Loading...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/js/app.js"></script>
|
|
</body>
|
|
</html>
|