# UI/화면 분석 > **분석 대상:** 5130 레거시 견적 시스템 화면 > **분석 일자:** 2025-12-19 --- ## 화면 목록 ### 메인 화면 | 파일 | 화면명 | 설명 | |------|--------|------| | `list.php` | 견적 목록 | 견적서 리스트, 검색, 필터링 | | `write_form.php` | 견적 작성 | 견적서 작성/수정 폼 (103KB, 핵심 파일) | | `viewEstimate.php` | 견적서 보기 | 견적서 조회/출력 | | `statistics.php` | 견적 통계 | 통계 대시보드 | ### 견적 유형별 화면 | 파일 | 화면명 | 설명 | |------|--------|------| | `estimate.php` | 스크린 견적 | 스크린 견적서 메인 | | `estimateSlat.php` | 슬랫 견적 | 슬랫(철재) 견적서 메인 | | `estimateUnit.php` | 단가 견적 | 단가 기반 견적서 | | `screen_view_original.php` | 스크린 상세 | 스크린 견적 상세 뷰 | | `slat_view_original.php` | 슬랫 상세 | 슬랫 견적 상세 뷰 | ### 상세/수정 화면 | 파일 | 화면명 | 설명 | |------|--------|------| | `edit.php` | 견적 수정 | 스크린 견적 수정 | | `edit_slat.php` | 슬랫 수정 | 슬랫 견적 수정 | | `viewEstimateDetail.php` | 상세 보기 | 견적 상세 정보 | | `EsDetail_screen.php` | 스크린 상세 | 스크린 항목 상세 | | `EsDetail_slat.php` | 슬랫 상세 | 슬랫 항목 상세 | | `compare.php` | 견적 비교 | 견적 버전 비교 | ### 출력/다운로드 | 파일 | 화면명 | 설명 | |------|--------|------| | `print_list.php` | 목록 인쇄 | 견적 목록 인쇄용 | | `downloadExcel.php` | 엑셀 다운로드 | 견적서 엑셀 내보내기 | | `saveExcel.php` | 엑셀 저장 | 엑셀 파일 저장 | --- ## 1. 견적 목록 (list.php) ### 화면 구조 ``` ┌─────────────────────────────────────────────────────────────┐ │ 견적 List [새로고침] │ ├─────────────────────────────────────────────────────────────┤ │ ▷ 123건 접수일 [2025-02-19] ~ [2025-12-19] │ │ [전체] [스크린] [철재] 제품모델▼ 검색[______] [검색] │ │ [신규] │ ├─────────────────────────────────────────────────────────────┤ │ 번호│접수일 │견적번호 │구분 │제품│수량│금액 │발주처...│ │─────│────────│────────────│──────│────│────│──────│─────────│ │ 123 │25-12-19│KD-PR-251219│스크린│KSS01│ 5 │5,000K│(주)ABC │ │ 122 │25-12-18│KD-PR-251218│철재 │KFS01│ 3 │3,200K│(주)DEF │ │ ... │ │ │ │ │ │ │ │ └─────────────────────────────────────────────────────────────┘ ``` ### 필터/검색 조건 | 항목 | 타입 | 설명 | |------|------|------| | `fromdate` | date | 시작일 (기본: -10개월) | | `todate` | date | 종료일 (기본: +1개월) | | `major_category` | radio | 전체/스크린/철재 | | `model_name` | select | 제품 모델 선택 | | `search` | text | 전체 컬럼 검색 | ### 테이블 컬럼 | 컬럼 | 폭 | 설명 | |------|-----|------| | 번호 | 30px | 일련번호 (역순) | | 접수일 | 100px | indate | | 견적번호 | 100px | pjnum | | 구분 | 80px | major_category (스크린/철재) | | 제품코드 | 80px | model_name | | 수량 | 80px | estimateSurang | | 금액 | 80px | estimateTotal | | 발주처 | 150px | secondord | | 담당자 | 80px | secondordman | | 연락처 | 120px | secondordmantel | | 현장명 | 200px | outworkplace | | 작성자 | 80px | orderman | | 비고 | 300px | comment | ### 기능 버튼 - **새로고침**: `location.reload()` - **검색**: 필터 조건으로 목록 갱신 - **신규**: `write_form.php` 이동 --- ## 2. 견적 작성 폼 (write_form.php) ### 화면 모드 | 모드 | 설명 | |------|------| | 신규 (`mode=''`) | 새 견적 작성 | | 수정 (`mode=modify`) | 기존 견적 수정 | | 복사 (`mode=copy`) | 기존 견적 복사하여 신규 생성 | | 발주 (`header=header`) | 수주에서 발주 산출 | | 스크린 수정 (`itemoption=screen`) | 스크린 발주서 수정 | | 슬랫 수정 (`itemoption=slat`) | 철재스라트 발주서 수정 | ### 화면 구조 (추정) ``` ┌─────────────────────────────────────────────────────────────┐ │ 견적 산출 │ ├─────────────────────────────────────────────────────────────┤ │ ┌──────────── 기본 정보 ────────────┐ │ │ │ 접수일: [2025-12-19] │ │ │ │ 견적번호: KD-PR-251219-01 │ │ │ │ 담당자: 홍길동 │ │ │ │ 현장명: (주)ABC 빌딩 │ │ │ └───────────────────────────────────┘ │ │ │ │ ┌──────────── 발주처 정보 ──────────┐ │ │ │ 발주처: ____________ │ │ │ │ 담당자: ____________ 연락처: ____│ │ │ └───────────────────────────────────┘ │ │ │ │ ┌──────────── 제품 정보 ────────────┐ │ │ │ 대분류: (●)스크린 (○)철재 │ │ │ │ 모델명: [KSS01 ▼] │ │ │ │ 제작폭: [160] 제작높이: [350] │ │ │ │ 마구리윙: [50] │ │ │ └───────────────────────────────────┘ │ │ │ │ ┌──────────── 옵션 체크 ────────────┐ │ │ │ [✓] 절곡 [✓] 모터 [✓] 보증 │ │ │ │ [✓] 슬랫 [✓] 부자재 │ │ │ └───────────────────────────────────┘ │ │ │ │ ┌──────────── 견적 항목 ────────────┐ │ │ │ 검사비: [50,000] │ │ │ │ │ │ │ │ [스크린 견적 테이블] │ │ │ │ [슬랫 견적 테이블] │ │ │ └───────────────────────────────────┘ │ │ │ │ ┌──────────── 금액 합계 ────────────┐ │ │ │ 수량: 5 합계: 5,000,000 │ │ │ │ 할인율: 10% 할인액: 500,000 │ │ │ │ 최종금액: 4,500,000 │ │ │ └───────────────────────────────────┘ │ │ │ │ [저장] [취소] [삭제] │ └─────────────────────────────────────────────────────────────┘ ``` ### 주요 입력 필드 #### 기본 정보 | 필드 | 변수명 | 타입 | 기본값 | |------|--------|------|--------| | 접수일 | `indate` | date | 오늘 | | 견적번호 | `pjnum` | text | 자동생성 | | 담당자 | `orderman` | text | 로그인 사용자 | | 현장명 | `outworkplace` | text | - | #### 발주처 정보 | 필드 | 변수명 | 타입 | |------|--------|------| | 발주처 | `secondord` | text | | 담당자 | `secondordman` | text | | 연락처 | `secondordmantel` | text | #### 제품 정보 | 필드 | 변수명 | 타입 | 기본값 | |------|--------|------|--------| | 대분류 | `major_category` | radio | 스크린 | | 모델명 | `model_name` | select | - | | 제작폭 | `makeWidth` | number | 160 (스크린), 110 (슬랫) | | 제작높이 | `makeHeight` | number | 350 | | 마구리윙 | `maguriWing` | number | 50 | #### 옵션 체크박스 | 필드 | 변수명 | 영향 | |------|--------|------| | 절곡 | `steel` | 케이스, 레일, 연기차단재, 하장바, L바, 보강평철 | | 모터 | `motor` | 모터 가격 포함 | | 보증 | `warranty` | 보증기간 표시 | | 슬랫 | `slatcheck` | 주자재(슬랫), 조인트바 | | 부자재 | `partscheck` | 샤프트, 각파이프, 앵글 | #### 금액 정보 | 필드 | 변수명 | 설명 | |------|--------|------| | 검사비 | `inspectionFee` | 인정검사비 (기본: 50,000) | | 수량 | `estimateSurang` | 총 수량 | | 합계 | `estimateTotal` | 견적 총액 | | 최초합계 | `EstimateFirstSum` | 최초 견적 합계 | | 수정합계 | `EstimateUpdatetSum` | 수정 견적 합계 | | 차액 | `EstimateDiffer` | 최초-수정 차액 | | 할인율 | `EstimateDiscountRate` | % | | 할인액 | `EstimateDiscount` | 원 | | 최종금액 | `EstimateFinalSum` | 최종 결정 금액 | ### CSS 클래스 ```css /* 수동 편집된 셀 강조 */ .manually-edited { background-color: #f8d7da !important; } /* readonly 체크박스 */ .readonly-checkbox, .readonly-radio { pointer-events: none; opacity: 1; } /* 커스텀 너비 */ .w-40, .w-50, .w-60, .w-85 { ... } ``` --- ## 3. 견적 항목 테이블 ### 스크린 견적 테이블 (estimateList) | 열 | 필드명 | 설명 | |----|--------|------| | 항목명 | `item_name` | 품목 이름 | | 규격 | `specification` | 규격/사양 | | 단위 | `unit` | EA, m², m, kg | | 수량 | `quantity` | 수량 | | 단가 | `unit_price` | 단가 | | 금액 | `amount` | quantity × unit_price | | 비고 | `remark` | 메모 | ### 슬랫 견적 테이블 (estimateSlatList) 스크린과 동일 구조 ### 자동계산 테이블 (estimateList_auto, estimateSlatList_auto) | 열 | 필드명 | 설명 | |----|--------|------| | 항목코드 | `item_code` | 자동계산 항목 코드 | | 항목명 | `item_name` | 품목 이름 | | 계산타입 | `calc_type` | per_meter, per_area 등 | | 기준값 | `base_value` | 계산 기준 수치 | | 단가 | `unit_price` | 단가 | | 금액 | `amount` | 계산 결과 | --- ## 4. API 엔드포인트 (AJAX 호출) ### 데이터 조회 | 엔드포인트 | 용도 | |------------|------| | `fetch_unitprice.php` | 단가 조회 | | `fetch_date.php` | 날짜 정보 | | `fetch_receiver.php` | 수신자 정보 | | `fetch_outworkplace.php` | 현장 목록 | | `fetch_length_data.php` | 길이 데이터 | | `fetch_price.php` | 가격 정보 | ### 금액 계산 | 엔드포인트 | 용도 | |------------|------| | `get_estimate_amount.php` | 견적 금액 라우터 | | `get_screen_amount.php` | 스크린 금액 계산 | | `get_slat_amount.php` | 슬랫 금액 계산 | | `recalc_row.php` | 행 재계산 | ### 데이터 저장 | 엔드포인트 | 용도 | |------------|------| | `insert.php` | 견적 저장 (신규) | | `update.php` | 견적 수정 | | `delete.php` | 견적 삭제 | | `insert_estimate.php` | 견적 등록 | | `insert_detail.php` | 상세 저장 | ### 기타 | 엔드포인트 | 용도 | |------------|------| | `generate_serial_pjnum.php` | 견적번호 생성 | | `get_initial_pjnum.php` | 초기 견적번호 | | `insert_logmenu.php` | 로그 기록 | --- ## 5. JavaScript 처리 ### 공통 스크립트 (common/) | 파일 | 용도 | |------|------| | `calculation.js` | 행 계산 로직 | | `lastJS.php` | 페이지 공통 JS | | `common_screen.php` | 스크린 공통 | | `common_slat.php` | 슬랫 공통 | ### 주요 이벤트 처리 ```javascript // 수량/단가 변경 시 금액 재계산 function calculateRowTotal(row) { ... } // 옵션 체크박스 변경 시 항목 재계산 $('input[name="steel"]').change(function() { ... }); // 모델 변경 시 단가 조회 $('#model_name').change(function() { // AJAX: fetch_unitprice.php }); // 크기 변경 시 전체 재계산 $('#makeWidth, #makeHeight').change(function() { // AJAX: get_estimate_amount.php }); ``` --- ## 6. 사용자 권한 ### 접근 레벨 ```php // 레벨 5 이하만 접근 가능 if(!isset($_SESSION["level"]) || $_SESSION["level"]>5) { header("Location:" . $WebSite . "login/login_form.php"); exit; } ``` ### 작성 권한자 ```php $authorities = [ "개발자", "전진", "노완호", "이세희", "함신옥", "손금주", "이은진", "이경호" ]; ``` --- ## SAM 이관 시 UI 고려사항 ### 1. Livewire + Blade 전환 | 5130 | SAM | |------|-----| | jQuery AJAX | Livewire wire:click | | PHP 직접 렌더링 | Blade 컴포넌트 | | 전역 변수 | Livewire 프로퍼티 | | form submit | wire:submit | ### 2. 컴포넌트 분리 ``` resources/views/livewire/quotation/ ├── quote-list.blade.php # 목록 ├── quote-form.blade.php # 작성/수정 ├── quote-detail.blade.php # 상세 ├── components/ │ ├── quote-table.blade.php # 견적 테이블 │ ├── option-checkboxes.blade.php # 옵션 체크박스 │ └── amount-summary.blade.php # 금액 요약 ``` ### 3. 반응형 개선 - 현재: 고정 너비 테이블 - 개선: Tailwind 반응형 그리드 ### 4. UX 개선점 - 실시간 금액 계산 (debounce 적용) - 자동저장 (draft 기능) - 견적 버전 비교 UI - 모바일 최적화 --- ## 참조 파일 - `list.php:111-192` - 목록 테이블 구조 - `write_form.php:1-300` - 폼 초기화 로직 - `common/calculation.js` - 행 계산 로직 - `_row.php` - 행 렌더링 공통 - `_request.php` - 요청 파라미터 처리