131 lines
7.8 KiB
HTML
131 lines
7.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>출장비 관리</title>
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
<style>
|
|
.cb-cell { width:36px; text-align:center; padding:8px 4px; }
|
|
input[type=checkbox] { width:16px; height:16px; cursor:pointer; }
|
|
tr.selected td { background:var(--gray2) !important; }
|
|
#btnDelete { display:none; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<nav class="nav"><div style="display:flex;align-items:center;gap:2px;"><button class="nav-hamburger" onclick="toggleSidebar()">☰</button><span class="nav-brand">⚡ EV AS 관리 — 관리자</span></div><div id="navUser"></div></nav>
|
|
<div class="mobile-nav-overlay" id="navOverlay" onclick="toggleSidebar()"></div>
|
|
<div class="layout">
|
|
<div class="sidebar" id="sidebar">
|
|
<div class="sidebar-section">AS 관리</div>
|
|
<a href="/pages/admin/dashboard.html">📊 대시보드</a>
|
|
<a href="/pages/admin/reports.html">📋 신고 목록</a>
|
|
<a href="/pages/admin/costs.html" class="active">💰 출장비 관리</a>
|
|
<div class="sidebar-section">시스템</div>
|
|
<a href="/pages/admin/improvements.html">🔧 개선항목</a>
|
|
<a href="/pages/admin/chargers.html">⚡ 충전기 관리</a>
|
|
<a href="/pages/admin/charger-types.html">🏷 충전기 종류</a>
|
|
<a href="/pages/admin/issue-types.html">📝 유형관리</a>
|
|
<a href="/pages/admin/qr.html">📷 QR 생성</a>
|
|
<a href="/pages/admin/accounts.html">👥 계정 관리</a>
|
|
<a href="/pages/admin/export.html">📥 데이터 내보내기</a>
|
|
<a href="/pages/admin/settings.html">⚙️ 설정</a>
|
|
</div>
|
|
<div class="main">
|
|
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px;">
|
|
<h2 style="font-size:18px;font-weight:700;color:var(--navy)">출장비 관리</h2>
|
|
<div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;">
|
|
<button id="btnDelete" class="btn btn-sm" style="background:#e53e3e;color:#fff;border:none;" onclick="bulkDelete()">🗑 선택 삭제 (<span id="selCount">0</span>개)</button>
|
|
<button class="btn btn-success btn-sm" onclick="API.download('/export/costs','출장비목록.xlsx')">📥 엑셀 다운로드</button>
|
|
</div>
|
|
</div>
|
|
<div class="stats" id="stats"></div>
|
|
<div class="card">
|
|
<div style="display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap;">
|
|
<select id="fStatus" style="width:auto">
|
|
<option value="">전체 상태</option>
|
|
<option value="pending">미처리</option>
|
|
<option value="billed">청구완료</option>
|
|
<option value="waived">면제</option>
|
|
<option value="settled">정산완료</option>
|
|
</select>
|
|
<select id="fParty" style="width:auto">
|
|
<option value="">전체 부담주체</option>
|
|
<option value="cpo">CPO</option>
|
|
<option value="manufacturer">업체</option>
|
|
<option value="self">자체</option>
|
|
<option value="user">사용자과실</option>
|
|
<option value="other">기타</option>
|
|
</select>
|
|
<button class="btn btn-outline btn-sm" onclick="load()">🔍 검색</button>
|
|
</div>
|
|
<div class="tbl-wrap">
|
|
<table>
|
|
<thead><tr>
|
|
<th class="cb-cell"><input type="checkbox" id="chkAll" onchange="toggleAll(this)"></th>
|
|
<th>신고#</th><th>충전기</th><th>충전소</th><th>정비사</th><th>부담주체</th><th>수급주체</th><th>금액</th><th>상태</th><th>처리일시</th>
|
|
</tr></thead>
|
|
<tbody id="tbody"></tbody>
|
|
</table>
|
|
</div>
|
|
<div id="empty" class="alert alert-info" style="display:none">조회된 출장비가 없습니다.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="/js/api.js"></script><script src="/js/auth.js"></script>
|
|
<script>
|
|
Auth.require(['admin']); Auth.renderNav(document.getElementById('navUser'));
|
|
|
|
function updateDeleteBtn() {
|
|
const checked = document.querySelectorAll('.row-chk:checked');
|
|
document.getElementById('selCount').textContent = checked.length;
|
|
document.getElementById('btnDelete').style.display = checked.length > 0 ? 'inline-flex' : 'none';
|
|
}
|
|
function toggleAll(chkAll) {
|
|
document.querySelectorAll('.row-chk').forEach(c => {
|
|
c.checked = chkAll.checked;
|
|
c.closest('tr').classList.toggle('selected', chkAll.checked);
|
|
});
|
|
updateDeleteBtn();
|
|
}
|
|
async function bulkDelete() {
|
|
const checked = [...document.querySelectorAll('.row-chk:checked')];
|
|
if (!checked.length) return;
|
|
if (!confirm(`선택한 출장비 내역 ${checked.length}건을 삭제합니다. 되돌릴 수 없습니다. 계속하시겠습니까?`)) return;
|
|
const ids = checked.map(c => parseInt(c.dataset.id));
|
|
try { await API.delete('/costs/bulk', ids); load(); }
|
|
catch(e) { alert('삭제 중 오류가 발생했습니다: ' + e.message); }
|
|
}
|
|
|
|
const PARTY_LABEL = {cpo:'CPO',manufacturer:'업체',self:'자체',user:'사용자과실',other:'기타'};
|
|
|
|
async function load() {
|
|
const [statsData, costs] = await Promise.all([API.get('/costs/stats'), API.get('/costs?cost_status='+document.getElementById('fStatus').value+'&cost_party_type='+document.getElementById('fParty').value)]);
|
|
document.getElementById('stats').innerHTML = `
|
|
<div class="stat"><div class="stat-num">${statsData.monthly_total.toLocaleString()}</div><div class="stat-label">이달 출장비 합계(원)</div></div>
|
|
<div class="stat danger"><div class="stat-num">${statsData.pending_count}</div><div class="stat-label">미처리 건수</div></div>`;
|
|
const tbody = document.getElementById('tbody');
|
|
document.getElementById('chkAll').checked = false;
|
|
updateDeleteBtn();
|
|
document.getElementById('empty').style.display = costs.length ? 'none' : 'block';
|
|
tbody.innerHTML = costs.map(c => `
|
|
<tr>
|
|
<td class="cb-cell" onclick="event.stopPropagation()">
|
|
<input type="checkbox" class="row-chk" data-id="${c.id}"
|
|
onchange="this.closest('tr').classList.toggle('selected',this.checked);updateDeleteBtn()">
|
|
</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${(c.report_ids||[]).map(i=>'#'+i).join(', ')}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${c.charger_id||'-'}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${c.station_name||'-'}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${c.mechanic_name||'-'}<br><small>${c.mechanic_company||''}</small></td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${PARTY_LABEL[c.cost_party_type]||c.cost_party_type||'-'}${c.cost_party_type==='manufacturer'&&c.cost_manufacturer_name?`<br><small>${c.cost_manufacturer_name}</small>`:''}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${c.recv_party_type?(PARTY_LABEL[c.recv_party_type]||c.recv_party_type):'-'}${c.recv_party_type==='manufacturer'&&c.recv_manufacturer_name?`<br><small>${c.recv_manufacturer_name}</small>`:''}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer;font-weight:700;color:var(--orange)">${(c.cost_amount||0).toLocaleString()}원</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${Auth.costStatusBadge(c.cost_status)}</td>
|
|
<td onclick="location.href='/pages/admin/report-detail.html?id=${(c.report_ids||[])[0]||''}'" style="cursor:pointer">${Auth.fmtDt(c.reviewed_at)}</td>
|
|
</tr>`).join('');
|
|
}
|
|
load();
|
|
</script>
|
|
</body>
|
|
</html>
|