6b60178b1d
Deploy momo-erp / deploy (push) Successful in 51s
[화면 — /m/admin/procurements 전면 개편] - 좌측: 발주서 리스트 (상태 필터, 발주번호, 공급업체, 금액) - 우측: 발주서 양식 (이미지의 표준 발주서 형태) · 분류번호/발주서번호/발주일/공급업체 표 · "1. 물품의 표시" 표 (품명·단위·수량·단가·금액) · "2. 비고" 텍스트 영역 · 합계 자동 계산 - [+ 새 발주] / [발주 요청] 상단 버튼 - 작성중(OPEN) 상태에서만 인라인 편집 가능, 발주요청 후 잠김 [품목 추가 모달] - 검색 + [공급업체 필터(현재/전체)] + [결과 내 검색] - 다중 선택 + 헤더 체크박스로 전체 선택 - 이미 담긴 품목은 '이미' 표시 - 한 번에 N개 일괄 추가 (수량 1, 원가는 품목 마스터의 cost_price) [API 4종 신설] - POST /api/m/procurements/create-empty: 빈 발주서 1건 생성 (proc_no 자동 부여, status=OPEN) - POST /api/m/procurements/lines/save: 라인 추가/수정/삭제 + 합계 재집계 (트랜잭션) · 같은 품목 중복 추가 시 수량 누적 - POST /api/m/procurements/update-header: 공급업체/메모 수정 - POST /api/m/procurements/send: 발주 요청 — status OPEN→REQUESTED + 공급업체 이메일로 발주서 HTML 메일 발송 · 메일 실패해도 상태는 변경 (mailSent/mailError 응답) [매뉴얼] - 다-1 매입 발주 단계별 가이드 재작성 - "공급업체별 품목 일괄 불러오기" 팁 추가 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
772 lines
54 KiB
HTML
772 lines
54 KiB
HTML
<!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>로그인하면 자동으로 이 화면이 열려요.</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 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> <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>전체 / 면세 / 과세 ▾ <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>왼쪽 메뉴의 <b>거래처 주문 → 내 주문 내역</b> 을 누르면 보여요.</p>
|
||
<ul>
|
||
<li><b>주문번호 또는 [보기] 클릭</b> → 거래명세표가 큰 창으로 떠요</li>
|
||
<li>거래명세표 위쪽에 <span class="btn btn-orange">📤 이미지 공유</span> <span class="btn btn-emerald">⬇ 엑셀 다운로드</span> 버튼이 있어 카톡 공유나 파일 저장 가능</li>
|
||
<li><b>출고요청 상태</b>인 주문은 <span class="btn btn-rose">🗑 주문 취소</span> 버튼이 떠 있어요. 수량 수정이 필요하면 취소 후 새로 작성하세요.</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>전체상태 ▾ <span class="btn btn-emerald">조회</span> <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">거래명세표 미리보기 <span style="color:#0f766e">⬇ 엑셀 다운로드</span></div>
|
||
<div style="text-align:center;font-size:18px;letter-spacing:.4em;font-weight:700;padding:10px 0">거 래 명 세 표</div>
|
||
<div style="font-size:12px;line-height:1.7"><b>주문번호</b> · ORD-20260507-0002 | <b>주문일자</b> · 2026-05-07 | <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>
|
||
|
||
<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> 기간 [날짜][날짜] · 상태 ▾ <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>
|
||
<div class="tip">
|
||
<b>💡 공급업체별 품목 일괄 불러오기</b>
|
||
<p>품목 모달에서 '현재 발주서 공급업체만' 필터를 켜면 그 공급업체에 등록된 모든 품목이 보여요. 헤더 체크박스로 전체 선택 → [선택한 N개 추가] 누르면 한 번에 다 들어가요. 그 후 필요한 것만 남기고 [×] 로 빼면 돼요.</p>
|
||
</div>
|
||
|
||
<!-- 다.2 -->
|
||
<h3 id="i-inbound">다-2. 물건 들어오면 등록하기 (창고에 쌓임)</h3>
|
||
<p class="lead">물건이 창고에 도착하면 이 화면에서 등록해요. 등록하면 <b>창고 재고가 늘어나요(+)</b>.</p>
|
||
<ol class="steps">
|
||
<li><b>입고할 매입 발주 고르기</b><small>아직 입고 안 된 발주서 목록이 떠요</small></li>
|
||
<li><b>입고 개수 / 창고 / 입고일 적기</b><small>주문할 때 적은 개수랑 실제 들어온 개수가 다를 수 있어요. 부분 입고도 가능해요.</small></li>
|
||
<li><b>[입고 등록] 누르기</b><small>해당 창고의 재고가 N개만큼 늘어나요. 누가 언제 무엇을 입고했는지 기록도 남아요.</small></li>
|
||
</ol>
|
||
<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>
|
||
</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>
|