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

index.jsp 소스 정리

Browse Source
main
이범준 1 year ago
parent adbaeff712
commit 32b06ae92a
4 changed files with 283 additions and 283 deletions
Show Stats Download Patch File Download Diff File

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

@ -146,3 +146,276 @@
</div> </div>
</div> </div>
</div> </div>
<c:set var="dashboardScript" scope="request">
// Color Variables
const yellowColor = '#ffe800';
let borderColor, gridColor, tickColor;
borderColor = '#f0f0f0';
gridColor = '#f0f0f0';
tickColor = 'rgba(0, 0, 0, 0.75)'; // x & y axis tick color
const lineChart = document.getElementById('lineChart');
if (lineChart) {
const lineChartVar = new Chart(lineChart, {
type: 'line',
data: {
labels: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140],
datasets: [
{
data: [80, 150, 180, 270, 210, 160, 160, 202, 265, 210, 270, 255, 290, 360, 375],
label: '고정형',
borderColor: config.colors.danger,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: config.colors.danger,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: config.colors.danger
},
{
data: [80, 125, 105, 130, 215, 195, 140, 160, 230, 300, 220, 170, 210, 200, 280],
label: '도보',
borderColor: config.colors.primary,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: config.colors.primary,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: config.colors.primary
},
{
data: [80, 99, 82, 90, 115, 115, 74, 75, 130, 155, 125, 90, 140, 130, 180],
label: '민원',
borderColor: yellowColor,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: yellowColor,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: yellowColor
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
x: {
grid: {
color: borderColor,
drawBorder: false,
borderColor: borderColor
},
ticks: {
color: "black"
}
},
y: {
scaleLabel: {
display: true
},
min: 0,
max: 400,
ticks: {
color: "black",
stepSize: 100
},
grid: {
color: borderColor,
drawBorder: false,
borderColor: borderColor
}
}
},
plugins: {
tooltip: {
rtl: true,
backgroundColor: config.colors.cardColor,
titleColor: config.colors.headingColor,
bodyColor: config.colors.bodyColor,
borderWidth: 1,
borderColor: borderColor
},
legend: {
position: 'left',
align: 'stretch',
rtl: true,
labels: {
usePointStyle: true,
padding: 6,
boxWidth: 12,
boxHeight: 30,
color: "black"
}
}
}
}
});
}
// Color Variables
const cyanColor = '#28dac6',
orangeLightColor = '#FDAC34';
let cardColor, headingColor, labelColor, legendColor;
cardColor = config.colors.cardColor;
headingColor = config.colors.headingColor;
labelColor = config.colors.textMuted;
legendColor = config.colors.bodyColor;
const doughnutChart1 = document.getElementById('doughnutChart1');
if (doughnutChart1) {
const doughnutChartVar = new Chart(doughnutChart1, {
type: 'doughnut',
data: {
labels: ['단속', '계도', '서손'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
});
}
const doughnutChart2 = document.getElementById('doughnutChart2');
if (doughnutChart2) {
const doughnutChartVar = new Chart(doughnutChart2, {
type: 'doughnut',
data: {
labels: ['계도장', '사전통보', '고지서'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
});
}
const doughnutChart3 = document.getElementById('doughnutChart3');
if (doughnutChart3) {
const doughnutChartVar = new Chart(doughnutChart3, {
type: 'doughnut',
data: {
labels: ['수용', '미수용', '자진취하'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
});
}
</c:set>

2
src/main/webapp/WEB-INF/jsp/include/tail.jsp
Unescape Escape View File

@ -51,8 +51,6 @@
<!-- 그리드 템플릿 설정 --> <!-- 그리드 템플릿 설정 -->
<script src="<c:url value="/resources/js/fims/framework/cmm/initGrid.js"/>?${ver}"></script> <script src="<c:url value="/resources/js/fims/framework/cmm/initGrid.js"/>?${ver}"></script>
<!-- 코드 변수 -->
<script type="text/javascript" src="<c:url value="/resources/js/fims/biz/common/codeComboData.js" />"></script>
<!-- endbuild --> <!-- endbuild -->
<c:set var="functions" scope="request"> <c:set var="functions" scope="request">

2
src/main/webapp/WEB-INF/jsp/include/top.jsp
Unescape Escape View File

@ -35,7 +35,7 @@
<div class="ms-auto me-2" style="min-width: max-content;"> <div class="ms-auto me-2" style="min-width: max-content;">
<div class="form-check-inline custom-option custom-option-basic" style="background-color: #d9dee3"> <div class="form-check-inline custom-option custom-option-basic" style="background-color: #d9dee3">
<label for="securityMode" class="form-check-label custom-option-content"> <label for="securityMode--top" class="form-check-label custom-option-content">
<input type="checkbox" id="securityMode--top" name="securityMode" class="form-check-input" value="Y" /> <input type="checkbox" id="securityMode--top" name="securityMode" class="form-check-input" value="Y" />
보안모드 보안모드
</label> </label>

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

@ -34,7 +34,13 @@
</div> </div>
<jsp:include page="/WEB-INF/jsp/include/tail.jsp" /> <jsp:include page="/WEB-INF/jsp/include/tail.jsp" />
<c:set var="onload">
$("#layout-navbar input[name='taskSeCd'][value='DPV']").prop("checked",true);
</c:set>
<script> <script>
let pageObject = {};
${functions} ${functions}
@ -42,288 +48,11 @@
${userMenus} ${userMenus}
${dashboardScript}
$(function(){ $(function(){
${onload} ${onload}
$("#layout-navbar input[name='taskSeCd'][value='DPV']").prop("checked",true);
});
let pageObject = {};
</script>
<script>
// Color Variables
const yellowColor = '#ffe800';
let borderColor, gridColor, tickColor;
borderColor = '#f0f0f0';
gridColor = '#f0f0f0';
tickColor = 'rgba(0, 0, 0, 0.75)'; // x & y axis tick color
const lineChart = document.getElementById('lineChart');
if (lineChart) {
const lineChartVar = new Chart(lineChart, {
type: 'line',
data: {
labels: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140],
datasets: [
{
data: [80, 150, 180, 270, 210, 160, 160, 202, 265, 210, 270, 255, 290, 360, 375],
label: '고정형',
borderColor: config.colors.danger,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: config.colors.danger,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: config.colors.danger
},
{
data: [80, 125, 105, 130, 215, 195, 140, 160, 230, 300, 220, 170, 210, 200, 280],
label: '도보',
borderColor: config.colors.primary,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: config.colors.primary,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: config.colors.primary
},
{
data: [80, 99, 82, 90, 115, 115, 74, 75, 130, 155, 125, 90, 140, 130, 180],
label: '민원',
borderColor: yellowColor,
tension: 0.5,
pointStyle: 'circle',
backgroundColor: yellowColor,
fill: false,
pointRadius: 1,
pointHoverRadius: 5,
pointHoverBorderWidth: 5,
pointBorderColor: 'transparent',
pointHoverBorderColor: config.colors.cardColor,
pointHoverBackgroundColor: yellowColor
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
x: {
grid: {
color: borderColor,
drawBorder: false,
borderColor: borderColor
},
ticks: {
color: "black"
}
},
y: {
scaleLabel: {
display: true
},
min: 0,
max: 400,
ticks: {
color: "black",
stepSize: 100
},
grid: {
color: borderColor,
drawBorder: false,
borderColor: borderColor
}
}
},
plugins: {
tooltip: {
rtl: true,
backgroundColor: config.colors.cardColor,
titleColor: config.colors.headingColor,
bodyColor: config.colors.bodyColor,
borderWidth: 1,
borderColor: borderColor
},
legend: {
position: 'left',
align: 'stretch',
rtl: true,
labels: {
usePointStyle: true,
padding: 6,
boxWidth: 12,
boxHeight: 30,
color: "black"
}
}
}
}
});
}
</script>
<script>
// Color Variables
const cyanColor = '#28dac6',
orangeLightColor = '#FDAC34';
let cardColor, headingColor, labelColor, legendColor;
cardColor = config.colors.cardColor;
headingColor = config.colors.headingColor;
labelColor = config.colors.textMuted;
legendColor = config.colors.bodyColor;
const doughnutChart1 = document.getElementById('doughnutChart1');
if (doughnutChart1) {
const doughnutChartVar = new Chart(doughnutChart1, {
type: 'doughnut',
data: {
labels: ['단속', '계도', '서손'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
});
}
</script>
<script>
const doughnutChart2 = document.getElementById('doughnutChart2');
if (doughnutChart2) {
const doughnutChartVar = new Chart(doughnutChart2, {
type: 'doughnut',
data: {
labels: ['계도장', '사전통보', '고지서'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
});
}
</script>
<script>
const doughnutChart3 = document.getElementById('doughnutChart3');
if (doughnutChart3) {
const doughnutChartVar = new Chart(doughnutChart3, {
type: 'doughnut',
data: {
labels: ['수용', '미수용', '자진취하'],
datasets: [
{
data: [10, 10, 80],
backgroundColor: [cyanColor, orangeLightColor, config.colors.primary],
borderWidth: 0,
pointStyle: 'rectRounded'
}
]
},
options: {
responsive: true,
animation: {
duration: 500
},
cutout: '68%',
plugins: {
legend: {
display: true
},
tooltip: {
callbacks: {
label: function (context) {
const label = context.labels || '',
value = context.parsed;
const output = ' ' + label + ' : ' + value + ' %';
return output;
}
},
// Updated default tooltip UI
rtl: true,
backgroundColor: cardColor,
titleColor: headingColor,
bodyColor: legendColor,
borderWidth: 1,
borderColor: borderColor
}
}
}
}); });
}
</script> </script>
</body> </body>
</html> </html>
Write Preview
Loading…
Cancel
Save