<section class="content-header">
	<div class="container-fluid">
		<div id="flash" data-flash="<?= $this->session->flashdata('success'); ?>"></div>
		<div class="row ">
			<div class="col-sm-6">
				<h1>TEAM ID <button data-toggle="modal" data-target="#foammekanik" class="btn btn-sm btn-primary">
						<i class="fas fa-plus"></i>
					</button></h1>

			</div>
		</div>
	</div>
</section>
<section class="content">


	<!-- start data team -->
	<div class="row">
		<?php foreach ($mekid->result() as $am => $data) : ?>
			<div class="col-12 col-sm-6  align-items-stretch">
				<div class="card bg-light">
					<div class="card-header text-muted border-bottom-0">
						<span class="right badge badge-secondary"><?= $data->pekerjaan ?></span> Support
					</div>
					<div class="card-body pt-0">
						<div class="row">
							<div class="col-7">
								<h2 class="lead"><b><?= $data->nama ?></b></h2>
								<p class="text-muted text-sm"><b>IG: </b> <?= $data->sosial_media ?> </p>
								<ul class="ml-4 mb-0 fa-ul text-muted">
									<li class="small"><span class="fa-li"></span> <b>Address :</b> <?= $data->alamat ?></li>
									<li class="small"><span class="fa-li"></span> <b>Phone #:</b> <?= $data->no_hp ?></li>
								</ul>
							</div>
							<div class="col-5 text-center">
								<img src="<?= base_url() ?>/upload/foto/karyawan/<?= $data->foto ?>" alt="" class="img-circle img-fluid">
							</div>
						</div>
					</div>
					<div class="card-footer">
						<div class="text-right">
							<a href="https://wa.me/<?= $data->no_hp ?>?text=Hai Apa Kabar, Ada yg bisa di bantu ?" target="black" class="btn btn-sm bg-success">
								<i class="fab fa-whatsapp"></i>
							</a>
							<button class="btn btn-sm btn-warning" data-toggle="modal" data-target="#exampleModal" id="addkaryawan" data-id_user="<?= $data->id_user ?>" data-nama="<?= $data->nama ?>" data-norek="<?= $data->norek ?>" data-no_ktp="<?= $data->no_ktp ?>" data-gaji="<?= $data->gaji ?>" data-no_hp="<?= $data->no_hp ?>" data-alamat="<?= $data->alamat ?>" data-email="<?= $data->email ?>" data-sosial_media="<?= $data->sosial_media ?>" data-perbaikan="<?= $data->perbaikan ?>" data-pekerjaan="<?= $data->pekerjaan ?>" data-nama_bank="<?= $data->nama_bank ?>" data-injob="<?= $data->injob ?>" data-foto="<?= $data->foto ?>" data-mmetik="<?= $data->mmetik ?>" data-mbebek="<?= $data->mbebek ?>" data-msport="<?= $data->msport ?>" data-mmodifikasi="<?= $data->mmodifikasi ?>" data-kebkerja="<?= $data->kebkerja ?>" data-teamkerja="<?= $data->teamkerja ?>" data-konkerja="<?= $data->konkerja ?>" data-karyawan="<?= $data->karyawan ?>">
								<i class=" fas fa-user"></i> View Profile
							</button>
							<a id="btn-hapus" href="<?= site_url('mekanikid/delmekanikid/' . $data->id_user) ?>" id="btn-hapus" class="btn btn-sm btn-secondary">
								<i class="fas fa-trash-restore-alt"></i>
							</a>

						</div>
					</div>
				</div>
			</div>
		<?php endforeach ?>
	</div>
	<!-- end data team -->

</section>

<!-- Start modal Keterangan absen -->
<form action="<?= base_url('mekanikid/addmekanik'); ?>" enctype="multipart/form-data" method="post">
	<div class="modal fade bd-example-modal-lg" id="absenket" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg modal-dialog-centered">
			<div class="modal-content">
				<div class="modal-body">
					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-volume-up"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase " name="Alasana libur" type="text" placeholder="No.Ktp">
					</div>
				</div>
			</div>
		</div>
	</div>

</form>
<!-- ending modal Keterangan absen -->

<!-- Start modal add mekanik -->
<form action="<?= base_url('mekanikid/addmekanik'); ?>" enctype="multipart/form-data" method="post">
	<div class="modal fade bd-example-modal-lg" id="foammekanik" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg modal-dialog-centered">
			<div class="modal-content">
				<div class="modal-header bg-secondary">
					<h5 class="modal-title" id="exampleModalLabel">Foam Data Karyawan Baru</h5>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
					<div class="col mb-3 text-center text-secondary ">
						<i class="fas fa-user-check"></i> <strong> Data Personal</strong>
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-id-card"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="no_ktp" type="text" placeholder="No. Ktp">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-user-circle"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="nama" type="text" placeholder="Nama Lengkap">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-home"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="alamat" type="text" placeholder="Alamat Rumah">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-phone"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="no_hp" type="text" placeholder="No. Handphone">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-envelope"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="email" type="text" placeholder="Email">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-at"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="sosial_media" type="text" placeholder="Akun Sosial Media">
					</div>

					<div class="input-group mt-2 col-sm-12">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-user-circle"></i>
							</span>
						</div>
						<div class="custom-file ">
							<input type="file" name="foto" class="custom-file-input " id="validatedInputGroupCustomFile">
							<label class="custom-file-label " for="validatedInputGroupCustomFile">Pilih Foto Wajah</label>
						</div>
					</div>

					<div class="col mb-3 mt-2 text-center text-secondary ">
						<i class="fas fa-user-check"></i> <strong> Data Posisi Kerja</strong>
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-money-bill-wave"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="gaji" type="text" placeholder="Gaji">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-building"></i>
							</span>
						</div>
						<select class="form-control" name="nama_bank" required>
							<option value="">- Pilih Bank -</option>
							<option value="BSI"> Bank BSI </option>
							<option value="BNI"> Bank BNI </option>
							<option value="BNI"> Bank BRI </option>
							<option value="BTN"> Bank BTN </option>
							<option value="Mandiri"> Bank Mandiri </option>
							<option value="BCA"> Bank BCA </option>
						</select>
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-wrench"></i>
							</span>
						</div>
						<select class="form-control" name="pekerjaan" required>
							<option value="">- Pilih Jabatan -</option>
							<option value="Kepala Mekanik"> Kepala Mekanik </option>
							<option value="Mekanik"> Mekanik </option>
							<option value="Kasir"> Kasir </option>

						</select>
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-pen-alt"></i>
							</span>
						</div>
						<input autocomplete="off" class="form-control text-uppercase" name="norek" type="text" placeholder="No.Rekening">
					</div>


					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-calendar-alt"></i>
							</span>
						</div>
						<input autocomplete="off" required id="tanggal" class="form-control text-uppercase" name="injob" placeholder="Tanggal Masuk Kerja">
					</div>

					<div class="input-group mt-2 col-sm-12 ">
						<div class="input-group-prepend">
							<span class="input-group-text">
								<i class="fas fa-user"></i>
							</span>
						</div>
						<select value="<?= set_value('karyawan') ?>" aria-describedby="nambank_idFeedback" class="form-control" name="karyawan" required>
							<option value="">- Pilih status -</option>
							<option value="0"> Pemilik Usaha </option>
							<option value="1"> Karyawan </option>

						</select>
					</div>


					<div class="modal-footer">
						<button type="submit" class="btn btn-secondary w-100">Simpan Data Karyawan </button>
					</div>
				</div>
			</div>
		</div>
	</div>

</form>
<!-- ending modal add mekanik -->

<!-- start modal edit data mekanik -->
<div class="modal fade bd-example-modal-lg" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
		<div class="modal-content">
			<div class="modal-body">

				<!-- Widget: user widget style 1 -->
				<div class="card card-widget widget-user w-100">
					<!-- Add the bg color to the header using any of the bg-* classes -->
					<div class="widget-user-header text-white bg-primary">
						<h3 class="widget-user-username text-right text-black-50 " id="itempnama"></h3>
						<h5 class="widget-user-desc text-right text-black-50" id="job"></h5>
					</div>
					<div class="widget-user-image">
						<img class="img-circle elevation-3" id="itempfoto" src="">
					</div>
					<div class="card-footer">
						<div class="row">
							<div class="col-sm-4 border-right">
								<div class="description-block">
									<h5 class="description-header" id="perbaikanok"></h5>
									<span class="description-text">PERBAIKAN</span>
								</div>
								<!-- /.description-block -->
							</div>
							<!-- /.col -->
							<div class="col-sm-4 border-right">
								<div class="description-block">
									<h5 class="description-header" id="komplainok"></h5>
									<span class="description-text">KOMPLAIN</span>
								</div>
								<!-- /.description-block -->
							</div>
							<!-- /.col -->
							<div class="col-sm-4">
								<div class="description-block">
									<h5 class="description-header" id="injob2"></h5>
									<span class="description-text">In JOB</span>
								</div>
								<!-- /.description-block -->
							</div>
							<!-- /.col -->
						</div>
						<!-- /.row -->
					</div>
				</div>
				<!-- /.widget-user -->
				<div class="card">
					<div class="card-header p-2">
						<ul class="nav nav-pills">
							<li class="nav-item"><a class="nav-link active" href="#activity" data-toggle="tab">Keahlian</a></li>
							<li class="nav-item"><a class="nav-link" href="#timeline" data-toggle="tab">Kepribadian</a></li>
							<li class="nav-item"><a class="nav-link" href="#settings" data-toggle="tab">Profil</a></li>
						</ul>
					</div><!-- /.card-header -->
					<div class="card-body">
						<div class="tab-content">

							<!-- start konten keahlian class="textarea" -->
							<div class="active tab-pane mb-2" id="activity">
								<form action="<?= site_url('mekanikid/editkeahlian') ?>" method="POST">

									<span class="right badge badge-secondary">Keahlian 1</span>
									<textarea autocomplete="off" id="mMetikok" name="mmetik" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; ">
									</textarea>

									<span class="right badge badge-secondary">Keahlian 2</span>
									<textarea autocomplete="off" id="mBebekok" name="mbebek" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 5px;">
									</textarea>

									<span class="right badge badge-secondary">Keahlian 3</span>
									<textarea autocomplete="off" id="mSportok" name="msport" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 5px;">
									</textarea>

									<span class="right badge badge-secondary">keahlian 4</span>
									<textarea autocomplete="off" id="mModifikasiok" name="mmodifikasi" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 5px;">
									</textarea>
									<input autocomplete="off" required id="id_userok" class="form-control " name="id_user" type="text">

									<span class=" right badge badge-secondary p-1 mt-2"> Update : <b><?= date('d-m-Y') ?></b></span>
									<button name="kebKerja" type="submit" class="btn btn-warning w-100 mt-2 mb-3">Simpan Data Keahlian</button>
								</form>
							</div>
							<!-- end konten keahlian -->

							<!-- start konten kepribadian -->
							<div class="tab-pane mb-2" id="timeline">
								<form action="<?= site_url('mekanikid/editpribadi') ?>" method="POST">

									<span class="right badge badge-secondary">Kebiasaan Bekerja</span>
									<textarea autocomplete="off" id="kebKerjaok" name="kebkerja" id="pribadiok" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">
									</textarea>

									<span class="right badge badge-secondary">Dalam Kerjasama</span>
									<textarea autocomplete="off" id="teamKerjaok" name="teamkerja" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 5px;">
									</textarea>

									<span class="right badge badge-secondary">Terhadap Konsumen</span>
									<textarea autocomplete="off" id="konKerjaok" name="konkerja" style="width: 100%; height: 100px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 5px;">
									</textarea>
									<input autocomplete="off" required id="id_userok1" class="form-control " name="id_user" type="text">

									<span class=" right badge badge-secondary p-1 mt-2"> Update : <b><?= date('d-m-Y') ?></b></span>
									<button type="submit" class="btn btn-warning w-100 mt-2">Simpan Data Kepribadian </button>

								</form>

							</div>
							<!-- end konten kepribadian -->

							<!-- start konten profil -->
							<div class="tab-pane" id="settings">
								<form action="<?= site_url('mekanikid/editmekanik') ?>" enctype="multipart/form-data" method="POST">

									<div class="col mb-3 text-center text-secondary ">
										<i class="fas fa-user-check"></i> <strong> Data Personal</strong>
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-id-card"></i>
											</span>
										</div>
										<input autocomplete="off" id="no_ktpok" class="form-control text-uppercase" name="no_ktp" type="text" placeholder="No.Ktp">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-user-circle"></i>
											</span>
										</div>
										<input autocomplete="off" id="itempnama2" class="form-control text-uppercase" name="nama" type="text" placeholder="Nama Lengkap">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-home"></i>
											</span>
										</div>
										<input autocomplete="off" id="alamatok" class="form-control text-uppercase" name="alamat" type="text" placeholder="Alamat Rumah">
									</div>
									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-phone"></i>
											</span>
										</div>
										<input autocomplete="off" id="nohp" class="form-control text-uppercase" name="no_hp" type="text" placeholder="No. Handphone">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-envelope"></i>
											</span>
										</div>
										<input autocomplete="off" id="emailok" class="form-control text-uppercase" name="email" type="text" placeholder="Email">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-at"></i>
											</span>
										</div>
										<input autocomplete="off" id="sosialmedia" class="form-control text-uppercase" name="sosial_media" type="text" placeholder="Akun Sosial Media">
									</div>

									<div class="input-group mt-2 col-sm-12">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-user-circle"></i>
											</span>
										</div>
										<div class="custom-file ">
											<input type="file" name="foto" class="custom-file-input " id="validatedInputGroupCustomFile">
											<label class="custom-file-label " for="validatedInputGroupCustomFile">Pilih Foto Wajah</label>
										</div>
									</div>

									<div class="col mb-3 mt-2 text-center text-secondary ">
										<i class="fas fa-user-check"></i> <strong> Data Posisi Kerja</strong>
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-money-bill-wave"></i>
											</span>
										</div>
										<input autocomplete="off" id="gajiok" class="form-control text-uppercase" name="gaji" type="text" placeholder="Gaji">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-pen-alt"></i>
											</span>
										</div>
										<input autocomplete="off" id="norekok" class="form-control text-uppercase" name="norek" type="text" placeholder="No.Rekening">
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-building"></i>
											</span>
										</div>
										<select id="nama_bankok" value="<?= set_value('nama_bank') ?>" aria-describedby="nambank_idFeedback" class="form-control" name="nama_bank" required>
											<option value="">- Pilih Bank -</option>
											<option value="BSI"> Bank BSI </option>
											<option value="BNI"> Bank BNI </option>
											<option value="BNI"> Bank BRI </option>
											<option value="BTN"> Bank BTN </option>
											<option value="Mandiri"> Bank Mandiri </option>
											<option value="BCA"> Bank BCA </option>
										</select>
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-wrench"></i>
											</span>
										</div>
										<select id="jobok" value="<?= set_value('pekerjaan') ?>" aria-describedby="nambank_idFeedback" class="form-control" name="pekerjaan" required>
											<option value="">- Pilih Jabatan -</option>
											<option value="Kepala Mekanik"> Kepala Mekanik </option>
											<option value="Mekanik"> Mekanik </option>
											<option value="Kasir"> Kasir </option>

										</select>
									</div>

									<div class="input-group mt-2 col-sm-12 ">
										<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="fas fa-user"></i>
											</span>
										</div>
										<select id="kar" value="<?= set_value('karyawan') ?>" aria-describedby="nambank_idFeedback" class="form-control" name="karyawan" required>
											<option value="">- Pilih status -</option>
											<option value="0"> Pemilik Usaha </option>
											<option value="1"> Karyawan </option>

										</select>
									</div>



									<input autocomplete="off" value="" required id="id_userok2" class="form-control " name="id_user" type="hidden">

									<span class=" right badge badge-secondary p-1 mt-2"> Update : <b><?= date('d-m-Y') ?></b></span>
									<button type="submit" class="btn btn-warning w-100 mt-2">Simpan Data profil</button>
								</form>

							</div>
							<!-- end konten profil -->
						</div>

					</div>

				</div>

			</div>
		</div>
	</div>
</div>
<!-- ending modal edit data mekanik -->

<script src="<?= base_url() ?>/assets/dist/js/jquery-2.1.1.js"></script>
<script>
	$(document).ready(function() {
		$(document).on('click', '#addkaryawan', function() {
			var no_ktp = $(this).data('no_ktp');
			var nama = $(this).data('nama');
			var no_hp = $(this).data('no_hp');
			var alamat = $(this).data('alamat');
			var email = $(this).data('email');
			var sosial_media = $(this).data('sosial_media');
			var komplain = $(this).data('komplain');
			var perbaikan = $(this).data('perbaikan');
			var pekerjaan = $(this).data('pekerjaan');
			var gaji = $(this).data('gaji');
			var nama_bank = $(this).data('nama_bank');
			var norek = $(this).data('norek');
			var injob = $(this).data('injob');
			var foto = $(this).data('foto');
			var id_user = $(this).data('id_user');
			var mmetik = $(this).data('mmetik');
			var mbebek = $(this).data('mbebek');
			var msport = $(this).data('msport');
			var mmodifikasi = $(this).data('mmodifikasi');
			var kebkerja = $(this).data('kebkerja');
			var teamkerja = $(this).data('teamkerja');
			var konkerja = $(this).data('konkerja');
			var karyawan = $(this).data('karyawan');


			$('#no_ktpok').val(no_ktp);
			$('#itempnama').text(nama);
			$('#itempnama2').val(nama);
			$('#nohp').val(no_hp);
			$('#alamatok').val(alamat);
			$('#emailok').val(email);
			$('#sosialmedia').val(sosial_media);
			$('#komplainok').text(komplain);
			$('#perbaikanok').text(perbaikan);
			$('#job').text(pekerjaan);
			$('#jobok').val(pekerjaan);
			$('#gajiok').val(gaji);
			$('#nama_bankok').val(nama_bank);
			$('#norekok').val(norek);
			$('#mMetikok').val(mmetik);
			$('#mBebekok').val(mbebek);
			$('#mSportok').val(msport);
			$('#mModifikasiok').val(mmodifikasi);
			$('#kebKerjaok').val(kebkerja);
			$('#teamKerjaok').val(teamkerja);
			$('#konKerjaok').val(konkerja);
			$('#injobok').val(injob);
			$('#kar').val(karyawan);

			$('#injob2').text(injob);
			$('#id_userok').val(id_user);
			$('#id_userok1').val(id_user);
			$('#id_userok2').val(id_user);


			$('#itempfoto').attr("src", "upload/foto/karyawan/" + foto);





		})
	})
</script>