@extends('layouts.painel')

@section('head')
    <link rel="stylesheet" href="{{ asset('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/datatables-responsive/css/responsive.bootstrap4.min.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/datatables-buttons/css/buttons.bootstrap4.min.css') }}">
@endsection

@section('title')
    {{ $title }}
@endsection

@section('content')
    <div class="col-12">
        <div class="card">
            <div class="card-header bg-primary">
                <h3 class="card-title">Listagem de Registros</h3>
                <a href="{{ route('sale.new') }}" class="btn btn-success rounded-circle float-right text-center"
                    style="width: 35px;height: 35px;" title="Registrar nova venda">
                    <i class="fas fa-plus" style="margin-left: -2px"></i>
                </a>
                @if (auth()->user()->type == 'A' || auth()->user()->type == 'M')
                    <button type="button" class="btn btn-light rounded-circle  float-right text-center ml-2 mr-2"
                        style="width: 35px;height: 35px;" onclick="$('#modal-default').modal('show');"
                        title="Importar arquivo de retorno">
                        <i class="fas fa-file" style="margin-left: -2px"></i>
                    </button>
                @endif
            </div>
            <!-- /.card-header -->
            <div class="card-body">
                <div class="row justify-content-end">
                    <div class="d-flex justify-content-end col-lg-6 "style="margin-bottom:-45px; z-index:10">
                        <div class="dataTables_filter">
                            <form method="get">
                                <label>Buscar
                                    <input type="search" name="search" class="form-control form-control-sm">
                                </label>
                                <button type="submit" class="btn btn-info"><i class="fas fa-search"></i></button>
                            </form>
                        </div>
                    </div>
                </div>
                <table id="list" class="table table-bordered table-hover">
                    <thead>
                        <tr>
                            <th>Código</th>
                            <th>Embalado</th>
                            <th>Detalhado</th>
                            <th>Cliente</th>
                            <th>Emissão</th>
                            <th>Total</th>
                            <th style="min-width:100px;width:12%">Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($sales as $sale)
                            <tr onclick="window.location.href='{{ route('sale', $sale->id) }}'">
                                <td>
                                    @if ($sale->edited_sale)
                                        <i class="fas fa-exclamation-triangle fa-fade text-warning"></i>
                                    @endif
                                    {{ $sale->id }}
                                </td>
                                <td @if ($sale->status == 3) class="text-danger" @endif>
                                    {{ $sale->packed ? 'Sim' : 'Não' }}</td>
                                <td @if ($sale->status == 3) class="text-danger" @endif>
                                    {{ $sale->detailed ? 'Sim' : 'Não' }}</td>
                                <td @if ($sale->status == 3) class="text-danger" @endif>
                                    {{ $sale->customer_name }}
                                </td>
                                <td @if ($sale->status == 3) class="text-danger" @endif>
                                    {{ \Carbon\Carbon::parse($sale->created_at)->setTimezone('America/Sao_Paulo')->format('d/m/Y H:i:s') }}
                                </td>

                                <td @if ($sale->status == 3) class="text-danger" @endif>
                                    {{ number_format($sale->detailed ? $sale->total : $sale->total_promotional, 2, ',', '.') }}
                                </td>
                                @if ($sale->status == 1)
                                    @if ($sale->imported == 0)
                                        <td class="text-center">
                                            <span class="rounded bg-warning p-2" style="color:#fff!important">
                                                <i class="fas fa-clock"></i>
                                                Aguardando
                                            </span>
                                        </td>
                                    @elseif ($sale->imported == 1)
                                        <td class="text-center">
                                            <span class="rounded text-white p-2" style="background-color:#F012BE">
                                                <i class="fas fa-list-check"></i>
                                                Pendente
                                            </span>
                                        </td>
                                    @else
                                        <td class="text-center">
                                            <span class="rounded bg-success text-white p-2">
                                                <i class="fas fa-check"></i>
                                                Finalizado
                                            </span>
                                        </td>
                                    @endif
                                @elseif($sale->status == 0)
                                    <td class="text-center">
                                        <span class="rounded bg-primary text-white p-2">
                                            <i class="fas fa-edit">
                                            </i> Em
                                            Edição</span>
                                    </td>
                                @elseif($sale->status == 2)
                                    <td class="text-center">
                                        <span class="rounded bg-danger text-white p-2">
                                            <i class="fas fa-ban">
                                            </i> Cancelado</span>
                                    </td>
                                @endif
                            </tr>
                        @endforeach
                    </tbody>
                </table>
                <div class="row">
                    <div class="col-sm-12 col-md-5">
                        <div class="pt-4">Mostrando registro(s)
                            de {{ $sales->firstItem() }}
                            a {{ $sales->lastItem() }} do total de {{ $sales->total() }} registro(s)</div>
                    </div>
                    <div class="col-sm-12 col-md-7">
                        <div class="justify-content-end d-flex pt-3">
                            {{ $sales->links() }}
                        </div>
                    </div>
                </div>

            </div>
            <!-- /.card-body -->
        </div>
        <!-- /.card -->
    </div>

    <!--modal -->
    <div class="modal fade" id="modal-default">
        <div class="modal-dialog">
            <div class="modal-content">


                <div class="modal-header bg-primary">
                    <h4 class="modal-title" id="modal-title">
                        Importar arquivo de retorno
                    </h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"
                        onclick="$('#modal-default').modal('hide');">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form method="POST" id="sales-return" enctype="multipart/form-data" action="{{ route('sale.return') }}">
                    <div class="modal-body">
                        <div class="row">
                            @csrf
                            <div class="form-group col-lg-12">
                                <label>Arquivo a ser importado</label>
                                <input type="file" class="form-control" id="file" name="file" accept=".txt">
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                        <button type="submit" class="btn btn-primary" id="import">Salvar</button>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->
@endsection

@section('scripts')
    <script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-responsive/js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/jszip/jszip.min.js') }}"></script>
    <script src="{{ asset('plugins/pdfmake/pdfmake.min.js') }}"></script>
    <script src="{{ asset('plugins/pdfmake/vfs_fonts.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.html5.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.print.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.colVis.min.js') }}"></script>


    <script>
        let delay = 2000;
        let Toast = Swal.mixin({
            toast: true,
            position: 'top-end',
            showConfirmButton: false,
            timer: delay
        });

        $(function() {

            $('#list').DataTable({
                "paging": false,
                "lengthChange": false,
                "searching": false,
                "ordering": false,
                "info": false,
                "autoWidth": false,
                "responsive": true,
                "buttons": ["excel", "pdf"],
                "oLanguage": {
                    "sProcessing": "@lang('datatable.processing')",
                    "sLengthMenu": "@lang('datatable.showRows')",
                    "sZeroRecords": "@lang('datatable.noResults')",
                    "sEmptyTable": "@lang('datatable.noDataAvailable')",
                    "sInfo": "@lang('datatable.showFrom')",
                    "sInfoEmpty": "@lang('datatable.showEmpty')",
                    "sInfoFiltered": "@lang('datatable.filterTotal')",
                    "sInfoPostFix": "",
                    "sSearch": "@lang('datatable.search')",
                    "sUrl": "",
                    "sInfoThousands": "@lang('datatable.thousandsSeparator')",
                    "sLoadingRecords": "@lang('datatable.loading')",
                    "oPaginate": {
                        "sFirst": "@lang('datatable.first')",
                        "sLast": "@lang('datatable.last')",
                        "sNext": "@lang('datatable.next')",
                        "sPrevious": "@lang('datatable.previous')"
                    }
                },
                "rowId": 'id',
                "order": [
                    [0, "desc"]
                ]
            }).buttons().container().appendTo('#list_wrapper .col-md-6:eq(0)');
        });
        $("#import").click(function() {
            $('#import').prop('disabled', true);
            $('#import').html('<i class="fas fa-cog fa-spin"></i> Importando...');
            $('#sales-return').submit()
        });

        $("#tipo_desconto_id").change(function() {

            let type = $("#tipo_desconto_id").val();

            if (type == '1') { //Valor 1
                $('#medicao_item_id').prop('disabled', false); //desabilitar
                $('#rateio_id').prop('disabled', true); //habilitar
            } else if (type == '2') { //Valor 2
                $('#medicao_item_id').prop('disabled', true); //habilitar
                $('#rateio_id').prop('disabled', false); //desabilitar
            } else { //Valor ""
                $('#medicao_item_id').prop('disabled', false); //desabilitar
                $('#rateio_id').prop('disabled', true); //habilitar
            }
        });
    </script>
@endsection