Taehoon/ITAM
2
0
Fork 0
Code Issues 25 Pull Requests Actions Packages Projects Releases Wiki Activity

style: unify UI styling & restore dashboard logic

Browse Source 
- Restored HW/SW Dashboard full features (Chart.js, filters, tables) from main
- Unified Search Bar & Filter Bar across all views (List, Location)
- Integrated asset identity info into all Modal Headers
- Standardized 'Remove Row' buttons as high-visibility circular circles
- Centralized hardcoded inline styles into dedicated CSS files
- Fixed various ReferenceErrors and layout regressions in HWModal
This commit is contained in:
이태훈
2026-06-17 12:29:26 +09:00
parent b37981506e
commit 89d3ac2e89
16 changed files with 1440 additions and 596 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/Modal/SWUserModal.ts
View File

@@ -22,9 +22,9 @@ class SwUserModal extends BaseModal {
<div class="modal-body">
<div class="sw-info-summary" id="sw-user-sw-info"></div>
<div class="user-list-toolbar" style="display:flex; justify-content:space-between; margin-bottom:1rem; align-items:center;">
<h3 class="detail-section-title">할당된 사용자 목록</h3>
<button type="button" id="btn-open-add-user" class="btn btn-primary btn-sm"><i data-lucide="plus"></i> 사용자 추가</button>
<div class="flex justify-between items-center mb-4">
<h3 class="detail-section-title mb-0">할당된 사용자 목록</h3>
<button type="button" id="btn-open-add-user" class="btn btn-primary btn-sm"><i data-lucide="plus" class="icon-sm"></i> 사용자 추가</button>
</div>
<div class="table-container">
@@ -35,9 +35,9 @@ class SwUserModal extends BaseModal {
<th>부서</th>
<th>직위</th>
<th>이름</th>
<th>사용기간</th>
<th>신청서</th>
<th>관리</th>
<th class="text-center">사용기간</th>
<th class="text-center">신청서</th>
<th class="text-center">관리</th>
</tr>
</thead>
<tbody id="sw-user-table-body"></tbody>
@@ -54,14 +54,14 @@ class SwUserModal extends BaseModal {
</div>
<!-- 사용자 추가/수정 서브 모달 -->
<div id="sw-user-edit-modal" class="modal-overlay hidden" style="z-index: 1100;">
<div class="modal-content" style="max-width: 400px;">
<div id="sw-user-edit-modal" class="modal-overlay hidden sub-modal">
<div class="modal-content narrow">
<div class="modal-header">
<h3 id="sw-user-edit-title" class="modal-title">사용자 정보</h3>
<button id="btn-close-user-edit" class="btn-icon">&times;</button>
</div>
<div class="modal-body">
<form id="sw-user-edit-form" class="grid-form" style="grid-template-columns: 1fr;">
<form id="sw-user-edit-form" class="grid-form vertical-form">
<input type="hidden" id="edit-user-index" value="-1" />
<div class="form-group">
<label>조직</label>
@@ -84,7 +84,7 @@ class SwUserModal extends BaseModal {
<div class="input-with-btn">
<input type="text" id="new-user-시작일" />
<button type="button" class="btn-icon" onclick="const p = document.getElementById('new-user-시작일-picker'); p.value = document.getElementById('new-user-시작일').value; p.showPicker();">
<i data-lucide="calendar"></i>
<i data-lucide="calendar" class="icon-sm"></i>
</button>
<input type="date" id="new-user-시작일-picker" class="hidden-picker" onchange="document.getElementById('new-user-시작일').value = this.value" tabindex="-1" />
</div>
@@ -94,7 +94,7 @@ class SwUserModal extends BaseModal {
<div class="input-with-btn">
<input type="text" id="new-user-종료일" />
<button type="button" class="btn-icon" onclick="const p = document.getElementById('new-user-종료일-picker'); p.value = document.getElementById('new-user-종료일').value; p.showPicker();">
<i data-lucide="calendar"></i>
<i data-lucide="calendar" class="icon-sm"></i>
</button>
<input type="date" id="new-user-종료일-picker" class="hidden-picker" onchange="document.getElementById('new-user-종료일').value = this.value" tabindex="-1" />
</div>
@@ -163,7 +163,7 @@ class SwUserModal extends BaseModal {
protected fillFormData(asset: any): void {
const swInfo = document.getElementById('sw-user-sw-info')!;
swInfo.innerHTML = `
<div class="sw-info-header" style="margin-bottom: 1.5rem; border-bottom: 1px solid var(--hairline); padding-bottom: 1rem;">
<div class="sw-info-header border-b border-hairline pb-4 mb-6">
<div class="detail-label-sm">${asset.purchase_corp || asset.법인 || ''}</div>
<div class="asset-code-title">${asset.product_name || asset.제품명 || ''}</div>
</div>
@@ -184,7 +184,7 @@ class SwUserModal extends BaseModal {
if (!tbody) return;
tbody.innerHTML = '';
if (this.tempSwUsers.length === 0) {
tbody.innerHTML = '<tr><td colspan="7" style="text-align:center; padding:2rem; color:var(--mute);">할당된 사용자가 없습니다.</td></tr>';
tbody.innerHTML = '<tr><td colspan="7" class="empty-cell text-center p-8">할당된 사용자가 없습니다.</td></tr>';
return;
}
@@ -195,12 +195,12 @@ class SwUserModal extends BaseModal {
<td>${user.부서 || ''}</td>
<td>${user.직위 || ''}</td>
<td>${user.이름 || ''}</td>
<td>${user.사용기간 || ''}</td>
<td style="text-align:center;">${user.신청서명 ? '<i data-lucide="paperclip" class="text-primary"></i>' : '-'}</td>
<td>
<div style="display:flex; gap:0.5rem;">
<td class="text-center">${user.사용기간 || ''}</td>
<td class="text-center">${user.신청서명 ? '<i data-lucide="paperclip" class="text-primary icon-sm"></i>' : '-'}</td>
<td class="text-center">
<div class="flex gap-2 justify-center items-center">
<button class="btn btn-outline btn-sm btn-edit-user" data-idx="${idx}">수정</button>
<button class="btn btn-outline btn-sm btn-danger btn-del-user" data-idx="${idx}">삭제</button>
<button class="btn-circle-remove btn-del-user" data-idx="${idx}">&times;</button>
</div>
</td>
`;