<?php
include_once "global.php";

$pageTitle = "View/Edit Lead - ";
include_once 'header.php';
$totalRecords = $crm->getTotalRecords();
$activeRecords = $crm->getActiveRecords();
$highRisk = $crm->getHighRiskRecords();
?>

<!--breadcrumb-->
<div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
    <div class="breadcrumb-title pe-3">Detection Manager</div>
    <div class="ps-3">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0 p-0">
                <li class="breadcrumb-item"><a href="javascript:;"></a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">Detection Manager</li>
            </ol>
        </nav>
    </div>
</div>
<!--end breadcrumb-->
<h6 class="mb-0 text-uppercase">View Detection Manager</h6>
<hr>
<!-- TOP STATS -->
<div class="row  g-3 mb-3">
    <div class="col-12 col-md-6 col-xl-3">
  <div class="card ui-card">
    <div class="card-body">
      <div class="stat-label">Total Records</div>
      <p class="stat-value"><?php echo $totalRecords; ?></p>
    </div>
  </div>
</div>

    <div class="col-12 col-md-6 col-xl-3">
      <div class="card ui-card">
        <div class="card-body">
          <div class="stat-label">Active</div>
          <p class="stat-value"><?php echo $activeRecords; ?></p>
        </div>
      </div>
    </div>

    <div class="col-12 col-md-6 col-xl-3">
      <div class="card ui-card">
        <div class="card-body">
          <div class="stat-label">High Risk</div>
          <p class="stat-value"><?php echo $highRisk; ?></p>
        </div>
      </div>
    </div>
</div>


<div class="card">
    <div class="card-body p-4">
        <div class="table-responsive">
            <?php $crm->detectionView(); ?>
        </div>
    </div>
</div>
<div class="modal fade" id="detectionModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-xl modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Matched Record Details</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <div class="modal-body">
        <div id="detectionModalContent">Loading...</div>
      </div>
    </div>
  </div>
</div>

<script>
$(document).on('click', '.js-view-detection', function () {
    var matchedId = $(this).data('matched-id');

    $('#detectionModalContent').html('Loading...');
    var myModal = new bootstrap.Modal(document.getElementById('detectionModal'));
    myModal.show();

    $.ajax({
        url: '<?php echo WEB_URL ?>/ajax_call?page=detectionDetailsAjax',
        type: 'POST',
        dataType: 'json',
        data: {
            action: 'detection_details',
            matched_record_id: matchedId
        },
        success: function (res) {
            if (res && res.status == 1) {
                $('#detectionModalContent').html(res.html);
            } else {
                $('#detectionModalContent').html('<div class="alert alert-danger">Failed to load.</div>');
            }
        },
        error: function () {
            $('#detectionModalContent').html('<div class="alert alert-danger">Server error.</div>');
        }
    });
});

$(document).on('click', '.js-add-note', function () {
    var matchedId = $(this).data('matched-id');
    var note = $(this).data('note') || '';

    $('#note_matched_id').val(matchedId);
    $('#review_notes').val(note);
    $('#noteMsg').html('');

    var myModal = new bootstrap.Modal(document.getElementById('noteModal'));
    myModal.show();
});

$(document).on('click', '#saveNoteBtn', function () {
    var matchedId = $('#note_matched_id').val();
    var notes = $('#review_notes').val();
    $('#noteMsg').html('<div class="alert alert-info">Saving...</div>');
    $.ajax({
        url: '<?php echo WEB_URL ?>/ajax_call?page=saveReviewNoteAjax',
        type: 'POST',
        dataType: 'json',
        data: {
            action: 'save_review_note',
            matched_record_id: matchedId,
            review_notes: notes
        },
        success: function (res) {
            if (res && res.status == 1) {
                $('#noteMsg').html('<div class="alert alert-success">Saved!</div>');
                $('.js-add-note[data-matched-id="'+matchedId+'"]').attr('data-note', notes);
            } else {
                $('#noteMsg').html('<div class="alert alert-danger">'+(res.message || 'Failed')+'</div>');
            }
        },
        error: function () {
            $('#noteMsg').html('<div class="alert alert-danger">Server error</div>');
        }
    });
});
$(document).on('click', '.js-status', function () {
    var matchedId = $(this).data('matched-id');
    var status    = $(this).data('status'); // Accept / Reject

    $.ajax({
        url: '<?php echo WEB_URL ?>/ajax_call?page=updateDetectionStatusAjax', // change to your ajax file
        type: 'POST',
        dataType: 'json',
        data: {
            action: 'update_detection_status',
            matched_record_id: matchedId,
            status: status
        },
        success: function(res){
            if(res && res.status == 1){
                // update status cell in table (optional)
                $('.js-status-cell[data-matched-id="'+matchedId+'"]').text(status);
                location.reload();
            } else {
                alert(res.message || 'Failed');
            }
        },
        error: function(){
            alert('Server error');
        }
    });
});
</script>


<?php
include_once 'footer.php';
?>