security: 보안 강제 시스템 구축 + 하드코딩 비밀번호 제거
보안 감사 결과 CRITICAL 2건, HIGH 5건 발견 → 수정 완료 + 자동화 구축. [보안 수정] - issue-view.js: 하드코딩 비밀번호 → crypto.getRandomValues() 랜덤 생성 - pushSubscriptionController.js: ntfy 비밀번호 → process.env.NTFY_SUB_PASSWORD - DEPLOY-GUIDE.md/PROGRESS.md/migration SQL: 평문 비밀번호 → placeholder - docker-compose.yml/.env.example: NTFY_SUB_PASSWORD 환경변수 추가 [보안 강제 시스템 - 신규] - scripts/security-scan.sh: 8개 규칙 (CRITICAL 2, HIGH 4, MEDIUM 2) 3모드(staged/all/diff), severity, .securityignore, MEDIUM 임계값 - .githooks/pre-commit: 로컬 빠른 피드백 - .githooks/pre-receive-server.sh: Gitea 서버 최종 차단 bypass 거버넌스([SECURITY-BYPASS: 사유] + 사용자 제한 + 로그) - SECURITY-CHECKLIST.md: 10개 카테고리 자동/수동 구분 - docs/SECURITY-GUIDE.md: 운영자 가이드 (워크플로우, bypass, FAQ) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Hyungi Ahn
1
system1-factory/web/public/pages/work/.gitkeep
Normal file
1
system1-factory/web/public/pages/work/.gitkeep
Normal file
@@ -0,0 +1 @@
|
||||
# Placeholder file to create work directory
|
||||
2875
system1-factory/web/public/pages/work/analysis.html
Normal file
2875
system1-factory/web/public/pages/work/analysis.html
Normal file
File diff suppressed because it is too large
Load Diff
171
system1-factory/web/public/pages/work/daily-status.html
Normal file
171
system1-factory/web/public/pages/work/daily-status.html
Normal file
@@ -0,0 +1,171 @@
|
||||
<!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/daily-status.css?v=2026033001">
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white"><i class="fas fa-bars text-xl"></i></button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃"><i class="fas fa-sign-out-alt"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
<div class="flex-1 min-w-0">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="ds-header">
|
||||
<h1><i class="fas fa-chart-bar mr-2"></i>일별 입력 현황</h1>
|
||||
</div>
|
||||
|
||||
<!-- Date Navigation -->
|
||||
<div class="ds-date-nav">
|
||||
<button type="button" class="ds-date-btn" id="prevDate" onclick="changeDate(-1)">
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</button>
|
||||
<div class="ds-date-display" id="dateDisplay" onclick="openDatePicker()">
|
||||
<span id="dateText">2026-03-30</span>
|
||||
<span id="dayText" class="ds-day-label">월요일</span>
|
||||
</div>
|
||||
<button type="button" class="ds-date-btn" id="nextDate" onclick="changeDate(1)">
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</button>
|
||||
<input type="date" id="datePicker" class="hidden" onchange="onDatePicked(this.value)">
|
||||
</div>
|
||||
|
||||
<!-- Summary Cards -->
|
||||
<div class="ds-summary">
|
||||
<div class="ds-card ds-card-total" onclick="setFilter('all')">
|
||||
<div class="ds-card-num" id="totalCount">-</div>
|
||||
<div class="ds-card-label">전체 작업자</div>
|
||||
</div>
|
||||
<div class="ds-card ds-card-done" onclick="setFilter('complete')">
|
||||
<div class="ds-card-num" id="doneCount">-</div>
|
||||
<div class="ds-card-label">완료</div>
|
||||
<div class="ds-card-pct" id="donePct">-</div>
|
||||
</div>
|
||||
<div class="ds-card ds-card-missing" onclick="setFilter('both_missing')">
|
||||
<div class="ds-card-num" id="missingCount">-</div>
|
||||
<div class="ds-card-label">미입력</div>
|
||||
<div class="ds-card-pct" id="missingPct">-</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Filter Tabs -->
|
||||
<div class="ds-tabs">
|
||||
<button type="button" class="ds-tab active" data-filter="all" onclick="setFilter('all')">전체 <span class="ds-tab-badge" id="filterAll">0</span></button>
|
||||
<button type="button" class="ds-tab" data-filter="complete" onclick="setFilter('complete')">완료 <span class="ds-tab-badge" id="filterComplete">0</span></button>
|
||||
<button type="button" class="ds-tab" data-filter="both_missing" onclick="setFilter('both_missing')">미입력 <span class="ds-tab-badge" id="filterMissing">0</span></button>
|
||||
<button type="button" class="ds-tab" data-filter="partial" onclick="setFilter('partial')">부분 <span class="ds-tab-badge" id="filterPartial">0</span></button>
|
||||
</div>
|
||||
|
||||
<!-- Worker List -->
|
||||
<div class="ds-list" id="workerList">
|
||||
<div class="ds-skeleton"></div>
|
||||
<div class="ds-skeleton"></div>
|
||||
<div class="ds-skeleton"></div>
|
||||
</div>
|
||||
|
||||
<!-- Empty State -->
|
||||
<div class="ds-empty hidden" id="emptyState">
|
||||
<i class="fas fa-clipboard-check text-3xl text-gray-300"></i>
|
||||
<p>해당 조건의 작업자가 없습니다</p>
|
||||
</div>
|
||||
|
||||
<!-- No Permission -->
|
||||
<div class="ds-no-perm hidden" id="noPermission">
|
||||
<i class="fas fa-lock text-3xl text-gray-300"></i>
|
||||
<p>접근 권한이 없습니다</p>
|
||||
<a href="/pages/dashboard.html" class="ds-link">대시보드로 이동</a>
|
||||
</div>
|
||||
|
||||
<!-- Bottom Action -->
|
||||
<div class="ds-bottom-action" id="bottomAction">
|
||||
<button type="button" class="ds-proxy-btn" id="proxyBtn" onclick="goProxyInput()" disabled>
|
||||
<i class="fas fa-user-edit mr-2"></i>미입력자 대리입력 (<span id="proxyCount">0</span>명)
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Bottom Nav -->
|
||||
<nav class="m-bottom-nav">
|
||||
<a href="/pages/dashboard.html" class="m-nav-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
|
||||
<polyline points="9 22 9 12 15 12 15 22"/>
|
||||
</svg>
|
||||
<span class="m-nav-label">홈</span>
|
||||
</a>
|
||||
<a href="/pages/work/tbm-mobile.html" class="m-nav-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M9 11l3 3L22 4"/>
|
||||
<path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/>
|
||||
</svg>
|
||||
<span class="m-nav-label">TBM</span>
|
||||
</a>
|
||||
<a href="/pages/work/daily-status.html" class="m-nav-item active">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2"/>
|
||||
<path d="M3 9h18"/>
|
||||
<path d="M9 21V9"/>
|
||||
</svg>
|
||||
<span class="m-nav-label">현황</span>
|
||||
</a>
|
||||
<a href="/pages/work/report-create.html" class="m-nav-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
|
||||
<polyline points="14 2 14 8 20 8"/>
|
||||
</svg>
|
||||
<span class="m-nav-label">작업보고</span>
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
<!-- Worker Detail Bottom Sheet -->
|
||||
<div class="ds-sheet-overlay hidden" id="sheetOverlay" onclick="closeSheet()"></div>
|
||||
<div class="ds-sheet hidden" id="detailSheet">
|
||||
<div class="ds-sheet-handle" onclick="closeSheet()"></div>
|
||||
<div class="ds-sheet-header">
|
||||
<span id="sheetWorkerName">-</span>
|
||||
<span id="sheetWorkerInfo" class="ds-sheet-sub">-</span>
|
||||
</div>
|
||||
<div class="ds-sheet-body" id="sheetBody">
|
||||
<div class="ds-sheet-loading"><i class="fas fa-spinner fa-spin"></i> 로딩 중...</div>
|
||||
</div>
|
||||
<div class="ds-sheet-actions">
|
||||
<button type="button" class="ds-sheet-btn" id="sheetProxyBtn" onclick="goProxyInputSingle()">
|
||||
<i class="fas fa-user-edit mr-1"></i>이 작업자 대리입력
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Toast -->
|
||||
<div id="toastContainer" class="toast-container"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026031701"></script>
|
||||
<script src="/js/daily-status.js?v=2026033001"></script>
|
||||
</body>
|
||||
</html>
|
||||
200
system1-factory/web/public/pages/work/meeting-detail.html
Normal file
200
system1-factory/web/public/pages/work/meeting-detail.html
Normal file
@@ -0,0 +1,200 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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">
|
||||
<style>
|
||||
.attendee-tag { display: inline-flex; align-items: center; gap: 4px; background: #eff6ff; color: #2563eb; padding: 2px 8px; border-radius: 9999px; font-size: 0.75rem; }
|
||||
.attendee-tag .remove-btn { cursor: pointer; color: #93c5fd; }
|
||||
.attendee-tag .remove-btn:hover { color: #dc2626; }
|
||||
.user-search-results { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 1px solid #e2e8f0; border-radius: 0.5rem; max-height: 200px; overflow-y: auto; z-index: 50; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
|
||||
.user-search-item { padding: 0.5rem 0.75rem; cursor: pointer; font-size: 0.875rem; }
|
||||
.user-search-item:hover { background: #f1f5f9; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<!-- 상단 -->
|
||||
<div class="flex items-center gap-3 mb-5">
|
||||
<a href="/pages/work/meetings.html" class="text-gray-400 hover:text-gray-600"><i class="fas fa-arrow-left"></i></a>
|
||||
<h2 id="pageTitle" class="text-xl font-bold text-gray-800">새 회의록</h2>
|
||||
<span id="statusBadge" class="badge badge-gray hidden">초안</span>
|
||||
</div>
|
||||
|
||||
<!-- 기본 정보 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-5 mb-4">
|
||||
<h3 class="font-semibold text-gray-800 mb-3">기본 정보</h3>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">날짜 *</label>
|
||||
<input type="date" id="meetingDate" class="input-field w-full rounded-lg px-3 py-2 text-sm" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">시간</label>
|
||||
<input type="time" id="meetingTime" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">장소</label>
|
||||
<input type="text" id="meetingLocation" class="input-field w-full rounded-lg px-3 py-2 text-sm" placeholder="회의 장소">
|
||||
</div>
|
||||
<div class="sm:col-span-2 lg:col-span-3">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">제목 *</label>
|
||||
<input type="text" id="meetingTitle" class="input-field w-full rounded-lg px-3 py-2 text-sm" placeholder="회의 제목" required>
|
||||
</div>
|
||||
<div class="sm:col-span-2 lg:col-span-3">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">요약</label>
|
||||
<textarea id="meetingSummary" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="3" placeholder="회의 요약"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 참석자 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-5 mb-4">
|
||||
<h3 class="font-semibold text-gray-800 mb-3">참석자</h3>
|
||||
<div class="relative mb-3">
|
||||
<input type="text" id="attendeeSearch" class="input-field w-full rounded-lg px-3 py-2 text-sm" placeholder="이름 또는 아이디로 검색" autocomplete="off">
|
||||
<div id="attendeeResults" class="user-search-results hidden"></div>
|
||||
</div>
|
||||
<div id="attendeeTags" class="flex flex-wrap gap-2"></div>
|
||||
</div>
|
||||
|
||||
<!-- 안건 목록 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-5 mb-4">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h3 class="font-semibold text-gray-800">안건</h3>
|
||||
<button id="btnAddItem" class="hidden text-sm text-orange-600 hover:text-orange-700 font-medium" onclick="openItemModal()">
|
||||
<i class="fas fa-plus mr-1"></i>안건 추가
|
||||
</button>
|
||||
</div>
|
||||
<div id="agendaList" class="space-y-3"></div>
|
||||
<div id="agendaEmpty" class="text-center py-6 text-gray-400 text-sm">
|
||||
<i class="fas fa-clipboard-list text-2xl mb-2"></i>
|
||||
<p>안건이 없습니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 하단 버튼 -->
|
||||
<div class="flex flex-wrap gap-2 justify-end mb-8" id="bottomActions">
|
||||
<button id="btnSave" class="hidden bg-orange-600 text-white px-5 py-2 rounded-lg text-sm hover:bg-orange-700" onclick="saveMeeting()">
|
||||
<i class="fas fa-save mr-1"></i>저장
|
||||
</button>
|
||||
<button id="btnPublish" class="hidden bg-green-600 text-white px-5 py-2 rounded-lg text-sm hover:bg-green-700" onclick="publishMeeting()">
|
||||
<i class="fas fa-paper-plane mr-1"></i>발행
|
||||
</button>
|
||||
<button id="btnUnpublish" class="hidden bg-gray-500 text-white px-5 py-2 rounded-lg text-sm hover:bg-gray-600" onclick="unpublishMeeting()">
|
||||
<i class="fas fa-undo mr-1"></i>발행 취소
|
||||
</button>
|
||||
<button id="btnDelete" class="hidden bg-red-500 text-white px-5 py-2 rounded-lg text-sm hover:bg-red-600" onclick="deleteMeeting()">
|
||||
<i class="fas fa-trash mr-1"></i>삭제
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 안건 모달 -->
|
||||
<div id="itemModal" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 id="itemModalTitle" class="text-lg font-bold">안건 추가</h3>
|
||||
<button onclick="closeItemModal()" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<input type="hidden" id="itemId">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">유형</label>
|
||||
<select id="itemType" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="schedule_update">공정현황</option>
|
||||
<option value="issue">이슈</option>
|
||||
<option value="decision">결정사항</option>
|
||||
<option value="action_item">조치사항</option>
|
||||
<option value="other">기타</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">관련 프로젝트</label>
|
||||
<select id="itemProject" class="input-field w-full rounded-lg px-3 py-2 text-sm" onchange="loadItemMilestones()">
|
||||
<option value="">선택안함</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">관련 마일스톤</label>
|
||||
<select id="itemMilestone" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="">선택안함</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">상태</label>
|
||||
<select id="itemStatus" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="open">미처리</option>
|
||||
<option value="in_progress">진행중</option>
|
||||
<option value="completed">완료</option>
|
||||
<option value="cancelled">취소</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">내용 *</label>
|
||||
<textarea id="itemContent" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="3" required></textarea>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">결정사항</label>
|
||||
<textarea id="itemDecision" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="2"></textarea>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">필요조치</label>
|
||||
<textarea id="itemAction" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="2"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">담당자</label>
|
||||
<select id="itemResponsible" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="">선택안함</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">기한</label>
|
||||
<input type="date" id="itemDueDate" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
<button type="button" onclick="closeItemModal()" class="px-4 py-2 text-sm border rounded-lg hover:bg-gray-50">취소</button>
|
||||
<button type="button" onclick="saveItem()" class="px-4 py-2 text-sm bg-orange-600 text-white rounded-lg hover:bg-orange-700">저장</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/meeting-detail.js?v=2026031701"></script>
|
||||
</body>
|
||||
</html>
|
||||
87
system1-factory/web/public/pages/work/meetings.html
Normal file
87
system1-factory/web/public/pages/work/meetings.html
Normal file
@@ -0,0 +1,87 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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">
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<div class="mb-5">
|
||||
<h2 class="text-xl font-bold text-gray-800">생산회의록</h2>
|
||||
<p class="text-sm text-gray-500 mt-0.5">생산회의 기록을 관리합니다</p>
|
||||
</div>
|
||||
|
||||
<!-- 필터 + 버튼 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-4 mb-4 flex flex-wrap items-center gap-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<select id="yearFilter" class="input-field rounded-lg px-3 py-1.5 text-sm w-24"></select>
|
||||
<select id="monthFilter" class="input-field rounded-lg px-3 py-1.5 text-sm w-20">
|
||||
<option value="">전체</option>
|
||||
<option value="1">1월</option><option value="2">2월</option><option value="3">3월</option>
|
||||
<option value="4">4월</option><option value="5">5월</option><option value="6">6월</option>
|
||||
<option value="7">7월</option><option value="8">8월</option><option value="9">9월</option>
|
||||
<option value="10">10월</option><option value="11">11월</option><option value="12">12월</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="text" id="searchInput" class="input-field rounded-lg px-3 py-1.5 text-sm w-48" placeholder="제목/내용 검색">
|
||||
<button id="btnNewMeeting" class="hidden ml-auto bg-orange-600 text-white px-4 py-1.5 rounded-lg text-sm hover:bg-orange-700">
|
||||
<i class="fas fa-plus mr-1"></i>새 회의록
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 미완료 조치사항 요약 -->
|
||||
<div id="actionSummary" class="hidden bg-amber-50 border border-amber-200 rounded-xl p-4 mb-4">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<i class="fas fa-exclamation-triangle text-amber-600"></i>
|
||||
<span class="font-semibold text-amber-800 text-sm">미완료 조치사항</span>
|
||||
<span id="actionCount" class="badge badge-amber">0</span>
|
||||
</div>
|
||||
<div id="actionList" class="space-y-1 text-sm max-h-40 overflow-y-auto"></div>
|
||||
</div>
|
||||
|
||||
<!-- 회의록 목록 -->
|
||||
<div id="meetingList" class="space-y-3"></div>
|
||||
<div id="emptyState" class="hidden text-center py-12 text-gray-400">
|
||||
<i class="fas fa-clipboard text-4xl mb-3"></i>
|
||||
<p>회의록이 없습니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/meetings.js?v=2026031701"></script>
|
||||
</body>
|
||||
</html>
|
||||
123
system1-factory/web/public/pages/work/proxy-input.html
Normal file
123
system1-factory/web/public/pages/work/proxy-input.html
Normal file
@@ -0,0 +1,123 @@
|
||||
<!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/proxy-input.css?v=2026033201">
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white"><i class="fas fa-bars text-xl"></i></button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃"><i class="fas fa-sign-out-alt"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
<div class="flex-1 min-w-0">
|
||||
|
||||
<!-- ═══ STEP 1: 작업자 선택 ═══ -->
|
||||
<div id="step1">
|
||||
<div class="pi-title-row">
|
||||
<h2 class="pi-title">대리입력</h2>
|
||||
<div class="pi-date-group">
|
||||
<input type="date" id="dateInput" class="pi-date-input" onchange="loadWorkers()">
|
||||
<button class="pi-refresh-btn" onclick="loadWorkers()"><i class="fas fa-sync-alt"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pi-status-bar" id="statusBar">
|
||||
<span>전체 <strong id="totalNum">0</strong></span>
|
||||
<span>완료 <strong id="doneNum" class="text-green-600">0</strong></span>
|
||||
<span>미입력 <strong id="missingNum" class="text-red-500">0</strong></span>
|
||||
<span>휴가 <strong id="vacNum" class="text-blue-500">0</strong></span>
|
||||
</div>
|
||||
|
||||
<div class="pi-select-all">
|
||||
<label><input type="checkbox" id="selectAll" onchange="toggleSelectAll(this.checked)"> 전체 선택</label>
|
||||
</div>
|
||||
|
||||
<div class="pi-worker-list" id="workerList">
|
||||
<div class="pi-skeleton"></div>
|
||||
<div class="pi-skeleton"></div>
|
||||
<div class="pi-skeleton"></div>
|
||||
</div>
|
||||
|
||||
<div class="pi-bottom-bar" id="editBar">
|
||||
<button class="pi-edit-btn" id="editBtn" onclick="openEditMode()" disabled>
|
||||
<i class="fas fa-pen mr-2"></i><span id="editBtnText">작업자를 선택하세요</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ═══ STEP 2: 일괄 편집 ═══ -->
|
||||
<div id="step2" class="hidden">
|
||||
<div class="pi-title-row">
|
||||
<button class="pi-back-btn" onclick="closeEditMode()"><i class="fas fa-arrow-left"></i></button>
|
||||
<h2 class="pi-title" id="editTitle">일괄 편집</h2>
|
||||
</div>
|
||||
|
||||
<div class="pi-bulk-form">
|
||||
<div class="pi-edit-row">
|
||||
<select id="bulkProject" class="pi-select" required></select>
|
||||
<select id="bulkWorkType" class="pi-select" required></select>
|
||||
</div>
|
||||
<div class="pi-edit-row">
|
||||
<label class="pi-field"><span>시간</span><input type="number" id="bulkHours" value="8" step="0.5" min="0" max="24" class="pi-input"></label>
|
||||
<label class="pi-field"><span>부적합 시간</span><input type="number" id="bulkDefect" value="0" step="0.5" min="0" max="24" class="pi-input" onchange="onDefectChange()"></label>
|
||||
</div>
|
||||
<div id="defectCategoryRow" class="hidden">
|
||||
<div class="pi-edit-row">
|
||||
<select id="bulkDefectCategory" class="pi-select" onchange="onDefectCategoryChange()">
|
||||
<option value="">부적합 대분류 *</option>
|
||||
</select>
|
||||
<select id="bulkDefectItem" class="pi-select">
|
||||
<option value="">소분류 *</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<input type="text" id="bulkNote" placeholder="비고 (선택)" class="pi-note-input">
|
||||
</div>
|
||||
|
||||
<div class="pi-target-section">
|
||||
<div class="pi-target-label">적용 대상</div>
|
||||
<div class="pi-target-list" id="targetWorkers"></div>
|
||||
</div>
|
||||
|
||||
<div class="pi-bottom-bar">
|
||||
<button class="pi-save-btn" id="saveBtn" onclick="saveAll()">
|
||||
<i class="fas fa-save mr-2"></i><span id="saveBtnText">전체 저장</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Toast -->
|
||||
<div id="toastContainer" class="toast-container"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026031701"></script>
|
||||
<script src="/js/proxy-input.js?v=2026033202"></script>
|
||||
<script>initAuth();</script>
|
||||
</body>
|
||||
</html>
|
||||
209
system1-factory/web/public/pages/work/report-create-mobile.html
Normal file
209
system1-factory/web/public/pages/work/report-create-mobile.html
Normal file
@@ -0,0 +1,209 @@
|
||||
<!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/daily-work-report-mobile.css?v=2026031401">
|
||||
<link rel="stylesheet" href="/css/tbm-mobile.css?v=2026033108">
|
||||
<style>
|
||||
/* 데스크탑이면 리다이렉트 */
|
||||
@media (min-width: 769px) {
|
||||
body::before {
|
||||
content: 'redirect';
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
// 데스크탑 접속 시 리다이렉트
|
||||
if (window.innerWidth > 768) {
|
||||
window.location.replace('/pages/work/report-create.html');
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white"><i class="fas fa-bars text-xl"></i></button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃"><i class="fas fa-sign-out-alt"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
<div class="flex-1 min-w-0">
|
||||
|
||||
<!-- Sticky 헤더 -->
|
||||
<div class="m-header">
|
||||
<h1 class="m-header-title">작업보고서</h1>
|
||||
<div class="m-header-action">
|
||||
<button class="m-btn-add" id="btnAddManual" onclick="MobileReport.addManualCard()" style="display:none;">+ 수동추가</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 탭바 -->
|
||||
<div class="m-tab-bar">
|
||||
<button class="m-tab-btn active" data-tab="tbm" onclick="MobileReport.switchTab('tbm')">
|
||||
TBM 작업 <span class="m-tab-count" id="tbmCount">0</span>
|
||||
</button>
|
||||
<button class="m-tab-btn" data-tab="manual" onclick="MobileReport.switchTab('manual')">
|
||||
수동 입력
|
||||
</button>
|
||||
<button class="m-tab-btn" data-tab="completed" onclick="MobileReport.switchTab('completed')">
|
||||
완료
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 메시지 -->
|
||||
<div class="m-message" id="mMessage"></div>
|
||||
|
||||
<!-- TBM 탭 -->
|
||||
<div class="m-tab-content active" id="tabTbm">
|
||||
<div id="tbmCardList">
|
||||
<div class="m-loading"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 수동 입력 탭 -->
|
||||
<div class="m-tab-content" id="tabManual">
|
||||
<div id="manualCardList">
|
||||
<div class="m-empty">
|
||||
<div class="m-empty-icon">📝</div>
|
||||
<div>수동으로 작업보고서를 추가하세요</div>
|
||||
<button class="m-btn-add" style="margin-top:0.75rem;" onclick="MobileReport.addManualCard()">+ 수동추가</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 완료 탭 -->
|
||||
<div class="m-tab-content" id="tabCompleted">
|
||||
<div class="m-completed-header">
|
||||
<input type="date" class="m-date-input" id="completedDate" onchange="MobileReport.loadCompletedReports()">
|
||||
</div>
|
||||
<div id="completedCardList">
|
||||
<div class="m-empty">
|
||||
<div class="m-empty-icon">📋</div>
|
||||
<div>날짜를 선택하세요</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 시간 선택 오버레이 -->
|
||||
<div class="m-time-overlay" id="mTimeOverlay" onclick="MobileReport.closeTimePicker()">
|
||||
<div class="m-time-popup" onclick="event.stopPropagation()">
|
||||
<div class="m-time-header">
|
||||
<h3 class="m-time-title" id="mTimeTitle">작업시간 선택</h3>
|
||||
<button class="m-time-close" onclick="MobileReport.closeTimePicker()">×</button>
|
||||
</div>
|
||||
<div class="m-quick-time-grid">
|
||||
<button class="m-time-btn" onclick="MobileReport.setTime(0.5)">30분</button>
|
||||
<button class="m-time-btn" onclick="MobileReport.setTime(1)">1시간</button>
|
||||
<button class="m-time-btn" onclick="MobileReport.setTime(2)">2시간</button>
|
||||
<button class="m-time-btn" onclick="MobileReport.setTime(4)">4시간</button>
|
||||
<button class="m-time-btn" onclick="MobileReport.setTime(8)">8시간</button>
|
||||
</div>
|
||||
<div class="m-time-adjust">
|
||||
<button class="m-time-adjust-btn" onclick="MobileReport.adjustTime(-0.5)">-</button>
|
||||
<span class="m-time-current" id="mTimeCurrent">0시간</span>
|
||||
<button class="m-time-adjust-btn" onclick="MobileReport.adjustTime(0.5)">+</button>
|
||||
</div>
|
||||
<button class="m-time-confirm" onclick="MobileReport.confirmTime()">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 부적합 바텀시트 -->
|
||||
<div class="m-overlay" id="defectOverlay" onclick="MobileReport.hideDefectSheet()"></div>
|
||||
<div class="m-bottom-sheet" id="defectSheet">
|
||||
<div class="m-sheet-handle"></div>
|
||||
<div class="m-sheet-header">
|
||||
<h3 class="m-sheet-title">부적합 입력</h3>
|
||||
<button class="m-sheet-close" onclick="MobileReport.hideDefectSheet()">×</button>
|
||||
</div>
|
||||
<div class="m-sheet-body" id="defectSheetBody">
|
||||
<!-- 동적 렌더링 -->
|
||||
</div>
|
||||
<div class="m-sheet-footer">
|
||||
<button class="m-submit-btn primary" onclick="MobileReport.saveDefects()">저장</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업장소 바텀시트 -->
|
||||
<div class="m-overlay" id="wpOverlay" onclick="MobileReport.hideWorkplaceSheet()"></div>
|
||||
<div class="m-bottom-sheet" id="wpSheet">
|
||||
<div class="m-sheet-handle"></div>
|
||||
<div class="m-sheet-header">
|
||||
<h3 class="m-sheet-title" id="wpSheetTitle">작업장소 선택</h3>
|
||||
<button class="m-sheet-close" onclick="MobileReport.hideWorkplaceSheet()">×</button>
|
||||
</div>
|
||||
<div class="m-sheet-body" id="wpSheetBody">
|
||||
<!-- 동적 렌더링 -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 수정 바텀시트 -->
|
||||
<div class="m-overlay" id="editOverlay" onclick="MobileReport.hideEditSheet()"></div>
|
||||
<div class="m-bottom-sheet" id="editSheet">
|
||||
<div class="m-sheet-handle"></div>
|
||||
<div class="m-sheet-header">
|
||||
<h3 class="m-sheet-title">보고서 수정</h3>
|
||||
<button class="m-sheet-close" onclick="MobileReport.hideEditSheet()">×</button>
|
||||
</div>
|
||||
<div class="m-sheet-body m-edit-form" id="editSheetBody">
|
||||
<!-- 동적 렌더링 -->
|
||||
</div>
|
||||
<div class="m-sheet-footer">
|
||||
<button class="m-submit-btn primary" onclick="MobileReport.saveEditedReport()">저장</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 결과 모달 -->
|
||||
<div class="m-result-overlay" id="mResultOverlay">
|
||||
<div class="m-result-box">
|
||||
<div class="m-result-icon" id="mResultIcon"></div>
|
||||
<div class="m-result-title" id="mResultTitle"></div>
|
||||
<div class="m-result-message" id="mResultMessage"></div>
|
||||
<div class="m-result-details" id="mResultDetails" style="display:none;"></div>
|
||||
<button class="m-result-close" onclick="MobileReport.closeResult()">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 토스트 -->
|
||||
<div class="m-toast" id="mToast"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 공통 모듈 -->
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026031401"></script>
|
||||
<script src="/js/common/utils.js?v=2026031401"></script>
|
||||
<script src="/js/common/base-state.js?v=2026031401"></script>
|
||||
|
||||
<!-- 작업보고서 모듈 (재사용) -->
|
||||
<script src="/js/daily-work-report/state.js?v=2026031401"></script>
|
||||
<script src="/js/daily-work-report/utils.js?v=2026031401"></script>
|
||||
<script src="/js/daily-work-report/api.js?v=2026031401"></script>
|
||||
|
||||
<!-- 모바일 전용 UI 로직 -->
|
||||
<script src="/js/daily-work-report-mobile.js?v=2026031401"></script>
|
||||
<script>initAuth();</script>
|
||||
<script src="/static/js/shared-bottom-nav.js?v=2026040103"></script>
|
||||
</body>
|
||||
</html>
|
||||
163
system1-factory/web/public/pages/work/report-create.html
Normal file
163
system1-factory/web/public/pages/work/report-create.html
Normal file
@@ -0,0 +1,163 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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/daily-work-report.css?v=2026031401">
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Mobile overlay -->
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<!-- Sidebar Nav -->
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<!-- 탭 메뉴 -->
|
||||
<div class="tab-menu" style="margin-bottom: 1.5rem;">
|
||||
<button class="tab-btn active" id="tbmReportTab" onclick="switchTab('tbm')">
|
||||
작업보고서 작성
|
||||
</button>
|
||||
<button class="tab-btn" id="completedReportTab" onclick="switchTab('completed')">
|
||||
작성 완료 보고서
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 메시지 영역 -->
|
||||
<div id="message-container"></div>
|
||||
|
||||
<!-- TBM 작업보고 섹션 -->
|
||||
<div id="tbmReportSection" class="step-section active">
|
||||
<div id="tbmWorkList"></div>
|
||||
</div>
|
||||
|
||||
<!-- 작성 완료 보고서 섹션 -->
|
||||
<div id="completedReportSection" class="step-section" style="display: none;">
|
||||
<div class="form-group" style="max-width: 300px; margin-bottom: 1.25rem;">
|
||||
<label for="completedReportDate" class="form-label">조회 날짜</label>
|
||||
<input type="date" id="completedReportDate" class="form-input" onchange="loadCompletedReports()">
|
||||
</div>
|
||||
<div id="completedReportsList"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 저장 결과 모달 -->
|
||||
<div id="saveResultModal" class="modal-overlay" style="display: none;">
|
||||
<div class="modal-container result-modal">
|
||||
<div class="modal-header">
|
||||
<h2 id="resultModalTitle">저장 결과</h2>
|
||||
<button class="modal-close-btn" onclick="closeSaveResultModal()">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="resultModalContent" class="result-content"></div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" onclick="closeSaveResultModal()">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업장소 선택 모달 (지도 기반) -->
|
||||
<div id="workplaceModal" class="modal-overlay" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1002; align-items: center; justify-content: center; overflow-y: auto; padding: 2rem 0;">
|
||||
<div class="modal-container" style="background: white; border-radius: 8px; max-width: 1000px; width: 90%; max-height: none; margin: auto; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); display: flex; flex-direction: column;">
|
||||
<div class="modal-header" style="padding: 1.5rem; border-bottom: 1px solid #e5e7eb; display: flex; justify-content: space-between; align-items: center;">
|
||||
<h2 style="font-size: 1.25rem; font-weight: 600; color: #111827; margin: 0;">작업장소 선택</h2>
|
||||
<button class="modal-close" onclick="closeWorkplaceModal()" style="background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #6b7280; padding: 0; width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center; border-radius: 4px;">×</button>
|
||||
</div>
|
||||
<div class="modal-body" style="padding: 1.5rem; flex: 1; overflow-y: visible;">
|
||||
<div id="categorySelectionArea">
|
||||
<h3 style="font-size: 1rem; font-weight: 600; margin-bottom: 0.75rem; color: #374151;">공장 선택</h3>
|
||||
<div id="workplaceCategoryList" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem;"></div>
|
||||
</div>
|
||||
<div id="workplaceSelectionArea" style="display: none; margin-top: 1.5rem;">
|
||||
<h3 style="font-size: 1rem; font-weight: 600; margin-bottom: 0.75rem; color: #374151;">
|
||||
<span id="selectedCategoryTitle">작업장 선택</span>
|
||||
</h3>
|
||||
<div id="layoutMapArea" style="display: none; margin-bottom: 1.5rem; padding: 1rem; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.5rem;">
|
||||
<div style="font-size: 0.875rem; color: #6b7280; margin-bottom: 0.75rem;">지도에서 작업장을 클릭하여 선택하세요</div>
|
||||
<div style="text-align: center; position: relative; display: inline-block; max-width: 100%;">
|
||||
<canvas id="workplaceMapCanvas" style="max-width: 100%; border-radius: 0.5rem; cursor: pointer; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-bottom: 1rem;">
|
||||
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem;">
|
||||
<span style="font-size: 0.875rem; color: #6b7280;">리스트에서 선택</span>
|
||||
</div>
|
||||
<div id="workplaceListArea" style="display: flex; flex-direction: column; gap: 0.5rem; max-height: 200px; overflow-y: auto; padding: 0.75rem; border: 1px solid #e5e7eb; border-radius: 0.5rem; background: white;"></div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 0.75rem; justify-content: flex-end; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e5e7eb;">
|
||||
<button type="button" class="btn btn-secondary" onclick="closeWorkplaceModal()">취소</button>
|
||||
<button type="button" class="btn btn-primary" id="confirmWorkplaceBtn" onclick="confirmWorkplaceSelection()" disabled>선택 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 시간 선택 팝오버 -->
|
||||
<div id="timePickerOverlay" class="time-picker-overlay" style="display: none;" onclick="closeTimePicker()">
|
||||
<div class="time-picker-popup" onclick="event.stopPropagation()">
|
||||
<div class="time-picker-header">
|
||||
<h3 id="timePickerTitle">작업시간 선택</h3>
|
||||
<button class="time-picker-close" onclick="closeTimePicker()">×</button>
|
||||
</div>
|
||||
<div class="quick-time-grid">
|
||||
<button type="button" class="time-btn" onclick="setTimeValue(0.5)"><span class="time-value">30분</span></button>
|
||||
<button type="button" class="time-btn" onclick="setTimeValue(1)"><span class="time-value">1시간</span></button>
|
||||
<button type="button" class="time-btn" onclick="setTimeValue(2)"><span class="time-value">2시간</span></button>
|
||||
<button type="button" class="time-btn" onclick="setTimeValue(4)"><span class="time-value">4시간</span></button>
|
||||
<button type="button" class="time-btn" onclick="setTimeValue(8)"><span class="time-value">8시간</span></button>
|
||||
</div>
|
||||
<div class="time-adjust-area">
|
||||
<span class="current-time-label">현재:</span>
|
||||
<strong id="currentTimeDisplay" class="current-time-value">0시간</strong>
|
||||
<div class="adjust-buttons">
|
||||
<button type="button" class="adjust-btn" onclick="adjustTime(-0.5)">-30분</button>
|
||||
<button type="button" class="adjust-btn" onclick="adjustTime(0.5)">+30분</button>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="confirm-btn" onclick="confirmTimeSelection()">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026031401"></script>
|
||||
<script src="/js/common/utils.js?v=2026031401"></script>
|
||||
<script src="/js/common/base-state.js?v=2026031401"></script>
|
||||
<script src="/js/daily-work-report/state.js?v=2026031401"></script>
|
||||
<script src="/js/daily-work-report/utils.js?v=2026031401"></script>
|
||||
<script src="/js/daily-work-report/api.js?v=2026031401"></script>
|
||||
<script defer src="/js/daily-work-report.js?v=2026031401"></script>
|
||||
<script>initAuth();</script>
|
||||
</body>
|
||||
</html>
|
||||
413
system1-factory/web/public/pages/work/schedule.html
Normal file
413
system1-factory/web/public/pages/work/schedule.html
Normal file
@@ -0,0 +1,413 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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">
|
||||
<style>
|
||||
/* Gantt container */
|
||||
.gantt-wrapper { position: relative; overflow: auto; border: 1px solid #e2e8f0; border-radius: 0.5rem; background: #fff; }
|
||||
.gantt-container { position: relative; min-width: 100%; }
|
||||
|
||||
/* Left column sticky */
|
||||
.gantt-label { position: sticky; left: 0; z-index: 20; background: #fff; border-right: 2px solid #e2e8f0; min-width: 250px; max-width: 250px; }
|
||||
.gantt-header .gantt-label { background: #f1f5f9; z-index: 25; }
|
||||
|
||||
/* Row styles */
|
||||
.gantt-row { display: flex; border-bottom: 1px solid #f1f5f9; min-height: 32px; align-items: stretch; }
|
||||
.gantt-row:hover { background: #fafbfc; }
|
||||
.gantt-row.project-row { background: #f8fafc; font-weight: 600; }
|
||||
.gantt-row.project-row .gantt-label { background: #f8fafc; }
|
||||
.gantt-row.phase-row .gantt-label { padding-left: 1.25rem; color: #6b7280; font-size: 0.8rem; }
|
||||
.gantt-row.task-row .gantt-label { padding-left: 2.25rem; font-size: 0.8rem; }
|
||||
.gantt-row.milestone-row .gantt-label { padding-left: 1.25rem; font-size: 0.8rem; color: #7c3aed; }
|
||||
.gantt-row.nc-row .gantt-label { padding-left: 1.25rem; font-size: 0.8rem; color: #dc2626; }
|
||||
|
||||
/* Header */
|
||||
.gantt-header { display: flex; border-bottom: 2px solid #e2e8f0; background: #f1f5f9; position: sticky; top: 0; z-index: 22; }
|
||||
.gantt-month-header { display: flex; border-bottom: 1px solid #e2e8f0; background: #f8fafc; position: sticky; top: 0; z-index: 22; }
|
||||
|
||||
/* Timeline cells */
|
||||
.gantt-timeline { display: flex; flex: 1; position: relative; }
|
||||
.gantt-day { flex: 0 0 var(--day-width); border-right: 1px solid #f1f5f9; display: flex; align-items: center; justify-content: center; font-size: 0.65rem; color: #9ca3af; }
|
||||
.gantt-day.weekend { background: #fafafa; }
|
||||
.gantt-day.month-label { font-weight: 600; color: #475569; font-size: 0.75rem; justify-content: flex-start; padding-left: 4px; border-right: 1px solid #cbd5e1; }
|
||||
|
||||
/* Bars */
|
||||
.gantt-bar { position: absolute; height: 20px; top: 6px; border-radius: 3px; cursor: pointer; transition: opacity 0.15s; min-width: 4px; z-index: 5; }
|
||||
.gantt-bar:hover { opacity: 0.85; filter: brightness(1.1); }
|
||||
.gantt-bar-progress { height: 100%; border-radius: 3px; opacity: 0.4; }
|
||||
.gantt-bar-label { position: absolute; left: 4px; top: 1px; font-size: 0.65rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 8px); line-height: 18px; }
|
||||
|
||||
/* Today marker */
|
||||
.today-marker { position: absolute; top: 0; bottom: 0; width: 2px; background: #ef4444; z-index: 10; pointer-events: none; }
|
||||
|
||||
/* Milestone diamond */
|
||||
.milestone-marker { position: absolute; top: 6px; width: 14px; height: 14px; background: #7c3aed; transform: rotate(45deg); z-index: 5; cursor: pointer; border: 1px solid #6d28d9; }
|
||||
.milestone-marker:hover { filter: brightness(1.2); }
|
||||
|
||||
/* NC badge */
|
||||
.nc-badge { display: inline-flex; align-items: center; justify-content: center; background: #fef2f2; color: #dc2626; border-radius: 9999px; padding: 0 0.5rem; font-size: 0.7rem; font-weight: 600; height: 20px; cursor: pointer; position: absolute; top: 6px; z-index: 5; }
|
||||
|
||||
/* Collapse toggle */
|
||||
.collapse-toggle { cursor: pointer; user-select: none; }
|
||||
.collapse-toggle .arrow { display: inline-block; transition: transform 0.2s; font-size: 0.6rem; margin-right: 4px; }
|
||||
.collapse-toggle.collapsed .arrow { transform: rotate(-90deg); }
|
||||
|
||||
/* Zoom controls */
|
||||
.zoom-btn.active { background: #ea580c; color: #fff; }
|
||||
|
||||
/* Label content */
|
||||
.label-content { display: flex; align-items: center; height: 100%; padding: 0 0.75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
|
||||
<div class="max-w-full mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<div class="mb-4">
|
||||
<h2 class="text-xl font-bold text-gray-800">공정표</h2>
|
||||
<p class="text-sm text-gray-500 mt-0.5">프로젝트별 공정 일정을 Gantt 차트로 관리합니다</p>
|
||||
</div>
|
||||
|
||||
<!-- 툴바 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-4 mb-4 flex flex-wrap items-center gap-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<label class="text-sm font-medium text-gray-600">연도:</label>
|
||||
<select id="yearSelect" class="input-field rounded-lg px-3 py-1.5 text-sm w-24"></select>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<button class="zoom-btn px-3 py-1.5 rounded-lg text-sm border" data-zoom="month">월간</button>
|
||||
<button class="zoom-btn px-3 py-1.5 rounded-lg text-sm border active" data-zoom="quarter">분기</button>
|
||||
<button class="zoom-btn px-3 py-1.5 rounded-lg text-sm border" data-zoom="year">연간</button>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 ml-auto">
|
||||
<button id="btnGenTemplate" class="hidden bg-indigo-600 text-white px-3 py-1.5 rounded-lg text-sm hover:bg-indigo-700" onclick="openTemplateModal()">
|
||||
<i class="fas fa-wand-magic-sparkles mr-1"></i>표준공정 생성
|
||||
</button>
|
||||
<button id="btnAddEntry" class="hidden bg-orange-600 text-white px-3 py-1.5 rounded-lg text-sm hover:bg-orange-700">
|
||||
<i class="fas fa-plus mr-1"></i>항목 추가
|
||||
</button>
|
||||
<button id="btnBatchAdd" class="hidden bg-blue-600 text-white px-3 py-1.5 rounded-lg text-sm hover:bg-blue-700">
|
||||
<i class="fas fa-layer-group mr-1"></i>일괄 생성
|
||||
</button>
|
||||
<button id="btnAddMilestone" class="hidden bg-purple-600 text-white px-3 py-1.5 rounded-lg text-sm hover:bg-purple-700">
|
||||
<i class="fas fa-diamond mr-1"></i>마일스톤
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Gantt Chart -->
|
||||
<div class="gantt-wrapper" id="ganttWrapper" style="max-height: calc(100vh - 220px);">
|
||||
<div class="gantt-container" id="ganttContainer">
|
||||
<!-- Rendered by JS -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 항목 추가/수정 모달 -->
|
||||
<div id="entryModal" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 id="entryModalTitle" class="text-lg font-bold">공정표 항목 추가</h3>
|
||||
<button onclick="closeEntryModal()" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<form id="entryForm" onsubmit="return false;">
|
||||
<input type="hidden" id="entryId">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">프로젝트 *</label>
|
||||
<select id="entryProject" class="input-field w-full rounded-lg px-3 py-2 text-sm" required></select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">공정 단계 *</label>
|
||||
<select id="entryPhase" class="input-field w-full rounded-lg px-3 py-2 text-sm" required></select>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">작업명 *</label>
|
||||
<div class="flex gap-2">
|
||||
<select id="entryTemplate" class="input-field flex-1 rounded-lg px-3 py-2 text-sm">
|
||||
<option value="">직접 입력</option>
|
||||
</select>
|
||||
<input type="text" id="entryTaskName" class="input-field flex-1 rounded-lg px-3 py-2 text-sm" placeholder="작업명 입력">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">시작일 *</label>
|
||||
<input type="date" id="entryStartDate" class="input-field w-full rounded-lg px-3 py-2 text-sm" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">종료일 *</label>
|
||||
<input type="date" id="entryEndDate" class="input-field w-full rounded-lg px-3 py-2 text-sm" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">담당자</label>
|
||||
<input type="text" id="entryAssignee" class="input-field w-full rounded-lg px-3 py-2 text-sm" placeholder="담당자">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">진행률 (%)</label>
|
||||
<input type="number" id="entryProgress" class="input-field w-full rounded-lg px-3 py-2 text-sm" min="0" max="100" value="0">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">상태</label>
|
||||
<select id="entryStatus" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="planned">계획</option>
|
||||
<option value="in_progress">진행중</option>
|
||||
<option value="completed">완료</option>
|
||||
<option value="delayed">지연</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">선행작업 (의존관계)</label>
|
||||
<select id="entryDependencies" class="input-field w-full rounded-lg px-3 py-2 text-sm" multiple style="min-height: 60px;"></select>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">메모</label>
|
||||
<textarea id="entryNotes" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="2"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
<button type="button" onclick="closeEntryModal()" class="px-4 py-2 text-sm border rounded-lg hover:bg-gray-50">취소</button>
|
||||
<button type="button" onclick="saveEntry()" class="px-4 py-2 text-sm bg-orange-600 text-white rounded-lg hover:bg-orange-700">저장</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 일괄 생성 모달 -->
|
||||
<div id="batchModal" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-bold">템플릿 기반 일괄 생성</h3>
|
||||
<button onclick="closeBatchModal()" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">프로젝트 *</label>
|
||||
<select id="batchProject" class="input-field w-full rounded-lg px-3 py-2 text-sm"></select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">공정 단계 *</label>
|
||||
<select id="batchPhase" class="input-field w-full rounded-lg px-3 py-2 text-sm" onchange="loadBatchTemplates()"></select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">기준 시작일 *</label>
|
||||
<input type="date" id="batchStartDate" class="input-field w-full rounded-lg px-3 py-2 text-sm" onchange="recalcBatchDates()">
|
||||
</div>
|
||||
</div>
|
||||
<div id="batchTemplateList" class="space-y-2 mb-4 max-h-60 overflow-y-auto">
|
||||
<!-- 템플릿 목록 동적 생성 -->
|
||||
</div>
|
||||
<div class="flex justify-end gap-2">
|
||||
<button type="button" onclick="closeBatchModal()" class="px-4 py-2 text-sm border rounded-lg hover:bg-gray-50">취소</button>
|
||||
<button type="button" onclick="saveBatchEntries()" class="px-4 py-2 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700">일괄 생성</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 마일스톤 모달 -->
|
||||
<div id="milestoneModal" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 id="milestoneModalTitle" class="text-lg font-bold">마일스톤 추가</h3>
|
||||
<button onclick="closeMilestoneModal()" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<form id="milestoneForm" onsubmit="return false;">
|
||||
<input type="hidden" id="milestoneId">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">프로젝트 *</label>
|
||||
<select id="milestoneProject" class="input-field w-full rounded-lg px-3 py-2 text-sm" required></select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">마일스톤명 *</label>
|
||||
<input type="text" id="milestoneName" class="input-field w-full rounded-lg px-3 py-2 text-sm" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">날짜 *</label>
|
||||
<input type="date" id="milestoneDate" class="input-field w-full rounded-lg px-3 py-2 text-sm" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">유형</label>
|
||||
<select id="milestoneType" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="deadline">납기</option>
|
||||
<option value="review">검토</option>
|
||||
<option value="inspection">검사</option>
|
||||
<option value="delivery">출하</option>
|
||||
<option value="meeting">회의</option>
|
||||
<option value="other">기타</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">상태</label>
|
||||
<select id="milestoneStatus" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="upcoming">예정</option>
|
||||
<option value="completed">완료</option>
|
||||
<option value="missed">미달성</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">연결 작업</label>
|
||||
<select id="milestoneEntry" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="">없음</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">메모</label>
|
||||
<textarea id="milestoneNotes" class="input-field w-full rounded-lg px-3 py-2 text-sm" rows="2"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
<button type="button" onclick="closeMilestoneModal()" class="px-4 py-2 text-sm border rounded-lg hover:bg-gray-50">취소</button>
|
||||
<button type="button" onclick="saveMilestone()" class="px-4 py-2 text-sm bg-purple-600 text-white rounded-lg hover:bg-purple-700">저장</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 부적합 팝업 -->
|
||||
<div id="ncPopup" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6" style="max-width: 600px;">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 id="ncPopupTitle" class="text-lg font-bold">부적합 현황</h3>
|
||||
<button onclick="document.getElementById('ncPopup').classList.add('hidden')" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<div id="ncPopupContent" class="space-y-2 max-h-80 overflow-y-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 바 상세 팝업 -->
|
||||
<div id="barDetailPopup" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6" style="max-width: 500px;">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 id="barDetailTitle" class="text-lg font-bold">작업 상세</h3>
|
||||
<button onclick="document.getElementById('barDetailPopup').classList.add('hidden')" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times text-xl"></i></button>
|
||||
</div>
|
||||
<div id="barDetailContent"></div>
|
||||
<div id="barDetailActions" class="flex justify-end gap-2 mt-4"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 표준공정 생성 모달 -->
|
||||
<div id="templateModal" class="modal-overlay hidden">
|
||||
<div class="modal-content p-6" style="max-width: 400px;">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-bold"><i class="fas fa-wand-magic-sparkles text-indigo-500 mr-2"></i>표준공정 생성</h3>
|
||||
<button onclick="closeTemplateModal()" class="text-gray-400 hover:text-gray-600"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">프로젝트</label>
|
||||
<select id="tmplProjectSelect" class="input-field w-full rounded-lg px-3 py-2 text-sm"></select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">제품유형</label>
|
||||
<select id="tmplProductType" class="input-field w-full rounded-lg px-3 py-2 text-sm">
|
||||
<option value="">선택</option>
|
||||
</select>
|
||||
</div>
|
||||
<p class="text-xs text-gray-500"><i class="fas fa-info-circle mr-1"></i>선택한 제품유형의 표준공정이 자동으로 생성됩니다</p>
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 mt-5">
|
||||
<button onclick="closeTemplateModal()" class="px-4 py-2 border rounded-lg text-sm text-gray-600 hover:bg-gray-50">취소</button>
|
||||
<button onclick="generateTemplate()" class="px-4 py-2 bg-indigo-600 text-white rounded-lg text-sm hover:bg-indigo-700">
|
||||
<i class="fas fa-wand-magic-sparkles mr-1"></i>생성
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/schedule.js?v=2026031701"></script>
|
||||
<script>
|
||||
// 표준공정 생성 모달
|
||||
async function openTemplateModal() {
|
||||
const modal = document.getElementById('templateModal');
|
||||
const projSel = document.getElementById('tmplProjectSelect');
|
||||
const typeSel = document.getElementById('tmplProductType');
|
||||
|
||||
// 프로젝트 목록 로드
|
||||
try {
|
||||
const r = await apiFetch('/api/schedule/product-types');
|
||||
typeSel.innerHTML = '<option value="">선택</option>';
|
||||
(r.data || []).forEach(pt => {
|
||||
typeSel.innerHTML += `<option value="${pt.code}">${pt.code} - ${escapeHtml(pt.name)}</option>`;
|
||||
});
|
||||
} catch(e) { console.warn('제품유형 로드 실패:', e); }
|
||||
|
||||
// 프로젝트 목록 (기존 gantt에서 사용 중인 projects 변수 활용)
|
||||
if (typeof allProjects !== 'undefined' && allProjects.length) {
|
||||
projSel.innerHTML = allProjects.map(p =>
|
||||
`<option value="${p.project_id}">${escapeHtml(p.job_no)} - ${escapeHtml(p.project_name)}</option>`
|
||||
).join('');
|
||||
} else {
|
||||
try {
|
||||
const r = await apiFetch('/api/projects/active');
|
||||
const projs = r.data || [];
|
||||
projSel.innerHTML = projs.map(p =>
|
||||
`<option value="${p.project_id}">${escapeHtml(p.job_no)} - ${escapeHtml(p.project_name)}</option>`
|
||||
).join('');
|
||||
} catch(e) { projSel.innerHTML = '<option>프로젝트 로드 실패</option>'; }
|
||||
}
|
||||
|
||||
modal.classList.remove('hidden');
|
||||
}
|
||||
|
||||
function closeTemplateModal() {
|
||||
document.getElementById('templateModal').classList.add('hidden');
|
||||
}
|
||||
|
||||
async function generateTemplate() {
|
||||
const projectId = document.getElementById('tmplProjectSelect').value;
|
||||
const productTypeCode = document.getElementById('tmplProductType').value;
|
||||
if (!projectId || !productTypeCode) {
|
||||
showToast('프로젝트와 제품유형을 선택해주세요', 'error');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const r = await apiFetch('/api/schedule/generate-from-template', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ project_id: parseInt(projectId), product_type_code: productTypeCode })
|
||||
});
|
||||
showToast(r.message || `${r.data.created}개 표준공정이 생성되었습니다`);
|
||||
closeTemplateModal();
|
||||
if (typeof loadGanttData === 'function') loadGanttData();
|
||||
} catch(e) {
|
||||
showToast(e.message || '표준공정 생성 실패', 'error');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
858
system1-factory/web/public/pages/work/tbm-create.html
Normal file
858
system1-factory/web/public/pages/work/tbm-create.html
Normal file
@@ -0,0 +1,858 @@
|
||||
<!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>TBM 등록 - 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">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
button, .worker-card, .list-item, .list-item-skip, .pill-btn, .pill-btn-add,
|
||||
.nav-btn, .select-all-btn, [onclick] {
|
||||
touch-action: manipulation;
|
||||
}
|
||||
@media (min-width: 480px) {
|
||||
.tbm-create-wrap { max-width: 480px; margin: 0 auto; min-height: 100vh; }
|
||||
}
|
||||
|
||||
/* Fixed header */
|
||||
.wizard-header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
height: 52px;
|
||||
background: linear-gradient(135deg, #2563eb, #1d4ed8);
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 1rem;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
@media (min-width: 480px) {
|
||||
.wizard-header { max-width: 480px; margin: 0 auto; }
|
||||
}
|
||||
.wizard-header .back-btn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: none;
|
||||
background: rgba(255,255,255,0.15);
|
||||
color: white;
|
||||
border-radius: 50%;
|
||||
font-size: 1.25rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.wizard-header .back-btn:active { background: rgba(255,255,255,0.25); }
|
||||
.wizard-header h1 {
|
||||
margin: 0;
|
||||
font-size: 1.0625rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Step indicator */
|
||||
.step-indicator {
|
||||
position: sticky;
|
||||
top: 52px;
|
||||
z-index: 90;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.625rem 0.5rem;
|
||||
gap: 0;
|
||||
background: white;
|
||||
border-bottom: 1px solid #e5e7eb;
|
||||
}
|
||||
.step {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.125rem;
|
||||
font-size: 0.5625rem;
|
||||
color: #9ca3af;
|
||||
}
|
||||
.step .step-dot {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 700;
|
||||
background: #e5e7eb;
|
||||
color: #9ca3af;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.step.active .step-dot { background: #2563eb; color: white; }
|
||||
.step.active { color: #2563eb; font-weight: 600; }
|
||||
.step.completed .step-dot { background: #10b981; color: white; }
|
||||
.step.completed { color: #10b981; }
|
||||
.step-line {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: #e5e7eb;
|
||||
margin: 0 0.0625rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.step.completed + .step-line { background: #10b981; }
|
||||
|
||||
/* Step content area */
|
||||
.step-content {
|
||||
padding: 52px 0 76px 0; /* header + bottom nav */
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
/* Sections */
|
||||
.wizard-section {
|
||||
margin: 0.75rem;
|
||||
background: white;
|
||||
border-radius: 0.75rem;
|
||||
padding: 1.25rem;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.06);
|
||||
}
|
||||
.section-title {
|
||||
font-size: 0.9375rem;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
margin-bottom: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.section-title .sn {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 50%;
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Info row */
|
||||
.info-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid #f3f4f6;
|
||||
}
|
||||
.info-row:last-child { border-bottom: none; }
|
||||
.info-label {
|
||||
font-size: 0.8125rem;
|
||||
color: #6b7280;
|
||||
width: 70px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.info-value {
|
||||
font-size: 0.9375rem;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* Worker grid */
|
||||
.worker-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.worker-card {
|
||||
padding: 0.75rem;
|
||||
border: 2px solid #e5e7eb;
|
||||
border-radius: 0.75rem;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
transition: all 0.12s;
|
||||
min-height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.worker-card:active { transform: scale(0.97); }
|
||||
.worker-card.selected {
|
||||
border-color: #2563eb;
|
||||
background: #eff6ff;
|
||||
}
|
||||
.worker-card .worker-check {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 4px;
|
||||
border: 2px solid #d1d5db;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.75rem;
|
||||
flex-shrink: 0;
|
||||
color: transparent;
|
||||
}
|
||||
.worker-card.selected .worker-check {
|
||||
border-color: #2563eb;
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
}
|
||||
.worker-card .worker-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
.worker-card .worker-name {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.worker-card .worker-type {
|
||||
font-size: 0.6875rem;
|
||||
color: #6b7280;
|
||||
}
|
||||
.select-all-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.625rem 0;
|
||||
margin-bottom: 0.5rem;
|
||||
border-bottom: 1px solid #f3f4f6;
|
||||
}
|
||||
.select-all-bar .count {
|
||||
font-size: 0.8125rem;
|
||||
color: #2563eb;
|
||||
font-weight: 600;
|
||||
}
|
||||
.select-all-btn {
|
||||
padding: 0.375rem 0.75rem;
|
||||
border: 1px solid #d1d5db;
|
||||
border-radius: 0.5rem;
|
||||
background: white;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.select-all-btn:active { background: #f3f4f6; }
|
||||
|
||||
/* Project / list items */
|
||||
.list-item {
|
||||
padding: 0.875rem 1rem;
|
||||
border: 1.5px solid #e5e7eb;
|
||||
border-radius: 0.75rem;
|
||||
margin-bottom: 0.5rem;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
transition: all 0.12s;
|
||||
}
|
||||
.list-item:active { transform: scale(0.98); }
|
||||
.list-item.selected {
|
||||
border-color: #2563eb;
|
||||
background: #eff6ff;
|
||||
}
|
||||
.list-item .item-title {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
}
|
||||
.list-item .item-desc {
|
||||
font-size: 0.75rem;
|
||||
color: #6b7280;
|
||||
margin-top: 0.125rem;
|
||||
}
|
||||
.list-item-skip {
|
||||
padding: 0.875rem 1rem;
|
||||
border: 1.5px dashed #d1d5db;
|
||||
border-radius: 0.75rem;
|
||||
text-align: center;
|
||||
font-size: 0.8125rem;
|
||||
color: #6b7280;
|
||||
cursor: pointer;
|
||||
margin-bottom: 0.5rem;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.list-item-skip:active { background: #f9fafb; }
|
||||
.list-item-skip.selected {
|
||||
border-color: #6b7280;
|
||||
border-style: solid;
|
||||
background: #f9fafb;
|
||||
color: #374151;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Pill buttons */
|
||||
.pill-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.pill-btn {
|
||||
padding: 0.5rem 0.875rem;
|
||||
border: 1.5px solid #d1d5db;
|
||||
border-radius: 2rem;
|
||||
background: white;
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.12s;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.pill-btn:active { transform: scale(0.97); }
|
||||
.pill-btn.selected {
|
||||
border-color: #2563eb;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
font-weight: 600;
|
||||
}
|
||||
.sub-section {
|
||||
margin-top: 1rem;
|
||||
padding-top: 0.875rem;
|
||||
border-top: 1px solid #f3f4f6;
|
||||
}
|
||||
.sub-section-title {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
color: #6b7280;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
/* Map button */
|
||||
.map-open-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0.875rem 1rem;
|
||||
background: linear-gradient(135deg, #0d9488, #0f766e);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0.75rem;
|
||||
cursor: pointer;
|
||||
margin-bottom: 0.75rem;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
.map-open-btn:active { opacity: 0.85; transform: scale(0.98); }
|
||||
.map-open-icon { font-size: 1.5rem; flex-shrink: 0; }
|
||||
.map-open-text { font-size: 0.9375rem; font-weight: 700; flex: 1; text-align: left; }
|
||||
.map-open-arrow { font-size: 1.125rem; opacity: 0.7; flex-shrink: 0; }
|
||||
|
||||
.location-info {
|
||||
padding: 0.75rem;
|
||||
background: #f0fdf4;
|
||||
border: 1px solid #bbf7d0;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #166534;
|
||||
margin-bottom: 0.75rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.location-info.empty {
|
||||
background: #f9fafb;
|
||||
border-color: #e5e7eb;
|
||||
color: #9ca3af;
|
||||
}
|
||||
|
||||
/* Summary card (Step 6) */
|
||||
.summary-card {
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 0.75rem;
|
||||
padding: 1rem;
|
||||
margin-bottom: 0.75rem;
|
||||
background: #f9fafb;
|
||||
}
|
||||
.summary-row {
|
||||
display: flex;
|
||||
padding: 0.375rem 0;
|
||||
}
|
||||
.summary-label {
|
||||
font-size: 0.75rem;
|
||||
color: #6b7280;
|
||||
width: 70px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.summary-value {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* Worker accordion (Step 6) */
|
||||
.worker-accordion {
|
||||
border: 1.5px solid #e5e7eb;
|
||||
border-radius: 0.75rem;
|
||||
margin-bottom: 0.5rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.worker-accordion.overridden {
|
||||
border-color: #f97316;
|
||||
}
|
||||
.worker-accordion-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.75rem 1rem;
|
||||
background: #f9fafb;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
user-select: none;
|
||||
}
|
||||
.worker-accordion-header:active { background: #f3f4f6; }
|
||||
.worker-accordion .acc-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.worker-accordion .acc-name {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
}
|
||||
.worker-accordion .acc-badge {
|
||||
font-size: 0.625rem;
|
||||
padding: 0.125rem 0.375rem;
|
||||
border-radius: 9999px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.badge-default {
|
||||
background: #dbeafe;
|
||||
color: #1e40af;
|
||||
}
|
||||
.badge-override {
|
||||
background: #ffedd5;
|
||||
color: #c2410c;
|
||||
}
|
||||
.worker-accordion .acc-arrow {
|
||||
font-size: 0.75rem;
|
||||
color: #9ca3af;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
.worker-accordion.open .acc-arrow { transform: rotate(180deg); }
|
||||
.worker-accordion-body {
|
||||
display: none;
|
||||
border-top: 1px solid #e5e7eb;
|
||||
padding: 0.75rem 1rem;
|
||||
}
|
||||
.worker-accordion.open .worker-accordion-body { display: block; }
|
||||
.override-row {
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
.override-label {
|
||||
font-size: 0.75rem;
|
||||
color: #6b7280;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
.override-select {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid #d1d5db;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
background: white;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b7280' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 0.75rem center;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.override-select:focus {
|
||||
outline: none;
|
||||
border-color: #2563eb;
|
||||
box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
|
||||
}
|
||||
.reset-btn {
|
||||
width: 100%;
|
||||
padding: 0.5rem;
|
||||
border: 1px dashed #d1d5db;
|
||||
border-radius: 0.5rem;
|
||||
background: white;
|
||||
font-size: 0.75rem;
|
||||
color: #6b7280;
|
||||
cursor: pointer;
|
||||
margin-top: 0.25rem;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.reset-btn:active { background: #f3f4f6; }
|
||||
|
||||
/* Empty state */
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 2rem 1rem;
|
||||
color: #9ca3af;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* Fixed bottom nav */
|
||||
.wizard-nav {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
height: 68px;
|
||||
background: white;
|
||||
border-top: 1px solid #e5e7eb;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 1rem;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
@media (min-width: 480px) {
|
||||
.wizard-nav { max-width: 480px; margin: 0 auto; }
|
||||
}
|
||||
.nav-btn {
|
||||
padding: 0.75rem 1.5rem;
|
||||
border: none;
|
||||
border-radius: 0.75rem;
|
||||
font-size: 0.9375rem;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
touch-action: manipulation;
|
||||
transition: all 0.15s;
|
||||
}
|
||||
.nav-btn:active { transform: scale(0.97); }
|
||||
.nav-btn-prev {
|
||||
background: #f3f4f6;
|
||||
color: #374151;
|
||||
}
|
||||
.nav-btn-next {
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
}
|
||||
.nav-btn-next:disabled {
|
||||
background: #d1d5db;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.nav-btn-next:not(:disabled):active { background: #1d4ed8; }
|
||||
.nav-btn-save {
|
||||
background: #10b981;
|
||||
color: white;
|
||||
}
|
||||
.nav-btn-save:disabled {
|
||||
background: #d1d5db;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.nav-btn-save:not(:disabled):active { background: #059669; }
|
||||
|
||||
/* Landscape map overlay */
|
||||
.landscape-overlay {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 10000;
|
||||
background: rgba(0, 0, 0, 0.95);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.landscape-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #111;
|
||||
overflow: hidden;
|
||||
}
|
||||
.landscape-inner.rotated {
|
||||
width: 100vh;
|
||||
height: 100vw;
|
||||
transform: translate(-50%, -50%) rotate(90deg);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
}
|
||||
.landscape-inner.no-rotate {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
.landscape-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.5rem 1rem;
|
||||
background: linear-gradient(135deg, #2563eb, #1d4ed8);
|
||||
color: white;
|
||||
flex-shrink: 0;
|
||||
min-height: 44px;
|
||||
}
|
||||
.landscape-header h3 {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.landscape-header .ls-selected {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 400;
|
||||
opacity: 0.9;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
.landscape-close-btn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
color: white;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.landscape-canvas-wrap {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
background: #111;
|
||||
padding: 8px;
|
||||
}
|
||||
.landscape-canvas-wrap canvas {
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
/* Loading overlay */
|
||||
.loading-overlay {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 9999;
|
||||
background: rgba(255,255,255,0.8);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
.loading-spinner {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 4px solid #e5e7eb;
|
||||
border-top-color: #2563eb;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear infinite;
|
||||
}
|
||||
@keyframes spin { to { transform: rotate(360deg); } }
|
||||
.loading-text {
|
||||
font-size: 0.875rem;
|
||||
color: #6b7280;
|
||||
}
|
||||
|
||||
/* Toast */
|
||||
.toast-container {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 10001;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
@keyframes slideIn {
|
||||
from { opacity: 0; transform: translateY(-10px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
@keyframes slideOut {
|
||||
from { opacity: 1; transform: translateY(0); }
|
||||
to { opacity: 0; transform: translateY(-10px); }
|
||||
}
|
||||
|
||||
/* Bulk edit */
|
||||
.bulk-bar { display:flex; align-items:center; justify-content:space-between; padding:0.625rem 0; border-bottom:1px solid #f3f4f6; margin-bottom:0.5rem; }
|
||||
.bulk-bar .bulk-left { display:flex; align-items:center; gap:0.5rem; }
|
||||
.bulk-bar .bulk-count { font-size:0.8125rem; color:#2563eb; font-weight:600; }
|
||||
.bulk-edit-btn { padding:0.375rem 0.75rem; background:#2563eb; color:#fff; border:none; border-radius:0.5rem; font-size:0.75rem; font-weight:600; cursor:pointer; -webkit-tap-highlight-color:transparent; }
|
||||
.bulk-edit-btn:disabled { background:#d1d5db; cursor:not-allowed; }
|
||||
.bulk-edit-btn:not(:disabled):active { background:#1d4ed8; }
|
||||
.bulk-form { background:#f0f9ff; border:1.5px solid #93c5fd; border-radius:0.75rem; padding:1rem; margin-bottom:0.75rem; }
|
||||
.bulk-form .override-row { margin-bottom:0.75rem; }
|
||||
.bulk-form .bulk-apply-btn { width:100%; padding:0.625rem; background:#2563eb; color:#fff; border:none; border-radius:0.5rem; font-size:0.875rem; font-weight:700; margin-top:0.5rem; cursor:pointer; -webkit-tap-highlight-color:transparent; }
|
||||
.bulk-form .bulk-apply-btn:active { background:#1d4ed8; }
|
||||
.bulk-form .bulk-cancel-btn { width:100%; padding:0.5rem; background:none; border:1px solid #d1d5db; border-radius:0.5rem; font-size:0.75rem; color:#6b7280; margin-top:0.375rem; cursor:pointer; -webkit-tap-highlight-color:transparent; }
|
||||
.bulk-form .bulk-cancel-btn:active { background:#f3f4f6; }
|
||||
.acc-check { width:20px; height:20px; accent-color:#2563eb; flex-shrink:0; margin:0; }
|
||||
|
||||
/* Inline add: dashed pill for "+" */
|
||||
.pill-btn-add {
|
||||
padding: 0.5rem 0.875rem;
|
||||
border: 1.5px dashed #93c5fd;
|
||||
border-radius: 2rem;
|
||||
background: white;
|
||||
font-size: 0.8125rem;
|
||||
color: #2563eb;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
white-space: nowrap;
|
||||
transition: all 0.12s;
|
||||
}
|
||||
.pill-btn-add:active { background: #eff6ff; transform: scale(0.97); }
|
||||
|
||||
/* Inline add: dashed list-item for new task */
|
||||
.list-item-add {
|
||||
padding: 0.875rem 1rem;
|
||||
border: 1.5px dashed #93c5fd;
|
||||
border-radius: 0.75rem;
|
||||
margin-bottom: 0.5rem;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
text-align: center;
|
||||
font-size: 0.8125rem;
|
||||
color: #2563eb;
|
||||
transition: all 0.12s;
|
||||
}
|
||||
.list-item-add:active { background: #eff6ff; transform: scale(0.98); }
|
||||
|
||||
/* Inline add form */
|
||||
.inline-add-form {
|
||||
background: #f0f9ff;
|
||||
border: 1.5px solid #93c5fd;
|
||||
border-radius: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
animation: fadeSlideIn 150ms ease-out;
|
||||
}
|
||||
.inline-add-form input[type="text"] {
|
||||
width: 100%;
|
||||
padding: 0.625rem 0.75rem;
|
||||
border: 1px solid #d1d5db;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
background: white;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.inline-add-form input[type="text"]:focus {
|
||||
outline: none;
|
||||
border-color: #2563eb;
|
||||
box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
|
||||
}
|
||||
.inline-add-form .inline-add-btns {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.inline-add-form .inline-add-btns button {
|
||||
flex: 1;
|
||||
padding: 0.5rem;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.inline-add-form .btn-cancel {
|
||||
background: white;
|
||||
border: 1px solid #d1d5db;
|
||||
color: #6b7280;
|
||||
}
|
||||
.inline-add-form .btn-cancel:active { background: #f3f4f6; }
|
||||
.inline-add-form .btn-save {
|
||||
background: #2563eb;
|
||||
border: none;
|
||||
color: white;
|
||||
}
|
||||
.inline-add-form .btn-save:active { background: #1d4ed8; }
|
||||
.inline-add-form .btn-save:disabled {
|
||||
background: #93c5fd;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
@keyframes fadeSlideIn {
|
||||
from { opacity: 0; transform: translateY(-6px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
<div class="flex-1 min-w-0">
|
||||
|
||||
<div class="tbm-create-wrap">
|
||||
<!-- Fixed Header -->
|
||||
<div class="wizard-header">
|
||||
<button type="button" class="back-btn" onclick="goBack()">←</button>
|
||||
<h1>TBM 시작</h1>
|
||||
</div>
|
||||
|
||||
<!-- Step Indicator -->
|
||||
<div class="step-indicator" id="stepIndicator">
|
||||
<div class="step active"><span class="step-dot">1</span><span>작업자</span></div>
|
||||
<div class="step-line"></div>
|
||||
<div class="step"><span class="step-dot">2</span><span>프로젝트+공정</span></div>
|
||||
<div class="step-line"></div>
|
||||
<div class="step"><span class="step-dot">3</span><span>확인</span></div>
|
||||
</div>
|
||||
|
||||
<!-- Step Content -->
|
||||
<div class="step-content" id="stepContainer">
|
||||
<!-- Dynamically rendered by tbm-create.js -->
|
||||
</div>
|
||||
|
||||
<!-- Fixed Bottom Nav -->
|
||||
<div class="wizard-nav" id="wizardNav">
|
||||
<button type="button" class="nav-btn nav-btn-prev" id="prevBtn" style="visibility:hidden;">← 이전</button>
|
||||
<button type="button" class="nav-btn nav-btn-next" id="nextBtn">다음 →</button>
|
||||
</div>
|
||||
|
||||
<!-- Landscape Map Overlay removed - workplace selection moved to detail edit stage -->
|
||||
|
||||
<!-- Loading Overlay -->
|
||||
<div id="loadingOverlay" class="loading-overlay">
|
||||
<div class="loading-spinner"></div>
|
||||
<div class="loading-text" id="loadingText">데이터를 불러오는 중...</div>
|
||||
</div>
|
||||
|
||||
<!-- Toast Container -->
|
||||
<div id="toastContainer" class="toast-container"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026040101"></script>
|
||||
<!-- 공통 모듈 -->
|
||||
<script src="/js/common/utils.js?v=2026040101"></script>
|
||||
<script src="/js/common/base-state.js?v=2026040101"></script>
|
||||
<script src="/js/tbm/state.js?v=2026040101"></script>
|
||||
<script src="/js/tbm/utils.js?v=2026040101"></script>
|
||||
<script src="/js/tbm/api.js?v=2026040101"></script>
|
||||
<script src="/js/tbm-create.js?v=2026040101"></script>
|
||||
<script>initAuth();</script>
|
||||
</body>
|
||||
</html>
|
||||
279
system1-factory/web/public/pages/work/tbm-mobile.html
Normal file
279
system1-factory/web/public/pages/work/tbm-mobile.html
Normal file
@@ -0,0 +1,279 @@
|
||||
<!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>TBM - 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/tbm-mobile.css?v=2026040101">
|
||||
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white"><i class="fas fa-bars text-xl"></i></button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃"><i class="fas fa-sign-out-alt"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
<div class="flex-1 min-w-0">
|
||||
|
||||
<!-- Loading Overlay -->
|
||||
<div id="loadingOverlay" class="m-loading-overlay">
|
||||
<div class="m-loading-spinner"></div>
|
||||
<div class="m-loading-text" id="loadingText">불러오는 중...</div>
|
||||
</div>
|
||||
|
||||
<!-- Header -->
|
||||
<div class="m-header">
|
||||
<div class="m-header-top">
|
||||
<div>
|
||||
<h1>TBM</h1>
|
||||
<div class="m-date" id="headerDate"></div>
|
||||
</div>
|
||||
<button type="button" class="m-new-btn" onclick="location.href='/pages/work/tbm-create.html'">
|
||||
+ 새 TBM
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tabs -->
|
||||
<div class="m-tabs">
|
||||
<button type="button" class="m-tab active" data-tab="today" onclick="switchTab('today')">
|
||||
당일 <span class="tab-count" id="todayCount">0</span>
|
||||
</button>
|
||||
<button type="button" class="m-tab" data-tab="all" onclick="switchTab('all')">
|
||||
전체 <span class="tab-count" id="allCount">0</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="m-content" id="tbmContent">
|
||||
<div class="m-skeleton"></div>
|
||||
<div class="m-skeleton"></div>
|
||||
<div class="m-skeleton"></div>
|
||||
<div class="m-skeleton"></div>
|
||||
</div>
|
||||
|
||||
<script src="/static/js/shared-bottom-nav.js?v=2026040103"></script>
|
||||
|
||||
<!-- Toast -->
|
||||
<div id="toastContainer" class="toast-container"></div>
|
||||
|
||||
<!-- TBM 완료 바텀시트 -->
|
||||
<div id="completeOverlay" style="display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:9000;" onclick="closeCompleteSheet()"></div>
|
||||
<div id="completeSheet" style="display:none; position:fixed; bottom:0; left:0; right:0; z-index:9001; background:white; border-radius:1rem 1rem 0 0; max-height:85vh; overflow-y:auto; padding-bottom:env(safe-area-inset-bottom); box-shadow:0 -4px 24px rgba(0,0,0,0.15);">
|
||||
<div style="padding:1rem 1rem 0;">
|
||||
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:0.75rem;">
|
||||
<h3 style="margin:0; font-size:1rem; font-weight:700;">TBM 완료</h3>
|
||||
<button type="button" onclick="closeCompleteSheet()" style="background:none; border:none; font-size:1.25rem; color:#6b7280; cursor:pointer; padding:0.25rem;">✕</button>
|
||||
</div>
|
||||
<p style="margin:0 0 0.75rem; font-size:0.8125rem; color:#6b7280;">각 작업자의 근태를 선택하세요</p>
|
||||
</div>
|
||||
<div id="completeWorkerList" style="padding:0 1rem;"></div>
|
||||
<div style="padding:0.75rem 1rem 1rem;">
|
||||
<button type="button" id="completeSheetBtn" onclick="submitCompleteSheet()" style="width:100%; padding:0.75rem; background:#2563eb; color:white; border:none; border-radius:0.5rem; font-size:0.9375rem; font-weight:700; cursor:pointer;">완료 처리</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 세부 편집 바텀시트 -->
|
||||
<div id="detailEditOverlay" class="detail-edit-overlay" onclick="closeDetailEditSheet()"></div>
|
||||
<div id="detailEditSheet" class="detail-edit-sheet">
|
||||
<div class="de-header">
|
||||
<div class="de-header-row">
|
||||
<h3>세부 내역 입력</h3>
|
||||
<button type="button" class="de-close" onclick="closeDetailEditSheet()">✕</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="de-select-all-row">
|
||||
<input type="checkbox" class="de-worker-check" id="deSelectAll" onchange="toggleSelectAll()">
|
||||
<span>전체 선택</span>
|
||||
<span id="deSelectedCount" style="margin-left:auto; font-weight:600; color:#2563eb;"></span>
|
||||
</div>
|
||||
<div class="de-group-bar" id="deGroupBar">
|
||||
<span id="deGroupLabel">0명 선택</span>
|
||||
<button type="button" class="de-group-btn" onclick="openPicker('task')">작업 설정</button>
|
||||
<button type="button" class="de-group-btn" onclick="openPicker('workplace')">장소 설정</button>
|
||||
</div>
|
||||
<div class="de-worker-list" id="deWorkerList"></div>
|
||||
<div class="de-save-area">
|
||||
<div style="display:flex; gap:0.5rem;">
|
||||
<button type="button" class="de-save-btn" id="deSaveBtn" onclick="saveDetailEdit()" style="flex:2;">저장</button>
|
||||
<button type="button" class="de-save-btn" onclick="completeFromDetailSheet()" style="flex:1; background:#10b981;">완료</button>
|
||||
<button type="button" class="de-save-btn" onclick="handoverFromDetailSheet()" style="flex:0.7; background:#f59e0b;">인계</button>
|
||||
<button type="button" class="de-save-btn" onclick="deleteFromDetailSheet()" style="flex:0.7; background:#ef4444;">삭제</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업/장소 선택 피커 -->
|
||||
<div id="pickerOverlay" class="picker-overlay" onclick="closePicker()"></div>
|
||||
<div id="pickerSheet" class="picker-sheet">
|
||||
<div class="picker-header">
|
||||
<h4 id="pickerTitle">선택</h4>
|
||||
<button type="button" class="picker-close" onclick="closePicker()">✕</button>
|
||||
</div>
|
||||
<div class="picker-list" id="pickerList"></div>
|
||||
<div class="picker-add-row" id="pickerAddRow">
|
||||
<input type="text" class="picker-add-input" id="pickerAddInput" placeholder="새 항목 추가...">
|
||||
<button type="button" class="picker-add-btn" id="pickerAddBtn" onclick="addNewItem()">추가</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 분할 바텀시트 -->
|
||||
<div id="splitOverlay" class="split-overlay" onclick="closeSplitSheet()"></div>
|
||||
<div id="splitSheet" class="split-sheet">
|
||||
<div class="split-header">
|
||||
<div style="display:flex; justify-content:space-between; align-items:center;">
|
||||
<h4 id="splitTitle">작업 분할</h4>
|
||||
<button type="button" onclick="closeSplitSheet()" style="background:none; border:none; font-size:1.125rem; color:#6b7280; cursor:pointer;">✕</button>
|
||||
</div>
|
||||
<p id="splitSubtitle">작업자의 근무 시간을 분할합니다</p>
|
||||
</div>
|
||||
<div class="split-body">
|
||||
<div class="split-field">
|
||||
<label>현재 TBM 작업 시간</label>
|
||||
<input type="number" id="splitHours" class="split-input" step="0.5" min="0.5" max="7.5" placeholder="예: 5">
|
||||
<div id="splitRemainder" style="font-size:0.75rem; color:#6b7280; margin-top:0.25rem;"></div>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>나머지 시간 배정</label>
|
||||
<div class="split-radio-group">
|
||||
<div class="split-radio-item active" id="splitOptKeep" onclick="setSplitOption('keep')">현재 TBM 유지</div>
|
||||
<div class="split-radio-item" id="splitOptSend" onclick="setSplitOption('send')">다른 반장에게</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>프로젝트 (변경 시 선택)</label>
|
||||
<select id="splitProjectId" class="split-input" style="padding:0.625rem;">
|
||||
<option value="">현재 프로젝트 유지</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>공정 (변경 시 선택)</label>
|
||||
<select id="splitWorkTypeId" class="split-input" style="padding:0.625rem;">
|
||||
<option value="">현재 공정 유지</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="splitSessionPicker" style="display:none;">
|
||||
<div class="split-field">
|
||||
<label>이동할 TBM 선택</label>
|
||||
<div class="split-session-list" id="splitSessionList"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split-footer">
|
||||
<button type="button" class="split-btn" id="splitSaveBtn" onclick="saveSplit()">분할 저장</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 빼오기 바텀시트 -->
|
||||
<div id="pullOverlay" class="pull-overlay" onclick="closePullSheet()"></div>
|
||||
<div id="pullSheet" class="pull-sheet">
|
||||
<div class="pull-header">
|
||||
<div style="display:flex; justify-content:space-between; align-items:center;">
|
||||
<h4 id="pullTitle">팀원 목록</h4>
|
||||
<button type="button" onclick="closePullSheet()" style="background:none; border:none; font-size:1.125rem; color:#6b7280; cursor:pointer;">✕</button>
|
||||
</div>
|
||||
<p id="pullSubtitle"></p>
|
||||
</div>
|
||||
<div id="pullMemberList"></div>
|
||||
</div>
|
||||
|
||||
<!-- 빼오기 시간 입력 모달 -->
|
||||
<div id="pullHoursOverlay" class="split-overlay" style="z-index:9300;" onclick="closePullHoursModal()"></div>
|
||||
<div id="pullHoursSheet" class="split-sheet" style="z-index:9301; max-height:60vh;">
|
||||
<div class="split-header">
|
||||
<div style="display:flex; justify-content:space-between; align-items:center;">
|
||||
<h4 id="pullHoursTitle">빼오기</h4>
|
||||
<button type="button" onclick="closePullHoursModal()" style="background:none; border:none; font-size:1.125rem; color:#6b7280; cursor:pointer;">✕</button>
|
||||
</div>
|
||||
<p id="pullHoursSubtitle">이동할 시간을 입력하세요</p>
|
||||
</div>
|
||||
<div class="split-body">
|
||||
<div class="split-field">
|
||||
<label>빼올 시간</label>
|
||||
<input type="number" id="pullHoursInput" class="split-input" step="0.5" min="0.5" placeholder="예: 3">
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>내 TBM 프로젝트 (선택)</label>
|
||||
<select id="pullProjectId" class="split-input" style="padding:0.625rem;">
|
||||
<option value="">내 TBM 프로젝트 사용</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>내 TBM 공정 (선택)</label>
|
||||
<select id="pullWorkTypeId" class="split-input" style="padding:0.625rem;">
|
||||
<option value="">내 TBM 공정 사용</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split-footer">
|
||||
<button type="button" class="split-btn" id="pullHoursSaveBtn" onclick="confirmPull()">빼오기 실행</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 인계 바텀시트 -->
|
||||
<div id="handoverOverlay" class="split-overlay" onclick="closeHandoverSheet()"></div>
|
||||
<div id="handoverSheet" class="split-sheet">
|
||||
<div class="split-header">
|
||||
<div style="display:flex; justify-content:space-between; align-items:center;">
|
||||
<h4>작업 인계</h4>
|
||||
<button type="button" onclick="closeHandoverSheet()" style="background:none; border:none; font-size:1.125rem; color:#6b7280; cursor:pointer;">✕</button>
|
||||
</div>
|
||||
<p id="handoverSubtitle">인계할 반장을 선택하세요</p>
|
||||
</div>
|
||||
<div class="split-body">
|
||||
<div class="split-field">
|
||||
<label>인계 대상 반장</label>
|
||||
<select id="handoverLeaderId" class="split-input" style="padding:0.625rem;">
|
||||
<option value="">반장 선택...</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>인계할 작업자</label>
|
||||
<div id="handoverWorkerList" style="max-height:200px; overflow-y:auto;"></div>
|
||||
</div>
|
||||
<div class="split-field">
|
||||
<label>비고</label>
|
||||
<input type="text" id="handoverNotes" class="split-input" placeholder="인계 사유 (선택)">
|
||||
</div>
|
||||
</div>
|
||||
<div class="split-footer">
|
||||
<button type="button" class="split-btn" onclick="submitHandover()">인계 요청</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 공통 모듈 -->
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026040101"></script>
|
||||
<script src="/js/common/utils.js?v=2026040101"></script>
|
||||
<script src="/js/common/base-state.js?v=2026040101"></script>
|
||||
|
||||
<script src="/js/tbm/state.js?v=2026040101"></script>
|
||||
<script src="/js/tbm/utils.js?v=2026040101"></script>
|
||||
<script src="/js/tbm/api.js?v=2026040101"></script>
|
||||
<script src="/js/tbm-mobile.js?v=2026033102"></script>
|
||||
<script>initAuth();</script>
|
||||
</body>
|
||||
</html>
|
||||
587
system1-factory/web/public/pages/work/tbm.html
Normal file
587
system1-factory/web/public/pages/work/tbm.html
Normal file
@@ -0,0 +1,587 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>TBM 관리 - 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/tbm.css?v=2026031602">
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<header class="bg-orange-700 text-white sticky top-0 z-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-14">
|
||||
<div class="flex items-center gap-3">
|
||||
<button id="mobileMenuBtn" class="lg:hidden text-orange-200 hover:text-white">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
<i class="fas fa-industry text-xl text-orange-200"></i>
|
||||
<h1 class="text-lg font-semibold">TK 공장관리</h1>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span id="headerUserName" class="text-sm hidden sm:block">-</span>
|
||||
<div id="headerUserAvatar" class="w-8 h-8 bg-orange-600 rounded-full flex items-center justify-center text-sm font-bold">-</div>
|
||||
<button onclick="doLogout()" class="text-orange-200 hover:text-white" title="로그아웃">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Mobile overlay -->
|
||||
<div id="mobileOverlay" class="hidden fixed inset-0 bg-black/50 z-30 lg:hidden"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 fade-in">
|
||||
<div class="flex gap-6">
|
||||
<!-- Sidebar Nav -->
|
||||
<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-14 left-0 bottom-0 overflow-y-auto"></nav>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<div class="tbm-container">
|
||||
<!-- 페이지 헤더 -->
|
||||
<div class="tbm-page-header">
|
||||
<div class="tbm-title-section">
|
||||
<h1 class="tbm-page-title">
|
||||
<span class="tbm-page-title-icon">🛠</span>
|
||||
TBM (Tool Box Meeting)
|
||||
</h1>
|
||||
<p class="tbm-page-description">아침 안전 회의 및 팀 구성 관리</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TBM 탭 메뉴 -->
|
||||
<div class="tbm-tab-menu">
|
||||
<button class="tbm-tab-btn active" data-tab="tbm-input" onclick="switchTbmTab('tbm-input')">
|
||||
<span class="tbm-tab-icon">📝</span>
|
||||
TBM 입력
|
||||
</button>
|
||||
<button class="tbm-tab-btn" data-tab="tbm-manage" onclick="switchTbmTab('tbm-manage')">
|
||||
<span class="tbm-tab-icon">📊</span>
|
||||
TBM 관리
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- TBM 입력 탭 -->
|
||||
<div id="tbm-input-tab" class="tbm-tab-content active">
|
||||
<div class="tbm-section">
|
||||
<div class="tbm-section-header">
|
||||
<h2 class="tbm-section-title">
|
||||
<span>📅</span>
|
||||
오늘의 TBM
|
||||
</h2>
|
||||
<div class="tbm-section-actions">
|
||||
<button class="tbm-btn tbm-btn-primary" onclick="openNewTbmModal()">
|
||||
<span class="tbm-btn-icon">+</span>
|
||||
새 TBM 시작
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tbm-stats-bar">
|
||||
<span class="tbm-stat-item">
|
||||
<span class="tbm-stat-label">오늘 등록</span>
|
||||
<span class="tbm-stat-value highlight" id="todayTotalSessions">0</span>
|
||||
<span class="tbm-stat-label">개</span>
|
||||
</span>
|
||||
<span class="tbm-stat-item">
|
||||
<span class="tbm-stat-label">완료</span>
|
||||
<span class="tbm-stat-value success" id="todayCompletedSessions">0</span>
|
||||
<span class="tbm-stat-label">개</span>
|
||||
</span>
|
||||
<span class="tbm-stat-item">
|
||||
<span class="tbm-stat-label">진행중</span>
|
||||
<span class="tbm-stat-value warning" id="todayActiveSessions">0</span>
|
||||
<span class="tbm-stat-label">개</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="tbm-card-grid" id="todayTbmGrid"></div>
|
||||
|
||||
<div class="tbm-empty-state" id="todayEmptyState" style="display: none;">
|
||||
<div class="tbm-empty-icon">📋</div>
|
||||
<h3 class="tbm-empty-title">오늘 등록된 TBM이 없습니다</h3>
|
||||
<p class="tbm-empty-description">"새 TBM 시작" 버튼을 눌러 오늘의 TBM을 시작해보세요.</p>
|
||||
<button class="tbm-btn tbm-btn-primary" onclick="openNewTbmModal()">
|
||||
<span class="tbm-btn-icon">+</span>
|
||||
첫 TBM 시작하기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TBM 관리 탭 -->
|
||||
<div id="tbm-manage-tab" class="tbm-tab-content">
|
||||
<div class="tbm-section">
|
||||
<div class="tbm-section-header">
|
||||
<h2 class="tbm-section-title">
|
||||
<span>📚</span>
|
||||
TBM 기록
|
||||
</h2>
|
||||
<div class="tbm-section-actions">
|
||||
<button class="tbm-btn tbm-btn-secondary" onclick="loadMoreTbmDays()" id="loadMoreBtn">
|
||||
더 보기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tbm-stats-bar">
|
||||
<span class="tbm-stat-item">
|
||||
<span class="tbm-stat-label">총</span>
|
||||
<span class="tbm-stat-value" id="totalSessions">0</span>
|
||||
<span class="tbm-stat-label">개</span>
|
||||
</span>
|
||||
<span class="tbm-stat-item">
|
||||
<span class="tbm-stat-label">완료</span>
|
||||
<span class="tbm-stat-value success" id="completedSessions">0</span>
|
||||
<span class="tbm-stat-label">개</span>
|
||||
</span>
|
||||
<span class="tbm-stat-item" id="viewModeIndicator" style="display: none;">
|
||||
<span class="tbm-stat-value" id="viewModeText">내 TBM만</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="tbm-section-body" id="tbmDateGroupsContainer"></div>
|
||||
|
||||
<div class="tbm-empty-state" id="emptyState" style="display: none;">
|
||||
<div class="tbm-empty-icon">📚</div>
|
||||
<h3 class="tbm-empty-title">등록된 TBM 세션이 없습니다</h3>
|
||||
<p class="tbm-empty-description">TBM 입력 탭에서 새로운 TBM을 시작해보세요.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TBM 생성 모달 -->
|
||||
<div id="tbmModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 800px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title" id="modalTitle"><span>📝</span> 새 TBM 시작</h2>
|
||||
<button class="tbm-modal-close" onclick="closeTbmModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<form id="tbmForm" onsubmit="event.preventDefault(); saveTbmSession();">
|
||||
<input type="hidden" id="sessionId">
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title"><span>📅</span> 기본 정보</h3>
|
||||
<div class="tbm-form-row">
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">TBM 날짜<span class="tbm-form-required">*</span></label>
|
||||
<div class="tbm-form-input-readonly" id="sessionDateDisplay">-</div>
|
||||
<input type="hidden" id="sessionDate">
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">입력자<span class="tbm-form-required">*</span></label>
|
||||
<div class="tbm-form-input-readonly" id="leaderName">-</div>
|
||||
<input type="hidden" id="leaderId">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-row">
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">프로젝트</label>
|
||||
<select id="newTbmProjectId" class="tbm-form-input"><option value="">선택 안함</option></select>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">공정<span class="tbm-form-required">*</span></label>
|
||||
<select id="newTbmWorkTypeId" class="tbm-form-input" required><option value="">공정 선택...</option></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-section">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
|
||||
<h3 class="tbm-form-section-title" style="margin: 0; border: 0; padding: 0;">
|
||||
<span>👥</span> 작업자 선택
|
||||
<span id="newTbmWorkerCount" style="color: #3b82f6; font-size: 0.875rem;">(0명)</span>
|
||||
</h3>
|
||||
<div style="display: flex; gap: 0.5rem;">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="selectAllNewTbmWorkers()">전체 선택</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="deselectAllNewTbmWorkers()">전체 해제</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="newTbmWorkerGrid" class="tbm-worker-select-grid"></div>
|
||||
<div class="tbm-alert tbm-alert-info" style="margin-top: 1rem;">
|
||||
<span class="tbm-alert-icon">💡</span>
|
||||
<div class="tbm-alert-content">
|
||||
<div class="tbm-alert-text">저장 후 카드를 클릭하면 작업자별 <strong>작업/작업장</strong>을 입력할 수 있습니다.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 편집 모드: 작업자별 작업 목록 (openTeamCompositionModal에서 사용) -->
|
||||
<div id="workerTaskListSection" class="tbm-form-section" style="display: none;">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
|
||||
<h3 class="tbm-form-section-title" style="margin: 0; border: 0; padding: 0;">
|
||||
<span>👥</span> 작업자별 작업 배정
|
||||
</h3>
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="openBulkSettingModal()">⚙ 일괄 설정</button>
|
||||
</div>
|
||||
<div id="workerListEmpty" style="display: none; justify-content: center; align-items: center; padding: 2rem; color: #94a3b8; font-size: 0.875rem;">
|
||||
배정된 작업자가 없습니다.
|
||||
</div>
|
||||
<div id="workerTaskList" style="display: flex; flex-direction: column; gap: 1rem;"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeTbmModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="saveTbmSession()"><span class="tbm-btn-icon">✓</span> 저장하기</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 일괄 설정 모달 -->
|
||||
<div id="bulkSettingModal" class="tbm-modal-overlay" style="display: none; z-index: 1101;">
|
||||
<div class="tbm-modal" style="max-width: 700px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>⚙</span> 일괄 설정</h2>
|
||||
<button class="tbm-modal-close" onclick="closeBulkSettingModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div class="tbm-alert tbm-alert-info">
|
||||
<span class="tbm-alert-icon">💡</span>
|
||||
<div class="tbm-alert-content">
|
||||
<div class="tbm-alert-title">일괄 설정</div>
|
||||
<div class="tbm-alert-text">선택한 작업자들의 <strong>첫 번째 작업 라인</strong>에 동일한 정보가 적용됩니다.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-section">
|
||||
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem;">
|
||||
<label class="tbm-form-label">적용할 작업자 선택<span class="tbm-form-required">*</span></label>
|
||||
<div style="display: flex; gap: 0.25rem;">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="selectAllForBulk()">전체</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="deselectAllForBulk()">해제</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="bulkWorkerSelection" class="tbm-worker-select-grid" style="max-height: 180px;"></div>
|
||||
</div>
|
||||
<div class="tbm-form-section" style="border-top: 1px solid #e2e8f0; padding-top: 1.5rem;">
|
||||
<h3 class="tbm-form-section-title" style="border: 0; padding: 0; margin-bottom: 1rem;"><span>🛠</span> 적용할 작업 정보</h3>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">프로젝트</label>
|
||||
<button type="button" id="bulkProjectBtn" onclick="openBulkItemSelect('project')" class="tbm-select-btn">프로젝트 선택 <span class="tbm-select-arrow">▼</span></button>
|
||||
<input type="hidden" id="bulkProjectId">
|
||||
</div>
|
||||
<div class="tbm-form-row">
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">공정<span class="tbm-form-required">*</span></label>
|
||||
<button type="button" id="bulkWorkTypeBtn" onclick="openBulkItemSelect('workType')" class="tbm-select-btn">공정 선택 <span class="tbm-select-arrow">▼</span></button>
|
||||
<input type="hidden" id="bulkWorkTypeId">
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">작업<span class="tbm-form-required">*</span></label>
|
||||
<button type="button" id="bulkTaskBtn" onclick="openBulkItemSelect('task')" class="tbm-select-btn" disabled>작업 선택 <span class="tbm-select-arrow">▼</span></button>
|
||||
<input type="hidden" id="bulkTaskId">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">작업장<span class="tbm-form-required">*</span></label>
|
||||
<button type="button" id="bulkWorkplaceBtn" onclick="openBulkWorkplaceSelect()" class="tbm-select-btn">작업장 선택 <span class="tbm-select-arrow">▼</span></button>
|
||||
<input type="hidden" id="bulkWorkplaceCategoryId">
|
||||
<input type="hidden" id="bulkWorkplaceId">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeBulkSettingModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="applyBulkSettings()"><span class="tbm-btn-icon">✓</span> 선택한 작업자에 적용</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업자 선택 모달 -->
|
||||
<div id="workerSelectionModal" class="tbm-modal-overlay" style="display: none; z-index: 1101;">
|
||||
<div class="tbm-modal" style="max-width: 800px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>👥</span> 작업자 선택</h2>
|
||||
<button class="tbm-modal-close" onclick="closeWorkerSelectionModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div style="margin-bottom: 1rem; display: flex; gap: 0.5rem;">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="selectAllWorkersInModal()">전체 선택</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="deselectAllWorkersInModal()">전체 해제</button>
|
||||
</div>
|
||||
<div id="workerCardGrid" class="tbm-worker-select-grid"></div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeWorkerSelectionModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="confirmWorkerSelection()"><span class="tbm-btn-icon">✓</span> 선택 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 항목 선택 모달 -->
|
||||
<div id="itemSelectModal" class="tbm-modal-overlay" style="display: none; z-index: 1102;">
|
||||
<div class="tbm-modal" style="max-width: 600px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title" id="itemSelectModalTitle">항목 선택</h2>
|
||||
<button class="tbm-modal-close" onclick="closeItemSelectModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div id="itemSelectList" class="tbm-item-list"></div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeItemSelectModal()">취소</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업장 선택 모달 -->
|
||||
<div id="workplaceSelectModal" class="tbm-modal-overlay" style="display: none; z-index: 1102;">
|
||||
<div class="tbm-modal" style="max-width: 1000px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>🏭</span> 작업장 선택</h2>
|
||||
<button class="tbm-modal-close" onclick="closeWorkplaceSelectModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title">
|
||||
<span style="background: #3b82f6; color: white; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 0.8rem;">1</span>
|
||||
공장 선택
|
||||
</h3>
|
||||
<div id="categoryList" style="display: flex; flex-wrap: wrap; gap: 0.5rem;"></div>
|
||||
</div>
|
||||
<div id="workplaceSelectionArea" style="display: none;">
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title">
|
||||
<span style="background: #3b82f6; color: white; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 0.8rem;">2</span>
|
||||
작업장 선택
|
||||
</h3>
|
||||
<div id="layoutMapArea" style="display: none; padding: 1rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px;">
|
||||
<div style="font-size: 0.875rem; color: #64748b; margin-bottom: 0.75rem;">지도에서 작업장을 클릭하여 선택하세요</div>
|
||||
<div class="tbm-workplace-map-container">
|
||||
<canvas id="workplaceMapCanvas"></canvas>
|
||||
</div>
|
||||
<button type="button" class="landscape-trigger-btn" id="landscapeTriggerBtn" onclick="openLandscapeMap()" style="display:none;">📺 전체화면 지도</button>
|
||||
</div>
|
||||
<div style="margin-top: 0.75rem;">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="toggleWorkplaceList()" id="toggleListBtn" style="display: none;">리스트로 선택</button>
|
||||
<div id="workplaceListSection">
|
||||
<div id="workplaceList" class="tbm-item-list">
|
||||
<div style="color: #94a3b8; text-align: center; padding: 2rem;">공장을 먼저 선택해주세요</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeWorkplaceSelectModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="confirmWorkplaceSelection()" id="confirmWorkplaceBtn" disabled><span class="tbm-btn-icon">✓</span> 선택 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 팀 구성 모달 -->
|
||||
<div id="teamModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 900px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>👥</span> 팀 구성</h2>
|
||||
<button class="tbm-modal-close" onclick="closeTeamModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
|
||||
<h3 class="tbm-form-section-title" style="margin: 0; border: 0; padding: 0;">작업자 선택</h3>
|
||||
<div style="display: flex; gap: 0.5rem;">
|
||||
<button class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="selectAllWorkers()">전체 선택</button>
|
||||
<button class="tbm-btn tbm-btn-secondary tbm-btn-sm" onclick="deselectAllWorkers()">전체 해제</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="workerSelectionGrid" class="tbm-worker-select-grid"></div>
|
||||
<div style="margin-top: 1.5rem;">
|
||||
<h3 class="tbm-form-section-title">선택된 팀원 <span id="selectedCount" style="color: #3b82f6;">0</span>명</h3>
|
||||
<div id="selectedWorkersList" style="display: flex; flex-wrap: wrap; gap: 0.5rem; min-height: 50px; padding: 0.75rem; background: #f8fafc; border-radius: 10px; border: 1px solid #e2e8f0;">
|
||||
<p style="margin: 0; color: #94a3b8; font-size: 0.875rem;">작업자를 선택해주세요</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeTeamModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="saveTeamComposition()"><span class="tbm-btn-icon">✓</span> 팀 구성 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 안전 체크리스트 모달 -->
|
||||
<div id="safetyModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 700px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>🛡</span> 안전 체크리스트</h2>
|
||||
<button class="tbm-modal-close" onclick="closeSafetyModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div id="safetyChecklistContainer" class="tbm-safety-list"></div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeSafetyModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-success" onclick="saveSafetyChecklist()"><span class="tbm-btn-icon">✓</span> 안전 체크 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TBM 완료 모달 -->
|
||||
<div id="completeModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 500px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>✓</span> TBM 완료</h2>
|
||||
<button class="tbm-modal-close" onclick="closeCompleteModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div class="tbm-alert tbm-alert-warning">
|
||||
<span class="tbm-alert-icon">⚠</span>
|
||||
<div class="tbm-alert-content">
|
||||
<div class="tbm-alert-title">TBM 완료 확인</div>
|
||||
<div class="tbm-alert-text">완료 후에는 수정할 수 없습니다.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-group" style="margin-top: 1.5rem;">
|
||||
<label class="tbm-form-label">종료 시간</label>
|
||||
<input type="time" id="endTime" class="tbm-form-input">
|
||||
</div>
|
||||
<div class="tbm-form-group" style="margin-top: 1rem;">
|
||||
<label class="tbm-form-label">작업자 근태</label>
|
||||
<div id="completeAttendanceList" style="max-height: 300px; overflow-y: auto; border: 1px solid #e5e7eb; border-radius: 0.5rem; padding: 0.5rem;">
|
||||
<div style="text-align:center; color:#9ca3af; padding:1rem;">로딩 중...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeCompleteModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-success" id="completeModalBtn" onclick="completeTbmSession()"><span class="tbm-btn-icon">✓</span> 완료</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 작업 인계 모달 -->
|
||||
<div id="handoverModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 600px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>👉</span> 작업 인계</h2>
|
||||
<button class="tbm-modal-close" onclick="closeHandoverModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<form id="handoverForm">
|
||||
<input type="hidden" id="handoverSessionId">
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">인계 사유<span class="tbm-form-required">*</span></label>
|
||||
<select id="handoverReason" class="tbm-form-input" required>
|
||||
<option value="">사유 선택...</option>
|
||||
<option value="half_day">반차</option>
|
||||
<option value="early_leave">조퇴</option>
|
||||
<option value="emergency">긴급 상황</option>
|
||||
<option value="other">기타</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">인수자 (다음 팀장)<span class="tbm-form-required">*</span></label>
|
||||
<select id="toLeaderId" class="tbm-form-input" required><option value="">인수자 선택...</option></select>
|
||||
</div>
|
||||
<div class="tbm-form-row">
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">인계 날짜<span class="tbm-form-required">*</span></label>
|
||||
<input type="date" id="handoverDate" class="tbm-form-input" required>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">인계 시간</label>
|
||||
<input type="time" id="handoverTime" class="tbm-form-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label">인계 내용</label>
|
||||
<textarea id="handoverNotes" class="tbm-form-input" rows="4" placeholder="인수자에게 전달할 내용을 입력하세요" style="resize: vertical;"></textarea>
|
||||
</div>
|
||||
<div class="tbm-form-group">
|
||||
<label class="tbm-form-label" style="margin-bottom: 0.75rem;">인계할 팀원 선택</label>
|
||||
<div id="handoverTeamList" style="max-height: 200px; overflow-y: auto; border: 1px solid #e2e8f0; border-radius: 10px; padding: 0.75rem; background: #f8fafc;"></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="tbm-modal-footer">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeHandoverModal()">취소</button>
|
||||
<button type="button" class="tbm-btn tbm-btn-primary" onclick="saveHandover()"><span class="tbm-btn-icon">👉</span> 인계 요청</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TBM 상세보기 모달 -->
|
||||
<div id="detailModal" class="tbm-modal-overlay" style="display: none;">
|
||||
<div class="tbm-modal" style="max-width: 900px;">
|
||||
<div class="tbm-modal-header">
|
||||
<h2 class="tbm-modal-title"><span>📋</span> TBM 상세 정보</h2>
|
||||
<button class="tbm-modal-close" onclick="closeDetailModal()">×</button>
|
||||
</div>
|
||||
<div class="tbm-modal-body">
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title"><span>📅</span> 기본 정보</h3>
|
||||
<div id="detailBasicInfo" style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;"></div>
|
||||
</div>
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title"><span>👥</span> 팀 구성</h3>
|
||||
<div id="detailTeamMembers" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem;"></div>
|
||||
</div>
|
||||
<div class="tbm-form-section">
|
||||
<h3 class="tbm-form-section-title"><span>🛡</span> 안전 체크리스트</h3>
|
||||
<div id="detailSafetyChecks"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer" id="detailModalFooter">
|
||||
<button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeDetailModal()">닫기</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 가로모드 전체화면 지도 -->
|
||||
<div id="landscapeOverlay" class="landscape-overlay" style="display:none;">
|
||||
<div id="landscapeInner" class="landscape-inner">
|
||||
<div class="landscape-header">
|
||||
<h3>🏭 작업장 선택</h3>
|
||||
<button type="button" class="landscape-close-btn" onclick="closeLandscapeMap()">×</button>
|
||||
</div>
|
||||
<div class="landscape-canvas-wrap">
|
||||
<canvas id="landscapeCanvas"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 분할 모달 -->
|
||||
<div id="splitModal" class="tbm-modal-overlay" style="display:none;">
|
||||
<div class="tbm-modal-container" style="max-width:500px;">
|
||||
<div class="tbm-modal-header"><h2>작업 분할</h2><button type="button" class="tbm-modal-close" onclick="closeSplitModal()">×</button></div>
|
||||
<div class="tbm-modal-body">
|
||||
<p style="font-size:0.8125rem; color:#6b7280; margin-bottom:0.75rem;">작업자의 배정 시간을 분할합니다.</p>
|
||||
<div id="splitMemberList" style="display:flex; flex-direction:column; gap:0.5rem;"></div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer"><button type="button" class="tbm-btn tbm-btn-secondary" onclick="closeSplitModal()">닫기</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 빼오기 모달 -->
|
||||
<div id="pullModal" class="tbm-modal-overlay" style="display:none;">
|
||||
<div class="tbm-modal-container" style="max-width:500px;">
|
||||
<div class="tbm-modal-header"><h2>빼오기</h2><button type="button" class="tbm-modal-close" onclick="closePullModal()">×</button></div>
|
||||
<div class="tbm-modal-body">
|
||||
<p style="font-size:0.8125rem; color:#6b7280; margin-bottom:0.75rem;">다른 반장의 TBM에서 작업자를 빼옵니다.</p>
|
||||
<div id="pullSessionList"></div>
|
||||
</div>
|
||||
<div class="tbm-modal-footer"><button type="button" class="tbm-btn tbm-btn-secondary" onclick="closePullModal()">닫기</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 토스트 -->
|
||||
<div class="toast-container" id="toastContainer"></div>
|
||||
|
||||
<script src="/js/sso-relay.js?v=20260401"></script>
|
||||
<script src="/static/js/tkfb-core.js?v=2026040105"></script>
|
||||
<script src="/js/api-base.js?v=2026031602"></script>
|
||||
<script src="/js/common/utils.js?v=2026031602"></script>
|
||||
<script src="/js/common/base-state.js?v=2026031602"></script>
|
||||
<script src="/js/tbm/state.js?v=2026031602"></script>
|
||||
<script src="/js/tbm/utils.js?v=2026031602"></script>
|
||||
<script src="/js/tbm/api.js?v=2026031602"></script>
|
||||
<script defer src="/js/tbm.js?v=2026031604"></script>
|
||||
<script>initAuth();</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user