chpark/distribution_erp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
5d668716f116ec6d6876b80f2c35eead3a11ff7a
distribution_erp/public/manual.html
T
chpark 88e7eab65e
Deploy momo-erp / deploy (push) Successful in 51s
Details
feat(입고 처리): 매입발주 선택 → 라인별 창고/수량 입고 (부분/전체) + 매뉴얼 보강 
[입고 처리 화면 재설계 — 등록 → 수정 방식]
- 좌-우 분할:
  · 좌: 매입 발주서 리스트 (발주요청+입고중 기본 필터)
  · 우: 발주 라인별 [창고 선택 + 정상 입고 + 불량] 인라인 입력
- 발주/입고/미입고 한눈에 표시 (예: 10 / 5 / 5)
- 완전 입고된 라인은 ✓ 완료 표시 + 입력 칸 잠김
- 정상+불량은 남은 수량(qty - received_qty) 이하로 자동 클램프

[/api/m/procurements/list]
- 응답에 TOTAL_QTY, RECEIVED_QTY 추가 → 좌측 리스트에 진척 표시

[/api/m/inbounds/save]
- procObjid 있으면 라인별 입고 한도 사전 검증 (qty - received_qty 초과 차단)
- 0 입고 라인은 건너뛰기
- 매입발주 상태 자동 갱신:
  · 모든 라인 완전 입고 → RECEIVED (입고완료)
  · 일부 라인만 입고 → PARTIAL (입고중)
  · 시작 안 함 → REQUESTED 유지

[매뉴얼 — 가-1, 가-2, 다-2 대폭 보강]
- 거래처 출고 요청: 6단계 체크리스트 + 화면 도식 + 토스트/모달 예시 + 시나리오
- 내 주문 내역 + 거래처 자기 주문 수량 수정/품목 삭제/취소: 화면 도식 + 단계별 가이드 + 상태표
- 입고 처리: 화면 도식 + 발주/입고/미입고 표시 의미 + 부분입고 시나리오

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-08 01:16:29 +09:00

1065 lines
74 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>모모유통 사용 설명서</title>
<style>
:root{
--bg:#f8fafc; --card:#fff; --border:#e2e8f0; --muted:#64748b; --text:#0f172a;
--primary:#0f766e; --primary-d:#065f46; --primary-light:#d1fae5; --accent:#1e293b;
--orange:#ea580c; --rose:#e11d48; --violet:#7c3aed; --sky:#0284c7; --amber:#d97706; --emerald:#059669;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.7 -apple-system,"Apple SD Gothic Neo","Pretendard",Segoe UI,sans-serif;}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
.btn{display:inline-block;padding:3px 10px;border-radius:5px;font-size:12px;font-weight:700;vertical-align:middle;color:#fff;line-height:1.4}
.btn-emerald{background:#0f766e}
.btn-rose{background:#e11d48}
.btn-violet{background:#7c3aed}
.btn-sky{background:#0284c7}
.btn-orange{background:#ea580c;color:#fff}
.btn-slate{background:#475569}
.btn-light-orange{background:#fed7aa;color:#9a3412;border:1px solid #fdba74}
.btn-light-sky{background:#bae6fd;color:#075985;border:1px solid #7dd3fc}
.wrap{max-width:1180px;margin:0 auto;padding:32px 20px 80px}
header.cover{background:linear-gradient(135deg,#0d3b24,#1b5e3a 60%,#0f4a2a);color:#fff;border-radius:16px;padding:36px 32px;margin-bottom:32px;}
header.cover h1{margin:0 0 6px;font-size:32px;letter-spacing:-0.02em}
header.cover .sub{opacity:.9;font-size:15px}
header.cover .meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px;font-size:13px}
header.cover .meta span{padding:6px 12px;border:1px solid rgba(255,255,255,0.2);border-radius:999px;background:rgba(255,255,255,0.08)}
nav.toc{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 28px;margin-bottom:28px}
nav.toc h3{margin:0 0 10px;font-size:15px;color:var(--accent);font-weight:700}
nav.toc ol{margin:0;padding-left:22px}
nav.toc li{margin:4px 0;font-size:14.5px}
nav.toc ol ol{padding-left:18px;margin-top:2px}
section{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:26px 30px;margin-bottom:24px}
section h2{margin:0 0 18px;padding-bottom:10px;border-bottom:2px solid var(--border);font-size:24px;letter-spacing:-0.01em;color:var(--accent)}
section h3{margin:24px 0 10px;font-size:18px;color:var(--accent)}
section h4{margin:18px 0 8px;font-size:15px;color:var(--accent);font-weight:700}
.lead{font-size:16px;color:#334155;margin-top:0}
.role-tag{display:inline-block;padding:5px 14px;border-radius:999px;font-size:13px;font-weight:700;margin-right:6px;vertical-align:middle}
.r-user{background:#dbeafe;color:#1e40af}
.r-out{background:#ffe4e6;color:#9f1239}
.r-in{background:#dcfce7;color:#166534}
.r-master{background:#f3e8ff;color:#6b21a8}
.r-stat{background:#fef3c7;color:#92400e}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:14px 0}
.grid > div{border:1px solid var(--border);border-radius:10px;padding:14px 16px;background:#fafafa}
.grid b{display:block;color:var(--primary);margin-bottom:4px;font-size:14px}
/* 단계 박스 */
.steps{counter-reset:step;margin:14px 0;padding-left:0;list-style:none}
.steps li{counter-increment:step;position:relative;padding:14px 18px 14px 60px;border:1px solid var(--border);border-radius:10px;margin:10px 0;background:#fafafa}
.steps li::before{content:counter(step);position:absolute;left:14px;top:18px;background:var(--primary);color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px}
.steps li b{color:var(--accent);font-size:15px;display:inline-block;margin-bottom:4px}
.steps li small{display:block;color:#475569;font-size:14px;margin-top:6px;line-height:1.6}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14px}
th,td{border:1px solid var(--border);padding:10px 12px;text-align:left;vertical-align:top}
th{background:#f1f5f9;color:#475569;font-weight:700}
.note,.tip,.warn,.danger{border-left:5px solid;padding:14px 18px;border-radius:8px;margin:14px 0;font-size:14.5px;line-height:1.7}
.note {background:#eff6ff;border-color:#3b82f6}
.tip {background:#ecfdf5;border-color:#10b981}
.warn {background:#fff7ed;border-color:#ea580c}
.danger {background:#fef2f2;border-color:#ef4444}
.tip b, .warn b, .note b, .danger b{display:block;margin-bottom:4px;font-size:14.5px}
.badge{display:inline-block;padding:3px 10px;border-radius:5px;font-size:12px;font-weight:700;vertical-align:middle}
.b-orange{background:#fed7aa;color:#9a3412}
.b-rose {background:#fecdd3;color:#9f1239}
.b-violet{background:#ddd6fe;color:#5b21b6}
.b-sky {background:#bae6fd;color:#075985}
.b-amber {background:#fde68a;color:#92400e}
.b-sage {background:#d1fae5;color:#065f46}
.b-slate {background:#e2e8f0;color:#475569}
/* 화면 도식 */
.screen{border:1px solid #cbd5e1;border-radius:10px;background:#fff;overflow:hidden;margin:18px 0;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.screen .browser-bar{background:#1e293b;color:#cbd5e1;padding:8px 14px;font-size:12px;display:flex;align-items:center;gap:10px}
.screen .browser-bar .dots{display:flex;gap:5px}
.screen .browser-bar .dots i{display:inline-block;width:11px;height:11px;border-radius:50%;background:#475569}
.screen .browser-bar .url{flex:1;background:#0f172a;padding:4px 12px;border-radius:5px;color:#94a3b8;font-size:12px}
.screen .header-bar{background:#fff;border-bottom:1px solid #e2e8f0;padding:10px 14px;font-size:13px;color:#475569;display:flex;justify-content:space-between;align-items:center}
.screen .body{padding:16px;font-size:13.5px}
.screen .row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #f1f5f9;align-items:center}
.screen .row:last-child{border-bottom:0}
.demo-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}
.demo-table th,.demo-table td{border:1px solid #cbd5e1;padding:6px 8px}
.demo-table th{background:#f8fafc;font-weight:700;text-align:center;color:#475569}
.demo-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.demo-table td.ctr{text-align:center}
.demo-table tr.r-delivery{background:#fff7ed}
.demo-table tr.r-charter {background:#f0f9ff}
.demo-table tr.r-item {background:#fff}
.scenario{border:2px dashed #94a3b8;border-radius:10px;padding:20px 24px;margin:18px 0;background:#fffbeb}
.scenario h4{margin:0 0 10px;font-size:15px;color:#92400e}
.scenario ol{padding-left:24px;margin:0}
.scenario li{margin:7px 0;font-size:14.5px}
.flow{font-family:"SF Mono","JetBrains Mono",Consolas,monospace;font-size:13.5px;background:#0f172a;color:#e2e8f0;padding:20px 24px;border-radius:10px;overflow-x:auto;line-height:1.8;white-space:pre}
.field-row{display:grid;grid-template-columns:170px 1fr;gap:14px;padding:10px 14px;border-bottom:1px solid #f1f5f9;font-size:14px}
.field-row:last-child{border-bottom:0}
.field-row b{color:var(--accent)}
.field-row .desc{color:#475569;font-size:13.5px;line-height:1.6}
hr{border:0;border-top:1px solid var(--border);margin:24px 0}
@media (max-width:640px){
section{padding:18px 16px}
header.cover{padding:24px 20px}
header.cover h1{font-size:24px}
.field-row{grid-template-columns:1fr}
}
@media print{
body{background:#fff}
section,header.cover,nav.toc{box-shadow:none;border:1px solid #ccc}
a{color:inherit;text-decoration:none}
.screen{break-inside:avoid}
}
</style>
</head>
<body>
<div class="wrap">
<header class="cover">
<h1>모모유통 사용 설명서</h1>
<div class="sub">물건을 사고 파는 과정을 컴퓨터로 처리하는 시스템 — 누구나 쉽게 따라할 수 있어요</div>
<div class="meta">
<span><b>홈페이지 주소</b> · momotogether.com</span>
<span><b>이용 대상</b> · 거래처(가게) / 모모유통 직원</span>
<span><b>수정일</b> · 2026년 5월 7일</span>
</div>
</header>
<nav class="toc">
<h3>📑 목차 — 클릭하면 해당 부분으로 이동해요</h3>
<ol>
<li><a href="#overview">이 시스템은 어떤 시스템인가요?</a></li>
<li><a href="#login">로그인하기 · 회원가입하기</a></li>
<li>
<a href="#user-guide">가. 거래처(물건 사는 가게) 사용법</a> <span class="role-tag r-user">거래처</span>
<ol>
<li><a href="#u-order-new">물건 주문하기 (가장 많이 쓰는 화면)</a></li>
<li><a href="#u-orders">내가 주문한 내역 보기</a></li>
<li><a href="#u-profile">내 정보·비밀번호 바꾸기</a></li>
</ol>
</li>
<li>
<a href="#out-guide">나. 출고 담당자 사용법</a> <span class="role-tag r-out">출고담당</span>
<ol>
<li><a href="#o-orders">주문서 보고 물건 내보내기 (창고에서 빠짐)</a></li>
<li><a href="#o-payments">입금 들어왔는지 확인하기</a></li>
<li><a href="#o-einvoices">세금계산서 끊어주기</a></li>
</ol>
</li>
<li>
<a href="#in-guide">다. 입고 담당자·물품 등록 담당자 사용법</a> <span class="role-tag r-in">입고담당</span><span class="role-tag r-master">물품등록</span>
<ol>
<li><a href="#i-procurement">물건 매입하기 (도매처에 주문)</a></li>
<li><a href="#i-inbound">물건 들어오면 등록하기 (창고에 쌓임)</a></li>
<li><a href="#i-inventory">창고에 뭐가 얼마나 있는지 보기</a></li>
<li><a href="#i-items">팔 물건 등록·수정하기</a></li>
<li><a href="#i-customers">거래처(가게) 정보·권한 관리하기</a></li>
<li><a href="#i-others">도매처·창고·제조사 등록</a></li>
</ol>
</li>
<li>
<a href="#stat-guide">라. 매출·이익 분석하기</a> <span class="role-tag r-stat">통계</span>
</li>
<li><a href="#flow">전체 일이 어떻게 흘러가나요? (흐름도)</a></li>
<li><a href="#faq">자주 묻는 질문</a></li>
</ol>
</nav>
<!-- ========== 1. 개요 ========== -->
<section id="overview">
<h2>1. 이 시스템은 어떤 시스템인가요?</h2>
<p class="lead">
모모유통은 도매처에서 물건을 사들여 자체 창고에 쌓아두고,
가게(거래처)들이 인터넷으로 물건을 주문하면 담당자가 확인해서 보내주는 회사예요.
이 시스템은 그 과정을 종이/엑셀이 아니라 <b>컴퓨터·핸드폰으로</b> 한 번에 처리할 수 있게 해주는 도구입니다.
</p>
<h3>한 줄로 정리하면</h3>
<div class="grid">
<div><b>가게는</b> 사이트에서 물건을 주문해요</div>
<div><b>모모 직원은</b> 주문을 보고 물건을 보내요</div>
<div><b>창고에서</b> 물건이 자동으로 빠져요(−)</div>
<div><b>또 다른 직원은</b> 도매처에서 물건을 사와요</div>
<div><b>창고에</b> 물건이 자동으로 쌓여요(+)</div>
<div><b>월말에는</b> 매출·이익을 한눈에 봐요</div>
</div>
<h3>누가 어떤 메뉴를 쓰나요?</h3>
<table>
<thead>
<tr><th width="22%">사용자</th><th width="40%">하는 일</th><th>주로 쓰는 메뉴</th></tr>
</thead>
<tbody>
<tr>
<td><span class="role-tag r-user">거래처</span><br><small>(물건 사는 가게)</small></td>
<td>물건 검색하고 주문 넣기</td>
<td><b>거래처 주문</b> 메뉴 (출고 요청)</td>
</tr>
<tr>
<td><span class="role-tag r-out">출고 담당</span><br><small>(모모 직원)</small></td>
<td>가게가 넣은 주문을 확인하고 보내기 → 창고 재고 줄어듦(−)<br>입금 확인, 세금계산서 끊기</td>
<td><b>출고/정산</b> 메뉴</td>
</tr>
<tr>
<td><span class="role-tag r-in">입고 담당</span><br><small>(모모 직원)</small></td>
<td>도매처에 물건 주문, 받아서 등록 → 창고 재고 늘어남(+)</td>
<td><b>매입/입고</b> 메뉴</td>
</tr>
<tr>
<td><span class="role-tag r-master">물품 등록 담당</span><br><small>(모모 직원)</small></td>
<td>팔 물건, 가게 회원, 도매처 등 기본 정보 등록·관리</td>
<td><b>마스터 관리</b> 메뉴</td>
</tr>
<tr>
<td><span class="role-tag r-stat">관리자</span><br><small>(사장님 등)</small></td>
<td>매출·이익이 얼마나 났는지 보기</td>
<td><b>통계</b> 메뉴</td>
</tr>
</tbody>
</table>
<h3>왼쪽에 있는 메뉴 5개</h3>
<p>로그인하면 왼쪽에 메뉴 5개가 줄지어 있어요. 클릭하면 그 메뉴의 화면이 오른쪽에 펼쳐져요.</p>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com</span></div>
<div class="header-bar"><span style="font-weight:700">📦 모모유통</span><span>👤 내 이름 · 로그아웃</span></div>
<div class="body" style="display:grid;grid-template-columns:240px 1fr;gap:14px">
<div style="background:#f8fafc;padding:12px;border-radius:6px;line-height:2.2">
<div style="font-weight:700;color:#0f766e">━ 왼쪽 메뉴 ━</div>
▸ 거래처 주문<br>
▸ <b style="color:#0f766e">출고/정산</b> (직원만)<br>
▸ 매입/입고 (직원만)<br>
▸ 마스터 관리 (직원만)<br>
▸ 통계
</div>
<div style="border:1px dashed #cbd5e1;border-radius:6px;padding:18px;color:#94a3b8;display:flex;align-items:center;justify-content:center;min-height:140px">
선택한 메뉴의 내용이 여기에 보여요
</div>
</div>
</div>
<p class="tip"><b>💡 가게(거래처)는 '거래처 주문' 메뉴만 쓰면 돼요.</b> 다른 메뉴는 모모유통 직원이 사용해요.</p>
</section>
<!-- ========== 2. 로그인 ========== -->
<section id="login">
<h2>2. 로그인하기 · 회원가입하기</h2>
<h3>2.1 로그인하기</h3>
<p>주소창에 <b>momotogether.com</b> 을 치고 들어가면 로그인 화면이 나와요.</p>
<ol class="steps">
<li><b>아이디 입력</b><small>가게는 <b>이메일 주소</b>, 모모 직원은 <b>회사에서 받은 아이디</b>를 입력해요.</small></li>
<li><b>비밀번호 입력하고 [로그인] 버튼 클릭</b><small>틀리면 빨간 글씨로 알려줘요. 비밀번호를 까먹었다면 모모 직원에게 연락해서 다시 받으세요.</small></li>
<li><b>로그인 성공 → '주문 화면'이 자동으로 열려요</b><small>모든 사용자는 로그인하면 똑같이 주문 화면으로 가요. 직원은 거기서 왼쪽 메뉴로 자기 화면으로 이동하면 돼요.</small></li>
</ol>
<h3>2.2 회원가입하기 <span class="role-tag r-user">거래처(가게)만</span></h3>
<p>처음 거래하는 가게라면 직접 가입할 수 있어요. (모모 직원은 가입 X — 사장이 직접 등록해 줘요)</p>
<table>
<thead><tr><th>적는 칸</th><th width="80">필수?</th><th>설명</th></tr></thead>
<tbody>
<tr><td>이메일</td><td>네</td><td>이게 로그인 아이디가 돼요</td></tr>
<tr><td>비밀번호</td><td>네</td><td>8자 이상</td></tr>
<tr><td>가게 이름</td><td>네</td><td>거래명세표나 세금계산서에 나올 이름</td></tr>
<tr><td>대표자</td><td>아니오</td><td>세금계산서 끊을 때 필요</td></tr>
<tr><td>전화번호</td><td>네</td><td>휴대폰 번호</td></tr>
<tr><td>주소</td><td>네</td><td>물건 받을 곳</td></tr>
<tr><td>사업자등록번호</td><td>아니오</td><td>세금계산서 받으려면 꼭 필요</td></tr>
</tbody>
</table>
</section>
<!-- ============================================================ -->
<!-- 가. 거래처 매뉴얼 -->
<!-- ============================================================ -->
<section id="user-guide">
<h2><span class="role-tag r-user">거래처</span> 가. 거래처(가게) 사용법</h2>
<p class="lead">가게 사장님이 모모유통에서 물건을 주문할 때 쓰는 화면이에요. 컴퓨터로도 핸드폰으로도 잘 보입니다.</p>
<!-- 가.1 주문하기 -->
<h3 id="u-order-new">가-1. 물건 주문하기 — 한 번에 따라하기</h3>
<p class="lead">가게(거래처) 사장님이 모모유통에 물건을 주문하는 화면입니다. 로그인하면 자동으로 이 화면이 열려요. 컴퓨터·휴대폰 어디서든 잘 보여요.</p>
<h4>① 로그인 후 첫 화면 — 주문 화면</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com</span></div>
<div class="header-bar"><span><b>📦 모모유통</b></span><span>👤 우리가게 · 로그아웃</span></div>
<div class="body">
<div style="background:#fff;border:2px solid #6ee7b7;border-radius:10px;padding:10px;margin-bottom:10px">
<div class="row" style="border:0">
<span>🛒 <b>장바구니</b> <span class="badge b-sage">0</span></span>
<span><span class="btn btn-emerald" style="opacity:.5">주문하기</span> ▼</span>
</div>
</div>
<p style="color:#94a3b8;font-size:11.5px;margin:0 0 10px">▲ 처음에는 비어있어요. 아래에서 물건을 담으면 숫자가 올라가요.</p>
<div class="row"><span>🔍 검색창에 <b>물건 이름·코드</b> 입력</span><span>전체 / 면세 / 과세 ▾ &nbsp;<span class="btn btn-emerald">검색</span></span></div>
</div>
</div>
<h4>② 물건 검색해서 카드 보기</h4>
<p>"꽃계탕"이라고 검색창에 치고 [검색] 또는 <kbd>엔터</kbd>를 누르면 아래에 물건 카드가 나와요. 카드는 사진·이름·가격·재고·뱃지 모양으로 보여요.</p>
<div class="screen">
<div class="body">
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:10px">
<div style="border:1px solid #e2e8f0;border-radius:8px;padding:12px;background:#fff;text-align:center">
📦<br>
<b>꽃계탕</b> <span class="badge b-violet">면세</span><br>
<small>제조사명</small><br>
<b style="color:#0f766e">4,500원</b><br>
<small>창고에 212개 있음</small><br>
<span class="btn btn-emerald" style="display:block;margin-top:6px">＋ 담기</span>
</div>
<div style="border:1px solid #fdba74;border-radius:8px;padding:12px;background:#fff7ed;text-align:center">
📦<br>
<b>김치찌개</b> <span class="badge b-orange">택배만</span><br>
<small>택배 전용 물건</small><br>
<b style="color:#0f766e">12,000원</b><br>
<small>창고에 50개 있음</small><br>
<span class="btn btn-emerald" style="display:block;margin-top:6px">＋ 담기</span>
</div>
<div style="border:1px solid #e2e8f0;border-radius:8px;padding:12px;background:#fff;text-align:center;opacity:.5">
📦<br>
<b>참치캔</b><br>
<b style="color:#e11d48">품절</b><br>
<small>창고에 0개</small><br>
<span class="btn btn-slate" style="display:block;margin-top:6px;opacity:.5">＋ 담기</span>
</div>
</div>
</div>
</div>
<p>카드의 표시들 :</p>
<ul>
<li><span class="badge b-violet">면세</span> — 세금이 붙지 않는 물건 (그냥 참고)</li>
<li><span class="badge b-orange">택배만</span> — <b>이 물건은 택배로만 보내요.</b> 카드를 담으면 자동으로 '택배비' 줄이 장바구니에 1줄 더 추가됩니다.</li>
<li>"한 번에 30개까지만" — 한 번 주문에 살 수 있는 최대 개수. 더 사고 싶으면 모모 직원에게 권한을 풀어달라고 하세요.</li>
<li>창고 수량이 0이면 [＋ 담기] 버튼이 회색으로 막혀요.</li>
</ul>
<h4>③ [＋ 담기] 눌러서 장바구니에 넣기</h4>
<p>버튼을 한 번 누르면 1개 들어가요. 같은 카드 [＋ 담기]를 또 누르면 2개로 늘어요. 다음 같은 토스트가 우상단에 잠깐 뜨면 추가 성공:</p>
<div class="tip">✅ 장바구니에 추가됨: 꽃계탕</div>
<p>위쪽 초록색 <b>장바구니 바</b>의 숫자가 0 → 1 → 2 로 올라가는 게 보일 거예요.</p>
<h4>④ 장바구니 펼쳐서 개수 조절 / 택배·용차 추가</h4>
<p>위쪽 <b>장바구니 바</b>를 클릭하면 펼쳐져요. 담은 물건 줄과 함께 <b>[＋ 택배 추가]</b> <b>[＋ 용차 추가]</b> 버튼이 보입니다.</p>
<div class="screen">
<div class="body">
<div style="background:#fff;border:2px solid #6ee7b7;border-radius:10px;padding:12px">
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px">
<span class="btn btn-light-orange">＋ 택배 추가</span>
<span class="btn btn-light-sky">＋ 용차 추가</span>
<span style="font-size:11px;color:#94a3b8;margin-left:auto">전체 삭제</span>
</div>
<div style="background:#fff7ed;border:1px solid #fdba74;border-radius:8px;padding:8px;display:flex;gap:6px;align-items:center;font-size:12px;margin-bottom:6px">
<span class="badge b-orange">택배</span>
<span style="flex:1">담당자/메모</span>
<span style="border:1px solid #cbd5e1;padding:2px 8px;background:#fff">4000</span>×<span style="border:1px solid #cbd5e1;padding:2px 6px;background:#fff">1</span>=
<b>₩4,000</b>
<span style="color:#94a3b8">×</span>
</div>
<div style="background:#fff;border:1px solid #e2e8f0;border-radius:6px;padding:8px;display:flex;justify-content:space-between;align-items:center;font-size:12px">
<b>꽃계탕</b>
<div style="display:flex;gap:4px;align-items:center">
<span class="btn btn-slate" style="padding:1px 8px">−</span>
<span style="border:1px solid #cbd5e1;padding:2px 8px;background:#fff">2</span>
<span class="btn btn-slate" style="padding:1px 8px">＋</span>
<span style="margin-left:8px"><b>₩9,000</b></span>
<span style="color:#94a3b8;margin-left:6px">×</span>
</div>
</div>
</div>
</div>
</div>
<ul>
<li><b>− / +</b> 버튼이나 숫자 직접 입력으로 개수 조절. 재고/한도를 넘으면 자동으로 막힘.</li>
<li>같은 종류 [＋ 택배 추가]를 두 번 누르면 <b>새 줄이 안 생기고 그 줄 수량이 +1</b>로 올라가요.</li>
<li>택배비 기본 4,000원 / 용차비 기본 5,000원 — 직접 가격·개수·담당자명을 고칠 수 있어요.</li>
<li>X 버튼으로 줄을 빼면 그 줄만 삭제 (택배 전용 물건이 있는 동안에는 택배 줄을 못 빼요).</li>
</ul>
<h4>⑤ [주문하기] 눌러서 주문 확정</h4>
<p>장바구니 바 우측 [주문하기] 버튼을 클릭하면 확인 알림이 떠요:</p>
<div class="note">
<b>발주를 요청하시겠습니까?</b><br>
합계 ₩27,200 (품목 2, 부가 1)<br>
<span class="btn btn-emerald">발주</span> &nbsp; <span class="btn btn-slate">취소</span>
</div>
<p>[발주] 누르면 끝. <b>주문 번호</b>가 만들어지고 (예: <code>ORD-20260507-0001</code>) 자동으로 [내 주문 내역] 화면으로 이동합니다.</p>
<div class="warn">
<b>⚠️ 주의</b>
<ul style="margin:6px 0 0;padding-left:20px">
<li>택배 전용 물건이 들어 있는데 택배비 줄이 없으면 "택배 전용 품목이 들어있어 택배줄이 필요해요" 라고 막힙니다 — [＋ 택배 추가] 누르고 다시 시도하세요.</li>
<li>택배비/용차비 가격이나 개수가 0이면 못 보냅니다.</li>
</ul>
</div>
<div class="scenario">
<h4>📘 처음부터 끝까지 따라하기 — "꽃계탕 2개 주문"</h4>
<ol>
<li><b>로그인</b> → 자동으로 주문 화면이 열림</li>
<li>검색창에 "꽃계탕" 치고 <kbd>엔터</kbd></li>
<li>꽃계탕 카드의 [＋ 담기]를 <b>두 번</b> 클릭 → 우상단 토스트 두 번 뜸</li>
<li>위쪽 초록색 장바구니 바 숫자가 1 → 2 로 변함</li>
<li>장바구니 바 클릭 → 펼쳐서 "꽃계탕 2개 ₩9,000" 확인</li>
<li>장바구니 바 우측 [주문하기] 클릭 → 확인 알림 → [발주]</li>
<li>"주문 완료 — 주문번호: ORD-20260507-0001" 알림 → 확인 → [내 주문 내역]으로 자동 이동</li>
</ol>
</div>
<h4>화면이 어떻게 생겼나요?</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com (주문 화면)</span></div>
<div class="body">
<!-- 카트 바 -->
<div style="background:#fff;border:2px solid #6ee7b7;border-radius:10px;padding:12px;margin-bottom:12px">
<div class="row" style="border-bottom:0">
<span>🛒 <b>장바구니</b> <span class="badge b-sage">담은 개수 3</span></span>
<span>면세 9,000원 · 과세 16,545원 · <b style="color:#0f766e">총 27,200원</b> &nbsp; <span class="btn btn-emerald">주문하기</span> ▼</span>
</div>
</div>
<p style="font-size:12.5px;color:#94a3b8;margin:0 0 10px">▲ 장바구니를 누르면 펼쳐지면서 [택배비 추가] [용차비 추가] 버튼이 보여요</p>
<!-- 검색 줄 -->
<div class="row"><span>🔍 <b>물건 이름이나 코드로 검색</b></span><span>전체 / 면세 / 과세 ▾ &nbsp; <span class="btn btn-emerald">검색</span></span></div>
<!-- 물건 카드 -->
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px">
<div style="border:1px solid #e2e8f0;border-radius:8px;padding:12px;background:#fff;text-align:center">
📦<br>
<b>꽃계탕</b> <span class="badge b-violet">면세</span><br>
<b style="color:#0f766e">4,500원</b><br>
<small>창고에 212개 있음</small><br>
<span class="btn btn-emerald" style="display:block;margin-top:6px">＋ 담기</span>
</div>
<div style="border:1px solid #e2e8f0;border-radius:8px;padding:12px;background:#fff;text-align:center">
📦<br>
<b>빨강 탈취제</b><br>
<b style="color:#0f766e">9,200원</b><br>
<small>창고에 100개 있음</small><br>
<span class="btn btn-emerald" style="display:block;margin-top:6px">＋ 담기</span>
</div>
<div style="border:1px solid #fdba74;border-radius:8px;padding:12px;background:#fff7ed;text-align:center">
📦<br>
<b>김치찌개</b> <span class="badge b-orange">택배만</span><br>
<b style="color:#0f766e">12,000원</b><br>
<small>창고에 50개 있음</small><br>
<span class="btn btn-emerald" style="display:block;margin-top:6px">＋ 담기</span>
</div>
</div>
</div>
</div>
<h4>물건 카드에 붙은 표시들</h4>
<table>
<thead><tr><th width="120">표시</th><th>뜻</th><th>가게가 알아둘 점</th></tr></thead>
<tbody>
<tr><td><span class="badge b-violet">면세</span></td><td>세금이 붙지 않는 물건</td><td>그냥 참고만 — 시스템이 알아서 세금 계산</td></tr>
<tr><td><span class="badge b-orange">택배만</span></td><td>택배로만 보내는 물건</td><td>이걸 담으면 <b>택배비 줄이 자동으로 추가</b>돼요. 빼면 주문이 안 돼요.</td></tr>
<tr><td>"한 번에 30개까지만"</td><td>한 번에 담을 수 있는 최대 개수</td><td>이 개수까지만 담겨요. 더 담고 싶으면 모모 직원에게 권한 신청.</td></tr>
<tr><td>"창고에 0개"가 빨간색</td><td>품절</td><td>[＋ 담기] 버튼이 눌리지 않아요</td></tr>
</tbody>
</table>
<h4>주문하는 순서</h4>
<ol class="steps">
<li><b>물건 검색</b><small>물건 이름이나 코드를 적고 [검색] 또는 <kbd>엔터</kbd> 키. 위쪽의 '면세/과세' 칸에서 종류를 골라 더 좁힐 수도 있어요.</small></li>
<li><b>＋ 담기 버튼 누르기</b><small>장바구니에 1개 들어가요. 같은 물건을 다시 누르면 개수가 1 늘어나요. 창고에 있는 양보다 많이 담으려고 하면 못 담는다고 알려줘요.</small></li>
<li><b>장바구니 펼쳐서 개수 조절</b><small>위쪽 초록색 장바구니 바를 누르면 펼쳐져요. <kbd>−</kbd> <kbd>+</kbd> 버튼이나 숫자 직접 입력으로 개수를 바꿀 수 있어요.</small></li>
<li><b>택배비 / 용차비 추가하기 (필요할 때만)</b><small>'택배만'으로 표시된 물건을 담으면 <b>택배비 줄이 자동으로 1줄 추가</b>돼요. 직접 추가하려면 [＋ 택배 추가] 또는 [＋ 용차 추가] 버튼. 같은 버튼을 다시 누르면 새 줄이 생기지 않고 <b>그 줄의 개수가 1 늘어나요</b>.</small></li>
<li><b>택배비/용차비 가격·개수 수정</b><small>기본 가격 — 택배 4,000원 / 용차 5,000원. 담당자 이름·가격·개수 다 수기로 고칠 수 있어요. 개수 × 가격 = 합계가 자동 계산돼요.</small></li>
<li><b>[주문하기] 버튼 누르기</b><small>총 얼마, 몇 개라고 다시 한 번 물어봐요. [주문] 누르면 끝. 주문 번호가 나와요(예: ORD-20260507-0001). 끝나면 '내 주문 내역' 화면으로 자동으로 이동해요.</small></li>
</ol>
<div class="warn">
<b>⚠️ "택배 전용 품목이 들어있어 택배줄이 필요해요" 라고 뜨면</b>
<p>장바구니에 <span class="badge b-orange">택배만</span> 표시 물건이 있어요. 이런 물건은 반드시 택배비 줄이 1개 이상 있어야 주문이 돼요. 자동으로 들어가야 정상이지만 안 보이면 [＋ 택배 추가] 버튼을 눌러서 줄을 만들어 주세요.</p>
</div>
<div class="scenario">
<h4>📘 따라하기 예시 — "꽃계탕 2개 + 탈취제 2개 주문하기"</h4>
<ol>
<li>로그인 → 주문 화면이 자동으로 열려요</li>
<li>"꽃계탕"을 검색창에 치고 [검색] → [＋ 담기] 버튼을 두 번 클릭 (개수 2)</li>
<li>"탈취제"를 검색 → [＋ 담기] 두 번 클릭 (개수 2)</li>
<li>위쪽 장바구니 바 클릭 → 펼쳐서 개수 확인</li>
<li>총 27,200원 확인 → [주문하기] → [주문]</li>
<li>"주문 완료 — 주문번호 ORD-20260507-0001" 알림 → 확인</li>
</ol>
</div>
<!-- 가.2 주문 내역 -->
<h3 id="u-orders">가-2. 내 주문 내역 보기 + 수정·취소</h3>
<p class="lead">왼쪽 메뉴의 <b>거래처 주문 → 내 주문 내역</b>을 누르면 내가 주문한 전체 이력을 볼 수 있어요. 출고 전인 주문은 여기서 <b>수량을 고치거나 품목을 빼거나 통째로 취소</b>할 수 있습니다.</p>
<h4>① 주문 이력 목록 화면</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com / 내 주문 내역</span></div>
<div class="body">
<div class="row" style="margin-bottom:8px"><b>내 발주 이력 (전체 5건)</b><span><span class="btn btn-emerald">⬇ 엑셀</span> <span class="btn btn-emerald">새 발주</span></span></div>
<div class="row" style="font-size:11.5px;color:#94a3b8;border:0">행을 누르면 거래명세표가 큰 창으로 떠요</div>
<table class="demo-table" style="margin-top:6px">
<thead><tr><th>발주번호</th><th>발주일</th><th>합계</th><th>상태</th><th>동작</th></tr></thead>
<tbody>
<tr><td>ORD-20260507-0001</td><td class="ctr">5/7</td><td class="num">27,200</td><td class="ctr"><span class="badge b-amber">출고요청</span></td><td class="ctr">👁 보기</td></tr>
<tr><td>ORD-20260506-0003</td><td class="ctr">5/6</td><td class="num">37,200</td><td class="ctr"><span class="badge b-sky">출고완료</span></td><td class="ctr">👁 보기</td></tr>
<tr><td>ORD-20260505-0002</td><td class="ctr">5/5</td><td class="num">120,500</td><td class="ctr"><span class="badge b-sage">입금완료</span></td><td class="ctr">👁 보기</td></tr>
</tbody>
</table>
</div>
</div>
<ul>
<li>한 줄을 클릭하거나 [👁 보기] 버튼 → 거래명세표 모달 열림</li>
<li>위쪽 [⬇ 엑셀] 버튼 → 전체 이력 엑셀로 받기</li>
</ul>
<h4>② 거래명세표 모달 — 모양 한눈에</h4>
<div class="screen">
<div class="body" style="background:#f8fafc">
<div style="background:#fff;border-radius:10px;padding:18px;max-width:680px;margin:0 auto">
<div style="display:flex;gap:8px;justify-content:flex-start;margin-bottom:10px">
<span class="btn btn-orange">📤 이미지 공유</span>
<span class="btn btn-emerald">⬇ 엑셀 다운로드</span>
<span class="btn btn-rose">🗑 주문 취소</span>
</div>
<div style="text-align:center;font-size:18px;letter-spacing:.4em;font-weight:700;padding:8px 0">거&nbsp;래&nbsp;명&nbsp;세&nbsp;표</div>
<div style="font-size:11px"><b>발주번호</b> · ORD-20260507-0001 &nbsp;｜&nbsp; <b>발주일자</b> · 2026-05-07 &nbsp;｜&nbsp; <b>현재상태</b> · 출고요청</div>
<div style="margin:8px 0;padding:8px;background:#fffbeb;border:1px solid #fde68a;border-radius:6px;font-size:11px">✏️ 출고요청 상태 — 품목 수량을 직접 고치거나 [×]로 삭제할 수 있어요. 저장은 자동.</div>
<table class="demo-table">
<thead><tr><th>#</th><th>품명</th><th>구분</th><th>수량</th><th>단가</th><th>합계</th><th></th></tr></thead>
<tbody>
<tr class="r-delivery"><td class="ctr">1</td><td><span class="badge b-orange">택배</span> 택배비</td><td class="ctr">과세</td><td class="num">1</td><td class="num">4,000</td><td class="num">4,000</td><td class="ctr">자동</td></tr>
<tr class="r-item"><td class="ctr">2</td><td>꽃계탕</td><td class="ctr" style="color:#7c3aed">면세</td><td class="num"><span style="border:1px solid #cbd5e1;padding:2px 8px;background:#fff">2</span></td><td class="num">4,500</td><td class="num">9,000</td><td class="ctr"><span style="color:#e11d48">×</span></td></tr>
</tbody>
</table>
<div style="text-align:right;margin-top:6px;font-size:11px"><b>총 합계 ₩ 13,000</b></div>
</div>
</div>
</div>
<h4>③ 상태별로 할 수 있는 일 (요약표)</h4>
<table>
<thead><tr><th>상태</th><th>의미</th><th>할 수 있는 일</th></tr></thead>
<tbody>
<tr>
<td><span class="badge b-amber">출고요청</span></td>
<td>주문이 들어갔고 모모 직원이 처리하기 전</td>
<td><b>수량 수정 / 품목 삭제 / 주문 취소</b> 모두 가능. 거래명세표 이미지 공유 / 엑셀.</td>
</tr>
<tr>
<td><span class="badge b-sky">출고완료</span></td>
<td>물건이 나갔고 거래명세표 메일이 와 있음</td>
<td>거래명세표 이미지 공유 / 엑셀 다운로드. 수정 불가.</td>
</tr>
<tr>
<td><span class="badge b-sage">입금완료</span></td>
<td>입금이 등록됨</td>
<td>거래명세표 보기. 세금계산서 대기.</td>
</tr>
<tr>
<td><span class="badge b-violet">계산서발행</span></td>
<td>전자세금계산서 발행 완료</td>
<td>홈택스에서 사업자번호로 조회 가능.</td>
</tr>
<tr>
<td><span class="badge b-slate">취소</span></td>
<td>주문이 취소됨</td>
<td>—</td>
</tr>
</tbody>
</table>
<h4>④ 출고요청 상태 — 수량 수정하기</h4>
<ol class="steps">
<li><b>거래명세표 모달 열기</b><small>[내 주문 내역]에서 출고요청 상태 행 클릭</small></li>
<li><b>품목 행의 수량 칸 클릭</b><small>네모난 입력 칸이 활성화돼요. 새 수량을 입력하세요.</small></li>
<li><b>다른 곳 클릭하거나 <kbd>엔터</kbd></b><small>입력 칸에서 빠져나가는 순간 자동 저장. 위쪽 합계도 즉시 갱신.</small></li>
<li><b>재고/한도 초과 시 자동 막힘</b><small>"재고를 초과할 수 없습니다" 또는 "1회 발주 한도 초과" 알림.</small></li>
</ol>
<h4>⑤ 출고요청 상태 — 품목 1개만 빼기</h4>
<ol class="steps">
<li><b>품목 행 우측 끝의 [×] 버튼 클릭</b></li>
<li><b>"이 품목을 주문에서 삭제하시겠습니까?" 확인</b><small>[삭제] 누르면 그 품목만 빠져요. 다른 품목과 택배/용차는 그대로.</small></li>
</ol>
<h4>⑥ 출고요청 상태 — 주문 전체 취소</h4>
<ol class="steps">
<li><b>모달 위쪽 [🗑 주문 취소] 버튼 클릭</b></li>
<li><b>"주문을 취소하시겠습니까?" 확인 → [취소]</b><small>주문 상태가 <span class="badge b-slate">취소</span>로 변하고 더는 처리되지 않습니다.</small></li>
</ol>
<div class="warn">
<b>⚠️ 알아두세요</b>
<ul style="margin:6px 0 0;padding-left:20px">
<li>택배비·용차비 줄은 거래처가 못 고쳐요. 모모 담당자가 출고할 때 조정합니다.</li>
<li>출고완료 상태가 되면 <b>수정·취소 불가</b>. 잘못 보냈으면 모모 담당자에게 직접 연락하세요.</li>
<li>가격·단가는 시스템 표준값으로 자동 계산돼요 (변경 불가).</li>
</ul>
</div>
<h4>⑦ 거래명세표 공유 / 엑셀</h4>
<ul>
<li><span class="btn btn-orange">📤 이미지 공유</span> — 거래명세표를 PNG 이미지로 만들어서 카톡으로 공유하거나 휴대폰에 저장. 휴대폰이면 카톡 선택 창이 뜨고, 컴퓨터면 이미지 파일이 다운로드 폴더에 저장돼요.</li>
<li><span class="btn btn-emerald">⬇ 엑셀 다운로드</span> — 거래명세표를 엑셀 파일(.xlsx)로 저장. 인쇄나 보관용.</li>
</ul>
<h4>주문 상태별 뜻</h4>
<table>
<thead><tr><th width="130">상태</th><th>무슨 뜻인가요?</th><th>가게가 할 일</th></tr></thead>
<tbody>
<tr><td><span class="badge b-amber">출고요청</span></td><td>주문이 들어갔고, 모모 직원이 처리하기를 기다리는 중</td><td>혹시 취소하고 싶으면 모모유통에 전화·문자로 연락</td></tr>
<tr><td><span class="badge b-sky">출고완료</span></td><td>모모 직원이 확인해서 보냈어요. 창고 재고는 줄었어요. 거래명세표가 메일로 와 있어요.</td><td>거래명세표 받아서 확인 + 입금 진행</td></tr>
<tr><td><span class="badge b-sage">입금완료</span></td><td>입금이 들어왔다고 모모 직원이 등록했어요</td><td>세금계산서를 기다리세요</td></tr>
<tr><td><span class="badge b-violet">계산서발행</span></td><td>전자세금계산서가 발행됐어요</td><td>홈택스에서 사업자번호로 조회 가능</td></tr>
<tr><td><span class="badge b-slate">취소</span></td><td>주문이 취소됐어요</td><td>—</td></tr>
</tbody>
</table>
<p>오른쪽 위 [엑셀] 버튼을 누르면 전체 주문 내역을 엑셀 파일로 받을 수 있어요.</p>
<!-- 가.3 내 정보 -->
<h3 id="u-profile">가-3. 내 정보·비밀번호 바꾸기</h3>
<p>화면 오른쪽 위에 있는 <b>내 이름</b>을 누르면 들어가져요.</p>
<ul>
<li><b>기본 정보 수정</b> — 가게 이름, 대표자, 전화번호, 이메일, 주소, 사업자번호를 고치고 [저장] 누르세요.</li>
<li><b>비밀번호 변경</b> — 지금 쓰는 비밀번호를 한 번 입력 → 새 비밀번호(4자 이상)를 두 번 입력 → [비밀번호 변경].</li>
</ul>
</section>
<!-- ============================================================ -->
<!-- 나. 출고담당자 -->
<!-- ============================================================ -->
<section id="out-guide">
<h2><span class="role-tag r-out">출고담당</span> 나. 출고 담당자 사용법</h2>
<p class="lead">출고 담당자는 가게가 넣은 주문을 보고 <b>창고에서 물건을 꺼내 보내는 사람</b>이에요. 출고 처리를 하면 창고 재고가 자동으로 줄어요(−). 입금 확인과 세금계산서 끊는 일도 같이 해요.</p>
<!-- 나.1 -->
<h3 id="o-orders">나-1. 주문서 보고 물건 내보내기</h3>
<p>왼쪽 메뉴 <b>출고/정산 → 출고 관리</b>로 들어가요.</p>
<h4>화면 모습 (왼쪽: 주문 목록 / 오른쪽: 거래명세표)</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com (출고 관리)</span></div>
<div class="header-bar"><span><b>주문서 관리 · 출고처리</b></span><span>전체상태 ▾ &nbsp; <span class="btn btn-emerald">조회</span> &nbsp; <span class="btn btn-emerald">🚚 출고하기</span></span></div>
<div class="body" style="display:grid;grid-template-columns:300px 1fr;gap:16px">
<div>
<div style="font-weight:700;font-size:12px;color:#475569;margin-bottom:6px">주문 목록 (총 18건 / 출고 가능 6건)</div>
<table class="demo-table">
<thead><tr><th width="22">☐</th><th>주문번호</th><th>날짜</th><th>상태</th></tr></thead>
<tbody>
<tr style="background:#fff7ed"><td class="ctr">☑</td><td>ORD-20260507-0002</td><td class="ctr">5/7</td><td class="ctr"><span class="badge b-amber">요청</span></td></tr>
<tr><td class="ctr">☐</td><td>ORD-20260507-0001</td><td class="ctr">5/7</td><td class="ctr"><span class="badge b-amber">요청</span></td></tr>
<tr><td class="ctr">—</td><td>ORD-20260506-0003</td><td class="ctr">5/6</td><td class="ctr"><span class="badge b-sky">완료</span></td></tr>
</tbody>
</table>
</div>
<div>
<div style="font-weight:700;font-size:12px;color:#475569;margin-bottom:6px">거래명세표 미리보기 &nbsp; <span style="color:#0f766e">⬇ 엑셀 다운로드</span></div>
<div style="text-align:center;font-size:18px;letter-spacing:.4em;font-weight:700;padding:10px 0">거&nbsp;래&nbsp;명&nbsp;세&nbsp;표</div>
<div style="font-size:12px;line-height:1.7"><b>주문번호</b> · ORD-20260507-0002 &nbsp;｜&nbsp; <b>주문일자</b> · 2026-05-07 &nbsp;｜&nbsp; <b>현재상태</b> · 출고요청</div>
<div style="margin:8px 0;padding:10px;border:1px solid #e2e8f0;border-radius:6px;background:#fafafa;font-size:12px"><b>홍길동상회</b> 귀하<br><span style="color:#94a3b8">대표:홍길동 · ☎ 010-1234-5678</span></div>
<div style="margin:10px 0">
<span class="btn btn-light-orange">＋ 택배 추가</span>
&nbsp;
<span class="btn btn-light-sky">＋ 용차 추가</span>
</div>
<table class="demo-table">
<thead><tr><th width="22">#</th><th>물건명</th><th>구분</th><th>창고</th><th>개수</th><th>가격</th><th>합계</th><th width="40"></th></tr></thead>
<tbody>
<tr class="r-delivery"><td class="ctr">1</td><td><span class="badge b-orange">택배</span> 택배비</td><td class="ctr">과세</td><td class="ctr">-</td><td class="ctr">[1]</td><td class="num">[4000]</td><td class="num"><b>4,000</b></td><td>✓ ✕</td></tr>
<tr class="r-charter"><td class="ctr">2</td><td><span class="badge b-sky">용차</span> 용차</td><td class="ctr">과세</td><td class="ctr">-</td><td class="ctr">[2]</td><td class="num">[5000]</td><td class="num"><b>10,000</b></td><td>✓ ✕</td></tr>
<tr class="r-item"><td class="ctr">3</td><td>꽃계탕</td><td class="ctr" style="color:#7c3aed">면세</td><td class="ctr">212</td><td class="ctr">2</td><td class="num">4,500</td><td class="num"><b>9,000</b></td><td></td></tr>
<tr class="r-item"><td class="ctr">4</td><td>빨강 탈취제</td><td class="ctr" style="color:#e11d48">과세</td><td class="ctr">100</td><td class="ctr">2</td><td class="num">9,200</td><td class="num"><b>18,400</b></td><td></td></tr>
</tbody>
</table>
<div style="text-align:right;margin-top:10px;font-size:13px"><b>총 합계 (세금 포함) 41,400원</b></div>
</div>
</div>
</div>
<h4>출고하는 순서</h4>
<ol class="steps">
<li><b>주문 고르기</b><small>왼쪽 목록에서 <span class="badge b-amber">출고요청</span> 상태인 주문을 체크박스로 선택해요. 여러 개 한꺼번에 선택 가능. 다른 상태(이미 출고된 것)는 체크가 안 돼요.</small></li>
<li><b>오른쪽에서 거래명세표 확인</b><small>왼쪽에서 한 줄을 누르면 오른쪽에 자세한 내용이 떠요. <b>창고 재고가 부족한 줄은 빨간색</b>으로 보이고 위쪽에 경고 박스가 떠요. 재고 부족 상태로는 출고가 안 돼요.</small></li>
<li><b>(필요할 때만) 택배비/용차비 추가</b><small>가게가 빠뜨렸거나 가격을 조정해야 할 때 [+ 택배 추가] [+ 용차 추가] 버튼으로 줄을 만들고, 담당자 이름/가격/개수를 직접 적어요. ✓ 누르면 저장, ✕ 누르면 삭제.</small></li>
<li><b>위쪽 [🚚 출고하기] 버튼 누르기</b><small>"N건 출고하시겠습니까?" 알림 → [출고]. 누르는 즉시:<br>① 창고 재고 자동으로 줄어듦(−)<br>② 거래명세표 엑셀 파일이 자동으로 만들어짐<br>③ 가게 메일로 거래명세표가 자동 발송됨<br>④ 상태가 <span class="badge b-sky">출고완료</span>로 바뀜</small></li>
<li><b>결과 확인</b><small>"출고 처리 완료 (성공 N건 / 실패 M건)" 알림이 떠요. 메일 발송에 실패한 건수도 같이 알려줘요.</small></li>
</ol>
<h4>택배비/용차비 줄 직접 고치기 ('출고요청' 상태일 때만)</h4>
<ul>
<li><span class="btn btn-light-orange">+ 택배 추가</span> 또는 <span class="btn btn-light-sky">+ 용차 추가</span> 누르기 — 이미 그 종류의 줄이 있으면 <b>그 줄의 개수가 +1</b> 늘어나고, 없으면 새 줄이 생겨요.</li>
<li>줄에서 <b>담당자 이름·가격·개수</b>를 그 자리에서 바로 고칠 수 있어요. <kbd>✓</kbd>로 저장, <kbd>✕</kbd>로 삭제.</li>
<li>일반 물건 줄은 여기서 고칠 수 없어요. (물건 자체를 바꾸려면 가게가 다시 주문해야 함)</li>
<li>택배비/용차비 줄은 항상 <b>물건 줄 위쪽에</b> 보여요.</li>
</ul>
<div class="tip">
<b>💡 택배 전용 물건의 자동 처리</b>
<p>물품 등록할 때 "택배전용"으로 설정한 물건이 가게의 주문에 들어 있으면, 시스템이 알아서 택배비 줄을 1줄 추가해요. 출고 담당자는 가격/개수만 검토하면 돼요.</p>
</div>
<h4>주문 거절하기</h4>
<p>거래명세표 아래의 [✕ 반려] 버튼을 누르면 주문이 취소돼요. (재고는 영향 없음) 가게에 따로 전화/메시지로 이유를 알려 주세요.</p>
<h4>출고 끝난 뒤 — 세금계산서 끊기</h4>
<p>출고완료/입금완료 상태인 주문의 거래명세표 아래쪽에 <span class="btn btn-rose">세금계산서 발행</span> <span class="btn btn-violet">계산서(면세)</span> 두 버튼이 떠요. 누르면 [나-3 세금계산서 끊기] 화면과 같은 흐름으로 처리돼요.</p>
<!-- 나.2 -->
<h3 id="o-payments">나-2. 입금 들어왔는지 확인하기</h3>
<p>왼쪽 메뉴 <b>출고/정산 → 입금 관리</b>.</p>
<ol class="steps">
<li><b>출고완료 주문 고르기</b><small>입금 대기 상태(<span class="badge b-sky">출고완료</span>)인 주문 목록이 떠요</small></li>
<li><b>입금일·입금액 입력하고 [등록]</b><small>전액 입금이면 상태가 <span class="badge b-sage">입금완료</span>로, 일부만 들어왔으면 미수금이 표시돼요</small></li>
</ol>
<!-- 나.3 -->
<h3 id="o-einvoices">나-3. 세금계산서 끊기</h3>
<p>왼쪽 메뉴 <b>출고/정산 → 전자세금계산서</b>. 출고/입금이 끝난 주문에 대해 세금계산서를 한꺼번에 발행할 수 있어요. 부가세 신고 시점에 일괄 처리해도 되고, 그때그때 처리해도 돼요.</p>
<h4>화면 모습</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com (전자세금계산서)</span></div>
<div class="body">
<div class="row" style="margin-bottom:8px"><b>발행 가능한 주문</b><span><span class="btn btn-slate">새로고침</span> <span class="btn btn-emerald">⬇ 엑셀</span></span></div>
<table class="demo-table">
<thead><tr><th>주문번호</th><th>일자</th><th>거래처</th><th>합계</th><th>상태</th><th>발행</th></tr></thead>
<tbody>
<tr><td>ORD-20260506-0003</td><td class="ctr">5/6</td><td>홍길동상회</td><td class="num">37,200</td><td class="ctr">출고완료</td><td class="ctr"><span class="btn btn-emerald">▶ 세금계산서</span></td></tr>
</tbody>
</table>
<div style="margin-top:14px"><b>지금까지 발행한 내역</b> &nbsp; 기간 [날짜][날짜] · 상태 ▾ <span class="btn btn-slate">조회</span></div>
<table class="demo-table">
<thead><tr><th>발행일</th><th>거래처</th><th>구분</th><th>합계</th><th>승인번호</th><th>상태</th></tr></thead>
<tbody>
<tr><td>5월 6일</td><td>홍길동상회</td><td class="ctr"><span class="badge b-rose">세금</span></td><td class="num">37,200</td><td>20260506-...</td><td class="ctr"><span class="badge b-sage">완료</span></td></tr>
</tbody>
</table>
</div>
</div>
<h4>발행하는 순서</h4>
<ol class="steps">
<li><b>발행 가능한 주문 확인</b><small>출고완료/입금완료 상태인 주문이 자동으로 떠요. [새로고침] 누르면 갱신.</small></li>
<li><b>[▶ 세금계산서] 버튼 누르기</b><small>"발행하시겠습니까?" 알림 → [발행]. 시스템이 자동으로 처리해서 결과를 알려줘요. (승인번호, 처리방식)</small></li>
<li><b>결과 확인</b><small>아래 [지금까지 발행한 내역] 표에서 상태 <span class="badge b-sage">완료</span> 인지 보면 돼요. 승인번호는 24자리 숫자.</small></li>
<li><b>엑셀로 받기</b><small>월말에 [⬇ 엑셀] 누르면 발행 내역을 엑셀로 다운로드 받을 수 있어요. 회계장부나 부가세 신고할 때 사용.</small></li>
</ol>
<div class="warn">
<b>⚠️ 지금은 시범 모드예요 (실제로 국세청에 보내지 않아요)</b>
<p>현재는 발행 버튼을 눌러도 모모 시스템 안에만 기록되고 진짜 국세청에 전송되지는 않아요. 실제로 보내려면 다음 준비가 필요해요:</p>
<ol style="margin-top:8px;padding-left:24px">
<li>사업자용 공동인증서 발급 (한국정보인증, 사인코리아 등에서. 1년에 4~5만원)</li>
<li>홈택스 홈페이지에서 "전자세금계산서 ERP 연계 신청"</li>
<li>승인되면 시스템에 인증서 연결 후 시범 환경에서 100건 정도 검증</li>
<li>검증 끝나면 운영 모드로 전환 → 진짜 국세청 발송 시작</li>
</ol>
<p style="margin-top:8px">이 작업은 시스템 개발자에게 부탁하시면 됩니다.</p>
</div>
<h4>거래명세표 화면에서도 발행 가능</h4>
<p>[나-1 출고 관리] 화면에서 출고/입금이 끝난 주문의 거래명세표 아래에 <span class="btn btn-rose">세금계산서 발행</span> 버튼이 떠 있어요. 거기서 눌러도 똑같이 발행돼요.</p>
</section>
<!-- ============================================================ -->
<!-- 다. 입고 / 마스터 -->
<!-- ============================================================ -->
<section id="in-guide">
<h2><span class="role-tag r-in">입고담당</span> <span class="role-tag r-master">물품등록</span> 다. 입고 담당자·물품 등록 담당자 사용법</h2>
<p class="lead">입고 담당자는 도매처에서 물건을 사 와서 창고에 쌓는 사람이에요. <b>입고 등록을 하면 창고 재고가 자동으로 늘어요(+)</b>. 물품 등록 담당자는 팔 물건, 가게 회원, 도매처 등 기본 정보를 등록·관리해요.</p>
<!-- 다.1 -->
<h3 id="i-procurement">다-1. 물건 매입하기 (공급업체에 주문)</h3>
<p>왼쪽 메뉴 <b>매입/입고 → 매입 발주</b>. 화면이 좌-우로 갈라져서 왼쪽엔 발주서 목록, 오른쪽엔 양식이 보여요.</p>
<ol class="steps">
<li><b>[+ 새 발주] 버튼</b><small>오른쪽 발주서 양식이 빈 상태로 새로 열려요. 발주서 번호가 자동으로 부여돼요(예: PRC-20260507-0001)</small></li>
<li><b>공급업체 선택</b><small>발주서 위쪽 표에서 공급업체를 드롭다운으로 선택. 미리 [공급업체 관리]에 등록되어 있어야 해요.</small></li>
<li><b>[+ 품목 추가] 버튼 → 품목 모달</b><small>새 창이 떠요. 검색창에 품목명/코드 적고 [검색]. 위쪽에 <b>'현재 발주서 공급업체만'</b> 필터 토글이 있어 그 공급업체 품목만 골라 볼 수 있고, <b>'결과 내 검색'</b> 칸으로 더 좁힐 수 있어요. 체크박스로 다중 선택(헤더 체크로 전체) 후 [선택한 N개 추가].</small></li>
<li><b>발주서에서 수량/단가 직접 수정</b><small>각 행의 수량과 단가 칸을 클릭해서 바꾸고, 다른 곳을 누르면 자동 저장. 행 오른쪽 [×]로 삭제. 합계는 자동 재계산.</small></li>
<li><b>비고 적기</b><small>발주서 아래쪽 '비고' 칸에 납품 장소, 납품 기간, 대금지불 조건 등 자유 입력. 다른 곳 누르면 자동 저장.</small></li>
<li><b>[발주 요청] 버튼</b><small>오른쪽 위 초록색 버튼. 누르면:<br>① 상태가 <span class="badge b-amber">발주요청</span>으로 바뀌고<br>② 공급업체 이메일로 발주서 메일이 자동 발송됩니다.<br>이메일이 없으면 '메일 미발송' 안내가 떠요 — 직접 통보 필요.</small></li>
<li><b>물건이 도착하면</b><small>다음 단계인 [입고 처리] 화면에서 입고 등록</small></li>
</ol>
<h4>발주서 공유 / 엑셀 다운로드</h4>
<p>발주서 양식 위쪽에 두 버튼이 있어요:</p>
<ul>
<li><span class="btn btn-orange">📤 이미지 공유</span> — 발주서를 이미지로 캡처. 휴대폰이면 카톡 선택, 컴퓨터면 PNG 파일 다운로드.</li>
<li><span class="btn btn-emerald">⬇ 엑셀 다운로드</span> — 발주서를 엑셀 파일로 저장. 인쇄나 보관용으로 활용.</li>
</ul>
<div class="tip">
<b>💡 공급업체별 품목 일괄 불러오기</b>
<p>품목 모달에서 '현재 발주서 공급업체만' 필터를 켜면 그 공급업체에 등록된 모든 품목이 보여요. 헤더 체크박스로 전체 선택 → [선택한 N개 추가] 누르면 한 번에 다 들어가요. 그 후 필요한 것만 남기고 [×] 로 빼면 돼요.</p>
</div>
<!-- 다.2 -->
<h3 id="i-inbound">다-2. 입고 처리 — 발주 선택 후 라인별 입고</h3>
<p class="lead">물건이 창고에 도착하면 이 화면에서 입고 등록 → <b>재고가 자동으로 증가</b>합니다. 발주 한 번 했지만 일부만 들어오는 경우 — 들어온 만큼만 입력하고 나머지는 다음에 마저 입고할 수 있어요.</p>
<h4>화면 구성 — 좌-우 분할 (발주 선택 → 라인별 입력)</h4>
<div class="screen">
<div class="browser-bar"><span class="dots"><i></i><i></i><i></i></span><span class="url">momotogether.com / 입고 처리</span></div>
<div class="body" style="display:grid;grid-template-columns:330px 1fr;gap:12px">
<div>
<div style="font-weight:700;font-size:11px;color:#475569;margin-bottom:6px">발주서 목록 (입고 가능)</div>
<table class="demo-table">
<thead><tr><th>발주번호</th><th>공급업체</th><th>발주/입고/미입고</th><th>상태</th></tr></thead>
<tbody>
<tr style="background:#fffbeb"><td>PRC-20260507-0001</td><td>(주)AVATEC</td><td class="ctr">10 / 0 / 10</td><td class="ctr"><span class="badge b-amber">발주요청</span></td></tr>
<tr><td>PRC-20260506-0002</td><td>제일상사</td><td class="ctr">20 / <b style="color:#0f766e">15</b> / <b style="color:#e11d48">5</b></td><td class="ctr"><span class="badge b-orange">입고중</span></td></tr>
<tr><td>PRC-20260505-0003</td><td>(주)AVATEC</td><td class="ctr">8 / 8 / 0</td><td class="ctr"><span class="badge b-sage">입고완료</span></td></tr>
</tbody>
</table>
</div>
<div>
<div style="font-weight:700;font-size:11px;color:#475569;margin-bottom:6px">입고 입력 — PRC-20260506-0002 <span class="btn btn-emerald" style="float:right">💾 입고 등록</span></div>
<table class="demo-table">
<thead><tr><th>#</th><th>품목</th><th>발주</th><th>기입고</th><th>남은</th><th>창고</th><th>정상 입고</th><th>불량</th></tr></thead>
<tbody>
<tr style="background:#ecfdf5"><td class="ctr">1</td><td>꽃계탕 ✓ 완료</td><td class="num">10</td><td class="num" style="color:#0f766e">10</td><td class="num" style="color:#94a3b8">0</td><td class="ctr">-</td><td class="ctr">-</td><td class="ctr">-</td></tr>
<tr><td class="ctr">2</td><td>탈취제</td><td class="num">10</td><td class="num" style="color:#0f766e">5</td><td class="num" style="color:#e11d48"><b>5</b></td><td class="ctr">[본사창고 ▾]</td><td class="num">[5]</td><td class="num">[0]</td></tr>
</tbody>
</table>
</div>
</div>
</div>
<h4>입고 처리 단계</h4>
<ol class="steps">
<li><b>왼쪽에서 발주서 선택</b><small>'입고 가능 (발주요청 + 입고중)' 필터가 기본. 한 줄 클릭하면 오른쪽에 라인이 펼쳐져요. <span class="badge b-sage">입고완료</span>는 더 이상 입력 안 됨.</small></li>
<li><b>발주/입고/미입고 숫자 확인</b><small>예: <b>10 / 5 / 5</b> = 발주 10개, 이미 5개 입고됨, 남은 5개. 이 발주는 <span class="badge b-orange">입고중</span> 상태.</small></li>
<li><b>각 라인의 [창고 선택] + [정상 입고] 수량 입력</b><small>창고는 [창고 관리]에 미리 등록한 곳에서 선택. 정상 입고는 <b>남은 수량 이하</b>로만 입력 가능 (자동 클램프). 불량 있으면 [불량] 칸에도 적기.</small></li>
<li><b>입고 안 할 라인은 0으로 두기</b><small>완전히 입고된 라인(남은 0)은 자동으로 <b>✓ 완료</b> 표시되고 입력 칸이 사라져요.</small></li>
<li><b>위쪽 [💾 입고 등록] 클릭</b><small>"입고 처리하시겠습니까?" 확인 → [입고]. 누르는 즉시:<br>① 정상 입고 수량만큼 창고 재고 자동 증가<br>② 발주서 라인의 '기입고' 누적<br>③ 모든 라인 완전 입고면 발주서 상태 → <span class="badge b-sage">입고완료</span><br>④ 일부만 입고면 발주서 상태 → <span class="badge b-orange">입고중</span> (다음에 다시 와서 마저 입고)</small></li>
</ol>
<div class="tip">
<b>💡 부분 입고 시나리오</b>
<p>월요일 발주 10개 → 화요일 5개만 도착했다면:</p>
<ol style="padding-left:22px;margin:4px 0 0">
<li>화요일: 발주서 선택 → 정상 입고에 5 입력 → [입고 등록] → 발주서 상태 <span class="badge b-orange">입고중</span></li>
<li>목요일 나머지 5개 도착: 같은 발주서를 다시 선택 → 정상 입고에 5 입력 → [입고 등록] → 발주서 상태 <span class="badge b-sage">입고완료</span></li>
</ol>
</div>
<h4>발주/입고/미입고 표시 의미</h4>
<table>
<thead><tr><th width="180">표시</th><th>의미</th></tr></thead>
<tbody>
<tr><td><b>10 / 0 / 10</b></td><td>발주만 했고 입고는 아직. 상태 <span class="badge b-amber">발주요청</span></td></tr>
<tr><td><b>10 / 5 / 5</b></td><td>일부만 입고. 상태 <span class="badge b-orange">입고중</span> — 5개 더 들어와야 함</td></tr>
<tr><td><b>10 / 10 / 0</b></td><td>전부 입고 완료. 상태 <span class="badge b-sage">입고완료</span> — 더 이상 입고 입력 불가</td></tr>
</tbody>
</table>
<div class="tip">
<b>💡 입고 vs 출고 — 헷갈리지 마세요</b>
<ul style="margin:6px 0 0;padding-left:24px">
<li><b>입고</b>: 공급업체 → 모모 창고로 들어옴 → 재고 <b>+</b></li>
<li><b>출고</b>: 모모 창고 → 가게(거래처)로 나감 → 재고 <b>−</b></li>
</ul>
</div>
<!-- 다.3 -->
<h3 id="i-inventory">다-3. 창고에 뭐가 얼마나 있는지 보기</h3>
<p>왼쪽 메뉴 <b>매입/입고 → 재고 관리</b>.</p>
<ul>
<li>창고별·물건별로 지금 몇 개 있는지 한눈에 봐요</li>
<li>언제 들어오고 나갔는지 기록도 다 확인 가능</li>
<li>창고 사이 이동이나 재고 조정도 등록할 수 있어요</li>
</ul>
<!-- 다.4 -->
<h3 id="i-items">다-4. 팔 물건 등록·수정하기</h3>
<p class="lead">왼쪽 메뉴 <b>마스터 관리 → 품목 관리</b>. 가게가 주문 화면에서 보는 물건 카드를 여기서 만들고 관리해요.</p>
<h4>등록·수정할 때 적는 칸들</h4>
<div style="border:1px solid var(--border);border-radius:8px;background:#fafafa">
<div class="field-row"><b>물건 이름 *</b><span class="desc">가게 주문 화면에 표시될 이름</span></div>
<div class="field-row"><b>제조사</b><span class="desc">[제조사 관리]에 미리 등록한 회사 중에서 고르기</span></div>
<div class="field-row"><b>공급업체</b><span class="desc">⭐ 이 물건을 사 오는 도매처. [공급업체 관리]에서 미리 등록. 매입 발주 시 자동으로 이 업체에 발주서가 연결됨</span></div>
<div class="field-row"><b>단위</b><span class="desc">개(EA), 박스(BOX), 킬로그램(KG), 리터(L), 팩(PACK) 중 선택</span></div>
<div class="field-row"><b>구분 (면세/과세)</b><span class="desc">면세 = 세금 없음 / 과세 = 세금 있음. 라디오로 골라요</span></div>
<div class="field-row"><b>판매가 (세금 포함)</b><span class="desc">가게에게 보여주는 가격. 세금이 포함된 금액</span></div>
<div class="field-row"><b>원가</b><span class="desc">우리가 도매처에서 산 가격. 마진(이익) 계산에 사용</span></div>
<div class="field-row"><b>한 번에 주문 가능 수량</b><span class="desc">한 번 주문에 몇 개까지 살 수 있는지. 비워두면 제한 없음. 가게에 권한을 풀어주면 무시됨</span></div>
<div class="field-row"><b>숨김 처리</b><span class="desc">"숨김" 고르면 일반 가게에게는 안 보여요. 권한 받은 가게에게만 보임</span></div>
<div class="field-row"><b>택배 전용</b><span class="desc">⭐ "택배전용" 고르면 가게가 이 물건을 장바구니에 담을 때 <b>택배비 줄이 자동으로 추가</b>돼요</span></div>
<div class="field-row"><b>제조관리 정보</b><span class="desc">유통기한·원산지·들어올 때 가격·보관온도·바코드·메모. 입고할 때 참고용</span></div>
</div>
<h4>물건 목록에서 한눈에 알아보는 표시</h4>
<table>
<tbody>
<tr><td><span class="badge b-sage">사용</span> / <span class="badge b-slate">중지</span></td><td>판매 중 / 판매 안 함</td></tr>
<tr><td><span class="badge b-amber">숨김</span></td><td>일반 가게 화면에는 안 보임 (권한자만 보임)</td></tr>
<tr><td><span class="badge b-sky">≤30</span></td><td>한 번에 30개까지만 주문 가능</td></tr>
<tr><td><span class="badge b-orange">택배</span></td><td>택배 전용 — 장바구니에 담으면 택배비 줄이 자동 생김</td></tr>
</tbody>
</table>
<div class="scenario">
<h4>📘 따라하기 예시 — "신상품 김치찌개 등록 (택배 전용, 면세)"</h4>
<ol>
<li>마스터 관리 → 품목 관리 → [+ 새로 등록]</li>
<li>물건 이름: <b>김치찌개</b>, 제조사 선택, 단위 개</li>
<li>구분: <b>면세</b>, 판매가 <b>12,000원</b>, 원가 8,000원</li>
<li>한 번에 주문 가능 수량: <b>30</b> (한 번에 30개까지만)</li>
<li>숨김 처리: 공개</li>
<li>택배 전용: <b>택배전용</b> 선택 → 가게가 담으면 자동으로 택배비 줄 추가됨</li>
<li>이미지 올리기 → [저장]</li>
<li>물건 목록 그리드에 <span class="badge b-sage">사용</span><span class="badge b-violet">면세</span><span class="badge b-sky">≤30</span><span class="badge b-orange">택배</span> 배지가 뜸</li>
</ol>
</div>
<!-- 다.5 -->
<h3 id="i-customers">다-5. 거래처(가게) 정보·권한 관리</h3>
<p>왼쪽 메뉴 <b>마스터 관리 → 거래처 회원 관리</b>. 가입한 가게들의 정보와 특수 권한을 관리해요.</p>
<h4>특수 권한 두 가지</h4>
<table>
<thead><tr><th width="180">권한 이름</th><th>켜면 어떻게 되나요?</th><th>언제 켜주나요?</th></tr></thead>
<tbody>
<tr><td><b>제한수량 해지</b></td><td>모든 물건의 "한 번에 N개까지" 제한이 사라져요. 창고에 있는 만큼 다 살 수 있어요.</td><td>오래 거래한 단골 가게, 한 번에 많이 사가는 가게</td></tr>
<tr><td><b>숨김처리 보기</b></td><td>"숨김"으로 등록된 물건도 주문 화면에 보여요</td><td>특정 카테고리 전문 가게, 신상품을 먼저 보여줄 가게</td></tr>
</tbody>
</table>
<ol class="steps">
<li><b>가게 검색</b><small>아이디, 가게 이름, 이메일로 찾기</small></li>
<li><b>[✏ 수정] 누르기</b><small>해당 가게의 수정 화면이 열려요</small></li>
<li><b>특수 권한 체크박스 켜고 저장</b><small>다음 로그인부터 바로 적용돼요</small></li>
</ol>
<!-- 다.6 -->
<h3 id="i-others">다-6. 도매처·창고·제조사 등록</h3>
<p>왼쪽 메뉴 <b>마스터 관리</b> 안에 있어요.</p>
<table>
<thead><tr><th>메뉴 이름</th><th>여기에 등록하는 것</th></tr></thead>
<tbody>
<tr><td>공급업체 관리</td><td>물건을 사 오는 도매처/제조처 — 회사 이름, 연락처, 사업자번호, 이메일, 주소. 발주서를 메일로 받을 곳.</td></tr>
<tr><td>창고 관리</td><td>창고 — 본사 창고, 김포 지사 창고, 픽업 장소 등 분류</td></tr>
<tr><td>제조사 관리</td><td>물건을 만든 회사. 물건 등록할 때 여기서 골라요.</td></tr>
</tbody>
</table>
</section>
<!-- ============================================================ -->
<!-- 라. 통계 -->
<!-- ============================================================ -->
<section id="stat-guide">
<h2><span class="role-tag r-stat">통계</span> 라. 매출·이익 분석하기</h2>
<table>
<thead><tr><th>메뉴</th><th>여기서 볼 수 있는 것</th></tr></thead>
<tbody>
<tr><td>대시보드</td><td>오늘·이번 달 매출, 진행 중인 주문 등 한눈에 요약</td></tr>
<tr><td>월간 매출 (가게별)</td><td>년/월을 고르면 가게별 면세·과세·총 매출이 표 + 막대그래프(상위 15개)로 보여요</td></tr>
<tr><td>일자별 매출</td><td>기간을 고르면 날짜별 매출 추이가 막대그래프 + 주문 건수 라인으로 보여요</td></tr>
<tr><td>원가/마진</td><td>월별로 어떤 물건이 얼마나 팔렸고, 원가 빼면 이익이 얼마인지 (상위 10개 그래프)</td></tr>
<tr><td><b>거래처×일자 매출 (피벗) ⭐</b></td><td>월간 토탈 면세/과세 + 일자별 분리 표. <b>부가세 신고 자료</b>로 그대로 활용 가능. 한 번에 계산서 발행할 금액을 한눈에 확인.</td></tr>
</tbody>
</table>
<p>모든 통계 화면 오른쪽 위에 <span class="btn btn-emerald">⬇ 엑셀</span> 버튼이 있어서 엑셀 파일로 받을 수 있어요.</p>
</section>
<!-- ============================================================ -->
<!-- 5. 흐름도 -->
<!-- ============================================================ -->
<section id="flow">
<h2>5. 전체 일이 어떻게 흘러가나요?</h2>
<pre class="flow">
[입고 담당자] [거래처(가게)] [출고 담당자]
│ │ │
① 도매처에 물건 주문 │ │
│ │ │
② 물건 들어오면 입고 등록 │ │
│ → 창고 재고 + │ │
│ │ │
└────► 창고에 재고 쌓임 ────────► │ │
│ │
③ 가게가 주문 │
(물건 + 자동 택배) │
│ │
└─────► ④ 출고 담당이 주문 확인 ──┘
│
▼
⑤ 창고 재고 −
⑥ 거래명세표 메일 발송 (가게에게)
⑦ 상태 = 출고완료
│
⑧ 가게가 입금 ─────────► ⑨ 입금 등록
│ 상태 = 입금완료
▼
⑩ 세금계산서 발행
│ 상태 = 계산서발행
▼
⑪ 매출·이익 분석 (월말)
</pre>
</section>
<!-- ============================================================ -->
<!-- 6. FAQ -->
<!-- ============================================================ -->
<section id="faq">
<h2>6. 자주 묻는 질문</h2>
<h3>Q1. <span class="role-tag r-user">거래처</span> 주문하려는데 "택배 전용 품목이 들어있어 택배줄이 필요해요"라고 떠요</h3>
<p>장바구니에 <span class="badge b-orange">택배만</span> 표시 물건이 있어요. 이런 물건은 반드시 택배비 줄이 1줄 이상 있어야 주문이 돼요. 자동으로 들어가야 정상이지만, 안 보이면 [＋ 택배 추가] 버튼을 눌러서 줄을 만들어 주세요.</p>
<h3>Q2. <span class="role-tag r-user">거래처</span> 한 번에 더 많이 담고 싶어요</h3>
<p>물건마다 "한 번에 N개까지"라는 제한이 있어요. 모모 직원에게 연락해서 "제한수량 해지" 권한을 부탁하면 풀려요. 권한이 풀리면 창고에 있는 만큼 다 살 수 있어요.</p>
<h3>Q3. <span class="role-tag r-user">거래처</span> 안 보이는 물건이 있는 것 같아요</h3>
<p>일부 물건은 모모유통이 일반 가게에게는 보이지 않게 숨겨 둘 수 있어요. "숨김처리 보기" 권한을 받으면 그런 물건도 볼 수 있어요. 모모 직원에게 권한 신청하세요.</p>
<h3>Q4. <span class="role-tag r-out">출고담당</span> 출고 처리했는데 가게에 메일이 안 갔다고 해요</h3>
<p>출고 결과 알림창에 "메일 N건 실패"라고 표시돼요. [거래처 회원 관리]에서 그 가게의 이메일 주소가 정확한지 확인해 주세요. 그래도 안 가면 시스템 개발자에게 연락 (메일 서버 점검 필요).</p>
<h3>Q5. <span class="role-tag r-out">출고담당</span> 거래명세표에서 [+ 택배 추가] 눌렀는데 개수가 화면에 안 바뀌어요</h3>
<p>화면을 새로고침(F5)하면 정상으로 보여요. (이 부분은 5월 7일 패치에서 자동 동기화로 수정됐어요)</p>
<h3>Q6. <span class="role-tag r-out">출고담당</span> 세금계산서 발행했는데 결과에 "시범 모드"라고 떠요</h3>
<p>지금은 진짜 국세청에 보내지 않고 시스템 내부에만 기록되는 상태예요. 진짜로 발송하려면 다음이 필요해요:</p>
<ol>
<li>사업자용 공동인증서 (한국정보인증, 사인코리아 등에서 발급, 1년에 4~5만원)</li>
<li>홈택스 → 전자세금계산서 ERP 연계 신청 (1~3일 승인)</li>
<li>인증서 등록 + 시스템 운영 모드로 전환</li>
</ol>
<p>이 작업은 시스템 개발자에게 부탁하시면 돼요.</p>
<h3>Q7. <span class="role-tag r-in">입고담당</span> 입고 처리했는데 재고가 안 늘어요</h3>
<p>입고 등록할 때 창고 선택을 빠뜨리지 않았는지 확인해 보세요. [재고 관리] 화면에서 그 물건의 입출고 이력을 보면 등록된 건이 보일 거예요.</p>
<h3>Q8. <span class="role-tag r-master">물품등록</span> 거래처 가게가 비밀번호를 까먹었대요</h3>
<p>왼쪽 메뉴의 [관리자 패널 → 사용자 관리]에서 그 가게를 찾아 임시 비밀번호로 초기화해 주세요. 그 가게에게 임시 비밀번호를 알려주고, 로그인 후 [내 정보] 화면에서 본인이 직접 바꾸도록 안내하세요.</p>
<h3>Q9. 휴대폰에서 화면이 잘 안 맞아요</h3>
<p>주문 화면, 통계 화면 등 거의 모든 화면이 휴대폰에서도 잘 보이도록 만들어졌어요. 만약 깨진다면 새로고침을 한 번 해보세요. 왼쪽 메뉴는 햄버거 버튼(≡)을 눌러서 펼치고 접을 수 있어요.</p>
<h3>Q10. 거래명세표나 세금계산서를 인쇄하고 싶어요</h3>
<p>거래명세표는 [엑셀] 버튼으로 다운받은 뒤 엑셀에서 인쇄하면 돼요. 세금계산서는 운영 모드 활성화 후에 홈택스에서 PDF로 출력할 수 있어요.</p>
<hr>
<p style="text-align:right;font-size:12px;color:#94a3b8;margin:0">
이 설명서는 2026년 5월 7일에 만들어졌어요 · 모모유통 · <a href="https://momotogether.com" style="color:#94a3b8">momotogether.com</a>
</p>
</section>
</div>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink