@extends('plantilla')
@section('header')
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.css"
          rel="stylesheet"/>
@endsection

@section('breadcrumbs')
    <div class="breadcrumbs" style="display:none">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-sm-4">
                    <h1>Cotizador</h1>
                </div>
                <div class="col-md-8 col-sm-8">
                    <ol class="breadcrumb pull-right">
                        <li><a href="#">Home</a></li>
                        <li><a href="#">Cotizador</a></li>
                        <li class="active">Cotiza</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('container')
    <div class="container">
        <div class="row">
            <div class="col-md-5 col-sm-4 address">
                <img src="/img/Imagen_Cotiza.jpg" />
                {{-- <img src="https://ca3e37862984ec1e90fc-0dcadfcdadef1baecb78bc8c6e947dc6.ssl.cf5.rackcdn.com/imas2.png"/> --}}
            </div>
            <div class="col-md-7 col-sm-8 address">
                <h4>Cotiza</h4>
                <div class="contact-form">
                    <form class="cmxform tasi-form" id="signupForm" name="form">
                        <div class="row">
                            <div class="form-group">
                                <div class="col-md-4">
                                    <label for="name">&iquest;Es cliente Multiva? *</label>
                                </div>
                                <div class="col-md-2">
                                    <label class="label_radio" for="es_cliente_bb_1">
                                        <input name="es_cliente_bb" value="1" id="es_cliente_bb_1"
                                               ng-model="model.es_cliente_bb" type="radio"/> Sí
                                    </label>
                                    &nbsp;&nbsp;
                                    <label class="label_radio" for="es_cliente_bb_0">
                                        <input name="es_cliente_bb" value="0" id="es_cliente_bb_0"
                                               ng-model="model.es_cliente_bb" type="radio" ng-click="noEsCliente();"/>
                                        No
                                    </label>
                                </div>
                                <div class="col-md-4" ng-show="model.es_cliente_bb == '1'">
                                    <input type="text" placeholder="" id="no_cliente_bb" ng-model="model.no_cliente_bb"
                                           class="form-control">
                                </div>
                                <div class="col-md-2" ng-show="model.es_cliente_bb == '1'">
                                    <a class="btn btn-default btn-small" ng-click="consultaClienteBB()"
                                       data-toggle="modal" href="#myModal">
                                        Consultar
                                    </a>
                                </div>
                            </div>
                        </div>
                        <hr/>
                        <div ng-show="model.continuar == 1">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="name">Email *</label>
                                        <input type="text" ng-pattern="/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/"
                                               placeholder="" id="email" ng-model="model.email"
                                               class="form-control" required>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="phone">C&oacute;digo Postal</label>
                                        <input type="text" id="codigo_postal" class="form-control col-md-5"
                                               maxlength="5" minlength="5"
                                               ng-model="model.codigo_postal"  required>
                                        <a href="#"><i class="icon-question"></i></a>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="phone">Modelo</label>
                                        <select class="form-control" name="modelo" ng-model="model.modelo" id="Select5"
                                                ng-change="getMarcas()" required>
                                            <option ng-repeat="obj in modelos">@{{obj}}</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="phone">Marca</label>
                                        <select class="form-control" name="marca" ng-model="model.marca" id="Select5"
                                                ng-change="getDescripciones()" required>
                                            <option ng-repeat="obj in marcas">@{{obj}}</option>
                                        </select>
                                    </div>
                                </div>

                            </div>
                            <div class="form-group">
                                <label for="descripcion">Descripci&oacute;n</label>
                                <select class="form-control" name="clave" id="clave" ng-model="model.clave">
                                    <option ng-repeat="option in descripciones" value="@{{option.clave}}">
                                        @{{option.descripcion}}
                                    </option>
                                </select>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="phone">Tipo de Seguro</label>
                                        <p>
                                            <input type="radio" checked name="tipo_valor" value="0" id="tipoSeguro_0"
                                                   ng-model="model.tipo_valor" required> Valor Comercial
                                            &nbsp;&nbsp;&nbsp;
                                            <input type="radio" name="tipo_valor" value="1" id="tipoSeguro_1"
                                                   ng-model="model.tipo_valor" ng-show="model.modelo >= currentYear">
                                            <span ng-show="model.modelo >= currentYear">Valor Factura</span>

                                        </p>
                                    </div>


                                </div>
                                <div class="col-md-6" ng-show="model.modelo >= currentYear && model.tipo_valor != '0'">
                                    <div class="form-group">
                                        <label for="phone">Valor Factura</label>
                                        <input type="number" id="valor_factura" name="valor_factura"
                                               ng-model="model.valor_factura"
                                               ng-required="model.modelo >= currentYear && model.tipo_valor != '0'"
                                               min="49999" max="5000001" class="form-control"/>
                                        <span ng-show="model.modelo >= currentYear" class="help-line">Valor Factura solamente disponible para autos facturados en los &uacute;ltimos 30 d&iacute;as y cuya antig&uuml;edad de modelo-A&ntilde;o no supere 12 meses</span>

                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>
                                            <input type="checkbox" ng-model="usoParticular" required/>
                                            Solo para uso particular</label>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4"></div>

                                <div class="col-md-2">
                                    <div class="form-group">
                                        <button class="btn btn-default btn-lg" type="submit"
                                                ng-click="guardaCotizacion()" ng-disabled="form.$invalid">Cotizar
                                        </button>
                                    </div>
                                </div>
                                <div class="col-md-4"></div>
                            </div>
                        </div>
                    </form>

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

    </div>
    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title">Cliente Multiva</h4>
                </div>
                <div class="modal-body" id="modalTexto">

                </div>
                <div class="modal-footer">
                    <button data-dismiss="modal" class="btn btn-danger" ng-click="noEsCliente();" type="button">
                        Cancelar
                    </button>
                    <button data-dismiss="modal" class="btn btn-default" ng-click="cargarCliente();" type="button"
                            id="btnSiEsCliente">Sí es el Cliente
                    </button>
                </div>
            </div>
        </div>
    </div>
    <!-- modal -->
@endsection

@section('footer')

    <script>

        var bbapp = angular.module('bbapp', ['ui.mask']);
        bbapp.controller('FundacionCtrl', function ($scope, $http, $httpParamSerializerJQLike) {

            var vm = this;
            vm.model = {};
            $scope.modelos = [];
            $scope.marcas = [];
            $scope.descripciones = [];
            $scope.currentYear = new Date().getFullYear();
            $scope.model = {};

            $scope.doTheBack = function () {
                window.history.back();
            };

            $scope.noEsCliente = function () {
                $scope.model.continuar = 1;
                $scope.model.no_cliente_bb = "";
                $scope.model.es_cliente_bb = "0";
                $scope.model.email = "";
                $scope.model.codigo_postal = "";
            };

            $scope.cargarCliente = function () {
                $scope.model.continuar = 1
            };

            $scope.consultaClienteBB = function () {
                $http({
                    method: 'GET',
                    url: '/api/cotizacion/BuscaCliente?no_cliente_bb=' + $scope.model.no_cliente_bb
                }).then(function (response) {
                    var datos = response.data.nombre + " " + response.data.apellido_paterno + " " + response.data.apellido_materno;
                    datos = datos + "<br />" + response.data.email;
                    datos = datos + "<br />" + response.data.calle + " " + response.data.estado + " " + response.data.municipio + " CP " + response.data.codigo_postal;
                    $scope.model.email = response.data.email;
                    $scope.model.codigo_postal = response.data.codigo_postal;
                    document.getElementById("modalTexto").innerHTML = datos;
                    document.getElementById("btnSiEsCliente").style.visibility = 'visible';
                }, function (error) {
                    document.getElementById("modalTexto").innerHTML = "CLIENTE NO ENCONTRADO";
                    document.getElementById("btnSiEsCliente").style.visibility = 'hidden';
                });
            };

            $scope.getModelos = function () {

                $http({
                    method: 'GET',
                    url: '/api/catalogos/Modelos'
                }).then(function (response) {
                    $scope.modelos = response.data;
                }, function (error) {
                    console.log("ERROR");
                    console.log(error);
                });

            };
            $scope.getMarcas = function () {

                $http({
                    method: 'GET',
                    url: '/api/catalogos/Marcas?modelo=' + $scope.model.modelo
                }).then(function (response) {
                    $scope.marcas = response.data;
                }, function (error) {
                    console.log("ERROR");
                    console.log(error);
                });


            };
            $scope.getDescripciones = function () {

                $http({
                    method: 'GET',
                    url: '/api/catalogos/Descripciones?modelo=' + $scope.model.modelo + '&marca=' + $scope.model.marca
                }).then(function (response) {
                    console.log(response);
                    $scope.descripciones = response.data;
                }, function (error) {
                    console.log("ERROR");
                    console.log(error);
                });

            };
            $scope.getForma = function () {

                $http({
                    method: 'GET',
                    url: '/api/catalogos/FormasPago'
                }).then(function (response) {
                    console.log("Entre 1");
                    console.log(response);
                }, function (error) {
                    console.log("Entre 2");
                    console.log(error);
                });

            };

            $scope.guardaCotizacion = function () {
                $scope.setdescripcionName = function () {
                    $scope.model.descripcion = $("#clave option:selected").html();
                };


                $scope.setdescripcionName();

                var config = {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                    }
                };

                $objData = $httpParamSerializerJQLike($scope.model);
                $objData = $scope.model;

                if ($scope.cotizacion_id) {
                    $ruta = '/api/cotizacion/Actualizar/' + $scope.cotizacion_id;
                    console.log($ruta);
                    $http.post($ruta, $objData).then(function (response) {
                        window.location = "/compara/" + $scope.cotizacion_id;
                    }, function (error) {
                        console.log("HAY ERROR");
                        console.log(error);
                    });
                }
                else {
                    $ruta = '/api/cotizacion/Crear';

                    $http.post($ruta, $objData).then(function (response) {
                        console.log(response);
                        window.location = "/compara/" + response.data.cotizacion.id;
                    }, function (error) {
                        console.log("ERROR");
                        console.log(error);
                    });
                }

            };
            $scope.getModelos();
            $scope.cotizacion = '{{$cotizacion}}';
            $scope.cotizacion_id = '{{isset($cotizacion->id)?$cotizacion->id:''}}';
            $scope.model.tipo_valor = "{{isset($cotizacion->tipo_valor)?:'0'}}";
            $scope.model.email = "{{isset($cotizacion->email)?$cotizacion->email:''}}";
            $scope.model.codigo_postal = "{{isset($cotizacion->codigo_postal)?$cotizacion->codigo_postal:''}}";
            $scope.model.modelo = "{{isset($cotizacion->modelo)?$cotizacion->modelo:''}}";
            $scope.model.marca = "{{isset($cotizacion->marca)?$cotizacion->marca:''}}";
            $scope.model.clave = "{{isset($cotizacion->clave)?$cotizacion->clave:''}}";
            $scope.model.forma_pago_id = '{{isset($cotizacion->cotizacion->forma_pago_id)?$cotizacion->cotizacion->forma_pago_id:'1'}}';
            $scope.model.paquete_id = '{{isset($cotizacion->cotizacion->paquete_id)?$cotizacion->cotizacion->paquete_id:'1'}}';
            $scope.model.deducible_dm = '{{isset($cotizacion->cotizacion->deducible_dm)?$cotizacion->cotizacion->deducible_dm:'5'}}';
            $scope.model.deducible_rt = '{{isset($cotizacion->cotizacion->deducible_rt)?$cotizacion->cotizacion->deducible_rt:'10'}}';
            $scope.model.es_cliente_bb = '{{isset($cotizacion->es_cliente_bb)?$cotizacion->es_cliente_bb:'xx'}}';
            $scope.model.no_cliente_bb = '{{isset($cotizacion->no_cliente_bb)?$cotizacion->no_cliente_bb:''}}';
            $scope.model.valor_factura = '{{isset($cotizacion->valor_factura)?$cotizacion->valor_factura:''}}';
            if ($scope.cotizacion_id != '') {
                if ($scope.model.es_cliente_bb == '' || $scope.model.es_cliente_bb == "0") {
                    $scope.model.es_cliente_bb = "0";
                    $scope.model.continuar = 1;
                }
                else {
                    $scope.model.es_cliente_bb = "1";
                    $scope.model.continuar = 1;
                }
            }


            console.log($scope.model);
            if ($scope.cotizacion_id) {
                $scope.getMarcas();
                $scope.getDescripciones();
            }
        });


    </script>
@endsection