<?php
include_once('../header.php');
if (!check_login()) {
  header("Location: " . WEB_URL . "logout.php");
  die();
}
?>
<!-- Content Header -->
<section class="content-header">
  <h1 style="display:flex;align-items:center;gap:10px;margin:0;">
    <i class="fa fa-archive"></i> Unit Inventory Report
  </h1>
  <ol class="breadcrumb" style="margin-top:8px;">
    <li>
      <a href="<?= WEB_URL ?>dashboard.php">
        <i class="fa fa-dashboard"></i> Home
      </a>
    </li>
    <li class="active">Unit Inventory Report</li>
  </ol>
</section>

<!-- Friendly, modern styles -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
  :root{
    --ink:#0f172a; --ink-2:#334155; --muted:#64748b; --line:#e5e7eb;
    --soft:#f8fafc; --soft2:#eef2ff; --card:#ffffff;
    --brand:#2563eb; --ok:#16a34a; --warn:#d97706; --danger:#dc2626;
  }
  .content-wrapper, .box, .btn, label, input, select {
    font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
    color:var(--ink-2);
  }

  /* Card look for AdminLTE box */
  .box.box-success{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 12px 32px rgba(2,6,23,.08);
  }
  .box .box-header{
    background:linear-gradient(135deg, var(--soft), var(--soft2));
    border-bottom:1px solid var(--line);
    padding:14px 16px;
    display:flex; align-items:center; justify-content:space-between; gap:12px;
  }
  .box .box-title{ margin:0; font-weight:600; color:var(--ink); letter-spacing:.1px; }
  .box .box-body{ padding:16px; }
  .box-footer{
    border-top:1px dashed var(--line);
    padding:12px 16px;
    display:flex; gap:8px; justify-content:flex-end; align-items:center;
    background:#fff;
  }

  /* Inputs */
  .form-control{
    border:1px solid var(--line);
    border-radius:10px;
    height:38px;
    box-shadow:none;
  }
  .form-control:focus{
    border-color:#93c5fd;
    box-shadow:0 0 0 3px rgba(59,130,246,.15);
  }
  label{ font-weight:600; color:var(--ink); }
  .hint{ color:var(--muted); font-size:12px; margin-top:4px; }

  /* Buttons */
  .btn{ border:none; font-weight:600; border-radius:10px; }
  .btn-compact{ padding:6px 12px; font-size:12px; line-height:1.25; }
  .btn-primary{ background:var(--brand); color:#fff; }
  .btn-success{ background:var(--ok); color:#fff; }
  .btn-soft{ background:#fff; border:1px solid var(--line); color:var(--ink-2); }
  .btn-danger{ background:var(--danger); color:#fff; }
  .btn:hover{ filter:brightness(.97); }
  .btn + .btn{ margin-left:6px; }

  /* Right-aligned header actions */
  .action-bar{ display:flex; gap:8px; }

  /* Divider */
  .line{
    border:0; height:1px; margin:0 16px 8px;
    background:linear-gradient(90deg, transparent, var(--line), transparent);
  }
</style>

<!-- Main content -->
<section class="content">
  <div class="row">
    <div class="col-md-12">

      <div class="box box-success">
        <div class="box-header">
          <h3 class="box-title"><i class="fa fa-filter"></i> Select Block and Unit</h3>
          <div class="action-bar">
            <!-- NEW: All Inventory (all blocks, all units) -->
            <button type="button" class="btn btn-primary btn-compact" onclick="openAllInventory()">
              <i class="fa fa-list"></i> All Inventory
            </button>
          </div>
        </div>

        <div class="box-body row">
          <!-- Block -->
          <div class="form-group col-md-6">
            <label for="bid">Select Block:</label>
            <select onchange="getUnitReport(this.value)" name="bid" id="bid" class="form-control" required>
              <option value="">--Select Block--</option>
              <?php
              $result_blocks = mysqli_query($link, "SELECT * FROM blocks ORDER BY bid ASC");
              while ($row_block = mysqli_fetch_array($result_blocks)) { ?>
                <option value="<?= $row_block['bid']; ?>"><?= $row_block['b_name']; ?></option>
              <?php } ?>
            </select>
            <div class="hint">Pick a block to load its units.</div>
          </div>

          <!-- Unit -->
          <div class="form-group col-md-6">
            <label for="ddlUnitNo">Select Unit:</label>
            <select name="ddlUnitNo" id="ddlUnitNo" class="form-control" required>
              <option value="">--Select Unit--</option>
            </select>
            <div class="hint">Or click “All Inventory” above to see every unit.</div>
          </div>
        </div>

        <hr class="line">

        <div class="box-footer">
          <button type="button" class="btn btn-soft btn-compact" onclick="clearFilters()">
            <i class="fa fa-eraser"></i> Clear
          </button>
          <div class="form-group pull-right" style="margin:0;">
            <input type="button" onclick="validateAndGenerateReport();" value="Generate Report" class="btn btn-success btn-compact" />
          </div>
        </div>
      </div>

    </div>
  </div>
</section>

<script type="text/javascript">
  function getUnitReport(blockId) {
    if (blockId !== '') {
      // Show a loading option while fetching
      $('#ddlUnitNo').html('<option value="">Loading units…</option>');
      $.ajax({
        url: '<?= WEB_URL; ?>ajax/get_units_by_block.php',
        method: 'POST',
        data: { block_id: blockId },
        success: function (response) {
          $('#ddlUnitNo').html(response);
        },
        error: function(){
          $('#ddlUnitNo').html('<option value="">--Select Unit--</option>');
          alert('Unable to load units for the selected block.');
        }
      });
    } else {
      $('#ddlUnitNo').html('<option value="">--Select Unit--</option>');
    }
  }

  function validateAndGenerateReport() {
    var bid = $("#bid").val();
    var uid = $("#ddlUnitNo").val();

    if (bid === '' || uid === '') {
      alert("Please select both Block and Unit before generating the report.\nOr use the All Inventory button.");
      return false;
    }

    window.open('<?= WEB_URL; ?>report/unit_inventory_info.php?bid=' + encodeURIComponent(bid) + '&uid=' + encodeURIComponent(uid), '_blank');
  }

  // NEW: All Inventory (no selections required)
  function openAllInventory(){
    // Adjust query string to what your report page expects. Example uses `mode=all`.
    window.open('<?= WEB_URL; ?>report/unit_inventory_info.php?mode=all', '_blank');
  }

  function clearFilters(){
    $('#bid').val('');
    $('#ddlUnitNo').html('<option value="">--Select Unit--</option>');
  }
</script>

<?php include_once('../footer.php'); ?>
