geoinfo_admin/src/main/webapp/WEB-INF/views/admins/constructionProjectManagement/construction-user-detail.jsp

586 lines
26 KiB
Plaintext
Raw Normal View History

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="${pageContext.request.contextPath}/js/jquery/jquery-1.10.2.min.js"></script>
<script src="${pageContext.request.contextPath}/js/admins/common.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" HREF="${pageContext.request.contextPath}/css/admins/style.css" type="text/css">
<script>
const userId = "${params.userid}"
function backBtn() {
window.history.back();
// location.href = "${pageContext.request.contextPath}/admins/constructionProjectManagement/construction-user-mgmt-index.do";
}
function onClickBtnSearch() {
const pagingEle = document.getElementById('paging');
const activeLinks = pagingEle.querySelectorAll('li.is-active a');
const constTag = trim( document.getElementById('const-tag').value );
const constName = trim( document.getElementById('const-name').value );
const constStartDate = trim( document.getElementById('const-start-date').value );
const constEndDate = trim( document.getElementById('const-end-date').value );
const constStateCode = trim( document.getElementById('const-state-code').value );
const constCompanyName = trim( document.getElementById('company-dept').value );
const constCompanyAdmin = trim( document.getElementById('company-admin').value );
const constCompanyTel = trim( document.getElementById('company-tel').value );
const nCount = Number(pagingEle.getAttribute('data-ncount'));
const nPage = Number(pagingEle.getAttribute('data-npage'));
xhr = new XMLHttpRequest();
xhr.open('GET', '/drilling/inquiry/list.do?' +
'constTag='+ constTag +
'&' +'constName='+ constName +
'&' +'constStartDate='+ constStartDate +
'&' +'constEndDate='+ constEndDate +
'&' +'constStateCode='+ constStateCode +
'&' +'constCompanyName='+ constCompanyName +
'&' +'constCompanyAdmin='+ constCompanyAdmin +
'&' +'constCompanyTel='+ constCompanyTel +
'&' +'userId='+ userId +
'&' +'nPage='+ nPage +
'&' +'nCount='+ nCount,
true);
xhr.setRequestHeader('Content-type', 'application/json');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 요청 성공 시 처리
console.log('%o', xhr.responseText);
const obj = JSON.parse(xhr.responseText);
var dataListEle = document.getElementById('data-list');
dataListEle.innerHTML = '';
var content = '';
if (obj.datas.length < 1) {
content = '<tr><td colspan="11">조회된 건설현장이 없습니다.</td></tr>';
}
for( idx in obj.datas ) {
const constStartDate = obj.datas[idx].constStartDate == null ? '알 수 없음' : obj.datas[idx].constStartDate;
const constEndDate = obj.datas[idx].constEndDate == null ? '알 수 없음' : obj.datas[idx].constEndDate;
const masterCompanyDept = obj.datas[idx].masterCompanyDept == null ? '-' : obj.datas[idx].masterCompanyDept;
const masterCompanyAdmin = obj.datas[idx].masterCompanyAdmin == null ? '-' : obj.datas[idx].masterCompanyAdmin;
const masterCompanyTel = obj.datas[idx].masterCompanyTel == null ? '-' : obj.datas[idx].masterCompanyTel;
const coinstCompanyDept = obj.datas[idx].coinstCompanyDept == null ? '-' : obj.datas[idx].coinstCompanyDept;
const constCompanyAdmin = obj.datas[idx].constCompanyAdmin == null ? '-' : obj.datas[idx].constCompanyAdmin;
const constCompanyTel = obj.datas[idx].constCompanyTel == null ? '-' : obj.datas[idx].constCompanyTel;
// content += '<tr onclick="location.href=\'modify.do?CID=' + obj.datas[idx].cid + '\';" data-cid="' + obj.datas[idx].cid + '">';
content += '<tr <%--onmousedown="handleMouseDown()" onmousemove="handleMouseMove()" --%> onmouseup="handleRowClick(' + obj.datas[idx].cid + ')" data-cid="' + obj.datas[idx].cid + '">';
content += '<td>' + (obj.count - idx - (nCount * (nPage - 1))) + '</td>';
content += '<td style="text-align: left; text-indent: 10px;">' + obj.datas[idx].constName + '</td>';
content += '<td>' + obj.datas[idx].projectStateCodeName + '</td>';
content += '<td>' + constStartDate + ' ~ ' + constEndDate + '</td>';
content += '<td>' + obj.datas[idx].constStateCodeName + '</td>';
content += '<td>' + masterCompanyDept + '</td>';
content += '<td>' + masterCompanyAdmin + '</td>';
content += '<td>' + masterCompanyTel + '</td>';
content += '<td>' + coinstCompanyDept + '</td>';
content += '<td>' + constCompanyAdmin + '</td>';
content += '<td>' + constCompanyTel + '</td>';
content += '</tr>';
}
dataListEle.innerHTML = content;
document.getElementById('count').innerHTML = obj.count;
let firstIndicator = (Math.floor((nPage - 1) / nCount) * nCount) + 1; // 현재 페이지의 첫번째 페이지인디케이터 번호
let lastIndicator = Math.ceil(nPage / nCount) * 10; // 현재 페이지의 마지막 페이지인디케이터 번호
let totalIndicator = Math.ceil(obj.count / nCount); // 총 페이지인디케이터 번호
let pagingEleHTML = "<ul>"
if (!((firstIndicator - 1) < 1)) {
pagingEleHTML = pagingEleHTML + '<li data-npage="' + (firstIndicator - 1) + '" class="page-button"><a href="javascript:void()"><img src="/com/img/common/icon/ico_chevron.svg" alt="Chevron-prev" class="page-prev"></a></li>';
}
for( let i = firstIndicator; i<lastIndicator+1; i++ ) {
if (i <= totalIndicator) {
if( i === nPage ) {
pagingEleHTML += `<li data-npage="` + i + `" class="page-button is-active"><a href="javascript:void()">` + i + `</a></li>`;
} else {
pagingEleHTML += `<li data-npage="` + i + `" class="page-button" ><a href="javascript:void()">` + i + `</a></li>`;
}
}
}
if (lastIndicator < totalIndicator) {
pagingEleHTML += `<li data-npage="` + (lastIndicator+1) +`" class="page-button"><a href="javascript:void()"><img src="/com/img/common/icon/ico_chevron.svg" alt="Chevron-next" class="page-next"></a></li>`;
}
pagingEleHTML += "</ul>";
pagingEle.innerHTML = pagingEleHTML;
// 모든 .page-button 요소 가져오기
const pageButtons = document.querySelectorAll('.page-button');
// 각 버튼에 클릭 이벤트 리스너 추가
pageButtons.forEach(button => {
button.addEventListener('click', () => {
// 클릭된 버튼의 내용 (페이지 번호 등) 가져오기
const pageNumber = button.getAttribute('data-npage');
// 페이지 이동 등 원하는 동작 수행
console.log(`페이지 ` + pageNumber + `로 이동합니다.`);
pagingEle.setAttribute('data-npage', pageNumber);
onClickBtnSearch()
});
});
} else if (xhr.readyState === 4) {
// 요청 실패 시 처리
console.error('요청 실패:', xhr.status);
}
};
xhr.send();
}
function onClickBtnViewOnMap() {
alert('위치가 지정된 시추공이 존재하지 않습니다.');
}
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('btn-search').addEventListener('click', function() {
const pagingEle = document.getElementById('paging');
pagingEle.setAttribute('data-npage', 1);
// onClickBtnSearch();
});
document.getElementById('btn-view-on-map').addEventListener('click', function() {
onClickBtnViewOnMap();
});
//발주기관 프로젝트목록 가져오기
onClickBtnSearch();
// 초기 테이블 추가 트리거
document.getElementById('btn-search').click();
document.getElementById('const-name').addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
event.preventDefault(); // 폼 제출 방지
document.getElementById('btn-search').click();
}
});
document.getElementById('company-dept').addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
event.preventDefault(); // 폼 제출 방지
document.getElementById('btn-search').click();
}
});
document.getElementById('company-admin').addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
event.preventDefault(); // 폼 제출 방지
document.getElementById('btn-search').click();
}
});
document.getElementById('company-tel').addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
event.preventDefault(); // 폼 제출 방지
document.getElementById('btn-search').click();
}
});
var projectNameInput = document.getElementById('const-name');
var suggestionListDiv = document.getElementById("suggestionList");
projectNameInput.onkeyup = function() {
var projectName = String(this.value).trim();
if (projectName.length > 0) {
$.ajax({
type : "GET",
data : {
projectName : projectName,
isProjectNameChecking : "true"
},
url : "/drilling-project-list.json",
dataType : "json",
success : function( json ) {
suggestionListDiv.innerHTML = ""; // 이전 목록 비우기
suggestionListDiv.style.display = "none";
var list = json.result.list;
var matchingProjects = [];
for (var i = 0; i < list.length; i++) {
matchingProjects.push(list[i]);
}
if (matchingProjects.length > 0) {
for (var i = 0; i < matchingProjects.length; i++) {
var suggestionItem = document.createElement("div");
var organHierarchy = " " + matchingProjects[i].glDistrict !== null ? matchingProjects[i].glDistrict : "";
if( matchingProjects[i].gmDistrict !== null ) {
organHierarchy = organHierarchy + " &gt; " + matchingProjects[i].gmDistrict;
}
if( matchingProjects[i].gsDistrict !== null ) {
organHierarchy = organHierarchy + " &gt; " + matchingProjects[i].gsDistrict;
}
suggestionItem.setAttribute('data-const-name', matchingProjects[i].constName);
suggestionItem.setAttribute('data-cid', matchingProjects[i].cid);
// 검색어를 굵게 표시
              var constName = matchingProjects[i].constName;
              var projectName = String(projectNameInput.value).trim();
              // 정규식으로 검색어를 찾고, 대소문자 구분 없이 처리
              var regex = new RegExp(projectName, "gi");
              var boldConstName = constName.replace(regex, '<b>' + projectName + '</b>');
suggestionItem.innerHTML = 
              '<span>' + boldConstName + '</span><br />\n' +
              '<span class="organizational-structure" data->' +
              "발주처: " + organHierarchy
              '</span>';
suggestionItem.onclick = function() {
projectNameInput.value = this.getAttribute('data-const-name');
suggestionListDiv.style.display = "none";
};
suggestionListDiv.appendChild(suggestionItem);
}
// suggestionListDiv 위치 설정
var rect = projectNameInput.getBoundingClientRect();
suggestionListDiv.style.position = 'absolute';
//suggestionListDiv.style.left = rect.left + 'px';
//suggestionListDiv.style.top = (rect.bottom + window.scrollY) + 'px';
//suggestionListDiv.style.float = 'left';
suggestionListDiv.style.width = rect.width + 'px';
suggestionListDiv.style.display = "block";
}
},
error: function(xhr, option, error){
alert(xhr.status); //오류코드
alert(error); //오류내용
}
});
}
};
// 사용자가 추천 목록 외부를 클릭하면 목록 숨기기 (선택적)
document.onclick = function(event) {
if (event.target !== projectNameInput && event.target !== suggestionListDiv && !suggestionListDiv.contains(event.target)) {
suggestionListDiv.style.display = "none";
}
};
});
/**
* 발주기관 목록화면 tr 드래그 시 상세화면 이동 방지처리
* 드래그 이벤트와 클릭이벤트를 구분하여 감지한다.
*/
function handleRowClick(CID) {
if (!isDragging) {
window.location.href = 'modify.do?CID=' + CID;
}
}
function trim(str) {
str = String(str);
return str.replace(/^\s+|\s+$/g, '');
}
</script><style>
.drilling .page-content-inner {
padding: 30px 0;
}
li {
list-style: none;
}
@keyframes shake {
0% { transform: translateX(0); }
10% { transform: translateX(-5px); }
20% { transform: translateX(5px); }
30% { transform: translateX(-5px); }
40% { transform: translateX(5px); }
50% { transform: translateX(-5px); }
60% { transform: translateX(5px); }
70% { transform: translateX(-5px); }
80% { transform: translateX(5px); }
90% { transform: translateX(-5px); }
100% { transform: translateX(0); }
}
.shake-animation {
animation: shake 0.6s;
}
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
visibility: hidden; /* Hidden by default. Visible on click */
min-width: 250px; /* Set a default minimum width */
margin-left: -125px; /* Divide value of min-width by 2 */
background-color: #000000; /* Black background color */
color: #ff0000; /* White text color */
text-align: center; /* Centered text */
border-radius: 2px; /* Rounded borders */
padding: 16px; /* Padding */
position: fixed; /* Sit on top of the screen */
z-index: 1; /* Add a z-index if needed */
left: 50%; /* Center the snackbar */
bottom: 80px; /* 30px from the bottom */
font-weight: 500;
}
/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
visibility: visible; /* Show the snackbar */
/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
However, delay the fade out process for 2.5 seconds */
-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
animation: fadein 0.5s, fadeout 0.5s 2.5s;
}
/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 80px; opacity: 1;}
}
@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 80px; opacity: 1;}
}
@-webkit-keyframes fadeout {
from {bottom: 80px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}
@keyframes fadeout {
from {bottom: 80px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}
#suggestionList {
border: 1px solid #ccc;
width: 300px; /* 입력창 너비에 맞춰 조절 */
position_: absolute;
background-color: white;
display: none;
left: 91px;
top: 54px;
z-index: 3;
}
#suggestionList div {
padding: 5px;
cursor: pointer;
}
#suggestionList div:hover {
background-color: #f0f0f0;
}
#suggestionList div .organizational-structure {
color: red;
}
#const-state-code {
width: 160px;
}
</style>
</head>
<body>
<form id="searchForm" name="searchForm" method="post">
<input type="hidden" id="pageIndex" name="pageIndex" value="${params.pageIndex}" />
<input type="hidden" id="cls" name="cls" value="2" />
<table id="Table_Main" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan=2><div style="background: #fff; border-radius: 12px; padding: 5px 10px;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);"><h3>> 건설현장 조회 ${ params.userid }</h3></div></td>
</tr>
<tr height=20 colspan=2><td class=btn_group><a href="javascript:void(0)" class="btn btn-sm btn-success" onclick="javascript:backBtn();">뒤로</a></td></tr>
<%-- <tr height=25>
<!-- START : 엑셀 다운로드 ------------------------------------------------------------------------->
<td>
<img src="${pageContext.request.contextPath}/images/admins/excel.gif" style="cursor:hand" onClick="javascript:excelDownload()"></td>
<!-- END : 엑셀 다운로드 ------------------------------------------------------------------------->
<!-- START : 검색 ---------------------------------------------------------------------------------->
<td align="right" class="search">
<select id="searchTitle" name="searchTitle">
<option value="0" selected>전체</option>
<option value="2">아이디</option>
<option value="1">이름</option>
<option value="4">회사명</option>
<option value="3">업종</option>
<option value="6">사업자등록번호</option>
<option value="5">이메일</option>
<option value="7">가입기간</option>
</select>
<input type="text" class="search" id="searchValue" name="searchValue" value="${params.searchValue}" />
<input type="image" src="${pageContext.request.contextPath}/images/admins/search.gif" align="absmiddle">
</td>
<!-- END : 검색 ---------------------------------------------------------------------------------->
</tr>--%>
<%-- <tr height=12><td colspan=2><img src="${pageContext.request.contextPath}/images/admins/spacer.gif" width="1" height="12"></td></tr>
<tr>
<td colspan=2>
<tbody>
<table id="Table_List" width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#D6D6D6">
<!-- START : list head ----------------------------------------------------------------------------->
<tr height=28 bgcolor="#FBF4E4" class="list_head" align="center">
<td width="4%">번호</td>
<td width="12%">아이디</td>
<td width="8%">이름</td>
<td width="13%">소속</td>
<td width="13%">로그인일시</td>
<td width="8%">로그인여부</td>
</tr>
<!-- END : list head ----------------------------------------------------------------------------->
<!-- REPEAT TABLE -->
<c:forEach items="${resultList}" var="resultList" varStatus="status">
<tr height=28 bgcolor="#FFFFFF" class="list_content" align="center">
<td>${resultList.num}</td>
<td>${resultList.userid}</td>
<td>${resultList.userName}</td>
<td>${resultList.companyName}</td>
<td><fmt:formatDate value="${resultList.datetime}" pattern="yyyy-MM-dd HH:mm:ss" /></td>
<td>${resultList.note}</td>
</tr>
</c:forEach>
<!-- END OF REPEAT TABLE -->
</table>
</tbody>
</td>
</tr>--%>
<%-- <tr height=42> --%>
<!-- START : 네비게이션 ---------------------------------------------------------------------------->
<!-- <td align=center class="navi" colspan='2'> -->
<!-- <table width=100% > -->
<!-- <tr align="center"> -->
<!-- <td> -->
<!-- REPEAT LINK -->
<%-- <ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage"/> --%>
<!-- END OF REPEAT LINK -->
<!-- </td> -->
<!-- </tr> -->
<!-- </table> -->
<!-- </td> -->
<!-- END : 네비게이션 ---------------------------------------------------------------------------->
<%-- </tr> --%>
</table><!-- 페이지 컨테이너 시작 -->
<section class="drilling-page-container">
<input id="PROJECT_NAME" name="PROJECT_NAME" maxlength="2000" type="hidden" value="" valid="notnull" validNm="사업명" />
<div class="page-content-wrapper drilling inquiry">
<!-- 콘텐츠 시작 -->
<div class="page-content">
<div class="page-content-inner">
<!-- 카테고리 끝 -->
<!-- 내용 시작 -->
<div class="content-wrapper">
<div class="content1">
<div class="page-top-search" style="display: none">
<form class="form-inline">
<label class="input-label-display">검색</label>
<input type="hidden" id="const-tag" name="const-tag" value="C" >
<input type="search" id="const-name" name="const-name" class="input" placeholder="프로젝트명" title="" value="">
<div id="suggestionList"></div>
<input type="date" id="const-start-date" name="const-start-date" >
<span>~</span>
<input type="date" id="const-end-date" name="const-end-date" >
<input type="hidden" >
<select id="const-state-code" name="const-state-code">
<option value="" selected="selected">전체</option>
<option value="1">미입력</option>
<option value="2">입력 중</option>
<option value="3">검수 준비 대기중</option>
<option value="4">검수 중</option>
<option value="6">수정 요청</option>
<option value="7">등록 완료</option>
</select>
</form>
<form class="form-inline-row">
<input type="text" id="company-dept" name="company-dept" class="input input-1" placeholder="담당부서,건설사명" title="" value="">
<input type="text" id="company-admin" name="company-admin" class="input input-2" placeholder="담당자" title="" value="">
<input type="text" id="company-tel" name="company-tel" class="input input-3" placeholder="담당 연락처" title="" value="">
<button type="button" id="btn-search" class="btn btn-search">
<span>조회하기</span>
</button>
<button type="button" id="btn-view-on-map" class="btn btn-view-on-map">
<span>지도보기</span>
</button>
</form>
</div>
<div class="table-info-group">Total: <span id="count">-</span>건</div>
<div class="table-wrap">
<table>
<colgroup>
<col style="width: 3%;">
<col style="width: 27%;">
<col style="width: 5%;">
<col style="width: 10%;">
<col style="width: 10%;">
<col style="width: 13%;">
<col style="width: 5%;">
<col style="width: 7%;">
<col style="width: 8%;">
<col style="width: 5%;">
<col style="width: 7%;">
</colgroup>
<thead>
<tr>
<th rowspan="2">연번</th>
<th rowspan="2">사업명</th>
<th rowspan="2">입력상태</th>
<th colspan="2">사업내용</th>
<th colspan="3">발주기관현황</th>
<th colspan="3">건설사현황</th>
</tr>
<tr>
<th>사업기간</th>
<th>사업단계 <br>(설계 시공 준공 유지관리)</th>
<th>담당부서</th>
<th>담당자</th>
<th>담당연락처</th>
<th>건설사명</th>
<th>담당자</th>
<th>담당연락처</th>
</tr>
</thead>
<tbody id="data-list">
</tbody>
</table>
</div>
<div id="paging" class="paging" data-npage="1" data-ncount="10">
</div>
</div>
</div>
<!-- 내용 끝 -->
</div>
</div>
<!-- 콘텐츠 끝 -->
</div>
</section>
<!-- 페이지 컨테이너 끝 -->
</form>
</body>
</html>