tk-factory-services/tksafety/web/static/js/tksafety-visit-management.js

/* ===== Visit Management (출입 관리 - 관리자) ===== */
let allRequests = [];
let actionRequestId = null;

/* ===== Status badge for visit requests ===== */
function vrStatusBadge(s) {
    const m = {
        pending:             ['badge-amber', '대기중'],
        approved:            ['badge-green', '승인됨'],
        rejected:            ['badge-red',   '반려됨'],
        training_completed:  ['badge-blue',  '교육완료'],
        checked_in:          ['badge-blue',  '체크인'],
        checked_out:         ['badge-gray',  '체크아웃']
    };
    const [cls, label] = m[s] || ['badge-gray', s];
    return `<span class="badge ${cls}">${label}</span>`;
}

function requestTypeBadge(t) {
    return t === 'internal'
        ? '<span class="badge badge-blue">내부</span>'
        : '<span class="badge badge-amber">외부</span>';
}

/* ===== Load requests ===== */
async function loadRequests() {
    try {
        const params = new URLSearchParams();
        const status = document.getElementById('filterStatus').value;
        const dateFrom = document.getElementById('filterDateFrom').value;
        const dateTo = document.getElementById('filterDateTo').value;
        const type = document.getElementById('filterType').value;
        if (status) params.set('status', status);
        if (dateFrom) params.set('start_date', dateFrom);
        if (dateTo) params.set('end_date', dateTo);
        if (type) params.set('request_type', type);

        const res = await api('/visit-requests/requests?' + params.toString());
        allRequests = res.data || [];
        renderStats();
        renderRequestsTable();
    } catch (e) {
        showToast('데이터 로드 실패: ' + e.message, 'error');
    }
}

function renderStats() {
    const counts = { pending: 0, approved: 0, rejected: 0, training_completed: 0, checked_in: 0, checked_out: 0 };
    allRequests.forEach(r => { if (counts[r.status] !== undefined) counts[r.status]++; });
    document.getElementById('statPending').textContent = counts.pending;
    document.getElementById('statApproved').textContent = counts.approved;
    document.getElementById('statRejected').textContent = counts.rejected;
    document.getElementById('statTrainingDone').textContent = counts.training_completed;
    document.getElementById('statCheckedIn').textContent = counts.checked_in;
    document.getElementById('statCheckedOut').textContent = counts.checked_out;
}

function renderRequestsTable() {
    const tbody = document.getElementById('requestsTableBody');
    if (!allRequests.length) {
        tbody.innerHTML = '<tr><td colspan="10" class="text-center text-gray-400 py-8">신청 내역이 없습니다</td></tr>';
        return;
    }
    tbody.innerHTML = allRequests.map(r => {
        let actions = '';

        // 승인/반려 (pending만)
        if (r.status === 'pending') {
            actions = `
                <button onclick="openApproveModal(${r.request_id})" class="text-green-600 hover:text-green-800 text-xs px-2 py-1 border border-green-200 rounded hover:bg-green-50" title="승인">
                    <i class="fas fa-check"></i>
                </button>
                <button onclick="openRejectModal(${r.request_id})" class="text-red-600 hover:text-red-800 text-xs px-2 py-1 border border-red-200 rounded hover:bg-red-50 ml-1" title="반려">
                    <i class="fas fa-times"></i>
                </button>`;
        }

        // 체크인 버튼 (approved 또는 training_completed)
        const canCheckIn = (r.request_type === 'internal' && r.status === 'approved') ||
                           (['approved', 'training_completed'].includes(r.status));
        if (canCheckIn) {
            actions += ` <button onclick="doCheckIn(${r.request_id})" class="text-blue-600 hover:text-blue-800 text-xs px-2 py-1 border border-blue-200 rounded hover:bg-blue-50" title="체크인"><i class="fas fa-sign-in-alt"></i></button>`;
        }

        // 체크아웃 버튼 (checked_in)
        if (r.status === 'checked_in') {
            actions += ` <button onclick="doCheckOut(${r.request_id})" class="text-gray-600 hover:text-gray-800 text-xs px-2 py-1 border border-gray-200 rounded hover:bg-gray-50" title="체크아웃"><i class="fas fa-sign-out-alt"></i></button>`;
        }

        actions += ` <button onclick="openDetailModal(${r.request_id})" class="text-gray-400 hover:text-gray-600 text-xs ml-1" title="상세"><i class="fas fa-eye"></i></button>`;
        if (r.status === 'pending') {
            actions += ` <button onclick="doDeleteRequest(${r.request_id})" class="text-gray-400 hover:text-red-500 text-xs ml-1" title="삭제"><i class="fas fa-trash"></i></button>`;
        }

        const displayName = r.request_type === 'internal'
            ? escapeHtml(r.visitor_name || r.requester_full_name || '-')
            : escapeHtml(r.visitor_company);

        return `<tr>
            <td>${requestTypeBadge(r.request_type)}</td>
            <td>${escapeHtml(r.requester_full_name || r.requester_name || '-')}</td>
            <td>${displayName}</td>
            <td class="text-center">${r.visitor_count}</td>
            <td>${escapeHtml(r.workplace_name || '-')}</td>
            <td>${formatDate(r.visit_date)}</td>
            <td class="hide-mobile">${r.visit_time ? String(r.visit_time).substring(0, 5) : '-'}</td>
            <td>${escapeHtml(r.purpose_name || '-')}</td>
            <td>${vrStatusBadge(r.status)}</td>
            <td class="text-right whitespace-nowrap">${actions}</td>
        </tr>`;
    }).join('');
}

/* ===== Check-in / Check-out ===== */
async function doCheckIn(id) {
    if (!confirm('체크인 처리하시겠습니까?')) return;
    try {
        await api('/visit-requests/requests/' + id + '/check-in', { method: 'PUT', body: JSON.stringify({}) });
        showToast('체크인 완료');
        await loadRequests();
    } catch (e) {
        showToast(e.message, 'error');
    }
}

async function doCheckOut(id) {
    if (!confirm('체크아웃 처리하시겠습니까?')) return;
    try {
        await api('/visit-requests/requests/' + id + '/check-out', { method: 'PUT', body: JSON.stringify({}) });
        showToast('체크아웃 완료');
        await loadRequests();
    } catch (e) {
        showToast(e.message, 'error');
    }
}

/* ===== Approve Modal ===== */
function openApproveModal(id) {
    const r = allRequests.find(x => x.request_id === id);
    if (!r) return;
    actionRequestId = id;
    const displayName = r.request_type === 'internal'
        ? escapeHtml(r.visitor_name || r.requester_full_name || '-')
        : escapeHtml(r.visitor_company);
    document.getElementById('approveDetail').innerHTML = `
        <p><strong>유형:</strong> ${r.request_type === 'internal' ? '내부 출입' : '외부 방문'}</p>
        <p><strong>업체/이름:</strong> ${displayName}</p>
        <p><strong>방문일:</strong> ${formatDate(r.visit_date)} ${r.visit_time ? String(r.visit_time).substring(0, 5) : ''}</p>
        <p><strong>작업장:</strong> ${escapeHtml(r.workplace_name || '-')}</p>
        <p><strong>인원:</strong> ${r.visitor_count}명</p>
        <p class="mt-2">이 출입 신청을 승인하시겠습니까?</p>
    `;
    document.getElementById('approveModal').classList.remove('hidden');
}

function closeApproveModal() {
    document.getElementById('approveModal').classList.add('hidden');
    actionRequestId = null;
}

async function confirmApprove() {
    if (!actionRequestId) return;
    try {
        await api('/visit-requests/requests/' + actionRequestId + '/approve', {
            method: 'PUT', body: JSON.stringify({})
        });
        showToast('승인되었습니다');
        closeApproveModal();
        await loadRequests();
    } catch (e) {
        showToast(e.message, 'error');
    }
}

/* ===== Reject Modal ===== */
function openRejectModal(id) {
    const r = allRequests.find(x => x.request_id === id);
    if (!r) return;
    actionRequestId = id;
    document.getElementById('rejectDetail').innerHTML = `
        <p><strong>업체/이름:</strong> ${escapeHtml(r.visitor_company || r.visitor_name || '-')}</p>
        <p><strong>방문일:</strong> ${formatDate(r.visit_date)} ${r.visit_time ? String(r.visit_time).substring(0, 5) : ''}</p>
        <p><strong>작업장:</strong> ${escapeHtml(r.workplace_name || '-')}</p>
    `;
    document.getElementById('rejectionReason').value = '';
    document.getElementById('rejectModal').classList.remove('hidden');
}

function closeRejectModal() {
    document.getElementById('rejectModal').classList.add('hidden');
    actionRequestId = null;
}

async function confirmReject() {
    if (!actionRequestId) return;
    const reason = document.getElementById('rejectionReason').value.trim();
    if (!reason) {
        showToast('반려 사유를 입력해주세요', 'error');
        return;
    }
    try {
        await api('/visit-requests/requests/' + actionRequestId + '/reject', {
            method: 'PUT', body: JSON.stringify({ rejection_reason: reason })
        });
        showToast('반려되었습니다');
        closeRejectModal();
        await loadRequests();
    } catch (e) {
        showToast(e.message, 'error');
    }
}

/* ===== Detail Modal ===== */
function openDetailModal(id) {
    const r = allRequests.find(x => x.request_id === id);
    if (!r) return;
    document.getElementById('detailContent').innerHTML = `
        <div class="grid grid-cols-2 gap-3">
            <div><span class="text-gray-500">유형:</span> ${r.request_type === 'internal' ? '내부 출입' : '외부 방문'}</div>
            <div><span class="text-gray-500">신청자:</span> <span class="font-medium">${escapeHtml(r.requester_full_name || r.requester_name || '-')}</span></div>
            <div><span class="text-gray-500">업체:</span> <span class="font-medium">${escapeHtml(r.visitor_company || '-')}</span></div>
            <div><span class="text-gray-500">방문자:</span> <span class="font-medium">${escapeHtml(r.visitor_name || '-')}</span></div>
            <div><span class="text-gray-500">인원:</span> <span class="font-medium">${r.visitor_count}명</span></div>
            <div><span class="text-gray-500">분류:</span> <span class="font-medium">${escapeHtml(r.category_name || '-')}</span></div>
            <div><span class="text-gray-500">작업장:</span> <span class="font-medium">${escapeHtml(r.workplace_name || '-')}</span></div>
            <div><span class="text-gray-500">방문일:</span> <span class="font-medium">${formatDate(r.visit_date)}</span></div>
            <div><span class="text-gray-500">방문시간:</span> <span class="font-medium">${r.visit_time ? String(r.visit_time).substring(0, 5) : '-'}</span></div>
            <div><span class="text-gray-500">목적:</span> <span class="font-medium">${escapeHtml(r.purpose_name || '-')}</span></div>
            <div><span class="text-gray-500">상태:</span> ${vrStatusBadge(r.status)}</div>
            <div><span class="text-gray-500">신청일:</span> <span class="font-medium">${formatDateTime(r.created_at)}</span></div>
            ${r.check_in_time ? `<div><span class="text-gray-500">체크인:</span> <span class="font-medium">${formatDateTime(r.check_in_time)}</span></div>` : ''}
            ${r.check_out_time ? `<div><span class="text-gray-500">체크아웃:</span> <span class="font-medium">${formatDateTime(r.check_out_time)}</span></div>` : ''}
            ${r.department_name ? `<div><span class="text-gray-500">부서:</span> <span class="font-medium">${escapeHtml(r.department_name)}</span></div>` : ''}
            ${r.approver_name ? `<div><span class="text-gray-500">처리자:</span> <span class="font-medium">${escapeHtml(r.approver_name)}</span></div>` : ''}
            ${r.approved_at ? `<div><span class="text-gray-500">처리일:</span> <span class="font-medium">${formatDateTime(r.approved_at)}</span></div>` : ''}
            ${r.rejection_reason ? `<div class="col-span-2"><span class="text-gray-500">반려사유:</span> <span class="font-medium text-red-600">${escapeHtml(r.rejection_reason)}</span></div>` : ''}
            ${r.notes ? `<div class="col-span-2"><span class="text-gray-500">비고:</span> <span class="font-medium">${escapeHtml(r.notes)}</span></div>` : ''}
        </div>
    `;
    document.getElementById('detailModal').classList.remove('hidden');
}

function closeDetailModal() {
    document.getElementById('detailModal').classList.add('hidden');
}

/* ===== Delete request ===== */
async function doDeleteRequest(id) {
    if (!confirm('이 신청을 삭제하시겠습니까?')) return;
    try {
        await api('/visit-requests/requests/' + id, { method: 'DELETE' });
        showToast('삭제되었습니다');
        await loadRequests();
    } catch (e) {
        showToast(e.message, 'error');
    }
}

/* ===== Init ===== */
function initVisitManagementPage() {
    if (!initAuth()) return;

    // Check admin
    const isAdmin = currentUser && ['admin', 'system'].includes(currentUser.role);
    if (!isAdmin) {
        document.querySelector('.flex-1.min-w-0').innerHTML = `
            <div class="bg-white rounded-xl shadow-sm p-10 text-center">
                <i class="fas fa-lock text-4xl text-gray-300 mb-4"></i>
                <p class="text-gray-500">관리자 권한이 필요합니다</p>
            </div>`;
        return;
    }

    document.getElementById('filterStatus').addEventListener('change', loadRequests);
    document.getElementById('filterType').addEventListener('change', loadRequests);
    document.getElementById('filterDateFrom').addEventListener('change', loadRequests);
    document.getElementById('filterDateTo').addEventListener('change', loadRequests);

    loadRequests();
}