<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-90680653-2"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'UA-90680653-2');
    </script>

    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Twitter -->
    <!-- <meta name="twitter:site" content="@bootstrapdash">
    <meta name="twitter:creator" content="@bootstrapdash">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Azia">
    <meta name="twitter:description" content="Responsive Bootstrap 4 Dashboard Template">
    <meta name="twitter:image" content="https://www.bootstrapdash.com/azia/img/azia-social.png"> -->

    <!-- Facebook -->
    <!-- <meta property="og:url" content="https://www.bootstrapdash.com/azia">
    <meta property="og:title" content="Azia">
    <meta property="og:description" content="Responsive Bootstrap 4 Dashboard Template">

    <meta property="og:image" content="https://www.bootstrapdash.com/azia/img/azia-social.png">
    <meta property="og:image:secure_url" content="https://www.bootstrapdash.com/azia/img/azia-social.png">
    <meta property="og:image:type" content="image/png">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="600"> -->

    <!-- Meta -->
    <meta name="description" content="Responsive Bootstrap 4 Dashboard Template">
    <meta name="author" content="BootstrapDash">

    <title>Sistem Informasi Pegawai | Yayasan Nurul Islam</title>
	<link rel="icon" type="image/png" href="<?php echo base_url();?>assets/images/favicon.png">

    <!-- vendor css -->
    <link href="<?php echo base_url();?>assets/pegawai/lib/fontawesome-free/css/all.min.css" rel="stylesheet">
    <link href="<?php echo base_url();?>assets/pegawai/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
    <link href="<?php echo base_url();?>assets/pegawai/lib/typicons.font/typicons.css" rel="stylesheet">
    <link href="<?php echo base_url();?>assets/pegawai/lib/flag-icon-css/css/flag-icon.min.css" rel="stylesheet">

    <!-- azia CSS -->
    <link rel="stylesheet" href="<?php echo base_url();?>assets/pegawai/css/azia.css">

  </head>
  <body>

    <div class="az-header">
      <div class="container">
        <div class="az-header-left">
          <a href="<?php echo base_url();?>Pegawai" class="az-logo"><img src="<?php echo base_url();?>assets/images/logo.png" height="50px"></a>
          <a href="" id="azMenuShow" class="az-header-menu-icon d-lg-none"><span></span></a>
        </div><!-- az-header-left -->
        <div class="az-header-menu">
          <div class="az-header-menu-header">
            <a href="index.html" class="az-logo"><span></span> <img src="<?php echo base_url();?>assets/images/logo.png" style="max-height:40px;"></a>
            <a href="" class="close">&times;</a>
          </div><!-- az-header-menu-header -->
          <ul class="nav">
            <li class="nav-item active show">
              <a href="<?php echo base_url();?>Pegawai/personal" class="nav-link"><i class="typcn typcn-user"></i> Personal</a>
            </li>
            <li class="nav-item">
              <a href="<?php echo base_url();?>Pegawai/pegawai" class="nav-link"><i class="typcn typcn-contacts"></i> Kepegawaian</a>
            </li>
            <li class="nav-item">
              <a href="<?php echo base_url();?>Pegawai/keluarga" class="nav-link"><i class="typcn typcn-group"></i> Keluarga</a>
            </li>
            <li class="nav-item">
              <a href="<?php echo base_url();?>Pegawai/pendidikan" class="nav-link"><i class="typcn typcn-mortar-board"></i> Pendidikan</a>
            </li>
            <li class="nav-item">
              <a href="<?php echo base_url();?>Pegawai/kesehatan" class="nav-link"><i class="typcn typcn-heart"></i> Kesehatan</a>
            </li>
            <li class="nav-item">
              <a href="<?php echo base_url();?>Pegawai/downloadcv" class="nav-link"><i class="typcn typcn-download"></i> Download CV	</a>
            </li>
          </ul>
        </div><!-- az-header-menu -->
        <div class="az-header-right">
          <a href="<?php echo base_url();?>Pegawai/gantiPassword" class="az-header-search-link" title="Ganti Password"><i class="fas fa-cog"></i></a>
          <a href="<?php echo base_url();?>Login/logout" class="az-header-search-link" onclick="return confirm('Apakah Anda ingin logout?');" title="Logout"><i class="fas fa-power-off"></i></a>
        </div><!-- az-header-right -->
      </div><!-- container -->
    </div><!-- az-header -->

    <div class="az-content az-content-dashboard">
      <div class="container">
        <div class="az-content-body">
          <div class="az-content-label mg-b-5">Data Personal</div>
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Nama</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: <?php echo ($pegawai->gelar_depan != NULL ? $pegawai->gelar_depan." " : "").$pegawai->nama. ($pegawai->gelar_belakang != NULL ? " ".$pegawai->gelar_belakang : "");?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">NIP/NPP</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->no_pegawai == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->no_pegawai;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Alamat</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->alamat == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->alamat;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Nomor Telepon / HP</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->nohp == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->nohp;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Email</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->email == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->email;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Tempat, Tanggal Lahir</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->tempat_lahir == NULL)
						{
							$tempat = "-";
						}
						else
						{
							$tempat = $pegawai->tempat_lahir;
						}
						if($pegawai->tanggal_lahir == NULL)
						{
							$tanggal = "-";
						}
						else
						{
							$tanggal = $pegawai->tanggal_lahir;
						}
						
						echo $tempat.", ".$tanggal;
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Jenis Kelamin</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->jenkel == NULL)
						{
							echo "-";
						}
						else
						{
							if($pegawai->jenkel == "L")
							{
								echo "Laki-Laki";
							}
							else
							{
								echo "Perempuan";
							}
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Golongan Darah</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->gol_darah == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->gol_darah;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">File KTP</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->foto_ktp == NULL)
						{
							echo "-";
						}
						else
						{
							?>
								<a href="<?php echo base_url();?>assets/pegawai/docs/<?php echo $pegawai->foto_ktp;?>" download>Klik di sini untuk mendownload KTP Anda!</a>
							<?php
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">File KK</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->foto_kk == NULL)
						{
							echo "-";
						}
						else
						{
							?>
								<a href="<?php echo base_url();?>assets/pegawai/docs/<?php echo $pegawai->foto_kk;?>" download>Klik di sini untuk mendownload file KK Anda!</a>
							<?php
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">File Ijazah Terakhir</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->foto_ijazah_terakhir == NULL)
						{
							echo "-";
						}
						else
						{
							?>
								<a href="<?php echo base_url();?>assets/pegawai/docs/<?php echo $pegawai->foto_ijazah_terakhir;?>" download>Klik di sini untuk mendownload file KTP Ijazah Terakhir Anda!</a>
							<?php
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-2">
              <p class="mg-b-10">Lainnya</p>
			</div>
            <div class="col-lg-10">
              <strong>
				<p>
					: 
					<?php
						if($pegawai->lain == NULL)
						{
							echo "-";
						}
						else
						{
							echo $pegawai->lain;
						}
					?>
				</p>
              </strong>
            </div><!-- col-4 -->
          </div><!-- row -->
          <div class="row row-sm mg-b-20">
            <div class="col-lg-12">
              <a href="<?php echo base_url();?>Pegawai/personalEdit" class="btn btn-az-primary float-sm-right">
				<i class="typcn typcn-pencil"></i> Ubah Data Personal
			  </a>
            </div><!-- col-4 -->
          </div><!-- row -->
		</div>
      </div>
    </div><!-- az-content -->

    <div class="az-footer ht-40">
      <div class="container ht-100p pd-t-0-f">
        <span class="text-muted d-block text-center text-sm-left d-sm-inline-block">Copyright © 2022 Sistem Informasi Pegawai</span>
        <span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center"> Dikembangkan oleh <a href="https://nurul-islam.sch.id" target="_blank">Yayasan Nurul Islam</a></span>
      </div><!-- container -->
    </div><!-- az-footer -->


    <script src="<?php echo base_url();?>assets/pegawai/lib/jquery/jquery.min.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/ionicons/ionicons.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/jquery.flot/jquery.flot.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/jquery.flot/jquery.flot.resize.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/chart.js/Chart.bundle.min.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/lib/peity/jquery.peity.min.js"></script>

    <script src="<?php echo base_url();?>assets/pegawai/js/azia.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/js/chart.flot.sampledata.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/js/dashboard.sampledata.js"></script>
    <script src="<?php echo base_url();?>assets/pegawai/js/jquery.cookie.js" type="text/javascript"></script>
    <script>
      $(function(){
        'use strict'

    		var plot = $.plot('#flotChart', [{
          data: flotSampleData3,
          color: '#007bff',
          lines: {
            fillColor: { colors: [{ opacity: 0 }, { opacity: 0.2 }]}
          }
        },{
          data: flotSampleData4,
          color: '#560bd0',
          lines: {
            fillColor: { colors: [{ opacity: 0 }, { opacity: 0.2 }]}
          }
        }], {
    			series: {
    				shadowSize: 0,
            lines: {
              show: true,
              lineWidth: 2,
              fill: true
            }
    			},
          grid: {
            borderWidth: 0,
            labelMargin: 8
          },
    			yaxis: {
            show: true,
    				min: 0,
    				max: 100,
            ticks: [[0,''],[20,'20K'],[40,'40K'],[60,'60K'],[80,'80K']],
            tickColor: '#eee'
    			},
    			xaxis: {
            show: true,
            color: '#fff',
            ticks: [[25,'OCT 21'],[75,'OCT 22'],[100,'OCT 23'],[125,'OCT 24']],
          }
        });

        $.plot('#flotChart1', [{
          data: dashData2,
          color: '#00cccc'
        }], {
    			series: {
    				shadowSize: 0,
            lines: {
              show: true,
              lineWidth: 2,
              fill: true,
              fillColor: { colors: [ { opacity: 0.2 }, { opacity: 0.2 } ] }
            }
    			},
          grid: {
            borderWidth: 0,
            labelMargin: 0
          },
    			yaxis: {
            show: false,
            min: 0,
            max: 35
          },
    			xaxis: {
            show: false,
            max: 50
          }
    		});

        $.plot('#flotChart2', [{
          data: dashData2,
          color: '#007bff'
        }], {
    			series: {
    				shadowSize: 0,
            bars: {
              show: true,
              lineWidth: 0,
              fill: 1,
              barWidth: .5
            }
    			},
          grid: {
            borderWidth: 0,
            labelMargin: 0
          },
    			yaxis: {
            show: false,
            min: 0,
            max: 35
          },
    			xaxis: {
            show: false,
            max: 20
          }
    		});


        //-------------------------------------------------------------//


        // Line chart
        $('.peity-line').peity('line');

        // Bar charts
        $('.peity-bar').peity('bar');

        // Bar charts
        $('.peity-donut').peity('donut');

        var ctx5 = document.getElementById('chartBar5').getContext('2d');
        new Chart(ctx5, {
          type: 'bar',
          data: {
            labels: [0,1,2,3,4,5,6,7],
            datasets: [{
              data: [2, 4, 10, 20, 45, 40, 35, 18],
              backgroundColor: '#560bd0'
            }, {
              data: [3, 6, 15, 35, 50, 45, 35, 25],
              backgroundColor: '#cad0e8'
            }]
          },
          options: {
            maintainAspectRatio: false,
            tooltips: {
              enabled: false
            },
            legend: {
              display: false,
                labels: {
                  display: false
                }
            },
            scales: {
              yAxes: [{
                display: false,
                ticks: {
                  beginAtZero:true,
                  fontSize: 11,
                  max: 80
                }
              }],
              xAxes: [{
                barPercentage: 0.6,
                gridLines: {
                  color: 'rgba(0,0,0,0.08)'
                },
                ticks: {
                  beginAtZero:true,
                  fontSize: 11,
                  display: false
                }
              }]
            }
          }
        });

        // Donut Chart
        var datapie = {
          labels: ['Search', 'Email', 'Referral', 'Social', 'Other'],
          datasets: [{
            data: [25,20,30,15,10],
            backgroundColor: ['#6f42c1', '#007bff','#17a2b8','#00cccc','#adb2bd']
          }]
        };

        var optionpie = {
          maintainAspectRatio: false,
          responsive: true,
          legend: {
            display: false,
          },
          animation: {
            animateScale: true,
            animateRotate: true
          }
        };

        // For a doughnut chart
        var ctxpie= document.getElementById('chartDonut');
        var myPieChart6 = new Chart(ctxpie, {
          type: 'doughnut',
          data: datapie,
          options: optionpie
        });

      });
    </script>
  </body>
</html>
