hskwon
aca1767eb9
- URL 하드코딩 → .env APP_URL 기반 동적 URL로 변경 - DB 연결 하드코딩 → .env 기반으로 변경 - MySQL strict mode DATE 오류 수정
1142 lines
45 KiB
PHP
1142 lines
45 KiB
PHP
<?php
|
|
require_once($_SERVER['DOCUMENT_ROOT'] . "/session.php");
|
|
?>
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>MVP 법인카드 세무항목 매칭 전략 - 6주 실행 계획</title>
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
|
|
min-height: 100vh;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.presentation-container {
|
|
width: 100%;
|
|
height: 100vh;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.slide {
|
|
width: 100%;
|
|
height: 100vh;
|
|
display: none;
|
|
align-items: flex-start;
|
|
justify-content: center;
|
|
padding: 40px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.slide.active {
|
|
display: flex;
|
|
animation: slideInRight 0.5s ease-out;
|
|
}
|
|
|
|
.slide-content {
|
|
background: rgba(255, 255, 255, 0.95);
|
|
border-radius: 20px;
|
|
padding: 60px;
|
|
max-width: 1200px;
|
|
width: 100%;
|
|
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
animation: fadeIn 0.8s ease-out;
|
|
margin: auto 0;
|
|
}
|
|
|
|
h1 {
|
|
color: #fa709a;
|
|
font-size: 3em;
|
|
margin-bottom: 20px;
|
|
text-align: center;
|
|
}
|
|
|
|
h2 {
|
|
color: #fa709a;
|
|
font-size: 2.5em;
|
|
margin-bottom: 30px;
|
|
text-align: center;
|
|
border-bottom: 3px solid #fee140;
|
|
padding-bottom: 15px;
|
|
}
|
|
|
|
h3 {
|
|
color: #fa709a;
|
|
font-size: 1.8em;
|
|
margin: 25px 0 15px 0;
|
|
}
|
|
|
|
h4 {
|
|
color: #f7931e;
|
|
font-size: 1.3em;
|
|
margin: 15px 0 10px 0;
|
|
}
|
|
|
|
p, li {
|
|
font-size: 1.2em;
|
|
line-height: 1.8;
|
|
color: #333;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
ul, ol {
|
|
margin-left: 30px;
|
|
}
|
|
|
|
.week-card {
|
|
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
|
|
color: white;
|
|
padding: 30px;
|
|
border-radius: 15px;
|
|
margin: 20px 0;
|
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.week-card h3 {
|
|
color: white;
|
|
margin-top: 0;
|
|
border-bottom: 2px solid rgba(255, 255, 255, 0.3);
|
|
padding-bottom: 10px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.week-card p, .week-card li {
|
|
color: white;
|
|
}
|
|
|
|
.task-list {
|
|
background: #fff3e0;
|
|
padding: 20px;
|
|
border-radius: 10px;
|
|
margin: 15px 0;
|
|
border-left: 4px solid #fa709a;
|
|
}
|
|
|
|
.task-list h4 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.deliverable-box {
|
|
background: #fff3cd;
|
|
border-left: 5px solid #ffc107;
|
|
padding: 20px;
|
|
border-radius: 10px;
|
|
margin: 15px 0;
|
|
}
|
|
|
|
.deliverable-box h4 {
|
|
color: #856404;
|
|
margin-top: 0;
|
|
}
|
|
|
|
.deliverable-box p, .deliverable-box li {
|
|
color: #856404;
|
|
}
|
|
|
|
.success-metrics {
|
|
background: #d4edda;
|
|
border-left: 5px solid #28a745;
|
|
padding: 20px;
|
|
border-radius: 10px;
|
|
margin: 15px 0;
|
|
}
|
|
|
|
.success-metrics h4 {
|
|
color: #155724;
|
|
margin-top: 0;
|
|
}
|
|
|
|
.success-metrics p, .success-metrics li {
|
|
color: #155724;
|
|
}
|
|
|
|
.comparison-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin: 25px 0;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.comparison-table th,
|
|
.comparison-table td {
|
|
padding: 12px;
|
|
border: 1px solid #ddd;
|
|
text-align: left;
|
|
}
|
|
|
|
.comparison-table thead tr {
|
|
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
|
|
color: white;
|
|
}
|
|
|
|
.comparison-table tbody tr:nth-of-type(even) {
|
|
background: #f3f3f3;
|
|
}
|
|
|
|
.highlight-box {
|
|
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
|
|
color: white;
|
|
padding: 30px;
|
|
border-radius: 15px;
|
|
margin: 20px 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.highlight-box p {
|
|
color: white;
|
|
}
|
|
|
|
.navigation {
|
|
position: fixed;
|
|
bottom: 30px;
|
|
right: 30px;
|
|
display: flex;
|
|
gap: 15px;
|
|
z-index: 1000;
|
|
}
|
|
|
|
.nav-btn {
|
|
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
|
|
color: white;
|
|
border: none;
|
|
padding: 15px 30px;
|
|
border-radius: 50px;
|
|
cursor: pointer;
|
|
font-size: 1.1em;
|
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.nav-btn:hover {
|
|
transform: translateY(-3px);
|
|
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
|
|
}
|
|
|
|
.home-btn {
|
|
position: fixed;
|
|
top: 30px;
|
|
left: 30px;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
color: white;
|
|
border: none;
|
|
padding: 12px 25px;
|
|
border-radius: 50px;
|
|
cursor: pointer;
|
|
font-size: 1em;
|
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
|
|
transition: all 0.3s ease;
|
|
z-index: 1000;
|
|
text-decoration: none;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.home-btn:hover {
|
|
transform: translateY(-3px);
|
|
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
|
|
background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
|
|
}
|
|
|
|
.slide-number {
|
|
position: fixed;
|
|
bottom: 30px;
|
|
left: 30px;
|
|
background: rgba(255, 255, 255, 0.9);
|
|
padding: 10px 20px;
|
|
border-radius: 25px;
|
|
font-size: 1.1em;
|
|
color: #fa709a;
|
|
font-weight: bold;
|
|
z-index: 1000;
|
|
}
|
|
|
|
@keyframes slideInRight {
|
|
from {
|
|
transform: translateX(100%);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.slide-content {
|
|
padding: 30px;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2em;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.8em;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 1.4em;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
p, li {
|
|
font-size: 1em;
|
|
}
|
|
|
|
.navigation {
|
|
bottom: 15px;
|
|
right: 15px;
|
|
}
|
|
|
|
.nav-btn {
|
|
padding: 10px 20px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.slide-number {
|
|
bottom: 15px;
|
|
left: 15px;
|
|
padding: 8px 15px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.home-btn {
|
|
top: 15px;
|
|
left: 15px;
|
|
padding: 10px 20px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.comparison-table {
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.comparison-table th,
|
|
.comparison-table td {
|
|
padding: 8px;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- Home Button -->
|
|
<a href="cardstrategy_index.php" class="home-btn">
|
|
<span>🏠</span>
|
|
<span>전략선택</span>
|
|
</a>
|
|
|
|
<div class="presentation-container">
|
|
<!-- Slide 1: Cover -->
|
|
<div class="slide active">
|
|
<div class="slide-content">
|
|
<h1>MVP 법인카드 세무항목 매칭 전략</h1>
|
|
<h2 style="border: none; color: #f7931e;">6주 실행 계획</h2>
|
|
<div style="text-align: center; margin-top: 50px;">
|
|
<p style="font-size: 1.5em; color: #fa709a;">법인카드 내역을 자동으로 세무항목에 매칭하는 핵심 솔루션</p>
|
|
<p style="margin-top: 30px; color: #666;">바로빌 API 기반 빠른 구현</p>
|
|
<div class="highlight-box" style="margin-top: 50px;">
|
|
<p style="font-size: 1.3em;"><strong>목표:</strong> 6주 안에 실무에서 사용 가능한 법인카드 세무 자동화 시스템 MVP 완성</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 2: MVP Philosophy -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>MVP 철학 및 범위</h2>
|
|
|
|
<div class="highlight-box">
|
|
<h3 style="color: white; margin-top: 0;">핵심 원칙</h3>
|
|
<p style="font-size: 1.2em;">"수작업 70% → 자동화 90%로 세무 업무 효율 극대화"</p>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>🎯 MVP 목표</h3>
|
|
<ul>
|
|
<li>법인카드 내역 자동 수집 및 정규화</li>
|
|
<li>룰 기반 세무항목 자동 분류 (정확도 90%)</li>
|
|
<li>금전출납부 전표 자동 생성</li>
|
|
<li>세무 담당자 검토 시간 단축 (시간 → 분)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>✅ MVP 핵심 기능</h3>
|
|
<ul>
|
|
<li><strong>카드 등록:</strong> 법인카드 정보 등록 및 바로빌 연동</li>
|
|
<li><strong>내역 수집:</strong> 바로빌 API를 통한 자동 수집</li>
|
|
<li><strong>룰 기반 분류:</strong> 가맹점명 기반 세무항목 자동 매칭</li>
|
|
<li><strong>금전출납부 생성:</strong> 세무 전표 자동 생성 및 검토</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>🚫 MVP 범위 밖 (Phase 2)</h3>
|
|
<ul>
|
|
<li>ML 기반 지능형 분류 엔진</li>
|
|
<li>영수증 이미지 OCR 처리</li>
|
|
<li>ERP 연동 및 자동 전표 입력</li>
|
|
<li>홈택스 신고보조 파일 생성</li>
|
|
<li>모바일 앱 및 알림 기능</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 3: Week 1-2 Plan -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>Week 1-2: 바로빌 연동 및 기반 구축</h2>
|
|
|
|
<div class="week-card">
|
|
<h3>🏗️ Week 1-2 목표</h3>
|
|
<p>바로빌 샌드박스 연동 및 핵심 DB 스키마 구축</p>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>📋 기획 (Week 1-2)</h4>
|
|
<ul>
|
|
<li><strong>Week 1:</strong> MVP 기능 명세 및 데이터 모델
|
|
<ul>
|
|
<li>법인카드 내역 수집 플로우 정의</li>
|
|
<li>세무항목 분류 룰 체계 설계</li>
|
|
<li>바로빌 카드 API 명세 분석</li>
|
|
<li>가맹점-세무항목 매핑 전략</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 2:</strong> 룰북 및 테스트 시나리오
|
|
<ul>
|
|
<li>세무항목 분류 룰북 초안 (50개 가맹점)</li>
|
|
<li>테스트 시나리오 20개</li>
|
|
<li>검토 워크플로우 정의</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>🎨 디자인 (Week 1-2)</h4>
|
|
<ul>
|
|
<li><strong>Week 1:</strong> 디자인 시스템 구축
|
|
<ul>
|
|
<li>컬러 팔레트 (오렌지/옐로우 계열 - 활력/효율)</li>
|
|
<li>기본 컴포넌트 (카드 리스트, 테이블)</li>
|
|
<li>와이어프레임 5개 화면</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 2:</strong> 핵심 화면 디자인
|
|
<ul>
|
|
<li>카드 등록 및 관리 화면</li>
|
|
<li>내역 수집 및 분류 화면</li>
|
|
<li>금전출납부 검토 대시보드</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>⚙️ 백엔드 (Week 1-2)</h4>
|
|
<ul>
|
|
<li><strong>Week 1:</strong> 바로빌 샌드박스 연동
|
|
<ul>
|
|
<li>바로빌 카드 API 키 발급</li>
|
|
<li>카드 등록 API 연동</li>
|
|
<li>PHP 8.2 프로젝트 초기화</li>
|
|
<li>MySQL 8.0 데이터베이스 설정 (SAM 프로젝트 DB)</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 2:</strong> 핵심 DB 스키마 구축
|
|
<ul>
|
|
<li>cards, card_transactions_raw 테이블</li>
|
|
<li>merchants, rules 테이블</li>
|
|
<li>postings, reports_cashbook 테이블</li>
|
|
<li>카드 내역 수집 스케줄러 설계</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>💻 프론트엔드 (Week 1-2)</h4>
|
|
<ul>
|
|
<li><strong>Week 1:</strong> 프로젝트 설정
|
|
<ul>
|
|
<li>기존 jQuery/Bootstrap 활용</li>
|
|
<li>공통 레이아웃 구성</li>
|
|
<li>Ajax 통신 설정</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 2:</strong> 기본 화면 구현
|
|
<ul>
|
|
<li>대시보드 레이아웃</li>
|
|
<li>테이블 컴포넌트 (DataTables)</li>
|
|
<li>폼 검증 라이브러리</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="deliverable-box">
|
|
<h4>📦 Week 1-2 산출물</h4>
|
|
<ul>
|
|
<li>MVP 기능 명세서 + 룰북 초안 (기획)</li>
|
|
<li>디자인 시스템 + 와이어프레임 (디자인)</li>
|
|
<li>바로빌 연동 + DB 스키마 (백엔드)</li>
|
|
<li>프로젝트 기반 + 레이아웃 (프론트엔드)</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 4: Week 3-4 Plan -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>Week 3-4: 수집/정규화/분류 핵심 기능 구현</h2>
|
|
|
|
<div class="week-card">
|
|
<h3>⚡ Week 3-4 목표</h3>
|
|
<p>카드 내역 수집, 룰 엔진 구현, 전표 생성 API 완성</p>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>📋 기획 (Week 3-4)</h4>
|
|
<ul>
|
|
<li><strong>Week 3:</strong> 룰북 확장 및 정제
|
|
<ul>
|
|
<li>세무항목 분류 룰 100개로 확장</li>
|
|
<li>가맹점명 정규화 규칙 정의</li>
|
|
<li>미분류 건 처리 프로세스</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 4:</strong> QA 준비
|
|
<ul>
|
|
<li>통합 테스트 시나리오</li>
|
|
<li>버그 트래킹 시스템</li>
|
|
<li>사용자 가이드 초안</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>🎨 디자인 (Week 3-4)</h4>
|
|
<ul>
|
|
<li><strong>Week 3:</strong> 나머지 화면 디자인
|
|
<ul>
|
|
<li>룰 관리 화면</li>
|
|
<li>분류 검토 및 수정 화면</li>
|
|
<li>리포트 대시보드</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 4:</strong> 디자인 QA
|
|
<ul>
|
|
<li>프론트엔드 구현 리뷰</li>
|
|
<li>반응형 디자인 검증</li>
|
|
<li>UX 개선사항 반영</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>⚙️ 백엔드 (Week 3-4)</h4>
|
|
<ul>
|
|
<li><strong>Week 3:</strong> 수집 및 룰 엔진 구현
|
|
<ul>
|
|
<li>바로빌 카드 내역 수집 API</li>
|
|
<li>가맹점명 정규화 엔진</li>
|
|
<li>룰 기반 세무항목 매칭 엔진</li>
|
|
<li>수집 스케줄러 구현 (일별)</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 4:</strong> 전표 생성 API
|
|
<ul>
|
|
<li>금전출납부 전표 생성 API</li>
|
|
<li>분류 검토 및 수정 API</li>
|
|
<li>리포트 생성 API</li>
|
|
<li>룰 관리 API (CRUD)</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>💻 프론트엔드 (Week 3-4)</h4>
|
|
<ul>
|
|
<li><strong>Week 3:</strong> 카드 관리 및 수집 화면
|
|
<ul>
|
|
<li>카드 등록 및 관리 폼</li>
|
|
<li>내역 수집 실행 및 모니터링</li>
|
|
<li>수집 결과 테이블</li>
|
|
<li>정규화/분류 결과 표시</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 4:</strong> 분류 검토 화면
|
|
<ul>
|
|
<li>분류 결과 테이블</li>
|
|
<li>미분류 건 수동 매칭</li>
|
|
<li>금전출납부 미리보기</li>
|
|
<li>리포트 대시보드</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="deliverable-box">
|
|
<h4>📦 Week 3-4 산출물</h4>
|
|
<ul>
|
|
<li>룰북 100개 + 테스트 시나리오 (기획)</li>
|
|
<li>전체 화면 디자인 완료 (디자인)</li>
|
|
<li>수집·정규화·분류·전표 생성 API (백엔드)</li>
|
|
<li>카드 관리 + 분류 검토 화면 (프론트엔드)</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 5: Week 5-6 Plan -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>Week 5-6: 통합 테스트 및 베타 런칭</h2>
|
|
|
|
<div class="week-card">
|
|
<h3>🚀 Week 5-6 목표</h3>
|
|
<p>2개 테넌트 베타, 룰북 튜닝, 리포트 생성, 운영전환</p>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>📋 기획 (Week 5-6)</h4>
|
|
<ul>
|
|
<li><strong>Week 5:</strong> 2개 테넌트 베타 테스트
|
|
<ul>
|
|
<li>실제 법인카드로 샌드박스 테스트</li>
|
|
<li>수집·분류·전표 생성 E2E 테스트</li>
|
|
<li>분류 정확도 측정 및 개선</li>
|
|
<li>버그 우선순위 관리</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 6:</strong> 운영전환 준비
|
|
<ul>
|
|
<li>최종 테스트 및 검수</li>
|
|
<li>릴리스 노트 작성</li>
|
|
<li>운영가이드/감사로그 정비</li>
|
|
<li>Phase 2 백로그 정리</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>🎨 디자인 (Week 5-6)</h4>
|
|
<ul>
|
|
<li><strong>Week 5:</strong> 디자인 QA
|
|
<ul>
|
|
<li>크로스 브라우저 테스트</li>
|
|
<li>모바일 반응형 검증</li>
|
|
<li>접근성 체크</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 6:</strong> 마케팅 자료
|
|
<ul>
|
|
<li>제품 스크린샷</li>
|
|
<li>데모 시나리오</li>
|
|
<li>UI 개선사항 문서화</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>⚙️ 백엔드 (Week 5-6)</h4>
|
|
<ul>
|
|
<li><strong>Week 5:</strong> 룰북 튜닝 및 리포트 생성
|
|
<ul>
|
|
<li>베타 피드백 기반 룰북 개선</li>
|
|
<li>미분류율 감소 (20% → 10%)</li>
|
|
<li>금전출납부 리포트 생성</li>
|
|
<li>에러 핸들링 개선</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 6:</strong> 프로덕션 배포
|
|
<ul>
|
|
<li>프로덕션 환경 설정</li>
|
|
<li>백업 및 모니터링</li>
|
|
<li>API 문서화</li>
|
|
<li>보안 점검</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="task-list">
|
|
<h4>💻 프론트엔드 (Week 5-6)</h4>
|
|
<ul>
|
|
<li><strong>Week 5:</strong> 버그 수정 및 최적화
|
|
<ul>
|
|
<li>통합 테스트 버그 수정</li>
|
|
<li>성능 최적화</li>
|
|
<li>로딩 상태 및 에러 처리</li>
|
|
</ul>
|
|
</li>
|
|
<li><strong>Week 6:</strong> 최종 점검 및 배포
|
|
<ul>
|
|
<li>브라우저 호환성 검증</li>
|
|
<li>배포 및 모니터링</li>
|
|
<li>사용자 매뉴얼 배포</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="deliverable-box">
|
|
<h4>📦 Week 5-6 산출물</h4>
|
|
<ul>
|
|
<li>베타 테스트 리포트 + 릴리스 노트 (기획)</li>
|
|
<li>마케팅 자료 + UI 문서 (디자인)</li>
|
|
<li>프로덕션 API + 모니터링 (백엔드)</li>
|
|
<li>배포된 프로덕션 웹앱 (프론트엔드)</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 6: Success Metrics -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>성공 지표 및 완료 기준</h2>
|
|
|
|
<div class="highlight-box">
|
|
<h3 style="color: white; margin-top: 0;">MVP 완료 정의</h3>
|
|
<p style="font-size: 1.2em;">"2개 테넌트가 실제 법인카드 내역을 수집하고 90% 이상 자동 분류하여 금전출납부 생성"</p>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>✅ 필수 완료 항목</h3>
|
|
<table class="comparison-table">
|
|
<thead>
|
|
<tr>
|
|
<th>항목</th>
|
|
<th>완료 기준</th>
|
|
<th>검증 방법</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>카드 등록</strong></td>
|
|
<td>법인카드 정보 등록 및 연동</td>
|
|
<td>2개 테넌트 카드 등록 확인</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>내역 수집</strong></td>
|
|
<td>바로빌 API 자동 수집 성공</td>
|
|
<td>샌드박스 환경 100건 수집</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>룰 기반 분류</strong></td>
|
|
<td>자동 분류율 90% 이상</td>
|
|
<td>100건 중 90건 자동 분류</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>금전출납부 생성</strong></td>
|
|
<td>전표 자동 생성 성공</td>
|
|
<td>분류된 건 전표 생성 확인</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="success-metrics" style="margin-top: 30px;">
|
|
<h4>📊 정량적 목표</h4>
|
|
<ul>
|
|
<li><strong>수집 성공률:</strong> 98% 이상</li>
|
|
<li><strong>자동 분류율:</strong> 90% 이상</li>
|
|
<li><strong>분류 정확도:</strong> 95% 이상</li>
|
|
<li><strong>API 응답 속도:</strong> 평균 1초 이하</li>
|
|
<li><strong>Critical 버그:</strong> 0건</li>
|
|
<li><strong>베타 테스트:</strong> 2개 테넌트 실사용 가능</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 7: Technical Stack -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>기술 스택 (기존 시스템 활용)</h2>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>⚙️ 백엔드 스택</h3>
|
|
<table class="comparison-table">
|
|
<thead>
|
|
<tr>
|
|
<th>기술</th>
|
|
<th>선택 이유</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>PHP 8.2</strong></td>
|
|
<td>최신 PHP 기능 활용 및 성능 향상</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>MySQL 8.0</strong></td>
|
|
<td>SAM 프로젝트 전용 데이터베이스</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>PDO</strong></td>
|
|
<td>준비된 문장으로 SQL 인젝션 방지</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>바로빌 API</strong></td>
|
|
<td>법인카드 내역 수집 전문 서비스</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>💻 프론트엔드 스택</h3>
|
|
<table class="comparison-table">
|
|
<thead>
|
|
<tr>
|
|
<th>기술</th>
|
|
<th>선택 이유</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>jQuery</strong></td>
|
|
<td>기존 프로젝트 표준, 빠른 개발</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Bootstrap</strong></td>
|
|
<td>기존 UI 라이브러리, 일관성 유지</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>DataTables</strong></td>
|
|
<td>카드 내역 테이블 표시</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>jQuery Validation</strong></td>
|
|
<td>폼 검증 간소화</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>🛠️ 개발 도구</h3>
|
|
<ul>
|
|
<li><strong>버전 관리:</strong> Git + .auto-commit.sh</li>
|
|
<li><strong>디자인:</strong> 기존 시스템 UI 패턴 활용</li>
|
|
<li><strong>테스트:</strong> 바로빌 샌드박스 환경</li>
|
|
<li><strong>배포:</strong> Apache + mod_rewrite</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 8: Database Design -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>데이터베이스 설계 (MVP 범위)</h2>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>📊 핵심 테이블 (6개)</h3>
|
|
<table class="comparison-table">
|
|
<thead>
|
|
<tr>
|
|
<th>테이블명</th>
|
|
<th>주요 필드</th>
|
|
<th>용도</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>cards</strong></td>
|
|
<td>id, tenant_id, card_no, card_name, issuer, status</td>
|
|
<td>법인카드 기본정보</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>card_transactions_raw</strong></td>
|
|
<td>id, card_id, trans_date, merchant_raw, amount, status</td>
|
|
<td>수집 원본 내역</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>merchants</strong></td>
|
|
<td>id, merchant_name, normalized_name, category, tax_item_id</td>
|
|
<td>가맹점 마스터</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>rules</strong></td>
|
|
<td>id, pattern, tax_item_id, priority, is_active</td>
|
|
<td>분류 룰</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>postings</strong></td>
|
|
<td>id, trans_id, tax_item_id, amount, posting_date, status</td>
|
|
<td>전표 데이터</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>reports_cashbook</strong></td>
|
|
<td>id, tenant_id, period, report_data, generated_at</td>
|
|
<td>금전출납부 리포트</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px; background: #fff3e0; padding: 20px; border-radius: 10px;">
|
|
<h4>🔗 데이터 흐름</h4>
|
|
<ul>
|
|
<li><strong>1단계:</strong> 바로빌 API → card_transactions_raw (원본 수집)</li>
|
|
<li><strong>2단계:</strong> 정규화 엔진 → merchants (가맹점 정규화)</li>
|
|
<li><strong>3단계:</strong> 룰 엔진 → rules 매칭 (세무항목 분류)</li>
|
|
<li><strong>4단계:</strong> 전표 생성 → postings (금전출납부 전표)</li>
|
|
<li><strong>5단계:</strong> 리포트 생성 → reports_cashbook (최종 리포트)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px; background: #d4edda; padding: 20px; border-radius: 10px;">
|
|
<h4>📋 룰 엔진 우선순위</h4>
|
|
<ul>
|
|
<li><strong>Priority 1:</strong> 정확 매칭 (exact match)</li>
|
|
<li><strong>Priority 2:</strong> 패턴 매칭 (LIKE pattern)</li>
|
|
<li><strong>Priority 3:</strong> 카테고리 매칭 (category-based)</li>
|
|
<li><strong>Priority 4:</strong> 기본값 (default rule)</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 9: Phase 2 Roadmap -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>Phase 2 계획 (MVP 이후)</h2>
|
|
|
|
<div class="highlight-box">
|
|
<h3 style="color: white; margin-top: 0;">MVP 성공 후 확장 로드맵</h3>
|
|
<p style="font-size: 1.2em;">사용자 피드백 기반 점진적 기능 확장</p>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>📈 Phase 2 목표 (4주)</h3>
|
|
<ul>
|
|
<li><strong>ML 분류 엔진:</strong> 룰 기반 → 머신러닝 기반 자동 분류</li>
|
|
<li><strong>영수증 OCR:</strong> 이미지 업로드 및 자동 데이터 추출</li>
|
|
<li><strong>향상된 리포트:</strong> 월별/분기별 세무 분석 리포트</li>
|
|
<li><strong>알림 기능:</strong> 미분류 건, 이상 거래 알림</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px;">
|
|
<h3>🔮 Phase 3 목표 (8주)</h3>
|
|
<ul>
|
|
<li><strong>ERP 연동:</strong> 더존/영림원 자동 전표 입력</li>
|
|
<li><strong>홈택스 신고 보조:</strong> 부가세 신고 파일 자동 생성</li>
|
|
<li><strong>모바일 앱:</strong> 현장 영수증 촬영 및 즉시 분류</li>
|
|
<li><strong>AI 이상 거래 탐지:</strong> 비정상 패턴 자동 감지</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="success-metrics" style="margin-top: 30px;">
|
|
<h4>🎯 장기 비전</h4>
|
|
<p>중소기업을 위한 <strong>완전 자동화 법인카드 세무 관리 플랫폼</strong></p>
|
|
<ul>
|
|
<li>자동 분류율 90% → 98% 향상</li>
|
|
<li>세무 담당자 업무 시간 80% 단축</li>
|
|
<li>세무 오류 및 누락 제로화</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 10: Final Summary -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h2>6주 MVP 요약</h2>
|
|
|
|
<div class="highlight-box">
|
|
<h3 style="color: white; margin-top: 0;">핵심 메시지</h3>
|
|
<p style="font-size: 1.3em;">"수작업 70% → 자동화 90%로의 혁신적 전환"</p>
|
|
</div>
|
|
|
|
<div style="margin-top: 40px;">
|
|
<h3>✅ 최종 체크리스트</h3>
|
|
<table class="comparison-table">
|
|
<thead>
|
|
<tr>
|
|
<th>주차</th>
|
|
<th>핵심 산출물</th>
|
|
<th>검증 방법</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>Week 1-2</strong></td>
|
|
<td>바로빌 연동 + DB 스키마</td>
|
|
<td>샌드박스 API 호출 성공</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Week 3-4</strong></td>
|
|
<td>수집·정규화·분류·전표 생성 API</td>
|
|
<td>100건 수집 + 90건 자동 분류</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Week 5-6</strong></td>
|
|
<td>2개 테넌트 베타 + 운영전환</td>
|
|
<td>실제 법인카드 자동화 성공</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="margin-top: 40px; text-align: center;">
|
|
<p style="font-size: 1.3em; color: #fa709a;"><strong>성공 지표</strong></p>
|
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-top: 30px;">
|
|
<div class="task-list">
|
|
<p style="font-size: 1.5em; color: #fa709a; font-weight: bold; margin: 0;">90%</p>
|
|
<p style="font-size: 1em; margin: 5px 0 0 0;">자동 분류율</p>
|
|
</div>
|
|
<div class="task-list">
|
|
<p style="font-size: 1.5em; color: #fa709a; font-weight: bold; margin: 0;">시간→분</p>
|
|
<p style="font-size: 1em; margin: 5px 0 0 0;">마감 시간</p>
|
|
</div>
|
|
<div class="task-list">
|
|
<p style="font-size: 1.5em; color: #fa709a; font-weight: bold; margin: 0;">95%</p>
|
|
<p style="font-size: 1em; margin: 5px 0 0 0;">분류 정확도</p>
|
|
</div>
|
|
<div class="task-list">
|
|
<p style="font-size: 1.5em; color: #fa709a; font-weight: bold; margin: 0;">2개</p>
|
|
<p style="font-size: 1em; margin: 5px 0 0 0;">베타 테넌트</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slide 11: Thank You -->
|
|
<div class="slide">
|
|
<div class="slide-content">
|
|
<h1 style="font-size: 4em; margin-bottom: 40px;">감사합니다</h1>
|
|
<div style="text-align: center;">
|
|
<p style="font-size: 1.5em; color: #fa709a; margin-bottom: 30px;">MVP 법인카드 세무항목 매칭 전략 - 6주 실행 계획</p>
|
|
<div class="highlight-box" style="margin-top: 50px;">
|
|
<h3 style="color: white; margin-top: 0;">함께 만들어가는 세무 자동화</h3>
|
|
<p style="font-size: 1.2em;">빠르고 확실한 시작으로 세무 업무 효율 극대화</p>
|
|
</div>
|
|
<div style="margin-top: 50px; padding: 30px; background: #fff3e0; border-radius: 15px;">
|
|
<h3>문의 및 피드백</h3>
|
|
<p style="margin-top: 20px;">본 계획안에 대한 의견이나 추가 논의가 필요하신 경우</p>
|
|
<p>프로젝트 팀으로 연락 주시기 바랍니다.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="slide-number">
|
|
<span id="currentSlide">1</span> / <span id="totalSlides">11</span>
|
|
</div>
|
|
|
|
<div class="navigation">
|
|
<button class="nav-btn" id="prevBtn" onclick="changeSlide(-1)">← 이전</button>
|
|
<button class="nav-btn" id="nextBtn" onclick="changeSlide(1)">다음 →</button>
|
|
</div>
|
|
|
|
<script>
|
|
let currentSlide = 1;
|
|
const totalSlides = 11;
|
|
let touchStartX = 0;
|
|
let touchEndX = 0;
|
|
|
|
document.getElementById('totalSlides').textContent = totalSlides;
|
|
|
|
function showSlide(n) {
|
|
const slides = document.querySelectorAll('.slide');
|
|
|
|
if (n > totalSlides) {
|
|
currentSlide = 1;
|
|
}
|
|
if (n < 1) {
|
|
currentSlide = totalSlides;
|
|
}
|
|
|
|
slides.forEach(slide => {
|
|
slide.classList.remove('active');
|
|
});
|
|
|
|
slides[currentSlide - 1].classList.add('active');
|
|
document.getElementById('currentSlide').textContent = currentSlide;
|
|
|
|
document.getElementById('prevBtn').disabled = (currentSlide === 1);
|
|
document.getElementById('nextBtn').disabled = (currentSlide === totalSlides);
|
|
}
|
|
|
|
function changeSlide(direction) {
|
|
currentSlide += direction;
|
|
showSlide(currentSlide);
|
|
}
|
|
|
|
document.addEventListener('keydown', function(event) {
|
|
if (event.key === 'ArrowLeft') {
|
|
changeSlide(-1);
|
|
} else if (event.key === 'ArrowRight' || event.key === ' ') {
|
|
event.preventDefault();
|
|
changeSlide(1);
|
|
}
|
|
});
|
|
|
|
document.addEventListener('touchstart', function(event) {
|
|
touchStartX = event.changedTouches[0].screenX;
|
|
});
|
|
|
|
document.addEventListener('touchend', function(event) {
|
|
touchEndX = event.changedTouches[0].screenX;
|
|
handleSwipe();
|
|
});
|
|
|
|
function handleSwipe() {
|
|
if (touchEndX < touchStartX - 50) {
|
|
changeSlide(1);
|
|
}
|
|
if (touchEndX > touchStartX + 50) {
|
|
changeSlide(-1);
|
|
}
|
|
}
|
|
|
|
showSlide(currentSlide);
|
|
</script>
|
|
</body>
|
|
</html>
|