Initial project import for team collaboration.

Exclude local docs, MCP, and secrets via gitignore.

Made-with: Cursor
This commit is contained in:
taekyoungc
2026-03-25 12:05:33 +09:00
commit 4e557d4be1
153 changed files with 16198 additions and 0 deletions

View File

@@ -0,0 +1,347 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>스마트 폐기물 관리 시스템 - 재고 관리</title>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<style data-purpose="custom-styles">
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
body {
font-family: 'Noto Sans KR', sans-serif;
background-color: #f1f5f9; /* Tailwind slate-100 */
}
/* Table Styles */
.custom-table th, .custom-table td {
border: 1px solid #cbd5e1; /* Tailwind slate-300 */
}
.custom-table th {
background-color: #eaeaea;
font-weight: 500;
color: #334155;
padding: 0.5rem;
text-align: center;
vertical-align: middle;
}
.custom-table td {
padding: 0.5rem;
color: #334155; /* Tailwind slate-700 */
background-color: #ffffff;
}
.custom-table tbody tr:hover td {
background-color: #f8fafc; /* Tailwind slate-50 */
}
/* Scrollbar for table container */
.table-container {
max-height: calc(100vh - 200px);
overflow-y: auto;
}
/* Sidebar active state */
.sidebar-link.active {
background-color: #e0f0ff;
color: #1e548a;
}
</style>
</head>
<body class="h-screen flex flex-col overflow-hidden text-sm">
<!-- BEGIN: Top Header -->
<header class="bg-white border-b border-slate-200 h-14 flex items-center justify-between px-4 shrink-0">
<div class="flex items-center gap-2">
<div class="w-8 h-8 bg-green-500 rounded-md flex items-center justify-center text-white">
<i class="fa-solid fa-leaf"></i>
</div>
<h1 class="text-xl font-bold text-slate-800">스마트 폐기물 관리 시스템</h1>
</div>
<div>
<button class="p-2 text-slate-500 hover:text-slate-700">
<i class="fa-solid fa-arrow-right-from-bracket text-lg"></i>
</button>
</div>
</header>
<!-- END: Top Header -->
<div class="flex flex-1 overflow-hidden relative">
<!-- BEGIN: Left Sidebar -->
<aside class="w-20 bg-white border-r border-slate-200 flex flex-col items-center py-4 gap-2 shrink-0 overflow-y-auto">
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-border-all text-xl mb-1"></i>
<span class="text-[10px]">기본정보관리</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-boxes-stacked text-xl mb-1"></i>
<span class="text-[10px]">발주/입고 관리</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-truck-ramp-box text-xl mb-1"></i>
<span class="text-[10px]">불출 관리</span>
</a>
<a class="sidebar-link active w-full flex flex-col items-center justify-center py-3 text-sky-700 transition-colors" href="#">
<i class="fa-solid fa-warehouse text-xl mb-1"></i>
<span class="text-[10px]">재고 관리</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-cart-shopping text-xl mb-1"></i>
<span class="text-[10px]">판매 관리</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-chart-pie text-xl mb-1"></i>
<span class="text-[10px]">판매 현황</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-chart-line text-xl mb-1"></i>
<span class="text-[10px]">통계/분석 관리</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-solid fa-gear text-xl mb-1"></i>
<span class="text-[10px]">설정</span>
</a>
<a class="sidebar-link w-full flex flex-col items-center justify-center py-3 text-slate-600 hover:bg-slate-50 transition-colors" href="#">
<i class="fa-regular fa-circle-question text-xl mb-1"></i>
<span class="text-[10px]">도움말</span>
</a>
<div class="mt-auto pt-4">
<button class="p-2 text-slate-400 hover:text-slate-600">
<i class="fa-solid fa-arrow-right-to-bracket text-lg"></i>
</button>
</div>
</aside>
<!-- END: Left Sidebar -->
<!-- BEGIN: Main Content Area -->
<main class="flex-1 p-4 bg-slate-100 flex flex-col overflow-hidden min-w-0">
<!-- BEGIN: Filter Bar -->
<section class="bg-white border border-slate-200 rounded shadow-sm p-3 mb-4 flex flex-wrap items-center justify-between gap-4 shrink-0">
<div class="flex flex-wrap items-center gap-4">
<div class="flex items-center gap-2">
<label class="font-medium text-slate-700 whitespace-nowrap">조회기간:</label>
<input class="border border-slate-300 rounded px-2 py-1.5 text-sm focus:ring-sky-500 focus:border-sky-500 w-52" readonly type="text" value="2024.01.01 ~ 2025.12.12"/>
</div>
<div class="flex items-center gap-2">
<label class="font-medium text-slate-700 whitespace-nowrap">봉투구분:</label>
<select class="border border-slate-300 rounded px-2 py-1.5 text-sm focus:ring-sky-500 focus:border-sky-500 w-24">
<option>전체</option>
</select>
</div>
<div class="flex items-center gap-2">
<label class="font-medium text-slate-700 whitespace-nowrap">봉투형식:</label>
<select class="border border-slate-300 rounded px-2 py-1.5 text-sm focus:ring-sky-500 focus:border-sky-500 w-28">
<option>전체 봉투</option>
</select>
</div>
<div class="flex items-center gap-2">
<label class="font-medium text-slate-700 whitespace-nowrap">대행소:</label>
<select class="border border-slate-300 rounded px-2 py-1.5 text-sm focus:ring-sky-500 focus:border-sky-500 w-24">
<option>북구</option>
</select>
</div>
</div>
<div class="flex items-center gap-2">
<button class="bg-[#1e548a] hover:bg-blue-900 text-white px-4 py-1.5 rounded text-sm font-medium flex items-center gap-1 transition-colors">
<i class="fa-solid fa-magnifying-glass"></i> 검색
</button>
<button class="bg-white border border-[#2e7d32] text-[#2e7d32] hover:bg-green-50 px-4 py-1.5 rounded text-sm font-medium flex items-center gap-1 transition-colors">
<i class="fa-regular fa-file-excel"></i> Excel 내보내기
</button>
<button class="bg-white border border-slate-300 text-black hover:bg-slate-50 px-4 py-1.5 rounded text-sm font-medium flex items-center gap-1 transition-colors">
<i class="fa-solid fa-print"></i> 인쇄
</button>
<button class="bg-[#e53935] hover:bg-red-600 text-white px-4 py-1.5 rounded text-sm font-medium flex items-center gap-1 transition-colors">
<i class="fa-solid fa-power-off"></i> 종료
</button>
</div>
</section>
<!-- END: Filter Bar -->
<!-- BEGIN: Data Table -->
<section class="bg-white border border-slate-200 rounded shadow-sm flex-1 flex flex-col overflow-hidden">
<div class="table-container flex-1 w-full overflow-auto">
<table class="custom-table w-full whitespace-nowrap table-auto border-collapse">
<thead class="sticky top-0 z-10 shadow-sm">
<tr>
<th class="w-48 sticky left-0 z-20" rowspan="2">품목</th>
<th class="w-24" rowspan="2">전일재고</th>
<th class="w-72" colspan="3">입고</th>
<th class="w-96" colspan="5">출고</th>
<th class="w-24" rowspan="2">잔량</th>
</tr>
<tr>
<th class="w-24">입고</th>
<th class="w-24">반품</th>
<th class="w-24">입고계</th>
<th class="w-24">판매</th>
<th class="w-24 text-xs leading-tight">임의불출/무상불출</th>
<th class="w-24">반품</th>
<th class="w-24">기타</th>
<th class="w-24">출고계</th>
</tr>
</thead>
<tbody>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 5L</td>
<td class="text-right">187,240</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right">0</td>
<td class="text-right font-medium">187,240</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 5L</td>
<td class="text-right">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right">0</td>
<td class="text-right font-medium">0</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 10L</td>
<td class="text-right">159,428</td>
<td class="text-right">252,000</td>
<td class="text-right"></td>
<td class="text-right font-medium">252,800</td>
<td class="text-right">8,580</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">8,580</td>
<td class="text-right font-medium">8,990</td>
<td class="text-right font-medium">402,848</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 20L</td>
<td class="text-right">212,082</td>
<td class="text-right">201,000</td>
<td class="text-right"></td>
<td class="text-right font-medium">201,600</td>
<td class="text-right">11,320</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">11,320</td>
<td class="text-right font-medium">11,320</td>
<td class="text-right font-medium">402,355</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 50L</td>
<td class="text-right">7,605</td>
<td class="text-right">13,000</td>
<td class="text-right"></td>
<td class="text-right font-medium">13,000</td>
<td class="text-right">540</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">540</td>
<td class="text-right font-medium">540</td>
<td class="text-right font-medium">20,065</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 75L</td>
<td class="text-right">31,459</td>
<td class="text-right">22,600</td>
<td class="text-right"></td>
<td class="text-right font-medium">22,600</td>
<td class="text-right">2,990</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">2,090</td>
<td class="text-right font-medium">3,640</td>
<td class="text-right font-medium">86,240</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 100L</td>
<td class="text-right">11</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right font-medium">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right font-medium">0</td>
<td class="text-right font-medium">11</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">일반용 70L</td>
<td class="text-right">77,400</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right font-medium">0</td>
<td class="text-right"></td>
<td class="text-right">1,000</td>
<td class="text-right"></td>
<td class="text-right">1,000</td>
<td class="text-right font-medium">1,000</td>
<td class="text-right font-medium">76,400</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">공동주택용 20L</td>
<td class="text-right">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right font-medium">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right font-medium">0</td>
<td class="text-right font-medium">0</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">공동주택용 50L</td>
<td class="text-right">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right font-medium">0</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">0</td>
<td class="text-right font-medium">0</td>
<td class="text-right font-medium">0</td>
</tr>
<tr>
<td class="sticky left-0 bg-white text-left font-medium z-10 shadow-[1px_0_0_#cbd5e1]">재사용 봉투</td>
<td class="text-right">58,540</td>
<td class="text-right">27,000</td>
<td class="text-right"></td>
<td class="text-right font-medium">27,000</td>
<td class="text-right">560</td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-right">560</td>
<td class="text-right font-medium">560</td>
<td class="text-right font-medium">84,990</td>
</tr>
</tbody>
</table>
</div>
</section>
<!-- END: Data Table -->
</main>
<!-- END: Main Content Area -->
</div>
<!-- BEGIN: Footer / Status Bar -->
<footer class="bg-[#e2e8f0] border-t border-slate-300 h-8 flex items-center justify-between px-4 shrink-0 text-xs text-slate-600">
<div>Ready.....</div>
<div class="flex gap-4">
<span>북구</span>
<span>Ver..</span>
<span>2025.12.12 () 3:00:32PM</span>
</div>
</footer>
<!-- END: Footer / Status Bar -->
</body>
</html>