sam-docs/projects/quotation/phase-1-5130-analysis/ui-analysis.md

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 클래스

/* 수동 편집된 셀 강조 */
.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	슬랫 공통

주요 이벤트 처리

// 수량/단가 변경 시 금액 재계산
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. 사용자 권한

접근 레벨

// 레벨 5 이하만 접근 가능
if(!isset($_SESSION["level"]) || $_SESSION["level"]>5) {
    header("Location:" . $WebSite . "login/login_form.php");
    exit;
}

작성 권한자

$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 - 요청 파라미터 처리