하마누수 작업 관리 시스템
누수 전문 업체의 현장 작업 · 오더 · 작업일지 · 과거 자료 검색을 하나의 웹 시스템으로 통합한 프로젝트입니다. 이 문서는 발표·공유용 화면설계서로, 각 화면의 목적과 구성을 한눈에 이해할 수 있도록 정리했습니다.
프로젝트 목표
종이·엑셀·사진 폴더에 흩어져 있던 정보를 디지털화하여 현장과 사무실이 같은 정보를 공유합니다.
현장 효율
기사가 모바일에서 오더 확인·작업일지·사진을 바로 등록
사무실 연계
임무(오더) 등록 → 실무자 배치 → 기사 전달 흐름
자료 검색
17~26년 작업·입금 엑셀 + 현장사진을 DB에서 통합 검색
대외 설명
블로그·문서 화면으로 작업 사례 공유
사용자 역할
메인 홈(index.html)에서 역할별로 진입합니다. 각 역할은 서로 다른 화면 세트를 사용합니다.
기사
worker.html
현장 작업자
- 배정된 오더 확인
- 작업일지·사진·GIF 등록
- 작업 블로그 미리보기
관리자
admin.html
경영·총괄
- 전체 기사·작업 현황
- 기사별 상세 관리
사무실
office.html
접수·오더 등록
- 신규 임무(오더) 등록
- 완료 건 상세 확인
실무자
operator.html
배치·조율
- 오더에 기사 배정
- 특이사항 메모
자료검색
hama.html
과거 자료 조회 (비밀번호)
- 엑셀 DB 검색·상세
- 현장사진 연동 표시
- 음성 검색·페이지 넘김
화면 구성도
사용자가 시스템에 들어온 뒤 거치는 대표 화면 흐름입니다.
메인 홈
index.html
→
index.html
역할 선택
5가지
→
5가지
업무 화면
목록·상세
→
목록·상세
기록·검색
DB / local
DB / local
오더 목록 → 상세 → 작업일지 작성
고객 · 주소 · 일시 · 담당기사
자료검색 화면 설계 (hama.html)
과거 작업·입금 내역과 현장사진을 검색하는 핵심 화면입니다. 발표 시 가장 많이 시연하는 화면입니다.
| 영역 | 구성 요소 | 설명 |
|---|---|---|
| ① 검색바 | 텍스트 + 음성 버튼 | 고객명·주소·연락처·내용·입금자 통합 검색 |
| ② 필터 | 연도·기간·입금자 | 연도는 접수일·시공일·작업일 기준 (엑셀 연도 컬럼과 별도) |
| ③ 결과 목록 | 카드 리스트 | 주소·날짜·구분·입금 상태 요약, 50건/페이지 |
| ④ 페이지 | 1·2·3… 버튼 | 연도별 대량 결과를 페이지 단위로 탐색 |
| ⑤ 상세 패널 | 목록 상단 인라인 | 카드 클릭 시 페이지 상단에 상세·사진 표시 (URL 새로고침) |
| ⑥ 현장 사진 | 3열 그리드 | work_record_photos 연동, 클릭 시 원본 확대 |
| ⑦ 관리 | 엑셀 DB 저장 | 관리자용 엑셀 업로드 → work_records 갱신 |
작업·입금 내역 검색 · 음성 검색
검색 결과 3,751건 · 1–50건 (1/76페이지)
[상세] 비파 204-1207
현장 사진 58장
‹123›
데이터 · 사진 연동 흐름
엑셀 작업 내역과 D: 드라이브 현장사진을 매칭해 DB·서버에 등록하는 파이프라인입니다.
엑셀
작업·입금
→
작업·입금
work_records
MySQL
+
MySQL
D: 현장사진
연도별 폴더
→
연도별 폴더
압축 800px
link_work_photos
→
link_work_photos
서버 업로드
work-photos/
→
work-photos/
work_record_photos
폴더명(날짜·주소)과 엑셀 행을 자동 매칭합니다. 매칭 실패 시 폴더명으로 작업기록을 자동 생성합니다. 사진은 저화질 JPEG로 변환해 서버 용량을 절약합니다.
API · DB 구조
자료검색에 사용하는 주요 API와 테이블입니다. (상세: DB_테이블명세서.md)
| 메서드 | 경로 | 설명 |
|---|---|---|
| POST | /api/hama-auth | 자료검색 페이지 로그인 |
| GET | /api/work-records/search | 작업·입금 통합 검색 (페이지네이션) |
| GET | /api/work-records/{id} | 상세 + 현장사진 목록 |
| POST | /api/work-records/import | 엑셀 업로드·DB 반영 |
work_records (작업·입금 마스터)
├── id, customer_address, received_date, construction_date ...
├── search_text (통합 검색용)
└── 1:N → work_record_photos
├── file_path (예: work-photos/2023/15943/photo.jpg)
├── original_name, sort_order
└── work_record_id (FK)
인프라 · 기술 스택
프론트HTML · CSS · JavaScript (반응형)
백엔드Python Flask (server.py) · REST API
DBMySQL 8 · utf8mb4 · phpMyAdmin
서버AWS EC2 Ubuntu · Nginx · /var/www/hamanusu
[브라우저] → [Nginx] → [Flask API + 정적 HTML]
↓
[MySQL hamanusu]
↓
[/var/www/hamanusu/work-photos/]
진행 현황 (2026년 6월 기준)
- 메인 홈 · 역할별 화면 (기사/관리자/사무실/실무자)
- 자료검색 UI · 음성검색 · 페이지네이션 · 상단 상세보기
- 엑셀 → work_records DB 적재
- 2022년 현장사진 서버 반영 (68장)
- 2023~2026년 현장사진 압축·업로드 진행 중
- 오더·작업일지 MySQL 이전 (현재 localStorage)