|
|
@@ -57,61 +57,44 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
<style>
|
|
|
|
#ratePlanDetailScrollArea {
|
|
|
|
#ratePlanDetailScrollArea { max-height: 65vh; overflow-y: auto; overflow-x: hidden; padding-right: 5px; }
|
|
|
|
max-height: 65vh;
|
|
|
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
|
|
overflow-x: hidden;
|
|
|
|
|
|
|
|
padding-right: 5px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar { width: 6px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar { width: 6px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-track { background: #f5f5f5; border-radius: 3px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-track { background: #f5f5f5; border-radius: 3px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-thumb { background: #d0d0d0; border-radius: 3px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-thumb { background: #d0d0d0; border-radius: 3px; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-thumb:hover { background: #b5b5b5; }
|
|
|
|
#ratePlanDetailScrollArea::-webkit-scrollbar-thumb:hover { background: #b5b5b5; }
|
|
|
|
|
|
|
|
|
|
|
|
.custom-card { border: 1px solid #e5e5e5; border-radius: 0.25rem; margin-bottom: 1rem; background-color: #fff; }
|
|
|
|
.custom-card { border: 1px solid #e5e5e5; border-radius: 0.25rem; margin-bottom: 1rem; background-color: #fff; }
|
|
|
|
.custom-card-header { color: #333; font-weight: 600; font-size: 0.88rem; padding: 0.6rem 1rem; border-bottom: 1px solid #e5e5e5; background-color: #fafafa; }
|
|
|
|
.custom-card-header { color: #333; font-weight: 600; font-size: 0.88rem; padding: 0.6rem 1rem; border-bottom: 1px solid #e5e5e5; background-color: #fafafa; }
|
|
|
|
.custom-card-body { padding: 0.75rem 1rem; }
|
|
|
|
.custom-card-body { padding: 0.75rem 1rem; }
|
|
|
|
|
|
|
|
|
|
|
|
.info-table th, .info-table td { padding: 0.2rem 0.4rem !important; font-size: 0.85rem; color: #444; }
|
|
|
|
.info-table th, .info-table td { padding: 0.2rem 0.4rem !important; font-size: 0.85rem; color: #444; }
|
|
|
|
.info-table th { font-weight: 600; width: 110px; color: #222; white-space: nowrap; }
|
|
|
|
.info-table th { font-weight: 600; width: 110px; color: #222; white-space: nowrap; }
|
|
|
|
.info-table td { width: 100%; }
|
|
|
|
.info-table td { width: 100%; }
|
|
|
|
|
|
|
|
|
|
|
|
.price-table { font-size: 0.85rem; border-color: #e5e5e5; }
|
|
|
|
.price-table { font-size: 0.85rem; border-color: #e5e5e5; }
|
|
|
|
.price-table th, .price-table td { border-color: #e5e5e5; padding: 0.5rem; }
|
|
|
|
.price-table th, .price-table td { border-color: #e5e5e5; padding: 0.5rem; }
|
|
|
|
.price-table thead th { border-bottom-width: 1px; font-weight: 600; color: #555; }
|
|
|
|
.price-table thead th { border-bottom-width: 1px; font-weight: 600; color: #555; }
|
|
|
|
.price-table thead th:first-child { color: #222; }
|
|
|
|
.price-table thead th:first-child { color: #222; }
|
|
|
|
|
|
|
|
|
|
|
|
.val-price { color: #222; font-weight: 700; }
|
|
|
|
.val-price { color: #222; font-weight: 700; }
|
|
|
|
.val-unit { color: #999; font-size: 0.8rem; }
|
|
|
|
.val-unit { color: #999; font-size: 0.8rem; }
|
|
|
|
|
|
|
|
|
|
|
|
.charger-item { border: 1px solid #e5e5e5; border-radius: 0.35rem; padding: 0.6rem; background-color: #fff; height: 100%; }
|
|
|
|
.charger-item { border: 1px solid #e5e5e5; border-radius: 0.35rem; padding: 0.6rem; background-color: #fff; height: 100%; }
|
|
|
|
.charger-cd { font-size: 0.9rem; font-weight: bold; color: #222; margin-bottom: 0.1rem; }
|
|
|
|
.charger-cd { font-size: 0.9rem; font-weight: bold; color: #222; margin-bottom: 0.1rem; }
|
|
|
|
.charger-dt { font-size: 0.75rem; color: #aaa; margin-bottom: 0.4rem; }
|
|
|
|
.charger-dt { font-size: 0.75rem; color: #aaa; margin-bottom: 0.4rem; }
|
|
|
|
|
|
|
|
|
|
|
|
.badge-square { background-color: #f0f0f0; color: #333; border: 1px solid #d8d8d8; padding: 0.15rem 0.4rem; font-size: 0.7rem; border-radius: 2px; font-weight: 500; }
|
|
|
|
.badge-square { background-color: #f0f0f0; color: #333; border: 1px solid #d8d8d8; padding: 0.15rem 0.4rem; font-size: 0.7rem; border-radius: 2px; font-weight: 500; }
|
|
|
|
.badge-square.active { background-color: #eef1fb; color: #3b5bdb; border-color: #d6dcf5; }
|
|
|
|
.badge-square.active { background-color: #eef1fb; color: #3b5bdb; border-color: #d6dcf5; }
|
|
|
|
|
|
|
|
|
|
|
|
.approval-ok { color: #333; font-weight: 600; }
|
|
|
|
.approval-ok { color: #333; font-weight: 600; }
|
|
|
|
.approval-ok i { color: #3b5bdb; }
|
|
|
|
.approval-ok i { color: #3b5bdb; }
|
|
|
|
|
|
|
|
|
|
|
|
.season-tabs { display: flex; border-bottom: 1px solid #e5e5e5; margin-bottom: 0.75rem; }
|
|
|
|
.season-tabs { display: flex; border-bottom: 1px solid #e5e5e5; margin-bottom: 0.75rem; }
|
|
|
|
.season-tab-btn { flex: 1; text-align: center; padding: 0.5rem 0; cursor: pointer; font-size: 0.85rem; color: #666; border-bottom: 2px solid transparent; background: none; border-top:none; border-left:none; border-right:none; }
|
|
|
|
.season-tab-btn { flex: 1; text-align: center; padding: 0.5rem 0; cursor: pointer; font-size: 0.85rem; color: #666; border-bottom: 2px solid transparent; background: none; border-top:none; border-left:none; border-right:none; }
|
|
|
|
.season-tab-btn.active { color: #3b5bdb; font-weight: 600; border-bottom-color: #3b5bdb; }
|
|
|
|
.season-tab-btn.active { color: #3b5bdb; font-weight: 600; border-bottom-color: #3b5bdb; }
|
|
|
|
|
|
|
|
|
|
|
|
.time-mode-toggle { display: flex; border: 1px solid #e5e5e5; border-radius: 0.25rem; overflow: hidden; margin-bottom: 0.75rem; }
|
|
|
|
.time-mode-toggle { display: flex; border: 1px solid #e5e5e5; border-radius: 0.25rem; overflow: hidden; margin-bottom: 0.75rem; }
|
|
|
|
.time-mode-btn { flex: 1; text-align: center; padding: 0.4rem 0; cursor: pointer; font-size: 0.82rem; color: #666; background: #fafafa; }
|
|
|
|
.time-mode-btn { flex: 1; text-align: center; padding: 0.4rem 0; cursor: pointer; font-size: 0.82rem; color: #666; background: #fafafa; }
|
|
|
|
.time-mode-btn.active { background: #3b5bdb; color: #fff; font-weight: 600; }
|
|
|
|
.time-mode-btn.active { background: #3b5bdb; color: #fff; font-weight: 600; }
|
|
|
|
|
|
|
|
|
|
|
|
.basic-price-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0; border-bottom: 1px solid #f2f2f2; }
|
|
|
|
.basic-price-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0; border-bottom: 1px solid #f2f2f2; }
|
|
|
|
.basic-price-row:last-child { border-bottom: none; }
|
|
|
|
.basic-price-row:last-child { border-bottom: none; }
|
|
|
|
.basic-price-label { font-size: 0.85rem; color: #333; }
|
|
|
|
.basic-price-label { font-size: 0.85rem; color: #333; }
|
|
|
|
.basic-price-input { width: 140px; text-align: right; }
|
|
|
|
.basic-price-input { width: 140px; text-align: right; }
|
|
|
|
|
|
|
|
|
|
|
|
.detail-price-row { display: flex; align-items: center; justify-content: space-between; padding: 0.4rem 0; border-bottom: 1px solid #f5f5f5; }
|
|
|
|
.detail-price-row { display: flex; align-items: center; justify-content: space-between; padding: 0.4rem 0; border-bottom: 1px solid #f5f5f5; }
|
|
|
|
.detail-price-label { font-size: 0.82rem; color: #444; }
|
|
|
|
.detail-price-label { font-size: 0.82rem; color: #444; }
|
|
|
|
.detail-price-input { width: 140px; text-align: right; }
|
|
|
|
.detail-price-input { width: 140px; text-align: right; }
|
|
|
|
.detail-scroll { max-height: 260px; overflow-y: auto; padding-right: 4px; }
|
|
|
|
.detail-scroll { max-height: 260px; overflow-y: auto; padding-right: 4px; }
|
|
|
|
|
|
|
|
|
|
|
|
.charger-search-list { max-height: 260px; overflow-y: auto; border: 1px solid #eee; border-radius: 0.25rem; padding: 0.4rem; }
|
|
|
|
.charger-search-list { max-height: 260px; overflow-y: auto; border: 1px solid #eee; border-radius: 0.25rem; padding: 0.4rem; }
|
|
|
|
.charger-check-item { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.5rem; border: 1px solid #eee; border-radius: 0.3rem; margin-bottom: 0.4rem; background:#fff; }
|
|
|
|
.charger-check-item { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.5rem; border: 1px solid #eee; border-radius: 0.3rem; margin-bottom: 0.4rem; background:#fff; }
|
|
|
|
.charger-check-item label { margin: 0; font-size: 0.82rem; }
|
|
|
|
.charger-check-item label { margin: 0; font-size: 0.82rem; }
|
|
|
@@ -144,22 +127,15 @@
|
|
|
|
columns: [
|
|
|
|
columns: [
|
|
|
|
{title: "요금제 ID", name: "RATE_PLAN_ID", data: "ratePlanId", className, orderable:false, width: "80px"},
|
|
|
|
{title: "요금제 ID", name: "RATE_PLAN_ID", data: "ratePlanId", className, orderable:false, width: "80px"},
|
|
|
|
{title: "요금제명", name: "RATE_PLAN_NAME", data: "ratePlanName", orderable:false, className: "dt-head-center dt-body-left"},
|
|
|
|
{title: "요금제명", name: "RATE_PLAN_NAME", data: "ratePlanName", orderable:false, className: "dt-head-center dt-body-left"},
|
|
|
|
{title: "요금제 구분", name: "RATE_PLAN_TYPE", data: "ratePlanType", orderable:false, className,
|
|
|
|
{title: "요금제 구분", name: "RATE_PLAN_TYPE", data: "ratePlanType", orderable:false, className, render: (data) => data === 'time' ? '계시별 요금제' : data},
|
|
|
|
render: (data) => data === 'time' ? '계시별 요금제' : data
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{title: "적용 시작일", name: "APPLY_START_DATE", data: "applyStartDate", orderable:false, className, width: "120px"},
|
|
|
|
{title: "적용 시작일", name: "APPLY_START_DATE", data: "applyStartDate", orderable:false, className, width: "120px"},
|
|
|
|
{title: "적용 종료일", name: "APPLY_END_DATE", data: "applyEndDate", orderable:false, className, width: "120px"},
|
|
|
|
{title: "적용 종료일", name: "APPLY_END_DATE", data: "applyEndDate", orderable:false, className, width: "120px"},
|
|
|
|
{title: "승인 상태", name: "APPROVAL_STATUS", data: "approvalStatus", orderable:false, className, width: "100px",
|
|
|
|
{title: "승인 상태", name: "APPROVAL_STATUS", data: "approvalStatus", orderable:false, className, width: "100px", render: (data) => data === 'approved' ? '<span class="text-success fw-bold"><i class="bi bi-check-lg"></i> 승인완료</span>' : '<span class="text-secondary">대기중</span>'},
|
|
|
|
render: (data) => data === 'approved' ? '<span class="text-success fw-bold"><i class="bi bi-check-lg"></i> 승인완료</span>' : '<span class="text-secondary">대기중</span>'
|
|
|
|
{title: "활성화", name: "IS_ACTIVE", data: "isActive", orderable:false, className, width: "80px", render: (data) => {
|
|
|
|
},
|
|
|
|
let val = String(data || '').toLowerCase();
|
|
|
|
{title: "활성화", name: "IS_ACTIVE", data: "isActive", orderable:false, className, width: "80px",
|
|
|
|
return (val === 'true' || val === 'y') ? '<span class="text-primary fw-bold">활성</span>' : '<span class="text-secondary">비활성</span>';
|
|
|
|
render: (data) => data === "true" || data === 'Y' ? '<span class="text-primary fw-bold">활성</span>' : '<span class="text-secondary">비활성</span>'
|
|
|
|
}},
|
|
|
|
},
|
|
|
|
{title: "기능", orderable:false, width:"120px", render: (data, type, row) => mkRowDataFunctions({ratePlanId: row['ratePlanId']}, row['ratePlanName'], true, true, true)}
|
|
|
|
{title: "기능", orderable:false, width:"120px",
|
|
|
|
|
|
|
|
render: (data, type, row) => {
|
|
|
|
|
|
|
|
return mkRowDataFunctions({ratePlanId: row['ratePlanId']}, row['ratePlanName'], true, true, true);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
],
|
|
|
|
],
|
|
|
|
allCheck: false,
|
|
|
|
allCheck: false,
|
|
|
|
}
|
|
|
|
}
|
|
|
@@ -173,9 +149,6 @@
|
|
|
|
const modalWidth = 780;
|
|
|
|
const modalWidth = 780;
|
|
|
|
const labelWidth = '1px';
|
|
|
|
const labelWidth = '1px';
|
|
|
|
|
|
|
|
|
|
|
|
// ==========================================
|
|
|
|
|
|
|
|
// 💡 조회 모드 (VIEW)
|
|
|
|
|
|
|
|
// ==========================================
|
|
|
|
|
|
|
|
if(mode === ModalMode.VIEW || mode === ModalMode.VIEW_ONLY) {
|
|
|
|
if(mode === ModalMode.VIEW || mode === ModalMode.VIEW_ONLY) {
|
|
|
|
let viewInputArray = [
|
|
|
|
let viewInputArray = [
|
|
|
|
new ModalInput({
|
|
|
|
new ModalInput({
|
|
|
@@ -198,7 +171,6 @@
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card-header">승인 정보</div>
|
|
|
|
<div class="custom-card-header">승인 정보</div>
|
|
|
|
<div class="custom-card-body">
|
|
|
|
<div class="custom-card-body">
|
|
|
@@ -207,16 +179,12 @@
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card-header">시간대별 단가 설정</div>
|
|
|
|
<div class="custom-card-header">시간대별 단가 설정</div>
|
|
|
|
<div class="custom-card-body p-0" id="v_priceTableArea"></div>
|
|
|
|
<div class="custom-card-body p-0" id="v_priceTableArea"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="custom-card mb-1">
|
|
|
|
<div class="custom-card mb-1">
|
|
|
|
<div class="custom-card-header" style="border-bottom: 1px solid #e5e5e5;">
|
|
|
|
<div class="custom-card-header" style="border-bottom: 1px solid #e5e5e5;">적용 충전기 목록 (<span id="v_chargerCount">0</span>개)</div>
|
|
|
|
적용 충전기 목록 (<span id="v_chargerCount">0</span>개)
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="custom-card-body pt-3 pb-2" style="background-color: #fcfcfc;">
|
|
|
|
<div class="custom-card-body pt-3 pb-2" style="background-color: #fcfcfc;">
|
|
|
|
<div class="row g-2" id="v_chargerListArea"></div>
|
|
|
|
<div class="row g-2" id="v_chargerListArea"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@@ -245,7 +213,10 @@
|
|
|
|
$('#v_ratePlanType').text(data.ratePlanType === 'time' ? '계시별 요금제' : data.ratePlanType);
|
|
|
|
$('#v_ratePlanType').text(data.ratePlanType === 'time' ? '계시별 요금제' : data.ratePlanType);
|
|
|
|
$('#v_seasonType').text(data.seasonType === 'season' ? '계절별' : '연중');
|
|
|
|
$('#v_seasonType').text(data.seasonType === 'season' ? '계절별' : '연중');
|
|
|
|
$('#v_applyDate').text(`${data.applyStartDate || ''} ~ ${data.applyEndDate || ''}`);
|
|
|
|
$('#v_applyDate').text(`${data.applyStartDate || ''} ~ ${data.applyEndDate || ''}`);
|
|
|
|
$('#v_isActive').text((data.isActive === "true" || data.isActive === 'Y' || data.active === true) ? '활성화' : '비활성');
|
|
|
|
|
|
|
|
|
|
|
|
let mainActiveVal = String(data.isActive || data.active || '').toLowerCase();
|
|
|
|
|
|
|
|
$('#v_isActive').text((mainActiveVal === 'true' || mainActiveVal === 'y') ? '활성화' : '비활성');
|
|
|
|
|
|
|
|
|
|
|
|
$('#v_description').text(data.description || '-');
|
|
|
|
$('#v_description').text(data.description || '-');
|
|
|
|
|
|
|
|
|
|
|
|
if(data.approvalStatus === 'approved') {
|
|
|
|
if(data.approvalStatus === 'approved') {
|
|
|
@@ -259,7 +230,8 @@
|
|
|
|
if (data.chargerList && data.chargerList.length > 0) {
|
|
|
|
if (data.chargerList && data.chargerList.length > 0) {
|
|
|
|
$('#v_chargerCount').text(data.chargerList.length);
|
|
|
|
$('#v_chargerCount').text(data.chargerList.length);
|
|
|
|
let chargerHtml = data.chargerList.map(c => {
|
|
|
|
let chargerHtml = data.chargerList.map(c => {
|
|
|
|
let isActive = (c.isActive === true || c.active === true || c.isActive === 'Y');
|
|
|
|
let isActiveVal = String(c.isActive || c.active || '').toLowerCase();
|
|
|
|
|
|
|
|
let isActive = (isActiveVal === 'true' || isActiveVal === 'y');
|
|
|
|
let badgeClass = isActive ? 'badge-square active' : 'badge-square';
|
|
|
|
let badgeClass = isActive ? 'badge-square active' : 'badge-square';
|
|
|
|
let badgeText = isActive ? '적용중' : '중지';
|
|
|
|
let badgeText = isActive ? '적용중' : '중지';
|
|
|
|
return `
|
|
|
|
return `
|
|
|
@@ -280,10 +252,6 @@
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// ==========================================
|
|
|
|
|
|
|
|
// 💡 등록 모드 (REGISTER)
|
|
|
|
|
|
|
|
// ==========================================
|
|
|
|
|
|
|
|
else if(mode === ModalMode.REGISTER) {
|
|
|
|
else if(mode === ModalMode.REGISTER) {
|
|
|
|
let registerInputArray = [
|
|
|
|
let registerInputArray = [
|
|
|
|
new ModalInput({
|
|
|
|
new ModalInput({
|
|
|
@@ -310,7 +278,6 @@
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card">
|
|
|
|
<div class="custom-card-header">계시별 단가 설정</div>
|
|
|
|
<div class="custom-card-header">계시별 단가 설정</div>
|
|
|
|
<div class="custom-card-body">
|
|
|
|
<div class="custom-card-body">
|
|
|
@@ -318,7 +285,6 @@
|
|
|
|
<div id="i_pricePanelsArea"></div>
|
|
|
|
<div id="i_pricePanelsArea"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="custom-card mb-1">
|
|
|
|
<div class="custom-card mb-1">
|
|
|
|
<div class="custom-card-header">적용할 충전기 선택</div>
|
|
|
|
<div class="custom-card-header">적용할 충전기 선택</div>
|
|
|
|
<div class="custom-card-body">
|
|
|
|
<div class="custom-card-body">
|
|
|
@@ -344,18 +310,14 @@
|
|
|
|
];
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
newModal(new ModalInfo({modalTitle: "새 단가 정책 생성", inputArray: registerInputArray, modalWidth: modalWidth}), mode, 'main', {
|
|
|
|
newModal(new ModalInfo({modalTitle: "새 단가 정책 생성", inputArray: registerInputArray, modalWidth: modalWidth}), mode, 'main', {
|
|
|
|
// 🚨 insertUrl을 제거하여 프레임워크 폼 전송 방지
|
|
|
|
|
|
|
|
labelWidth: '1px',
|
|
|
|
labelWidth: '1px',
|
|
|
|
callInit: function() {
|
|
|
|
callInit: function() {
|
|
|
|
setTimeout(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
initRegisterForm();
|
|
|
|
initRegisterForm();
|
|
|
|
|
|
|
|
|
|
|
|
// 프레임워크 저장 버튼 이벤트 가로채기
|
|
|
|
|
|
|
|
$('.modal-footer button[name="approve"]').off('click').on('click', function(e) {
|
|
|
|
$('.modal-footer button[name="approve"]').off('click').on('click', function(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
e.preventDefault();
|
|
|
|
e.stopPropagation();
|
|
|
|
e.stopPropagation();
|
|
|
|
e.stopImmediatePropagation();
|
|
|
|
e.stopImmediatePropagation();
|
|
|
|
|
|
|
|
|
|
|
|
if(confirm("등록하시겠습니까?")) {
|
|
|
|
if(confirm("등록하시겠습니까?")) {
|
|
|
|
submitRegisterForm();
|
|
|
|
submitRegisterForm();
|
|
|
|
}
|
|
|
|
}
|
|
|
@@ -370,8 +332,7 @@
|
|
|
|
let activeSeason = null;
|
|
|
|
let activeSeason = null;
|
|
|
|
|
|
|
|
|
|
|
|
function getSeasons() {
|
|
|
|
function getSeasons() {
|
|
|
|
const seasonType = $('#i_seasonType').val();
|
|
|
|
return $('#i_seasonType').val() === 'season' ? ['spring','summer','fall','winter'] : ['all_year'];
|
|
|
|
return seasonType === 'season' ? ['spring','summer','fall','winter'] : ['all_year'];
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function initPriceStateFor(seasonKey) {
|
|
|
|
function initPriceStateFor(seasonKey) {
|
|
|
@@ -387,7 +348,6 @@
|
|
|
|
$('#i_seasonType').off('change').on('change', renderSeasonTabsAndPanel);
|
|
|
|
$('#i_seasonType').off('change').on('change', renderSeasonTabsAndPanel);
|
|
|
|
renderSeasonTabsAndPanel();
|
|
|
|
renderSeasonTabsAndPanel();
|
|
|
|
loadChargerList();
|
|
|
|
loadChargerList();
|
|
|
|
|
|
|
|
|
|
|
|
$('#i_chargerSearch, #i_chargerFilter').off('input change').on('input change', filterChargerList);
|
|
|
|
$('#i_chargerSearch, #i_chargerFilter').off('input change').on('input change', filterChargerList);
|
|
|
|
$('#i_chargerAll').off('change').on('change', function() {
|
|
|
|
$('#i_chargerAll').off('change').on('change', function() {
|
|
|
|
$('#i_chargerListArea .charger-check-cb:visible').prop('checked', $(this).is(':checked'));
|
|
|
|
$('#i_chargerListArea .charger-check-cb:visible').prop('checked', $(this).is(':checked'));
|
|
|
@@ -399,7 +359,6 @@
|
|
|
|
const seasons = getSeasons();
|
|
|
|
const seasons = getSeasons();
|
|
|
|
seasons.forEach(initPriceStateFor);
|
|
|
|
seasons.forEach(initPriceStateFor);
|
|
|
|
activeSeason = seasons[0];
|
|
|
|
activeSeason = seasons[0];
|
|
|
|
|
|
|
|
|
|
|
|
let tabsHtml = '';
|
|
|
|
let tabsHtml = '';
|
|
|
|
if (seasons.length > 1) {
|
|
|
|
if (seasons.length > 1) {
|
|
|
|
tabsHtml = `<div class="season-tabs">` +
|
|
|
|
tabsHtml = `<div class="season-tabs">` +
|
|
|
@@ -407,15 +366,13 @@
|
|
|
|
`</div>`;
|
|
|
|
`</div>`;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
$('#i_seasonTabsArea').html(tabsHtml);
|
|
|
|
$('#i_seasonTabsArea').html(tabsHtml);
|
|
|
|
|
|
|
|
|
|
|
|
$('.season-tab-btn').off('click').on('click', function() {
|
|
|
|
$('.season-tab-btn').off('click').on('click', function() {
|
|
|
|
saveCurrentPanelValues(activeSeason); // 탭 이동 시 기존 탭 데이터 저장
|
|
|
|
saveCurrentPanelValues(activeSeason);
|
|
|
|
$('.season-tab-btn').removeClass('active');
|
|
|
|
$('.season-tab-btn').removeClass('active');
|
|
|
|
$(this).addClass('active');
|
|
|
|
$(this).addClass('active');
|
|
|
|
activeSeason = $(this).data('season');
|
|
|
|
activeSeason = $(this).data('season');
|
|
|
|
renderPricePanel(activeSeason);
|
|
|
|
renderPricePanel(activeSeason);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
renderPricePanel(activeSeason);
|
|
|
|
renderPricePanel(activeSeason);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
@@ -429,15 +386,12 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`;
|
|
|
|
`;
|
|
|
|
|
|
|
|
|
|
|
|
let bodyHtml;
|
|
|
|
let bodyHtml;
|
|
|
|
if (state.mode === 'basic') {
|
|
|
|
if (state.mode === 'basic') {
|
|
|
|
bodyHtml = `<div id="i_basicPanel">` + BASIC_SLOTS.map(slot => `
|
|
|
|
bodyHtml = `<div id="i_basicPanel">` + BASIC_SLOTS.map(slot => `
|
|
|
|
<div class="basic-price-row">
|
|
|
|
<div class="basic-price-row">
|
|
|
|
<span class="basic-price-label">${slot.label}</span>
|
|
|
|
<span class="basic-price-label">${slot.label}</span>
|
|
|
|
<div>
|
|
|
|
<div><input type="number" class="form-control form-control-sm basic-price-input i_basic_input" data-id="${slot.id}" value="${state.basic[slot.id]}"> 원/kWh</div>
|
|
|
|
<input type="number" class="form-control form-control-sm basic-price-input i_basic_input" data-id="${slot.id}" value="${state.basic[slot.id]}"> 원/kWh
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`).join('') + `</div>`;
|
|
|
|
`).join('') + `</div>`;
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
@@ -453,9 +407,7 @@
|
|
|
|
}
|
|
|
|
}
|
|
|
|
bodyHtml = `<div class="detail-scroll" id="i_detailPanel">${rows}</div>`;
|
|
|
|
bodyHtml = `<div class="detail-scroll" id="i_detailPanel">${rows}</div>`;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('#i_pricePanelsArea').html(modeToggleHtml + bodyHtml);
|
|
|
|
$('#i_pricePanelsArea').html(modeToggleHtml + bodyHtml);
|
|
|
|
|
|
|
|
|
|
|
|
$('.time-mode-btn').off('click').on('click', function() {
|
|
|
|
$('.time-mode-btn').off('click').on('click', function() {
|
|
|
|
saveCurrentPanelValues(seasonKey);
|
|
|
|
saveCurrentPanelValues(seasonKey);
|
|
|
|
priceState[seasonKey].mode = $(this).data('mode');
|
|
|
|
priceState[seasonKey].mode = $(this).data('mode');
|
|
|
@@ -466,50 +418,30 @@
|
|
|
|
function saveCurrentPanelValues(seasonKey) {
|
|
|
|
function saveCurrentPanelValues(seasonKey) {
|
|
|
|
const state = priceState[seasonKey];
|
|
|
|
const state = priceState[seasonKey];
|
|
|
|
if (state.mode === 'basic') {
|
|
|
|
if (state.mode === 'basic') {
|
|
|
|
$('.i_basic_input').each(function() {
|
|
|
|
$('.i_basic_input').each(function() { state.basic[$(this).data('id')] = parseFloat($(this).val()) || 0; });
|
|
|
|
state.basic[$(this).data('id')] = parseFloat($(this).val()) || 0;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
$('.i_detail_input').each(function() {
|
|
|
|
$('.i_detail_input').each(function() { state.detail[$(this).data('hour')] = parseFloat($(this).val()) || 0; });
|
|
|
|
state.detail[$(this).data('hour')] = parseFloat($(this).val()) || 0;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function loadChargerList() {
|
|
|
|
function loadChargerList() {
|
|
|
|
$.ajax({
|
|
|
|
$.ajax({
|
|
|
|
url: "/cms/chgr/list.json",
|
|
|
|
url: "/cms/chgr/list.json", type: "POST", data: { start: 0, length: 9999 },
|
|
|
|
type: "POST",
|
|
|
|
success: function(res) { renderChargerList(res.data || res.list || []); },
|
|
|
|
data: {
|
|
|
|
error: function() { $('#i_chargerListArea').html('<div class="text-muted small p-2">충전기 목록을 불러오지 못했습니다.</div>'); }
|
|
|
|
start: 0,
|
|
|
|
|
|
|
|
length: 9999
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
success: function(res) {
|
|
|
|
|
|
|
|
const list = res.data || res.list || [];
|
|
|
|
|
|
|
|
renderChargerList(list);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
error: function() {
|
|
|
|
|
|
|
|
$('#i_chargerListArea').html('<div class="text-muted small p-2">충전기 목록을 불러오지 못했습니다.</div>');
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function renderChargerList(list) {
|
|
|
|
function renderChargerList(list) {
|
|
|
|
const mapped = list.map(c => {
|
|
|
|
const mapped = list.map(c => ({
|
|
|
|
const chargerCd = `${c.providerId || ''}${c.stId || ''}${c.chgrId || ''}`;
|
|
|
|
chargerCd: `${c.providerId || ''}${c.stId || ''}${c.chgrId || ''}`,
|
|
|
|
return {
|
|
|
|
chargerName: c.chgrNm || `${c.providerId || ''}${c.stId || ''}${c.chgrId || ''}`,
|
|
|
|
chargerCd: chargerCd,
|
|
|
|
location: c.stNm || '',
|
|
|
|
chargerName: c.chgrNm || chargerCd,
|
|
|
|
chargerType: c.speedTp || ''
|
|
|
|
location: c.stNm || '',
|
|
|
|
}));
|
|
|
|
chargerType: c.speedTp || ''
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$('#i_chargerAllCount').text(mapped.length);
|
|
|
|
$('#i_chargerAllCount').text(mapped.length);
|
|
|
|
|
|
|
|
|
|
|
|
let html = mapped.map(c => `
|
|
|
|
let html = mapped.map(c => `
|
|
|
|
<div class="charger-check-item" data-name="${c.chargerName.toLowerCase()}"
|
|
|
|
<div class="charger-check-item" data-name="${c.chargerName.toLowerCase()}" data-loc="${c.location.toLowerCase()}" data-type="${c.chargerType}">
|
|
|
|
data-loc="${c.location.toLowerCase()}" data-type="${c.chargerType}">
|
|
|
|
|
|
|
|
<input type="checkbox" class="charger-check-cb" value="${c.chargerCd}">
|
|
|
|
<input type="checkbox" class="charger-check-cb" value="${c.chargerCd}">
|
|
|
|
<label>
|
|
|
|
<label>
|
|
|
|
<div><strong>${c.chargerName}</strong> <span class="badge-square">${c.chargerType}</span></div>
|
|
|
|
<div><strong>${c.chargerName}</strong> <span class="badge-square">${c.chargerType}</span></div>
|
|
|
@@ -517,7 +449,6 @@
|
|
|
|
</label>
|
|
|
|
</label>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`).join('');
|
|
|
|
`).join('');
|
|
|
|
|
|
|
|
|
|
|
|
$('#i_chargerListArea').html(html || '<div class="text-muted small p-2">등록된 충전기가 없습니다.</div>');
|
|
|
|
$('#i_chargerListArea').html(html || '<div class="text-muted small p-2">등록된 충전기가 없습니다.</div>');
|
|
|
|
$('.charger-check-cb').off('change').on('change', updateAllCheckState);
|
|
|
|
$('.charger-check-cb').off('change').on('change', updateAllCheckState);
|
|
|
|
}
|
|
|
|
}
|
|
|
@@ -541,7 +472,6 @@
|
|
|
|
function renderViewPriceTable(detailsTime) {
|
|
|
|
function renderViewPriceTable(detailsTime) {
|
|
|
|
const seasonsSet = new Set(detailsTime.map(d => d.seasonType));
|
|
|
|
const seasonsSet = new Set(detailsTime.map(d => d.seasonType));
|
|
|
|
const seasons = seasonsSet.size ? Array.from(seasonsSet) : ['all_year'];
|
|
|
|
const seasons = seasonsSet.size ? Array.from(seasonsSet) : ['all_year'];
|
|
|
|
|
|
|
|
|
|
|
|
let priceMap = {};
|
|
|
|
let priceMap = {};
|
|
|
|
let allIds = new Set();
|
|
|
|
let allIds = new Set();
|
|
|
|
detailsTime.forEach(d => {
|
|
|
|
detailsTime.forEach(d => {
|
|
|
@@ -551,39 +481,32 @@
|
|
|
|
allIds.add(r.id);
|
|
|
|
allIds.add(r.id);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
const isBasic = [1, 2, 3].some(id => allIds.has(id));
|
|
|
|
const isBasic = [1, 2, 3].some(id => allIds.has(id));
|
|
|
|
|
|
|
|
|
|
|
|
let headerHtml = seasons.map(s => `<th>${SEASON_LABEL[s] || s}</th>`).join('');
|
|
|
|
let headerHtml = seasons.map(s => `<th>${SEASON_LABEL[s] || s}</th>`).join('');
|
|
|
|
let rows = '';
|
|
|
|
let rows = '';
|
|
|
|
|
|
|
|
|
|
|
|
if (isBasic) {
|
|
|
|
if (isBasic) {
|
|
|
|
BASIC_SLOTS.forEach(slot => {
|
|
|
|
BASIC_SLOTS.forEach(slot => {
|
|
|
|
rows += `<tr><td class="border-end py-2 fw-bold">${slot.label}</td>` +
|
|
|
|
rows += `<tr><td class="border-end py-2 fw-bold">${slot.label}</td>` +
|
|
|
|
seasons.map(s => `<td>${priceMap[slot.id] && priceMap[slot.id][s] != null ? `<span class="val-price">${priceMap[slot.id][s]}</span> <span class="val-unit">원/kWh</span>` : '-'}</td>`).join('') +
|
|
|
|
seasons.map(s => `<td>${priceMap[slot.id] && priceMap[slot.id][s] != null ? `<span class="val-price">${priceMap[slot.id][s]}</span> <span class="val-unit">원/kWh</span>` : '-'}</td>`).join('') + `</tr>`;
|
|
|
|
`</tr>`;
|
|
|
|
|
|
|
|
});
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
for (let h = 0; h < 24; h++) {
|
|
|
|
for (let h = 0; h < 24; h++) {
|
|
|
|
const id = h + 4;
|
|
|
|
const id = h + 4;
|
|
|
|
rows += `<tr><td class="border-end py-2">${String(h).padStart(2, '0')}시</td>` +
|
|
|
|
rows += `<tr><td class="border-end py-2">${String(h).padStart(2, '0')}시</td>` +
|
|
|
|
seasons.map(s => `<td>${priceMap[id] && priceMap[id][s] != null ? `<span class="val-price">${priceMap[id][s]}</span> <span class="val-unit">원/kWh</span>` : '-'}</td>`).join('') +
|
|
|
|
seasons.map(s => `<td>${priceMap[id] && priceMap[id][s] != null ? `<span class="val-price">${priceMap[id][s]}</span> <span class="val-unit">원/kWh</span>` : '-'}</td>`).join('') + `</tr>`;
|
|
|
|
`</tr>`;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('#v_priceTableArea').html(`
|
|
|
|
$('#v_priceTableArea').html(`
|
|
|
|
<table class="table mb-0 text-center align-middle price-table">
|
|
|
|
<table class="table mb-0 text-center align-middle price-table">
|
|
|
|
<thead><tr><th class="border-end text-dark">시간대구분</th>${headerHtml}</tr></thead>
|
|
|
|
<thead><tr><th class="border-end text-dark">시간대구분</th>${headerHtml}</tr></thead>
|
|
|
|
<tbody>${rows}</tbody>
|
|
|
|
<tbody>${rows}</tbody>
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
`);
|
|
|
|
`);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function submitRegisterForm() {
|
|
|
|
function submitRegisterForm() {
|
|
|
|
const seasons = getSeasons();
|
|
|
|
const seasons = getSeasons();
|
|
|
|
saveCurrentPanelValues(activeSeason);
|
|
|
|
saveCurrentPanelValues(activeSeason);
|
|
|
|
|
|
|
|
|
|
|
|
let detailsTime = seasons.map(seasonKey => {
|
|
|
|
let detailsTime = seasons.map(seasonKey => {
|
|
|
|
const state = priceState[seasonKey];
|
|
|
|
const state = priceState[seasonKey];
|
|
|
|
let timeRates = [];
|
|
|
|
let timeRates = [];
|
|
|
@@ -624,16 +547,9 @@
|
|
|
|
if(chargerList.length === 0) { alert("적용할 충전기를 1개 이상 선택해주세요."); return; }
|
|
|
|
if(chargerList.length === 0) { alert("적용할 충전기를 1개 이상 선택해주세요."); return; }
|
|
|
|
|
|
|
|
|
|
|
|
$.ajax({
|
|
|
|
$.ajax({
|
|
|
|
url: rootPath + "insert.json",
|
|
|
|
url: rootPath + "insert.json", type: "POST", contentType: "application/json; charset=utf-8", data: JSON.stringify(requestDto),
|
|
|
|
type: "POST",
|
|
|
|
|
|
|
|
contentType: "application/json; charset=utf-8",
|
|
|
|
|
|
|
|
data: JSON.stringify(requestDto),
|
|
|
|
|
|
|
|
success: function(res) {
|
|
|
|
success: function(res) {
|
|
|
|
if(res.result === 'success') {
|
|
|
|
if(res.result === 'success') { alert("등록되었습니다."); } else { alert("오류 발생: " + res.message); }
|
|
|
|
alert("등록되었습니다.");
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
alert("오류 발생: " + res.message);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
$('.modal-footer .btn-cls-main').trigger('click');
|
|
|
|
$('.modal-footer .btn-cls-main').trigger('click');
|
|
|
|
datatable.ajax.reload();
|
|
|
|
datatable.ajax.reload();
|
|
|
|
},
|
|
|
|
},
|
|
|
|