Files
bpsets/views/index.ejs
Minhyeok Park f6e86cb4bc
All checks were successful
/ deploy_site (push) Successful in 2m18s
feat: add search and sort feature
2025-01-15 20:53:34 +09:00

72 lines
2.9 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
<title>BPSets</title>
</head>
<body class="bg-gray-100 text-gray-800">
<div class="container mx-auto p-4">
<%- include('partial/page_header.ejs') %>
<div class="relative mb-4">
<input
type="text"
id="tableFilter"
placeholder="Search..."
class="w-full px-4 py-2 border rounded focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<ul
id="autocompleteSuggestions"
class="absolute bg-white border border-gray-300 rounded shadow-md w-full max-h-48 overflow-y-auto hidden"
></ul>
</div>
<table class="min-w-full bg-white shadow rounded-lg overflow-hidden" id="bpTable">
<thead class="bg-gray-200 text-gray-600">
<tr>
<th class="py-3 px-4 cursor-pointer" data-sort="number">
# <span class="sort-indicator"><i class="fas fa-sort"></i></span>
</th>
<th class="py-3 px-4 cursor-pointer" data-sort="string">
Name <span class="sort-indicator"><i class="fas fa-sort"></i></span>
</th>
<th class="py-3 px-4 cursor-pointer" data-sort="string">
B.P. Category <span class="sort-indicator"><i class="fas fa-sort"></i></span>
</th>
<th class="py-3 px-4 cursor-pointer" data-sort="number">
Priority <span class="sort-indicator"><i class="fas fa-sort"></i></span>
</th>
<th class="py-3 px-4">Fail/Pass</th>
<th class="py-3 px-4 cursor-pointer" data-sort="number">
Pass Percent <span class="sort-indicator"><i class="fas fa-sort"></i></span>
</th>
<th class="py-3 px-4">Action</th>
</tr>
</thead>
<tbody>
<% bpStatus.forEach(({ category, metadatas }) => { %>
<tr class="bg-gray-50" data-category="<%= category %>">
<th colspan="7" class="py-3 px-4 text-left text-lg font-semibold text-gray-700">
<%= category %> (<%= metadatas.length %>)
</th>
</tr>
<% metadatas.forEach((metadata) => { %>
<%- include('./partial/bpset_item.ejs', { metadata, category }) %>
<%- include('./partial/bpset_details.ejs', { metadata }) %>
<%- include('./partial/bpset_logs.ejs', { metadata }) %>
<%- include('./partial/bpset_fixdialog.ejs', { metadata }) %>
<% }) %>
<% }) %>
</tbody>
</table>
</div>
<%- include('./style.ejs') %>
<%- include('./script.ejs') %>
</body>
</html>