<?php
require_once __DIR__ . '/../../../db.php';
require_once __DIR__ . '/../../../auth.php';
requireLogin();

$user        = getCurrentUser();
$currentDate = getCurrentDate();
$currentPage = 'index_3';
$menuArea    = 'main_1';
$fullPage    = 'main_1/index_3';
$tpl         = __DIR__ . '/../../templates/';

$db = getDB();

// ── สถานที่ทั้งหมด (สำหรับ dropdown) ─────────────────────────────────────────
$locations = $db->query(
    "SELECT l.RAP_ID, l.RAP_IDNAME, l.RAP_NAME, l.RAP_PRICE,
            ISNULL(l.PR_CODE,'') PR_CODE, ISNULL(p.PR_NAME,'') PR_NAME,
            ISNULL(l.RAP_STATUS,'') RAP_STATUS, ISNULL(s.RAP_NAMESTATUS,'') RAP_NAMESTATUS
     FROM CONFIG.dbo.LOCATION_RAP l
     LEFT JOIN EHONGDB.dbo.PROV p ON l.PR_CODE = p.PR_CODE
     LEFT JOIN CONFIG.dbo.RAP_STATUS s ON l.RAP_STATUS = s.RAP_ID
     ORDER BY l.RAP_NAME"
)->fetchAll();

// ── ประวัติการจ่ายทั้งหมด ─────────────────────────────────────────────────────
$rfPayments = $db->query(
    "SELECT rf.RF_ID, rf.RAP_IDNAME, ISNULL(l.RAP_NAME,'') RAP_NAME,
            rf.RF_M, rf.RF_Y, ISNULL(rf.RF_IMG,'') RF_IMG,
            ISNULL(l.RAP_ID,0) RAP_ID, ISNULL(l.RAP_PRICE,0) RAP_PRICE,
            ISNULL(rf.RF_PRICE,'') RF_PRICE, ISNULL(rf.RF_NOTE,'') RF_NOTE,
            ISNULL(rf.RF_NOTE_P,'') RF_NOTE_P
     FROM CONFIG.dbo.LOCATION_RF rf
     LEFT JOIN CONFIG.dbo.LOCATION_RAP l ON rf.RAP_IDNAME = l.RAP_IDNAME
     ORDER BY rf.RF_ID DESC"
)->fetchAll();

$thaiMonths = [
    '1'=>'มกราคม','2'=>'กุมภาพันธ์','3'=>'มีนาคม','4'=>'เมษายน',
    '5'=>'พฤษภาคม','6'=>'มิถุนายน','7'=>'กรกฎาคม','8'=>'สิงหาคม',
    '9'=>'กันยายน','10'=>'ตุลาคม','11'=>'พฤศจิกายน','12'=>'ธันวาคม',
];
?>
<!doctype html>
<html lang="en">
<head>
  <?php include $tpl . 'backend_head.php'; ?>
  <link href="https://cdn.datatables.net/v/bs5/dt-2.0.7/datatables.min.css" rel="stylesheet">
</head>
<body class="layout-fixed sidebar-expand-lg sidebar-open bg-body-tertiary">
  <div class="app-wrapper">
    <?php include $tpl . 'backend_header.php'; ?>
    <?php include $tpl . 'backend_menu.php'; ?>
    <main class="app-main">
      <div class="app-content-header">
        <div class="container-fluid">
          <div class="row">
            <div class="col-sm-6"><h3 class="mb-0">จัดการการจ่ายค่าเช่า</h3></div>
            <div class="col-sm-6">
              <ol class="breadcrumb float-sm-end">
                <li class="breadcrumb-item"><a href="/projects/kkv1/ehongmd/ehongmd/main.php">หน้าหลัก</a></li>
                <li class="breadcrumb-item"><a href="#">ระบบเช่าสถานที่</a></li>
                <li class="breadcrumb-item active">จัดการการจ่ายค่าเช่า</li>
              </ol>
            </div>
          </div>
        </div>
      </div>
      <div class="app-content">
        <div class="container-fluid">

          <!-- ฟอร์มบันทึกการจ่าย -->
          <div class="card card-primary card-outline mb-4">
            <div class="card-header"><div class="card-title">บันทึกข้อมูลการจ่ายค่าเช่าสถานที่</div></div>
            <form id="paymentForm" action="/projects/kkv1/api.php?action=save_location_rf" method="POST" enctype="multipart/form-data">
              <div class="card-body">
                <div class="row">
                  <div class="col-md-6 mb-3">
                    <label class="form-label">ชื่อสถานที่</label>
                    <select class="form-select" id="locationSelect" name="rapId" required>
                      <option value="">-- เลือกสถานที่ --</option>
                      <?php foreach ($locations as $loc): ?>
                        <option value="<?= (int)$loc['RAP_ID'] ?>"
                          data-idname="<?= htmlspecialchars($loc['RAP_IDNAME']) ?>"
                          data-price="<?= (float)$loc['RAP_PRICE'] ?>">
                          <?= htmlspecialchars($loc['RAP_NAME']) ?>
                        </option>
                      <?php endforeach; ?>
                    </select>
                  </div>
                  <div class="col-md-6 mb-3">
                    <label class="form-label">รหัสสถานที่</label>
                    <input type="text" class="form-control" id="locationCode" name="rapIdName" readonly placeholder="ระบบจะแสดงรหัสสถานที่อัตโนมัติ" required>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-6 mb-3">
                    <label class="form-label">ค่าเช่าที่กำหนดไว้</label>
                    <div class="input-group">
                      <input type="text" class="form-control" id="rentalPrice" readonly placeholder="0.00">
                      <span class="input-group-text">บาท</span>
                    </div>
                  </div>
                  <div class="col-md-6 mb-3">
                    <label class="form-label">ระบุจำนวนเงิน</label>
                    <div class="input-group">
                      <input type="number" class="form-control" id="payAmount" name="payAmount" placeholder="ระบุจำนวนเงิน" min="0" step="0.01" required>
                      <span class="input-group-text">บาท</span>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-6 mb-3">
                    <label class="form-label">เลือกเดือนที่จะจ่าย</label>
                    <select class="form-select" id="payMonth" name="rfM" required>
                      <option value="">-- เลือกเดือน --</option>
                      <?php foreach ($thaiMonths as $k => $v): ?>
                        <option value="<?= $k ?>"><?= $v ?></option>
                      <?php endforeach; ?>
                    </select>
                  </div>
                  <div class="col-md-6 mb-3">
                    <label class="form-label">เลือกปีที่จะจ่าย</label>
                    <select class="form-select" id="payYear" name="rfY" required>
                      <option value="">-- เลือกปี --</option>
                    </select>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12 mb-3">
                    <label class="form-label">หมายเหตุ</label>
                    <textarea class="form-control" id="rfNote" name="rfNote" rows="2" placeholder="กรอกหมายเหตุ (ถ้ามี)"></textarea>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12 mb-3">
                    <label class="form-label">แนบหลักฐานการโอนเงิน (รูปภาพ)</label>
                    <input class="form-control" type="file" id="paymentSlip" name="rfImg" accept="image/*">
                    <div class="form-text text-muted">รองรับไฟล์รูปภาพเท่านั้น (PNG, JPG, JPEG)</div>
                    <div class="mt-3 text-center d-none" id="slipPreviewContainer">
                      <img id="slipPreview" src="#" alt="ตัวอย่างหลักฐาน" class="img-thumbnail" style="max-height:250px;">
                    </div>
                  </div>
                </div>
              </div>
              <div class="card-footer text-end">
                <button type="submit" class="btn btn-primary"><i class="bi bi-save me-1"></i> บันทึกข้อมูล</button>
                <button type="reset" class="btn btn-secondary" id="btnReset"><i class="bi bi-x-circle me-1"></i> ยกเลิก</button>
              </div>
            </form>
          </div>

          <!-- ตารางประวัติการจ่าย -->
          <div class="card card-outline card-info mb-4">
            <div class="card-header"><div class="card-title">ประวัติการจ่ายค่าเช่าสถานที่ทั้งหมด (LOCATION_RF)</div></div>
            <div class="card-body p-0">
              <div class="table-responsive">
                <table id="paymentTable" class="table table-striped table-hover mb-0">
                  <thead class="table-light">
                    <tr>
                      <th class="text-center" style="width:50px">ID</th>
                      <th>รหัสสถานที่</th>
                      <th>ชื่อสถานที่</th>
                      <th class="text-end">จำนวนเงิน</th>
                      <th class="text-center">เดือน</th>
                      <th class="text-center">ปี</th>
                      <th class="text-center">หมายเหตุการจ่าย</th>
                      <th class="text-center">หมายเหตุแก้ไข</th>
                      <th class="text-center">หลักฐาน (สลิป)</th>
                      <th class="text-center" style="width:120px">จัดการ</th>
                    </tr>
                  </thead>
                  <tbody>
                    <?php if (empty($rfPayments)): ?>
                      <tr><td colspan="10" class="text-center py-4 text-muted">ไม่พบข้อมูลประวัติการจ่ายเงิน</td></tr>
                    <?php else: ?>
                      <?php foreach ($rfPayments as $rf): ?>
                        <tr>
                          <td class="text-center"><?= (int)$rf['RF_ID'] ?></td>
                          <td><span class="badge text-bg-primary"><?= htmlspecialchars($rf['RAP_IDNAME']) ?></span></td>
                          <td><?= htmlspecialchars($rf['RAP_NAME']) ?></td>
                          <td class="text-end text-success fw-bold"><?= $rf['RF_PRICE'] !== '' ? htmlspecialchars($rf['RF_PRICE']) : '0.00' ?> ฿</td>
                          <td class="text-center"><?= $thaiMonths[$rf['RF_M']] ?? $rf['RF_M'] ?></td>
                          <td class="text-center">ปี <?= htmlspecialchars($rf['RF_Y']) ?></td>
                          <td><?= $rf['RF_NOTE'] ? htmlspecialchars($rf['RF_NOTE']) : '<span class="text-muted">-</span>' ?></td>
                          <td><?= $rf['RF_NOTE_P'] ? htmlspecialchars($rf['RF_NOTE_P']) : '<span class="text-muted">-</span>' ?></td>
                          <td class="text-center">
                            <?php if ($rf['RF_IMG']): ?>
                              <a href="/projects/kkv1/ehongmd/images/slips/<?= htmlspecialchars($rf['RF_IMG']) ?>" target="_blank">
                                <img src="/projects/kkv1/ehongmd/images/slips/<?= htmlspecialchars($rf['RF_IMG']) ?>" alt="สลิป" class="img-thumbnail" style="max-height:40px;cursor:pointer;">
                              </a>
                            <?php else: ?>
                              <span class="text-muted"><i class="bi bi-image"></i> ไม่มีรูปภาพ</span>
                            <?php endif; ?>
                          </td>
                          <td class="text-center">
                            <button class="btn btn-sm btn-warning text-white"
                              onclick="editPayment(
                                '<?= (int)$rf['RF_ID'] ?>',
                                '<?= htmlspecialchars(addslashes($rf['RAP_NAME'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RAP_IDNAME'])) ?>',
                                '<?= (float)$rf['RAP_PRICE'] ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_M'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_Y'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_IMG'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_PRICE'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_NOTE'])) ?>',
                                '<?= htmlspecialchars(addslashes($rf['RF_NOTE_P'])) ?>'
                              )">
                              <i class="bi bi-pencil-square"></i> แก้ไข
                            </button>
                            <button class="btn btn-sm btn-danger" onclick="deletePayment('<?= (int)$rf['RF_ID'] ?>')">
                              <i class="bi bi-trash"></i>
                            </button>
                          </td>
                        </tr>
                      <?php endforeach; ?>
                    <?php endif; ?>
                  </tbody>
                </table>
              </div>
            </div>
          </div>

        </div>
      </div>

      <!-- Edit Modal -->
      <div class="modal fade" id="editModal" tabindex="-1">
        <div class="modal-dialog">
          <div class="modal-content">
            <form id="editPaymentForm" action="/projects/kkv1/api.php?action=update_location_rf" method="POST" enctype="multipart/form-data">
              <div class="modal-header">
                <h5 class="modal-title">แก้ไขข้อมูลการจ่ายค่าเช่า</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
              </div>
              <div class="modal-body">
                <input type="hidden" id="edit_rfId" name="rfId">
                <div class="mb-3">
                  <label class="form-label">ชื่อสถานที่</label>
                  <input type="text" class="form-control" id="edit_locationName" readonly>
                </div>
                <div class="mb-3">
                  <label class="form-label">รหัสสถานที่</label>
                  <input type="text" class="form-control" id="edit_locationCode" name="rapIdName" readonly required>
                </div>
                <div class="mb-3">
                  <label class="form-label">ค่าเช่าที่กำหนดไว้</label>
                  <div class="input-group">
                    <input type="text" class="form-control" id="edit_rentalPrice" readonly>
                    <span class="input-group-text">บาท</span>
                  </div>
                </div>
                <div class="mb-3">
                  <label class="form-label">ระบุจำนวนเงิน</label>
                  <div class="input-group">
                    <input type="number" class="form-control" id="edit_payAmount" name="payAmount" min="0" step="0.01" required>
                    <span class="input-group-text">บาท</span>
                  </div>
                </div>
                <div class="mb-3">
                  <label class="form-label">เลือกเดือนที่จะจ่าย</label>
                  <select class="form-select" id="edit_payMonth" name="rfM" required>
                    <option value="">-- เลือกเดือน --</option>
                    <?php foreach ($thaiMonths as $k => $v): ?>
                      <option value="<?= $k ?>"><?= $v ?></option>
                    <?php endforeach; ?>
                  </select>
                </div>
                <div class="mb-3">
                  <label class="form-label">เลือกปีที่จะจ่าย</label>
                  <select class="form-select" id="edit_payYear" name="rfY" required>
                    <option value="">-- เลือกปี --</option>
                  </select>
                </div>
                <div class="mb-3">
                  <label class="form-label">หมายเหตุการจ่ายเดิม</label>
                  <textarea class="form-control" id="edit_rfNote" readonly rows="2"></textarea>
                </div>
                <div class="mb-3">
                  <label class="form-label">หมายเหตุแก้ไข</label>
                  <textarea class="form-control" id="edit_rfNoteP" name="rfNoteP" rows="2" placeholder="กรอกหมายเหตุการแก้ไข (ถ้ามี)"></textarea>
                </div>
                <div class="mb-3">
                  <label class="form-label">แนบหลักฐานการโอนเงินใหม่ (ไม่บังคับ)</label>
                  <input class="form-control" type="file" id="edit_paymentSlip" name="rfImg" accept="image/*">
                  <div class="form-text text-muted">หากไม่ต้องการเปลี่ยนรูปภาพ ไม่ต้องเลือกไฟล์</div>
                  <div class="mt-3 text-center">
                    <img id="edit_slipPreview" src="#" alt="สลิป" class="img-thumbnail" style="max-height:200px;display:none;">
                  </div>
                </div>
              </div>
              <div class="modal-footer">
                <button type="submit" class="btn btn-primary"><i class="bi bi-save"></i> บันทึกการเปลี่ยนแปลง</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">ยกเลิก</button>
              </div>
            </form>
          </div>
        </div>
      </div>

    </main>
    <footer class="app-footer">
      <?php include $tpl . 'backend_footer.php'; ?>
    </footer>
  </div>
  <?php include $tpl . 'backend_js.php'; ?>
  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
  <script src="https://cdn.datatables.net/v/bs5/dt-2.0.7/datatables.min.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function () {
      const locationSelect       = document.getElementById("locationSelect");
      const locationCodeInput    = document.getElementById("locationCode");
      const rentalPriceInput     = document.getElementById("rentalPrice");
      const payAmountInput       = document.getElementById("payAmount");
      const payMonthSelect       = document.getElementById("payMonth");
      const payYearSelect        = document.getElementById("payYear");
      const paymentSlip          = document.getElementById("paymentSlip");
      const slipPreviewContainer = document.getElementById("slipPreviewContainer");
      const slipPreview          = document.getElementById("slipPreview");
      const btnReset             = document.getElementById("btnReset");

      // Alerts
      const params = new URLSearchParams(window.location.search);
      if (params.has('success')) {
        const v = params.get('success');
        if (v === 'save')   alert('บันทึกข้อมูลการจ่ายค่าเช่าเรียบร้อยแล้ว');
        else if (v === 'delete') alert('ลบประวัติการจ่ายค่าเช่าเรียบร้อยแล้ว');
        else if (v === 'update') alert('แก้ไขข้อมูลการจ่ายค่าเช่าเรียบร้อยแล้ว');
        window.history.replaceState(null, null, window.location.pathname);
      } else if (params.has('error')) {
        alert('เกิดข้อผิดพลาดในการดำเนินงาน กรุณาลองใหม่อีกครั้ง');
        window.history.replaceState(null, null, window.location.pathname);
      }

      // DataTable
      $('#paymentTable').DataTable({
        language: { url: "https://cdn.datatables.net/plug-ins/1.13.7/i18n/th.json" },
        order: [[0, "desc"]]
      });

      // Year select populate
      const now         = new Date();
      const currentMonth = now.getMonth() + 1;
      const currentYear  = now.getFullYear();
      payMonthSelect.value = currentMonth;

      function populateYears(selectEl, selectedYear) {
        selectEl.innerHTML = "";
        for (let y = currentYear - 1; y <= currentYear + 2; y++) {
          const opt = document.createElement("option");
          opt.value = y;
          opt.text  = `ปี ${y + 543} (${y})`;
          if (y === (selectedYear || currentYear)) opt.selected = true;
          selectEl.appendChild(opt);
        }
      }
      populateYears(payYearSelect, currentYear);
      populateYears(document.getElementById("edit_payYear"), currentYear);

      // Location select → auto-fill code & price
      locationSelect.addEventListener("change", function () {
        const opt = this.options[this.selectedIndex];
        if (opt && opt.value !== "") {
          locationCodeInput.value = opt.getAttribute("data-idname") || "";
          const price = parseFloat(opt.getAttribute("data-price")) || 0;
          rentalPriceInput.value = price.toFixed(2);
          payAmountInput.value   = price.toFixed(2);
        } else {
          locationCodeInput.value = "";
          rentalPriceInput.value  = "";
          payAmountInput.value    = "";
        }
      });

      // Slip preview
      paymentSlip.addEventListener("change", function () {
        const file = this.files[0];
        if (file) {
          const reader = new FileReader();
          reader.onload = e => { slipPreview.src = e.target.result; slipPreviewContainer.classList.remove("d-none"); };
          reader.readAsDataURL(file);
        } else {
          slipPreview.src = "#"; slipPreviewContainer.classList.add("d-none");
        }
      });

      document.getElementById("edit_paymentSlip").addEventListener("change", function () {
        const file = this.files[0];
        const prev = document.getElementById("edit_slipPreview");
        if (file) {
          const reader = new FileReader();
          reader.onload = e => { prev.src = e.target.result; prev.style.display = "inline-block"; };
          reader.readAsDataURL(file);
        } else {
          prev.src = "#"; prev.style.display = "none";
        }
      });

      // Reset button
      btnReset.addEventListener("click", function () {
        setTimeout(() => {
          locationCodeInput.value = "";
          rentalPriceInput.value  = "";
          payAmountInput.value    = "";
          payMonthSelect.value    = currentMonth;
          payYearSelect.value     = currentYear;
          paymentSlip.value       = "";
          slipPreview.src         = "#";
          slipPreviewContainer.classList.add("d-none");
        }, 10);
      });
    });

    function editPayment(id, rapName, rapIdName, price, rfM, rfY, rfImg, rfPrice, rfNote, rfNoteP) {
      document.getElementById('edit_rfId').value        = id;
      document.getElementById('edit_locationName').value = rapName;
      document.getElementById('edit_locationCode').value = rapIdName;
      document.getElementById('edit_rentalPrice').value  = parseFloat(price||0).toFixed(2);
      document.getElementById('edit_payAmount').value    = parseFloat(rfPrice||price||0).toFixed(2);
      document.getElementById('edit_payMonth').value     = rfM;
      document.getElementById('edit_payYear').value      = rfY;
      document.getElementById('edit_rfNote').value       = rfNote || '';
      document.getElementById('edit_rfNoteP').value      = rfNoteP || '';
      document.getElementById('edit_paymentSlip').value  = '';
      const prev = document.getElementById('edit_slipPreview');
      if (rfImg) {
        prev.src           = '/projects/kkv1/ehongmd/images/slips/' + rfImg;
        prev.style.display = 'inline-block';
      } else {
        prev.src = '#'; prev.style.display = 'none';
      }
      new bootstrap.Modal(document.getElementById('editModal')).show();
    }

    function deletePayment(id) {
      if (confirm('คุณแน่ใจหรือไม่ว่าต้องการลบประวัติการจ่ายค่าเช่านี้?')) {
        window.location.href = '/projects/kkv1/api.php?action=delete_location_rf&id=' + id;
      }
    }
  </script>
</body>
</html>
