{% extends 'base.html.twig' %}
{% block body %}

 <div class="content-body">
            <div class="row page-titles mx-0">
                <div class="col p-md-0">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="/dashboard">Dashboard</a></li>
                        <li class="breadcrumb-item active"><a href="/profile">Profile</a></li>
                    </ol>
                </div>
            </div>
<div class="tooltip">Hover over me
  <span class="tooltiptext">Tooltip text</span>
</div>
            <!-- row -->
			<div class="container-fluid">
                <div class="row">
                    <div class="col-lg-4 col-xl-3">
                        <div class="card">
                            <div class="card-body">
                                <div class="media align-items-center mb-4">
                                    <img class="mr-3" src="/employees/{{FTCHEmp[0]['profile_photo']}}" width="80" height="80" alt="" style="border-radius:50px;">
                                    <div class="media-body">
                                        <h3 class="mb-0" style="width:150px;"><a data-toggle="tooltip" title="{{FTCHEmp[0]['emp_name']}}">
										{{ FTCHEmp[0]['emp_name'] | length > 20 ? FTCHEmp[0]['emp_name'] | slice(0, 20) ~ '...' : FTCHEmp[0]['emp_name']  }}</a>
										</h3>
                                        <p class="text-muted mb-0">{{dpt_name}}</p>
                                    </div>
                                </div>
                                <div class="row mb-5">
                                    <div class="col">
                                        <div class="card card-profile text-center">
                                            <span class="mb-2 text-primary"><i class="mdi  mdi-account"></i></span>
                                            <h3 class="mb-10" style="width:110px;">
											{{FTCHEmp1[0]['inc_date']| date("M,d Y")}}</h3>
                                            <p class="text-muted px-10">Joining Date</p>
                                        </div>
                                    </div>
                                    <div class="col">
                                        <div class="card card-profile text-center">
                                            <span class="mb-2 text-warning"><i class="mdi mdi-cash-usd"></i></span>
                                            <h3 class="mb-10">&#x20b9;{{FTCHEmp1[0]['inc_amount'] | number_format }}</h3>
                                            <p class="text-muted">Initial Salary</p>
                                        </div>
                                    </div>
                                    <div class="col-12 text-center">
                                        <button class="btn btn-danger px-5">EMP Code : {{FTCHEmp[0]['emp_code'] }}</button>
                                    </div>
                                </div>

                                <h4>Contact Me</h4>
                                <p class="text-muted">
								{{FTCHEmp[0]['door_no1'] }},
								{{FTCHEmp[0]['street1'] }}<br>
								{{FTCHEmp[0]['street2'] }}<br>
								{{FTCHEmp[0]['city_name'] }}<br>
								{{FTCHEmp[0]['state_name'] }}<br>
								{{FTCHEmp[0]['door_no1'] }}<br>
								</p>
                                <ul class="card-profile__info">
									<li class="mb-1"><strong class="text-dark mr-4"><i class="mdi mdi-phone blue" title="Mobile" style="font-size: 22px;"></i>&nbsp;&nbsp;{{FTCHEmp[0]['mobile_no1'] }}</strong></li>
									<li><strong class="text-dark mr-4"><i class="mdi mdi-email-outline blue" title="Email" style="font-size: 22px;"></i>&nbsp;&nbsp;{{FTCHEmp[0]['email1'] }}</strong></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-8 col-xl-9">
                        <div class="card">
                            <div class="card-body">
							 <h4 class="card-title"></h4>
                                <div class="form-validation">
                                    <form class="form-valide" action="/profile-update" method="post" enctype="multipart/form-data">
                                    <div class="card-body">
									<input type="hidden" name="eid" value="{{FTCHEmp[0]['emp_id'] }}">
									<input type="hidden" name="emp_code" value="{{FTCHEmp[0]['emp_code'] }}">

				<!-- ########[ FORM - start ]######## -->
				<div class="section-title mt-0">
				<h5>Employee Information</h5></div><br>
				<div class="form-group row mb-4">

					<div class="form-group col-sm-3 col-md-3">
						<label title="{{ FTCHEmp[0]['emp_name'] 
						}}">Employee Name&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br>
						<b style="color:green; font-size:10px;"> 
						{{ FTCHEmp[0]['emp_name'] | length > 30 ? FTCHEmp[0]['emp_name'] | slice(0, 30) ~ '...' : FTCHEmp[0]['emp_name']  }}
						</b></label>
						<input type="text" class="form-control" name="emp_name" id="emp_name" value="{{FTCHEmpr[0]['emp_name'] }}" 
						{% if(FTCHEmpr[0]['emp_name'] |trim == FTCHEmp[0]['emp_name'] |trim) %} {% else %}
						style="color:red;" {% endif %} placeholder="Type Emp Name">
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{ FTCHEmp[0]['father_name']}}">Emp Father Name&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['father_name'] | length > 25 ? FTCHEmp[0]['father_name'] | slice(0, 25) ~ '...' : FTCHEmp[0]['father_name']  }}</b></label>
						<input type="text" class="form-control" name="emp_father_name" id="emp_father_name" placeholder="Type Father Name" value="{{FTCHEmpr[0]['father_name']}}"  {% if(FTCHEmpr[0]['father_name'] |trim == FTCHEmp[0]['father_name'] |trim) %} {% else %}
						style="color:red;" {% endif %} required>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['aadhar_no']}}">AADHAR No.&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['aadhar_no'] | length > 30 ? FTCHEmp[0]['aadhar_no'] | slice(0, 30) ~ '...' : FTCHEmp[0]['aadhar_no']  }}</b></label>&nbsp;
						<input type="text" class="form-control" name="emp_aadhar_no" id="emp_aadhar_no" maxlength="12" placeholder="Type AADHAR No." value="{{FTCHEmpr[0]['aadhar_no']}}" {% if(FTCHEmpr[0]['aadhar_no'] |trim == FTCHEmp[0]['aadhar_no'] |trim) %} {% else %}
						style="color:red;" {% endif %} required>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['pan_no']}}">Pan No.<br>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['pan_no'] | length > 30 ? FTCHEmp[0]['pan_no'] | slice(0, 30) ~ '...' : FTCHEmp[0]['pan_no']  }}</b></label>&nbsp;</label>
						<input type="text" class="form-control" name="emp_pan_no" id="emp_pan_no" maxlength="10" placeholder="Type Pan No." value="{{FTCHEmpr[0]['pan_no']}}" {% if(FTCHEmpr[0]['pan_no'] |trim == FTCHEmp[0]['pan_no'] |trim) %} {% else %}
						style="color:red;" {% endif %} >
					</div>

					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['refer_name']}}">Refered Person<br>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['refer_name'] | length > 30 ? FTCHEmp[0]['refer_name'] | slice(0, 30) ~ '...' : FTCHEmp[0]['refer_name']  }}</b></label>&nbsp;
						</label>
						<input type="text" class="form-control" name="rfrnc_person" id="rfrnc_person" placeholder="Type Refered Person" value="{{FTCHEmpr[0]['refer_name']}}" 
						{% if(FTCHEmpr[0]['refer_name'] |trim == FTCHEmp[0]['refer_name'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>

					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['ref_mobile']}}">Refered Person Mbl No. <br><span id="rfrnc_mbl_errmsg" style="color:red;"></span>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['ref_mobile'] | length > 30 ? FTCHEmp[0]['ref_mobile'] | slice(0, 30) ~ '...' : FTCHEmp[0]['ref_mobile']  }}</b></label>
						<input type="text" class="form-control" name="rfrnc_mbl" id="rfrnc_mbl" maxlength="10" placeholder="Type Ref. Person Mbl No." value="{{FTCHEmpr[0]['ref_mobile']}}" 
						{% if(FTCHEmpr[0]['ref_mobile'] |trim == FTCHEmp[0]['ref_mobile'] |trim) %} {% else %}
						style="color:red;" {% endif %} >
					</div>
				</div>

				<div class="section-title mt-0"><h5>Employee Contact Details</h5></div><br>
				<div class="form-group row mb-4">
					<div class="form-group col-sm-3 col-md-3">
						<label title="Type here Employee Mobile No. (1)">Mobile No. <small>(1)</small>
						&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['mobile_no1']}}</b></label>
						<input type="text" class="form-control" name="emp_mbl1" id="emp_mbl1" maxlength="10" placeholder="Type Emp Mobile No. (1)" pattern="[0-9]{5}[-][0-9]{7}[-][0-9]{10}"   value="{{FTCHEmpr[0]['mobile_no1']}}" required onchange="validatePhoneNumber();"
						{% if(FTCHEmpr[0]['mobile_no1'] |trim == FTCHEmp[0]['mobile_no1'] |trim) %} {% else %}
						style="color:red;" {% endif %} >
					</div>

					<div class="form-group col-sm-3 col-md-3">
						<label title="Type here Employee Mobile No. (2)">Mobile No. <small>(2)</small><br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['mobile_no2']}}</b>&nbsp;</label>
						<input type="text" class="form-control" name="emp_mbl2" id="emp_mbl2" maxlength="10" placeholder="Type Emp Mobile No. (2)" value="{{FTCHEmpr[0]['mobile_no2']}}" 			
						{% if(FTCHEmpr[0]['mobile_no2'] |trim == FTCHEmp[0]['mobile_no2'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>

					<div class="form-group col-sm-3 col-md-3">
						<label title="Type here Employee E-mail ID (1)">E-mail ID <small>(1)</small><br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['email1']}}</b></label>
						<input type="email" class="form-control" name="emp_email1" id="emp_email1" placeholder="Type Emp E-mail (1)" value="{{FTCHEmpr[0]['email1']}}"
						{% if(FTCHEmpr[0]['email1'] |trim == FTCHEmp[0]['email1'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>

					<div class="form-group col-sm-3 col-md-3">
						<label title="Type here Employee E-mail ID (2)">E-mail ID <small>(2)</small><br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['email2']}}</b></label>
						<input type="email" class="form-control" name="emp_email2" id="emp_email2" placeholder="Type Emp E-mail (2)" value="{{FTCHEmpr[0]['email2']}}" 					{% if(FTCHEmpr[0]['email2'] |trim == FTCHEmp[0]['email2'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
				</div>

				<div class="section-title mt-0"><h5>Employee Document Details</h5></div><br>
				<div class="form-group row mb-4">
				<div class="form-group col-sm-3 col-md-3">
						<label title="upload here Profile photo. (1)">Profile photo. <small>(1)</small> <span id="emp_mbl1_errmsg" style="color:red;"></span></label><br>
<img src="/employees/{{FTCHEmp[0]['profile_photo']}}" style="border-radius:50px;" width="50" height="50">

						<div class="avatar-upload">
							<div class="avatar-edit">
							<input type='file' id="imageUpload_lrga" name="profile_photo" accept=".png, .jpg, .jpeg" />
								<label for="imageUpload_lrga"></label>
							</div>
							<div class="avatar-preview">
								<div id="imagePreview4" style="
								{% if(FTCHEmpr[0]['profile_photo'] !='') %} background-image: url(/employee-temp/{{FTCHEmpr[0]['profile_photo']}});
								border:2px solid red; {% endif %}"></div>
							</div>
						</div>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="upload here Voter ID. (1)">Voter ID. <small>(1)</small> <span id="emp_mbl1_errmsg" style="color:red;"></span></label><br>
						<img src="/employees/{{FTCHEmp[0]['voter_id']}}" style="border-radius:50px;" width="50" height="50">
						<div class="avatar-upload">
							<div class="avatar-edit">
								<input type='file' id="imageUpload_lrg" name="voter_id" accept=".png, .jpg, .jpeg" />
								<label for="imageUpload_lrg"></label>
							</div>
							<div class="avatar-preview">
								<div id="imagePreview1" style="
								{% if(FTCHEmpr[0]['voter_id'] !='') %} background-image: url(/employee-temp/{{FTCHEmpr[0]['voter_id']}}); border:2px solid red;
								{% endif %};"></div>
							</div>
						</div>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="upload here AADHAR ID. (2)">AADHAR ID. <small>(2)</small> <span id="emp_mbl1_errmsg" style="color:red;"></span></label><br>
						<img src="/employees/{{FTCHEmp[0]['aadhaar_id']}}" style="border-radius:50px;" width="50" height="50">
						<div class="avatar-upload">
							<div class="avatar-edit">
								<input type='file' id="imageUpload_small" name="aadhar_id" accept=".png, .jpg, .jpeg" />
								<label for="imageUpload_small"></label>
							</div>
							<div class="avatar-preview">
								<div id="imagePreview2" style="
								{% if(FTCHEmpr[0]['aadhaar_id'] !='') %} background-image: url(/employee-temp/{{FTCHEmpr[0]['aadhaar_id']}}); border:2px solid red;
								{% endif %}"></div>
							</div>
						</div>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="upload here other docs. (3)">Others. <small>(3)</small> <span id="emp_mbl1_errmsg" style="color:red;"></span></label><br>
						<img src="/employees/{{FTCHEmp[0]['other_docs']}}" style="border-radius:50px;" width="50" height="50">
						<div class="avatar-upload">
							<div class="avatar-edit">
								<input type='file' id="imageUpload_med" name="other_doc" accept=".png, .jpg, .jpeg" />
								<label for="imageUpload_med"></label>
							</div>
							<div class="avatar-preview">
								<div id="imagePreview3" style="
								{% if(FTCHEmpr[0]['other_docs'] !='') %} background-image: url(/employee-temp/{{FTCHEmpr[0]['other_docs']}});
								border:2px solid red;{% endif %}"></div>
							</div>
						</div>
					</div>
				</div>
				<div class="section-title mt-0"><h5>Employee Residence (Permanent Residence)</h5></div>
				<br><div class="form-group row mb-4">
					<div class="form-group col-sm-2 col-md-2">
						<label title="{{FTCHEmp[0]['door_no1']}}">Door/Plot No.</label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br><b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['door_no1'] | length > 30 ? FTCHEmp[0]['door_no1'] | slice(0, 30) ~ '...' : FTCHEmp[0]['door_no1'] }}</b><br><input type="text" class="form-control" name="perm_door_no" id="perm_door_no" placeholder="Type Door No." value="{{FTCHEmpr[0]['door_no1']}}" required
						{% if(FTCHEmpr[0]['door_no1'] |trim == FTCHEmp[0]['door_no1'] |trim) %} {% else %}
						style="color:red;" {% endif %}
						>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['street1']}}">Street <small>(1)&nbsp;</small></label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span> <br><b style="color:green; font-size:10px;"> <a title="{{FTCHEmp[0]['street1']}}">{{ FTCHEmp[0]['street1'] | length > 30 ? FTCHEmp[0]['street1'] | slice(0, 30) ~ '...' : FTCHEmp[0]['street1'] }}</a></b>
						<input type="text" class="form-control" name="perm_street1" id="perm_street1" placeholder="Type Street (1)" value="{{FTCHEmpr[0]['street1']}}" required
						{% if(FTCHEmpr[0]['street1'] |trim == FTCHEmp[0]['street1'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['street2']}}">Street <small>(2)</small></label><br>
						<b style="color:green; font-size:10px;"> {{ FTCHEmp[0]['street2'] | length > 30 ? FTCHEmp[0]['street2'] | slice(0, 30) ~ '...' : FTCHEmp[0]['street2'] }}</b>
						<input type="text" class="form-control" name="perm_street2" id="perm_street2" placeholder="Type Street (2)" value="{{FTCHEmpr[0]['street2']}}" 
						{% if(FTCHEmpr[0]['street2'] |trim == FTCHEmp[0]['street2'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
					<div class="form-group col-sm-2 col-md-2">
						<label title="Type here Employee Residence City">City &nbsp;</label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span> <br>
						<b style="color:green; font-size:10px;"> {{FTCHEmp[0]['city_name']}}</b>
						<input type="text" class="form-control" name="perm_city" id="perm_city" placeholder="Type City" value="{{FTCHEmpr[0]['city_name']}}" required {% if(FTCHEmpr[0]['city_name'] |trim == FTCHEmp[0]['city_name'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
					<div class="form-group col-sm-2 col-md-2">
						<label title="Type here Employee Residence State">State &nbsp;</label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['state_name']}}</b>
						<input type="text" class="form-control" name="perm_state" id="perm_state" placeholder="Type State" value="{{FTCHEmpr[0]['state_name']}}" required
						{% if(FTCHEmpr[0]['state_name'] |trim == FTCHEmp[0]['state_name'] |trim) %} {% else %}
						style="color:red;" {% endif %}
						>
					</div>
					</div>
					<div class="form-group row mb-4">
					<div class="form-group col-sm-4 col-md-4">Same Address as above?
					&nbsp;<input type="checkbox" id="same_addr" onchange="copy_addr();" value="1">
					</div>
					</div>
					<div class="section-title mt-0"><h5>Employee Residence (Temp/Local Residence)</h5></div>
					<div class="form-group row mb-4">
					<div class="form-group col-sm-2 col-md-2">
						<label title="{{FTCHEmp[0]['door_no2']}}">Door/Plot No</label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span><br><b style="color:green; font-size:10px;"> 
						{{ FTCHEmp[0]['door_no2'] | length > 30 ? FTCHEmp[0]['door_no2'] | slice(0, 30) ~ '...' : FTCHEmp[0]['door_no2'] }}</b>
						<input type="text" class="form-control" name="local_door_no" id="local_door_no" placeholder="Type Door No." value="{{FTCHEmpr[0]['door_no2']}}" required 
						{% if(FTCHEmpr[0]['door_no2'] |trim == FTCHEmp[0]['door_no2'] |trim) %} {% else %}
						style="color:red;" {% endif %} >
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['temp_street1']}}">Street <small>(1) &nbsp;</small></label>&nbsp;<span id="emp_mbl1_errmsg" style="color:red;">*</span> <br><b style="color:green; font-size:10px;">
						{{ FTCHEmp[0]['temp_street1'] | length > 30 ? FTCHEmp[0]['temp_street1'] | slice(0, 30) ~ '...' : FTCHEmp[0]['temp_street1'] }}</b>
						<input type="text" class="form-control" name="local_street1" id="local_street1" placeholder="Type Street (1)" value="{{FTCHEmpr[0]['temp_street1']}}" required {% if(FTCHEmpr[0]['temp_street1'] |trim == FTCHEmp[0]['temp_street1'] |trim) %} {% else %}
						style="color:red;" {% endif %} >
					</div>
					<div class="form-group col-sm-3 col-md-3">
						<label title="{{FTCHEmp[0]['temp_street2']}}">Street <small>(2) </small></label><br><b style="color:green; font-size:10px;">{{ FTCHEmp[0]['temp_street2'] | length > 30 ? FTCHEmp[0]['temp_street2'] | slice(0, 30) ~ '...' : FTCHEmp[0]['temp_street2'] }}</b>
						<input type="text" class="form-control" name="local_street2" id="local_street2" placeholder="Type Street (2)" value="{{FTCHEmpr[0]['temp_street2']}}" {% if(FTCHEmpr[0]['temp_street2'] |trim == FTCHEmp[0]['temp_street2'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
					<div class="form-group col-sm-2 col-md-2">
						<label title="Type here Employee Residence City">City</label>&nbsp;<span id="emp_mbl2_errmsg" style="color:red;">*</span> <br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['temp_city']}}</b>
						<input type="text" class="form-control" name="local_city" id="local_city" placeholder="Type City" value="{{FTCHEmpr[0]['temp_city']}}" required {% if(FTCHEmpr[0]['temp_city'] |trim == FTCHEmp[0]['temp_city'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
					<div class="form-group col-sm-2 col-md-2">
						<label title="Type here Employee Residence State">State</label>&nbsp;<span id="emp_mbl2_errmsg" style="color:red;">*</span> <br><b style="color:green; font-size:10px;"> {{FTCHEmp[0]['temp_state']}}</b>
						<input type="text" class="form-control" name="local_state" id="local_state" placeholder="Type State" value="{{FTCHEmpr[0]['temp_state']}}" required {% if(FTCHEmpr[0]['temp_state'] |trim == FTCHEmp[0]['temp_state'] |trim) %} {% else %}
						style="color:red;" {% endif %}>
					</div>
				</div>
				
				<div class="form-group row mb-4">
					<div class="card-footer text-right">
						Waiting for Admin approval. Once admin approved requested data, then you can edit. 
					</div>
				</div>
				<!-- ########[ FORM - end ]######## -->	

			</div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
{% endblock %}