Initial project import for team collaboration.
Exclude local docs, MCP, and secrets via gitignore. Made-with: Cursor
This commit is contained in:
347
app/Views/bag/inventory_inquiry.php
Normal file
347
app/Views/bag/inventory_inquiry.php
Normal 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>
|
||||
Reference in New Issue
Block a user