cjm
/
clean-parking
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat : 개별 총 정보 화면작업중

Browse Source
pull/2/head
Kurt92 3 months ago
parent b25dc91d3a
commit 86fbbcf446
7 changed files with 1577 additions and 3 deletions
Show Stats Download Patch File Download Diff File

1
src/main/webapp/WEB-INF/views/biz/minwon/init/sample.jsp
Unescape Escape View File

@ -2,7 +2,6 @@
<div class="main_body">
</div>
<!-- /Main body -->
<script type="text/javascript">

198
src/main/webapp/WEB-INF/views/biz/totalInfo/totalInfo_popup.jsp
Unescape Escape View File

@ -6,11 +6,204 @@
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">--%>
<div class="main_body">
요거슨 개별 총 정보
<div id="tabs" class="main_body">
<ul>
<li><a href="#tabs-a">위반정보</a></li>
<li><a href="#tabs-b">의견진술</a></li>
<li><a href="#tabs-c">세부내역</a></li>
<li><a href="#tabs-d">부과이후</a></li>
<li><a href="#tabs-e">민원내역</a></li>
</ul>
<div id="tabs-a">
<div class="detail-card">
<div class="card-header">
<div class="title">개별 총정보</div>
<div class="actions">
<span class="pill">Double Click 민원원본보기</span>
<button type="button" class="close-btn">닫기 Esc</button>
</div>
</div>
<!-- 상단 네비/페이지 인디케이터 -->
<div class="card-toolbar">
<div class="page-indicator"><span id="pageNow">2</span> of <span id="pageTotal">4</span></div>
<div class="nav-group">
<button type="button" class="nav-btn" data-act="first">◀◀</button>
<button type="button" class="nav-btn" data-act="prev">◀</button>
<button type="button" class="nav-btn" data-act="next">▶</button>
<button type="button" class="nav-btn" data-act="last">▶▶</button>
</div>
</div>
<div class="detail-body">
<!-- 좌측 정보 -->
<div class="left">
<div class="section-title">위반 정보</div>
<div class="subnote">등록구분/위반일시/위반내역 등</div>
<div class="form-grid">
<div class="lbl">등록구분</div>
<div class="fld"><input type="text" value="자동등록" readonly></div>
<div class="lbl">자료출처</div>
<div class="fld"><input type="text" value="생활불편" readonly></div>
<div class="lbl">위반일시</div>
<div class="fld"><input type="text" value="2025-06-04 20:01" readonly></div>
<div class="lbl">위반명</div>
<div class="fld"><input type="text" value="주차위반" readonly></div>
<div class="lbl">신고자</div>
<div class="fld"><input type="text" value="손관기" readonly></div>
<div class="lbl">연락처</div>
<div class="fld"><input type="text" value="01096686113" readonly></div>
<div class="lbl">담당자</div>
<div class="fld"><input type="text" value="부선영" readonly></div>
<div class="lbl">공개여부</div>
<div class="fld">
<input type="text" value="미공개" readonly>
</div>
<div class="lbl">신고내용</div>
<div class="fld block">
<textarea readonly>[예시] …신고 내용이 여기에 표시됩니다…</textarea>
</div>
<div class="lbl">위반장소</div>
<div class="fld"><input type="text" value="대장동 592" readonly></div>
<div class="lbl">접수번호</div>
<div class="fld"><input type="text" value="1AA-2506-0104234" readonly></div>
<div class="lbl">접수일자</div>
<div class="fld"><input type="text" value="2025-06-04" readonly></div>
<div class="lbl">목록번호</div>
<div class="fld"><input type="text" value="0159002" readonly></div>
<div class="lbl">법정동</div>
<div class="fld"><input type="text" value="대장동" readonly></div>
<div></div><div></div>
<div class="lbl">사진등록금액</div>
<div class="fld"><input type="text" value="80,000" readonly></div>
<div class="lbl">부과금액</div>
<div class="fld"><input type="text" value="100,000" readonly></div>
<div class="lbl">감액금액</div>
<div class="fld"><input type="text" value="" readonly></div>
<div class="lbl">총수납액</div>
<div class="fld"><input type="text" value="" readonly></div>
<div class="lbl">잔액</div>
<div class="fld"><input class="hl" type="text" value="80,000" readonly></div>
<div class="lbl">특기사항</div>
<div class="fld">
<button type="button" class="btn btn-light" id="btnSpecial">특기사항 보기</button>
</div>
<div class="block bar"></div>
<div class="lbl">처리상태일시</div>
<div class="fld"><input type="text" value="2025-07-29 09:05" readonly></div>
<div class="lbl">처리상태</div>
<div class="fld"><input class="hl" type="text" value="차적조회완료" readonly></div>
<div class="lbl">차량명</div>
<div class="fld"><input type="text" value="쎄토스71" readonly></div>
<div class="lbl">차량색상</div>
<div class="fld"><input type="text" value="차량색상" readonly></div>
<div class="lbl">연료구분</div>
<div class="fld"><input type="text" value="" readonly></div>
<div></div><div></div>
<div class="block bar"></div>
<div class="section-title block">소유주 정보</div>
<div class="lbl">소유주</div>
<div class="fld"><input type="text" value="고선묵66" readonly></div>
<div class="lbl">등록구분</div>
<div class="fld"><input type="text" value="" readonly></div>
<div class="lbl">주민번호</div>
<div class="fld"><input type="text" value="******-*******" readonly></div>
<div class="lbl">우편번호</div>
<div class="fld"><input type="text" value="17613" readonly></div>
<div class="lbl">주소</div>
<div class="fld block"><input type="text" value="경기도 안성시 공도읍 마장공단3길 43, 201호66" readonly></div>
<div class="lbl">번지</div>
<div class="fld"><input type="text" value="" readonly></div>
<div class="lbl">차대번호</div>
<div class="fld"><input type="text" value="KLAYA75ADEK598855" readonly></div>
<div class="lbl">도로코드</div>
<div class="fld"><input type="text" value="" readonly></div>
<div></div><div></div>
</div>
</div>
<!-- 우측 사진/지도/프리뷰 -->
<div class="right">
<div class="section-title">사진</div>
<div class="thumbs" id="photoThumbs">
<div class="thumb" data-src="${pageContext.request.contextPath}/static/img/sample-1.jpg">
<img src="${pageContext.request.contextPath}/static/img/sample-1.jpg" alt="사진 1">
</div>
<div class="thumb" data-src="${pageContext.request.contextPath}/static/img/sample-2.jpg">
<img src="${pageContext.request.contextPath}/static/img/sample-2.jpg" alt="사진 2">
</div>
<div class="thumb" data-src="${pageContext.request.contextPath}/static/img/sample-map.jpg">
<img src="${pageContext.request.contextPath}/static/img/sample-map.jpg" alt="지도 썸네일">
</div>
</div>
<div class="mapbox">
<img src="${pageContext.request.contextPath}/static/img/sample-map.jpg" alt="지도">
</div>
<div class="preview" id="photoPreviewBox">
<img id="photoPreview" src="${pageContext.request.contextPath}/static/img/sample-1.jpg" alt="미리보기">
</div>
</div>
</div>
<div class="statusbar">
<div class="status-left">2025-00000037</div>
<div class="status-right">
<span><span class="count-dot" id="photoCount">3</span> 사진</span>
<label><input type="checkbox" id="hidePhoto"> 사진 안보이기</label>
</div>
</div>
</div>
</div>
<div id="tabs-b">
의견진술
</div>
<div id="tabs-c">
세부내역
</div>
<div id="tabs-d">
부과이후
</div>
<div id="tabs-e">
민원내역
</div>
</div>
</div>
<!-- /Main body -->
<%--<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>--%>
<%--<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>--%>
<script type="text/javascript">
const fnBiz = {
@ -42,7 +235,10 @@
$(function () {
$("#tabs").tabs();
fnBiz.init();
});

2
src/main/webapp/WEB-INF/views/layouts/popup/default.jsp
Unescape Escape View File

@ -40,10 +40,12 @@
<!-- options: blue,cyan,dark,gray,green,pink,purple,red,royal,ash,crimson,namn,frost -->
<link rel="stylesheet" href="<c:url value='/css/bootstrap-datepicker.min.css' />">
<link rel="stylesheet" href="<c:url value='/css/style_new.css' />">
<link rel="stylesheet" href="<c:url value='/css/jquery-ui.css' />">
<%--================== Main Scripts ======================--%>
<script type="text/javascript" src="<c:url value='/js/jquery.min.js' />"></script>
<script type="text/javascript" src="<c:url value='/js/jquery-ui.min.js' />"></script>
<script type="text/javascript" src="<c:url value='/js/bootstrap.bundle.min.js' />"></script>
<script type="text/javascript" src="<c:url value='/js/bootstrap-datepicker.min.js' />"></script>
<!-- Plugins -->

1315
src/main/webapp/resources/css/jquery-ui.css vendored
View File

File diff suppressed because it is too large Load Diff

7
src/main/webapp/resources/js/jquery-ui.min.css vendored
View File

File diff suppressed because one or more lines are too long

6
src/main/webapp/resources/js/jquery-ui.min.js vendored
View File

File diff suppressed because one or more lines are too long

51
src/main/webapp/resources/xit/xit-popup.css
Unescape Escape View File

@ -244,4 +244,53 @@
margin: 8px 0;
font-size: 13px;
line-height: 1.4;
}
}
:root{
--green:#8bc34a; --border:#d9d9d9; --muted:#6b7280; --text:#111827;
--panel:#f7f7f7; --focus:rgba(37,99,235,.35); --warn:#fff3cd; --ok:#10b981;
}
/* 카드/헤더 */
.detail-card{border:1px solid var(--border); border-radius:10px; overflow:hidden; background:#fff;}
.detail-card .card-header{display:flex; justify-content:space-between; align-items:center; background:var(--green); color:#fff; padding:10px 12px;}
.card-header .title{font-weight:700}
.card-header .actions{display:flex; gap:6px; align-items:center}
.pill{font-size:12px; background:rgba(255,255,255,.25); padding:3px 8px; border-radius:999px}
.btn,.nav-btn,.close-btn{border:1px solid rgba(0,0,0,.15); background:#fff; color:#333; padding:3px 8px; border-radius:6px; cursor:pointer; font-size:12px}
.btn:focus,.nav-btn:focus,.close-btn:focus{outline:none; box-shadow:0 0 0 3px var(--focus)}
/* 본문 레이아웃 */
.detail-body{display:grid; grid-template-columns: 3fr 1fr; gap:16px; padding:16px; background:var(--panel)}
.left,.right{background:#fff; border:1px solid var(--border); border-radius:8px; padding:12px}
.section-title{font-weight:700; margin-bottom:8px}
.subnote{font-size:12px; color:#888; text-align:right; margin-top:-4px; margin-bottom:8px}
/* 폼 그리드 */
.form-grid{display:grid; grid-template-columns: 110px 1fr 110px 1fr; gap:8px 10px}
.lbl{align-self:center; color:#444; font-size:13px}
.fld input,.fld textarea,.fld select{width:100%; padding:6px 8px; border:1px solid var(--border); border-radius:6px; font-size:13px; background:#fff}
.fld input[readonly],.fld textarea[readonly]{background:#fafafa}
.fld textarea{height:80px; resize:vertical}
.badge{display:inline-block; background:#eef2ff; color:#1d4ed8; border:1px solid #c7d2fe; padding:3px 8px; border-radius:999px; font-size:12px}
.hl{background:var(--warn)}
.block{grid-column: 1 / -1}
.bar{height:1px; background:var(--border); margin:8px 0}
/* 우측 썸네일/지도/미리보기 */
.right .thumbs{display:flex; flex-direction:column; gap:8px; max-height:260px; overflow:auto; margin-bottom:10px}
.thumb{border:1px solid var(--border); border-radius:6px; overflow:hidden; cursor:pointer}
.thumb img{display:block; width:100%; height:auto}
.mapbox{border:1px solid var(--border); border-radius:6px; overflow:hidden; margin-top:8px}
.mapbox img{display:block; width:100%; height:auto}
.preview{border:1px dashed var(--border); border-radius:6px; height:220px; display:flex; align-items:center; justify-content:center; margin-top:10px; background:#fafafa}
.preview img{max-width:100%; max-height:100%; display:block}
/* 하단 상태바 */
.statusbar{display:flex; align-items:center; justify-content:space-between; padding:8px 12px; border-top:1px solid var(--border); background:#fff}
.status-left{color:#0a7f2e; font-weight:700}
.status-right{display:flex; gap:14px; align-items:center; color:#333}
.count-dot{display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:999px; background:var(--ok); color:#fff; font-size:12px}

Write Preview
Loading…
Cancel
Save