{{-- Extends layout --}}
@extends('layout.default')

{{-- Content --}}
@section('content')

<div class="card card-custom example example-compact">
    <div class="card-header">
        <h3 class="card-title">
            Employee
            @if(isset($employee['EmployeeID']))
            Edit
            @else
            Add
            @endif
        </h3>
    </div>
    <!--begin::Form-->
    <form class="form" action="{{$action}}" method="POST">
        @csrf
        @isset($employee->EmployeeID)
        {{ method_field('PATCH')}}
        @endisset
        <div class="card-body">
            @if ($errors->any())
            <div class="alert alert-danger">
                <strong>Error!</strong>
                <ul>
                    @foreach ($errors->all() as $error)
                    <li></li>
                    @endforeach
                </ul>
            </div>
            @endif
            <div class="form-group row">
                <label class="col-lg-2 control-label">First Name:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                <input type="hidden" name="Id" value="{{$employee->EmployeeID}}" />
                    <input type="text" class="form-control" id="FirstName" name="FirstName" value="" maxlength="30" required />
                </div>
            </div>

            <div class="form-group row">
                <label class="col-lg-2 control-label">Last Name:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="LastName" name="LastName" value="" maxlength="30" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Gender:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <label>                        <input type="radio" name="Gender" id="Gender" value="m"  required />
                        Male
                    </label>
                    <label>
                        <input type="radio" name="Gender" id="Gender" value="f"  required />
                        Female
                    </label>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">DOB:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <div class="input-group">
                        <span class="input-group-prepend"><i class="icon-calendar5"></i></span>
                        <input type="date" class="form-control" id="dob" name="dob" value="" required>
                    </div>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Email:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="email" class="form-control" id="Email" name="Email" value=""required />
                </div>
                <div id="status" style="left:0px;  padding-top: 10px;" class="col-md-2"></div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Phone:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="Phone" name="Phone" onkeypress='return event.charCode >= 48 && event.charCode <= 57' maxlength="12" value="" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Designation:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <select name="designation"  class="form-control" required>
                        <option value="instructor" >Instructor</option>
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Experience:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <select name="Experience"  class="form-control" required>   
                    <option value="Art" >Art</option>
                        <option value="Communication" >Communication</option>
                        <option value="Coding" >Coding</option>
                        <option value="Digital Media" >Digital Media</option>
                        <option value="Games" >Games</option>
                        <option value="Language" >Language</option>
                        <option value="Maths" >Maths</option>
                        <option value="Software" >Software</option>
                        <option value="Writing" >Writing</option>
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Address1:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="Address1" name="Address1" value="" maxlength="100" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Address2:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="Address2" name="Address2" maxlength="50" value="" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">City:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="City" name="City" value="" maxlength="20" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">State:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="State" name="State" value="" maxlength="20" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Country:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="Country" name="Country" value="" maxlength="20" required />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">ZipCode:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="ZipCode" name="ZipCode" onkeypress='return event.charCode >= 48 && event.charCode <= 57' value="" maxlength="6" />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Emergency Contact Name:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="nomineename" name="nomineename" value="" maxlength="30" />
                </div>
            </div>
            <!-- <div class="form-group row">
                <label class="col-lg-2 control-label">Nominee Age:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="nomineeage" name="nomineeage" value="" maxlength="2" />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Relationship:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="relationship" name="relationship" value="" maxlength="15" />
                </div>
            </div> -->
            <div class="form-group row">
                <label class="col-lg-2 control-label">Phone:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="text" class="form-control" id="NomPhone" name="NomPhone" value="" onkeypress='return event.charCode >= 48 && event.charCode <= 57' maxlength="12" value="" required />
                </div>
            </div>
            <!-- <div class="form-group row">
                <label class="col-lg-2 control-label">Pan Card:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="file" class="form-control pull-left" name="pancard" style="width:200px" value="" />
                </div>
            </div>
            <div class="form-group row">
                <label class="col-lg-2 control-label">Id Proof:</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <input type="file" class="form-control pull-left" name="idproof" style="width:200px" value="" />
                </div>
            </div> -->
            <div class="form-group row">
                <label class="col-lg-2 control-label">&nbsp;</label>
                <div class="col-lg-6 col-md-9 col-sm-12">
                    <label class="checkbox-inline"><input type="checkbox" name="IsActive" value="1" >IsActive</label>
                </div>
            </div>
        </div>
        <div class="card-footer">
            <div class="row">
                <div class="col-lg-6 col-md-9 col-sm-12 ml-lg-auto">
                    <button type="submit" class="btn btn-success mr-2">Submit</button>
                    <a href="/employees" class="btn btn-secondary">Back</a>
                </div>
            </div>
        </div>
    </form>
    <!--end::Form-->
</div>
@section('scripts')
<script>
    $(document).ready(function() {
        $('.select2').select2();
    });
</script>
@endsection
@endsection
{{-- Styles Section --}}
@section('styles')
<link href="{{ asset('plugins/custom/employeetables/employeetables.bundle.css') }}" rel="stylesheet" type="text/css" />
@endsection
{{-- Scripts Section --}}
@section('scripts')
{{-- vendors --}}
<script src="{{ asset('plugins/custom/employeetables/employeetables.bundle.js') }}" type="text/javascript"></script>

{{-- page scripts --}}
<script src="{{ asset('js/pages/crud/employeetables/extensions/buttons.js') }}" type="text/javascript"></script>

<script src="{{ asset('js/app.js') }}" type="text/javascript"></script>
@endsection