@extends('layouts.adminapp')

@section('content')
@section('head',__('lng.Employee'))
{{-- Create New Employee --}}
<div class="container-fluid">       
    <main >
<x-app-flash/>

<form method="POST" action="{{route('Employee.store')}}" enctype='multipart/form-data'>
    @csrf
    <div class="card">
        <div class="card-body">        
            <div class="d-flex align-items-center">
                <div class="p-2  flex-fill ">
                    <h4>{{__('lng.CreateEmployee')}}</h4>
                </div>            
            </div>  
            <hr>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-sm-4 form-group">
                    <label for="txtName">{{__('lng.Name')}}*</label>
                    <input type="text" value="{{ old('name') }}" class="form-control @error('name') is-invalid @enderror" name="name" id="txtName" required/>
                    @error('name')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <div class="col-sm-4 form-group">
                    <label for="cbDesignation">{{__('lng.Designation')}}*</label>
                    <div class="input-group">
                        <select class="form-control @error('designation_id') is-invalid @enderror"  id="cbDesignation" name="designation_id">
                            @php
                            echo (new App\Http\Controllers\DesignationController())->DesignationListForCombo(0);
                            @endphp
                        </select>
                        <div class="input-group-append">
                            <button class="btn btn-outline-secondary" type="button"  data-toggle="modal" data-target="#ajaxFormDesignation"><i class="fa fa-plus" aria-hidden="true"></i></button>
                        </div>
                        @error('designation_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div> 
                </div>
                <div class="col-sm-4 form-group">
                    <label for="cbSalaryPackage">{{__('lng.SalaryPackage')}}*</label>
                    <div class="input-group">
                        <select class="form-control @error('salarypackage_id') is-invalid @enderror"  id="cbSalaryPackage" name="salarypackage_id">
                            @php
                            echo (new App\Http\Controllers\SalaryPackageController())->SalaryPackageListForCombo(0);
                            @endphp
                        </select>
                        <div class="input-group-append">
                            <button class="btn btn-outline-secondary" type="button"  data-toggle="modal" data-target="#ajaxFormSalaryPackage"><i class="fa fa-plus" aria-hidden="true"></i></button>
                        </div>
                        @error('salarypackage_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div> 
                </div>
                <div class="col-sm-3 form-group">
                    <label for="DOB">{{__('lng.DateOfBirth')}}</label>
                    <input type="date" value="{{ old('dob') }}" class="form-control" name="dob" id="DOB"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtHouse">{{__('lng.House')}}</label>
                    <input type="text" value="{{ old('house') }}" class="form-control" name="house" id="txtHouse"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtPlace">{{__('lng.Place')}}</label>
                    <input type="text" value="{{ old('place') }}" class="form-control" name="place" id="txtPlace"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtPost">{{__('lng.Post')}}</label>
                    <input type="text" value="{{ old('post') }}" class="form-control" name="post" id="txtPost"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="numPin">{{__('lng.Pin')}}</label>
                    <input type="number" value="{{ old('pin') }}" class="form-control" name="pin" id="numPin"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtCity">{{__('lng.City')}}</label>
                    <input type="text" value="{{ old('city') }}" class="form-control" name="city" id="txtCity"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtDistrict">{{__('lng.District')}}</label>
                    <input type="text" value="{{ old('district') }}" class="form-control" name="district" id="txtDistrict"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtState">{{__('lng.State')}}</label>
                    <input type="text" value="{{ old('state') }}" class="form-control" name="state" id="txtState"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="numPhone">{{__('lng.Phone')}}</label>
                    <input type="number" value="{{ old('phone') }}" class="form-control" name="phone" id="numPhone"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="numMobile">{{__('lng.Mobile')}}*</label>
                    <input type="number" value="{{ old('mobile') }}" class="form-control @error('mobile') is-invalid @enderror" name="mobile" id="numMobile" required/>
                    @error('mobile')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtEmail">{{__('lng.Email')}}*</label>
                    <input type="email" value="{{ old('email') }}" class="form-control" name="email" id="txtEmail"  required>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtEmail">{{__('lng.Password')}}*</label>
                    <input type="password"  class="form-control" name="password" id="txtPassword" required/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="cbGender">{{__('lng.Gender')}}</label>
                    <select class="form-control" id="cbGender" name="gender">
                        <option selected value=""  disabled>{{__('lng.Select')}}</option>
                        <option @if (old('gender') == 'Male') selected="selected" @endif value="Male">{{__('lng.Male')}}</option>
                        <option @if (old('gender') == 'Female') selected="selected" @endif value="Female">{{__('lng.Female')}}</option>
                        <option @if (old('gender') == 'Other') selected="selected" @endif value="Other">{{__('lng.Other')}}</option>
                    </select>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="DOJ">{{__('lng.DateOfJoining')}}</label>
                    <input type="date" value="{{ old('joining_date') }}" class="form-control" name="joining_date" id="DOJ"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtEducation">{{__('lng.Education')}}</label>
                    <input type="text" value="{{ old('qualification') }}" class="form-control" name="qualification" id="txtEducation"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="txtMaritalStatus">{{__('lng.MaritalStatus')}}</label>
                    <select class="form-control" id="cbMaritalStatus" name="marital_status">
                        <option value="" selected disabled>{{__('lng.Select')}}</option>
                        <option @if (old('marital_status') == 'Single') selected="selected" @endif value="Single">{{__('lng.Single')}}</option>
                        <option @if (old('marital_status') == 'Married') selected="selected" @endif value="Married">{{__('lng.Married')}}</option>
                    </select>
                </div>
                <div class="col-sm-2 border justify-content" style="text-align: center;">
                    <img src="{{asset('assets/images/imgicon.png')}}" alt="defualt"  width="100px" id="imgImage"/>
                </div>
                <div class="col-sm-4 form-group ">
                    <label for="filePhoto">{{__('lng.Photo')}}</label>
                    <input type="file" class="form-control-file @error('photo1') is-invalid @enderror" name="photo1" id="filePhoto" onchange="
                    var input=this;
		                if (input.files && input.files[0]) {
                        var reader = new FileReader();
                        var size=(Math.round(input.files[0].size/1024));
                        if(size>1024)
                            {
                            alert('Please Upload file lesthan 1MB\nControl load time');
                            input.value='';
                            }
                        else{
                            reader.onload = function (e) {
                            $('#imgImage').attr('src', e.target.result); 
                            }
                            reader.readAsDataURL(input.files[0]);
                            }
				    }">
                    @error('photo1')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <div class="col-sm-3 form-group">
                    <label for="cbSalaryType">{{__('lng.SalaryType')}}</label>
                    <select class="form-control" id="cbSalaryType" name="salary_type">
                        <option value="" selected disabled>{{__('lng.Select')}}</option>
                        <option @if (old('salary_type') == 'Hourly') selected="selected" @endif value="Hourly">{{__('lng.Hourly')}}</option>
                        <option @if (old('salary_type') == 'Monthly') selected="selected" @endif value="Monthly">{{__('lng.Monthly')}}</option>
                        <option @if (old('salary_type') == 'Yearly') selected="selected" @endif value="Yearly">{{__('lng.Yearly')}}</option>
                    </select>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="numAmount">{{__('lng.Amount')}}</label>
                    <input type="number" value="{{ old('amount') }}" class="form-control" name="amount" id="numAmount"/>
                </div>
                <div class="col-sm-4 form-group mt-3">
                    <label for="cbJob">{{__('lng.BloodGroup')}} </label>
                    <select class="form-control" name="blood_group" id="cbJob" >
                        <option selected value=""  disabled>{{__('lng.Select')}}</option>
                        @foreach(App\Extra\General\PublicConstants::BLOOD_GROUPS as $BloodGroup)
                            <option @if (old('blood_group') == $BloodGroup ) selected="selected" @endif value="{{$BloodGroup}}">{{$BloodGroup}}</option>
                        @endforeach
                    </select>   
                </div>
                <div class="col-sm-4 form-group mt-3">
                    <label for="txtBankName">{{__('lng.BankName')}}</label>
                    <input type="text" value="{{ old('bank_name') }}" class="form-control" name="bank_name" id="txtBankName"/>
                </div>
                <div class="col-sm-4 form-group mt-3">
                    <label for="numBankAccountNumber">{{__('lng.BankAccountNumber')}}</label>
                    <input type="number" value="{{ old('bank_account_number') }}" class="form-control" name="bank_account_number" id="numBankAccountNumber"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="txtBranchName">{{__('lng.BranchName')}}</label>
                    <input type="text" value="{{ old('branch_name') }}" class="form-control" name="branch_name" id="txtBranchName"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="txtBranchCode">{{__('lng.BranchCode')}}</label>
                    <input type="text" value="{{ old('branch_code') }}" class="form-control" name="branch_code" id="txtBranchCode"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="txtPassport">{{__('lng.Passport')}}</label>
                    <input type="text" value="{{ old('passport_no') }}" class="form-control" name="passport_no" id="txtPassport"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="txtLaborCardNumber">{{__('lng.LaborCardNumber')}}</label>
                    <input type="text" value="{{ old('labour_card_number') }}" class="form-control" name="labour_card_number" id="txtLaborCardNumber"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="txtVisa">{{__('lng.Visa')}}</label>
                    <input type="text" value="{{ old('visa_number') }}" class="form-control" name="visa_number" id="txtVisa"/>
                </div>
                <div class="col-sm-4 form-group">
                    <label for="DtPassportExpireDate">{{__('lng.PassportExpireDate')}}</label>
                    <input type="date" value="{{ old('passport_expiry_date') }}" class="form-control" name="passport_expiry_date" id="DtPassportExpireDate"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="dtLaborCardExpireDate">{{__('lng.LaborCardExpireDate')}}</label>
                    <input type="date" value="{{ old('labour_card_expiry_date') }}" class="form-control" name="labour_card_expiry_date" id="dtLaborCardExpireDate"/>
                </div>
                <div class="col-sm-3 form-group">
                    <label for="dtVisaExpireDate">{{__('lng.VisaExpireDate')}}</label>
                    <input type="date" value="{{ old('visa_expiry_date') }}" class="form-control" name="visa_expiry_date" id="dtVisaExpireDate"/>
                </div>
                <div class="col-sm-6 form-group">
                    <label for="txtName">{{__('lng.Narration')}}</label>
                    <input type="text" value="{{ old('narration') }}" class="form-control" name="narration" id="txtNarration"/>
                </div>
            </div>
        </div>
        
        <div class="card-body">
            <hr>
            <div class="d-flex  justify-content-start p-2  editsubmitbutton buttonback" >
                <a class="btn btn-primary btn-icon-split" href="{{route('Employee.index')}}">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-arrow-left"></i>
                    </span>
                    <span class="text">{{__('lng.Back')}}</span>
                </a>
            </div>
            <div class="d-flex  justify-content-end p-2">
                <button type="reset" class="btn btn-secondary btn-icon-split mr-2" name="btnSave">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-delete"></i>
                    </span>
                    <span class="text">{{__('lng.Clear')}}</span>
                </button>
                <button type="submit" class="btn btn-success btn-icon-split">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-check"></i>
                    </span>
                    <span class="text">{{__('lng.Save')}}</span>
                </button>
            </div>
        </div>
    </div>
</form>


{{-- Start Ajax Modal Designation--}}
<div class="modal fade" id="ajaxFormDesignation" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-md">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{__('lng.CreateDesignation')}}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" id="AjaxFormBodyDesignation">                
                <input name="AjaxForm" type="hidden" value="1">
                @include('Designation.createajax')
            </div>
            <div class="modal-footer">
                <button type="reset" class="btn btn-secondary btn-icon-split mr-2" name="btnSave">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-delete"></i>
                    </span>
                    <span class="text">{{__('lng.Clear')}}</span>
                </button>
                <button type="button" class="btn btn-success btn-icon-split" onclick="btnModalSaveDesignation()">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-check"></i>
                    </span>
                    <span class="text">{{__('lng.Save')}}</span>
                </button>
            </div>
        </div>
    </div>
</div>
{{-- End Ajax Modal Designation--}}

{{-- Start Ajax Modal Salary Package--}}
<div class="modal fade" id="ajaxFormSalaryPackage" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-md">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{__('lng.CreateSalaryPackage')}}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" id="AjaxFormBodySalaryPackage">                
                <input name="AjaxForm" type="hidden" value="1">
                @include('SalaryPackage.createajax')
            </div>
            <div class="modal-body">
                <button type="reset" class="btn btn-secondary btn-icon-split mr-2" name="btnSave">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-delete"></i>
                    </span>
                    <span class="text">{{__('lng.Clear')}}</span>
                </button>
                <button type="button" class="btn btn-success btn-icon-split" onclick="btnModalSaveSalaryPackage()">
                    <span class="icon text-white-50">
                        <i class="mdi mdi-check"></i>
                    </span>
                    <span class="text">{{__('lng.Save')}}</span>
                </button>
            </div>
        </div>
    </div>
</div>
{{-- End Ajax Modal Salary Package--}}

<script>
    

    function Load_DesignationListCombo(Designation_id)
    {
        $.get(
            '{{url('DesignationCombo')}}/'+Designation_id,
            function (response) {
                document.getElementById('cbDesignation').innerHTML=response;
            }
        );
    }


    function btnModalSaveDesignation()
    {
        var AjaxFormDesignation=document.getElementById('AjaxFormDesignation');        
        $.post('{{route('Designation.store')}}',
            $('#AjaxFormBodyDesignation :input').serialize(),
            function (response) {    
                response=response.trim();
                Load_DesignationListCombo(response);
                $('#ajaxFormDesignation').modal('hide')
            }
        );
    }
    

    function Load_SalaryPackageListCombo(SalaryPackage_id)
    {
        $.get(
            '{{url('SalaryPackageCombo')}}/'+SalaryPackage_id,
            function (response) {
                document.getElementById('cbSalaryPackage').innerHTML=response;
            }
        );
    }


    function btnModalSaveSalaryPackage()
    {
        var AjaxFormSalaryPackage=document.getElementById('AjaxFormSalaryPackage');        
        $.post('{{route('SalaryPackage.store')}}',
            $('#AjaxFormBodySalaryPackage :input').serialize(),
            function (response) {    
                response=response.trim();
                Load_SalaryPackageListCombo(response);
                $('#ajaxFormSalaryPackage').modal('hide')
            }
        );
    }
</script>

</main>
               
</div>
@endsection