<?php
include('../config/config.php');
include('../config/session_check.php'); 
$branch_id = $_SESSION['branch_id'];
// Fetch Active Customers
$result = $conn->query("SELECT id, name, age, address, license_no, phone FROM drivers WHERE status='active' && branch_id='$branch_id'");
?>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">

  <title>Customer Master</title>
  <meta content="" name="description">
  <meta content="" name="keywords">

  <!-- Favicons -->
  <link href="../assets/img/favicon.png" rel="icon">
  <link href="../assets/img/apple-touch-icon.png" rel="apple-touch-icon">

  <!-- Google Fonts -->
  <link href="https://fonts.gstatic.com" rel="preconnect">
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="../assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <link href="../assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
  <link href="../assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
  <link href="../assets/vendor/quill/quill.snow.css" rel="stylesheet">
  <link href="../assets/vendor/quill/quill.bubble.css" rel="stylesheet">
  <link href="../assets/vendor/remixicon/remixicon.css" rel="stylesheet">
  <link href="../assets/vendor/simple-datatables/style.css" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link href="../assets/css/style.css" rel="stylesheet">
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
    @media (max-width: 768px) {
        table thead { display: none; }
        table tbody tr { display: block; margin-bottom: 1rem; border: 1px solid #ccc; padding: 1rem; }
        table tbody td { display: flex; justify-content: space-between; padding: .5rem 0; border-bottom: 1px solid #ddd; }
        table tbody td:last-child { border-bottom: none; }
        table td::before { content: attr(data-label); font-weight: bold; }
    }
    </style>
    
  

</head>

<body>

  <!-- ======= Header ======= -->
<?php include('../config/header.php'); ?> // Include the header

  <!-- ======= Sidebar ======= -->

<?php include('../config/sidebar.php'); ?>
  <main id="main" class="main">

    <div class="pagetitle">
      <h1>Data Tables</h1>
      <nav>
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="index.html">Home</a></li>
          <li class="breadcrumb-item">Tables</li>
          <li class="breadcrumb-item active">Data</li>
        </ol>
      </nav>
    </div><!-- End Page Title -->

    <section class="section">
      <div class="row">
        <div class="col-lg-12">

          <div class="card">
            <div class="card-body">
                

<div class="container mt-5">
    <h2>Driver Management</h2>
    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addDriverModal">Add Driver</button>
      <table class="table datatable">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Age</th>
                    <th>Address</th>
                    <th>License No</th>
                    <th>Phone</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <?php while ($row = $result->fetch_assoc()): ?>
                <tr>
    <td data-label="Name"><?php echo htmlspecialchars($row['name']); ?></td>
    <td data-label="Age"><?php echo htmlspecialchars($row['age']); ?></td>
    <td data-label="Address"><?php echo htmlspecialchars($row['address']); ?></td>
    <td data-label="License No"><?php echo htmlspecialchars($row['license_no']); ?></td>
    <td data-label="Phone"><?php echo htmlspecialchars($row['phone']); ?></td>
    <td data-label="Actions">
        <button onclick="editDriver(<?php echo $row['id']; ?>)" class="btn btn-warning btn-sm">Edit</button>
        <button onclick="deleteDriver(<?php echo $row['id']; ?>)" class="btn btn-danger btn-sm">Delete</button>
    </td>
</tr>

                <?php endwhile; ?>
            </tbody>
        </table>
</div>

<!-- Add Driver Modal -->
<div class="modal fade" id="addDriverModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Add New Driver</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <form id="addDriverForm">
                    <div class="mb-3">
                        <label for="driver_name" class="form-label">Name</label>
                        <input type="text" class="form-control" id="driver_name" name="name" required>
                    </div>
                    <div class="mb-3">
                        <label for="driver_age" class="form-label">Age</label>
                        <input type="number" class="form-control" id="driver_age" name="age" required>
                    </div>
                    <div class="mb-3">
                        <label for="driver_address" class="form-label">Address</label>
                        <input type="text" class="form-control" id="driver_address" name="address" required>
                    </div>
                    <div class="mb-3">
                        <label for="driver_license_no" class="form-label">License No</label>
                        <input type="text" class="form-control" id="driver_license_no" name="license_no" required>
                    </div>
                    <div class="mb-3">
                        <label for="driver_phone" class="form-label">Phone</label>
                        <input type="text" class="form-control" id="driver_phone" name="phone" required>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                <button class="btn btn-primary" onclick="submitAddDriverForm()">Save</button>
            </div>
        </div>
    </div>
</div>

<!-- Edit Driver Modal -->
<div class="modal fade" id="editDriverModal" tabindex="-1" aria-labelledby="editDriverModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editDriverModalLabel">Edit Driver</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <form id="editDriverForm">
                    <input type="hidden" id="editDriverId" name="id">
                    <div class="mb-3">
                        <label for="editName" class="form-label">Name</label>
                        <input type="text" class="form-control" id="editName" name="name" required>
                    </div>
                    <div class="mb-3">
                        <label for="editAge" class="form-label">Age</label>
                        <input type="number" class="form-control" id="editAge" name="age" required>
                    </div>
                    <div class="mb-3">
                        <label for="editAddress" class="form-label">Address</label>
                        <input type="text" class="form-control" id="editAddress" name="address" required>
                    </div>
                    <div class="mb-3">
                        <label for="editLicenseNo" class="form-label">License No</label>
                        <input type="text" class="form-control" id="editLicenseNo" name="license_no" required>
                    </div>
                    <div class="mb-3">
                        <label for="editPhone" class="form-label">Phone</label>
                        <input type="text" class="form-control" id="editPhone" name="phone" required>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" onclick="submitEditDriverForm()">Update Driver</button>
            </div>
        </div>
    </div>
</div>




            </div>  
          </div>

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

  </main><!-- End #main -->
  
  
  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script>
// Function to submit Add Driver Form
function submitAddDriverForm() {
    let formData = new FormData(document.getElementById("addDriverForm"));
    formData.append("action", "add");

    fetch("driver_actions.php", {
        method: "POST",
        body: formData
    })
    .then(response => response.text())
    .then(response => {
        alert(response); // Show response message
        $('#addDriverModal').modal('hide'); // Close modal
        location.reload(); // Reload page
    })
    .catch(error => {
        console.error("Error adding driver:", error);
        alert("Error adding driver.");
    });
}

// Function to submit Edit Driver Form
function submitEditDriverForm() {
    let formData = new FormData(document.getElementById("editDriverForm"));
    formData.append("action", "edit");

    fetch("driver_actions.php", {
        method: "POST",
        body: formData
    })
    .then(response => response.text())
    .then(response => {
        alert(response); // Show response message
        $('#editDriverModal').modal('hide'); // Close modal
        location.reload(); // Reload page
    })
    .catch(error => {
        console.error("Error updating driver:", error);
        alert("Error updating driver.");
    });
}

// Function to fetch driver data for editing
function editDriver(id) {
    fetch(`driver_actions.php?id=${id}`)
    .then(response => response.json())
    .then(data => {
        document.getElementById("editDriverId").value = id;
        document.getElementById("editName").value = data.name;
        document.getElementById("editAge").value = data.age;
        document.getElementById("editAddress").value = data.address;
        document.getElementById("editLicenseNo").value = data.license_no;
        document.getElementById("editPhone").value = data.phone;
        $('#editDriverModal').modal('show'); // Show modal
    })
    .catch(error => {
        console.error("Error fetching driver data:", error);
        alert("Error fetching driver data.");
    });
}

// Function to delete a driver (set status to inactive)
function deleteDriver(id) {
    if (confirm("Are you sure you want to delete this driver?")) {
        let formData = new FormData();
        formData.append("id", id);
        formData.append("action", "delete");

        fetch("driver_actions.php", {
            method: "POST",
            body: formData
        })
        .then(response => response.text())
        .then(response => {
            alert(response); // Show response message
            location.reload(); // Reload page
        })
        .catch(error => {
            console.error("Error deleting driver:", error);
            alert("Error deleting driver.");
        });
    }
}


</script>
  <!-- ======= Footer ======= -->
  <?php include '../config/footer.php'; ?>

  <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>

  <!-- Vendor JS Files -->
  <script src="../assets/vendor/apexcharts/apexcharts.min.js"></script>
  <script src="../assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
  <script src="../assets/vendor/chart.js/chart.umd.js"></script>
  <script src="../assets/vendor/echarts/echarts.min.js"></script>
  <script src="../assets/vendor/quill/quill.js"></script>
  <script src="../assets/vendor/simple-datatables/simple-datatables.js"></script>
  <script src="../assets/vendor/tinymce/tinymce.min.js"></script>
  <script src="../assets/vendor/php-email-form/validate.js"></script>

  <!-- Template Main JS File -->
  <script src="../assets/js/main.js"></script>

</body>

</html>