180 lines
9.8 KiB
HTML
180 lines
9.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>문의사항 관리 - Project Master</title>
|
|
<link rel="stylesheet" as="style" crossorigin
|
|
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css" />
|
|
<link rel="stylesheet" href="style/common.css">
|
|
<link rel="stylesheet" href="style/dashboard.css">
|
|
<link rel="stylesheet" href="style/inquiries.css">
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="topbar">
|
|
<div class="topbar-header">
|
|
<a href="/">
|
|
<h2>Project Master Test</h2>
|
|
</a>
|
|
</div>
|
|
<ul class="nav-list">
|
|
<li class="nav-item" onclick="location.href='/dashboard'">대시보드</li>
|
|
<li class="nav-item active" onclick="location.href='/inquiries'">문의사항</li>
|
|
<li class="nav-item" onclick="alert('준비 중입니다.')">로그관리</li>
|
|
<li class="nav-item" onclick="alert('준비 중입니다.')">파일관리</li>
|
|
<li class="nav-item" onclick="alert('준비 중입니다.')">인원관리</li>
|
|
<li class="nav-item" onclick="alert('준비 중입니다.')">공지사항</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<main class="inquiry-board">
|
|
<div id="stickyHeader" class="board-sticky-header">
|
|
<div class="board-header">
|
|
<div>
|
|
<h2>문의사항</h2>
|
|
<p style="font-size: 13px; color: #666; margin-top: 4px;">시스템 운영 관련 불편사항 및 개선 요청 관리</p>
|
|
</div>
|
|
<div class="header-stats" id="headerStats">
|
|
<div class="stat-item total">
|
|
<span class="stat-label">전체</span>
|
|
<span class="stat-value" id="countTotal">0</span>
|
|
</div>
|
|
<div class="stat-item complete">
|
|
<span class="stat-label">완료</span>
|
|
<span class="stat-value" id="countComplete">0</span>
|
|
</div>
|
|
<div class="stat-item working">
|
|
<span class="stat-label">작업 중</span>
|
|
<span class="stat-value" id="countWorking">0</span>
|
|
</div>
|
|
<div class="stat-item checking">
|
|
<span class="stat-label">확인 중</span>
|
|
<span class="stat-value" id="countChecking">0</span>
|
|
</div>
|
|
<div class="stat-item pending">
|
|
<span class="stat-label">개발예정</span>
|
|
<span class="stat-value" id="countPending">0</span>
|
|
</div>
|
|
<div class="stat-item unconfirmed">
|
|
<span class="stat-label">미확인</span>
|
|
<span class="stat-value" id="countUnconfirmed">0</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 시트 상단 공지 영역 재현 (통합 박스) -->
|
|
<div class="notice-container">
|
|
<div style="margin-bottom: 12px; display: flex; gap: 20px;">
|
|
<div style="flex: 1;">
|
|
<h4
|
|
style="color: #d32f2f; margin-bottom: 5px; font-size: 14px; display: flex; align-items: center; gap: 6px;">
|
|
<span style="font-size: 16px;">📢</span> <공지>
|
|
</h4>
|
|
<ul style="font-size: 12px; line-height: 1.6; color: #444; padding-left: 20px; margin: 0;">
|
|
<li>파워포인트 파일에 읽기전용포함(제한)글꼴이 있는 경우 컨버팅이 되지 않습니다. 제한된 글꼴 제거 후 업로드 권장.</li>
|
|
<li>이미지는 '문의사항 이미지' 시트에 문의사항 번호와 함께 업로드 부탁드립니다.</li>
|
|
</ul>
|
|
</div>
|
|
<div style="flex: 2; border-left: 1px dashed #ddd; padding-left: 20px;">
|
|
<h4
|
|
style="color: #1976d2; margin-bottom: 5px; font-size: 14px; display: flex; align-items: center; gap: 6px;">
|
|
<span style="font-size: 16px;">📂</span> <이전 문의사항 요약>
|
|
</h4>
|
|
<div
|
|
style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px; font-size: 11px; color: #666; line-height: 1.4;">
|
|
<div><strong>1. 폴더트리:</strong> 하위폴더 권한, 숨김 기능 등 (완료)</div>
|
|
<div><strong>2. 뷰어:</strong> 변환 오류, 특정 문서 깨짐 등 (완료)</div>
|
|
<div><strong>3. 업로드/다운로드:</strong> 대용량 전송 오류 등 (완료)</div>
|
|
<div><strong>4. 기타:</strong> 정렬, 화면 개선 등 (완료)</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="filter-section">
|
|
<div class="filter-group">
|
|
<label>시스템(PM 종류)</label>
|
|
<select id="filterPmType" onchange="loadInquiries()">
|
|
<option value="">전체</option>
|
|
<option value="Overseas">Overseas</option>
|
|
<option value="기술개발센터">기술개발센터</option>
|
|
<option value="장헌">장헌</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>구분(카테고리)</label>
|
|
<select id="filterCategory" onchange="loadInquiries()">
|
|
<option value="">전체</option>
|
|
<option value="업로드">업로드</option>
|
|
<option value="다운로드">다운로드</option>
|
|
<option value="폴더트리">폴더트리</option>
|
|
<option value="뷰어">뷰어</option>
|
|
<option value="기타">기타</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>처리여부</label>
|
|
<select id="filterStatus" onchange="loadInquiries()">
|
|
<option value="">전체</option>
|
|
<option value="완료">완료</option>
|
|
<option value="작업 중">작업 중</option>
|
|
<option value="확인 중">확인 중</option>
|
|
<option value="개발예정">개발예정</option>
|
|
<option value="미확인">미확인</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>검색(내용/작성자/프로젝트)</label>
|
|
<input type="text" id="searchKeyword" placeholder="검색어 입력 후 Enter..."
|
|
onkeyup="if(event.key==='Enter') loadInquiries()" style="width: 250px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<table class="inquiry-table">
|
|
<thead>
|
|
<tr>
|
|
<th width="50">No</th>
|
|
<th width="80">이미지</th>
|
|
<th width="120">PM 종류</th>
|
|
<th width="100">환경</th>
|
|
<th width="150">구분</th>
|
|
<th>프로젝트</th>
|
|
<th width="400">문의내용</th>
|
|
<th width="400">답변내용</th>
|
|
<th width="100">작성자</th>
|
|
<th width="120">날짜</th>
|
|
<th width="100">상태</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="inquiryList">
|
|
<!-- Data will be loaded here -->
|
|
</tbody>
|
|
</table>
|
|
</main>
|
|
|
|
<!-- 이미지 크게 보기 모달 (디자인 가이드 - 화이트 계열 및 우측 하단 닫기 적용) -->
|
|
<div id="imageModal" class="modal-overlay" onclick="closeImageModal()">
|
|
<div class="modal-content" style="max-width: 960px; width: 92%; padding: 0; overflow: hidden; border-radius: 12px; border: 1px solid #e2e8f0; background: #fff;" onclick="event.stopPropagation()">
|
|
<div class="modal-header" style="padding: 16px 24px; margin-bottom: 0; border-bottom: 1px solid #f1f5f9; background: #fff;">
|
|
<h3 style="color: #1e5149; font-weight: 700; font-size: 16px;">첨부 이미지 확대 보기</h3>
|
|
<span class="modal-close" onclick="closeImageModal()" style="font-size: 24px; color: #94a3b8;">×</span>
|
|
</div>
|
|
<div style="padding: 32px; background: #fff; display: flex; justify-content: center; align-items: center; min-height: 300px; max-height: 75vh; overflow: auto;">
|
|
<img id="modalImage" style="max-width: 100%; height: auto; border-radius: 8px; box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);">
|
|
</div>
|
|
<div style="padding: 16px 24px; border-top: 1px solid #f1f5f9; text-align: right; background: #fff;">
|
|
<button class="_button-medium" style="background: #1e5149; color: #fff; border: none; padding: 10px 28px; border-radius: 8px; cursor: pointer; transition: background 0.2s;"
|
|
onmouseover="this.style.background='#163b36'" onmouseout="this.style.background='#1e5149'"
|
|
onclick="closeImageModal()">닫기</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="js/common.js"></script>
|
|
<script src="js/inquiries.js"></script>
|
|
</body>
|
|
|
|
</html> |