[PC_Table/UI/Interface] 개인 PC 자산 수정 이력(Log) 시스템 구현 및 UI 개선 #6

New Issue

JooWangi · 2026-04-14T17:20:06+09:00

JooWangi commented

2026-04-14 17:20:06 +09:00

📝 이슈 개요

자산 관리의 투명성과 감사 추적성을 확보하기 위해 개인 PC 자산의 상세 정보 변경 사항을 기록하고 시각화하는 기능을 구현함. 또한, 기능 추가 과정에서 발생한 UI 레이아웃 이슈를 해결하고 사용자 경험을 개선함.

🚀 주요 구현 내용

1. 수정 이력(Log) 데이터 모델 및 영속화

HardwareLog 인터페이스 정의 (수정일시, 수정자, 상세 내역 포함)
엑셀 파일 내 'History' 시트를 통한 로그 데이터 입출력 기능 추가 (excelHandler.ts)
글로벌 상태(state.ts)에 logs 배열 통합

2. 모달 UI/UX 개편

개인 PC 상세 모달을 2컬럼 레이아웃으로 변경 (정보 수정 및 이력 타임라인 병렬 배치)
Lucide History 아이콘 적용 및 애니메이션 최적화
변경 사항 감지 시 수정자 입력 절차 간소화 (현재 '관리자' 계정 자동 할당 처리)

3. 기능 안정화 및 버그 수정

모달 내 누락되었던 '납품업체' 및 '품의서' 필드 복구
HTML div 중첩 오류로 인한 레이아웃 깨짐 현상 수정
oninput 금액 포맷팅 로직 정합성 확보

🛠️ 작업 파일

index.html: 모달 레이아웃 구조 개편
src/styles/modal.css: 타임라인 및 2컬럼 스타일 정의
src/excelHandler.ts: 로그 시트 I/O 로직 구현
src/components/Modal/PCModal.ts: 변경 감지 및 렌더링 로직 구현
src/main.ts: Lucide 아이콘 초기화 및 컴포넌트 연결

✅ 테스트 결과

자산 정보 수정 시 원본-수정본 비교를 통해 정확한 변경 내역 추출 확인
타임라인에서 최신순으로 수정 내역(수정자: 관리자) 표시 확인
엑셀 저장 및 불러오기 시 로그 데이터 유지 확인

## 📝 이슈 개요 자산 관리의 투명성과 감사 추적성을 확보하기 위해 개인 PC 자산의 상세 정보 변경 사항을 기록하고 시각화하는 기능을 구현함. 또한, 기능 추가 과정에서 발생한 UI 레이아웃 이슈를 해결하고 사용자 경험을 개선함. ## 🚀 주요 구현 내용 ### 1. 수정 이력(Log) 데이터 모델 및 영속화 - `HardwareLog` 인터페이스 정의 (수정일시, 수정자, 상세 내역 포함) - 엑셀 파일 내 'History' 시트를 통한 로그 데이터 입출력 기능 추가 (`excelHandler.ts`) - 글로벌 상태(`state.ts`)에 `logs` 배열 통합 ### 2. 모달 UI/UX 개편 - 개인 PC 상세 모달을 2컬럼 레이아웃으로 변경 (정보 수정 및 이력 타임라인 병렬 배치) - Lucide `History` 아이콘 적용 및 애니메이션 최적화 - 변경 사항 감지 시 수정자 입력 절차 간소화 (현재 '관리자' 계정 자동 할당 처리) ### 3. 기능 안정화 및 버그 수정 - 모달 내 누락되었던 '납품업체' 및 '품의서' 필드 복구 - HTML div 중첩 오류로 인한 레이아웃 깨짐 현상 수정 - `oninput` 금액 포맷팅 로직 정합성 확보 ## 🛠️ 작업 파일 - `index.html`: 모달 레이아웃 구조 개편 - `src/styles/modal.css`: 타임라인 및 2컬럼 스타일 정의 - `src/excelHandler.ts`: 로그 시트 I/O 로직 구현 - `src/components/Modal/PCModal.ts`: 변경 감지 및 렌더링 로직 구현 - `src/main.ts`: Lucide 아이콘 초기화 및 컴포넌트 연결 ## ✅ 테스트 결과 - 자산 정보 수정 시 원본-수정본 비교를 통해 정확한 변경 내역 추출 확인 - 타임라인에서 최신순으로 수정 내역(수정자: 관리자) 표시 확인 - 엑셀 저장 및 불러오기 시 로그 데이터 유지 확인

JooWangi changed title from ~~[PC_Table/UI/System] 개인 PC 자산 수정 이력(Log) 시스템 구현 및 UI 개선~~ to [PC_Table/UI/Interface] 개인 PC 자산 수정 이력(Log) 시스템 구현 및 UI 개선

2026-04-14 17:20:42 +09:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: Taehoon/ITAM#6