king 119a128ee0 feat(cafe24): 상품관리를 좌우 2분할로 — 목록(좁게) | 상세페이지 편집(넓게)
왼쪽에서 상품을 클릭하면 오른쪽에 편집기가 바로 열린다. 목록을 다시 받지 않고
오른쪽 조각만 교체한다(GET /products/{no}/pane → JS 삽입). 목록까지 다시 그리면
클릭마다 카페24 호출이 2회 더 늘어나기 때문이다. JS 가 실패하거나 없으면 각 행의
링크(/cafe24/?selected=)로 그대로 동작한다.

목록은 페이지를 없애고 전체를 한 번에 받는다(list_all_products, 1회 100개·상한
1000개). 필터·정렬을 한 페이지에만 적용하면 다음 페이지에 있는 상품이 빠져
"진열중만 보기" 가 거짓이 된다. 현재 87개라 1회 호출로 끝난다.

컬럼은 요청대로 번호·상품명·진열·판매·수정 5개다. 좁은 칸에 맞춰 진열/판매는
배지 대신 점, 수정일은 월-일만 표시하고 전체 값은 title 로 둔다. 긴 상품명은
2줄로 제한해 행 높이를 고르게 유지한다(전체 이름은 title·편집기 제목에서 확인).

진열중/판매중 체크박스는 중복 선택이 되며 둘 다 켜면 AND 다. 문서에 없는 API
필터 파라미터에 기대지 않고 받아온 뒤 파이썬에서 걸러낸다. 제목행 클릭은
오름↔내림 토글이며 한글 정렬은 localeCompare(ko) 를 쓴다.

편집 영역을 넓게 쓰려고 이 화면에서만 .erp-page 의 max-width 를 풀었다. 이때
box-sizing:border-box 를 함께 줘야 한다 — width:100% + padding:24px 이라
max-width 만 풀면 문서 전체에 가로 스크롤이 생긴다(측정으로 확인 후 수정).

편집 중 다른 상품을 클릭하거나 페이지를 벗어나면 저장 안 됨 경고를 띄운다.

옛 단독 화면(product.html)은 제거하고 /products/{no} 는 2분할 화면으로
리다이렉트한다. 편집기 조각을 두 곳에서 함께 쓰도록 _editor.html 로 분리했다.

검증: 유닛테스트 33개 통과(신규 3개 — 전체 조회의 페이지 순회·상한 처리·1회
종료). 상한 처리는 테스트가 잡아서 고쳤다(요청한 만큼 받았는지로 판정). 가짜
데이터로 렌더해 브라우저에서 실측: 왼쪽 360px·오른쪽 940px, 각 칸 독립 스크롤,
분할 영역이 화면 높이에 맞고, 가로 스크롤 없음, 정렬 오름/내림 동작 확인.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-14 12:34:52 +09:00

DBX 메인 페이지

Google Workspace 계정으로 로그인한 뒤 허용된 사용자만 업무 메뉴에 접근하는 FastAPI 웹앱입니다.
Nginx Proxy Manager(NPM) 뒤에서 Docker 컨테이너로 실행하는 구성을 기준으로 작성했습니다.

접속 허용 계정

허용 목록은 app/main.pyALLOWED_EMAILS에서 서버 측으로 검사합니다.


Google OAuth 설정

Google Cloud Console에서 OAuth 클라이언트를 만들고 아래 값을 등록합니다.

항목
승인된 JavaScript 원본 https://dbx.no1king.freeddns.org
승인된 리디렉션 URI (운영) https://dbx.no1king.freeddns.org/auth/google
승인된 리디렉션 URI (로컬) http://localhost:8080/auth/google

Google 로그인 화면에서 hd=dbxcorp.co.kr 힌트를 보내지만,
실제 접근 제한은 서버에서 이메일 도메인과 허용 계정 목록으로 다시 검사합니다.


환경 변수

변수 설명
GOOGLE_CLIENT_ID Google OAuth 클라이언트 ID
GOOGLE_CLIENT_SECRET Google OAuth 클라이언트 보안 비밀
SESSION_SECRET_KEY 세션 쿠키 서명용 랜덤 문자열
SESSION_COOKIE_SECURE HTTPS 환경 true / 로컬 HTTP false
PUBLIC_BASE_URL 외부 접속 주소 (예: https://dbx.no1king.freeddns.org)
CS_ORDER_URL CS 발주 업무 버튼 이동 주소
CUSTOMER_ORDER_LIST_URL 고객 주문리스트 프로그램 버튼 이동 주소

로컬 Docker 테스트

# 1. 환경 변수 파일 준비
copy .env.local.example .env.local
# .env.local 을 열어 Google OAuth 키 등 실제 값으로 수정

# 2. 이미지 빌드 및 컨테이너 실행
docker compose -f docker-compose.local.yml up --build

# 3. 브라우저에서 확인
# http://localhost:8080

Google 로컬 OAuth 주의
Google Cloud Console → OAuth 클라이언트 → 승인된 리디렉션 URI에
http://localhost:8080/auth/google 를 반드시 추가해야 합니다.


서버 배포 (Ubuntu + NPM)

NPM은 dbx.no1king.freeddns.orghttp://192.168.0.194:80 으로 이미 설정되어 있습니다.

# 서버에서 실행

# 1. 저장소 클론
git clone https://gitea.no1king.freeddns.org/king/dbx-main.git
cd dbx-main

# 2. 환경 변수 파일 준비
cp .env.example .env
# .env 를 열어 실제 값으로 수정
nano .env

# 3. 이미지 빌드 및 백그라운드 실행
docker compose up --build -d

# 4. 로그 확인
docker compose logs -f

업데이트 배포

git pull
docker compose up --build -d

컨테이너 관리

docker compose ps          # 상태 확인
docker compose down        # 중지
docker compose restart web # 재시작

폰트

app/static/fonts/ 에 Pretendard 폰트가 포함되어 있습니다.

파일 굵기
Pretendard-Thin.ttf 100 (얇음)
Pretendard-Regular.ttf 400 (기본)
Pretendard-Bold.ttf 700 (굵음)
S
Description
DBX 메인페이지
Readme 19 MiB
Languages
Python 48.6%
HTML 25.1%
CSS 15.1%
PLpgSQL 5.2%
JavaScript 4.7%
Other 1.2%