@extends('admin.layouts.app')

@section('content')

<style>

  .d-flex {
        display: flex;
        align-items: center;
    }

    .form-group {
        margin-right: 20px;
    }

    .education-row button {
        margin-left: 10px;
        height: 38px;
        align-self: flex-end;
    }
    
input#password {
    width: 90%;
}
.password_icon {
    float: right;
    background-color: #a9b7c3;
    padding: 7px;
    padding-left: 39px;
    padding-right: 12px;
}
.ladder{
    display:flex;
}
i.mdi.mdi-key-variant {
    margin-right: 15px;
    margin-left: -15px;
    top: 22%;
    position: relative;
    font-size: 20px;
    cursor:pointer;
}
i#togglePassword{
    position: relative;
    top: 22%;
    font-size: 20px;
    margin-right: 20px;
    margin-left: 15px;
    cursor:pointer;
}
</style>

<div class="col-12 grid-margin stretch-card">
    <div class="card">
        <div class="card-body">
            <h4 class="card-title">Add HCP</h4>
            <p class="card-description">
            </p>
            <form id="add_hcp" class="forms-sample" method="post" action="{{ route('admin.hcpcreate') }}" enctype="multipart/form-data">
                @csrf
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="title">Title</label>
                            <input type="text" class="form-control @error('title') is-invalid @enderror" id="title" name="title" placeholder="Title">
                            @error('title')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="first_name">First Name</label>
                            <input type="text" class="form-control @error('first_name') is-invalid @enderror" id="first_name" name="first_name" placeholder="First Name">
                            @error('first_name')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="middle_name">Middle Name</label>
                            <input type="text" class="form-control @error('middle_name') is-invalid @enderror" id="middle_name" name="middle_name" placeholder="Middle Name">
                            @error('middle_name')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="last_name">last_name</label>
                            <input type="text" class="form-control @error('last_name') is-invalid @enderror" id="last_name" name="last_name" placeholder="Last Name">
                            @error('last_name')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="contact_phone_office">Contact Phone Office</label>
                            <input type="text" class="form-control @error('contact_phone_office') is-invalid @enderror" id="contact_phone_office" name="contact_phone_office" placeholder="Contact Phone Office">
                            @error('contact_phone_office')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="contact_phone_personal">Contact Phone Personal</label>
                            <input type="text" class="form-control @error('contact_phone_personal') is-invalid @enderror" id="contact_phone_personal" name="contact_phone_personal" placeholder="Contact Phone Personal">
                            @error('contact_phone_personal')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        
                                <div id="education-container">
        <div class="education-row d-flex">
            <div class="form-group">
                <label>Degree</label>
                <input type="text" name="degree[]" class="form-control" />
            </div>
            <div class="form-group">
                <label>Specialization</label>
                <input type="text" name="specialization[]" class="form-control" />
            </div>
            <div class="form-group">
                <label>Awarded Year</label>
                <input type="text" name="awarded_year[]" class="form-control" />
            </div>
            
              <div class="form-group">
                <label>Document Image</label>
                <input type="file" name="document_image[]" class="form-control" />
            </div>
            <button type="button" class="btn btn-success" onclick="addEducation()">Add More</button>
        </div>
    </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="email">Email</label>
                            <input type="email" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="Email">
                            @error('email')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        
                          <div class="form-group">
                            <label for="Password">Password</label>
                            <div class="ladder">
                               <input type="password" class="form-control @error('password') is-invalid @enderror" id="password" name="password" placeholder="Password">
                               @error('password')
                               <span class="text-danger">{{ $message }}</span>
                               @enderror
                               <div class="password_icon">
                               <i class="mdi mdi-key-variant" title="Generate Password" onclick="generatePassword()"></i>
                               <i class="mdi mdi-eye" title="Show Password" id="togglePassword" onclick="togglePassword()"></i> <!-- Show password icon -->
                               </div>
                           </div>

                        </div>
                        
                        <div class="form-group">
                            <label for="address">Address</label>
                            <textarea id="address" name="address" class="form-control @error('address') is-invalid @enderror" placeholder="Address"></textarea>
                            @error('address')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                      
                        <div class="form-group">
                            <label for="school_graduated">School Graduated</label>
                            <input type="text" class="form-control @error('school_graduated') is-invalid @enderror" id="school_graduated" name="school_graduated" placeholder="School Graduated">
                            @error('school_graduated')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="overall_rating">Overall Rating</label>
                            <input type="number" class="form-control @error('overall_rating') is-invalid @enderror" id="overall_rating" name="overall_rating" placeholder="Overall Rating">
                            @error('overall_rating')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        
                            <div class="form-group">
                            <label for="image">Image</label>
                            <input type="file" class="form-control @error('image') is-invalid @enderror" id="image" name="image">
                            @error('image')
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        
                                <div id="licenses-container">
        <div class="licenses-row d-flex">
            <div class="form-group">
                <label>License Number</label>
                <input type="text" name="license_number[]" class="form-control" />
            </div>
            <div class="form-group">
                <label>Issuing Authority</label>
                <input type="text" name="issuing_authority[]" class="form-control" />
            </div>
             <div class="form-group">
                <label>Issue Date</label>
                <input type="date" name="issue_date[]" class="form-control" />
            </div>
            <div class="form-group">
                <label>Expiry Date</label>
                <input type="date" name="expiry_date[]" class="form-control" />
            </div>
              <div class="form-group">
                <label>Document Image</label>
                <input type="file" name="lic_document_image[]" class="form-control" />
            </div>
            <button type="button" class="btn btn-success" onclick="addLicenses()">Add More</button>
        </div>
    </div>
                    </div>
                    
  
                </div>
                <button type="submit" class="btn btn-primary me-2">Submit</button>
                <a href="{{ route('admin.hcp') }}" class="btn btn-light">Cancel</a>
            </form>
        </div>
    </div>
</div>

@endsection;