@extends('adminlte::page')

@section('title', 'Recepción de Monturas')

@section('content_header')
    <h1>Recepción de Monturas</h1>
@stop

@section('content')
    <div class="row">
        <div class="col-xl-12">
            <div class="card">
                <div class="card-body">
                    {{-- @if (isset($permission['new']) && $permission['new'])
                    <div class="text-right p-4">
                        <a href="{{route('frames.create')}}" class="btn btn-success"><i class="fas fa-fw  fa-plus"></i> Nueva Montura</a>
                    </div>
                    @endif --}}
                    <div class="row">
                        <div class="col-xl-12 col-lg-12">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>Sucursal Origen</th>
                                        <th>Fecha de Transferencia</th>
                                        <th>Detalles</th>
                                        <th>Monturas Enviadas</th>
                                        <th>Monturas Disponibles</th>
                                        <th>Monturas Verificadas</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>{{$branch_origin->name}} ({{$user_origin}})</td>
                                        <td>{{convertDateEs($date_transfer,'dt')}}</td>
                                        <td>{{$receptionframe->details}}</td>
                                        <td class="text-left"><span class=""><b>{{count($receptionframe->frames)}}</b></span></td>
                                        <td class="text-left"><span class="alert alert-success p-2" id="label-total-frames-available"></span></td>
                                        <td><b id="label-total-frames-verified">0</b></td>
                                    </tr>
                                </tbody>
                            </table>

                        </div>
                    </div>

                    <form action="{{route('inventory.receptionframes.searchtransferframes')}}" method="POST" class="form-search-receptionframes">
                        <div class="row mb-3">
                            <div class="col-xl-4">
                                <div class="row">
                                    <div class="col-xl-3 col-lg-3 text-xl-right text-lg-right">
                                        Código de Montura
                                    </div>
                                    <div class="col-xl-9 col-lg-9">
                                        <input type="search" name="code" class="form-control"   value="{{old('code')}}" placeholder="NAO660846SC 46-17-127">
                                    </div>
                                </div>    
                            </div>
                            <div class="col-xl-4">
                                <div class="row">
                                    <div class="col-xl-3 col-lg-3 text-xl-right text-lg-right">
                                        Código de Barra o Código QR
                                    </div>
                                    <div class="col-xl-9 col-lg-9">
                                        <input type="search" name="qrcode" class="form-control" autofocus  value="{{old('qrcode')}}" placeholder="">
                                    </div>
                                </div>    
                            </div>
                            <div class="col-xl-2">
                                <input type="submit" value="Buscar" class="btn btn-info">
                                
                            </div>
                        </div>  
                    </form>
                    <hr>
                    <div class="table-responsives">
                        <form action="{{route('receptionframes.update',$receptionframe->id_transfer_frame)}}" method="POST" class="form-reception-frames">
                            @method('PUT')
                            @csrf
                            <table class="table  table-bordered table-striped table-hover table-s table-listq" id="table-list">
                                <thead class="thead-dark">
                                    <tr>
                                        <th width="10">N</th>
                                        <th width="100">Montura</th>
                                        <th width="100">Observación</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($frames as $frame)
                                        <tr>
                                            <td class="text-center">{{$loop->iteration}}
                                                <br>
                                                <input type="hidden" name="p[{{$loop->iteration}}][id_inventory_frame]" value="{{$frame->id_inventory_frame}}">
                                                <input type="checkbox" class="form-control checkframes" name="p[{{$loop->iteration}}][code]" value="on" data-code="{{$frame->code}}" data-qrcode="{{$frame->qrcode}}" {{($frame->status_transfer == 0 || $frame->status==0)?'disabled':''}}>
                                                <span class="status_frame" data-code="{{$frame->code}}" data-qrcode="{{$frame->qrcode}}">{{$frame->status_transfer == 0?'Transferido':($frame->status == 0?'Deshabilitado':'No Recibido')}}</span>
                                            </td>
                                            <td>
                                                <table class="table table-sm">
                                                    <tbody>
                                                        <tr>
                                                            <td><small>Marca:</small></td>
                                                            <td>{{$frame->brand->name}}</td>
                                                        </tr>
                                                        <tr>
                                                            <td><small>Tipo de Montura:</small></td>
                                                            <td>{{$frame->frameType->name}}</td>
                                                        </tr>
                                                        <tr>
                                                            <td><small>Código:</small></td>
                                                            <td>{{$frame->code}}</td>
                                                        </tr>
                                                        @if (!is_null($frame->detailsinactive))
                                                            <tr class="">
                                                                <td><small>Detalles de deshabilitación:</small></td>
                                                                <td><span class="alert alert-danger p-1">{{$frame->detailsinactive}}</span></td>
                                                            </tr>
                                                        @endif
                                                    </tbody>
                                                </table>
                                            </td>
                                            <td>
                                                <textarea name="p[{{$loop->iteration}}][observations]" class="form-control" {{($frame->status_transfer == 0 || $frame->status==0)?'disabled':''}}>{{$frame->observations}}</textarea>
                                                @if (isset($permission['view_administrator']) && $permission['view_administrator'] && $frame->status_transfer == 1 && $frame->status == 1)
                                                    <select name="p[{{$loop->iteration}}][status_frame_no_checked]"  class="form-control status_frame_no_checked" data-code="{{$frame->code}}" data-qrcode="{{$frame->qrcode}}">
                                                        <option value="">Seleccionar</option>
                                                        <option value="leave_in_origin">Dejar en la sucursal origen</option>
                                                    </select>
                                                @endif
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                            
                            <div class="row mb-3">
                                <div class="col-xl-3 col-lg-3 text-xl-right text-lg-right">
                                    Detalles
                                </div>
                                <div class="col-xl-9 col-lg-9">
                                    <textarea name="reception_details" class="form-control" required>{{old('reception_details')??$receptionframe->reception_details}}</textarea>
                                </div>
                            </div>
                            <div class="row ">
                                <div class="col-xl-12 col-lg-12 text-center">

                                    <input type="submit" value="Guardar" class="btn btn-success">
                                </div>
                            </div>
                        </form>
                    </div>
            </div>
            </div>
        </div>

    </div>
@stop

@section('css')

@stop

@section('js')
<script>

    function changeLabel(code,label){
        $(".status_frame[data-code="+code+"]").html(label)
    }

    function countTotalCheckFrames(){
        let ids = $(".checkframes:checked");
        let count= ids.length;
        $("#label-total-frames-verified").html(count);
    }
    let total_transfer_frames = {{$frames->count()}};
    
    $(document).ready(function(){

        $(".checkframes").change(function(){
            let code = $(this).data('code');
            let qrcode = $(this).data('qrcode');
            countTotalCheckFrames();
            if($(this).is(':checked')){
                changeLabel(code,'Recibido');
            }else{
                changeLabel(code,'No Recibido');
            }
        });

        let label_total_frames_available = $(".checkframes:not([disabled])").length;
        console.log({label_total_frames_available});
        $("#label-total-frames-available").html(label_total_frames_available);
        $(".form-search-receptionframes").submit(function(e){
            e.preventDefault();
            let checkframes = Array();
            let url = $(this).attr("action");
            let code = $("[name=code]").val();
            let qrcode = $("[name=qrcode]").val();
            if(code != ""){
                checkframes = $(".checkframes[data-code="+code+"]");
            }
            if(qrcode != ""){
                checkframes = $(".checkframes[data-qrcode="+qrcode+"]");
            }
            let countframes = checkframes.length;
            if(countframes == 0){
                Swal.fire({
                    icon: 'error',
                    title: 'Oops...',
                    text: "No existe la montura solicitada",
                    confirmButtonText: 'Aceptar'
                    })
            }else if(countframes > 1 ){
                Swal.fire({
                    icon: 'error',
                    title: 'Oops...',
                    text: "Existe dos o más monturas con este código",
                    confirmButtonText: 'Aceptar'
                    })
            }else{
                checkframes.prop('checked', true);
                let codeName = checkframes.data('code');
                changeLabel(codeName,'Recibido');
                $("[name=code]").val('');
                $("[name=qrcode]").val('');
                countTotalCheckFrames();
            }
                
                
        });
        switchSubmit  = false;
        $(".form-reception-frames").submit(function(e){
            if(!switchSubmit) {
                e.preventDefault();
                ids = $(".checkframes:checked");
                console.log({ids});
                if (ids.length > 0){

                
                    let user = $("#name-full-user-login").html();
                    Swal.fire({
                            title: 'Recepción de Monturas',
                            html: `<b>${user}</b><br> ¿Desea confirmar la recepción de ${ids.length} monturas?`,
                            icon: 'warning',
                            showCancelButton: true,
                            confirmButtonColor: '#3085d6',
                            cancelButtonColor: '#e37878',
                            confirmButtonText: 'Si',
                            cancelButtonText: 'No',
                        }).then((result) => {
                            if (result.isConfirmed) {
                                switchSubmit = true;
                                $(this).submit();
                            }
                        })
                }else{

                    let actions_no_checked = false;
                    $(".status_frame_no_checked").each(function(){
                        let val = $(this).val();
                        if(val !=""){
                            actions_no_checked = true;
                            console.log({"this":this});
                        }
                    });
                    if(actions_no_checked){
                        let user = $("#name-full-user-login").html();
                        Swal.fire({
                            title: 'Recepción de Monturas',
                            html: `<b>${user}</b><br> ¿Desea confirmar la recepción de ${ids.length} monturas?`,
                            icon: 'warning',
                            showCancelButton: true,
                            confirmButtonColor: '#3085d6',
                            cancelButtonColor: '#e37878',
                            confirmButtonText: 'Si',
                            cancelButtonText: 'No',
                        }).then((result) => {
                            if (result.isConfirmed) {
                                switchSubmit = true;
                                $(this).submit();
                            }
                        })
                    }else{

                        Swal.fire({
                        icon: 'error',
                        title: 'Oops...',
                        text: "Ninguna montura fue seleccionada",
                        confirmButtonText: 'Aceptar'
                        })
                    }
                }
            }

        });
    })
</script>
@stop