@extends('layouts.admin')
@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col ">
            <div class="card p-4 mb-3">

                <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Trabajo</a>
                    </li>


                    <li class="nav-item">
                        <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Actualizar</a>
                    </li>


                    <li class="nav-item">
                        <a class="nav-link" id="pills-article-tab" data-toggle="pill" href="#pills-article" role="tab" aria-controls="pills-article" aria-selected="false">ASGNAR ARTICULOS</a>
                    </li>


                </ul>
                <div class="tab-content" id="pills-tabContent">
                    <div class="tab-pane fade show active text-center" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
                        <div class="row">
                            <div class="col-md-4" style="text-align: justify;">

                                <p>USUARIO DE TRABAJO: {{$data->user->name}}</p>
                                <p>ESTADO: {{$data->estado}} </p>
                                <p>BLOQUE: {{$data->bloque}} </p>
                                <p>NUMERO: {{$data->numero}} </p>
                                <p>COLOR: {{$data->color}}</p>
                                <p>TIPO: {{$data->tamano}} </p>
                                <p>FECHA DE REGISTRO: {{$data->f_created_at}} </p>
                                <p>FECHA DE TRABAJO: {{$data->f_trabajo}}</p>
                                <p>FECHA DE ESTIAMDA DE ENTREGA: {{$data->f_estima}} </p>
                                <p>ULTIMA FECHA DE ACTUALIZACION: {{$data->updated_at}} </p>
                                <p>FECHA DE ENTREGA: {{$data->f_entrega}}</p>
                            </div>

                            <div class="col-md-4">
                                <p>Doctor:
                                    <a href="{{route('cliente.show', $data->cliente->id )}}" target="_blank"> {{$data->cliente->nombre}}</a>
                                </p>
                                <p> Paciente:
                                    <a href="{{route('paciente.show', $data->paciente->id)}}" target="_blank">
                                        {{$data->paciente->nombre}}
                                    </a>
                                </p>
                            </div>

                            <div class="col-md-4">

                                <ul class="list-group">
                                                                        @foreach ($ventas as $v)
                                    <li class="list-group-item d-flex justify-content-between align-items-center">
                                        {{ $v->articulo->nombre }}                                         <span class="badge badge-info badge-pill text-dark">Q. {{number_format($v->p_venta * $v->cantidad, 2)}}</span>

                                        <form action="{{route('venta.delete', [$v, $data->id] )}}" method="post">
                                            @csrf
                                            @method('delete')
                                            <button type='submit' class='btn btn-danger' onclick="return confitm('ESta Seguro de Eliminar')"><i class='fa fa-trash' aria-hidden='true'></i></button>
                                        </form>

                                    </li>
                                    @endforeach

                                </ul>

                                <p>TOTAL: Q. {{number_format($t, 2)}}</p>

                            </div>
                        </div>

                    </div>

                    <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
                        <h4>Actualizar</h4>

                        <form action="{{route('trabajo.update', $data->id)}}" method="post">
                            @csrf
                            @method('put')

                            <div class="row">
                                <div class="col-md-6"><select name="cliente_id" id="cliente_id" required>
                                        <option value="{{$data->cliente->id}}" selected>{{$data->cliente->nombre}}, {{$data->cliente->nit}}</option>
                                        @foreach ($clientes as $cliente)
                                        <option value="{{$cliente->id}}">{{$cliente->nombre}}, {{$cliente->nit}}</option>
                                        @endforeach
                                    </select></div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">TIPO:</label>
                                        <select class="form-control" name="tipo">
                                            <option value="{{$data->tipo}}">{{$data->tipo}}</option>
                                            <option value="NORMAL">NORMAL</option>
                                            <option value="URGENTE">URGENTE</option>
                                            <option value="NO-URGENTE">NO-URGENTE</option>
                                        </select>
                                    </div>
                                </div>
                            </div>


                            <div class="row">
                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="bloque">BLOQUE</label>
                                        <input type="text" class="form-control" value="{{$data->bloque}}" name="bloque" id="bloque">
                                    </div>
                                </div>
                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="numero">NUMERO</label>
                                        <input type="text" class="form-control" value="{{$data->numero}}" name="numero" id="numero">
                                    </div>
                                </div>
                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="color">COLOR</label>
                                        <input type="text" class="form-control" value="{{$data->color}}" name="color" id="color">
                                    </div>
                                </div>
                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="tamano">TAMAÑO:</label>
                                        <input type="text" class="form-control" value="{{$data->tamano}}" name="tamano" id="tamano">
                                    </div>
                                </div>

                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="f_trabajo">FECHA DE TRABAJO</label>
                                        <input type="date" class="form-control" value="{{$data->f_trabajo}}" name="f_trabajo" id="f_trabajo">
                                    </div>
                                </div>
                                <div class="col-md-4 p-4">
                                    <div class="form-group">
                                        <label for="f_estimada">FECHA ESTIMADA DE ENTREGA</label>
                                        <input type="date" class="form-control" value="{{$data->f_estimada}}" name="f_estimada" id="f_estimada">
                                    </div>
                                </div>
                            </div>

                            <button type="submit" class="btn btn-success btn-block my-4"><i class="fas fa-save    "></i> Actualizar</button>

                        </form>

                    </div>

                    <div class="tab-pane fade" id="pills-article" role="tabpanel" aria-labelledby="pills-article-tab">
                        <h4>VENTA DE ARTICULOS</h4>

                        <form action="{{route('venta.store')}}" method="post">
                            @csrf

                            <input type="hidden" name="cliente_id" value="{{$data->cliente_id}}">
                            <input type="hidden" name="trabajo_id" value="{{$data->id}}">

                            <input type="hidden" name="tipo" value="{{$data->tipo}}">

                            <div class="row mt-4">

                            <p>TIPO: {{$data->tamano}} </p>
                            <p>TIPO 2: {{$data->tipo}} </p>


                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="">CANTIDAD</label>
                                        <input type="text" class="form-control" name="cantidad" id="cantidad">
                                    </div>
                                </div>

                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="">ARTICULO</label>
                                        <select name="articulo_id" id="articulo_id">
                                            <option value="">SELECCIONE ARTICULO</option>
                                            @foreach ($articulos as $art)
                                            <option value="{{$art->id}}__{{$art->p_venta}}"> {{$art->nombre}} {{$art->decripcion}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="">PRECIO:</label>
                                        <input type="text" class="form-control" name="p_venta" id="p_venta">
                                    </div>
                                </div>


                            </div>
                            <button type="submit" class="btn btn-primary"><i class="fas fa-save    "></i> GUARDAR</button>

                        </form>



                    </div>



                </div>

            </div>
        </div>
    </div>
</div>

@endsection

@section('styles')
<link rel="stylesheet" href="{{asset('plugins/slim-select/slimselect.min.css')}}">
@endsection
@section('scripts')
<script src="{{asset('plugins/slim-select/slimselect.min.js')}}"></script>
<script>
    new SlimSelect({
        select: '#cliente_id'
    });
    new SlimSelect({
        select: '#articulo_id'
    });



    var select = document.getElementById("articulo_id");


    select.addEventListener("change", function() {
        var selectedOption = this.options[this.selectedIndex];

        let valor = selectedOption.value.split('__');
        let cantidad = parseFloat(document.getElementById('cantidad').value)

        // document.getElementById('p_venta').value = (valor[1] * cantidad);
     document.getElementById('p_venta').value = (valor[1]);
        
    });
</script>
@endsection