Files
hatame.andarza09/resources/views/auth/register.blade.php
T
hatame d43e74b280 git add .
git commit "add profile image upload support"
2026-08-16 11:37:20 +03:30

592 lines
29 KiB
PHP

@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">
{{-- Header --}}
<div class="theme-login-header">
<h1 class="theme-login-title">
ثبت نام
</h1>
<p class="theme-login-subtitle">
حساب کاربری جدید ایجاد کنید
</p>
</div>
{{-- Form --}}
<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
{{-- First Name --}}
<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>
{{-- Last Name --}}
<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>
{{-- National Code --}}
<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>
{{-- Gender --}}
<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>
{{-- Marital Status --}}
<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>
{{-- Spouse Name --}}
<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>
{{-- Mobile --}}
<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>
{{-- Email --}}
<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>
{{-- Profile Image --}}
<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>
{{-- Username --}}
<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>
{{-- Province --}}
<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>
{{-- City --}}
<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>
{{-- Password --}}
<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>
{{-- Password Confirmation --}}
<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>
{{-- Submit --}}
<div class="mt-6">
<button
type="submit"
class="submit-btn"
>
ساخت حساب کاربری
</button>
</div>
</form>
{{-- Login --}}
<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>
@endsection