<!DOCTYPE html>
<html>

<head>
    <!-- meta and links start -->
    <%- include('templet/meta')-%>
</head>

<body>
    <%- include('templet/preloder_topbar_sidebar',{titel: accessdata?.topbardata?.name})-%>
        <!--********** Content body start **********-->
        <div class="content-body">
            <div class="container-fluid" style="min-height: 100vh;">
                <div class="row">
                    <div class="d-none">
                        <input type="hidden" name="sym" value="<%= accessdata?.symbol %>">
                        <input type="hidden" name="pls" value="<%= accessdata?.plac %>">
                        <input type="hidden" name="thousands_separator" value="<%= accessdata?.thousands_separator %>">

                        <input type="hidden" id="indextosales" value="<%= countsales %>">
                        <input type="hidden" id="currencySymbol" value="<%= accessdata?.masterstore?.currency_symbol %>">

                    </div>

                    <div class="col-xl-3 col-xxl-6 col-lg-6 col-sm-6">
                        <div class="widget-stat card">
                            <div class="card-body p-4">
                                <div class="media ai-icon">
                                    <span class="me-3 bg-primary-light">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <g>
                                                <g>
                                                    <path d="M7.4831 10.261V16.9547" stroke="#130F26" stroke-width="1.5"
                                                        stroke-linecap="round" stroke-linejoin="round"></path>
                                                    <path d="M12.0368 7.05737V16.9553" stroke="#130F26"
                                                        stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path d="M16.5158 13.7983V16.9552" stroke="#130F26"
                                                        stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M2.30005 12.0369C2.30005 4.73479 4.73479 2.30005 12.0369 2.30005C19.339 2.30005 21.7737 4.73479 21.7737 12.0369C21.7737 19.339 19.339 21.7737 12.0369 21.7737C4.73479 21.7737 2.30005 19.339 2.30005 12.0369Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                </g>
                                            </g>
                                        </svg>
                                    </span>
                                    <div class="media-body">
                                        <p class="mb-1">
                                            <%= language.Total_Sales %>
                                        </p>
                                        <% if (data.tottalsales==null) { %>

                                            <h4 class="mb-0">0</h4>
                                            <% } else { %>
                                                <h4 class="mb-0 symbol">
                                                    <%= data.tottalsales.toFixed(2) %>
                                                </h4>
                                                <% } %>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-xxl-6 col-lg-6 col-sm-6">
                        <div class="widget-stat card">
                            <div class="card-body p-4">
                                <div class="media ai-icon">
                                    <span class="me-3 bg-primary-light1">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <g>
                                                <g>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M2.75 12C2.75 18.937 5.063 21.25 12 21.25C18.937 21.25 21.25 18.937 21.25 12C21.25 5.063 18.937 2.75 12 2.75C5.063 2.75 2.75 5.063 2.75 12Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M8.69775 15.3022L10.2718 10.2722L15.3018 8.69824L13.7278 13.7272L8.69775 15.3022Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                </g>
                                            </g>
                                        </svg>
                                    </span>
                                    <div class="media-body">
                                        <p class="mb-1">
                                            <%= language.Total_Order %>
                                        </p>
                                        <h4 class="mb-0">
                                            <%= data.totalorder %>
                                        </h4>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-xxl-6 col-lg-6 col-sm-6">
                        <div class="widget-stat card">
                            <div class="card-body  p-4">
                                <div class="media ai-icon">
                                    <span class="me-3 bg-primary-light2 ">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <g>
                                                <g>
                                                    <path d="M15.596 15.6963H8.37598" stroke="#130F26"
                                                        stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path d="M15.596 11.9365H8.37598" stroke="#130F26"
                                                        stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path d="M11.1312 8.17725H8.37622" stroke="#130F26"
                                                        stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M3.61011 12C3.61011 18.937 5.70811 21.25 12.0011 21.25C18.2951 21.25 20.3921 18.937 20.3921 12C20.3921 5.063 18.2951 2.75 12.0011 2.75C5.70811 2.75 3.61011 5.063 3.61011 12Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                </g>
                                            </g>
                                        </svg>
                                    </span>
                                    <div class="media-body">
                                        <p class="mb-1">
                                            <%= language.Total_Services %>
                                        </p>
                                        <h4 class="mb-0">
                                            <%= data.totalservices %>
                                        </h4>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-xxl-6 col-lg-6 col-sm-6">
                        <div class="widget-stat card">
                            <div class="card-body p-4">
                                <div class="media ai-icon">
                                    <span class="me-3 bg-primary-light3">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <g>
                                                <g>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M9.55851 21.4562C5.88651 21.4562 2.74951 20.9012 2.74951 18.6772C2.74951 16.4532 5.86651 14.4492 9.55851 14.4492C13.2305 14.4492 16.3665 16.4342 16.3665 18.6572C16.3665 20.8802 13.2505 21.4562 9.55851 21.4562Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                                        d="M9.55849 11.2776C11.9685 11.2776 13.9225 9.32356 13.9225 6.91356C13.9225 4.50356 11.9685 2.54956 9.55849 2.54956C7.14849 2.54956 5.19449 4.50356 5.19449 6.91356C5.18549 9.31556 7.12649 11.2696 9.52749 11.2776H9.55849Z"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path
                                                        d="M16.8013 10.0789C18.2043 9.70388 19.2383 8.42488 19.2383 6.90288C19.2393 5.31488 18.1123 3.98888 16.6143 3.68188"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                    <path
                                                        d="M17.4608 13.6536C19.4488 13.6536 21.1468 15.0016 21.1468 16.2046C21.1468 16.9136 20.5618 17.6416 19.6718 17.8506"
                                                        stroke="#130F26" stroke-width="1.5" stroke-linecap="round"
                                                        stroke-linejoin="round"></path>
                                                </g>
                                            </g>
                                        </svg>
                                    </span>
                                    <div class="media-body">
                                        <p class="mb-1">
                                            <%= language.Total_Customers %>
                                        </p>
                                        <h4 class="mb-0">
                                            <%= data.totalcustomer %>
                                        </h4>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-12 col-lg-12 col-xxl-12 col-sm-12">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="card-title">
                                    <%= language.Recent_Order %>
                                </h4>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive recentOrderTable">
                                    <table class="table verticle-middle table-responsive-md">
                                        <thead>
                                            <tr>
                                                <th scope="col">
                                                    <%= language.Order_Info %>
                                                </th>
                                                <th scope="col">
                                                    <%= language.Customers %>
                                                </th>
                                                <th scope="col">
                                                    <%= language.Order_Amount %>
                                                </th>
                                                <th scope="col">
                                                    <%= language.Status %>
                                                </th>
                                                <th scope="col">
                                                    <%= language.Payment_Amount %>
                                                </th>
                                                <% if (accessdata.mutibranch === true) { %>

                                                    <th scope="col">
                                                        <%= language.Store_Name %>
                                                    </th>
                                                    <% } %>
                                                        <th scope="col">
                                                            <%= language.View %>
                                                        </th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <% recentOrder.forEach(function (data){ %>
                                                <tr>
                                                    <td>
                                                        <%= data.order_id %>
                                                    </td>
                                                    <td>
                                                        <%= data.customer %>
                                                    </td>
                                                    <td class="symbol">
                                                        <%= data.gross_total %>
                                                    </td>
                                                    <td>
                                                        <% if(data.order_status==1){ %>
                                                            <button type="button"
                                                                class="btn btn-dark btn-xxs text-nowrap" disabled>
                                                                <%=data.status %>
                                                            </button>
                                                            <% }else if(data.order_status==2){ %>
                                                                <button type="button"
                                                                    class="btn btn-warning btn-xxs text-nowrap"
                                                                    disabled>
                                                                    <%=data.status %>
                                                                </button>
                                                                <% }else if(data.order_status==3){ %>
                                                                    <button type="button"
                                                                        class="btn btn-secondary btn-xxs text-nowrap"
                                                                        disabled>
                                                                        <%=data.status %>
                                                                    </button>
                                                                    <% }else if(data.order_status==4){ %>
                                                                        <button type="button"
                                                                            class="btn btn-info btn-xxs text-nowrap"
                                                                            disabled>
                                                                            <%=data.status %>
                                                                        </button>
                                                                        <% }else if(data.order_status==5){ %>
                                                                            <button type="button"
                                                                                class="btn btn-danger btn-xxs text-nowrap"
                                                                                disabled>
                                                                                <%=data.status %>
                                                                            </button>
                                                                            <% }else if(data.order_status==6){ %>
                                                                                <button type="button"
                                                                                    class="btn btn-danger btn-xxs text-nowrap"
                                                                                    disabled>
                                                                                    <%=data.status %>
                                                                                </button>
                                                                            <% } %>
                                                    </td>
                                                    <td class="symbol">
                                                        <%= data.paid_amount %>
                                                    </td>
                                                    <% if (accessdata.mutibranch === true) { %>
                                                        <td>
                                                            <%= data.store %>
                                                        </td>
                                                        <% } %>
                                                            <td>
                                                                <a href="/order/view/<%=data.id %>" type="button"
                                                                    class="btn light btn-info btn-xs">
                                                                    View
                                                                </a>
                                                            </td>
                                                </tr>
                                                <% }) %>


                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col-xl-6 col-lg-12 col-sm-12">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="card-title">Total Order Chart</h4>
                            </div>
                            <div class="card-body">
                                <canvas id="barChart_2"></canvas>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" id="indextotorder" value="<%=countorder%>">

                    <div class="col-xl-6 col-lg-12 col-sm-12">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="card-title">Total Sales Chart ( <span class="symbol">)</span></h4>
                            </div>
                            <div class="card-body">
                                <canvas id="areaChart_2"></canvas>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" id="indextosales" value="<%=countsales%>">

                </div>
            </div>


        </div>

        <!--********** Content body end **********-->
        <!--**********************************
            Footer start
        ***********************************-->

        <%- include('templet/footer')-%>

            <!--**********************************
            Footer end
        ***********************************-->

            </div>

            <!--********** Main wrapper end **********-->
            <!--**********************************
        Scripts
    ***********************************-->

            <%- include('templet/script')-%>
                <script src="../../vendor/chart.js/Chart.bundle.min.js"></script>
                <script src="../../js/plugins-init/chartjs-init.js"></script>


</body>

</html>