@extends('layouts.app',['path'=>'employee'])
@section('content')
    <div class="content">
        <!-- Breadcrumb -->
        <div class="d-md-flex d-block align-items-center justify-content-between page-breadcrumb mb-3">
            <div class="my-auto mb-2">
                <h2 class="mb-1">Employee</h2>
                <nav>
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item">
                            <a href="{{ route('dashboard') }}"><i class="ti ti-smart-home"></i></a>
                        </li>
                        <li class="breadcrumb-item">
                            Employee
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">Employee List</li>
                    </ol>
                </nav>
            </div>
        </div>
        <!-- /Breadcrumb -->

        @include('partials.new_alerts')

        <!-- Performance Indicator list -->
        <div class="card">
            <div class="card-header d-flex align-items-center justify-content-between flex-wrap row-gap-3">
                <h5>Edit Employee</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('employee.update', $employee['id']) }}" method="POST" id="create-employee-form" enctype="multipart/form-data">
                    @csrf
                    <div class="contact-grids-tab pt-0">
                        <ul class="nav nav-underline" id="myTab2" role="tablist">
                            <li class="nav-item" role="presentation">
                                <button class="nav-link active" id="info-tab3" data-bs-toggle="tab" data-bs-target="#basic-info3" type="button" role="tab" aria-selected="true">Basic Information</button>
                            </li>
                        </ul>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="d-flex align-items-center flex-wrap row-gap-3 bg-light w-100 rounded p-3 mb-4">                                                
                                <div class="d-flex align-items-center justify-content-center avatar avatar-xxl rounded-circle border border-dashed me-2 flex-shrink-0 text-dark frames" id="previewDiv">
                                    @if($employee['profile_image'])
                                        <img src="data:image/png;base64,{{ $employee['profile_image'] }}" alt="img" class="rounded-circle object-fit-cover">
                                    @else
                                        <i class="ti ti-photo text-gray-2 fs-16"></i>
                                    @endif
                                </div>
                                <input type="hidden" name="profile_image_old" id="profileImageOld" value="{{ old('profile_image', $employee['profile_image']) }}">
                                <div class="profile-upload">
                                    <div class="mb-2">
                                        <h6 class="mb-1">Upload Profile Image</h6>
                                        <p class="fs-12">The image size must be less than 2 MB.</p>
                                    </div>
                                    <div class="profile-uploader d-flex align-items-center">
                                        <div class="drag-upload-btn btn btn-sm btn-primary me-2">
                                            Upload
                                            <input type="file" class="form-control image-sign" id="imageInput" name="profile_image" accept="image/*">
                                        </div>
                                        <a href="javascript:void(0);" class="btn btn-light border btn-sm" id="removeImage">Cancel</a>
                                    </div>
                                    <span class="error-validation" id="profile_image-error"></span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Employee Name <span class="text-danger"> *</span></label>
                                <input type="text" class="form-control" name="name" value="{{ old('name', $employee['name']) }}">
                                <span class="error-validation" id="name-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Common Name</label>
                                <input type="text" class="form-control" name="common_name" value="{{ old('common_name', $employee['common_name']) }}">
                                <span class="error-validation" id="common_name-error"></span>
                            </div>									
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Employee No</label>
                                <input type="text" class="form-control" disabled value="{{ old('employee_no', $employee['employee_no']) }}">
                            </div>									
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Father Name <span class="text-danger"> *</span></label>
                                <input type="text" class="form-control" name="father_name" value="{{ old('father_name', $employee['father_name']) }}">
                                <span class="error-validation" id="father_name-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Date Of Birth <span class="text-danger"> *</span></label>
                                <input type="text" name="date_of_birth" class="form-control datepicker" autocomplete="off" placeholder="dd/mm/yyyy" value="{{ old('date_of_birth', formatFormDate($employee['date_of_birth'])) }}">
                                <span class="error-validation" id="date_of_birth-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Joining Date <span class="text-danger"> *</span></label>
                                <input type="text" name="date_of_joining" class="form-control datepicker" autocomplete="off" placeholder="dd/mm/yyyy" value="{{ old('date_of_joining', formatFormDate($employee['date_of_joining'])) }}">
                                <span class="error-validation" id="date_of_joining-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Gender <span class="text-danger"> *</span></label>
                                <select class="select" name="gender">
                                    <option value="">Select</option>
                                    <option value="male" {{ old('gender', $employee['gender']) == 'male' ? 'selected' : '' }}>Male</option>
                                    <option value="female" {{ old('gender', $employee['gender']) == 'female' ? 'selected' : '' }}>Female</option>
                                    <option value="other" {{ old('gender', $employee['gender']) == 'other' ? 'selected' : '' }}>Other</option>
                                    <option value="prefer not to say" {{ old('gender', $employee['gender']) == 'prefer not to say' ? 'selected' : '' }}>Prefer not to say</option>
                                </select>
                                <span class="error-validation" id="gender-error"></span>
                            </div>		
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Marital Status <span class="text-danger"> *</span></label>
                                <select class="select" name="marital_status">
                                    <option value="">Select</option>
                                    <option value="single" {{ old('marital_status', $employee['marital_status']) == 'single' ? 'selected' : '' }}>Single</option>
                                    <option value="married" {{ old('marital_status', $employee['marital_status']) == 'married' ? 'selected' : '' }}>Married</option>
                                    <option value="divorced" {{ old('marital_status', $employee['marital_status']) == 'divorced' ? 'selected' : '' }}>Divorced</option>
                                    <option value="widowed" {{ old('marital_status', $employee['marital_status']) == 'widowed' ? 'selected' : '' }}>Widowed</option>
                                    <option value="separated" {{ old('marital_status', $employee['marital_status']) == 'separated' ? 'selected' : '' }}>Separated</option>
                                </select>
                                <span class="error-validation" id="marital_status-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Blood Group</span></label>
                                <select class="select" name="blood_group">
                                    <option value="">Select</option>
                                    <option value="A+" {{ old('blood_group', $employee['blood_group']) == 'A+' ? 'selected' : '' }}>A+</option>
                                    <option value="A-" {{ old('blood_group', $employee['blood_group']) == 'A-' ? 'selected' : '' }}>A-</option>
                                    <option value="B+" {{ old('blood_group', $employee['blood_group']) == 'B+' ? 'selected' : '' }}>B+</option>
                                    <option value="B-" {{ old('blood_group', $employee['blood_group']) == 'B-' ? 'selected' : '' }}>B-</option>
                                    <option value="O+" {{ old('blood_group', $employee['blood_group']) == 'O+' ? 'selected' : '' }}>O+</option>
                                    <option value="O-" {{ old('blood_group', $employee['blood_group']) == 'O-' ? 'selected' : '' }}>O-</option>
                                    <option value="AB+" {{ old('blood_group', $employee['blood_group']) == 'AB+' ? 'selected' : '' }}>AB+</option>
                                    <option value="AB-" {{ old('blood_group', $employee['blood_group']) == 'AB-' ? 'selected' : '' }}>AB-</option>
                                </select>
                                <span class="error-validation" id="blood_group-error"></span>
                            </div>		
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Status</span></label>
                                <select class="select" name="{{ $employee['is_post']? 'status' : '' }}" {{ $employee['is_post']? '' : 'disabled' }}>
                                    <option value="">Select</option>
                                    <option value="1" {{ old('status', $employee['status']) == '1' ? 'selected' : '' }}>Active</option>
                                    <option value="0" {{ old('status', $employee['status']) == '0' ? 'selected' : '' }}>Inactive</option>
                                </select>
                                <span class="error-validation" id="status-error"></span>
                            </div>		
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Existing Medical Issues</label>
                                <input type="text" name="any_illness" class="form-control" placeholder="" value="{{ old('any_illness', $employee['any_illness']) }}">
                                <span class="error-validation" id="any_illness-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Language</label>
                                <input type="text" name="language" class="form-control" placeholder="" value="{{ old('language', $employee['language']) }}">
                                <span class="error-validation" id="language-error"></span>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="mb-3">
                                <label class="form-label">About</label>
                                <textarea class="form-control" rows="3" name="about">{{ old('about', $employee['about']) }}</textarea>
                                <span class="error-validation" id="about-error"></span>
                            </div>
                        </div>
                    </div>

                    <label class="form-label">Identity Information</label>
                    <div class="form-border mb-3"></div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Identity Number</label>
                                <input type="number" name="cnic_number" class="form-control" placeholder="" value="{{ old('cnic_number', $employee['cnic_number']) }}">
                                <span class="error-validation" id="cnic_number-error"></span>
                            </div>
                        </div>
                    </div>

                    <label class="form-label">Contact Information</label>
                    <div class="form-border mb-3"></div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Permanent Address <span class="text-danger">*</span></label>
                                <textarea class="form-control" rows="3" name="permanent_address">{{ old('permanent_address', $employee['permanent_address']) }}</textarea>
                                <span class="error-validation" id="permanent_address-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Present Address <span class="text-danger">*</span></label>
                                <textarea class="form-control" rows="3" name="present_address">{{ old('present_address', $employee['present_address']) }}</textarea>
                                <span class="error-validation" id="present_address-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Personal Email</label>
                                <input type="email" name="personal_email" class="form-control" placeholder="" value="{{ old('personal_email', $employee['personal_email']) }}">
                                <span class="error-validation" id="personal_email-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Official Email</label>
                                <input type="email" name="official_email" class="form-control" placeholder="" value="{{ old('official_email', $employee['official_email']) }}">
                                <span class="error-validation" id="official_email-error"></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Phone</label>
                                <input type="text" name="phone" class="form-control" placeholder="" value="{{ old('phone', $employee['phone']) }}">
                                <span class="error-validation" id="phone-error"></span>
                            </div>
                        </div>
                    </div>

                    <div class="text-end">
                        <a href="{{ route('employee') }}" class="btn btn-light border me-2">
                            <i class="ti ti-x me-2"></i>Cancel
                        </a>
                        <button type="submit" class="btn btn-primary">
                            <i class="ti ti-check me-2"></i>Save
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script src="{{ asset('assets/validation/create-employee.js?v='.config('api.version')) }}"></script>
@endpush