773 lines
26 KiB
PHP
773 lines
26 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'ثبت نام | آژانس مسافرتی')
|
|
|
|
@section('content')
|
|
|
|
<div class="auth-page">
|
|
|
|
<div class="container">
|
|
|
|
<div class="auth-card register-card">
|
|
|
|
{{-- =========================================
|
|
عنوان
|
|
========================================== --}}
|
|
|
|
<div class="auth-header">
|
|
|
|
<div class="auth-icon">
|
|
<i class="fa fa-user-plus"></i>
|
|
</div>
|
|
|
|
<h1>
|
|
ایجاد حساب کاربری
|
|
</h1>
|
|
|
|
<p>
|
|
برای استفاده از امکانات سایت، اطلاعات خود را وارد کنید.
|
|
</p>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =========================================
|
|
خطاهای کلی
|
|
========================================== --}}
|
|
|
|
@if($errors->any())
|
|
|
|
<div class="auth-alert auth-alert-danger">
|
|
|
|
<i class="fa fa-exclamation-circle"></i>
|
|
|
|
<div>
|
|
|
|
<strong>
|
|
لطفاً خطاهای زیر را بررسی کنید:
|
|
</strong>
|
|
|
|
<ul>
|
|
|
|
@foreach($errors->all() as $error)
|
|
|
|
<li>
|
|
{{ $error }}
|
|
</li>
|
|
|
|
@endforeach
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@endif
|
|
|
|
|
|
{{-- =========================================
|
|
فرم ثبت نام
|
|
========================================== --}}
|
|
|
|
<form
|
|
action="{{ route('auth.register.post') }}"
|
|
method="POST"
|
|
enctype="multipart/form-data"
|
|
class="auth-form"
|
|
>
|
|
|
|
@csrf
|
|
|
|
|
|
{{-- =====================================
|
|
اطلاعات شخصی
|
|
====================================== --}}
|
|
|
|
<div class="form-section">
|
|
|
|
<div class="form-section-title">
|
|
|
|
<i class="fa fa-user"></i>
|
|
|
|
اطلاعات شخصی
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
{{-- نام --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="first_name">
|
|
نام
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="first_name"
|
|
name="first_name"
|
|
value="{{ old('first_name') }}"
|
|
class="form-control"
|
|
placeholder="نام خود را وارد کنید"
|
|
maxlength="100"
|
|
required
|
|
>
|
|
@error('first_name')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- نام خانوادگی --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="last_name">
|
|
نام خانوادگی
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="last_name"
|
|
name="last_name"
|
|
value="{{ old('last_name') }}"
|
|
class="form-control"
|
|
placeholder="نام خانوادگی خود را وارد کنید"
|
|
maxlength="100"
|
|
required
|
|
>
|
|
@error('last_name')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- کد ملی --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="national_code">
|
|
کد ملی
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="national_code"
|
|
name="national_code"
|
|
value="{{ old('national_code') }}"
|
|
class="form-control"
|
|
placeholder="مثلاً 0012345678"
|
|
maxlength="10"
|
|
inputmode="numeric"
|
|
required
|
|
>
|
|
@error('national_code')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- جنسیت --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="gender">
|
|
جنسیت
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<select
|
|
id="gender"
|
|
name="gender"
|
|
class="form-control"
|
|
required
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب کنید
|
|
</option>
|
|
|
|
<option
|
|
value="1"
|
|
{{ old('gender') == 1 ? 'selected' : '' }}
|
|
>
|
|
مرد
|
|
</option>
|
|
|
|
<option
|
|
value="2"
|
|
{{ old('gender') == 2 ? 'selected' : '' }}
|
|
>
|
|
زن
|
|
</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- وضعیت تأهل --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="marital_status">
|
|
وضعیت تأهل
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<select
|
|
id="marital_status"
|
|
name="marital_status"
|
|
class="form-control"
|
|
required
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب کنید
|
|
</option>
|
|
|
|
<option
|
|
value="1"
|
|
{{ old('marital_status') == 1 ? 'selected' : '' }}
|
|
>
|
|
مجرد
|
|
</option>
|
|
|
|
<option
|
|
value="2"
|
|
{{ old('marital_status') == 2 ? 'selected' : '' }}
|
|
>
|
|
متأهل
|
|
</option>
|
|
|
|
<option
|
|
value="3"
|
|
{{ old('marital_status') == 3 ? 'selected' : '' }}
|
|
>
|
|
متارکه
|
|
</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- نام همسر --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="spouse_name">
|
|
نام و نام خانوادگی همسر
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="spouse_name"
|
|
name="spouse_name"
|
|
value="{{ old('spouse_name') }}"
|
|
class="form-control"
|
|
placeholder="در صورت تأهل وارد کنید"
|
|
maxlength="200"
|
|
>
|
|
@error('spouse_name')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =====================================
|
|
اطلاعات تماس
|
|
====================================== --}}
|
|
|
|
<div class="form-section">
|
|
|
|
<div class="form-section-title">
|
|
|
|
<i class="fa fa-phone"></i>
|
|
|
|
اطلاعات تماس
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
{{-- موبایل --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="mobile">
|
|
شماره همراه
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="mobile"
|
|
name="mobile"
|
|
value="{{ old('mobile') }}"
|
|
class="form-control"
|
|
placeholder="09123456789"
|
|
maxlength="11"
|
|
inputmode="numeric"
|
|
required
|
|
>
|
|
@error('mobile')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- ایمیل --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="email">
|
|
ایمیل
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
value="{{ old('email') }}"
|
|
class="form-control"
|
|
placeholder="example@email.com"
|
|
maxlength="150"
|
|
dir="ltr"
|
|
required
|
|
>
|
|
@error('email')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =====================================
|
|
اطلاعات حساب
|
|
====================================== --}}
|
|
|
|
<div class="form-section">
|
|
|
|
<div class="form-section-title">
|
|
|
|
<i class="fa fa-lock"></i>
|
|
|
|
اطلاعات حساب کاربری
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
{{-- نام کاربری --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="username">
|
|
نام کاربری
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="text"
|
|
id="username"
|
|
name="username"
|
|
value="{{ old('username') }}"
|
|
class="form-control"
|
|
placeholder="مثلاً ali123"
|
|
maxlength="100"
|
|
dir="ltr"
|
|
pattern="[A-Za-z0-9]+"
|
|
required
|
|
>
|
|
@error('username')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
|
|
<small class="form-help">
|
|
فقط حروف انگلیسی و اعداد مجاز است.
|
|
</small>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- رمز --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="password">
|
|
رمز عبور
|
|
<span>*</span>
|
|
</label>
|
|
|
|
<input
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
class="form-control"
|
|
placeholder="رمز عبور"
|
|
minlength="8"
|
|
required
|
|
>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- تکرار رمز --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="password_confirmation">
|
|
تکرار رمز عبور
|
|
</label>
|
|
|
|
<input
|
|
type="password"
|
|
id="password_confirmation"
|
|
name="password_confirmation"
|
|
class="form-control"
|
|
placeholder="تکرار رمز عبور"
|
|
minlength="8"
|
|
>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =====================================
|
|
استان و شهرستان
|
|
====================================== --}}
|
|
|
|
<div class="form-section">
|
|
|
|
<div class="form-section-title">
|
|
|
|
<i class="fa fa-map-marker"></i>
|
|
|
|
محل سکونت
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
{{-- استان --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="province_id">
|
|
استان
|
|
</label>
|
|
|
|
<select
|
|
name="province_id"
|
|
id="province_id"
|
|
class="form-control"
|
|
>
|
|
|
|
<option value="">
|
|
انتخاب استان
|
|
</option>
|
|
|
|
@if(isset($provinces))
|
|
|
|
@foreach($provinces as $province)
|
|
|
|
<option
|
|
value="{{ $province->id }}"
|
|
{{ old('province_id') == $province->id ? 'selected' : '' }}
|
|
>
|
|
{{ $province->name }}
|
|
</option>
|
|
|
|
@endforeach
|
|
|
|
@endif
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- شهرستان --}}
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="city_id">
|
|
شهرستان
|
|
</label>
|
|
|
|
<select
|
|
name="city_id"
|
|
id="city_id"
|
|
class="form-control"
|
|
>
|
|
|
|
<option value="">
|
|
ابتدا استان را انتخاب کنید
|
|
</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =====================================
|
|
عکس
|
|
====================================== --}}
|
|
|
|
<div class="form-section">
|
|
|
|
<div class="form-section-title">
|
|
|
|
<i class="fa fa-image"></i>
|
|
|
|
تصویر پروفایل
|
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="image">
|
|
عکس
|
|
</label>
|
|
|
|
<input
|
|
type="file"
|
|
id="image"
|
|
name="image"
|
|
class="form-control"
|
|
accept="image/jpeg,image/png,image/jpg"
|
|
>
|
|
@error('image')
|
|
<span style="color: red">{{ $message }}</span>
|
|
@enderror
|
|
|
|
<small class="form-help">
|
|
|
|
فرمت‌های مجاز:
|
|
JPG ، JPEG ، PNG
|
|
|
|
<br>
|
|
|
|
حداکثر حجم:
|
|
800 کیلوبایت
|
|
|
|
</small>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{{-- =====================================
|
|
دکمه ثبت
|
|
====================================== --}}
|
|
|
|
<div class="auth-submit">
|
|
|
|
<button
|
|
type="submit"
|
|
class="auth-btn"
|
|
>
|
|
|
|
<i class="fa fa-user-plus"></i>
|
|
|
|
ایجاد حساب کاربری
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
{{-- =====================================
|
|
ورود
|
|
====================================== --}}
|
|
|
|
<div class="auth-footer">
|
|
|
|
قبلاً حساب ساخته‌اید؟
|
|
|
|
<a href="{{ route('auth.login.index') }}">
|
|
وارد شوید
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
|
|
<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>
|
|
`;
|
|
|
|
if (!provinceId) {
|
|
|
|
citySelect.innerHTML = `
|
|
<option value="">
|
|
ابتدا استان را انتخاب کنید
|
|
</option>
|
|
`;
|
|
|
|
return;
|
|
}
|
|
|
|
fetch(`/auth/register/provinces/${provinceId}/cities`)
|
|
.then(response => {
|
|
|
|
if (!response.ok) {
|
|
throw new Error('خطا در دریافت شهرستان‌ها');
|
|
}
|
|
|
|
return response.json();
|
|
})
|
|
.then(cities => {
|
|
|
|
citySelect.innerHTML = `
|
|
<option value="">
|
|
انتخاب شهرستان
|
|
</option>
|
|
`;
|
|
|
|
if (cities.length === 0) {
|
|
|
|
citySelect.innerHTML = `
|
|
<option value="">
|
|
شهرستانی برای این استان پیدا نشد
|
|
</option>
|
|
`;
|
|
|
|
return;
|
|
}
|
|
|
|
cities.forEach(city => {
|
|
|
|
const option = document.createElement('option');
|
|
|
|
option.value = city.id;
|
|
option.textContent = city.name;
|
|
|
|
citySelect.appendChild(option);
|
|
});
|
|
|
|
})
|
|
.catch(error => {
|
|
|
|
console.error(error);
|
|
|
|
citySelect.innerHTML = `
|
|
<option value="">
|
|
خطا در دریافت شهرستان‌ها
|
|
</option>
|
|
`;
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
</script>
|
|
|
|
@endpush
|