{% include 'components/frontHead.html' %}
<link rel="/plugins/sweetalert/sweetalert.css">
<div class="container">
    <ol class="breadcrumb noprint">
        <li><a href="#"><i class="fa fa-fw fa-home"></i> {{ breadcrumb.storeType }}</a></li>
        <li><a href="#">{{ breadcrumb.storeCity }}</a></li>
        <li class="active">Print Log</li>
    </ol>
    <div class="row">
        <div class="col-xs-12">
            <span class="noprint" style="font-size: 32px; font-weight: 600;"><i class="fa fa-bars"></i> Daily Log </span><span class="noprint logDate" style="font-size: 22px; font-style: italic;">- {{ page.date }}</span>
            <span class="noscreen" style="font-size: 24px; font-weight: 600;"><i class="fa fa-bars"></i> Daily Log </span><span class="noscreen logDate" style="font-size: 16px; font-style: italic;">- {{ page.date }}</span>

            <button class="btn btn-success float-end noprint" onclick="window.print();" style="font-size: 22px; padding: 8px 15px 8px 15px; margin: 0 10px 0 0;">
                <i class="fa fa-print"></i> Print
            </button>
            <button class="btn btn-success float-end noprint" id="datePicker" style="font-size: 22px; padding: 8px 15px 8px 15px; margin: 0 10px 0 0;">
                <i class="fa fa-calendar"></i> Date
            </button>
        </div>
    </div>
    <div class="row invoice-info noprint">
        <hr class="noprint">
        <div class="col-sm-4 invoice-col">
            <ul class="list-unstyled" id="todaysBuyers">
            </ul>
        </div>
        <div class="col-sm-4 invoice-col">
        </div>
        <div class="col-sm-4 invoice-col">
            <ul class="list-unstyled" id="todaysSorters" style="text-align: right;">

            </ul>
        </div>
    </div>
    <div class="row invoice-info noscreen">
        <hr class="noprint">
        <table width="100%">
            <tr>
                <td width="50%">
                    <ul class="list-unstyled" id="todaysBuyersPrint">
                    </ul>
                </td>
                <td width="50%">
                    <ul class="list-unstyled" id="todaysSortersPrint" style="text-align: right;">

                    </ul>
                </td>
            </tr>
        </table>
    </div>
    <div class="row">
        <div class="col-xs-12 noprint">
            <table class="table table-striped" id="printLogTable">
                <thead>
                <tr style=" font-size: 16px;">
                    <th>Buy #</th>
                    <th>Name</th>
                    <th># Bins</th>
                    <th>Dropped Off</th>
                    <th>Sorter</th>
                    <th>Buyer</th>
                    <th><a href="#" data-bs-toggle="tooltip" title="Start Delay" data-original-title="Start Delay">SD</a></th>
                    <th><a href="#" data-bs-toggle="tooltip" title="Sort Time" data-original-title="Sort Time">ST</a></th>
                    <th><a href="#" data-bs-toggle="tooltip" title="Process Time" data-original-title="Process Time">PT</a></th>
                    <th><a href="#" data-bs-toggle="tooltip" title="Process Time per Container" data-original-title="Process Time per Container">PT/C</a></th>
                    <th>Resend SMS</th>
                </tr>
                </thead>
                <tbody id="printLogTableAdd">

                </tbody>
            </table>
            <strong>** Denotes a buy from a previous day</strong>
        </div>
        <div class="col-xs-12 noscreen">
            <table class="table table-striped">
                <thead>
                <tr style=" font-size: 12px;">
                    <th>Buy #</th>
                    <th width="115">Name</th>
                    <th># Bins</th>
                    <th>Dropped Off</th>
                    <th width="100">Sorter</th>
                    <th width="100">Buyer</th>
                    <th width="85"><a href="#" data-bs-toggle="tooltip" title="Start Delay" data-original-title="Start Delay">SD</a></th>
                    <th width="65"><a href="#" data-bs-toggle="tooltip" title="Sort Time" data-original-title="Sort Time">ST</a></th>
                    <th width="65"><a href="#" data-bs-toggle="tooltip" title="Process Time" data-original-title="Process Time">PT</a></th>
                    <th width="65"><a href="#" data-bs-toggle="tooltip" title="Process Time per Container" data-original-title="Process Time per Container">PT/C</a></th>
                </tr>
                </thead>
                <tbody id="printLogPrintViewTableAdd">
                </tbody>
            </table>
            <strong>** Denotes a buy from a previous day</strong>
        </div>
    </div>
    <hr class="noprint">

    <div class="row">
        <h3 class="noprint">Buyer Stats</h3>
        <h4 class="noscreen">Buyer Stats</h4>
        <div class="col-xs-12">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>Buyer Name</th>
                    <th>Average Process Time</th>
                    <th>Average Per Container</th>
                    <th>Buys Processed</th>
                    <th>Bins Processed</th>
                </tr>
                </thead>
                <tbody id="buyerStatsAdd">
                </tbody>
            </table>
        </div>
    </div>
    <div class="row">
        <h3 class="noprint">Sorter Stats</h3>
        <h4 class="noscreen">Sorter Stats</h4>
        <div class="col-xs-12">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>Sorter Name</th>
                    <th>Average Sort Time</th>
                    <th>Average Per Container</th>
                    <th>Buys Sorted</th>
                    <th>Bins Sorted</th>
                </tr>
                </thead>
                <tbody id="sorterStatsAdd">
                </tbody>
            </table>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-6">
            <div class="bg-light border rounded p-3 noscreen">
                <address>
                    <strong>{{ breadcrumb.storeType }} - {{ breadcrumb.storeCity }}</strong><br>
                    {{ store.address }}<br>
                    {{ breadcrumb.storeCity}}, {{ store.state }} {{ store.zipcode }}<br>
                    <strong>P:</strong> {{ store.phone }}
                </address>
            </div>
        </div>
    </div>
</div>
{% include 'components/frontFoot.html' %}
<script src="/view/common/js/jquery.min.js"></script>
<script src="/js/vendor/bootstrap.bundle.min.js"></script>
<script src="/view/common/js/datatables/dataTables.bootstrap.js"></script>
<script src="/view/common/js/datatables/jquery.dataTables.js"></script>
<script src="/view/common/js/moment/moment.js"></script>
<script src="/view/common/js/moment/moment-tz.js"></script>
<script src="/view/common/js/datepicker/js/bootstrap-datepicker.min.js"></script>
<script src="/plugins/sweetalert/sweetalert.js"></script>

<script type="text/javascript">
    $(function () {
        $('[data-bs-toggle="tooltip"]').tooltip()
    });
    var datePicker = $("#datePicker");

    datePicker.datepicker({
        format: 'mm-dd-yyyy',
        endDate: moment().format("MM/DD/YYYY"),
        todayBtn: true,
        clearBtn: true,
        todayHighlight: true,
        autoclose: true

    }).on("changeDate", function(e){
        var date = moment(e.date).startOf('day').add('hours', 5);
        getPrintLog(date.format("YYYY-MM-DD 05:00:00"));
    });
    datePicker.datepicker("setDate", moment().format("MM/DD/YYYY"));

    function getPrintLog(date) {
        var date = moment(date);
        $(".logDate").each(function(i) {
            $(this).html("- "+date.format("MM/DD/YYYY"));
        });
        var store = $(".storeCode").attr("id");
        var printJSON = {store: store, date: date.startOf('day').add('hours', 5).add('minute', 1).format("YYYY-MM-DD 05:00:00")};
        var printLogTableAdd = $("#printLogTableAdd");
        var printViewAdd = $("#printLogPrintViewTableAdd");
        console.log(printJSON);
        printLogTableAdd.html("");
        printViewAdd.html("");
        $.ajax({
            url: "/api/printLog.php",
            type: "post",
            async: true,
            data: {printJSON: JSON.stringify(printJSON)},
            success: function (result) {
                console.log(result);
                var obj = JSON.parse(result);
                console.log(obj);
                $.each(obj['printLog'], function(i,val){
                    console.log(val);
                    var theHTML = "";
                    theHTML += "<tr>";
                    if(val.wasToday == "false") {
                        theHTML += "<td><strong>"+val.buyNumber+"**</strong></td>";
                    } else {
                        theHTML += "<td>"+val.buyNumber+"</td>";
                    }
                    theHTML += "<td>"+val.customerFullName+"</td>";
                    theHTML += "<td>"+val.containers+"</td>";
                    if(val.wasToday == "false") {
                        theHTML += "<td><strong>"+val.timeDroppedOff+"</strong></td>";
                    } else {
                        theHTML += "<td>"+val.timeDroppedOff+"</td>";
                    }
                    if(val.wasSorted == 1) {
                        theHTML += "<td>"+val.sorterFullName+"</td>";
                    } else {
                        theHTML += "<td> - </td>";
                    }
                    theHTML += "<td>"+val.buyerFullName+"</td>";
                    theHTML += "<td>"+val.startDelay+"</td>";
                    if(val.wasSorted == 1) {
                        theHTML += "<td>"+val.sortTime+"</td>";
                    } else {
                        theHTML += "<td> - </td>";
                    }
                    theHTML += "<td>"+val.processTime+"</td>";
                    theHTML += "<td>"+val.processTimePerContainer+"</td>";
                    theHTML += "<td><a href='#' class='resendSMSButton' data-buyid='"+val.buyID+"'><img src='/images/icons/resendsms.png'></a></td>"
                    theHTML += "</tr>";
                    printLogTableAdd.append(theHTML);
                    printViewAdd.append(theHTML);

                });
                var statsHTML = "<tr><th colspan='6' style='text-align: right;'>Store Averages: </th>";
                statsHTML += "<th>"+obj['storeStats'].storeStartDelay+"</th>";
                if(obj['storeStats'].storeSortTime !== "00s") {
                    statsHTML += "<th>"+obj['storeStats'].storeSortTime+"</th>";
                } else {
                    statsHTML += "<th> - </th>";
                }
                statsHTML += "<th>"+obj['storeStats'].storeProcessAvg+"</th>";
                statsHTML += "<th>"+obj['storeStats'].storePTC+"</th>";
                console.log(obj['storeStats']);
                statsHTML += "<th></th></tr>;"
                printLogTableAdd.append(statsHTML);
                printViewAdd.append(statsHTML);
                bindResendSMS();
                var todaysBuyers = $("#todaysBuyers");
                todaysBuyers.html("<strong>Today's Buyers</strong><br>");
                var todaysSorters = $("#todaysSorters");
                todaysSorters.html("<strong>Today's Sorters</strong><br>");
                var todaysBuyersPrint = $("#todaysBuyersPrint");
                todaysBuyersPrint.html("<strong>Today's Buyers</strong><br>");
                var todaysSortersPrint = $("#todaysSortersPrint");
                todaysSortersPrint.html("<strong>Today's Sorters</strong><br>");
                var sorterStatsAdd = $("#sorterStatsAdd");
                var buyerStatsAdd = $("#buyerStatsAdd");
                sorterStatsAdd.html("");
                buyerStatsAdd.html("");
                $.each(obj['buyerStats'], function(i,val) {
                    todaysBuyers.append("<li>"+val.buyerFullName+" <span class='badge bg-secondary'>"+val.numBuys+"</span></li>");
                    todaysBuyersPrint.append("<li>"+val.buyerFullName+" <span class='badge bg-secondary'>"+val.numBuys+"</span></li>");
                    buyerStatsAdd.append(
                            "<tr><td>"+val.buyerFullName+"</td>"+
                            "<td>"+val.averageProcessTime+"</td>"+
                            "<td>"+val.processTimePerContainer+"</td>"+
                            "<td>"+val.numBuys+"</td>"+
                            "<td>"+val.totalContainers+"</td></tr>"
                    );
                });
                $.each(obj['sorterStats'], function(i,val) {
                    todaysSorters.append("<li><span class='badge bg-secondary'>"+val.numBuys+"</span> "+val.sorterFullName+"</li>");
                    todaysSortersPrint.append("<li><span class='badge bg-secondary'>"+val.numBuys+"</span> "+val.sorterFullName+"</li>");
                    sorterStatsAdd.append(
                            "<tr><td>"+val.sorterFullName+"</td>"+
                            "<td>"+val.averageSortTime+"</td>"+
                            "<td>"+val.sortTimePerContainer+"</td>"+
                            "<td>"+val.numBuys+"</td>"+
                            "<td>"+val.totalContainers+"</td></tr>"
                    );
                });
            }

        });
    }
    function bindResendSMS() {
        $(".resendSMSButton").unbind().click(function(e) {
            e.preventDefault();
            var buyID = $(this).data("buyid");
            var store = $(".storeCode").attr("id");
            swal({
                title: "Are you sure?",
                text: "This will resend the SMS to the customer.",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "Yes, resend it!",
                closeOnConfirm: false
            }, function(){
                $.ajax({
                    url: "/api/sms/"+store+"/resendSMS/"+buyID,
                    type: "post",
                    async: true,
                    success: function (result) {
                        swal("Resent!", "The SMS has been resent.", "success");
                    },
                    error: function (result) {
                        swal("Error!", "There was an error resending the SMS. Please contact support.", "error");
                    }
                });
            })
        });
    }
</script>


</body>
</html>