src/Application/Internit/SettingBundle/Resources/views/Home/home_front.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}
  3.   {{ parent() }}
  4. {% endblock %}
  5. {% block javascripts %}
  6.   {{ parent() }}
  7.   <script src="{{ asset('bundles/applicationinternitcontent/js/jquery.mask.js') }}"></script>
  8.   <script src="{{ asset('bundles/applicationinternitcontent/js/format-form.js') }}"></script>
  9.   <script src="{{ asset('bundles/applicationinternitcontent/js/jquery-ui.min.js') }}"></script>
  10.   <script src="{{ asset('bundles/applicationinternitcontent/js/geral.js') }}"></script>
  11.   <script>
  12.     $(document).ready(function() {
  13.       const realEstateOptions = $('.js-real-estate-options option').toArray().map(elem => elem.innerText);
  14.       $('#imobiliaria').autocomplete({
  15.         minLength: 0,
  16.         source: realEstateOptions,
  17.         appendTo: '#real-estate-suggestions',
  18.       }).focus(function() {
  19.         $(this).autocomplete('search');
  20.       });
  21.       // corretor de imobiliária ou autônomo
  22.       $('.cadastro-corretor .js-realtor-option').change(function() {
  23.         if ($(this).is(':checked')) {
  24.           let option = $(this).val();
  25.           if (option == 'corretor-autonomo') {
  26.             // esta linha sinaliza ao backend que a imobiliária do corretor é "Imobiliária Autônoma"
  27.             $('#imobiliaria').hide().val('').removeAttr('required');
  28.           }
  29.           else if (option == 'corretor-de-imobiliaria') {
  30.             $('#imobiliaria').show().attr('required', true);
  31.           }
  32.         }
  33.       })
  34.       .trigger('change');
  35.       $('#cadastro-corretor').submit(function() {
  36.         let realEstateOptions = $('.js-real-estate-options option').toArray();
  37.         let imobiliaria = $('#imobiliaria').val();
  38.         if (imobiliaria) {
  39.           let chosenRealEstate = realEstateOptions.find(function(elem) {
  40.             return elem.innerText.replace(/\n/g, '').toLowerCase() === imobiliaria.replace(/\n/g, '').toLowerCase();
  41.           });
  42.           
  43.           return chosenRealEstate;
  44.         }
  45.         return true;
  46.       });
  47.       // este trecho é para tratar redirecionamentos vindos do assistente virtual quando
  48.       // um usuário deseja se cadastrar na construtora como corretor autônomo ou imobiliária.
  49.       // Dependendo do parâmetro de consulta modaltab da url, abre o formulário de cadastro apropriado.
  50.       const modaltab = '{{ modaltab }}';
  51.       if (modaltab != '') {
  52.         // 1 - corretor autônomo; 2 - imobiliária
  53.         const tabId = (modaltab == '1' ? 'tab-1' : 'tab-2');
  54.         $('#myModal').modal('toggle');
  55.         $('#myModal').find(`.tab-link[data-tab=${tabId}]`).click();
  56.         // nome, e-mail e telefone
  57.         const chatbotData = JSON.parse('{{ chatbotData|raw }}');
  58.         // populando o form
  59.         const form = $(`#myModal #${tabId} form`);
  60.         form.find('[name="email"]').val(chatbotData.email);
  61.         form.find('[name="phone"]').val(chatbotData.telefone);    
  62.         // liga a opção de corretor autônomo
  63.         if (tabId == 'tab-1') {
  64.           form.find('[name="firstName"]').val(chatbotData.nome);
  65.           form.find('#corretor-autonomo').click();
  66.         }
  67.         else if (tabId == 'tab-2') {
  68.           form.find('[name="name"]').val(chatbotData.nome);
  69.         }
  70.       }
  71.       
  72.     });
  73.   </script>
  74. {% endblock %}
  75. {% block stylesheets %}
  76.   {{ parent() }}
  77.   <link rel="stylesheet" href="{{ asset('bundles/applicationinternitcontent/css/jquery-ui.min.css') }}">
  78. {% endblock %}
  79. {% block menu %}
  80.   <header class="header">
  81.   <div class="links-cadastro">
  82.       <div class="link cadastro-corretor">
  83.         <button type="button" class="btn btn-corretor btn-info btn-lg" data-toggle="modal" data-target="#myModal"><i class="far fa-user"></i> Cadastro Corretor</button>
  84.       </div>
  85.       <div class="link cadastro-imobiliario">
  86.         <button type="button" class="btn btn-imob btn-info btn-lg" data-toggle="modal" data-target="#myModal"><i class="far fa-building"></i> Cadastro Imobiliário</button>
  87.       </div>
  88.   </div>
  89.   <div class="icon">
  90.     <a href="javascript:void(0);">
  91.       <i class="fa fa-bars"></i>
  92.     </a>
  93.   </div>
  94.   <nav id="navbar" class="navbar navbar-expand-xl">
  95.     <div class="container">
  96.       {% if builder is defined and builder is not empty %}
  97.         <a class="navbar-brand" href="/">
  98.             {% thumbnail builder.logo, 'front_home' with {'class': 'realEstate_logo'} %}
  99.         </a>
  100.       {% endif %}
  101.       <div class="collapse navbar-collapse" id="menu">
  102.         <ul class="navbar-nav mr-auto">
  103.           <li class="nav-item active" data-toggle="modal" data-target="#myModal">
  104.             <a class="nav-link" href="#">Venda Conosco<span class="sr-only">(página atual)</span></a>
  105.           </li>
  106.           <li class="nav-item">
  107.             <a class="nav-link" href="#main-recursos">Recursos</a>
  108.           </li>
  109.           <li class="nav-item">
  110.             <a class="nav-link" href="#main-contato">Fale Conosco</a>
  111.           </li>
  112.           <li class="nav-item cadastro-mob" data-toggle="modal" data-target="#myModal">
  113.             <a class="nav-link" href="#">Cadastre-se</a>
  114.           </li>
  115.         </ul>
  116.         <ul class="menu-cliente">
  117.           <form method="post" class="form-login" action="admin/login_check">
  118.             <input type="text" placeholder="Usuário" name="_username" required>
  119.             <div>
  120.               <input type="password" placeholder="Senha" name="_password" required>
  121.               <a href="admin/resetting/request">Esqueci a Senha</a>
  122.             </div>
  123.             <li class="nav-item last-menu">
  124.               <button class="nav-link">Entrar</button>
  125.             </li>
  126.           </form>
  127.         </ul>
  128.       </div>
  129.     </div>
  130.   </nav>
  131.   <div class="alerta-form">
  132.     {% for flashMessage in app.session.flashbag.get('flash_create_success') %}
  133.       <div class="caixa-resposta">
  134.         <div class="resposta active" id="r-sucess">
  135.           <i class="far fa-check-circle"></i>
  136.           <p>{{ flashMessage }}</p>
  137.         </div>
  138.       </div>
  139.     {% endfor %}
  140.     {% for flashMessage in app.session.flashbag.get('flash_create_error') %}
  141.       <div class="caixa-resposta">
  142.         <div class="resposta active" id="r-error">
  143.           <i class="far fa-times-circle"></i>
  144.           <p>{{ flashMessage }}</p>
  145.         </div>
  146.       </div>
  147.     {% endfor %}
  148.   </div>
  149. </header>
  150. {% endblock %}
  151. {% block modal %}
  152. <!-- Modal -->
  153. <div class="modal fade" id="myModal" role="dialog">
  154. <div class="modal-dialog">
  155. <!-- Modal content-->
  156. <div class="modal-content">
  157.  <div class="tabs-container">
  158.          <ul class="tabs menu-tab">
  159.              <li class="tab-link btn-corretor upper" data-tab="tab-1">Cadastro Corretor</li>
  160.              <li class="tab-link btn-imob last upper" data-tab="tab-2">Cadastro Imobiliária</li>
  161.          </ul>
  162.          <div id="tab-1" class="tab-content current btn-corretor">
  163.            <form class="cadastro cadastro-corretor" id="cadastro-corretor" action="/submitUser" method="post" >
  164.              <div class="container">
  165.                <div class="row">
  166.                  <div class="col-md-6">
  167.                    <div class="form-group">
  168.                      <input type="text" class="form-control" id="nomeimput" name="firstName" placeholder="Nome Completo" required>
  169.                    </div>
  170.                    <div class="form-group">
  171.                      <input type="date" class="form-control" id="emailimput" name="birthDay" placeholder="Data de Nascimento" title="Data de Nascimento" required>
  172.                    </div>
  173.                    <div class="form-group">
  174.                      <input type="tel" class="form-control phone_with_ddd" id="telimput" name="phone" placeholder="Telefone" required>
  175.                    </div>
  176.                     <div class="form-group">
  177.                       <input type="text" class="form-control" id="creci" name="creci" placeholder="CRECI" required>
  178.                     </div>
  179.                    <div class="form-group">
  180.                     <input type="text"  class="form-control" id="imobiliaria" name="realEstateName" placeholder="Imobiliária">                   
  181.                     <div id="real-estate-suggestions"></div>
  182.                    </div>
  183.                    <div class="form-group">
  184.                     <select class="js-real-estate-options" style="display: none" name="realEstateId">
  185.                       {% for realEstate in data %}
  186.                         <option value="{{ realEstate.id }}">{{ realEstate.name }}</option>
  187.                       {% endfor %}
  188.                     </select>
  189.                    </div>
  190.                  </div>
  191.                  <div class="col-md-6">
  192.                      <div class="form-group">
  193.                        <input type="text" class="form-control cpf" id="cpf" name="cpf" placeholder="CPF" required>
  194.                      </div>
  195.                      <div class="form-group">
  196.                        <select class="select select-genero" name="genre" id="select" required>
  197.                          <option value="">Gênero</option>
  198.                          <option value="Masculino">Masculino</option>
  199.                          <option value="Feminino">Feminino</option>
  200.                          <option value="outro">Outros</option>
  201.                        </select>
  202.                      </div>
  203.                      <div class="form-group">
  204.                        <input type="email" class="form-control" id="emailimput" name="email" placeholder="E-mail" required>
  205.                      </div>
  206.                     <div class="form-group checkbox">
  207.                       <input type="radio" class="js-realtor-option" name="realestate" value="corretor-autonomo" id="corretor-autonomo">
  208.                       <label for="corretor-autonomo">Corretor Autônomo</label>
  209.                     </div>
  210.                     <div class="form-group checkbox">
  211.                       <input type="radio" class="js-realtor-option" name="realestate" value="corretor-de-imobiliaria" id="corretor-de-imobiliaria" checked>
  212.                       <label for="corretor-de-imobiliaria">Corretor de Imobiliária</label>
  213.                     </div>
  214.                    </div>
  215.                    <div class="form-group enviar-modal">
  216.                      <button type="submit" class="upper btn btn-primary enviar">Enviar</button>
  217.                    </div>
  218.                </div>
  219.              </div>
  220.            </form>
  221.          </div>
  222.          <div id="tab-2" class="tab-content btn-imob">
  223.            <form class="cadastro cadastro-corretor" action="/submitRealEstate" method="post" >
  224.              <div class="container">
  225.                <div class="row">
  226.                  <div class="col-md-6">
  227.                    <div class="form-group">
  228.                      <input type="text" class="form-control" id="nomeimput" name="name" placeholder="Nome" required>
  229.                    </div>
  230.                    <div class="form-group">
  231.                      <input type="text" class="form-control cnpj" id="emailimput" name="cnpj" placeholder="CNPJ" required>
  232.                    </div>
  233.                    <div class="form-group">
  234.                      <input type="tel" class="form-control phone_with_ddd" id="telimput" name="phone" placeholder="Telefone" required>
  235.                    </div>
  236.                  </div>
  237.                  <div class="col-md-6">
  238.                    <div class="form-group">
  239.                      <input type="text" class="form-control" id="razaoimput" name="corporateName" placeholder="Razão Social" required>
  240.                    </div>
  241.                    <div class="form-group">
  242.                     <input type="text" class="form-control" name="creci" placeholder="CRECI Jurídico" required>
  243.                    </div>
  244.                    <div class="form-group">
  245.                      <input type="email" class="form-control" name="email" id="emailimput" placeholder="E-mail Padrão" required>
  246.                    </div>
  247.                    </div>
  248.                  <div class="form-group enviar-modal">
  249.                    <button type="submit" class="upper btn btn-primary enviar">Enviar</button>
  250.                  </div>
  251.                </div>
  252.              </div>
  253.            </form>
  254.          </div>
  255.      </div>
  256. </div>
  257. </div>
  258. </div>
  259. {% endblock %}
  260. {% block banner %}
  261. <section id="banner" class="clip-after">
  262.   <div class="banner_box">
  263.     <div class="container">
  264.       <div class="row">
  265.         <div class="col-md-6">
  266.           <div class="banner-content">
  267.             <h1>Controle total na palma da sua mão, de forma prática e rápida!</h1>
  268.             <p>Somos uma Plataforma com ênfase no desenvolvimento do corretor, simplificando a relação de negociação, com funcionalidades específicas para obter maior controle sobre cada etapa da venda do imóvel, proporcionando uma melhor administração e aumento no numero de vendas.</p>
  269.             <a class="upper" href="#vantagens-corretor">
  270.               Veja as vantagens <span class="arrow-down"><img src="{{ asset('bundles/applicationinternitcontent/media/img/down-arrow.png')}}"</span>
  271.             </a>
  272.           </div>
  273.        </div>
  274.        <div class="col-md-6">
  275.          <img class="banner-img" src="{{ asset('bundles/applicationinternitcontent/media/img/Homem_digitando.png')}}">
  276.        </div>
  277.      </div>
  278.     </div>
  279.   </div>
  280. </section>
  281. {% endblock %}
  282. {% block body %}
  283.   <div class="main">
  284.     <div id="vantagens-corretor" class="container vantagens">
  285.         <h3 class="text-center upper">Vantagens para o corretor</h3>
  286.         <div class="row">
  287.           <div class="col-lg collum-icons">
  288.             <div class="icone">
  289.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/statistics.png')}}">
  290.             </div>
  291.             <h4>Atinja metas de vendas</h4>
  292.             <p>Veja as metas de vendas definidas pela construtora, acompanhe de perto seu desempenho e ganhe benefícios da Construtora.</p>
  293.           </div>
  294.           <div class="col-lg collum-icons">
  295.             <div class="icone">
  296.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/docs.png')}}">
  297.             </div>
  298.             <h4>Crie propostas de forma rápida e eficiente para seus clientes</h4>
  299.             <p>Facilite a elaboração e garanta a aprovação da Construtora criando propostas que atendam todas as necessidades, garantindo a satisfação de todas as partes envolvidas!</p>
  300.           </div>
  301.           <div class="col-lg collum-icons">
  302.             <div class="icone">
  303.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/key.png')}}">
  304.             </div>
  305.             <h4>Solicite as chaves para visitar o imóvel desejado por seus clientes</h4>
  306.             <p>Em nossa plataforma, pedir a chave para ir ao imóvel desejado por um cliente é algo muito simples, com poucos cliques você escolhe a unidade, determina a melhor data e pronto, sua solicitação já foi enviada para a construtora.</p>
  307.           </div>
  308.           <div class="col-lg collum-icons">
  309.             <div class="icone">
  310.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/trophy.png')}}">
  311.             </div>
  312.             <h4>Acumule pontos e troque por prêmios</h4>
  313.             <p>Aprenda mais sobre todos os empreendimentos de maneira divertida com nosso Quiz e a cada resposta acertada você ganha pontos que podem ser trocados por prêmios exclusivos. Troque seus pontos por prêmios!</p>
  314.           </div>
  315.         </div>
  316.     </div>
  317.     <div id="main-recursos" class="main-emp clip-before clip-emp">
  318.       <div class="container content-metas">
  319.         <div class="row">
  320.           <div class="col-lg-5 empreendimento-img">
  321.             <img src="{{ asset('bundles/applicationinternitcontent/media/img/empreendimento.png')}}">
  322.           </div>
  323.           <div class="col-lg-2">
  324.           </div>
  325.           <div class="col-lg-5 empreendimentos">
  326.             <h5>Disponibilidade e preço das unidades em tempo real pelo espelho de vendas e acesso ao conteúdo completo de cada empreendimento, incluindo vídeos, imagens e material para downloads.</h5>
  327.           </div>
  328.         </div>
  329.       </div>
  330.     </div>
  331.     <div class="main-metas clip-after">
  332.       <div class="container content-metas">
  333.         <div class="row">
  334.           <div class="col-lg-5 metas">
  335.             <h5>Veja seu espelho de vendas e Tenha acesso ao conteúdo completo sobre o empreendimento, incluindo material para downloads</h5>
  336.             <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/01_Dashboard_v6.jpg')}}" class="upper">
  337.                 Mais Recursos
  338.               </a>
  339.               <div class="imagens-rec">
  340.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/02_Ficha_v5.jpg')}}">
  341.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/02_Ficha_v5.jpg')}}">
  342.                 </a>
  343.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/03_Notificações.jpg')}}">
  344.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/03_Notificações.jpg')}}">
  345.                 </a>
  346.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/04_Solicitar_Chave_Emanalise.jpg')}}">
  347.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/04_Solicitar_Chave_Emanalise.jpg')}}">
  348.                 </a>
  349.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/05_Metas_de_vendas.jpg')}}">
  350.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/05_Metas_de_vendas.jpg')}}">
  351.                 </a>
  352.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/06_Ranking_v2.jpg')}}">
  353.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/06_Ranking_v2.jpg')}}">
  354.                 </a>
  355.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/07_Quiz.jpg')}}">
  356.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/07_Quiz.jpg')}}">
  357.                 </a>
  358.                 <a data-fslightbox="recursos" href="{{ asset('bundles/applicationinternitcontent/media/img/08_Criar_proposta_v2.jpg')}}">
  359.                   <img src="{{ asset('bundles/applicationinternitcontent/media/img/08_Criar_proposta_v2.jpg')}}">
  360.                 </a>
  361.             </div>
  362.           </div>
  363.           <div class="col-lg-2">
  364.           </div>
  365.           <div class="col-lg-5 metas-img">
  366.             <img src="{{ asset('bundles/applicationinternitcontent/media/img/metas.png')}}">
  367.           </div>
  368.         </div>
  369.       </div>
  370.     </div>
  371.     <div class="container vantagens-imob">
  372.         <h3 class="text-center upper">Vantagens para a Imobiliária</h3>
  373.         <div class="row">
  374.           <div class="col-lg collum-icons">
  375.             <div class="icone-imob">
  376.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/statistics.png')}}">
  377.             </div>
  378.             <h4>Gerencimento total</h4>
  379.             <p>Acompanhe o desempenho dos seus corretores em tempo real, visualizando as suas ações, como: propostas criadas, solicitação de chaves e muito mais. Faça suas interpretações analisando os dados da plataforma.</p>
  380.           </div>
  381.           <div class="col-lg collum-icons">
  382.             <div class="icone-imob">
  383.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/setting.png')}}">
  384.             </div>
  385.             <h4>Acesso ao conteúdo</h4>
  386.             <p>Garanta aos corretores acesso a toda a informação sobre os empreendimentos, como: dados relevantes, espelho de vendas, disponibilidade e material para downloads. Ajude a sua equipe conhecer mais sobre os imóveis!</p>
  387.           </div>
  388.           <div class="col-lg collum-icons">
  389.             <div class="icone-imob">
  390.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/worldwide.png')}}">
  391.             </div>
  392.             <h4>Suporte de Vendas</h4>
  393.             <p>Auxilie seus corretores facilitando diversas tarefas do dia-a-dia, como: criação de propostas padronizadas e cadastro completo de clientes. Dê suporte tecnológico ao seu time de vendas!</p>
  394.           </div>
  395.           <div class="col-lg collum-icons">
  396.             <div class="icone-imob">
  397.               <img src="{{ asset('bundles/applicationinternitcontent/media/img/group.png')}}">
  398.             </div>
  399.             <h4>Relacionamento</h4>
  400.             <p>Voz ativa do corretor com seus clientes, fortalecendo a marca da imobiliária e melhorando seu relacionamento com a construtora</p>
  401.           </div>
  402.         </div>
  403.     </div>
  404.     <div id="main-contato" class="widgets">
  405.       <div class="container">
  406.         <h3 class="text-center upper">Fale Conosco</h3>
  407.         <div class="row">
  408.         <div class="col-lg-6 contato">
  409.           <div class="contato-content">
  410.             {% if builder.name is defined and builder.name is not empty %}
  411.               <h2 class="upper">{{ builder.name }}</h2>
  412.             {% endif %}
  413.             {% if builder.phone is defined and builder.phone is not empty %}
  414.               <p><span class="icone-contato"><img src="{{ asset('bundles/applicationinternitcontent/media/img/phone-solid.png')}}"></span>{{ builder.phone }}</p>
  415.             {% endif %}
  416.             {% if builder.contactEmails is defined and builder.contactEmails is not empty %}
  417.               <p><span class="icone-contato"><img src="{{ asset('bundles/applicationinternitcontent/media/img/envelope-solid.png')}}"></span>
  418.                 {{ (builder.contactEmails[0] is not empty) ? builder.contactEmails[0].url : '' }}
  419.               </p>
  420.             {% endif %}
  421.             {% set fullAddress = builder is defined and builder is not empty ? builder.fullAddress : '' %}
  422.             {% if fullAddress is not empty %}
  423.               <p><span class="icone-contato"><img src="{{ asset('bundles/applicationinternitcontent/media/img/map-marker-alt-solid.png')}}"></span>{{ fullAddress }}</p>
  424.             {% endif %}
  425.             {% if builder.siteUrl is defined and builder.siteUrl is not empty %}
  426.               <p><span class="icone-contato"><img src="{{ asset('bundles/applicationinternitcontent/media/img/globe-solid.png')}}"></span>{{ builder.siteUrl }}</p>
  427.             {% endif %}
  428.           </div>
  429.         </div>
  430.         <div class="col-lg-6">
  431.           <div class="form">
  432.             <form class="cadastro cadastro-corretor" action="/submitContact" method="post" >
  433.               <div class="form-group">
  434.                 <input type="text" class="form-control" name="name" id="nomeimput" placeholder="Nome" required>
  435.               </div>
  436.               <div class="form-group">
  437.                 <input type="email" class="form-control" name="email" id="emailimput" placeholder="E-mail" required>
  438.               </div>
  439.               <div class="form-group">
  440.                 <input type="tel" class="form-control phone_with_ddd" name="phone" id="telimput" placeholder="Telefone" required>
  441.               </div>
  442.               <div class="form-group">
  443.                 <textarea class="form-control" name="message" id="textoimput" placeholder="Mensagem" required></textarea>
  444.               </div>
  445.               <div class="form-group form-last">
  446.                 <button type="submit" class="btn btn-primary enviar">Enviar</button>
  447.               </div>
  448.             </form>
  449.           </div>
  450.         </div>
  451.       </div>
  452.       </div>
  453.     </div>
  454.   </div>
  455. {% endblock %}
  456. {% block footer %}
  457.   {{ parent() }}
  458. {% endblock %}