@extends('layouts.app')

@section('title', 'Edit Staff')

@section('content')

<div class="row">

    {{-- Page Heading --}}
    <div class="col-sm-12">
        <div class="card card-transparent card-block card-stretch card-height border-none mb-4">
            <div class="card-body p-0">
                <h3 class="mb-2">Edit Staff</h3>
            </div>
        </div>
    </div>


    {{-- Edit Staff Card --}}
    <div class="col-lg-12">
        <div class="card card-block card-stretch card-height">

            <div class="card-header d-flex justify-content-between">
                <div class="header-title">
                    <h4 class="card-title">Edit Staff Information</h4>
                </div>
            </div>


            <div class="card-body">

                <form
                    action="{{ route('staff.update', $staff->user_id) }}"
                    method="POST"
                >

                    @csrf
                    @method('PUT')


                    {{-- Personal Information --}}
                    <h5 class="mb-3">Personal Information</h5>

                    <div class="row">

                        {{-- Full Name --}}
                        <div class="col-md-6 form-group">

                            <label for="staffName">
                                Full Name <span class="text-danger">*</span>
                            </label>

                            <input
                                type="text"
                                name="user_name"
                                id="staffName"
                                class="form-control"
                                placeholder="Enter Full Name"
                                value="{{ old('user_name', $staff->user_name) }}"
                                required
                            >

                            @error('user_name')
                                <small class="text-danger">
                                    {{ $message }}
                                </small>
                            @enderror

                        </div>


                        {{-- Email --}}
                        <div class="col-md-6 form-group">

                            <label for="staffEmail">
                                Email Address <span class="text-danger">*</span>
                            </label>

                            <input
                                type="email"
                                name="user_email"
                                id="staffEmail"
                                class="form-control"
                                placeholder="Enter Email"
                                value="{{ old('user_email', $staff->user_email) }}"
                                required
                            >

                            @error('user_email')
                                <small class="text-danger">
                                    {{ $message }}
                                </small>
                            @enderror

                        </div>

                    </div>


                    <hr class="my-4">


                    {{-- Account Information --}}
                    <h5 class="mb-3">Account Information</h5>

                    <div class="row">

                        {{-- New Password --}}
                        <div class="col-md-6 form-group">

                            <label for="staffPassword">
                                New Password
                            </label>

                            <input
                                type="password"
                                name="password"
                                id="staffPassword"
                                class="form-control"
                                placeholder="Leave blank to keep current password"
                            >

                            @error('password')
                                <small class="text-danger">
                                    {{ $message }}
                                </small>
                            @enderror

                        </div>


                        {{-- Confirm Password --}}
                        <div class="col-md-6 form-group">

                            <label for="staffConfirmPassword">
                                Confirm New Password
                            </label>

                            <input
                                type="password"
                                name="password_confirmation"
                                id="staffConfirmPassword"
                                class="form-control"
                                placeholder="Confirm new password"
                            >

                        </div>

                    </div>


                    <hr class="my-4">


                    {{-- Role --}}
                    <h5 class="mb-3">Role</h5>

                    <div class="form-group">

                        @foreach($roles as $role)

                            <div class="custom-control custom-radio custom-control-inline">

                                <input
                                    type="radio"
                                    id="role{{ $role->role_id }}"
                                    name="role_id"
                                    value="{{ $role->role_id }}"
                                    class="custom-control-input"

                                    {{ old(
                                        'role_id',
                                        $staff->role_id
                                    ) == $role->role_id ? 'checked' : '' }}

                                    required
                                >

                                <label
                                    class="custom-control-label"
                                    for="role{{ $role->role_id }}"
                                >
                                    {{ $role->role_name }}
                                </label>

                            </div>

                        @endforeach


                        @error('role_id')
                            <br>
                            <small class="text-danger">
                                {{ $message }}
                            </small>
                        @enderror

                    </div>


                    <hr class="my-4">


                    {{-- Status --}}
                    <h5 class="mb-3">Status</h5>

                    <div class="form-group">

                        {{-- Active --}}
                        <div class="custom-control custom-radio custom-control-inline">

                            <input
                                type="radio"
                                id="statusActive"
                                name="is_active"
                                value="1"
                                class="custom-control-input"

                                {{ old(
                                    'is_active',
                                    $staff->is_active
                                ) == '1' ? 'checked' : '' }}
                            >

                            <label
                                class="custom-control-label"
                                for="statusActive"
                            >
                                Active
                            </label>

                        </div>


                        {{-- Inactive --}}
                        <div class="custom-control custom-radio custom-control-inline">

                            <input
                                type="radio"
                                id="statusInactive"
                                name="is_active"
                                value="0"
                                class="custom-control-input"

                                {{ old(
                                    'is_active',
                                    $staff->is_active
                                ) == '0' ? 'checked' : '' }}
                            >

                            <label
                                class="custom-control-label"
                                for="statusInactive"
                            >
                                Inactive
                            </label>

                        </div>

                    </div>


                    {{-- Buttons --}}
                    <div class="d-flex flex-wrap mt-4">

                        <button
                            type="submit"
                            class="btn btn-primary mr-2"
                        >
                            <i class="ri-save-line mr-1"></i>
                            Update Staff
                        </button>


                        <a
                            href="{{ route('staff.list') }}"
                            class="btn btn-outline-secondary mr-2"
                        >
                            <i class="ri-arrow-left-line mr-1"></i>
                            Back
                        </a>


                        <button
                            type="reset"
                            class="btn btn-outline-danger"
                        >
                            <i class="ri-refresh-line mr-1"></i>
                            Reset
                        </button>

                    </div>

                </form>

            </div>

        </div>
    </div>

</div>

@endsection