612 lines
30 KiB
PHP
612 lines
30 KiB
PHP
<link rel="stylesheet" href="{{ asset('assets/css/register_login.css') }}">
|
|
|
|
@extends('layouts.app')
|
|
@section('content')
|
|
|
|
|
|
<div class="theme-hero-area-bg-wrap">
|
|
<div class="theme-hero-area-bg"
|
|
style="background-image:url({{ asset('img/adult-book-business-cactus-297755_1500x800.jpg') }});">
|
|
</div>
|
|
|
|
<div class="theme-hero-area-mask theme-hero-area-mask-strong"></div>
|
|
</div>
|
|
|
|
<div class="theme-hero-area-body">
|
|
|
|
<div class="theme-page-section _pt-100 theme-page-section-xl">
|
|
|
|
<div class="container">
|
|
|
|
<div class="row">
|
|
|
|
<div class="col-md-4 col-md-offset-4">
|
|
|
|
<div class="theme-login theme-login-white">
|
|
|
|
<div class="theme-login-header">
|
|
|
|
<h1 class="theme-login-title">
|
|
ثبت نام
|
|
</h1>
|
|
|
|
<p class="theme-login-subtitle">
|
|
حساب کاربری جدید ایجاد کنید
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<div class="theme-login-box">
|
|
|
|
<div class="theme-login-box-inner">
|
|
|
|
<form
|
|
class="theme-login-form"
|
|
action="{{ route('auth.register.post') }}"
|
|
method="POST"
|
|
enctype="multipart/form-data"
|
|
>
|
|
|
|
@csrf
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="first_name"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
نام
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="first_name"
|
|
name="first_name"
|
|
value="{{ old('first_name') }}"
|
|
autocomplete="given-name"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('first_name')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="last_name"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
نام خانوادگی
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="last_name"
|
|
name="last_name"
|
|
value="{{ old('last_name') }}"
|
|
autocomplete="family-name"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('last_name')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="national_code"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
کد ملی
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="national_code"
|
|
name="national_code"
|
|
value="{{ old('national_code') }}"
|
|
inputmode="numeric"
|
|
maxlength="10"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('national_code')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row mb-4" data-gutter="10">
|
|
|
|
<div class="col-md-6">
|
|
|
|
<label
|
|
class="block text-sm font-medium text-gray-500 dark:text-gray-300 mb-2"
|
|
>
|
|
جنسیت
|
|
</label>
|
|
|
|
<select
|
|
name="gender"
|
|
class="form-control"
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب جنسیت
|
|
</option>
|
|
|
|
<option
|
|
value="0"
|
|
@selected(old('gender') == '0')
|
|
>
|
|
مرد
|
|
</option>
|
|
|
|
<option
|
|
value="1"
|
|
@selected(old('gender') == '1')
|
|
>
|
|
زن
|
|
</option>
|
|
|
|
</select>
|
|
|
|
@error('gender')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
<label
|
|
class="block text-sm font-medium text-gray-500 dark:text-gray-300 mb-2"
|
|
>
|
|
وضعیت تأهل
|
|
</label>
|
|
|
|
<select
|
|
name="marital_status"
|
|
class="form-control"
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب وضعیت
|
|
</option>
|
|
|
|
<option
|
|
value="0"
|
|
@selected(old('marital_status') == '0')
|
|
>
|
|
مجرد
|
|
</option>
|
|
|
|
<option
|
|
value="1"
|
|
@selected(old('marital_status') == '1')
|
|
>
|
|
متأهل
|
|
</option>
|
|
|
|
<option
|
|
value="2"
|
|
@selected(old('marital_status') == '2')
|
|
>
|
|
متارکه
|
|
</option>
|
|
|
|
</select>
|
|
|
|
@error('marital_status')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="spouse_name"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
نام و نام خانوادگی همسر
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="spouse_name"
|
|
name="spouse_name"
|
|
value="{{ old('spouse_name') }}"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('spouse_name')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="mobile"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
شماره موبایل
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="mobile"
|
|
name="mobile"
|
|
value="{{ old('mobile') }}"
|
|
inputmode="tel"
|
|
autocomplete="tel"
|
|
placeholder="09123456789"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('mobile')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="email"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
ایمیل
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
value="{{ old('email') }}"
|
|
autocomplete="email"
|
|
placeholder="example@email.com"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('email')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="profile_image"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
تصویر پروفایل
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="file"
|
|
id="profile_image"
|
|
name="profile_image"
|
|
accept=".jpg,.jpeg,.png,.webp"
|
|
class="block w-full p-3 text-base outline-none text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent rounded-md"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('profile_image')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="username"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
نام کاربری
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="text"
|
|
id="username"
|
|
name="username"
|
|
value="{{ old('username') }}"
|
|
autocomplete="username"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('username')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="province_id"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
استان
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<select
|
|
id="province_id"
|
|
name="province_id"
|
|
class="form-control"
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب استان
|
|
</option>
|
|
|
|
@foreach($provinces as $province)
|
|
|
|
<option
|
|
value="{{ $province->id }}"
|
|
@selected(old('province_id') == $province->id)
|
|
>
|
|
{{ $province->name }}
|
|
</option>
|
|
|
|
@endforeach
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
@error('province_id')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="city_id"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
شهرستان
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<select
|
|
id="city_id"
|
|
name="city_id"
|
|
class="form-control"
|
|
disabled
|
|
>
|
|
|
|
<option value="">
|
|
ابتدا استان را انتخاب کنید
|
|
</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
@error('city_id')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="password"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
رمز عبور
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
autocomplete="new-password"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
@error('password')
|
|
<span class="text-red-500 text-sm">
|
|
{{ $message }}
|
|
</span>
|
|
@enderror
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mb-4">
|
|
|
|
<label
|
|
for="password_confirmation"
|
|
class="block text-sm/6 font-medium text-gray-500 dark:text-gray-300"
|
|
>
|
|
تکرار رمز عبور
|
|
</label>
|
|
|
|
<div class="mt-3">
|
|
|
|
<input
|
|
type="password"
|
|
id="password_confirmation"
|
|
name="password_confirmation"
|
|
autocomplete="new-password"
|
|
class="block w-full p-3 text-base outline-none placeholder:text-gray-400 sm:text-sm/6 transition-all text-gray-800 dark:text-gray-100 dark:bg-gray-900 bg-slate-100 border border-transparent hover:border-slate-200 appearance-none rounded-md focus:bg-white focus:border-indigo-400 focus:ring-2 focus:ring-indigo-100"
|
|
>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mt-6">
|
|
|
|
<button
|
|
type="submit"
|
|
class="submit-btn"
|
|
>
|
|
ساخت حساب کاربری
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
|
|
<p class="mt-8 text-center text-sm/6 text-gray-500 dark:text-gray-300">
|
|
|
|
حساب کاربری دارید؟
|
|
|
|
<a
|
|
class="text-blue-400"
|
|
href="{{ route('auth.login.index') }}"
|
|
>
|
|
ورود
|
|
</a>
|
|
|
|
</p>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const provinceSelect = document.getElementById('province_id');
|
|
const citySelect = document.getElementById('city_id');
|
|
|
|
provinceSelect.addEventListener('change', function () {
|
|
const provinceId = this.value;
|
|
|
|
citySelect.innerHTML = '<option value="">در حال بارگذاری...</option>';
|
|
citySelect.disabled = true;
|
|
|
|
if (!provinceId) {
|
|
citySelect.innerHTML = '<option value="">ابتدا استان را انتخاب کنید</option>';
|
|
return;
|
|
}
|
|
|
|
fetch(`{{ url('/cities') }}/${provinceId}`)
|
|
.then(response => response.json())
|
|
.then(cities => {
|
|
citySelect.innerHTML = '<option value="">انتخاب شهرستان</option>';
|
|
|
|
cities.forEach(city => {
|
|
const option = document.createElement('option');
|
|
option.value = city.id;
|
|
option.textContent = city.name;
|
|
citySelect.appendChild(option);
|
|
});
|
|
|
|
citySelect.disabled = false;
|
|
})
|
|
.catch(() => {
|
|
citySelect.innerHTML = '<option value="">خطا در دریافت شهرها</option>';
|
|
citySelect.disabled = false;
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
|
|
@endsection
|