style: revert content/logic to main while preserving Vercel UI styles

- Reverted HWModal to unified form structure from main branch
- Restored original field positions and visibility logic in all modals
- Applied Vercel-inspired CSS classes and removed legacy inline styles
- Restored SwDashboard 2x2 layout from main
- Cleaned up unused modular form files
- Fixed TypeError related to ASSET_MFR schema key
This commit is contained in:
2026-06-17 10:46:24 +09:00
parent 73ef13f3a5
commit b37981506e
14 changed files with 812 additions and 631 deletions

View File

@@ -4,10 +4,10 @@ import { API_BASE_URL } from '../../core/utils';
export class PCFlowModal {
private static instance: PCFlowModal | null = null;
private modalEl: HTMLElement | null = null;
private currentFlowType: 'checkout' | 'return' | 'move' = 'checkout';
// Selected state
private selectedUser: any = null;
private selectedTargetUser: any = null;
@@ -30,7 +30,7 @@ export class PCFlowModal {
this.modalEl = document.getElementById('pc-flow-modal');
this.setupEventListeners(onSave);
// Set default date to today
const dateInput = document.getElementById('pc-flow-date') as HTMLInputElement;
if (dateInput) {
@@ -59,14 +59,19 @@ export class PCFlowModal {
this.selectedTargetUser = null;
this.selectedPC = null;
this.currentFlowType = 'checkout';
const radioCheckout = document.querySelector('input[name="flow-type"][value="checkout"]') as HTMLInputElement;
if (radioCheckout) radioCheckout.checked = true;
if (radioCheckout) {
radioCheckout.checked = true;
document.querySelectorAll('.flow-type-label').forEach(l => {
l.classList.toggle('active', l.contains(radioCheckout));
});
}
// Reset text fields
const userSearch = document.getElementById('pc-flow-user-search') as HTMLInputElement;
if (userSearch) userSearch.value = '';
const targetUserSearch = document.getElementById('pc-flow-target-user-search') as HTMLInputElement;
if (targetUserSearch) targetUserSearch.value = '';
@@ -94,7 +99,7 @@ export class PCFlowModal {
label.classList.add('active');
radio.checked = true;
this.currentFlowType = radio.value as any;
// Reset selected PC when switching flow types
this.selectedPC = null;
this.updateUI();
@@ -104,16 +109,16 @@ export class PCFlowModal {
// 1. Source User Autocomplete Search
const userSearch = document.getElementById('pc-flow-user-search') as HTMLInputElement;
const userSuggestions = document.getElementById('pc-flow-user-suggestions')!;
userSearch?.addEventListener('input', () => {
const query = userSearch.value.trim().toLowerCase();
if (!query) {
userSuggestions.classList.add('hidden');
return;
}
const users = state.masterData.users || [];
const filtered = users.filter((u: any) =>
const filtered = users.filter((u: any) =>
(u.user_name && u.user_name.toLowerCase().includes(query)) ||
(u.dept_name && u.dept_name.toLowerCase().includes(query)) ||
(u.emp_no && u.emp_no.toString().includes(query))
@@ -133,7 +138,7 @@ export class PCFlowModal {
this.selectedUser = user;
userSearch.value = `${user.user_name} (${user.dept_name} / 사번:${user.emp_no || '-'})`;
userSuggestions.classList.add('hidden');
// Automatically populate details if return or move
if (this.currentFlowType === 'return' || this.currentFlowType === 'move') {
this.selectedPC = null; // Reset selection
@@ -161,16 +166,16 @@ export class PCFlowModal {
// 2. Target User Autocomplete Search (For Moves)
const targetUserSearch = document.getElementById('pc-flow-target-user-search') as HTMLInputElement;
const targetSuggestions = document.getElementById('pc-flow-target-user-suggestions')!;
targetUserSearch?.addEventListener('input', () => {
const query = targetUserSearch.value.trim().toLowerCase();
if (!query) {
targetSuggestions.classList.add('hidden');
return;
}
const users = state.masterData.users || [];
const filtered = users.filter((u: any) =>
const filtered = users.filter((u: any) =>
(u.user_name && u.user_name.toLowerCase().includes(query)) ||
(u.dept_name && u.dept_name.toLowerCase().includes(query)) ||
(u.emp_no && u.emp_no.toString().includes(query))
@@ -197,7 +202,7 @@ export class PCFlowModal {
// 3. Stock PC Autocomplete Search (For Checkout)
const stockSearch = document.getElementById('pc-flow-stock-search') as HTMLInputElement;
const stockSuggestions = document.getElementById('pc-flow-stock-suggestions')!;
const showStockSuggestions = () => {
const query = stockSearch.value.trim().toLowerCase();
@@ -205,11 +210,11 @@ export class PCFlowModal {
const pcs = state.masterData.pc || [];
const filtered = pcs.filter((p: any) => {
const status = (p.hw_status || '').trim();
const matchesQuery = !query ||
const matchesQuery = !query ||
(p.asset_code && p.asset_code.toLowerCase().includes(query)) ||
(p.model_name && p.model_name.toLowerCase().includes(query)) ||
(p.cpu && p.cpu.toLowerCase().includes(query));
return (status === '대기' || status === '미할당' || status === '재고') && matchesQuery;
});
@@ -419,7 +424,7 @@ export class PCFlowModal {
const userPcsList = document.getElementById('user-pcs-list')!;
if (this.selectedUser && (this.currentFlowType === 'return' || this.currentFlowType === 'move')) {
const allPcs = state.masterData.pc || [];
const userPcs = allPcs.filter((p: any) =>
const userPcs = allPcs.filter((p: any) =>
(p.emp_no && p.emp_no.toString() === this.selectedUser.emp_no?.toString()) ||
(p.user_current && p.user_current === this.selectedUser.user_name)
);
@@ -460,7 +465,6 @@ export class PCFlowModal {
return `
<div id="pc-flow-modal" class="modal-overlay hidden">
<div class="modal-content wide">
<div class="modal-header">
<h2 class="modal-title">
<i data-lucide="refresh-cw"></i> PC 이동/반납 (불출/반납/이동)
@@ -473,7 +477,7 @@ export class PCFlowModal {
<!-- 왼쪽 영역: 입력 폼 -->
<div class="modal-form-area">
<div class="grid-form flex-col">
<!-- 1. 처리 유형 -->
<div class="form-group">
<label>1. 처리 유형 선택</label>
@@ -542,7 +546,7 @@ export class PCFlowModal {
<div class="history-header">
<h3>선택 내역 요약</h3>
</div>
<div style="display: flex; flex-direction: column; gap: 1rem;">
<!-- 사원 요약 카드 -->
<div id="summary-user-card" class="summary-info-card">
@@ -582,7 +586,6 @@ export class PCFlowModal {
<button id="btn-submit-pc-flow" class="btn btn-primary">이동/반납 처리 완료</button>
</div>
</div>
</div>
</div>
`;