@include('custom_questions.custom_request_service')

@extends ('body_content')



@section ('body')


    <section  class="ng-cloak" ng-app="professionalQuoteApp" ng-controller="professionalCtrl as professional" ng-cloak>


        <div ng-show="professional.updateprofile">
            <div>
                <div class="row mt-10">
                    <div class="col-md-12 text-center">
                        <h3 class="text-center"> Para continuar
                            <br>
                            agradecemos actualice sus datos
                        </h3>
                        <div class="separator"></div>
                        <p class="large text-center">
                            Necesitamos conocer su n&uacute;mero de tel&eacute;fono y ubicaci&oacute;n antes de
                            continuar
                        </p>
                        <br>
                        <a href="usuario-perfil" class="btn btn-default-transparent btn-lg">
                            Actualizar mis datos <i class="fa fa-chevron-right pr-10"></i></a>
                    </div>
                </div>
            </div>
        </div>


        <form id="quoteForm" name="quoteForm" class="form-horizontal" method="post"  novalidate>
           <div class="row match-my-cols bordered" ng-show="!professional.updateprofile">
            <div class="col-xs-12 col-sm-4 col-md-4 col-lg-3 light-gray-bg col-eq">
                <div class="testimonial text-center">
                    <div class="testimonial-image">
\                        <img src="@{{professional.request.avatar}}" style="width: 90px;height: 90px"
                             class="img-circle">
                    </div>
                    <div class="mt-5"></div>
                    <h3 class="margin-clear" style="text-transform: capitalize">@{{professional.request.nombre}} @{{ professional.request.apellido }}</h3>
                    <div class="mt-5"></div>
                    <h3 class="margin-top-clear" ng-show="professional.request.id_tipo_identificacion==9">Empresa: @{{ professional.request.empresa}}XXX</h3>
                    <div class="mt-5"></div>
                    <div id="promedio"><input name="rating" ng-value="professional.request.rating_promedio || 0" class="valoracion rating-loading" data-size="xss"></div>

                   <h3 class="title"><a href=""> @{{ professional.request.root_service.nombre }} </a></h3>


                    <div>
                        <div ng-controller="serviceCtlr as service" >
                            @yield("questions")
                            <button  class="btn btn-default-transparent btn-sm pull-rigth"
                                     ng-click="service.getUserCustomRequest(professional.request.id)">
                                Requerimientos
                            </button>

                            <div  id="noRequirements" class="alert alert-warning buttons-hide" role="alert"     >
                               El usuario no tiene requerimientos
                            </div>



                        </div>

                    </div>


                    <div class="text-left mt-10">
                        <ul class="nav nav-pills nav-stacked list-style-icons"
                            ng-repeat="srv in professional.request.services">
                            <li><a href="#"><i class="fa fa-chevron-circle-right"></i> @{{srv.nombre}} </a></li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="col-xs-12  col-sm-8 col-md-8 col-lg-9  col-eq">

                <div ng-show="professional.updateprofile">
                    <div>
                        <div class="row mt-10">
                            <div class="col-md-12 text-center">
                                <h3 class="text-center"> Para enviar un presupuesto
                                    <br>
                                    agradecemos actualice sus datos
                                </h3>
                                <div class="separator"></div>
                                <p class="large text-center">
                                    Necesitamos conocer su n&uacute;mero de tel&eacute;fono y ubicaci&oacute;n antes de continuar
                                </p>
                                <br>
                                <a href="usuario-perfil"   class="btn btn-default-transparent btn-lg">
                                    Actualizar mis datos  <i class="fa fa-chevron-right pr-10"></i></a>
                            </div>
                        </div>
                    </div>
                </div>



                <div ng-show="!professional.updateprofile">

                    <div id="quote" class="ng-cloak" ng-cloak >


                        <div class="text-center" ng-show="!professional.canQuote">
                            <div class="alert  alert-icon alert-warning" role="alert">
                                <p> <i class="fa fa-warning"></i> <strong>  No tiene suficiente creditos para presupuestar este servicio </strong></p>
                            </div>


                            <button id="sendButn"  class="btn btn-default-transparent btn-lg">
                                <i class="fa fa-credit-card pr-10"></i>
                                Comprar Creditos
                            </button>


                            <hr>
                        </div>

                        <div class="form-group has-feedbac ph-20 margin--bottom-clear"  ng-class="{'has-error has-feedback':( professional.submit || !quoteForm.cost.$pristine) && quoteForm.cost.$invalid }" >



                            <div class="col-md-6 margin-clear padding-hor-clear" >
                                <h3 >¿Cu&aacute;nto cuesta tu servicio?</h3>
                                <input type="text" class="form-control form-control-hero cost" name="cost" onkeypress='return event.charCode >= 48 && event.charCode <= 57' name="cost" ng-model="professional.quote.costo"  style="width: 50%"  placeholder="0$" required>
                                <em ng-show=" ( professional.submit || !quoteForm.cost.$pristine) && quoteForm.cost.$invalid  "
                                    class="error help-block">Ingrese el monto de su servicio</em>
                            </div>
                            <div class="col-md-6 margin-clear padding-hor-clear" >


                                <div class="feature-box-2 object-non-visible animated object-visible fadeInDownSmall mt-20 text-left" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
                                    <div class="body text-left">
                                        <h3 class="title"><span class="text-default font-credits">  @{{professional.request.root_service.creditos}}  </span> creditos requeridos  </h3>
                                        <div class="separator-2"></div>
                                        <h3><span class="text-default font-credits"> @{{professional.creditos}}</span> disponibles </h3>
                                    </div>
                                </div>



                            </div>


                        </div>




                        <div class="form-group has-feedbac ph-20 margin-top-clear" ng-class="{'has-error has-feedback':( professional.submit || !quoteForm.description.$pristine) && quoteForm.description.$invalid }" >
                            <h3 class="margin-top-clear">Describe tu servicio.</h3>
                            <textarea name="description" class="form-control form-control-hero quote" ng-model="professional.quote.descripcion" style="width: 100%; height: 300px;resize: none;"
                                      rows="5" id="comment" required></textarea>
                            <em ng-show=" ( professional.submit || !quoteForm.description.$pristine) && quoteForm.description.$invalid  "
                                class="error help-block">Ingrese la descripci&oacute;n de su servicio</em>
                            <div>
                                <p class="small margin-clear">
                                    <strong>Describe tu servicio.</strong> Describe a <span
                                            class="text-default">@{{professional.request.people.nombre}} @{{ professional.request.people.apellido }}</span>
                                    cual es el costo de tu servicio, cual es la frecuencia (diario,semanal,quincenal....) Tambi&eacute;n comenta acerca de la calidad, nivel de experiencia,
                                    c&oacute;mo funciona tu servicio, alg&uacute;n tipo de requerimiento y c&oacute;mo es el proceso de contrataci&oacute;n.
                                </p>
                            </div>

                            <div class="text-center mt-20"  ng-show="professional.canQuote">
                                {{--<a href="javascript:void(0)" id="sendButn"  ng-click="professional.sendQuote(quoteForm.$valid,professional.quote)" class="btn btn-default-transparent btn-lg">--}}
                                    {{--Enviar   <i class="fa fa-send-o pr-10"></i></a>--}}
                                <button id="sendButn"  ng-click="professional.sendQuote(quoteForm.$valid,professional.quote)" class="btn btn-default-transparent btn-lg">
                                    Enviar   <i class="fa fa-send-o pr-10"></i></button>
                            </div>
                        </div>

                    </div>

                    <div id="succes" class="buttons-hide" >
                        <div class="row mt-10">
                            <div class="col-md-12 text-center">
                                <h2 class="text-center">Hemos <strong>enviado</strong> su presupuesto</h2>
                                <div class="separator"></div>
                                <p class="large text-center">En pocos minutos <span class="text-default"> <strong> @{{professional.request.people.nombre}} @{{ professional.request.people.apellido }} </strong> </span>
                                 recibir&aacute; nuestras notificaciones
                                </p>
                                <br>
                                <a href="profesional-solicitudes"   class="btn btn-default-transparent btn-lg">
                                    Continuar  <i class="fa fa-chevron-right pr-10"></i></a>
                            </div>
                        </div>
                    </div>

                </div>

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




    </section>
@stop

{{--@section ('script')--}}
    {{--<script src="{{asset('bower_components/moment/moment.js')}}"></script>--}}
    {{--<script src="{{asset('bower_components/moment/locale/es.js')}}"></script>--}}
    {{--<script src="{{asset('js/scripts/js/app/commonService.min.js')}}"></script>--}}
    {{--<script src="{{asset('js/scripts/js/app/professionalQuoteApp.min.js')}}"></script>--}}
{{--@stop--}}