@extends('layouts.app')
@section('title', 'Thêm User Mới')

@section('content')
<div class="form-container">
    <div class="form-header">
        <h3 class="form-header-title">Thêm User Mới</h3>
    </div>
    
    <form action="{{ route('admin.users.store') }}" method="POST">
        @csrf
        
        <div class="form-body">
            <div class="form-group">
                <label class="form-label" for="msnv">Mã nhân viên (MSNV) <span class="text-red-500">*</span></label>
                <div class="form-input-group">
                    <span class="form-input-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
                            <path stroke-linecap="round" stroke-linejoin="round" d="M15 9h3.75M15 12h3.75M15 15h3.75M4.5 19.5h15a2.25 2.25 0 002.25-2.25V6.75A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25v10.5A2.25 2.25 0 004.5 19.5zm6-10.125a1.875 1.875 0 11-3.75 0 1.875 1.875 0 013.75 0zm1.294 6.336a6.721 6.721 0 01-3.17.789 6.721 6.721 0 01-3.168-.789 3.376 3.376 0 016.338 0z" />
                        </svg>
                    </span>
                    <input type="text" name="msnv" id="msnv" class="form-input form-input-with-icon" required value="{{ old('msnv') }}" placeholder="VD: RUN-0123">
                </div>
                @error('msnv')<span class="error-text">{{ $message }}</span>@enderror
            </div>

            <div class="form-group">
                <label class="form-label" for="mail">Email <span class="text-red-500">*</span></label>
                <div class="form-input-group">
                    <span class="form-input-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
                            <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" />
                        </svg>
                    </span>
                    <input type="email" name="mail" id="mail" class="form-input form-input-with-icon" required value="{{ old('mail') }}" placeholder="VD: nguyenva@runsystem.net">
                </div>
                @error('mail')<span class="error-text">{{ $message }}</span>@enderror
            </div>

            <div class="form-group">
                <label class="form-label" for="password">Mật khẩu khởi tạo <span class="text-red-500">*</span></label>
                <div class="form-input-group">
                    <span class="form-input-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
                            <path stroke-linecap="round" stroke-linejoin="round" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0V10.5m-2.812 10.5h14.625c.621 0 1.125-.504 1.125-1.125V11.25c0-.621-.504-1.125-1.125-1.125H3.75c-.621 0-1.125.504-1.125 1.125v7.875c0 .621.504 1.125 1.125 1.125z" />
                        </svg>
                    </span>
                    <input type="text" name="password" id="password" class="form-input form-input-with-icon" required placeholder="Nhập mật khẩu cho user...">
                </div>
                <span class="helper-text">Lưu ý: User sẽ bị buộc phải đổi mật khẩu này ở lần đăng nhập đầu tiên.</span>
                @error('password')<span class="error-text">{{ $message }}</span>@enderror
            </div>

            <div class="form-group mb-0">
                <label class="form-label" for="role">Quyền hạn <span class="text-red-500">*</span></label>
                <select name="role" id="role" class="form-input" required>
                    <option value="{{ \App\Models\User::ROLE_MEMBER }}" {{ old('role') == \App\Models\User::ROLE_MEMBER ? 'selected' : '' }}>Nhân viên (Member)</option>
                    <option value="{{ \App\Models\User::ROLE_ADMIN }}" {{ old('role') == \App\Models\User::ROLE_ADMIN ? 'selected' : '' }}>Quản trị viên (Admin)</option>
                </select>
                @error('role')<span class="error-text">{{ $message }}</span>@enderror
            </div>
        </div>

        <div class="form-footer">
            <a href="{{ route('admin.users.index') }}" class="btn-secondary">Hủy bỏ</a>
            <button type="submit" class="btn-primary">Tạo Nhân Viên</button>
        </div>
    </form>
</div>
@endsection