Files
elcaribe/resources/views/frontend/registro-comercio/views/business/index.blade.php

366 lines
18 KiB
PHP

<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>La Pieza.DO | Registro</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/css/bootstrap.min.css') }}">
<!-- External Css -->
<link rel="stylesheet"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/css/line-awesome.min.css') }}">
<link rel="stylesheet"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/css/owl.carousel.min.css') }}" />
<link rel="stylesheet"
href="https://maxst.icons8.com/vue-static/landings/line-awesome/font-awesome-line-awesome/css/all.min.css">
<link rel="stylesheet"
href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css">
<!-- Custom Css -->
<link rel="stylesheet" type="text/css"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/css/main.css') }}">
<link rel="stylesheet" type="text/css"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/css/theme-1.css') }}">
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<!-- Favicon -->
<link rel="icon"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/images/favicon.png') }}">
<link rel="apple-touch-icon"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/images/apple-touch-icon.png') }}">
<link rel="apple-touch-icon" sizes="72x72"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/images/icon-72x72.png') }}">
<link rel="apple-touch-icon" sizes="114x114"
href="{{ static_asset('assets/registrocomercio/registro-form/assets/images/icon-114x114.png') }}">
<style>
/*social icon colored*/
ul.social a {
display: inline-block;
width: 36px;
height: 36px;
border-radius: 50em;
line-height: 43px;
text-align: center;
font-size: 18px;
background-color: #d5d5df;
}
ul.social-md a {
display: inline-block;
width: 20px;
height: 20px;
border-radius: 50em;
line-height: 22px;
text-align: center;
font-size: 13px;
background-color: #d5d5df;
}
ul.social a:hover {
-webkit-transform: translateY(-3px);
transform: translateY(-3px);
}
ul.social i {
color: #171727;
font-size: 24px;
font-weight: 700;
}
ul.social a:hover i{
color: #fff;
}
ul.social.colored i {
color: #fff;
}
ul.social [class*="facebook"]:hover,
ul.social.colored [class*="facebook"] {
background-color: #3b5998;
}
ul.social [class*="twitter"]:hover,
ul.social.colored [class*="twitter"] {
background-color: #1da1f2;
}
ul.social [class*="google"]:hover,
ul.social.colored [class*="google"] {
background-color: #e62833;
}
ul.social.colored [class*="apple"] {
background-color: #141414;
}
ul.social [class*="youtube"]:hover,
ul.social.colored [class*="youtube"] {
background-color: #ff0000;
}
ul.social [class*="instagram"]:hover,
ul.social.colored [class*="instagram"] {
background-color: #bd32a2;
}
ul.social [class*="tripadvisor"]:hover,
ul.social.colored [class*="tripadvisor"] {
background-color: #32da9d;
}
ul.social [class*="linkedin"]:hover,
ul.social.colored [class*="linkedin"] {
background-color: #0070ac;
}
ul.colored-light [class*="facebook"] {
background-color: #c2d9fd;
}
ul.colored-light [class*="twitter"] {
background-color: #ace5f3;
}
ul.colored-light [class*="google"] {
background-color: #ffcbcc;
}
ul.colored-light [class*="youtube"] {
background-color: #ffcbcc;
}
ul.colored-light [class*="instagram"] {
background-color: #f7e2f3;
}
ul.colored-light [class*="facebook"]:hover {
background-color: #3b5998;
}
ul.colored-light [class*="twitter"]:hover {
background-color: #1da1f2;
}
ul.colored-light [class*="google"]:hover {
background-color: #ff0000;
}
ul.colored-light [class*="youtube"]:hover {
background-color: #ff0000;
}
ul.colored-light [class*="instagram"]:hover {
background-color: #bd32a2;
}
ul.colored-light [class*="facebook"] i {
color: #3b5998;
}
ul.colored-light [class*="twitter"] i {
color: #1da1f2;
}
ul.colored-light [class*="google"] i {
color: #ff0000;
}
ul.colored-light [class*="youtube"] i {
color: #ff0000;
}
ul.colored-light [class*="instagram"] i {
color: #bd32a2;
}
ul.colored-light a:hover i{
color: #ffffff;
}
</style>
</head>
<body>
<div class="ugf-wrapper theme-bg">
<div class="ugf-content-block">
<div class="logo">
</div>
<div class="container-md">
<div class="row">
<div class="col-lg-7 offset-lg-5 p-sm-0">
<div style="padding-top: 100px;" class="ugf-content pt270">
<a href="{{ route('shop.view.account.type') }}" class="prev-page"> <i class="las la-arrow-left"></i> Volver Atrás</a>
<h2>Vamos! <span>Únete a nuestra plataforma</span></h2>
<p>Puedes registrarte llegando los siguientes pasos o a traves de una red social </p>
<div class="form-group" style="">
<ul class="list-inline social colored mb-4">
<li class="list-inline-item">
<a href="{{-- route('social.login', ['provider' => 'facebook']) --}}" class="facebook">
<i class="lab la-facebook-f" style="position: relative;top: 5px;"></i>
</a>
</li>
<li class="list-inline-item">
<a href="{{-- route('social.login', ['provider' => 'google']) --}}" class="google">
<i class="lab la-google" style="position: relative;top: 5px;"></i>
</a>
</li>
<li class="list-inline-item">
<a href="{{-- route('social.login', ['provider' => 'twitter']) --}}" class="twitter">
<i class="lab la-twitter" style="position: relative;top: 5px;"></i>
</a>
</li>
</ul>
</div>
{{-- formulario con correo --}}
<form class="form-flex email-form was-validated" id="emailGroup" method="POST" action="{{ route('register.business.store') }}">
@csrf
<div class="container">
<div class="form-row col-md-9">
<div class="form-group mb-4">
<label for="email" id="emailLabel">Correo Electrónico</label>
<input type="email" name="email" id="email" placeholder="{{ __('Email') }}" class="form-control email @error('email') is-invalid @enderror" value="{{ old('email') }}">
<a id="phoneLink" style="text-decoration: underline; margin-left: 250px;" href="#" class="mb-3">Utilice el número de teléfono en su lugar</a>
@error('email')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<div class="form-group mb-4">
<label for="password">Contraseña</label>
<input type="password" name="password" id="password" placeholder="{{ __('Password') }}" class="form-control @error('password') is-invalid @enderror" id="inputPassword">
@error('password')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<div class="form-group mb-4">
<label for="password_confirmation">Repetir Contraseña</label>
<input type="password" name="password_confirmation" id="password_confirmation" placeholder="{{ __('Confirm Password') }}" class="form-control @error('password_confirmation') is-invalid @enderror">
@error('password_confirmation')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<div class="form-group mb-4">
<div class="g-recaptcha" data-sitekey="{{ env('RECAPTCHA_SITE_KEY') }}"></div>
@if ($errors->has('g-recaptcha-response'))
<p style="font-size: 80%;" class="text-danger">{{ $errors->first('g-recaptcha-response') }}</p>
@endif
</div>
<div class="form-group mb-12 d-flex">
<button id="" class="btn btn-primary btn-lg btn-block"><span>Iniciemos</span> <i class="las la-arrow-right"></i></button>
</div>
</div>
</div>
</form>
{{-- formulario con numero de telefono --}}
<form class="form-flex email-form" id="phoneGroup">
<div class="form-row col-md-9" >
<div class="form-group mb-4">
<label for="inputMail" id="phoneLabel">Teléfono</label>
<input type="number" placeholder="Teléfono" class="form-control phone" required>
<a id="emailLink" style="text-decoration: underline; margin-left: 250px;" href="#">Utilice el correo electrónico en su lugar</a>
</div>
<div class="form-group mb-4">
<label for="inputPassword" id="password2">Contraseña</label>
<input type="password" placeholder="Contraseña"
class="form-control" id="inputPassword" required>
</div>
<div class="form-group mb-4">
<label for="inputConfirmPassword" id="repitpassword2">Repetir Contraseña</label>
<input type="password" placeholder="Repetir Contraseña"
class="form-control" id="inputConfirmPassword" required>
</div>
<div class="form-group mb-12 d-flex">
<button id="" class="btn btn-primary btn-lg btn-block"><span>Iniciemos</span> <i class="las la-arrow-right"></i></button>
</div>
</div>
</form>
<div id="result"></div>
</div>
</div>
</div>
</div>
<div class="alternet-access">
<p>Ya tienes una cuenta?<a href="login.php">&nbsp; Entra aqui!</a></p>
</div>
</div>
<div class="ugf-sidebar flex-bottom ugf-sidebar-bg-2 sidebar-steps">
<div class="steps">
<div class="step">
<span>1</span>
<p>Tipo de Cuenta</p>
</div>
<div class="step step-onprocess">
<span>2</span>
<p>Verificación de Inicio</p>
</div>
<div class="step">
<span>3</span>
<p>Confirmación de Datos</p>
</div>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
{{-- <script src="{{ static_asset('assets/registrocomercio/registro-form/assets/js/jquery.min.js') }}"></script> --}}
<script src="https://code.jquery.com/jquery-3.7.0.min.js"
integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
<script src="{{ static_asset('assets/registrocomercio/registro-form/assets/js/popper.min.js') }}"></script>
<script src="{{ static_asset('assets/registrocomercio/registro-form/assets/js/bootstrap.min.js') }}"></script>
<script src="{{ static_asset('assets/registrocomercio/registro-form/assets/js/owl.carousel.min.js') }}"></script>
<script src="{{ static_asset('assets/registrocomercio/registro-form/assets/js/custom.js') }}"></script>
</body>
</html>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script>
$(document).ready(function() {
// Ocultar el formulario de teléfono por defecto
$("#phoneGroup").hide();
// Mostrar el formulario de correo electrónico al cargar la página
$("#emailGroup").show();
// Manejar el evento de clic en el enlace "phoneLink"
$("#phoneLink").click(function() {
$("#phoneGroup").show();
$("#emailGroup").hide();
});
// Manejar el evento de clic en el enlace "emailLink"
$("#emailLink").click(function() {
$("#phoneGroup").hide();
$("#emailGroup").show();
});
});
</script>