39c333bb39
권한 차등 페이지(TBM, 작업보고)는 공통 하단 네비에 부적합. 신고(tkreport.technicalkorea.net) 링크로 대체. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
105 lines
5.2 KiB
HTML
105 lines
5.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<title>소모품 신청 - TK 공장관리</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
<link rel="stylesheet" href="/static/css/tkfb.css?v=2026040103">
|
|
<link rel="stylesheet" href="/css/purchase-mobile.css?v=2026040103">
|
|
<script src="https://cdn.jsdelivr.net/npm/heic2any@0.0.4/dist/heic2any.min.js"></script>
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
<!-- 헤더 -->
|
|
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
|
<div class="px-4 flex justify-between items-center h-12">
|
|
<div class="flex items-center gap-3">
|
|
<button id="mobileMenuBtn" class="text-orange-200 hover:text-white"><i class="fas fa-bars text-lg"></i></button>
|
|
<h1 class="text-base font-semibold">소모품 신청</h1>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<span id="headerUserName" class="text-sm text-orange-200"></span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- 사이드 네비 (TBM 패턴) -->
|
|
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
|
<nav id="sideNav" class="hidden lg:flex flex-col gap-1 w-52 flex-shrink-0 pt-2 fixed lg:static z-40 bg-white lg:bg-transparent p-4 lg:p-0 rounded-lg lg:rounded-none shadow-lg lg:shadow-none top-12 left-0 bottom-0 overflow-y-auto"></nav>
|
|
|
|
<div class="pm-content">
|
|
<!-- 상태 탭 -->
|
|
<div class="pm-tabs" id="statusTabs">
|
|
<button class="pm-tab active" data-status="" onclick="filterByStatus(this)">전체</button>
|
|
<button class="pm-tab" data-status="pending" onclick="filterByStatus(this)">대기</button>
|
|
<button class="pm-tab" data-status="grouped" onclick="filterByStatus(this)">구매진행중</button>
|
|
<button class="pm-tab" data-status="purchased" onclick="filterByStatus(this)">구매완료</button>
|
|
<button class="pm-tab" data-status="received" onclick="filterByStatus(this)">입고완료</button>
|
|
</div>
|
|
|
|
<!-- 카드 리스트 -->
|
|
<div class="pm-cards" id="requestCards"></div>
|
|
<div class="pm-loading hidden" id="loadingMore">더 불러오는 중...</div>
|
|
</div>
|
|
|
|
<!-- FAB -->
|
|
<button class="pm-fab" onclick="openRequestSheet()"><i class="fas fa-plus"></i></button>
|
|
|
|
<!-- 신청 바텀시트 -->
|
|
<div class="pm-overlay" id="requestOverlay" onclick="closeRequestSheet()"></div>
|
|
<div class="pm-sheet" id="requestSheet">
|
|
<div class="pm-sheet-handle"></div>
|
|
<div class="pm-sheet-header">
|
|
<span class="pm-sheet-title">소모품 신청</span>
|
|
<button class="pm-sheet-close" onclick="closeRequestSheet()"><i class="fas fa-times"></i></button>
|
|
</div>
|
|
<div class="pm-sheet-body">
|
|
<!-- 검색 -->
|
|
<div class="pm-search-wrap">
|
|
<input type="text" id="searchInput" class="pm-search-input" placeholder="품목 검색 (이름, 초성, 별칭)">
|
|
<div class="pm-search-spinner" id="searchSpinner"><i class="fas fa-spinner text-orange-500"></i></div>
|
|
</div>
|
|
<div class="pm-search-results" id="searchResults"></div>
|
|
|
|
<!-- 장바구니 -->
|
|
<div id="cartWrap" class="hidden mb-3">
|
|
<div class="pm-cart-header">
|
|
<span class="pm-cart-title"><i class="fas fa-shopping-cart mr-1"></i>신청 목록</span>
|
|
<span class="pm-cart-count" id="cartCount">0건</span>
|
|
</div>
|
|
<div id="cartList"></div>
|
|
</div>
|
|
|
|
<!-- 사진 (공통) -->
|
|
<div class="pm-field">
|
|
<label class="pm-label">참고 사진</label>
|
|
<label class="pm-photo-btn">
|
|
<i class="fas fa-camera"></i>
|
|
<span id="photoLabel">사진 촬영/선택</span>
|
|
<input type="file" id="reqPhotoInput" accept="image/*,.heic,.heif" capture="environment" class="hidden" onchange="onMobilePhotoSelected(this)">
|
|
</label>
|
|
<img id="reqPhotoPreview" class="pm-photo-preview hidden">
|
|
</div>
|
|
|
|
<button id="submitBtn" class="pm-submit" onclick="submitRequest()" disabled>신청하기</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 상세 바텀시트 -->
|
|
<div class="pm-overlay" id="detailOverlay" onclick="closeDetailSheet()"></div>
|
|
<div class="pm-sheet" id="detailSheet">
|
|
<div class="pm-sheet-handle"></div>
|
|
<div class="pm-sheet-header">
|
|
<span class="pm-sheet-title">신청 상세</span>
|
|
<button class="pm-sheet-close" onclick="closeDetailSheet()"><i class="fas fa-times"></i></button>
|
|
</div>
|
|
<div class="pm-sheet-body" id="detailContent"></div>
|
|
</div>
|
|
|
|
<script src="/static/js/tkfb-core.js?v=2026040103"></script>
|
|
<script src="/static/js/purchase-request-mobile.js?v=2026040103"></script>
|
|
<script src="/static/js/shared-bottom-nav.js?v=2026040102"></script>
|
|
</body>
|
|
</html>
|