xit-app
/
fims-java-all
20
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

대시보드 수정

Browse Source
main
이범준 1 year ago
parent af0190adf7
commit d2e549a436
3 changed files with 41 additions and 59 deletions
Show Stats Download Patch File Download Diff File

43
src/main/webapp/WEB-INF/jsp/include/dashboard.jsp
Unescape Escape View File

@ -2,21 +2,21 @@
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%> <%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
<div class="wrapper-dashboard"> <div class="wrapper-dashboard">
<div class="card dashboard-item-2-1"> <div class="card dashboard-total">
<div class="card-body row"> <div class="card-body row">
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/10</p> <p class="mb-1">2/10</p>
<i class="svg-cctv-fixed w-px-30 d-block" title="고정형CCTV"></i> <i class="svg-cctv-fixed w-px-30 d-block" title="고정형CCTV"></i>
</div> </div>
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-crackdown-road w-px-30 d-block" title="도보단속"></i> <i class="svg-crackdown-road w-px-30 d-block" title="도보단속"></i>
</div> </div>
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-cctv-drive w-px-30 d-block" title="이동형CCTV"></i> <i class="svg-cctv-drive w-px-30 d-block" title="이동형CCTV"></i>
</div> </div>
<div class="col px-1 d-flex flex-column align-items-center"> <div class="col px-4 d-flex flex-column align-items-center">
<p class="mb-1">10/10</p> <p class="mb-1">10/10</p>
<i class="svg-crackdown-minwon w-px-30 d-block" title="민원(즉시단속)"></i> <i class="svg-crackdown-minwon w-px-30 d-block" title="민원(즉시단속)"></i>
</div> </div>
@ -26,13 +26,13 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-2-1"> <div class="card dashboard-total">
<div class="card-body row"> <div class="card-body row">
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/10</p> <p class="mb-1">2/10</p>
<i class="svg-target-lvy w-px-30 d-block" title="등록대상"></i> <i class="svg-target-lvy w-px-30 d-block" title="등록대상"></i>
</div> </div>
<div class="col px-1 d-flex flex-column align-items-center"> <div class="col px-4 d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-target-transfer w-px-30 d-block" title="이첩대상"></i> <i class="svg-target-transfer w-px-30 d-block" title="이첩대상"></i>
</div> </div>
@ -42,17 +42,17 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-2-1"> <div class="card dashboard-total">
<div class="card-body row"> <div class="card-body row">
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/10</p> <p class="mb-1">2/10</p>
<i class="svg-sendstat-guide w-px-30 d-block" title="계도장 발송현황"></i> <i class="svg-sendstat-guide w-px-30 d-block" title="계도장 발송현황"></i>
</div> </div>
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-sendstat-before w-px-30 d-block" title="사전통보 발송현황"></i> <i class="svg-sendstat-before w-px-30 d-block" title="사전통보 발송현황"></i>
</div> </div>
<div class="col px-1 d-flex flex-column align-items-center"> <div class="col px-4 d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-sendstat-nop w-px-30 d-block" title="고지서 발송현황"></i> <i class="svg-sendstat-nop w-px-30 d-block" title="고지서 발송현황"></i>
</div> </div>
@ -62,17 +62,17 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-2-1"> <div class="card dashboard-total">
<div class="card-body row"> <div class="card-body row">
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/10</p> <p class="mb-1">2/10</p>
<i class="svg-opn-rcp w-px-30 d-block" title="접수"></i> <i class="svg-opn-rcp w-px-30 d-block" title="접수"></i>
</div> </div>
<div class="col px-1 card-separator d-flex flex-column align-items-center"> <div class="col px-4 card-separator d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-opn-decision w-px-30 d-block" title="수용/미수용"></i> <i class="svg-opn-decision w-px-30 d-block" title="수용/미수용"></i>
</div> </div>
<div class="col px-1 d-flex flex-column align-items-center"> <div class="col px-4 d-flex flex-column align-items-center">
<p class="mb-1">2/3</p> <p class="mb-1">2/3</p>
<i class="svg-opn-selfdrop w-px-30 d-block" title="자진취하"></i> <i class="svg-opn-selfdrop w-px-30 d-block" title="자진취하"></i>
</div> </div>
@ -81,8 +81,9 @@
의견진술관리 바로가기 > 의견진술관리 바로가기 >
</div> </div>
</div> </div>
</div>
<div class="card dashboard-item-4-3"> <div class="wrapper-dashboard">
<div class="card dashboard-chart">
<div class="card-header d-flex align-items-center justify-content-between"> <div class="card-header d-flex align-items-center justify-content-between">
<h5 class="card-title m-0 me-2">단속 자료 통계(유형별)</h5> <h5 class="card-title m-0 me-2">단속 자료 통계(유형별)</h5>
<div>건수(최근 n일)</div> <div>건수(최근 n일)</div>
@ -95,7 +96,7 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-4-3"> <div class="card dashboard-chart">
<div class="card-header d-flex align-items-center justify-content-between"> <div class="card-header d-flex align-items-center justify-content-between">
<h5 class="card-title m-0 me-2">단속통계</h5> <h5 class="card-title m-0 me-2">단속통계</h5>
<div>처리유형별(일별)</div> <div>처리유형별(일별)</div>
@ -108,7 +109,7 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-4-3"> <div class="card dashboard-chart">
<div class="card-header d-flex align-items-center justify-content-between"> <div class="card-header d-flex align-items-center justify-content-between">
<h5 class="card-title m-0 me-2">발송통계</h5> <h5 class="card-title m-0 me-2">발송통계</h5>
<div>발송유형별(일별)</div> <div>발송유형별(일별)</div>
@ -121,7 +122,7 @@
</div> </div>
</div> </div>
<div class="card dashboard-item-4-3"> <div class="card dashboard-chart">
<div class="card-header d-flex align-items-center justify-content-between"> <div class="card-header d-flex align-items-center justify-content-between">
<h5 class="card-title m-0 me-2">의견진술통계</h5> <h5 class="card-title m-0 me-2">의견진술통계</h5>
<div>처리유형별(일별)</div> <div>처리유형별(일별)</div>

5
src/main/webapp/WEB-INF/jsp/index.jsp
Unescape Escape View File

@ -20,9 +20,10 @@
</div> </div>
<div id="innerPageTabContents" class="tab-content"> <div id="innerPageTabContents" class="tab-content">
<div id="tab-dashboard" class="tab-pane active show" role="tabpanel"> <div id="tab-dashboard" class="tab-pane active show" role="tabpanel">
<div id="divdashboard"> <div id="divdashboard" style="max-height: 800px;overflow-y:auto;">
<div class="content-wrapper"> <div class="content-wrapper">
<div class="container-xxl flex-grow-1 container-p-y"> <div class="container-xxl flex-grow-1 container-p-y"
style="display: flex;flex-flow: column;align-items: center;">
<jsp:include page="/WEB-INF/jsp/include/dashboard.jsp" /> <jsp:include page="/WEB-INF/jsp/include/dashboard.jsp" />
</div> </div>
</div> </div>

50
src/main/webapp/resources/css/fims/framework/common/xit-core-extend.css
Unescape Escape View File

@ -44,20 +44,19 @@
} }
.wrapper-dashboard { .wrapper-dashboard {
display: grid; display: flex;
grid-template-columns : repeat(auto-fill,minmax(145px, 145px)); flex-flow: row wrap;
grid-template-rows: repeat(auto-fill,minmax(116px, 116px));
justify-content:center; justify-content:center;
grid-auto-flow: row; max-width:1400px;
grid-column-gap: 10px; padding: 0px;
grid-row-gap: 10px;
height: 100vh;
overflow-y:scroll;
} }
.wrapper-dashboard .card { .wrapper-dashboard .card {
height: 100%;
font-weight: bold; font-weight: bold;
padding : 20px;
margin : 7px;
flex-grow: 1;
flex-shrink: 1;
} }
.wrapper-dashboard .card-header { .wrapper-dashboard .card-header {
margin: 0; margin: 0;
@ -71,34 +70,15 @@
padding: 3px; padding: 3px;
} }
.dashboard-item-1-1 { .dashboard-total {
grid-column: span 1; min-width : 300px;
grid-row: span 1; max-width : 400px;
max-height : 150px;
} }
.dashboard-item-2-1 { .dashboard-chart {
grid-column: span 2; min-width : 500px;
grid-row: span 1; max-width : 650px;
}
.dashboard-item-1-2 {
grid-column: span 1;
grid-row: span 2;
}
.dashboard-item-2-2 {
grid-column: span 2;
grid-row: span 2;
}
.dashboard-item-4-2 {
grid-column: span 4;
grid-row: span 2;
}
.dashboard-item-4-3 {
grid-column: span 4;
grid-row: span 3;
} }
@keyframes skeleton-loading { @keyframes skeleton-loading {

Write Preview
Loading…
Cancel
Save