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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Complains - Dashboard</title>
    <link rel="stylesheet" href="./assets/css/all.min.css">
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/fontawesome.min.css">
    <link rel="stylesheet" href="./assets/css/style.css">
</head>

<body>
    <!-- complete header section  -->
    <div class="head-Container">
        <?php include './includes/header.php'; ?>

        <div class="headBanner d-flex flex-wrap justify-content-between align-items-center mt-5 mb-5">
            <div class="banner-content">
                <h1>Complains</h1>
                <p>These Are The complains.</p>
            </div>

            <div class="bannerBtn d-flex gap-3">
                <button class="expoBtn d-flex gap-3 align-items-center"><i class="fa-solid fa-print"></i> Export
                    Report</button>
            </div>
        </div>
    </div>
    <!-- complete header section  -->

    <!-- vehicle-list section here  -->
    <div class="main-vehicleList">
        <div class="vList-header">
            <div class="listHeader-content">
                <h1>Complains</h1>
            </div>

            <div class="listheader-dropBtn d-flex flex-wrap gap-3 align-items-center">
                <button class="dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                    Pending
                </button>
                <ul class="dropdown-menu">
                    <li><a class=" dropdown-item" href="#">Rejected</a></li>
                    <li><a class="dropdown-item" href="#">Inprogress</a></li>
                    <li><a class="dropdown-item" href="#">Transfer</a></li>
                    <li><a class="dropdown-item" href="#">Complete</a></li>
                </ul>

                <button class="btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown"
                    aria-expanded="false">
                    Status
                </button>
                <ul class="dropdown-menu">
                    <li><a class="dropdown-item" href="#">No Status</a></li>
                    <li><a class="dropdown-item" href="#">No Status</a></li>
                </ul>
                <input type="date">
                <div class="d-flex flex-wrap gap-3">
                    <input type="number" placeholder="Seach Complain">
                    <button>Search</button>
                </div>
            </div>
        </div>

        <div class="mainVehicle-list py-3">
            <table>
                <tbody>
                    <tr class="theader">
                        <td>Vehcile Name</td>
                        <td>Vehicle No</td>
                        <td>Chassis No</td>
                        <td>Complain No</td>
                        <td>Date</td>
                        <td>QR Code</td>
                    </tr>

                    <tr class="tbody">
                        <td>
                            <a class="d-flex align-items-center gap-2" href="./complain-detail.php">
                                <img src="./assets/images/truck 4.png" alt="Car Detail">
                                <p>RoadMaster</p>
                            </a>
                        </td>
                        <td>ENG - 204</td>
                        <td>24883722</td>
                        <td>Com#2235</td>
                        <td>
                            <p>22/12/2022</p>
                            <h6>05:20 PM</h6>
                        </td>
                        <td>
                            <img src="./assets/images/qr.png" alt="code">
                        </td>
                    </tr>

                    <tr class="tbody">
                        <td>
                            <a class="d-flex align-items-center gap-2" href="./complain-detail.php">
                                <img src="./assets/images/truck 2.png" alt="Car Detail">
                                <p>Road Runner</p>
                            </a>
                        </td>
                        <td>ENG - 204</td>
                        <td>24883722</td>
                        <td>Com#2235</td>
                        <td>
                            <p>22/12/2022</p>
                            <h6>05:20 PM</h6>
                        </td>
                        <td>
                            <img src="./assets/images/qr.png" alt="code">
                        </td>
                    </tr>

                    <tr class="tbody">
                        <td>
                            <a class="d-flex align-items-center gap-2" href="./complain-detail.php">
                                <img src="./assets/images/truck 3.png" alt="Car Detail">
                                <p>Mighty Hauler</p>
                            </a>
                        </td>
                        <td>ENG - 204</td>
                        <td>24883722</td>
                        <td>Com#2235</td>
                        <td>
                            <p>22/12/2022</p>
                            <h6>05:20 PM</h6>
                        </td>
                        <td>
                            <img src="./assets/images/qr.png" alt="code">
                        </td>
                    </tr>

                    <tr class="tbody">
                        <td>
                            <a class="d-flex align-items-center gap-2" href="./complain-detail.php">
                                <img src="./assets/images/truck 4.png" alt="Car Detail">
                                <p>Cargo King</p>
                            </a>
                        </td>
                        <td>ENG - 204</td>
                        <td>24883722</td>
                        <td>Com#2235</td>
                        <td>
                            <p>22/12/2022</p>
                            <h6>05:20 PM</h6>
                        </td>
                        <td>
                            <img src="./assets/images/qr.png" alt="code">
                        </td>
                    </tr>

                    <tr class="tbody">
                        <td>
                            <a class="d-flex align-items-center gap-2" href="./complain-detail.php">
                                <img src="./assets/images/truck 5.png" alt="Car Detail">
                                <p>Thunder Truck</p>
                            </a>
                        </td>
                        <td>ENG - 20339</td>
                        <td>24883722</td>
                        <td>Com#2235</td>
                        <td>
                            <p>22/12/2022</p>
                            <h6>05:20 PM</h6>
                        </td>
                        <td>
                            <img src="./assets/images/qr.png" alt="code">
                        </td>
                    </tr>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <!-- vehicle-list section here  -->

    <!-- footer here  -->
    <?php include './includes/footer.php'; ?>
    <!-- footer here  -->

    <!-- logout btn here  -->
     <?php include './includes/logout.php'; ?>
    <!-- logout btn here  -->

    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="./assets/js/app.js"></script>
    <script src="./assets/js/bootstrap.bundle.min.js"></script>
    <script>
        // login-check.js
        if (localStorage.getItem("loggedIn") !== "true") {
            window.location.href = "./login/signin.php";
        }
    </script>

</body>

</html>