@extends('layouts.dashboard')
@section('css')
    <link href="{{ asset('css/receptores/create.css') }}" rel="stylesheet">
    <link href="{{ asset('css/picklist.css') }}" rel="stylesheet">
@endsection



@section('content')
    <style>
        span.select2-selection.select2-selection--single {
            height: calc(1.8rem + 2px);
            border: 1px solid #ced4da;
        }

        .select2-selection__placeholder {
            font-size: 0.7rem;
        }

        .select2-search__field {
            font-size: 0.7rem;
        }

        .select2-selection__arrow {
            display: none;
        }

        #select2-txt_unidadMSAT-container {
            font-size: 0.7rem !important;
            line-height: 2rem !important;
        }

        #select2-txt_claveSAT-container {
            font-size: 0.7rem !important;
            line-height: 2rem !important;
        }

        #select2-txt_claveInterna-container {
            font-size: 0.7rem !important;
            line-height: 2rem !important;
        }

        #select2-cbx_alias_search-container {
            font-size: 0.7rem !important;
            line-height: 2rem !important;
        }
    </style>

    <div class="app-page-title d-xs-none"
        style="margin-bottom: 0px;border-bottom-width: 0px;border-bottom-style: solid;padding-bottom: 17px;">
        <div class="page-title-wrapper">
            <div class="col-xl-12 d-none d-sm-none d-md-none d-lg-block">
                <div class="page-header  float-right">
                    <nav class="" aria-label=" breadcrumb">
                        <ol class="breadcrumb text-right">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Inicio</a></li>
                            <li class="breadcrumb-item"><a href="{{ route('conceptos.index') }}">Productos y servicios</a>
                            </li>
                            <li class="active breadcrumb-item" aria-current="page">Nuevo</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>

    <br>

    @if ($errors->any())
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <button type="button" class="close" aria-label="Close" data-dismiss="alert">
                <span aria-hidden="true">×</span>
            </button>

            <div class="row">
                <div class="col-1">
                    <i class="pe-7s-shield" style="font-size: 20px;"> </i>
                </div>
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>
                            <div class="col-12"><strong>
                                    <strong>{{ $error }}</strong></strong></div>
                        </li>
                    @endforeach
                </ul>


            </div>


        </div>
    @endif


    <form action="{{ url('conceptos') }}" method="POST" autocomplete="off">
        @csrf
        <div class="row d-flex justify-content-center">
            <div class="col-lg-4 col-md-12">
                <div class="card">
                    <div class="card-tab">
                        <a style="cursor: pointer;">
                            <div class="stat-widget-five">
                                <div class="stat-icon dib flat-color-2">
                                    <i class="lnr-store"></i>
                                </div>
                                <div class="stat-content">
                                    <div class="text-left dib">
                                        <div class="stat-text" style="line-height: 50px;">
                                            <span>Productos y servicios</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </a>

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

        <div class="col-md-12 card">
            <div class="card-header justify-content-between">
                Información del producto o servicio
            </div>

            <div class="row">
                <div class="card-body card-block col-lg-6">
                    <div class="row form-group">
                        <div class="col col-md-3"><label for="text-input" class=" form-control-label">Clave
                                SAT<span class="color-red " style="font-size: 10px;">*</span>
                                <a href="#question-circle" data-toggle="tooltip" data-placement="right" title=""
                                    data-original-title="Este campo hace la búsqueda por clave ó descripcion  del producto/servicio   del SAT apartir de 4 caracteres">
                                    <i class="fa fa-question-circle"></i>
                                </a>
                            </label>
                        </div>
                        <div class="col-md-9">
                            <div class="row-1">
                                <input type="text" class="form-control" list="datalist_clave_sat"
                                    placeholder="eje. de la clave SAT: 01010101" name="c_ClaveProdServ" id="c_ClaveProdServ"
                                    onkeyup="search_clave_sat(this)" onblur="cerrar_datalist(this)" />
                            </div>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col col-md-3">
                            <label for="text-input" class=" form-control-label">No. de identificación
                            </label>
                        </div>
                        <div class="col-12 col-md-9 ">
                            <input type="text" id="IdentificadorInt" maxlength="20" name="identificador_int"
                                placeholder="ej: aceite" class="form-control" value="{{ old('identificador_int') }}">
                        </div>
                    </div>

                    <div class="row form-group">
                        <div class="col col-md-3"><label for="select" class=" form-control-label">Unidad
                                M.Sat<span class="color-red " style="font-size: 10px;">*</span>
                                <a href="#question-circle" data-toggle="tooltip" data-placement="right" title=""
                                    data-original-title="Este campo hace la búsqueda por clave  ó descripcion  de la unidad de medida del SAT apartir de 2 caracteres">
                                    <i class="fa fa-question-circle"></i>
                                </a>
                            </label>
                        </div>
                        <div class="col-md-9 ">
                            <div class="row-1">
                                <input type="text" class="form-control" placeholder="eje. de la clave unidad SAT: ACT"
                                    name="c_ClaveUnidad" id="c_ClaveUnidad" onkeyup="search_unidad_sat(this)"
                                    onblur="cerrar_datalist(this)" />
                            </div>
                        </div>

                    </div>

                    <div class="row form-group">
                        <div class="col col-md-3">
                            <label for="text-input" class=" form-control-label">Unidad de medida
                            </label>
                        </div>
                        <div class="col-12 col-md-9">
                            <input type="text" id="text-input" name="unidad_medida_int" placeholder="ej: Kg"
                                class="form-control" value="{{ old('unidad_medida_int') }}">
                        </div>
                    </div>
                </div>

                <div class="card-body card-block col-lg-6">
                    <div class="row form-group  ">
                        <label for="inputPassword" class="col-md-3 form-control-label">Precio unitario<span
                                class="text-danger">*</span></label>
                        <div class="col-md-9">
                            <div class="input-group">

                                <input type="number" class="form-control input-mask-trigger" id="ValorUni" required
                                    step="any" placeholder="$ 0.00" name="valor_uni" onfocus="limpiar_input(this)"
                                    onblur="_truncar_input_decimales_config(this);" style="text-align: right;"
                                    value="{{ old('valor_uni') }}">
                            </div>
                        </div>
                    </div>
                    <div class="row form-group ">
                        <div class="col col-md-3">
                            <label for="text-input" class=" form-control-label">IVA incluido
                            </label>
                        </div>
                        <div class="col-12 col-md-9">
                            <select name="Iva" id="select" name="" class="form-control text-right">
                                <option selected value="0">No</option>
                                <option value="0.16">16 %</option>
                                <option value="0.08">8 %</option>
                            </select>
                        </div>
                    </div>

                    <div class="row form-group">
                        <div class="col col-md-3">
                            <label for="text-input" class=" form-control-label">Descuento %
                            </label>
                        </div>
                        <div class="col-md-9">
                            <div class="input-group">

                                <input class="form-control input-mask-trigger" maxlength="8" placeholder="0.00 %"
                                    data-inputmask="'alias': 'numeric', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'suffix': '%', 'placeholder': '0'"
                                    im-insert="true" style="text-align: right;" name="descuento"
                                    value="{{ old('descuento') }}">
                            </div>

                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col col-md-3">
                            <label for="text-input" class=" form-control-label">Descripción<span
                                    class="text-danger">*</span>
                            </label>
                        </div>
                        <div class="col-12 col-md-9">
                            <textarea required name="descripcion" maxlength="1000" id="textarea-input" rows="4"
                                placeholder="Agrege una descripción al producto o servicio" class="form-control">{{ old('descripcion') }}</textarea>
                        </div>
                    </div>
                </div>
            </div>



        </div>
        {{-- Datos Adicionales --}}
        <div class="card">
            <div class="row">
                <button id="botonocultamuestra" type="button" class="btn btn-lg btn-dedault btn-block">
                    <i class="fa fa-plus" id="iconn"></i>&nbsp;
                    <span id="payment-button-amount">Datos Adicionales</span>
                </button>
            </div>
            <div class="col-md-12 card" style="display:none;" id="divocultamuestra">
                {{-- <div class="card-header justify-content-between">
                    Datos adicionales
                </div> --}}

                <div class="row">
                    <div class="card-body card-block">
                        <div class="row form-group">

                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Marca
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="Marca" maxlength="15" name="marca" placeholder=""
                                    class="form-control" value="{{ old('marca') }}">
                            </div>
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Modelo
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="Modelo" maxlength="20" name="modelo" placeholder=""
                                    class="form-control" value="{{ old('modelo') }}">
                            </div>


                            <div class="col col-md-1">
                                <label for="text-input" maxlength="100" class=" form-control-label">Codigo de barra
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="CodigoBarra" maxlength="100" name="codigo_barra"
                                    placeholder="" class="form-control" value="{{ old('codigo_barra') }}">
                            </div>

                        </div>

                        <div class="row form-group">
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Peso
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="tel" id="Peso" maxlength="10" name="peso" placeholder=""
                                    class="form-control" value="{{ old('peso') }}">
                            </div>
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Tipo
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="Tipo" maxlength="20" name="tipo" placeholder=""
                                    class="form-control" value="{{ old('tipo') }}">
                            </div>


                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Numero de motor
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="NoMotor" maxlength="50" name="no_motor" placeholder=""
                                    class="form-control" value="{{ old('no_motor') }}">
                            </div>

                        </div>

                        <div class="row form-group">
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Color
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="Color" maxlength="20" name="color" placeholder=""
                                    class="form-control" value="{{ old('color') }}">
                            </div>
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Año
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="numer" id="Anio" maxlength="4" name="anio" placeholder=""
                                    class="form-control" value="{{ old('anio') }}">
                            </div>

                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Numero de serie
                                </label>
                            </div>
                            <div class="col-12 col-md-3">
                                <input type="text" id="NoSerie" maxlength="50" name="no_serie" placeholder=""
                                    class="form-control" value="{{ old('no_serie') }}">
                            </div>
                        </div>


                        <div class="row form-group">
                            <div class="col col-md-1">
                                <label for="text-input" class=" form-control-label">Descripción
                                </label>
                            </div>
                            <div class="col-12 col-md-11">
                                <textarea name="nota_interna" maxlength="250" id="NotaInterna" rows="4" placeholder="" class="form-control"> {{ old('nota_interna') }}</textarea>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        {{-- fin  Datos Adicionales --}}

        {{-- Datos Adicionales Comercio Exterior --}}
        <div class="card">
            <div class="row">
                <button id="mostrarDatosACCE" type="button" class="btn btn-lg btn-dedault btn-block">
                    <i class="fa fa-plus" id="iconCEE"></i>&nbsp;
                    <span id="payment-button-amount">Datos Adicionales para Comercio Exterior</span>
                </button>
            </div>
            <div class="col-md-12 card" style="display:none;" id="contenedorDatosAddCCE">
                {{-- <div class="card-header justify-content-between">
                        Datos adicionales para Comercio Exterior
                    </div> --}}

                <div class="row">
                    <div class="card-body card-block">
                        <div class="row form-group">

                            <div class="col col-md-2">
                                <label for="text-input" class=" form-control-label">Fraccion Arancelaria:
                                </label>
                            </div>
                            <div class="col-12 col-md-4">
                                <div class="row-1">
                                    <input type="text" id="fracAranCE" maxlength="15" name="fracAranCE"
                                        placeholder="eje. 9801000100" list="datalist_arancelaria_sat"
                                        class="form-control" value="{{ old('fracAranCE') }}"
                                        onkeyup="search_arancelia_sat(this)" onblur="cerrar_datalist(this)">
                                </div>
                            </div>
                            <div class="col col-md-2">
                                <label for="text-input" class=" form-control-label">Unidad M Aduana:
                                </label>
                            </div>
                            <div class="col-12 col-md-4">
                                <input type="text" id="unidadArancelariaCE" maxlength="20" name="unidadArancelariaCE"
                                    placeholder="Unidad M Aduana..." class="form-control"
                                    value="{{ old('unidadArancelariaCE') }}">
                            </div>

                        </div>

                        <div class="row form-group">
                            <div class="col col-md-2">
                                <label for="text-input" class=" form-control-label">Cantidad Aduana:
                                </label>
                            </div>
                            <div class="col-12 col-md-4">
                                <input type="number" id="cantidadAduanaCE" name="cantidadAduanaCE" step="0.001"
                                    placeholder="0.000" class="form-control" value="{{ old('cantidadAduanaCE') }}">
                            </div>
                            <div class="col col-md-2">
                                <label for="text-input" class=" form-control-label">Valor Unitario Aduana:
                                </label>
                            </div>
                            <div class="col-12 col-md-4">
                                <input type="number" id="valAduCE" name="valAduCE" step="0.000001"
                                    placeholder="$ 0.000000" class="form-control" value="{{ old('valAduCE') }}">
                            </div>

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

            </div>
        </div>
        {{-- fin  Datos Adicionales Comercio Exterior --}}

        {{-- Datos Adicionales informacion aduanera --}}
        <div class="card">
            <div class="row">
                <button id="mostrarInfAduanera" type="button" class="btn btn-lg btn-dedault btn-block">
                    <i class="fa fa-plus" id="iconAduanera"></i>&nbsp;
                    <span id="payment-button-amount">Datos información aduanera</span>
                </button>
            </div>
            <div class="col-md-12 card" style="display:none;" id="contenedorAduanera">
                {{-- <div class="card-header justify-content-between">
                                Datos información aduanera
                            </div> --}}

                <div class="row">
                    <div class="card-body card-block">
                        <div class="row form-group div_pedimentos">
                            <div class="col-12 col-md-2">
                                <label for="text-input" class=" form-control-label">Num. Pedimento:
                                </label>
                            </div>
                            <div class="col-10 col-md-8">
                                <div class="row-1">
                                    <input type="text" maxlength="22" name="num_pedimento[]"
                                        placeholder="eje.  10 47 3807 8003832" class="form-control"
                                        value="">
                                </div>
                            </div>
                            <div class="col-2 col-md-2">
                                <div class="menu-header-btn-pane">
                                    <button type="button" name="agregar" onclick="add_pedimento(this)"
                                        class="mb-2 mr-2 btn-icon btn-icon-only btn btn-success btn_add_aduanera"><i
                                            class="pe-7s-plus btn-icon-wrapper"> </i></button>
                                    <button type="button" name="eliminar" onclick="delete_pedimento(this)"
                                        class="mb-2 mr-2 btn-icon btn-icon-only btn btn-warning btn_del_aduanera"
                                        style="display: none"><i class="pe-7s-trash btn-icon-wrapper"> </i></button>
                                </div>
                            </div>
                        </div>
                        <div id="num_pedimento_index">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{-- fin  Datos Adicionales informacion aduanera --}}

        @if ($global == 'P')
            <div class="col-md-12 card">
                <div class="card-header justify-content-between">
                    Impuestos relacionados
                </div>

                <div class="card-body card-block">
                    {{-- inicio de select de impuesto --}}
                    <div class="col-md-12" id="list"></div>
                    {{-- fin de select de impuesto --}}

                    <div class="row form-group" style="padding: 15px;">
                        <div class="col col-md-1" style="display: none;" id="div_lbl_tipo">
                            <label for="text-input" class=" form-control-label">Tipo
                            </label>
                        </div>
                        <div class="col-12 col-md-1" style="display: none;" id="div_tipo">
                            <select id="tipo_ieps" class="form-control">
                                <option value="Tasa" selected="selected">Tasa</option>
                                <option value="Cuota">Cuota</option>
                            </select>
                        </div>

                        <div class="col col-md-1" style="display: none;" id="div_porcentaje">
                            <label for="text-input" class=" form-control-label">Porcentaje
                            </label>
                        </div>

                        <div class="col-12 col-md-2" style="margin-left: -10px; display: none;" id="div_tasa">
                            <select id="tasa_ieps" class="form-control">
                                @foreach ($C_impuesto_gti as $item)
                                    @if ($item->nombre == 'IEPS' && $item->tasa_cuota == 'Tasa')
                                        <option value="{{ $item->id_impuesto_gti }}" valor="{{ $item->tasa_cuota }}">
                                            {{ $item->nombre . ' - ' . $item->valor * 100 . '% - RET' }}
                                        </option>
                                    @endif
                                @endforeach
                            </select>
                        </div>

                        <div class="col-12 col-md-2" style="margin-left: -10px; display: none;" id="div_cuota">
                            <input type="text" id="cuota_ieps" class="form-control" placeholder="0.0 %"
                                style="text-align: right;" onkeydown="numeros(this);">
                        </div>

                    </div>

                </div>
            </div>
        @endif

        <div class="col-auto mx-auto d-flex justify-content-center mb-2 pb-3">
            <div class="col-lg-3 col-md-6 d-flex justify-content-center">
                <button type="submit" class="btn btn-lg buttom_agregar" id="add_concepto">
                    <span id="payment-button-amount">Registrar</span>
                </button>
            </div>
            <div class="col-lg-3 col-md-6 d-flex justify-content-center">
                <button id="cancel-button" type="button" class="btn btn-lg buttom_white"
                    onclick="window.location='{{ route('conceptos.index') }}'">
                    <span>Cancelar</span>
                </button>
            </div>
        </div>

    </form>
    <script>
        var available = [];
        var selected = [];
    </script>
    {{-- inicio de select de impuesto --}}
    @foreach ($C_impuesto_gti as $item)
        <script>
            if ("{{ $item->local_federal == 'L' }}") {
                impuesto = "{{ $item->nombre . ' - ' . $item->valor . '%' }}"
            } else {
                impuesto =
                    "{{ $item->valor == '0.106667' ? $item->nombre . ' - 2/3' : ($item->valor == '-1' ? $item->nombre : $item->nombre . ' - ' . $item->valor * 100 . '%') }}"
            }
            if ("{{ $item->nombre }}" != 'IEPS') {
                lbl_retencion = "{{ $item->retencion == 'Sí' && $item->traslado == 'No' ? ' - RET' : '' }}"
                available.push({
                    "id": "{{ $item->id_impuesto_gti }}",
                    "label": impuesto + lbl_retencion,
                    "factor": "{{ $item->tasa_cuota }}",
                    "name": "{{ $item->nombre }}",
                    "traslado": "{{ $item->traslado }}",
                    "retencion": "{{ $item->retencion }}",
                    "valor": "{{ $item->local_federal == 'L' ? $item->valor / 100 : $item->valor }}"
                });
            }
            array_IEPS_ = available.find(element => element.name == 'IEPS') ? true : false
            if (array_IEPS_ == false) {
                available.push({
                    "id": "IEPS",
                    "label": "IEPS",
                    "factor": "IEPS",
                    "name": "IEPS",
                    "traslado": "Sí",
                    "retencion": "Sí",
                    "valor": "IEPS"
                });
            }
        </script>
    @endforeach
    {{-- fin de select de impuesto --}}


@endsection

@section('js')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet" />
    <script src="{{ asset('js/select2.js') }}"></script>
    <script src="{{ asset('js/conceptos/cce.js') }}"></script>
    <script src="{{ asset('js/_autocompleteSAT.js?version=' . version_js()) }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/datalist-css/dist/datalist-css.min.js"></script>
    <script>
        var PorPartida = false
    </script>
    @if ($global == 'P')
        <script src="{{ asset('js/picklist.js?version=' . version_js()) }}"></script>
        <script src="{{ asset('js/conceptos/_fn.js?version=' . version_js()) }}"></script>
        <script src="{{ asset('js/conceptos/main.js?version=' . version_js()) }}"></script>
        <script>
            var PorPartida = true;
        </script>
    @endif

    <script type="text/javascript">
        function filter(__val__) {
            var preg = /^([0-9]{1,2}\.?[0-9]{0,6})$/;

            if (preg.test(__val__)) {
                return true;
            } else {
                return false;
            }

        }

        var numeros = function(text) {
            $(text).keypress(function(e) {
                if (filter(text.value + String.fromCharCode(e.charCode))) {
                    if (!onlyNumbers(e)) {
                        e.preventDefault();
                    }
                } else {
                    e.preventDefault();
                }

            });
        }
        __config_decimales__ = "{{ $No_Decimal }}"

        function onlyNumbers(e) {
            var key = e.charCode;
            return (key >= 48 && key <= 57) || key == 46;
        }
    </script>
@endsection