<div class="container-jcph">
        <div class="card-header text-center"><h4><%= title %></h4></div>
            <div class="table-responsive mt-2">
                <table class="table table-bordered table-striped table-hover">
                    <thead class="thead-dark" style="text-transform: uppercase;">
                        <tr>
                            <th class="text-center">Date</th>
                            <th class="text-center">Customer</th>
                            <th class="text-center">Orders</th>
                            <th class="text-center">Amount</th>
                        </tr>
                    </thead>
                    <tbody>
                        <% orders.forEach(order => { %>
                            <% if (parseFloat(order.TotalAmount) !== 0) { %>
                                <tr>
                                    <td class="nowrap">
                                        <% 
                                            const date = new Date(order.OrderDate);
                                            const year = date.getFullYear();
                                            const month = String(date.getMonth() + 1).padStart(2, '0');
                                            const day = String(date.getDate()).padStart(2, '0');
                                            const formattedDate = `${year}-${month}-${day}`;
                                        %>
                                        <form action="/payment/view-orders" method="GET" style="display:inline;">
                                            <input type="hidden" name="date" value="<%= formattedDate %>">
                                            <input type="hidden" name="client" value="<%= order.BusinessName %>">
                                            <button type="submit" class="btn btn-primary btn-sm"><%= formattedDate %></button>
                                        </form>
                                    </td>
                                    <td class="nowrap">
                                        <form action="/payment/modify-orders" method="GET" style="display:inline;">
                                            <input type="hidden" name="date" value="<%= formattedDate %>">
                                            <input type="hidden" name="client" value="<%= order.BusinessName %>">
                                            <button type="submit" class="btn-xs btn-success btn-sm"><i class="fas fa-edit"></i></button>
                                        </form>
                                        <%= order.BusinessName %>
                                    </td>
                                    <td class="text-center"><%= order.Orders %></td>
                                    <td class="text-right">₱<%= parseFloat(order.TotalAmount).toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ",") %></td>
                                </tr>
                            <% } %>
                        <% }) %>
                    </tbody>
                </table>
            </div>
        <div class="card-footer text-center">
            <button type="button" class="btn btn-secondary" onclick="window.location.href='/payment'">CANCEL</i></button>
        </div>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>