feat: [claude-code] SAM 활용방안 페이지 추가
- 컨트롤러, 뷰, 라우트 생성 - 7개 섹션: 핵심요약, Before/After, 프로세스플로우, 80%공통화론, 멀티테넌시, AI자동화, 로드맵 - HX-Redirect 패턴 적용
This commit is contained in:
김보곤
20
app/Http/Controllers/ClaudeCode/UsagePlanController.php
Normal file
20
app/Http/Controllers/ClaudeCode/UsagePlanController.php
Normal file
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\ClaudeCode;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Http\Response;
|
||||
use Illuminate\View\View;
|
||||
|
||||
class UsagePlanController extends Controller
|
||||
{
|
||||
public function index(Request $request): View|Response
|
||||
{
|
||||
if ($request->header('HX-Request')) {
|
||||
return response('', 200)->header('HX-Redirect', route('claude-code.usage-plan.index'));
|
||||
}
|
||||
|
||||
return view('claude-code.usage-plan.index');
|
||||
}
|
||||
}
|
||||
442
resources/views/claude-code/usage-plan/index.blade.php
Normal file
442
resources/views/claude-code/usage-plan/index.blade.php
Normal file
@@ -0,0 +1,442 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('title', 'SAM 활용방안')
|
||||
|
||||
@push('styles')
|
||||
<style>
|
||||
.up-card { background: #fff; border-radius: 12px; border: 1px solid #e2e8f0; overflow: hidden; }
|
||||
.up-card-header { padding: 16px 20px; border-bottom: 1px solid #f1f5f9; }
|
||||
.up-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 9999px; font-size: 11px; font-weight: 600; }
|
||||
.up-badge-blue { background: #dbeafe; color: #1d4ed8; }
|
||||
.up-badge-green { background: #dcfce7; color: #166534; }
|
||||
.up-badge-purple { background: #f3e8ff; color: #7c3aed; }
|
||||
.up-badge-amber { background: #fef3c7; color: #92400e; }
|
||||
.up-badge-red { background: #fee2e2; color: #991b1b; }
|
||||
.up-badge-indigo { background: #e0e7ff; color: #3730a3; }
|
||||
.up-badge-gray { background: #f1f5f9; color: #475569; }
|
||||
.up-icon-circle { display: flex; align-items: center; justify-content: center; border-radius: 50%; flex-shrink: 0; }
|
||||
.up-step-flow { display: flex; align-items: stretch; gap: 0; overflow-x: auto; }
|
||||
.up-step-item { flex: 1; min-width: 130px; text-align: center; position: relative; padding: 16px 8px; }
|
||||
.up-step-item:not(:last-child)::after { content: ''; position: absolute; right: -6px; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 10px solid #6366f1; z-index: 1; }
|
||||
.up-step-num { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #6366f1; color: #fff; font-size: 12px; font-weight: 700; margin-bottom: 6px; }
|
||||
.up-bar { height: 28px; border-radius: 6px; display: flex; align-items: center; padding: 0 12px; font-size: 12px; font-weight: 600; color: #fff; transition: width 0.8s ease; }
|
||||
.up-bar-green { background: linear-gradient(90deg, #059669, #10b981); }
|
||||
.up-bar-amber { background: linear-gradient(90deg, #d97706, #f59e0b); }
|
||||
.up-timeline { position: relative; padding-left: 32px; }
|
||||
.up-timeline::before { content: ''; position: absolute; left: 13px; top: 0; bottom: 0; width: 2px; background: #e2e8f0; }
|
||||
.up-timeline-item { position: relative; padding-bottom: 24px; }
|
||||
.up-timeline-item:last-child { padding-bottom: 0; }
|
||||
.up-timeline-dot { position: absolute; left: -25px; top: 4px; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff; }
|
||||
.up-quote { border-left: 3px solid #6366f1; padding: 12px 16px; background: #f5f3ff; border-radius: 0 8px 8px 0; font-style: italic; }
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="space-y-6">
|
||||
|
||||
{{-- 페이지 헤더 --}}
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h1 class="text-2xl font-bold text-gray-900">SAM 활용방안</h1>
|
||||
<p class="mt-1 text-sm text-gray-500">AI 자동화로 중소 제조업을 혁신하다 | (주)코드브릿지엑스의 비전</p>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-xs text-gray-400">CodeBridgeX | 2026.03</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── 핵심 요약 3카드 ─── --}}
|
||||
<div class="flex gap-4" style="flex-wrap: wrap;">
|
||||
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5" style="flex: 1 1 220px; max-width: 340px;">
|
||||
<div class="flex items-center gap-2 text-sm text-gray-500">
|
||||
<svg class="w-4 h-4 text-indigo-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/></svg>
|
||||
코어 모델
|
||||
</div>
|
||||
<div class="text-lg font-bold text-gray-900 mt-1">방화셔터 제조업</div>
|
||||
<div class="text-sm text-gray-500 mt-0.5">경동/주일 실증 완료 기반</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5" style="flex: 1 1 220px; max-width: 340px;">
|
||||
<div class="flex items-center gap-2 text-sm text-gray-500">
|
||||
<svg class="w-4 h-4 text-emerald-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/></svg>
|
||||
확장 전략
|
||||
</div>
|
||||
<div class="text-lg font-bold text-emerald-600 mt-1">80% 공통 + 상품만 변경</div>
|
||||
<div class="text-sm text-gray-500 mt-0.5">중소 제조업 공통 프로세스 활용</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5" style="flex: 1 1 220px; max-width: 340px;">
|
||||
<div class="flex items-center gap-2 text-sm text-gray-500">
|
||||
<svg class="w-4 h-4 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
|
||||
최종 목표
|
||||
</div>
|
||||
<div class="text-lg font-bold text-gray-900 mt-1">Multi-tenant SaaS</div>
|
||||
<div class="text-sm text-gray-500 mt-0.5">다산업군 제조업 플랫폼</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 2: 왜 SAM인가? (Before / After) ─── --}}
|
||||
<div class="up-card">
|
||||
<div class="up-card-header">
|
||||
<h2 class="text-base font-semibold text-gray-800">왜 SAM인가? — Before / After</h2>
|
||||
<p class="text-xs text-gray-400 mt-0.5">중소 제조업의 현실과 SAM이 제시하는 변화</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<div class="flex gap-4" style="flex-wrap: wrap;">
|
||||
{{-- Before --}}
|
||||
<div class="p-4 rounded-lg border border-red-200 bg-red-50" style="flex: 1 1 300px;">
|
||||
<div class="flex items-center gap-2 mb-3">
|
||||
<div class="up-icon-circle" style="width: 28px; height: 28px; background: #dc2626;">
|
||||
<svg class="w-3.5 h-3.5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
|
||||
</div>
|
||||
<span class="font-bold text-red-800 text-sm">Before — 기존 방식</span>
|
||||
</div>
|
||||
<div class="space-y-2 text-sm">
|
||||
<div class="flex items-start gap-2"><span class="text-red-400 mt-0.5">▶</span> <span class="text-gray-700">Excel 수기 관리 — 데이터 유실, 버전 혼란</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-red-400 mt-0.5">▶</span> <span class="text-gray-700">ERP 도입비 수천만원 — 중소기업에 부담</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-red-400 mt-0.5">▶</span> <span class="text-gray-700">업체별 커스텀 6개월+ — 도입까지 긴 시간</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-red-400 mt-0.5">▶</span> <span class="text-gray-700">부서간 정보 단절 — 영업/생산/경영 각자 관리</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- After --}}
|
||||
<div class="p-4 rounded-lg border border-emerald-200 bg-emerald-50" style="flex: 1 1 300px;">
|
||||
<div class="flex items-center gap-2 mb-3">
|
||||
<div class="up-icon-circle" style="width: 28px; height: 28px; background: #059669;">
|
||||
<svg class="w-3.5 h-3.5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
|
||||
</div>
|
||||
<span class="font-bold text-emerald-800 text-sm">After — SAM 도입 후</span>
|
||||
</div>
|
||||
<div class="space-y-2 text-sm">
|
||||
<div class="flex items-start gap-2"><span class="text-emerald-500 mt-0.5">▶</span> <span class="text-gray-700">시스템 기반 통합 관리 — 실시간 데이터 공유</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-emerald-500 mt-0.5">▶</span> <span class="text-gray-700">월 구독 SaaS — 초기 비용 최소화</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-emerald-500 mt-0.5">▶</span> <span class="text-gray-700">멀티테넌시 즉시 입주 — 설정만으로 바로 사용</span></div>
|
||||
<div class="flex items-start gap-2"><span class="text-emerald-500 mt-0.5">▶</span> <span class="text-gray-700">영업~출고 원스톱 자동화 — AI가 연결</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 3: 전체 프로세스 플로우 ─── --}}
|
||||
<div class="up-card">
|
||||
<div class="up-card-header">
|
||||
<h2 class="text-base font-semibold text-gray-800">전체 프로세스 — 영업에서 출고까지</h2>
|
||||
<p class="text-xs text-gray-400 mt-0.5">6단계 비즈니스 플로우와 AI 자동화 포인트</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
{{-- 6단계 스텝 --}}
|
||||
<div class="up-step-flow" style="margin-bottom: 20px;">
|
||||
@php
|
||||
$steps = [
|
||||
['num' => 1, 'title' => '영업', 'ai' => '고객 DB 자동분류', 'color' => '#6366f1'],
|
||||
['num' => 2, 'title' => '상담', 'ai' => 'STT 음성 기록', 'color' => '#8b5cf6'],
|
||||
['num' => 3, 'title' => '견적서', 'ai' => 'AI 자동 산출', 'color' => '#a855f7'],
|
||||
['num' => 4, 'title' => '수주서', 'ai' => '견적→수주 자동 전환', 'color' => '#0ea5e9'],
|
||||
['num' => 5, 'title' => '작업공정', 'ai' => 'AI 공정 최적화', 'color' => '#059669'],
|
||||
['num' => 6, 'title' => '출고', 'ai' => '출고/배송 자동화', 'color' => '#16a34a'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($steps as $step)
|
||||
<div class="up-step-item">
|
||||
<div class="up-step-num" style="background: {{ $step['color'] }};">{{ $step['num'] }}</div>
|
||||
<div class="font-semibold text-gray-800 text-sm">{{ $step['title'] }}</div>
|
||||
<div class="text-xs text-gray-500 mt-1">{{ $step['ai'] }}</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
{{-- 실증 사례 테이블 --}}
|
||||
<div class="mt-4">
|
||||
<div class="text-sm font-medium text-gray-700 mb-2">경동/주일 실증 현황</div>
|
||||
<table class="w-full text-sm">
|
||||
<thead>
|
||||
<tr class="border-b-2 border-gray-200">
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium" style="width: 20%;">단계</th>
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium" style="width: 25%;">구현 기능</th>
|
||||
<th class="text-center py-2 px-3 text-gray-600 font-medium" style="width: 15%;">상태</th>
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium">AI 적용</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@php
|
||||
$cases = [
|
||||
['step' => '영업관리', 'feat' => '고객/거래처 CRM', 'status' => '운영중', 'ai' => '고객 분류 자동화'],
|
||||
['step' => '상담/문의', 'feat' => '상담 이력, 음성 입력', 'status' => '운영중', 'ai' => 'STT 음성→텍스트 변환'],
|
||||
['step' => '견적서', 'feat' => '견적 작성/승인/발송', 'status' => '운영중', 'ai' => 'AI 견적 자동 산출 (개발중)'],
|
||||
['step' => '수주서', 'feat' => '견적→수주 연동', 'status' => '운영중', 'ai' => '자동 전환 프로세스'],
|
||||
['step' => '작업공정', 'feat' => 'BOM, 공정 관리', 'status' => '개발중', 'ai' => 'AI 공정 최적화 (계획)'],
|
||||
['step' => '출고/배송', 'feat' => '출고 지시, 배송 추적', 'status' => '계획', 'ai' => '물류 자동화 (계획)'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($cases as $case)
|
||||
<tr class="border-b border-gray-100 hover:bg-gray-50">
|
||||
<td class="py-2.5 px-3 font-medium text-gray-800">{{ $case['step'] }}</td>
|
||||
<td class="py-2.5 px-3 text-gray-600">{{ $case['feat'] }}</td>
|
||||
<td class="py-2.5 px-3 text-center">
|
||||
@if($case['status'] === '운영중')
|
||||
<span class="up-badge up-badge-green">{{ $case['status'] }}</span>
|
||||
@elseif($case['status'] === '개발중')
|
||||
<span class="up-badge up-badge-blue">{{ $case['status'] }}</span>
|
||||
@else
|
||||
<span class="up-badge up-badge-gray">{{ $case['status'] }}</span>
|
||||
@endif
|
||||
</td>
|
||||
<td class="py-2.5 px-3 text-gray-500 text-xs">{{ $case['ai'] }}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 4: 80% 공통화론 ─── --}}
|
||||
<div class="up-card">
|
||||
<div class="up-card-header">
|
||||
<h2 class="text-base font-semibold text-gray-800">80% 공통화론 — 핵심 설득 논거</h2>
|
||||
<p class="text-xs text-gray-400 mt-0.5">중소 제조업 업무의 80%는 업종과 무관하게 동일하다</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
{{-- 가로 바 차트 --}}
|
||||
<div class="mb-5">
|
||||
<div class="text-sm font-medium text-gray-700 mb-3">업무 구성 비율</div>
|
||||
<div class="flex items-center gap-3 mb-2">
|
||||
<div class="shrink-0 text-xs text-gray-500 text-right" style="width: 70px;">공통 업무</div>
|
||||
<div style="flex: 1;">
|
||||
<div class="up-bar up-bar-green" style="width: 80%;">80% — 영업, 회계, 인사, 재고, 문서</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="shrink-0 text-xs text-gray-500 text-right" style="width: 70px;">커스텀</div>
|
||||
<div style="flex: 1;">
|
||||
<div class="up-bar up-bar-amber" style="width: 20%;">20%</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-xs text-gray-400 mt-2">커스텀 20% = 상품 마스터, 견적 계산식, 공정 시퀀스 (업종마다 다른 부분)</div>
|
||||
</div>
|
||||
|
||||
{{-- 공통 업무 상세 --}}
|
||||
<div class="flex gap-3 mb-5" style="flex-wrap: wrap;">
|
||||
@php
|
||||
$commons = [
|
||||
['name' => '영업/CRM', 'icon' => 'M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z'],
|
||||
['name' => '회계/재무', 'icon' => 'M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z'],
|
||||
['name' => '인사/근태', 'icon' => 'M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z'],
|
||||
['name' => '재고관리', 'icon' => 'M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4'],
|
||||
['name' => '문서/전자결재', 'icon' => 'M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z'],
|
||||
['name' => '품질관리', 'icon' => 'M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($commons as $common)
|
||||
<div class="flex items-center gap-2 bg-emerald-50 border border-emerald-200 rounded-lg px-3 py-2" style="flex: 0 0 auto;">
|
||||
<svg class="w-4 h-4 text-emerald-600 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{ $common['icon'] }}"/></svg>
|
||||
<span class="text-sm font-medium text-emerald-800">{{ $common['name'] }}</span>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
{{-- 업종별 확장 시나리오 --}}
|
||||
<div class="mb-4">
|
||||
<div class="text-sm font-medium text-gray-700 mb-2">업종별 확장 시나리오</div>
|
||||
<table class="w-full text-sm">
|
||||
<thead>
|
||||
<tr class="border-b-2 border-gray-200">
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium" style="width: 18%;">업종</th>
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium" style="width: 30%;">공통 (80%)</th>
|
||||
<th class="text-left py-2 px-3 text-gray-600 font-medium" style="width: 30%;">커스텀 (20%)</th>
|
||||
<th class="text-center py-2 px-3 text-gray-600 font-medium">난이도</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@php
|
||||
$industries = [
|
||||
['name' => '방화셔터', 'common' => '영업, 견적, 수주, 회계, 인사', 'custom' => '셔터 규격 계산, 설치 공정', 'diff' => '실증완료', 'color' => 'green'],
|
||||
['name' => '블라인드', 'common' => '영업, 견적, 수주, 회계, 인사', 'custom' => '원단/슬랫 규격, 재단 공정', 'diff' => '즉시가능', 'color' => 'green'],
|
||||
['name' => '금속가공', 'common' => '영업, 견적, 수주, 회계, 인사', 'custom' => '소재/두께 단가표, CNC 공정', 'diff' => '단기적용', 'color' => 'blue'],
|
||||
['name' => '식품제조', 'common' => '영업, 견적, 수주, 회계, 인사', 'custom' => '레시피 관리, HACCP, 유통기한', 'diff' => '중기적용', 'color' => 'amber'],
|
||||
['name' => '전자부품', 'common' => '영업, 견적, 수주, 회계, 인사', 'custom' => 'PCB BOM, SMT 공정, 검사', 'diff' => '중기적용', 'color' => 'amber'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($industries as $ind)
|
||||
<tr class="border-b border-gray-100 hover:bg-gray-50">
|
||||
<td class="py-2.5 px-3 font-medium text-gray-800">{{ $ind['name'] }}</td>
|
||||
<td class="py-2.5 px-3 text-gray-600">{{ $ind['common'] }}</td>
|
||||
<td class="py-2.5 px-3 text-gray-600">{{ $ind['custom'] }}</td>
|
||||
<td class="py-2.5 px-3 text-center">
|
||||
<span class="up-badge up-badge-{{ $ind['color'] }}">{{ $ind['diff'] }}</span>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="up-quote">
|
||||
<span class="text-sm text-indigo-800">"상품만 바꾸면 새로운 제조업이 된다. 영업, 회계, 인사, 재고 — 이 80%는 이미 완성되어 있다."</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 5: 멀티테넌시 구조 ─── --}}
|
||||
<div class="up-card">
|
||||
<div class="up-card-header">
|
||||
<h2 class="text-base font-semibold text-gray-800">멀티테넌시 — 하나의 플랫폼, 다수의 기업</h2>
|
||||
<p class="text-xs text-gray-400 mt-0.5">tenant_id 기반 데이터 격리로 안전하게 다수 기업을 서비스</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
{{-- 다이어그램 --}}
|
||||
<div class="p-4 bg-gray-50 border border-gray-200 rounded-lg mb-5" style="overflow-x: auto;">
|
||||
<pre class="text-xs text-gray-700 leading-relaxed" style="font-family: 'Courier New', monospace; white-space: pre;">
|
||||
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
|
||||
│ A 기업 │ │ B 기업 │ │ C 기업 │ │ D 기업 │
|
||||
│ (경동기업) │ │ (주일기업) │ │ (금속가공) │ │ (식품제조) │
|
||||
└────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘
|
||||
│ │ │ │
|
||||
└─────────────┴──────┬──────┴─────────────┘
|
||||
│
|
||||
┌─────────▼─────────┐
|
||||
│ SAM 플랫폼 │
|
||||
│ │
|
||||
│ 공유: 코드 100% │
|
||||
│ 격리: 데이터 100% │
|
||||
│ (tenant_id 기반) │
|
||||
└───────────────────┘</pre>
|
||||
</div>
|
||||
|
||||
{{-- 3카드 --}}
|
||||
<div class="flex gap-4" style="flex-wrap: wrap;">
|
||||
<div class="p-4 bg-emerald-50 border border-emerald-200 rounded-lg" style="flex: 1 1 200px;">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<div class="up-icon-circle" style="width: 28px; height: 28px; background: #059669;">
|
||||
<svg class="w-3.5 h-3.5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
|
||||
</div>
|
||||
<span class="font-semibold text-emerald-800 text-sm">비용 절감</span>
|
||||
</div>
|
||||
<p class="text-xs text-gray-600 leading-relaxed">하나의 코드베이스로 N개 기업 서비스. 기업이 늘어도 개발비는 동일.</p>
|
||||
</div>
|
||||
<div class="p-4 bg-blue-50 border border-blue-200 rounded-lg" style="flex: 1 1 200px;">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<div class="up-icon-circle" style="width: 28px; height: 28px; background: #2563eb;">
|
||||
<svg class="w-3.5 h-3.5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/></svg>
|
||||
</div>
|
||||
<span class="font-semibold text-blue-800 text-sm">즉시 입주</span>
|
||||
</div>
|
||||
<p class="text-xs text-gray-600 leading-relaxed">새 기업 추가 = tenant_id 발급 + 기본 설정. 별도 개발 없이 수일 내 사용 가능.</p>
|
||||
</div>
|
||||
<div class="p-4 bg-purple-50 border border-purple-200 rounded-lg" style="flex: 1 1 200px;">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<div class="up-icon-circle" style="width: 28px; height: 28px; background: #7c3aed;">
|
||||
<svg class="w-3.5 h-3.5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg>
|
||||
</div>
|
||||
<span class="font-semibold text-purple-800 text-sm">데이터 격리</span>
|
||||
</div>
|
||||
<p class="text-xs text-gray-600 leading-relaxed">모든 쿼리에 tenant_id 자동 적용. A기업이 B기업 데이터에 절대 접근 불가.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 6: AI 자동화 현황 & 로드맵 ─── --}}
|
||||
<div class="up-card">
|
||||
<div class="up-card-header">
|
||||
<h2 class="text-base font-semibold text-gray-800">AI 자동화 현황 & 로드맵</h2>
|
||||
<p class="text-xs text-gray-400 mt-0.5">구현 완료된 AI 기능과 향후 계획</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<div class="flex gap-5" style="flex-wrap: wrap;">
|
||||
{{-- 구현 완료 --}}
|
||||
<div style="flex: 1 1 280px;">
|
||||
<div class="flex items-center gap-2 mb-3">
|
||||
<span class="up-badge up-badge-green">구현 완료</span>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
<div class="p-3 bg-emerald-50 border border-emerald-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">AI 재무 분석</div>
|
||||
<p class="text-xs text-gray-500 mt-1">CEO 대시보드에서 매출/비용/손익 AI 분석. Claude API 활용하여 자연어 인사이트 제공.</p>
|
||||
</div>
|
||||
<div class="p-3 bg-emerald-50 border border-emerald-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">STT 음성 입력</div>
|
||||
<p class="text-xs text-gray-500 mt-1">상담 메모, 현장 보고를 음성으로 입력. 자동 텍스트 변환 후 시스템 기록.</p>
|
||||
</div>
|
||||
<div class="p-3 bg-emerald-50 border border-emerald-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">Claude Code 개발 자동화</div>
|
||||
<p class="text-xs text-gray-500 mt-1">SAM 시스템 자체를 Claude Code로 개발. 코드 생성, 리뷰, 테스트, 배포 자동화.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- 향후 계획 --}}
|
||||
<div style="flex: 1 1 280px;">
|
||||
<div class="flex items-center gap-2 mb-3">
|
||||
<span class="up-badge up-badge-blue">향후 계획</span>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
<div class="p-3 bg-blue-50 border border-blue-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">AI 견적 자동 생성</div>
|
||||
<p class="text-xs text-gray-500 mt-1">고객 요구사항 입력 시 과거 데이터 기반으로 최적 견적 자동 산출. 단가표 + 옵션 조합.</p>
|
||||
</div>
|
||||
<div class="p-3 bg-blue-50 border border-blue-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">AI 공정 최적화</div>
|
||||
<p class="text-xs text-gray-500 mt-1">생산 데이터 분석으로 최적 공정 순서, 자재 배치 제안. 불량률 예측 및 사전 경고.</p>
|
||||
</div>
|
||||
<div class="p-3 bg-blue-50 border border-blue-200 rounded-lg">
|
||||
<div class="font-semibold text-gray-800 text-sm">AI 고객 상담</div>
|
||||
<p class="text-xs text-gray-500 mt-1">FAQ 자동 응답, 견적 문의 자동 접수. 사람의 개입이 필요한 경우만 담당자 연결.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="up-quote mt-5">
|
||||
<span class="text-sm text-indigo-800">"공정의 다양성은 천차만별. 이를 AI와 데이터로 정복하는 것이 SAM의 연구 과제다."</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- ─── Section 7: 결론 — 로드맵 & 비전 ─── --}}
|
||||
<div class="up-card" style="border-color: #c7d2fe;">
|
||||
<div class="up-card-header" style="background: #f5f3ff; border-bottom-color: #e0e7ff;">
|
||||
<h2 class="text-base font-semibold text-indigo-900">로드맵 & 비전</h2>
|
||||
<p class="text-xs text-indigo-400 mt-0.5">방화셔터에서 시작하여 모든 중소 제조업으로</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
{{-- 4단계 타임라인 --}}
|
||||
<div class="up-timeline">
|
||||
@php
|
||||
$phases = [
|
||||
['phase' => 'Phase 1', 'title' => '코어 실증', 'period' => '2025~2026 상반기', 'desc' => '경동/주일 방화셔터 제조업에서 전 프로세스 실증. 영업→상담→견적→수주→공정→출고 파이프라인 완성.', 'color' => '#059669', 'status' => '진행중'],
|
||||
['phase' => 'Phase 2', 'title' => '3~5사 확장', 'period' => '2026 하반기', 'desc' => '블라인드, 금속가공 등 유사 제조업 3~5사에 멀티테넌시로 확장. 상품 마스터만 교체하여 빠르게 적용.', 'color' => '#2563eb', 'status' => '계획'],
|
||||
['phase' => 'Phase 3', 'title' => 'AI 고도화', 'period' => '2027', 'desc' => 'AI 견적 자동 산출, AI 공정 최적화, AI 고객 상담 순차 적용. 데이터 축적으로 AI 정확도 지속 향상.', 'color' => '#7c3aed', 'status' => '계획'],
|
||||
['phase' => 'Phase 4', 'title' => '다산업군 플랫폼', 'period' => '2028~', 'desc' => '식품, 전자부품 등 다양한 제조업종으로 확대. SAM을 중소 제조업 표준 SaaS 플랫폼으로 성장.', 'color' => '#dc2626', 'status' => '비전'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($phases as $p)
|
||||
<div class="up-timeline-item">
|
||||
<div class="up-timeline-dot" style="background: {{ $p['color'] }};"></div>
|
||||
<div class="flex items-center gap-2 mb-1">
|
||||
<span class="font-bold text-sm" style="color: {{ $p['color'] }};">{{ $p['phase'] }}</span>
|
||||
<span class="font-semibold text-gray-800 text-sm">{{ $p['title'] }}</span>
|
||||
<span class="text-xs text-gray-400">{{ $p['period'] }}</span>
|
||||
@if($p['status'] === '진행중')
|
||||
<span class="up-badge up-badge-green">{{ $p['status'] }}</span>
|
||||
@else
|
||||
<span class="up-badge up-badge-gray">{{ $p['status'] }}</span>
|
||||
@endif
|
||||
</div>
|
||||
<p class="text-xs text-gray-600 leading-relaxed">{{ $p['desc'] }}</p>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
{{-- 한 줄 요약 --}}
|
||||
<div class="mt-6 p-4 bg-indigo-50 border border-indigo-200 rounded-lg text-center">
|
||||
<div class="text-lg font-bold text-indigo-900">
|
||||
"방화셔터에서 시작하여, 모든 중소 제조업의 디지털 전환을 이끄는 SAM"
|
||||
</div>
|
||||
<p class="text-sm text-indigo-600 mt-2">AI 자동화 + 멀티테넌시 + 80% 공통화 = 중소 제조업 혁신 플랫폼</p>
|
||||
<p class="text-xs text-indigo-400 mt-1">(주)코드브릿지엑스</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@endsection
|
||||
@@ -35,6 +35,7 @@
|
||||
use App\Http\Controllers\ClaudeCode\NewsController as ClaudeCodeNewsController;
|
||||
use App\Http\Controllers\ClaudeCode\CoworkController as ClaudeCodeCoworkController;
|
||||
use App\Http\Controllers\ClaudeCode\PricingController as ClaudeCodePricingController;
|
||||
use App\Http\Controllers\ClaudeCode\UsagePlanController as ClaudeCodeUsagePlanController;
|
||||
use App\Http\Controllers\Lab\StrategyController;
|
||||
use App\Http\Controllers\MenuController;
|
||||
use App\Http\Controllers\MenuSyncController;
|
||||
@@ -730,6 +731,8 @@
|
||||
Route::get('/pricing/download', [ClaudeCodePricingController::class, 'download'])->name('pricing.download');
|
||||
|
||||
Route::get('/cowork', [ClaudeCodeCoworkController::class, 'index'])->name('cowork.index');
|
||||
|
||||
Route::get('/usage-plan', [ClaudeCodeUsagePlanController::class, 'index'])->name('usage-plan.index');
|
||||
});
|
||||
|
||||
/*
|
||||
|
||||
Reference in New Issue
Block a user