b24014/ITAM-test
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
이태훈
2026-04-17 15:07:54 +09:00
parent a805d9ce06
commit c5c6acea6a
27 changed files with 2863 additions and 996 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/components/Modal/StorageModal.ts
View File

@@ -29,7 +29,8 @@ const STORAGE_MODAL_HTML = `
<div class="modal-footer">
<button id="btn-delete-storage-asset" class="btn btn-outline btn-danger">삭제</button>
<div class="footer-actions">
<button id="btn-cancel-storage-modal" class="btn btn-outline">닫기</button>
<button id="btn-revert-storage-edit" class="btn btn-outline hidden">수정 취소</button>
<button id="btn-close-storage-footer" class="btn btn-outline">닫기</button>
<button id="btn-save-storage-asset" class="btn btn-primary">수정</button>
</div>
</div>
@@ -43,20 +44,62 @@ export function initStorageModal(renderContent: () => void, closeModals: () => v
}
const storageForm = document.getElementById('storage-asset-form') as HTMLFormElement;
const btnRevertEdit = document.getElementById('btn-revert-storage-edit') as HTMLButtonElement;
const btnSaveStorage = document.getElementById('btn-save-storage-asset') as HTMLButtonElement;
const btnDeleteStorage = document.getElementById('btn-delete-storage-asset') as HTMLButtonElement;
const btnCancelStorage = document.getElementById('btn-cancel-storage-modal') as HTMLButtonElement;
const btnCloseStorage = document.getElementById('btn-close-storage-modal') as HTMLButtonElement;
const btnCloseHeader = document.getElementById('btn-close-storage-modal') as HTMLButtonElement;
const btnCloseFooter = document.getElementById('btn-close-storage-footer') as HTMLButtonElement;
btnCancelStorage?.addEventListener('click', closeModals);
btnCloseStorage?.addEventListener('click', closeModals);
let isEditMode = false;
let currentAsset: HardwareAsset | null = null;
const setEditMode = (edit: boolean) => {
isEditMode = edit;
if (edit) {
storageForm.classList.add('is-edit-mode');
storageForm.classList.remove('is-view-mode');
btnSaveStorage.textContent = '저장';
btnRevertEdit.classList.remove('hidden');
btnCloseFooter.classList.add('hidden');
} else {
storageForm.classList.add('is-view-mode');
storageForm.classList.remove('is-edit-mode');
btnSaveStorage.textContent = '수정';
btnRevertEdit.classList.add('hidden');
btnCloseFooter.classList.remove('hidden');
if (currentAsset) fillFormData(currentAsset);
}
};
function fillFormData(asset: HardwareAsset) {
(document.getElementById('storage-asset-id') as HTMLInputElement).value = asset.id;
(document.getElementById('storage-법인') as HTMLInputElement).value = asset.법인;
(document.getElementById('storage-유형') as HTMLInputElement).value = asset.storage유형 || 'NAS';
(document.getElementById('storage-자산코드') as HTMLInputElement).value = asset.자산코드;
(document.getElementById('storage-명칭') as HTMLInputElement).value = asset.명칭;
(document.getElementById('storage-위치') as HTMLInputElement).value = asset.위치 || '';
(document.getElementById('storage-모델명') as HTMLInputElement).value = asset.모델명 || '';
(document.getElementById('storage-용량') as HTMLInputElement).value = asset.용량 || '';
(document.getElementById('storage-담당자_정') as HTMLInputElement).value = asset.담당자_정 || '';
(document.getElementById('storage-IP주소') as HTMLInputElement).value = asset.IP주소 || '';
(document.getElementById('storage-구매일') as HTMLInputElement).value = asset.구매일 || '';
(document.getElementById('storage-금액') as HTMLInputElement).value = asset.금액 || '';
}
btnRevertEdit?.addEventListener('click', () => setEditMode(false));
btnCloseHeader?.addEventListener('click', closeModals);
btnCloseFooter?.addEventListener('click', closeModals);
btnSaveStorage?.addEventListener('click', (e) => {
e.preventDefault();
if (!isEditMode) {
setEditMode(true);
return;
}
if (!storageForm.checkValidity()) { storageForm.reportValidity(); return; }
const id = (document.getElementById('storage-asset-id') as HTMLInputElement).value;
const newAsset: HardwareAsset = {
id: id || Math.random().toString(36).substring(2, 9),
type: '스토리지',
@@ -97,6 +140,7 @@ export function initStorageModal(renderContent: () => void, closeModals: () => v
}
export function openStorageModal(asset?: HardwareAsset) {
currentAsset = asset || null;
const storageForm = document.getElementById('storage-asset-form') as HTMLFormElement;
const deleteBtn = document.getElementById('btn-delete-storage-asset')!;
@@ -106,22 +150,12 @@ export function openStorageModal(asset?: HardwareAsset) {
if (asset) {
document.getElementById('storage-modal-title')!.textContent = '스토리지 상세 정보 수정';
deleteBtn.style.display = 'block';
(document.getElementById('storage-asset-id') as HTMLInputElement).value = asset.id;
(document.getElementById('storage-법인') as HTMLInputElement).value = asset.법인;
(document.getElementById('storage-유형') as HTMLInputElement).value = asset.storage유형 || 'NAS';
(document.getElementById('storage-자산코드') as HTMLInputElement).value = asset.자산코드;
(document.getElementById('storage-명칭') as HTMLInputElement).value = asset.명칭;
(document.getElementById('storage-위치') as HTMLInputElement).value = asset.위치 || '';
(document.getElementById('storage-모델명') as HTMLInputElement).value = asset.모델명 || '';
(document.getElementById('storage-용량') as HTMLInputElement).value = asset.용량 || '';
(document.getElementById('storage-담당자_정') as HTMLInputElement).value = asset.담당자_정 || '';
(document.getElementById('storage-IP주소') as HTMLInputElement).value = asset.IP주소 || '';
(document.getElementById('storage-구매일') as HTMLInputElement).value = asset.구매일 || '';
(document.getElementById('storage-금액') as HTMLInputElement).value = asset.금액 || '';
fillFormData(asset);
setEditMode(false);
} else {
document.getElementById('storage-modal-title')!.textContent = '신규 스토리지 자산 추가';
deleteBtn.style.display = 'none';
(document.getElementById('storage-asset-id') as HTMLInputElement).value = '';
setEditMode(true);
}
}