feat: 모든 카테고리(HW, SW, SW 사용자) DB 일괄 덮어쓰기 저장 기능 구현

2026-04-17 15:07:54 +09:00
parent a805d9ce06
commit c5c6acea6a
27 changed files with 2863 additions and 996 deletions
--- a/src/styles/table.css
+++ b/src/styles/table.css
@@ -0,0 +1,104 @@
+/* --- Table View & Filter Styles --- */
+
+.search-bar {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1.25rem;
+  background-color: var(--white);
+  padding: 1.5rem;
+  border: 1px solid var(--border-color);
+  border-radius: 8px;
+  align-items: flex-end;
+}
+
+.search-item {
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+}
+
+.search-item.flex-1 {
+  flex: 1;
+}
+
+.search-item label {
+  font-size: 11px;
+  font-weight: 800;
+  color: var(--text-muted);
+}
+
+.search-item input, 
+.search-item select {
+  height: 38px;
+  padding: 0 1rem;
+  border: 1px solid var(--border-color);
+  border-radius: 4px;
+  font-size: 14px;
+  outline: none;
+}
+
+.search-item select {
+  padding-right: 2.5rem;
+  appearance: none;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 0.75rem center;
+}
+
+.btn-reset {
+  height: 38px !important;
+  padding: 0 0.8rem !important;
+  font-size: 12px !important;
+  display: inline-flex !important;
+  align-items: center !important;
+  gap: 0.35rem !important;
+  border-radius: 4px !important;
+}
+
+.table-container {
+  background-color: var(--white);
+  border-top: 1px solid var(--border-color);
+  border-bottom: 1px solid var(--border-color);
+  border-left: none;
+  border-right: none;
+  overflow: auto;
+  max-height: calc(100vh - 240px);
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+th, td {
+  padding: 1rem 1.5rem;
+  border-bottom: 1px solid var(--border-color);
+  text-align: left;
+  white-space: nowrap;
+}
+
+th {
+  background-color: #FAFAFA;
+  font-weight: 700;
+  color: var(--text-muted);
+  font-size: 12px;
+  position: sticky;
+  top: 0;
+  z-index: 10;
+  box-shadow: inset 0 -1px 0 var(--border-color);
+  text-transform: uppercase;
+}
+
+td {
+  font-size: 14px;
+}
+
+tbody tr:hover {
+  background-color: #F9FAFB;
+}
+
+.btn-sm {
+  padding: 0.25rem 0.5rem;
+  font-size: 11px;
+  height: 24px;
+}