Files
termanager2/resources/views/livewire/profile.blade.php
2026-07-30 17:05:39 +02:00

91 lines
5.5 KiB
PHP

<div>
<div class="mb-6">
<a href="{{ route('dashboard') }}" class="inline-flex items-center gap-1 text-sm text-gray-500 hover:text-indigo-600 transition-colors mb-1">
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/></svg>
Torna alla home
</a>
<h1 class="text-2xl font-bold text-gray-900">Il mio profilo</h1>
</div>
<div class="max-w-2xl space-y-6">
{{-- Intestazione: avatar iniziale + nome --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 flex items-center gap-4">
<div class="h-16 w-16 flex-none rounded-full flex items-center justify-center text-white text-2xl font-bold shadow-sm"
style="background:linear-gradient(135deg,#4f46e5,#6366f1)">
{{ strtoupper(mb_substr($user->name, 0, 1)) }}
</div>
<div class="min-w-0">
<h2 class="text-xl font-bold text-gray-900 truncate">{{ $user->name }}</h2>
<p class="text-sm text-gray-500 truncate mt-0.5">
<span class="break-all">{{ $user->email }}</span>
<span class="ml-1 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-indigo-50 text-indigo-700 align-middle">
{{ ucfirst($user->roles->first()?->name ?? 'utente') }}
</span>
</p>
</div>
</div>
{{-- Dati profilo --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-900 mb-1">Dati profilo</h3>
<p class="text-sm text-gray-500 mb-4">Aggiorna nome e cognome ed email.</p>
@if(session('profile_success'))
<div class="mb-4 rounded-lg bg-green-50 border border-green-200 px-4 py-2.5 text-sm text-green-800">
{{ session('profile_success') }}
</div>
@endif
<form wire:submit="updateProfile" class="space-y-4">
<div>
<label for="name" class="block text-sm font-medium text-gray-700">Nome e cognome</label>
<input wire:model="name" type="text" id="name" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 text-sm">
@error('name') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label for="email" class="block text-sm font-medium text-gray-700">Email</label>
<input wire:model="email" type="email" id="email" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 text-sm">
@error('email') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div class="flex justify-end">
<x-btn variante="primary" type="submit">Salva modifiche</x-btn>
</div>
</form>
</div>
{{-- Cambio password --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-900 mb-1">Cambia password</h3>
<p class="text-sm text-gray-500 mb-4">Per motivi di sicurezza conferma la password attuale.</p>
@if(session('password_success'))
<div class="mb-4 rounded-lg bg-green-50 border border-green-200 px-4 py-2.5 text-sm text-green-800">
{{ session('password_success') }}
</div>
@endif
<form wire:submit="updatePassword" class="space-y-4">
<div>
<label for="current_password" class="block text-sm font-medium text-gray-700">Password attuale</label>
<input wire:model="current_password" type="password" id="current_password" autocomplete="current-password" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 text-sm">
@error('current_password') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<label for="password" class="block text-sm font-medium text-gray-700">Nuova password</label>
<input wire:model="password" type="password" id="password" autocomplete="new-password" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 text-sm">
@error('password') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label for="password_confirmation" class="block text-sm font-medium text-gray-700">Conferma nuova password</label>
<input wire:model="password_confirmation" type="password" id="password_confirmation" autocomplete="new-password" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 text-sm">
</div>
</div>
<div class="flex justify-end">
<x-btn variante="primary" type="submit">Aggiorna password</x-btn>
</div>
</form>
</div>
</div>
</div>