<!DOCTYPE html>
<html>
	<head>

		<link rel="icon" href="https://www.salihin.com.my/favicon.ico">

		<!-- bootstrap 4 -->
		<link rel="stylesheet" href="http://salihin.noip.me/spserp.dev/assets/vendors/bootstrap/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
		<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> -->

		<!-- DataTables -->
		<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.16/datatables.min.css"/>

		<!-- iziToast -->
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/izitoast/1.2.0/css/iziToast.min.css" integrity="sha256-KRuAWYyML8ozSxElJG/l4ZIS83XnPbd9WwhZMD1vrDI=" crossorigin="anonymous" />

		<!-- Animate -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/animate.css" />

		<!-- Datepicker -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/datepicker/css/bootstrap-datepicker3.css" />

		<!-- durationpicker -->
		<!-- <link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/durationpicker/src/bootstrap-duration-picker.css" /> -->

		<!-- bootstrap-select -->
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">

		<!-- fullcalendar -->
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.css">
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/fullcalendar-3.9.0/fullcalendar-3.9.0/scheduler.min.css" />

		<!--Timepicker-->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/jquery-timepicker-master/jquery-timepicker-master/jquery.timepicker.css" />

		<!-- select2 -->
		<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
		<link  rel="stylesheet"type="text/css"  href="http://salihin.noip.me/spserp.dev/assets/vendors/select2-bootstrap4-theme-1.0.0/dist/select2-bootstrap4.css"/>

		<!-- datetimepicker -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/datetimepicker/css/bootstrap-material-datetimepicker.css">

		<!-- datetimepicker bootstrap -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/vendors/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">

		<!-- Bootstrap toggle-->
		<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/switchery/0.8.2/switchery.css">

		<!-- <link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/themes/web/css/main.css" /> -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/themes/web/css/bootstrap-extension.css" />

		<!-- font awesome v5.3.1 -->
		<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" >

		<!-- pure css switch button toggle -->
		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/themes/web/css/switch.css">

		<link rel="stylesheet" type="text/css" href="http://salihin.noip.me/spserp.dev/assets/themes/web/css/widget.css">
		<link rel="stylesheet" href="http://salihin.noip.me/spserp.dev/assets/vendors/selectric/selectric.css">

		<!-- JQuery -->
		<script
			src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
		</script>

		<!-- bootstrap 4 -->
		<script 
			src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" 
			integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" 
			crossorigin="anonymous"></script>
		<script 
			src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" 
			integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" 
			crossorigin="anonymous"></script>

		<!-- moment.js -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/moment-business-days@1.0.6/index.min.js"></script>

		<!-- Datepicker -->
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/datepicker/js/bootstrap-datepicker.js"></script>

		<!-- FontAwesome 5 -->
		<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js" integrity="sha384-kW+oWsYx3YpxvjtZjFXqazFpA7UP/MbiY4jvs+RWZo2+N94PFZ36T6TFkc9O3qoB" crossorigin="anonymous"></script>

		<!-- Datatables -->
		<script 
			src="https://cdn.datatables.net/v/bs4/dt-1.10.16/datatables.min.js"></script>

		<!-- datatable-moment plugin -->
		<script src="https://cdn.datatables.net/plug-ins/1.10.16/sorting/datetime-moment.js"></script>

		<!-- iziToast -->
		<script 
			src="https://cdnjs.cloudflare.com/ajax/libs/izitoast/1.2.0/js/iziToast.min.js" 
			integrity="sha256-uCdpRo51COIjZA47syx+kEsafS8SC+wleH4f/PvVnMU=" 
			crossorigin="anonymous"></script>

		<!-- parsley.js -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.8.1/parsley.js"></script>

		<!-- bootstrap-select -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>

		<!-- Timepicker--> 
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/jquery-timepicker-master/jquery-timepicker-master/jquery.timepicker.js"></script>

		<!-- accounting js--> 
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/accountingjs/accounting.min.js"></script>

		<!-- select2 -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

		<!-- Bootstrap Select -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>

		<!-- datetimepicker -->
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/datetimepicker/js/bootstrap-material-datetimepicker.js"></script>

		<!-- datetimepicker bootrap -->
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js" ></script>
		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/datetimejs/datetimejs.js"></script>

		<!-- Bootstrap toggle-->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/switchery/0.8.2/switchery.js"></script>
		<script src="http://salihin.noip.me/spserp.dev/assets/dist/js/jquery.mask.js"></script>
		<script src="http://salihin.noip.me/spserp.dev/assets/dist/js/jquery.qrcode.min.js"></script>

		<script src="http://salihin.noip.me/spserp.dev/assets/vendors/selectric/jquery.selectric.min.js"></script>

		<style type="text/css">
			* {
				font-family:  -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
				font-size: 1em;
			}
			small {
				font-size: 0.8em;
			}
			a:link, a:visited {
				text-decoration: none;
			}
			header, footer, section {
				padding: 0 0 20px;
				z-index: 1;
				clear: both;
			}
			header .report-title {
				padding: 0 5px 0 0;
			}
			header .t-corp {
				width: 220px;
				text-align: center;
				padding: 20px 0 0 5px;
			}
			header .t-corp-name {
				width: inherit;
				margin: 0 auto;
				padding: 8px 0 0;
			}
			header .t-corp-logo {
				margin: 0 auto;
				text-align: center;
			}
			header .t-corp-logo img {
				width: 100%;
			}
			header .company {
				margin: 10px 0 0;
				width: 100%;
			}
			header .company span, header label {
				display: block;
			}
			header .company .divider {
				vertical-align: top;
				width: 35%;
				min-height: 100px;
			}
			header .company .details {
				width: 30%;
				text-align: center;
			}
			header .company .line {
				width: 100%;
				border-top: 4px solid #444;
				margin: 10px 0 0;
			}
			header .company > td {
				min-height: 100px;
			}
			nav {
				display: inline-block;
				float: right;
				width: auto;
				margin: 0 auto;
				padding: 5px 15px;
				z-index: 2;
				text-align: center;
				position: relative;
			}
			section pre b {
				font-family: Arial, sans-serif !important;
			}
			section pre {
				background: none;
				border: none;
				margin: 0;
				padding: 0;
				line-height: 2em;
			}
			section h5 {
				font-weight: 700;
			}
			section table td, section table th {
				padding: 10px 7px;
				vertical-align: top;
			}
			section table th {
				border-top: 3px solid #444;
				border-bottom: 3px solid #444;
			}
			section table tr:last-child td {
				border-bottom: 3px solid #444;
			}
			section table tbody tr {
				min-height: 100px !important;
			}
			section .item {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			section .item-title {
				font-weight: 700;
			}
			section table {
				margin: 10px 0 0;
			}
			section .grand-total {
				border: 4px solid #444;
				padding: 8px 10px 0;
				margin: 20px 0 0;
			}
			section .grand-total span {
				display: block;
			}
			.customer-panel {
				padding: 25px 0 10px;
			}
			.customer-panel .address {
				text-transform: capitalize !important;
			}
			.tar {
				text-align: right;
			}
			.tac {
				text-align: center;
			}
			.total-title {
				display: inline;
				padding: 7px 15px 0;
				text-align: left;
				color: #333;
				font-weight: 700;
				text-align: right;
			}
			.total-value {
				display: inline;
				padding: 7px 15px 0;
				text-align: left;
				color: #333;
			}
			.terms .title {
				font-weight: 700;
				text-decoration: underline;
			}
			.terms .space:first-of-type {
				padding: 0;
			}
			.terms .space {
				padding: 10px 0 0;
				line-height: 2em;
				text-align: justify;
			}
			.terms ol {
				padding: 0;
				margin: 0 0 0 10px;
			}
			.terms li {
				padding: 0 0 0 15px;
			}
			.terms .name {
				line-height: 1em;
				font-size: 12pt;
				font-weight: 700;
				display: block;
				text-transform: uppercase;
			}
			.terms .generated {
				width: 150px;
				padding: 3px 0;
				border-top: 1px dashed #444;
				margin: 100px 0 0;
				text-align: center;
			}
			.terms .generated:after {
				line-height: 1em;
				content: "TEKUN";
				position:absolute;
				top: 30px;
				left: 30px;
				z-index: 1;
				-webkit-transform: rotate(-25deg); /* Safari */
				-moz-transform: rotate(-25deg); /* Firefox */
				-ms-transform: rotate(-25deg); /* IE */
				-o-transform: rotate(-25deg); /* Opera */
				transform: rotate(-25deg);
				font-size: 18pt;
				color: #c00;
				background: #fff;
				border: solid 4px #c00;
				padding: 8px;
				border-radius: 5px;
				zoom: 1;
				filter: alpha(opacity=30);
				opacity: 0.3;
				-webkit-text-shadow: 0 0 2px #c00;
				text-shadow: 0 0 2px #c00;
				box-shadow: 0 0 2px #c00;
			}
			@page {
				size: auto;
				margin: 8mm 10mm;
			}
			@media print {
				header .company .divider { width: 25%; }
				header .company .details { width: 50%; }
				header .t-corp { width: 200px; }
				.btn-icon, nav { display:none; }
				.pagebreak { page-break-before: always; }
				table { page-break-inside:auto }
				tr    { page-break-inside:avoid; page-break-after:auto }
				thead { display:table-header-group }
				tfoot { display:table-footer-group }
			}
			@media screen and (max-width:360px) {
				header .t-corp {
					width: 180px;
				}
			}
			left {
				float:right;
				border-radius: 5px;
				padding: 20px; 
				width: 300px;
				height: 100px;    
			}
			#rounded {
				border-radius: 25px;
				border: 2px solid;
				padding: 20px; 
				width: 570px;
				height: 118px; 
			}
			div.ex1 {
	    	max-height: 50px;
	    	max-width: 30px;
			}
		</style>

		<script type="text/javascript">
			function clearForm(e) {
				$(e).parsley().reset();
		        
				$(e).find("select").val('').trigger('change');
				$(e).find("input, textarea").val("");
			}

			function validateForm(formID, msg, func)
			{
				$(formID).parsley().whenValidate().done(function(){
					toastConfirm(msg, func);
				});
			}

			function toastConfirm(msg, func)
			{
				iziToast.question({
					toastOnce: true,
					id: 'question',
					timeout: false,
					close: false,
					overlay: true,
					zindex: 9999,
					position: 'center',
					title: 'Hey',
					message: msg,
					buttons: [
						["<button><b>Yes</b></button>", function (instance, toast) {
							instance.hide(toast, {
								transitionOut: 'fadeOutUp'
							});
							
							if(func) func.call();

						}],
						["<button>No</button>", function (instance, toast) {
							instance.hide(toast, {
								transitionOut: 'fadeOutUp'
							});

							iziToast.warning({
								position: 'bottomRight',
								message: 'Operation cancelled.'
							});
						}]
					]
				});
			}
		</script>
	</head>

	<body>
		<nav class="btn-panel" style="position: relative;">
			<div class="pull-right btn-group">
				<button type="button" class="btn btn-info" onclick="do_print()"><span class="fa fa-print"></span></button>
			</div>
		</nav>
		
		<header>
			<div class="row">
				<div class="col">
					<div class="t-corp float-left">
						<div class="t-corp-logo">
							<img src="<?php echo base_url().'assets/images/logo/salihin-logo.png'; ?>" alt="company logo" />
						</div>
						<div class="t-corp-name"><b>SPS</b> | HR SYSTEM</div>
					</div>
					<div class="report-title float-right" style="margin-top: 50px;">
						<h4>PROFILE INFOMATION AS AT <?php echo $date; ?></h4>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col">
					<table class="company">
						<tr>
							<td class="divider">
								<span class="line">&nbsp;</span>
							</td>
							<td class="details">
								<span><b>SALIHIN (AF 1426)</b></span>
								<span>555, Jalan Samudra Utara 1, Taman Samudra, Batu Caves,</span>
								<span>68100, Batu Caves, Selangor</span>
								<span>Phone: 03-6185 9970 &nbsp;&nbsp; Fax: 03-6185 9970</span>
								<span>Website: salihin.com.my</span>
							</td>
							<td class="divider">
								<span class="line">&nbsp;</span>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</header>

		<div class="container">
			<div class="row">
				<div class="col-12" style="margin-top:2rem;">
					<i class="d-print-none" style="color: red;">
						<h6>
							<b>Note: <br>
								1) '*' compulsory to update <br>
								2) Personal Data Update need to be completed latest by <?php echo date('F Y',strtotime('2021-08-02')); ?></b>
						</h6>
					</i>
					<h4><?php echo 'PROFILE UPDATE'; //strtoupper($action_type->type); ?></h4>
					<p><b>EFFECTIVE DATE : ( <?php echo strtoupper(mysql_to_date_format($action_type->action_efective_date)); ?> ) </b></p>
				</div>
			</div>

			<div class="row d-print-none d-none">
				<hr style="width: 97.5%; border-top: 4px solid #444; margin: 5px 0 10px 14px;">
				<div class="col-12" style="margin-top:1rem;">
					<h5 style="color: red;"><b>Item Checklist</b></h5>
					<table id="table_update_profile_checklist" class="table table-hover table-bordered">
						<thead>
							<tr class="text-center">
								<th>Marital Status</th>
								<th>Address</th>
								<th>Family Info</th>
								<th>Next of Kin</th>
								<th>Emergency Contact</th>
								<th>Employee Rate (%)</th>
								<th>PCB Deduction Rate (%)</th>
								<!-- <th>Statutory Year</th> -->
								<th>PCB Consideration</th>
								<!-- <th>Experience in SALIHIN</th> -->
							</tr>
						</thead>

						<tbody>
							<?php 
							$i = 1;
							if($user_profile) foreach($user_profile as $row) { ?>
								<tr>
									<td class="text-center"><?php echo ($row['marital_status'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center"><?php echo ($row['address'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center"><?php echo ($row['family_info'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center"><?php echo ($row['next_kin'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center"><?php echo ($row['case_emergency'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center"><?php echo ($row['user_rate'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
									<td class="text-center">
										<?php 
										$salary_after_epf = $row['gross_pay'] - (($row['user_rate'] / 100) * $row['gross_pay']);
										if(number_format($salary_after_epf,2) >= number_format(2833.33,2))
										{
											echo ($row['user_pcb_rate'] > 0 || $row['user_zakat_deduction'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; 
										}else{
											echo 'N/A';
										}
										?>
									</td>

									<!-- <td class="text-center"><?php //echo ($row['user_statutory_year'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td> -->

									<td class="text-center">
										<?php 
										if($row['child_info'] > 0)
										{
											echo (($row['pcb_consideration'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'); 
										}else{
											echo 'N/A';
										}
										?>
									</td>
									<!-- <td class="text-center"><?php //echo ($row['working_experience'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td> -->
								</tr>
							<?php } ?>
						</tbody>
					</table>
				</div>
			</div>
		</div>


		<!-- personal data  -->
		<div class="container">
		<hr style="width: 100%; border-top: 4px solid #444; margin: 5px 0 10px 0;">
			<input type="text" name="profiling_id_new" id="profiling_id_new" value="<?php echo $profiling_id_new; ?>" hidden>
			<div class="row">
				<div class="col">
					<h4><b>PERSONAL DETAIL</b></h4>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col-3">
							<b>STAFF ID</b>
						</div>
						<div class="col">
							<p> : <?php echo (!empty($action_type->staff_id))?strtoupper($action_type->staff_id):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>TITLE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->user_title))?strtoupper($action_type->user_title):'N/A'; ?></p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>NAME</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->name))?strtoupper($action_type->name):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>BIRTH DATE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty(mysql_to_date_format($action_type->birth_date)))?strtoupper(mysql_to_date_format($action_type->birth_date)):'N/A' ?></p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>BIRTH PLACE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->birth_place))?strtoupper($action_type->birth_place):'N/A'; ?></p>
						</div>
					</div>							
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>GENDER</b>
						</div>
						<div class="col">
							<p>: 
								<?php 
								if (!empty($action_type->gender_id == 1)) 
								{
									echo strtoupper('male');
								}elseif (!empty($action_type->gender_id == 2)) 
								{
									echo strtoupper('female');
								}else{
									echo 'N/A';
								}
								?>
							</p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>HOBBY</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->hobby))?strtoupper($action_type->hobby):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>NRIC / PASSPORT</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->ic_no))?strtoupper($action_type->ic_no):'N/A'; ?></p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>NATIONALITY</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->nationality))?strtoupper($action_type->nationality):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>PASSPORT EXPIRED DATE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty(mysql_to_date_format($action_type->passport_expired_date)))?strtoupper(mysql_to_date_format($action_type->passport_expired_date)):'N/A'; ?></p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>WORKING EXPIRED DATE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty(mysql_to_date_format($action_type->working_expired_date)))?strtoupper(mysql_to_date_format($action_type->working_expired_date)):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col-3">
							<b>PLACE OF ISSUE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->issue_country))?strtoupper($action_type->issue_country):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>RELIGION</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->religion))?strtoupper($action_type->religion):'N/A'; ?></p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>RACE</b>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->race))?strtoupper($action_type->race):'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col-3">
							<b>RESIDENTIAL STATUS</b>
						</div>
						<div class="col">
							<p>:
								<?php 
								if(!empty($action_type->residential_id == 1)) 
								{
									echo strtoupper('resident');
								}elseif ($action_type->residential_id == 2) 
								{
									echo strtoupper('non resident');
								}else{
									echo 'N/A';
								}
								?>
							</p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>MARITAL STATUS</b> <button type="button" class="btn btn-default btn-sm d-print-none <?php echo $btn_hidden; ?>" onclick="editMaritalStatus('<?php echo $action_type->id; ?>');" data-trigger="hover" data-tooltip="tooltip" title="Edit Marital Status"><i class="fa fa-edit" style="color: #F0AD4E;"></i></button>
						</div>
						<div class="col">
							<p>:
								<?php 
								if (!empty($action_type->marital_status)) {
									echo ($action_type->marital_status == 1)?strtoupper('single'):'';
									echo ($action_type->marital_status == 2)?strtoupper('married'):'';
									echo ($action_type->marital_status == 3)?strtoupper('divorce'):'';
								}else{
									echo 'N/A';
								}
								?>
							</p>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>MARRIED DATE</b>
						</div>
						<div class="col">
							<p>: 
								<?php if ($action_type->marital_status == 2): ?>
									<?php echo (!empty(mysql_to_date_format($action_type->married_date)))?strtoupper(mysql_to_date_format($action_type->married_date)):'N/A'; ?>
								<?php else: ?>
									N/A
								<?php endif ?>
							</p>
						</div>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<div class="row">
						<div class="col">
							<b>PRIMARY EMAIL</b>
						</div>
						<div class="col">
							<P>: <?php echo (!empty($action_type->primary_email))?$action_type->primary_email:'N/A'; ?></P>
						</div>
					</div>
				</div>
				<div class="col">
					<div class="row">
						<div class="col">
							<b>SECONDARY EMAIL </b><button type="button" class="btn btn-default btn-sm d-print-none <?php echo $btn_hidden; ?>" onclick="editSecondaryEmail('<?php echo $action_type->id; ?>');" data-trigger="hover" data-tooltip="tooltip" title="Edit Secondary Email"><i class="fa fa-edit" style="color: #F0AD4E;"></i></button>
						</div>
						<div class="col">
							<p>: <?php echo (!empty($action_type->secondary_email))?$action_type->secondary_email:'N/A'; ?></p>
						</div>
					</div>
				</div>
			</div>			
		</div>

		<!-- Modal -->
		<div class="modal fade" id="maritalStatusModal">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title" id="racks-modal-title">Update Marital Status</h5>
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						<form id="maritalStatusForm" class="form">
							<div class="form-group">
								<label for="marital_status">Marital Status</label>
								<select class="form-control" name="marital_status" id="marital_status">
									<option disabled selected>Please Select Marital Status</option>
									<?php if (!empty($action_type->marital_status)): ?>
										<option value="1" <?php echo ($action_type->marital_status == 1)?'selected':''; ?>>Single</option>
										<option value="2" <?php echo ($action_type->marital_status == 2)?'selected':''; ?>>Married</option>
										<option value="3" <?php echo ($action_type->marital_status == 3)?'selected':''; ?>>Divorce</option>
									<?php else: ?>
										<option value="1">Single</option>
										<option value="2">Married</option>
										<option value="3">Divorce</option>
									<?php endif ?>
								</select>
							</div>
							<div class="form-group">
								<label>Married Date</label>
								<input class="datepicker form-control" name="married_date" id="married_date">
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<div class="btn-group float-right">
							<button type="button" class="btn btn-light" data-dismiss="modal">Cancel</button>
							<button type="button" id="saveMaritalStatusButton" onclick="saveMaritalStatus();" class="btn btn-primary">Save</button>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- Modal -->
		<div class="modal fade" id="secondaryEmailModal">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title" id="racks-modal-title">Update 'Update Secondary Email</h5>
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						<form id="secondaryEmailForm" class="form">
							<div class="form-group">
								<label for="secondary_email">Secondary Email</label>
								<input type="text" class="form-control" name="secondary_email" id="secondary_email" autocomplete="off">
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<div class="btn-group float-right">
							<button type="button" class="btn btn-light" data-dismiss="modal">Cancel</button>
							<button type="button" id="saveSecondaryEmailButton" onclick="saveSecondaryEmail();" class="btn btn-primary">Save</button>
						</div>
					</div>
				</div>
			</div>
		</div>

		<script type="text/javascript">
			function editMaritalStatus(id)
			{
				var profiling_id = id;

				$.ajax({
					type: 'POST',
					url: '<?php echo base_url('hr/Myprofile/getMaritalStatus'); ?>',
					data: {
						'profiling_id' : profiling_id
					},
					dataType: 'JSON',
					success: function(data) {
						if ($.trim(data.status) == "success")
						{
							var maritalStatusData = data.maritalStatus;

							$("#marital_status").val(maritalStatusData[0]['marital_status']);
							$("#married_date").val(moment(maritalStatusData[0]['married_date']).format('DD-MM-YYYY'));
						}
					}
				});

				$('#maritalStatusModal').find('#racks-modal-title').text('Update Marital Status');
				$('#saveMaritalStatusButton').attr('onclick', 'saveMaritalStatus()');
				$('#maritalStatusModal').modal('show');
			}

			function editSecondaryEmail(id)
			{
				var profiling_id = id;

				$.ajax({
					type: 'POST',
					url: '<?php echo base_url('hr/Myprofile/getSecondaryEmail'); ?>',
					data: {
						'profiling_id' : profiling_id
					},
					dataType: 'JSON',
					success: function(data) {
						if ($.trim(data.status) == "success")
						{
							var secondaryEmailData = data.secondaryEmail;

							$("#secondary_email").val(secondaryEmailData[0]['secondary_email']);
						}
					}
				});

				$('#secondaryEmailModal').find('#racks-modal-title').text('Update Secondary Email');
				$('#saveSecondaryEmailButton').attr('onclick', 'saveSecondaryEmail()');
				$('#secondaryEmailModal').modal('show');
			}

			function saveSecondaryEmail()
			{
				var postData = {
					'profiling_id' 		: $("#profiling_id_new").val(),
					'secondary_email' 	: $("#secondary_email").val()
				};

				$.ajax({
					type: 'POST',
					url: '<?php echo base_url('hr/Myprofile/save_secondary_email'); ?>',
					data: postData,
					dataType: 'JSON',
					success: function(data) {
						if(data.status == 'success')
						{
							localStorage.setItem("status",data.status);
							localStorage.setItem("msg",data.msg);

							location.replace(data.redirect);
						}
					}
				});
			}

			function saveMaritalStatus()
			{
				var postData = {
					'profiling_id' 		: $("#profiling_id_new").val(),
					'marital_status' 	: $("#marital_status").val(),
					'married_date' 		: $("#married_date").val()
				};

				$.ajax({
					type: 'POST',
					url: '<?php echo base_url('hr/Myprofile/save_marital_status'); ?>',
					data: postData,
					dataType: 'JSON',
					success: function(data) {
						if(data.status == 'success')
						{
							localStorage.setItem("status",data.status);
							localStorage.setItem("msg",data.msg);

							location.replace(data.redirect);
						}
					}
				});
			}
		</script>
		<!-- personal data -->

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- join group action type -->
		<?php if(!empty($join_group)){ ?>
			<div class="container">

				<div class="row">
					<div class="col">
						<h4><b>EMPLOYMENT DETAIL</b></h4>
					</div>
				</div>

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>REASON</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->reason)?strtoupper($join_group->reason):'N/A'; ?></p>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>POSITION</b>
							</div>
							<div class="col">
								   <p>: <?php echo ($join_group->position_hiring)?strtoupper($join_group->position_hiring):'N/A'; ?></p>
							</div>
						</div>
					</div>
				</div>

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>DESIGNATION</b>
							</div>
							<div class="col">
								<P>: <?php echo ($join_group->designation)?strtoupper($join_group->designation):'N/A'; ?></P>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>EMPLOYEE GRADE</b>
							</div>
							<div class="col">
								<?php if($join_group->level > 0){ ?>

								   <p>: <?php echo ($join_group->employee_grade)?strtoupper($join_group->employee_grade):'N/A'; ?>
								   (<?php echo (!empty($level = $join_group->level))?integerToRoman($level):'N/A'; ?>)
								   </p>

								<?php } else { ?>
								   <p>: <?php echo ($join_group->employee_grade)?strtoupper($join_group->employee_grade):'N/A'; ?></p>
								<?php } ?>
							</div>
						</div>
					</div>
				</div>

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col-3">
								<b>REPORTING TO</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->user_reporting_name)?strtoupper($join_group->user_reporting_name):'N/A';?></p>
							</div>
						</div>
					</div>
				</div>

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>BUSINESS ENTITY</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->business_entity)?strtoupper($join_group->business_entity):'N/A'; ?></p>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>BRANCH</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->branch)?strtoupper($join_group->branch):'N/A';?></p>
							</div>
						</div>
					</div>
				</div>

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>PERSONNEL AREA</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->personnel_area)?strtoupper($join_group->personnel_area):'N/A';?></p>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>PERSONAL SUBAREA</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->personal_subarea)?strtoupper($join_group->personal_subarea):'N/A';?></p>
							</div>
						</div>
					</div>
				</div>	

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>EMPLOYEE GROUP</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->employee_group)?strtoupper($join_group->employee_group):'N/A';?></p>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>CONTRACT ELEMENT</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->contract_element)?strtoupper($join_group->contract_element):'N/A'; ?></p>
							</div>
						</div>
					</div>
				</div>	

				<div class="row">
					<div class="col">
						<div class="row">
							<div class="col">
								<b>EMPLOYEE SUBGROUP</b>
							</div>
							<div class="col">
								<?php if($join_group->level > 0){ ?>

								   <p>: <?php echo ($join_group->employee_subgroup_indicator)?strtoupper($join_group->employee_subgroup_indicator):'N/A'; ?> 
								   (<?php echo (!empty($level = $join_group->level))?integerToRoman($level):'N/A'; ?>) - 
								   <?php echo ($join_group->employee_subgroup_designation)?strtoupper($join_group->employee_subgroup_designation):'N/A'; ?>
								   </p>

								<?php } else { ?>
								   <p>: <?php echo ($join_group->employee_subgroup_indicator)?strtoupper($join_group->employee_subgroup_indicator):'N/A'; ?> - <?php echo ($join_group->employee_subgroup_designation)?strtoupper($join_group->employee_subgroup_designation):'N/A'; ?></p>
								<?php } ?>
							</div>
						</div>
					</div>
					<div class="col">
						<div class="row">
							<div class="col">
								<b>EMPLOYMENT STATUS</b>
							</div>
							<div class="col">
								<p>: <?php echo ($join_group->is_active == 1)?'ACTIVE':'INACTIVE'; ?></p>
							</div>
						</div>
					</div>
				</div>
			</div>
		<?php } ?>
		<!-- join group action type -->

		<hr style="border: solid 1px; width: 58.5%; page-break-after: always;">

		<!-- address -->
		<?php  $this->load->view('hr/myprofile/address');  ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- family information -->
		<?php  $this->load->view('hr/myprofile/familyinfo');  ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- case of emergency -->
		<?php $this->load->view('hr/myprofile/case_of_emergency'); ?>

		<hr style="border: solid 1px; width: 58.5%; page-break-after: always;">

		<!-- academic qualification -->
		<?php $this->load->view('hr/myprofile/qualification'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- currently pursuing study -->
		<?php $this->load->view('hr/myprofile/currently_pursuing_study'); ?>

		<hr style="border: solid 1px; width: 58.5%; page-break-after: always;">

		<!-- professional membership -->
		<?php $this->load->view('hr/myprofile/membership'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- professional licenses -->
		<?php $this->load->view('hr/myprofile/licenses'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- professional education -->
		<?php $this->load->view('hr/myprofile/professional_education'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- professional certificate -->
		<?php $this->load->view('hr/myprofile/professional_certificate'); ?>

		<hr style="border: solid 1px; width: 58.5%; page-break-after: always;">

		<!-- recognition -->
		<?php //$this->load->view('hr/myprofile/recognition');  ?>

		<!-- statutory details -->
		<?php $this->load->view('hr/myprofile/statutory_details'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- third party payment -->
		<?php $this->load->view('hr/myprofile/third_party_payments'); ?>

		<hr style="border: solid 1px; width: 58.5%;">

		<!-- pcb consideration -->
		<?php $this->load->view('hr/myprofile/pcb_consideration'); ?>

		<!-- additional personal data -->
		<?php //$this->load->view('hr/myprofile/additional_personal_data'); ?>

		<div class="container d-print-none d-none">
			<div class="row">
				<div class="col">
					<div class="row">
 						<hr style="width: 100%; border-top: 4px solid #444; margin: 5px 0 0;">
						<div class="col-12" style="margin-top:1rem;">
							<h5 style="color: red;"><b>Item Checklist</b></h5>
							<table id="table_update_profile_checklist" class="table table-hover table-bordered">
								<thead>
									<tr class="text-center">
										<th>Marital Status</th>
										<th>Address</th>
										<th>Family Info</th>
										<th>Next of Kin</th>
										<th>Emergency Contact</th>
										<th>Employee Rate (%)</th>
										<th>PCB Deduction Rate (%)</th>
										<!-- <th>Statutory Year</th> -->
										<th>PCB Consideration</th>
										<!-- <th>Experience in SALIHIN</th> -->
									</tr>
								</thead>

								<tbody>
									<?php 
									$i = 1;
									if($user_profile) foreach($user_profile as $row) { ?>
										<tr>
											<td class="text-center"><?php echo ($row['marital_status'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center"><?php echo ($row['address'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center"><?php echo ($row['family_info'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center"><?php echo ($row['next_kin'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center"><?php echo ($row['case_emergency'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center"><?php echo ($row['user_rate'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td>
											<td class="text-center">
												<?php 
												$salary_after_epf = $row['gross_pay'] - (($row['user_rate'] / 100) * $row['gross_pay']);
												if(number_format($salary_after_epf,2) >= number_format(2833.33,2))
												{
													echo ($row['user_pcb_rate'] > 0 || $row['user_zakat_deduction'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; 
												}else{
													echo 'N/A';
												}
												?>
											</td>

											<!-- <td class="text-center"><?php //echo ($row['user_statutory_year'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td> -->

											<td class="text-center">
												<?php 
												if($row['child_info'] > 0)
												{
													echo (($row['pcb_consideration'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'); 
												}else{
													echo 'N/A';
												}
												?>
											</td>
											<!-- <td class="text-center"><?php //echo ($row['working_experience'] > 0)?'<i class="fa fa-check" style="color: green;"></i>':'<i class="fa fa-times" style="color: red;"></i>'; ?></td> -->
										</tr>
									<?php } ?>
								</tbody>
							</table>
						</div>
						<hr style="width: 100%; border-top: 4px solid #444; margin: 5px 0 10px 0;">
					</div>
				</div>
			</div>
		</div>

		<script type="text/javascript">
			// window.onbeforeunload = function (event) {
			// // Your logic to prepare for 'Stay on this Page' goes here 

			//     event.returnValue = "Please click 'Stay on this Page' and we will give you candy";
			// };

			console.log('Page rendered in {elapsed_time} seconds.');

			$('.datepicker').datepicker({
				uiLibrary: 'bootstrap4',
				format: 'dd-mm-yyyy',
				autoclose: true,
				orientation: 'bottom'
			});

			$(".datepicker-time").datetimepicker({
				//defaultDate: new Date(),
				format: 'yyyy/mm/dd hh:mm:ss'
			    // sideBySide: true
			 });

			$('.datepicker-mm-yyyy').datepicker({
				format: 'mm/yyyy',
				minViewMode:1
			});

			$('.datepicker-mm').datepicker({
				format: 'mm',
				minViewMode:1
			});

			$('.datepicker-yyyy').datepicker({
				format: 'yyyy',
				minViewMode:2
			});

			if (localStorage.getItem("status") != null) {
				if(localStorage.getItem("status").toLowerCase() == 'success')
				{
					iziToast.success({
						position: 'bottomRight',
						title: localStorage.getItem("status"),
						message: localStorage.getItem("msg")
					});
				}
				if(localStorage.getItem("status").toLowerCase() == 'error')
				{
					iziToast.error({
						position: 'bottomRight',
						title: localStorage.getItem("status"),
						message: localStorage.getItem("msg")
					});
				}
				if(localStorage.getItem("status").toLowerCase() == 'warning')
				{
					iziToast.warning({
						position: 'bottomRight',
						title: localStorage.getItem("status"),
						message: localStorage.getItem("msg")
					});
				}

				localStorage.clear();
			}
		</script>
	</body>
</html>