forked from eatvio/eatvio-infra
400 lines
26 KiB
PHP
400 lines
26 KiB
PHP
@php
|
|
$currentLocale = LaravelLocalization::getCurrentLocale();
|
|
@endphp
|
|
<!DOCTYPE html>
|
|
<html lang="{{ $currentLocale }}">
|
|
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>{{env('HOME_PAGE_TITLE')}}</title>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
|
|
</style>
|
|
<link type="text/css" rel="stylesheet" href="/css/bootstrap.min.css" />
|
|
{{-- <link type="text/css" rel="stylesheet" href="/css/bootstrap.rtl.min.css" /> --}}
|
|
<link type="text/css" rel="stylesheet" href="/css/datepicker.min.css" />
|
|
<link type="text/css" rel="stylesheet" href="/css/style.css" />
|
|
@livewireStyles
|
|
</head>
|
|
|
|
<body>
|
|
<header></header>
|
|
<section class="d-flex align-items-center --80vh py-5" id="main">
|
|
<div id="auth_content" class="container --mw-1000">
|
|
<div class="row align-items-center justify-content-between">
|
|
<div class="col-md-6">
|
|
<img src="/img/logo.svg" class="logo" />
|
|
<div class="h4 my-5 --medium_title">{{ __('messages.eatvio_wellcome') }}</div>
|
|
{{-- <livewire:counter /> --}}
|
|
<div class="mobile_app mb-5">
|
|
<a href="#" class="me-4"><img src="/img/pm.svg" class="logo" /></a>
|
|
<a href="#"><img src="/img/as.svg" class="logo" /></a>
|
|
</div>
|
|
@if ($errors->any())
|
|
<div class="alert alert-danger">
|
|
<ul>
|
|
@foreach ($errors->all() as $error)
|
|
<li>{{ $error }}</li>
|
|
@endforeach
|
|
</ul>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="col-md-5">
|
|
<div class="--popup_style --b_radius">
|
|
<form class="form-signin" action="{{ route('login', null, false) }}" method="post">
|
|
@csrf
|
|
<input type="email" name="email" id="inputEmail_main" autocomplete="email" class="form-control" placeholder="{{ __('auth.input_login_placeholder') }}" required="" autofocus="" />
|
|
<input type="password" name="password" id="inputPassword_main" autocomplete="current-password" class="form-control my-3" placeholder="{{ __('auth.input_password_placeholder') }}" required="" />
|
|
{{-- <input type="password" id="inputPassword_main" autocomplete="current-password" class="form-control my-3" placeholder="{{ __('auth.input_password_placeholder') }}" required="" /> --}}
|
|
<div class="block mt-4">
|
|
<label for="remember_me" class="flex items-center">
|
|
<input type="checkbox" class="rounded border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" id="remember_me" name="remember">
|
|
<span class="ml-2 text-sm text-gray-600">Remember me</span>
|
|
</label>
|
|
</div>
|
|
|
|
<button class="mb-3 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="submit">{{ __('auth.button_sigin') }}</button>
|
|
<div class="text-center --f_bold"><a href="{{ route('password.request') }}">{{ __('auth.anhor_forgot_password') }}</a></div>
|
|
<hr />
|
|
<div class="text-center px-3">
|
|
<a href="{{ route('register.start') }}" data-toggle="modal" data-target="#regModal" class="mb-3 px-4 btn btn-lg btn-dark btn-block w-100 --f_bold text-uppercase">{{ __('auth.button_create_new_account') }}</a>
|
|
</div>
|
|
</form>
|
|
{{--
|
|
<button type="button" class="mb-3 px-4 btn btn-lg btn-dark btn-block w-100 --f_bold text-uppercase text-center" data-bs-toggle="modal" data-bs-target="#regModal">
|
|
{{ __('auth.button_create_new_account') }}
|
|
</button>
|
|
--}}
|
|
|
|
</div>
|
|
<div class="text-center my-3">
|
|
<a href="#" data-bs-toggle="modal" data-bs-target="#consultantModal" class="text-uppercase --f_bolder" style="color:var(--main_fcolor)">{{ __('auth.anhor_i_am_consultant') }}</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal" id="regModal" area-hidden="true" tabindex="-1" aria-labelledby="regModalTitle">
|
|
<div class="modal-dialog p-0 --popup_style --b_radius">
|
|
<div class="modal-content">
|
|
<div class="p-3">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title --medium_title" id="regModalTitle">{{ __('reg_form.registration') }}</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form class="form-signin" name='init_registration' method="post" action="/register">
|
|
@csrf
|
|
<input type="hidden" name="terms" value=on />
|
|
|
|
<div class="progress mb-2 w-100" style="display:none;">
|
|
<div class="progress-bar" role="progressbar" style="width:25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
|
|
<div class="Steps" id="registrationSteps">
|
|
|
|
<hidden>{{ __('reg_form.registration') }}</hidden>
|
|
<div step-item>
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<input type="text" id="inputFirstName" name="first_name" class="form-control" placeholder="{{ __('reg_form.first_name') }}" required="" />
|
|
</div>
|
|
<div class="col-6">
|
|
<input type="text" id="inputLastName" name="last_name" class="form-control" placeholder="{{ __('reg_form.last_name') }}" required="" />
|
|
</div>
|
|
</div>
|
|
|
|
<input type="email" autocomplete="email" id="inputEmail" name="email" autocomplete="current-password" class="form-control my-3" placeholder="{{ __('reg_form.login') }}" required="" />
|
|
|
|
<input type="password" id="inputPassword" name="password" autocomplete="current-password" class="form-control my-3" placeholder="{{ __('reg_form.password') }}" required="" />
|
|
<input type="password" id="inputPassword_confirmation" name="password_confirmation" autocomplete="current-password" class="form-control my-3" placeholder="{{ __('reg_form.password_confirmation') }}" required="" />
|
|
|
|
<div class="text-center --f_bold">{{ __('reg_form.date_of_birth') }}</div>
|
|
|
|
<div class="--with_arr">
|
|
<!-- http://t1m0n.name/air-datepicker/docs/index-ru.html -->
|
|
<input type="text" id="birthdate" name="birthdate" data-date-format="yyyy-mm-dd" class="form-control my-3 text-center --f_bold" value="2000-01-01" required="" autocomplete="off" />
|
|
<span></span>
|
|
</div>
|
|
|
|
<div class="my-3 text-center --f_bold">{{ __('reg_form.gender') }}</div>
|
|
<div class="btn-group mb-3 d-flex justify-content-center --roundredRadioButtons">
|
|
<input type="radio" class="btn-check" name="gender" id="genderM" autocomplete="off" checked value="male" />
|
|
<label class="btn btn-x btn-primary" for="genderM">{{ __('reg_form.male') }}</label>
|
|
|
|
<input type="radio" class="btn-check" name="gender" id="genderF" autocomplete="off" value="female" />
|
|
<label class="btn btn-lg btn-primary" for="genderF">{{ __('reg_form.female') }}</label>
|
|
</div>
|
|
|
|
<p class="--max_small --f_grey lh-1">{{ __('reg_form.confirm_t1') }} <a href="#" class="--f_black">{{ __('reg_form.confirm_t2') }}</a>, <a href="#" class="--f_black">{{ __('reg_form.confirm_t3') }}</a> {{ __('reg_form.confirm_t4') }} <a href="#" class="--f_black">{{ __('reg_form.confirm_t5') }}</a>{{ __('reg_form.confirm_t6') }}</p>
|
|
|
|
<button class="btn btn-lg btn-primary btn-block w-100 --f_bolder text-uppercase" type="button" next-step>{{ __('reg_form.registration') }}</button>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step2_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="row mt-4">
|
|
<div class="col-6">
|
|
<div class="text-center --f_bold">{{ __('reg_form.country') }}</div>
|
|
<div class="--with_arr my-3">
|
|
<select class="form-select text-center" name="country">
|
|
<option selected>{{ __('reg_form.country_ru') }}</option>
|
|
<option>{{ __('reg_form.country_ua') }}</option>
|
|
</select>
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="text-center --f_bold">{{ __('reg_form.city') }}</div>
|
|
<div class="--with_arr my-3">
|
|
<select class="form-select text-center" name="city">
|
|
<option selected>{{ __('reg_form.city_msk') }}</option>
|
|
<option>{{ __('reg_form.city_kv') }}</option>
|
|
</select>
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="text-center --f_bold">{{ __('reg_form.talk_lang') }}</div>
|
|
<div class="--with_arr my-3">
|
|
<select class="form-select text-center" name="lang">
|
|
<option selected>{{ __('reg_form.talk_lang_ru') }}</option>
|
|
<option>{{ __('reg_form.talk_lang_ua') }}</option>
|
|
<option>{{ __('reg_form.talk_lang_pl') }}</option>
|
|
</select>
|
|
<span></span>
|
|
</div>
|
|
<div class="text-center --f_bold">{{ __('reg_form.your_weight') }}</div>
|
|
<input type="number" id="inputWeight" name="weight" class="form-control my-3 text-center" value="" />
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step3_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.primary_measurements') }}</div>
|
|
<div class="row">
|
|
<div class="col-4">
|
|
<div class="text-center --f_bold">{{ __('reg_form.chest_circumference') }}</div>
|
|
<input type="number" name="chest_circumference" class="form-control my-3 text-center" value="" />
|
|
</div>
|
|
<div class="col-4">
|
|
<div class="text-center --f_bold">{{ __('reg_form.waist_circumference') }}</div>
|
|
<input type="number" name="waist_circumference" class="form-control my-3 text-center" value="" />
|
|
</div>
|
|
<div class="col-4">
|
|
<div class="text-center --f_bold">{{ __('reg_form.hip_circumference') }}</div>
|
|
<input type="number" name="hip_circumference" class="form-control my-3 text-center" value="" />
|
|
</div>
|
|
</div>
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step4_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.your_blood_pressure') }}</div>
|
|
|
|
<div class="text-center --f_bold">{{ __('reg_form.average_pressure_readings') }}</div>
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="text-center --f_bold">{{ __('reg_form.pressure_up') }}</div>
|
|
<input type="number" name="blood_pressure_up" class="form-control my-3 text-center" value="" />
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="text-center --f_bold">{{ __('reg_form.pressure_down') }}</div>
|
|
<input type="number" name="blood_pressure_down" class="form-control my-3 text-center" value="" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center --f_bold">{{ __('reg_form.tendency_to_be_hypo') }}</div>
|
|
<div class="--with_arr my-3">
|
|
<select class="form-select text-center" name="has_hypo">
|
|
<option selected value="0">{{ __('reg_form.no') }}</option>
|
|
<option value="1">{{ __('reg_form.yes') }}</option>
|
|
</select>
|
|
<span></span>
|
|
</div>
|
|
|
|
<div class="text-center --f_bold">{{ __('reg_form.prone_to_hypertension') }}</div>
|
|
<div class="--with_arr my-3">
|
|
<select class="form-select text-center" name="has_hyper">
|
|
<option selected value="0">{{ __('reg_form.no') }}</option>
|
|
<option value="1">{{ __('reg_form.yes') }}</option>
|
|
</select>
|
|
<span></span>
|
|
</div>
|
|
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step5_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.has_alergy') }}</div>
|
|
|
|
<textarea name="about_alergy" class="form-control my-3" placeholder="{{ __('reg_form.enter_info') }}" style="min-height"></textarea>
|
|
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step6_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.take_pils') }}</div>
|
|
|
|
<textarea name="about_taking_pils" class="form-control my-3" placeholder="{{ __('reg_form.enter_info') }}" style="min-height"></textarea>
|
|
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step7_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.sport_hobbies') }}</div>
|
|
|
|
<textarea name="about_sport_hobbies" class="form-control my-3" placeholder="{{ __('reg_form.enter_info') }}" style="min-height"></textarea>
|
|
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step8_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.favorite_foods_q') }}</div>
|
|
|
|
<textarea name="favorite_foods" class="form-control" placeholder="{{ __('reg_form.favorite_foods') }}" style="min-height:140px"></textarea>
|
|
<textarea name="unfavorite_foods" class="form-control my-3" placeholder="{{ __('reg_form.unfavorite_foods') }}" style="min-height:140px"></textarea>
|
|
|
|
<button class="mb-2 btn btn-lg btn-primary btn-block w-100 --f_bolder" type="button" next-step>{{ __('reg_form.continue') }}</button>
|
|
<div class="text-center --f_bold"><a href="javascript:void(0)" skip-step><span class="--f_grey">{{ __('reg_form.skip') }}</span></a></div>
|
|
</div>
|
|
|
|
<hidden>{{ __('reg_form.step9_head') }}</hidden>
|
|
<div step-item>
|
|
<div class="my-3 text-center">{{ __('reg_form.optional_info') }}</div>
|
|
|
|
<textarea name="additional_info" class="form-control my-3" placeholder="{{ __('reg_form.any_additional_info') }}" style="min-height:140px"></textarea>
|
|
|
|
<button class="btn btn-lg btn-primary btn-block w-100 --f_bolder" type="submit">{{ __('reg_form.complete') }}</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal" id="consultantModal" area-hidden="true" tabindex="-1" aria-labelledby="consultantModalTitle">
|
|
<div class="modal-dialog p-0 --popup_style --b_radius">
|
|
<div class="modal-content">
|
|
<div class="p-3">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title --medium_title" id="consultantModalTitle">{{ __('reg_form.consultant_title') }}</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>{{ __('reg_form.consultant_instruction_part1') }}</p>
|
|
<p>{{ __('reg_form.consultant_instruction_part2') }}</p>
|
|
<p>{{ __('reg_form.consultant_instruction_part3') }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
<footer>
|
|
<div class="container --mw-1000 py-5 --f_bold">
|
|
<div class="d-flex align-items-center justify-content-between">
|
|
<div>
|
|
<a href="/ru" @class(['me-4'=> $currentLocale == 'ru', 'active' => $currentLocale == 'ru'])>Русский</a>
|
|
<a href="/en" @class(['ms-4'=> $currentLocale == 'en', 'active' => $currentLocale == 'en'])>English</a>
|
|
</div>
|
|
<div style="color:var(--main_fcolor)">
|
|
Eatvio © {{ date('Y') }}
|
|
</div>
|
|
</div>
|
|
<hr />
|
|
<ul class="--menu --footer">
|
|
<li><a href="#">{{ __('messages.privacy') }}</a></li>
|
|
<li><a href="#">{{ __('messages.terms_of_use') }}</a></li>
|
|
<li><a href="#">{{ __('messages.reference') }}</a></li>
|
|
<li><a href="#">{{ __('messages.registration') }}</a></li>
|
|
</ul>
|
|
</div>
|
|
</footer>
|
|
<script src="/js/bootstrap.min.js"></script>
|
|
<script src="/js/jquery-3.6.0.min.js"></script>
|
|
<script src="/js/jquery.steps.min.js"></script>
|
|
<script src="/js/datepicker.js"></script>
|
|
<script>
|
|
// https://bootstrap5.ru/docs/components/modal
|
|
const regModal = document.getElementById('regModal'),
|
|
regFormModal = new bootstrap.Modal(regModal, {});
|
|
|
|
const consultantModal = document.getElementById('consultantModal'),
|
|
consultantFormModal = new bootstrap.Modal(consultantModal, {});
|
|
|
|
$(document).ready(() => {
|
|
const regTitle = $(regModal).find('.modal-title'),
|
|
close = $(regModal).find('.close'),
|
|
progress = $(regModal).find('.progress'),
|
|
prgrssbar = $('.progress-bar', progress),
|
|
steps = $('#registrationSteps'),
|
|
stepsCnt = 10;
|
|
const consultantTitle = $(consultantModal).find('.modal'),
|
|
consultantClose = $(consultantModal).find('.close');
|
|
|
|
// https://github.com/rstaib/jquery-steps/wiki/Settings
|
|
steps.steps({
|
|
headerTag: 'hidden',
|
|
enableKeyNavigation: false,
|
|
enablePagination: false,
|
|
enableFinishButton: false,
|
|
transitionEffect: 'fade',
|
|
transitionEffectSpeed: 300,
|
|
onInit: (event, currentIndex) => {
|
|
// TODO - надо ещё валидацию прикрутить
|
|
$(regModal).find('[next-step], [skip-step]').bind('click', () => {
|
|
steps.steps('next')
|
|
});
|
|
},
|
|
onStepChanged: (event, currentIndex, priorIndex) => {
|
|
let title = $('#registrationSteps-h-' + currentIndex).text();
|
|
regTitle.text(title);
|
|
if (currentIndex > 0)
|
|
prgrssbar.css({
|
|
width: (currentIndex + 1) * 100 / stepsCnt + '%'
|
|
}), progress.show(300);
|
|
else
|
|
prgrssbar.css({
|
|
width: 0
|
|
}), progress.hide(300);
|
|
},
|
|
});
|
|
|
|
// http://t1m0n.name/air-datepicker/docs/index-ru.html
|
|
regModal.addEventListener('shown.bs.modal', (e) => {
|
|
$('#birthdate').datepicker()
|
|
});
|
|
close.bind('click', () => {
|
|
regFormModal.hide()
|
|
});
|
|
consultantClose.bind('click', () => {
|
|
consultantFormModal.hide()
|
|
});
|
|
|
|
});
|
|
</script>
|
|
@livewireScripts
|
|
</body>
|
|
|
|
</html>
|