<?php $__env->startSection('head_title', __('Izlane Fakture') . ' - ' . __('Izvestaj')); ?>

<?php $__env->startPush('head_links'); ?>

<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>

<?php echo $__env->make('_layout.partials.breadcrumbs', [
    'pageTitle' => __("Izlazne Fakture"),
    'breadcrumbs' => [
        route('truck.invoices') => __('Izlazne Fakture')
    ]
], \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
<style>
    #entity-list-table thead th:first-child.sorting::after,
    #entity-list-table thead th:first-child.sorting_asc::after,
    #entity-list-table thead th:first-child.sorting_desc::after {
        display: none;
    }

    

    #entity-list-table th:nth-child(2),
    #entity-list-table td:nth-child(2) {
        max-width: 200px; 
        overflow: hidden;
        text-overflow: ellipsis; 
        white-space: nowrap; 
    }

    th, td {
        white-space: nowrap;
    }

    .dataTables_filter {
        display: none;
    }
    .date-highlight {
        padding: 5px;
        border-radius: 5px;
        display: inline-block;
    }
    .date-red {
        background-color: red;
        color: white;
    }
    .date-yellow {
        background-color: yellow;
        color: black;
    }
    .date-green {
        background-color: green;
        color: white;
    }
    .summary-box {
        padding: 20px;
        border-radius: 10px;
        color: black;
        text-align: center;
        font-size: 20px;
    }

    .summary-box {
        padding: 20px;
        border-radius: 8px;
        margin-bottom: 20px;
        background: #f8f9fa;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    .summary-eur {
        background-color: white;
    }
    .summary-km {
        background-color: white;
    }
    .summary-rsd {
        background-color: white;
    }

    .price-part-green {
        color: green;
    }
</style>
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-heading d-flex justify-content-between">
                <div class="card-heading-title">
                    <h3 class="card-title"><?php echo app('translator')->get('Izvestaj sa filterima'); ?></h3>
                </div>
            </div>
            <div class="card-body">
                <div class="row mb-3">
                    <div class="col-md-2">
                        <label for="date_start"><?php echo app('translator')->get('Datum od'); ?></label>
                        <input
                                type="text"
                                class="form-control"
                                name="date_start"
                                id="date_start"
                                value="01-01-2024"
                            >
                    </div>
                    <div class="col-md-2">
                        <label for="date_end"><?php echo app('translator')->get('Datum do'); ?></label>
                        <input
                                type="text"
                                class="form-control"
                                name="date_end"
                                id="date_end"
                                value=""
                            >
                    </div>
                    <div class="col-md-2">
                        <label for="driver"><?php echo app('translator')->get('Izaberi vozača'); ?></label>
                        <select id="driver" class="form-control">
                            <option value=""><?php echo app('translator')->get('Svi vozači'); ?></option>
                            <?php $__currentLoopData = $drivers; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $driver): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <option value="<?php echo e($driver->id); ?>"><?php echo e($driver->first_name); ?> <?php echo e($driver->last_name); ?></option>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label for="status"><?php echo app('translator')->get('Filter po statusu:'); ?></label>
                        <select id="status" class="form-control">
                            <option value=""><?php echo app('translator')->get('Svi'); ?></option>
                            <option value="1"><?php echo app('translator')->get('Plaćeno'); ?></option>
                            <option value="0"><?php echo app('translator')->get('Neplaćeno'); ?></option>
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label for="company"><?php echo app('translator')->get('Izaberi firmu'); ?></label>
                        <select id="company" class="form-control">
                            <option value=""><?php echo app('translator')->get('Sve firme'); ?></option>
                            <?php $__currentLoopData = $companies; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $company): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <option value="<?php echo e($company->id); ?>"><?php echo e($company->name); ?></option>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </select>
                    </div>
                </div>
                <div class="table-responsive">
                    <table class="table table-striped" id="entity-list-table" class="display" style="width:100%">
                        <thead>
                            <tr>
                                <th class=""><?php echo app('translator')->get('ID'); ?></th>
                                <th class=""><?php echo app('translator')->get('Firma'); ?></th>
                                <th class=""><?php echo app('translator')->get('Datum kreiranja'); ?></th>
                                <th class=""><?php echo app('translator')->get('Vozač'); ?></th>
                                <th class=""><?php echo app('translator')->get('Vozilo'); ?></th>
                                <th class=""><?php echo app('translator')->get('Rok placanja'); ?></th>
                                <th class=""><?php echo app('translator')->get('Iznos'); ?></th>
                                <th class="disabled-sorting text-right"><?php echo app('translator')->get(''); ?></th>
                            </tr>
                        </thead>
                        <tbody>
    
                        </tbody>
                    </table>
                    
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        <div class="summary-box summary-km">
            <div>Fakture u valuti KM</div>
            <div class="text-danger"><?php echo app('translator')->get('Ceka na uplatu'); ?>: <span id="paid-km">0</span> KM</div>
            <div class="text-success"><?php echo app('translator')->get('Ukupno uplaceno'); ?>: <span id="pending-km">0</span> KM</div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="summary-box summary-eur">
            <div>Fakture u valuti EUR</div>
            <div class="text-danger"><?php echo app('translator')->get('Ceka na uplatu'); ?>: <span id="pending-eur">0</span> EUR</div>
            <div class="text-success"><?php echo app('translator')->get('Ukupno uplaceno'); ?>: <span id="paid-eur">0</span> EUR</div>
        </div>
    </div>
</div>

<?php $__env->stopSection(); ?>

<?php $__env->startPush('footer_scripts'); ?>
<script>
$(function() {

    var dateFormat = 'dd/mm/yyyy';

    $('#date_start').datepicker({
            format: 'dd-mm-yyyy',
            autoclose: true,
            todayHighlight: true
        });

    $('#date_end').datepicker({
            format: 'dd-mm-yyyy',
            autoclose: true,
            todayHighlight: true
        });

    var blade = {
        datatablesAjaxUrl: "<?= route('truck.reports_datatable'); ?>",
    };

    // DATATABLES
    var table = $('#entity-list-table').DataTable({
        "autoWidth": true,
        "processing": true,
        "serverSide": true,
        "ajax": {
            url: blade.datatablesAjaxUrl,
            type: "post",
            data: function(d) {
                d.date_start = $('#date_start').val();
                d.date_end = $('#date_end').val();
                d.driver = $('#driver').val();
                d.company = $('#company').val();
                d.status = $('#status').val();
            }
        },
        "columns": [
            {"data": "id_invoice", orderable: false, "className": ""},
            {"data": "company", orderable: false, "className": ""},
            {"data": "date_start", orderable: false, searchable: false, "className": ""},
            {"data": "drivers", orderable: false,searchable: false, "className": ""},
            {"data": "trucks", orderable: false,searchable: false, "className": ""},
            {"data": "date_end", orderable: false, searchable: false, "className": ""},
            {"data": "price", orderable: false, "className": ""},
            {"data": "actions", orderable: false, searchable: false, "className": "text-right"}
        ],
        "order": [[0, "asc"]],
        "rowCallback": function(row, data, index) {
            var today = moment();
            var dateEnd = moment(data.date_end, 'DD-MM-YYYY'); // Adjust the date format to match your data

            // Reset any previous highlighting
            $('td:eq(5)', row).removeClass('date-red date-yellow date-green');

            // Add the appropriate class based on the date condition
            if (data.status == 1) {
                $('td:eq(5)', row).html('<span class="date-highlight date-green">' + data.date_end + '</span>');
            } else if (today.isSameOrAfter(dateEnd, 'day')) {
                $('td:eq(5)', row).html('<span class="date-highlight date-red">' + data.date_end + '</span>');
            } else if (today.isSameOrAfter(dateEnd.subtract(7, 'days'), 'day')) {
                $('td:eq(5)', row).html('<span class="date-highlight date-yellow">' + data.date_end + '</span>');
            } else {
                $('td:eq(5)', row).html(data.date_end);
            }
        },
        "drawCallback": function(settings) {
            var api = this.api();
            var sums = settings.json;

            // Calculate and display total sums
            var pendingKm = parseFloat(sums.sumKM.pending);
            var paidKm = parseFloat(sums.sumKM.paid);
            var pendingEur = parseFloat(sums.sumEUR.pending);
            var paidEur = parseFloat(sums.sumEUR.paid);

            // Update values in the summary boxes
            $('#paid-km').text(pendingKm.toFixed(2));
            $('#pending-km').text(paidKm.toFixed(2));
            $('#pending-eur').text(pendingEur.toFixed(2));
            $('#paid-eur').text(paidEur.toFixed(2));
        }
    });

    $('#date_start, #date_end, #driver, #company, #status').change(function() {
        table.ajax.reload();
    });

    $('#generate-pdf').on('click', function() {
        var filteredData = table.rows({ filter: 'applied' }).data().toArray();

        $.ajax({
            url: '<?php echo e(route('truck.invoices_generate_pdf')); ?>',
            type: 'POST',
            data: {
                data: filteredData,
                _token: '<?php echo e(csrf_token()); ?>'
            },
            success: function(response) {
                var link = document.createElement('a');
                link.href = response.url;
                link.download = 'tabela.pdf';
                document.body.appendChild(link);
                link.click();
                document.body.removeChild(link);
            },
            error: function(xhr, status, error) {
                console.error('Greška prilikom generisanja PDF-a:', error);
            }
        });
    });

    $(document).ready(function() {
        $('span.price-part-green').tooltip();
        $('#entity-list-table').on('mouseenter', 'span.price-part-green', function() {
        $(this).tooltip({
                title: 'Dio fakture koji je uplacen.',
                placement: 'top'  // Postavite mesto prikazivanja tooltip-a po vašoj želji
            });
        });
    });

});
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('_layout.layout', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /opt/cms/resources/views/truck/reports/invoices/index.blade.php ENDPATH**/ ?>