Последняя версия с сервера прошлого разработчика
This commit is contained in:
196
resources/js/Pages/Auth/Login.vue
Executable file
196
resources/js/Pages/Auth/Login.vue
Executable file
@@ -0,0 +1,196 @@
|
||||
<template>
|
||||
<meta-head title="Авторизация">
|
||||
<meta name="description" content="Авторизация">
|
||||
</meta-head>
|
||||
|
||||
<!-- <header-auth /> -->
|
||||
|
||||
<div class="min-h-screen place-items-center grid md:pt-3 bg-center bg-cover"
|
||||
style="background-image: url('/image/auth-bg.jpg');"
|
||||
>
|
||||
<div class="w-full max-w-7xl mx-auto ">
|
||||
<div class="md:grid grid-cols-12 ">
|
||||
<div class="col-span-7 bg-indigo-200">
|
||||
<div class="p-4 lg:p-28">
|
||||
<inertia-link
|
||||
:href="route('dashboard')"
|
||||
class="inline-flex gap-1 items-center text-gray-light"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18"
|
||||
height="18" viewBox="0 0 24 24"
|
||||
fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" class="flex-shrink-0"
|
||||
><polyline points="9 10 4 15 9 20"></polyline><path d="M20 4v7a4 4 0 0 1-4 4H4"></path></svg> Вернуться
|
||||
</inertia-link>
|
||||
<h1 class="font-medium text-xl md:text-2xl lg:text-4xl text-white text-center">
|
||||
Войти
|
||||
</h1>
|
||||
<div v-if="$page.props.flash.status">
|
||||
<p class="text-lg md:text-xl text-orange text-center mt-3">
|
||||
{{ $page.props.flash.status }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="auth-form mt-7">
|
||||
<form class="space-y-6" @submit.prevent="submit">
|
||||
<div>
|
||||
<div class="relative">
|
||||
<div class="absolute inset-y-0 left-5 text-gray flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24"
|
||||
height="24" viewBox="0 0 24 24"
|
||||
fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" class="flex-shrink-0"
|
||||
>
|
||||
<path
|
||||
d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"
|
||||
>
|
||||
</path>
|
||||
<polyline points="22,6 12,13 2,6"></polyline>
|
||||
</svg>
|
||||
</div>
|
||||
<input
|
||||
v-model="form.email"
|
||||
autocapitalize="off"
|
||||
class="w-full pl-14 h-12 md:h-16 focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border-transparent bg-indigo-100 rounded-md placeholder-gray"
|
||||
type="email" placeholder="E-mail"
|
||||
>
|
||||
</div>
|
||||
<div v-if="form.errors.email" class="form-error text-sm text-red">
|
||||
{{ form.errors.email }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<div class="relative">
|
||||
<div class="absolute inset-y-0 left-5 text-gray flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24"
|
||||
height="24" viewBox="0 0 24 24"
|
||||
fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" class="flex-shrink-0"
|
||||
>
|
||||
<rect x="3" y="11"
|
||||
width="18" height="11"
|
||||
rx="2" ry="2"
|
||||
></rect>
|
||||
<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<input
|
||||
v-model="form.password"
|
||||
class="w-full pl-14 h-12 md:h-16 focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border-transparent bg-indigo-100 rounded-md placeholder-gray"
|
||||
type="password" placeholder="Пароль"
|
||||
>
|
||||
</div>
|
||||
<div v-if="form.errors.password" class="form-error text-sm text-red">
|
||||
{{ form.errors.password }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center">
|
||||
<input id="remember" v-model="form.remember"
|
||||
type="checkbox" class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
|
||||
>
|
||||
<label for="remember" class="select-none ml-3 text-gray">Запомни меня</label>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-between gap-1">
|
||||
<loading-button :loading="form.processing" class="mx-3 my-1 px-12 py-3 transition shadow-none hover:shadow-classic2 inline-flex items-center justify-center text-base rounded-full text-white bg-orange focus:outline-none"
|
||||
type="submit"
|
||||
>
|
||||
Войти
|
||||
</loading-button>
|
||||
|
||||
<inertia-link :href="route('password.request')" class="hover:underline text-sm text-gray-light">
|
||||
Восстановить пароль
|
||||
</inertia-link>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-5 bg-center bg-cover" style="background-image: url('image/orange-auth.jpg');">
|
||||
<div class="py-4 lg:py-28 px-4">
|
||||
<div class="font-medium text-xl md:text-2xl lg:text-4xl !leading-relaxed text-white text-center">
|
||||
Заработай на своем
|
||||
творчестве первый миллион
|
||||
</div>
|
||||
<div class="font-medium text-xl md:text-2xl lg:text-4xl !leading-relaxed text-white text-center">
|
||||
Присоединяйся к teeaseer
|
||||
прямо сейчас!
|
||||
</div>
|
||||
|
||||
<div class="text-center mt-4 md:mt-10">
|
||||
<inertia-link
|
||||
:href="route('register')"
|
||||
class="mx-3 my-1 px-12 py-3 transition shadow-none hover:shadow-classic2 inline-flex items-center justify-center text-base rounded-full text-white border border-white bg-transparent focus:outline-none"
|
||||
>
|
||||
Зарегистрироваться
|
||||
</inertia-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="bg-indigo-300 mt-auto">
|
||||
<div class="container mx-auto p-2 text-sm text-gray-light">
|
||||
<div class="-mx-2 -my-2 flex flex-wrap justify-between">
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/about">О компании</a>
|
||||
</div>
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/offer">Оферта</a>
|
||||
</div>
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/terms-payment">Условия оплаты</a>
|
||||
</div>
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/terms-service">Условия предоставления услуг</a>
|
||||
</div>
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/cookies">Cookies</a>
|
||||
</div>
|
||||
<div class="mx-2 my-2">
|
||||
<a href="/company/privacy-policy">Privacy Policy</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Inertia } from '@inertiajs/inertia'
|
||||
import LoadingButton from '@/Shared/Form/LoadingButton.vue'
|
||||
// import HeaderAuth from '@/Shared/LayoutParts/HeaderAuth.vue'
|
||||
import MetaHead from '@/Shared/MetaHead.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
MetaHead,
|
||||
// HeaderAuth,
|
||||
LoadingButton,
|
||||
},
|
||||
|
||||
setup() {
|
||||
const form = Inertia.form({
|
||||
email: null,
|
||||
password: null,
|
||||
remember: false,
|
||||
})
|
||||
|
||||
const submit = () => {
|
||||
form.post(route('login.store'))
|
||||
}
|
||||
|
||||
return {
|
||||
form,
|
||||
submit,
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user