169 lines
9.0 KiB
PHP
169 lines
9.0 KiB
PHP
|
<section id="contato" class="contact bg-light pb-0" style="margin-top:-60px;">
|
||
|
|
<div class="container pb-5">
|
||
|
|
@if ($contato->titulo != '')
|
||
|
|
<div class="section-title">
|
||
|
|
<span>{{$contato->titulo}}</span>
|
||
|
|
<h2>{{$contato->titulo}}</h2>
|
||
|
|
<h4>{!!$contato->subtitulo!!}</h4>
|
||
|
|
<div>{!!$contato->descricao!!}</div>
|
||
|
|
</div>
|
||
|
|
@endif
|
||
|
|
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-md-6" data-aos="fade-right" data-aos-delay="100">
|
||
|
|
<div class="info" style="padding:10px 20px;">
|
||
|
|
<div class="address">
|
||
|
|
<i class="icofont-google-map"></i>
|
||
|
|
<h4>Atendimento:</h4>
|
||
|
|
<p>{{$configuracao['horatend'];}}</p>
|
||
|
|
<p>{{$configuracao['horatend2'];}}</p>
|
||
|
|
<p>{{$configuracao['horatend3'];}}</p><br/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="info" style="padding:10px 20px;">
|
||
|
|
<div class="address">
|
||
|
|
<i class="icofont-google-map"></i>
|
||
|
|
<h4>Endereço:</h4>
|
||
|
|
<p>{{$_endereco;}}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="col-md-6" data-aos="fade-left" data-aos-delay="200">
|
||
|
|
<div class="info" style="padding:10px 20px;">
|
||
|
|
<div class="phone">
|
||
|
|
<i class="icofont-phone"></i>
|
||
|
|
<h4>Telefone(s):</h4>
|
||
|
|
<p>+55 {{$_telefone;}}</p>
|
||
|
|
@if($_telefone_2 != '')
|
||
|
|
<p>+55 {{$_telefone_2}}</p>
|
||
|
|
@endif
|
||
|
|
@if($_telefone_3 != '')
|
||
|
|
<p>+55 {{$_telefone_3;}}</p>
|
||
|
|
@endif
|
||
|
|
</div>
|
||
|
|
<br>
|
||
|
|
</div>
|
||
|
|
<div class="info" style="padding:10px 20px;">
|
||
|
|
<div class="email">
|
||
|
|
<i class="icofont-envelope"></i>
|
||
|
|
<h4>E-mail(s):</h4>
|
||
|
|
<p>{{$_email;}}</p>
|
||
|
|
@if ($configuracao['email2'] != '')
|
||
|
|
<p>{{$configuracao['email2'];}}</p>
|
||
|
|
@endif
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<br><br>
|
||
|
|
<div class="offset-lg-2 col-lg-8 mt-5 mt-lg-0" data-aos="fade-left" data-aos-delay="200">
|
||
|
|
<div id="mail">
|
||
|
|
@if(session()->has('email-enviado'))
|
||
|
|
<div id="mail-enviado" class="alert alert-success">E-mail enviado com sucesso!</div>
|
||
|
|
@endif
|
||
|
|
<form id="form-contato" action="{{url('/contato')}}" method="post" role="form" class="php-email-form">
|
||
|
|
@csrf
|
||
|
|
<input type="hidden" name="timestamp" value="{{time()}}">
|
||
|
|
<div class="form-row">
|
||
|
|
<div class="col-md-12 form-group">
|
||
|
|
<label>Nome:</label>
|
||
|
|
<input type="text" class="form-control" name="nome" id="nome" placeholder="Seu Nome" data-rule="minlen:4" data-msg="Por favor entre com no mínimo 4 caractere" />
|
||
|
|
<div class="validate"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-12 form-group">
|
||
|
|
<label>Telefone:</label>
|
||
|
|
<input type="phone" class="form-control" name="fone" id="fone" placeholder="Seu Whatsapp" data-rule="phone" data-msg="Por favor entre com um telefone válido"/>
|
||
|
|
<div class="validate"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-12 form-group">
|
||
|
|
<label>E-mail:</label>
|
||
|
|
<input type="email" class="form-control" name="email" id="email" placeholder="Seu E-mail" data-rule="email" data-msg="Por favor entre com um e-mail válido" />
|
||
|
|
<div class="validate"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label>Assunto:</label>
|
||
|
|
<input type="text" class="form-control" name="assunto" id="assunto" placeholder="Assunto" data-rule="minlen:4" data-msg="Por favor entre com no mínimo 8 caractere" />
|
||
|
|
<div class="validate"></div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label>Mensagem:</label>
|
||
|
|
<textarea class="form-control" name="mensagem" id="mensagem" rows="5" data-rule="required" data-msg="Por favor escreva sua mensagem" placeholder="Mensagem" style="resize:none;"></textarea>
|
||
|
|
<div class="validate"></div>
|
||
|
|
</div>
|
||
|
|
<div class="text-center" style="margin-top:1rem;">
|
||
|
|
<button name="enviar" type="submit" class="btn btn-warning bg-warning">Enviar Mensagem</button>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
<div id="contato-resposta" class="alert" style="margin: 1rem 0; visibility: hidden;" data-success="Obrigado, sua mensagem foi enviada com suceso!" data-fail="Erro ao enviar mensagem!">Texto</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<iframe src="https://www.google.com/maps/d/u/0/embed?mid=1zipTVRzb0nf1GmW6YzahW796CuctI7JD&ehbc=2E312F" width="100%" height="400"></iframe>
|
||
|
|
</section>
|
||
|
|
<script>
|
||
|
|
window.addEventListener("load", () => {
|
||
|
|
let formContato = document.querySelector("#form-contato");
|
||
|
|
|
||
|
|
formContato.addEventListener("submit", (event) => {
|
||
|
|
event.preventDefault();
|
||
|
|
|
||
|
|
formContato.enviar.disabled = true;
|
||
|
|
formContato.enviar.innerText = "Enviando...";
|
||
|
|
|
||
|
|
let method = formContato.getAttribute("method");
|
||
|
|
let action = formContato.getAttribute("action");
|
||
|
|
fetch(action, {
|
||
|
|
method: method,
|
||
|
|
headers: {
|
||
|
|
'Content-Type': 'application/json',
|
||
|
|
'X-CSRF-TOKEN': formContato._token.value
|
||
|
|
},
|
||
|
|
body: JSON.stringify({timestamp: formContato.timestamp.value, nome: formContato.nome.value, fone: formContato.fone.value, email: formContato.email.value, assunto: formContato.assunto.value, mensagem: formContato.mensagem.value})
|
||
|
|
})
|
||
|
|
.then(response => response.text())
|
||
|
|
.then(response => JSON.parse(response))
|
||
|
|
.then(response => {
|
||
|
|
formContato.enviar.disabled = false;
|
||
|
|
formContato.enviar.innerText = "Enviar Mensagem";
|
||
|
|
|
||
|
|
if(response.email_enviado) {
|
||
|
|
formContato.nome.value = "";
|
||
|
|
formContato.fone.value = "";
|
||
|
|
formContato.email.value = "";
|
||
|
|
formContato.assunto.value = "";
|
||
|
|
formContato.mensagem.value = "";
|
||
|
|
|
||
|
|
document.querySelector("#contato-resposta").innerText = document.querySelector("#contato-resposta").getAttribute("data-success");
|
||
|
|
document.querySelector("#contato-resposta").classList.add("alert-success");
|
||
|
|
}else{
|
||
|
|
document.querySelector("#contato-resposta").innerText = document.querySelector("#contato-resposta").getAttribute("data-fail");
|
||
|
|
document.querySelector("#contato-resposta").classList.add("alert-danger");
|
||
|
|
}
|
||
|
|
document.querySelector("#contato-resposta").style.visibility = "visible";
|
||
|
|
setTimeout(() => {
|
||
|
|
document.querySelector("#contato-resposta").classList.remove("alert-danger");
|
||
|
|
document.querySelector("#contato-resposta").classList.remove("alert-success");
|
||
|
|
document.querySelector("#contato-resposta").innerText = "Texto";
|
||
|
|
document.querySelector("#contato-resposta").style.visibility = "hidden";
|
||
|
|
}, 5000);
|
||
|
|
})
|
||
|
|
.catch((error) => {
|
||
|
|
formContato.enviar.disabled = false;
|
||
|
|
formContato.enviar.innerText = "Enviar Mensagem";
|
||
|
|
|
||
|
|
document.querySelector("#contato-resposta").innerText = document.querySelector("#contato-resposta").getAttribute("data-fail");
|
||
|
|
document.querySelector("#contato-resposta").classList.add("alert-danger");
|
||
|
|
document.querySelector("#contato-resposta").style.visibility = "visible";
|
||
|
|
setTimeout(() => {
|
||
|
|
document.querySelector("#contato-resposta").classList.remove("alert-danger");
|
||
|
|
document.querySelector("#contato-resposta").classList.remove("alert-success");
|
||
|
|
document.querySelector("#contato-resposta").innerText = "Texto";
|
||
|
|
document.querySelector("#contato-resposta").style.visibility = "hidden";
|
||
|
|
}, 5000);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|