cms-laravel/resources/views/livewire/user-management/edit.blade.php

<div class="container">
    <div class="card border" style="border-color: #E6ECF5;">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h2 class="mb-0">Update User</h2>
            <div>
                <button wire:click="update" class="btn btn-primary me-2" wire:loading.attr="disabled" wire:target="update">Submit</button>
                <a href="{{ route('user-management') }}" class="btn btn-secondary">Cancel</a>
            </div>
        </div>
        <div class="card-body">
            @if(!$mounted)
                <div class="text-center">
                    <div class="spinner-border text-primary" role="status">
                        <span class="visually-hidden">Loading...</span>
                    </div>
                </div>
            @else
                @if(session('success'))
                    <div class="alert alert-success mb-3" role="alert">
                        {{ session('success') }}
                    </div>
                @endif
                @if(session('error'))
                    <div class="alert alert-danger mb-3" role="alert">
                        {{ session('error') }}
                    </div>
                @endif

                <form wire:submit.prevent="update">
                    <div class="row mb-3">
                        <label for="username" class="col-sm-2 col-form-label">Username</label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control @error('username') is-invalid @enderror" wire:model="username" id="username" placeholder="User name">
                            @error('username') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    <div class="row mb-3">
                        <label for="firstname" class="col-sm-2 col-form-label">First Name</label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control @error('firstname') is-invalid @enderror" wire:model="firstname" id="firstname" placeholder="First Name">
                            @error('firstname') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    <div class="row mb-3">
                        <label for="lastname" class="col-sm-2 col-form-label">Last Name</label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control @error('lastname') is-invalid @enderror" wire:model="lastname" id="lastname" placeholder="Last Name">
                            @error('lastname') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    <div class="row mb-3">
                        <label for="email" class="col-sm-2 col-form-label">Email Address</label>
                        <div class="col-sm-6">
                            <input type="email" class="form-control @error('email') is-invalid @enderror" wire:model="email" id="email" placeholder="Email Address">
                            @error('email') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    @if($userInfo['editable'] ?? false)
                        <div class="row mb-3">
                            <label class="col-sm-2 col-form-label">Status</label>
                            <div class="col-sm-6">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" wire:model="status" id="status_active" value="active">
                                    <label class="form-check-label" for="status_active">Active</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" wire:model="status" id="status_inactive" value="inactive">
                                    <label class="form-check-label" for="status_inactive">Inactive</label>
                                </div>
                                @error('status') <div class="text-danger">{{ $message }}</div> @enderror
                            </div>
                        </div>

                        <div class="row mb-3">
                            <label class="col-sm-2 col-form-label">User Role</label>
                            <div class="col-sm-6">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" wire:model="role" id="role_admin" value="1">
                                    <label class="form-check-label" for="role_admin">System Admin</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" wire:model="role" id="role_marketing" value="2">
                                    <label class="form-check-label" for="role_marketing">Marketing Personnel</label>
                                </div>
                                @error('role') <div class="text-danger">{{ $message }}</div> @enderror
                            </div>
                        </div>
                    @endif

                    <div class="row mb-3">
                        <label for="password" class="col-sm-2 col-form-label">Default Password</label>
                        <div class="col-sm-6">
                            <div class="input-group">
                                <input type="text" class="form-control @error('password') is-invalid @enderror" wire:model="password" id="password" readonly>
                                <button type="button" class="btn btn-outline-secondary" wire:click="generatePassword" wire:loading.attr="disabled" wire:target="generatePassword" {{ ($userInfo['disable_generate'] ?? false) || $isGenerated ? 'disabled' : '' }}>
                                    <span wire:loading wire:target="generatePassword">Generating...</span>
                                    <span wire:loading.remove wire:target="generatePassword">Generate</span>
                                </button>
                                @if($password && $password !== '*******************')
                                    <button type="button" class="btn btn-outline-secondary" wire:click="copyPassword">Copy</button>
                                @endif
                            </div>
                            @error('password') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>
                </form>
            @endif
        </div>
    </div>
</div>

<script>
    document.addEventListener('copy-password', function (event) {
        navigator.clipboard.writeText(event.detail.password).then(() => {
            Swal.fire({
                icon: 'success',
                title: 'Success',
                text: 'Password successfully copied.',
            });
        });
    });
</script>

@if(session('success'))
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        Swal.fire({
            icon: 'success',
            title: 'Success',
            text: '{{ session('success') }}',
        });
    </script>
@endif

@if(session('error'))
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        Swal.fire({
            icon: 'error',
            title: 'Error',
            text: '{{ session('error') }}',
        });
    </script>
@endif