Compare commits
2 Commits
fb29e251d9
...
3719cbff71
| Author | SHA1 | Date | |
|---|---|---|---|
| 3719cbff71 | |||
| 9b8e3301cc |
@@ -1,628 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Template Name: Metronic - Bootstrap 4 HTML, React, Angular 9 & VueJS Admin Dashboard Theme
|
||||
Author: KeenThemes
|
||||
Website: http://www.keenthemes.com/
|
||||
Contact: support@keenthemes.com
|
||||
Follow: www.twitter.com/keenthemes
|
||||
Dribbble: www.dribbble.com/keenthemes
|
||||
Like: www.facebook.com/keenthemes
|
||||
Purchase: https://1.envato.market/EA4JP
|
||||
Renew Support: https://1.envato.market/EA4JP
|
||||
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
||||
-->
|
||||
<html lang="en">
|
||||
<!--begin::Head-->
|
||||
<head>
|
||||
<base href="../" />
|
||||
<meta charset="utf-8" />
|
||||
<title>Company Portal | { title }</title>
|
||||
<meta name="description" content="Company Portal" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
<!--begin::Fonts-->
|
||||
<link rel="stylesheet" href="assets/css/googlefont/poppins.css" />
|
||||
<!--end::Fonts-->
|
||||
<!--begin::Page Custom Styles(used by this page)-->
|
||||
<link
|
||||
href="assets/css/pages/login/login-1.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Page Custom Styles-->
|
||||
<!--begin::Global Theme Styles(used by all pages)-->
|
||||
<link
|
||||
href="assets/plugins/global/plugins.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/plugins/custom/prismjs/prismjs.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link href="assets/css/style.bundle.css" rel="stylesheet" type="text/css" />
|
||||
<!--end::Global Theme Styles-->
|
||||
<!--begin::Layout Themes(used by all pages)-->
|
||||
<link
|
||||
href="assets/css/themes/layout/header/base/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/header/menu/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/brand/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/aside/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Layout Themes-->
|
||||
<link
|
||||
rel="shortcut icon"
|
||||
href="asset-corporate-portal/media/logo/logo-small.jpg"
|
||||
/>
|
||||
<!--end::Layout Themes SAS-->
|
||||
<link
|
||||
href="asset-corporate-portal/css/sas.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.18/css/bootstrap-select.min.css"
|
||||
/>
|
||||
|
||||
<style>
|
||||
.filter-option-inner-inner {
|
||||
margin-top: 1.2vh;
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
.bootstrap-select > .dropdown-toggle.bs-placeholder.btn {
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select.btn-group .dropdown-menu {
|
||||
min-width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
position: sticky;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
transform: translate3d(0px, 0px, 0px) !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<!--end::Head-->
|
||||
<!--begin::Body-->
|
||||
<body
|
||||
id="kt_body"
|
||||
class="bg-white header-fixed header-mobile-fixed subheader-enabled subheader-fixed subheader-mobile-fixed aside-enabled aside-fixed aside-minimize-hoverable page-loading"
|
||||
>
|
||||
<style>
|
||||
.left {
|
||||
width: 85%;
|
||||
float: left;
|
||||
height: 100%;
|
||||
z-index: 1010101010;
|
||||
}
|
||||
.right {
|
||||
width: 15%;
|
||||
float: right;
|
||||
height: 100%;
|
||||
z-index: 1010101010;
|
||||
}
|
||||
|
||||
.input-container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.input-field:not(:placeholder-shown) + .input-label {
|
||||
top: 50%;
|
||||
font-size: 12px;
|
||||
color: var(--secondary-hover);
|
||||
}
|
||||
</style>
|
||||
<!--begin::Main-->
|
||||
|
||||
<div class="wrappery p-5 h-100">
|
||||
<div class="left px-2">
|
||||
<!--begin::Row 1-->
|
||||
<div class="form-row">
|
||||
<div class="col-2">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Sapaan</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="mr">Tn</option>
|
||||
<option value="mrs">Ny</option>
|
||||
<option value="ms">Nn</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Imbuhan Awal</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Nama
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Imbuhan Akhir</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 2"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 1-->
|
||||
<!--begin::Row 2-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-6">
|
||||
<!-- begin::Jenis Kelamin -->
|
||||
<div class="form-row">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Jenis Kelamin</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Jenis Kelamin</option>
|
||||
<option value="mr">Perempuan</option>
|
||||
<option value="mrs">Laki-Laki</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Jenis Kelamin -->
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<!-- begin::Tanggal Lahir -->
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Tanggal Lahir</label
|
||||
>
|
||||
<div class="input-group date bg-field border-0 rounded-lg">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
readonly
|
||||
placeholder="Pilih Tanggal"
|
||||
id="datepicker"
|
||||
/>
|
||||
<div class="input-group-prepend">
|
||||
<span
|
||||
class="input-group-text bg-field border-0 rounded-lg"
|
||||
id="calendar-icon"
|
||||
>
|
||||
<span
|
||||
class="iconify text-grey"
|
||||
data-icon="heroicons-solid:calendar"
|
||||
style="font-size: 20px"
|
||||
></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Tanggal Lahir -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 2-->
|
||||
<!--begin::Row 3-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-6">
|
||||
<!-- begin::Umur -->
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Umur</label
|
||||
>
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Tahun</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col mt-8">
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Bulan</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col mt-8">
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Hari</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Umur -->
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<!-- begin::Darah -->
|
||||
<div class="form-row">
|
||||
<!-- begin::Golongan Darah -->
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Golongan Darah</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Golongan Darah</option>
|
||||
<option value="">O</option>
|
||||
<option value="">A</option>
|
||||
<option value="">B</option>
|
||||
<option value="">B</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Golongan Darah -->
|
||||
<!-- begin::Rhesus -->
|
||||
<div class="col">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Rhesus</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="5"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Rhesus</option>
|
||||
<option value="">-</option>
|
||||
<option value="">+</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Rhesus -->
|
||||
</div>
|
||||
<!-- end::Darah -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 3-->
|
||||
<!--begin::Row 4-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Pekerjaan-->
|
||||
<div class="col-6">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Pekerjaan</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Pekerjaan"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Pekerjaan-->
|
||||
<!--begin::Departemen-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Departemen</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Departemen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Departemen-->
|
||||
</div>
|
||||
<!--end::Row 4-->
|
||||
<!--begin::Row 5-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Posisi-->
|
||||
<div class="col-6">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Posisi</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Posisi"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Posisi-->
|
||||
<!--Begin::Pendidikan Terakhir-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Pendidikan Terakhir</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="5"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Pendidikan Terakhir</option>
|
||||
<option value="mr">SMA/SLTA/Sederajat</option>
|
||||
<option value="mrs">D3</option>
|
||||
<option value="ms">Sarjana</option>
|
||||
<option value="ms">Magister</option>
|
||||
<option value="ms">Doktor</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Pendidikan Terakhir-->
|
||||
</div>
|
||||
<!--end::Row 5-->
|
||||
<!--begin::Row 6-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Kewarganegaraan-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Kewarganegaraan</label
|
||||
>
|
||||
<div class="form-control border-0 h-auto p-0 mt-3">
|
||||
<div class="form-group">
|
||||
<div
|
||||
class="justify-content-between"
|
||||
style="display: flex; gap: 20px"
|
||||
>
|
||||
<label style="display: flex; align-items: center; gap: 5px">
|
||||
<input type="radio" name="nationality" value="wni" />
|
||||
<p style="margin: 0">WNI</p>
|
||||
</label>
|
||||
<label style="display: flex; align-items: center; gap: 5px">
|
||||
<input type="radio" name="nationality" value="wna" />
|
||||
<p style="margin: 0">WNA</p>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Kewarganegaraan-->
|
||||
<!--Begin::Etnis-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Etnis</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Etnis</option>
|
||||
<option value="">Jawa</option>
|
||||
<option value="">Sunda</option>
|
||||
<option value="">Batak</option>
|
||||
<option value="">Betawi</option>
|
||||
<option value="">Dayak</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Etnis-->
|
||||
</div>
|
||||
<!--end::Row 6-->
|
||||
<!--begin::Row 7-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Identitas-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Identitas</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
data-size="4"
|
||||
>
|
||||
<option value="default">Pilih Identitas</option>
|
||||
<option value="">KTP</option>
|
||||
<option value="">SIM</option>
|
||||
<option value="">Paspor</option>
|
||||
<option value="">Kartu Pelajar</option>
|
||||
<option value="">Surat Keterangan</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Identitas-->
|
||||
<!--Begin::Nomor Identitas-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Nomor Identitas</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Nomor Identitas"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Identitas-->
|
||||
</div>
|
||||
<!--end::Row 7-->
|
||||
<!--begin::Row 8-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Nomor Hp-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Nomor HP</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Nomor HP"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Hp-->
|
||||
<!--Begin::Email-->
|
||||
<div class="col-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Email</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Email"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Email-->
|
||||
</div>
|
||||
<!--end::Row 8-->
|
||||
</div>
|
||||
<div class="right px-2">
|
||||
<!-- person.png start -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<img
|
||||
src="asset-corporate-portal/media/person/person.png"
|
||||
style="display: block; width: 13vw"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-5">
|
||||
<div class="col">
|
||||
<button
|
||||
class="btn bg-primary-transparent text-center text-primary"
|
||||
style="width: 13vw; font-weight: 600"
|
||||
>
|
||||
Update Foto
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- person.png end -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--end::Main-->
|
||||
<script src="asset-corporate-portal/js/ktappsetting.js"></script>
|
||||
<!-- iconify -->
|
||||
<script src="assets/js/iconify/iconify.min.js"></script>
|
||||
<!--end::Global Config-->
|
||||
<!--begin::Global Theme Bundle(used by all pages)-->
|
||||
<script src="assets/plugins/global/plugins.bundle.js"></script>
|
||||
<script src="assets/plugins/custom/prismjs/prismjs.bundle.js"></script>
|
||||
<script src="assets/js/scripts.bundle.js"></script>
|
||||
<script src="assets/js/pages/crud/forms/widgets/bootstrap-datepicker.js"></script>
|
||||
|
||||
<script>
|
||||
function ShowLoading() {
|
||||
document
|
||||
.getElementById("demo")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("a")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("demo")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("a")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
// $(".selectpicker").selectpicker();
|
||||
$(".selectpicker").selectpicker({
|
||||
dropupAuto: false,
|
||||
});
|
||||
$("#datepicker").datepicker({
|
||||
format: "dd/mm/yyyy",
|
||||
});
|
||||
$("#calendar-icon").click(function () {
|
||||
$("#datepicker").datepicker("show");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<!--end::Global Theme Bundle-->
|
||||
|
||||
<!--end::Page Scripts-->
|
||||
</body>
|
||||
<!--end::Body-->
|
||||
</html>
|
||||
631
assets/mcu/patient.html
Normal file
631
assets/mcu/patient.html
Normal file
@@ -0,0 +1,631 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Template Name: Metronic - Bootstrap 4 HTML, React, Angular 9 & VueJS Admin Dashboard Theme
|
||||
Author: KeenThemes
|
||||
Website: http://www.keenthemes.com/
|
||||
Contact: support@keenthemes.com
|
||||
Follow: www.twitter.com/keenthemes
|
||||
Dribbble: www.dribbble.com/keenthemes
|
||||
Like: www.facebook.com/keenthemes
|
||||
Purchase: https://1.envato.market/EA4JP
|
||||
Renew Support: https://1.envato.market/EA4JP
|
||||
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
||||
-->
|
||||
<html lang="en">
|
||||
<!--begin::Head-->
|
||||
<head>
|
||||
<base href="../" />
|
||||
<meta charset="utf-8" />
|
||||
<title>Company Portal | { title }</title>
|
||||
<meta name="description" content="Company Portal" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
<!--begin::Fonts-->
|
||||
<link rel="stylesheet" href="assets/css/googlefont/poppins.css" />
|
||||
<!--end::Fonts-->
|
||||
<!--begin::Page Custom Styles(used by this page)-->
|
||||
<link
|
||||
href="assets/css/pages/login/login-1.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Page Custom Styles-->
|
||||
<!--begin::Global Theme Styles(used by all pages)-->
|
||||
<link
|
||||
href="assets/plugins/global/plugins.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/plugins/custom/prismjs/prismjs.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link href="assets/css/style.bundle.css" rel="stylesheet" type="text/css" />
|
||||
<!--end::Global Theme Styles-->
|
||||
<!--begin::Layout Themes(used by all pages)-->
|
||||
<link
|
||||
href="assets/css/themes/layout/header/base/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/header/menu/light.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/brand/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link
|
||||
href="assets/css/themes/layout/aside/dark.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<!--end::Layout Themes-->
|
||||
<link
|
||||
rel="shortcut icon"
|
||||
href="asset-corporate-portal/media/logo/logo-small.jpg"
|
||||
/>
|
||||
<!--end::Layout Themes SAS-->
|
||||
<link
|
||||
href="asset-corporate-portal/css/sas.bundle.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.18/css/bootstrap-select.min.css"
|
||||
/>
|
||||
|
||||
<style>
|
||||
.filter-option-inner-inner {
|
||||
margin-top: 1.2vh;
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
.bootstrap-select > .dropdown-toggle.bs-placeholder.btn {
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select.btn-group .dropdown-menu {
|
||||
min-width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
position: sticky;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
transform: translate3d(0px, 0px, 0px) !important;
|
||||
}
|
||||
|
||||
/* mik */
|
||||
.input-container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.input-field:not(:placeholder-shown) + .input-label {
|
||||
top: 50%;
|
||||
font-size: 12px;
|
||||
color: var(--secondary-hover);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<!--end::Head-->
|
||||
<!--begin::Body-->
|
||||
<body
|
||||
id="kt_body"
|
||||
class="bg-white header-fixed header-mobile-fixed subheader-enabled subheader-fixed subheader-mobile-fixed aside-enabled aside-fixed aside-minimize-hoverable page-loading"
|
||||
>
|
||||
<style></style>
|
||||
<!--begin::Main-->
|
||||
|
||||
<div class="wrapperx p-5 h-100">
|
||||
<div class="row">
|
||||
<div class="col-lg-10">
|
||||
<!--begin::Row 1-->
|
||||
<div class="form-row">
|
||||
<div class="col-md-6 col-lg-2">
|
||||
<label
|
||||
for="input1"
|
||||
class="font-weight-bolder"
|
||||
style="font-family: Poppins"
|
||||
>Sapaan</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="mr">Tn</option>
|
||||
<option value="mrs">Ny</option>
|
||||
<option value="ms">Nn</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-3">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Imbuhan Awal</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-5">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Nama
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-2">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Imbuhan Akhir</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Imbuhan Awal 2"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 1-->
|
||||
<!--begin::Row 2-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-md-6">
|
||||
<!-- begin::Jenis Kelamin -->
|
||||
<div class="form-row">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Jenis Kelamin</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Jenis Kelamin</option>
|
||||
<option value="mr">Perempuan</option>
|
||||
<option value="mrs">Laki-Laki</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Jenis Kelamin -->
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<!-- begin::Tanggal Lahir -->
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Tanggal Lahir</label
|
||||
>
|
||||
<div class="input-group date bg-field border-0 rounded-lg">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
readonly
|
||||
placeholder="Pilih Tanggal"
|
||||
id="datepicker"
|
||||
/>
|
||||
<div class="input-group-prepend">
|
||||
<span
|
||||
class="input-group-text bg-field border-0 rounded-lg"
|
||||
id="calendar-icon"
|
||||
>
|
||||
<span
|
||||
class="iconify text-grey"
|
||||
data-icon="heroicons-solid:calendar"
|
||||
style="font-size: 20px"
|
||||
></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Tanggal Lahir -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 2-->
|
||||
<!--begin::Row 3-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-lg-6">
|
||||
<!-- begin::Umur -->
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Umur</label
|
||||
>
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Tahun</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col mt-8">
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Bulan</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col mt-8">
|
||||
<div class="input-container">
|
||||
<input
|
||||
type="text"
|
||||
id="myInput"
|
||||
class="input-field form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
/>
|
||||
<label for="myInput" class="input-label">Hari</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Umur -->
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<!-- begin::Darah -->
|
||||
<div class="form-row">
|
||||
<!-- begin::Golongan Darah -->
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Golongan Darah</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Golongan Darah</option>
|
||||
<option value="">O</option>
|
||||
<option value="">A</option>
|
||||
<option value="">B</option>
|
||||
<option value="">AB</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Golongan Darah -->
|
||||
<!-- begin::Rhesus -->
|
||||
<div class="col">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Rhesus</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="5"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Rhesus</option>
|
||||
<option value="">-</option>
|
||||
<option value="">+</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end::Rhesus -->
|
||||
</div>
|
||||
<!-- end::Darah -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 3-->
|
||||
<!--begin::Row 4-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Pekerjaan-->
|
||||
<div class="col-md-6">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Pekerjaan</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Pekerjaan"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Pekerjaan-->
|
||||
<!--begin::Departemen-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Departemen</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Departemen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Departemen-->
|
||||
</div>
|
||||
<!--end::Row 4-->
|
||||
<!--begin::Row 5-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Posisi-->
|
||||
<div class="col-md-6">
|
||||
<label for="input1" style="font-family: Poppins; font-weight: 600"
|
||||
>Posisi</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Posisi"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Posisi-->
|
||||
<!--Begin::Pendidikan Terakhir-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Pendidikan Terakhir</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="5"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Pendidikan Terakhir</option>
|
||||
<option value="mr">SMA/SLTA/Sederajat</option>
|
||||
<option value="mrs">D3</option>
|
||||
<option value="ms">Sarjana</option>
|
||||
<option value="ms">Magister</option>
|
||||
<option value="ms">Doktor</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Pendidikan Terakhir-->
|
||||
</div>
|
||||
<!--end::Row 5-->
|
||||
<!--begin::Row 6-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Kewarganegaraan-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Kewarganegaraan</label
|
||||
>
|
||||
<div class="form-control border-0 h-auto p-0 mt-3">
|
||||
<div class="form-group">
|
||||
<div
|
||||
class="justify-content-between"
|
||||
style="display: flex; gap: 20px"
|
||||
>
|
||||
<label
|
||||
style="display: flex; align-items: center; gap: 5px"
|
||||
>
|
||||
<input type="radio" name="nationality" value="wni" />
|
||||
<p style="margin: 0">WNI</p>
|
||||
</label>
|
||||
<label
|
||||
style="display: flex; align-items: center; gap: 5px"
|
||||
>
|
||||
<input type="radio" name="nationality" value="wna" />
|
||||
<p style="margin: 0">WNA</p>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Kewarganegaraan-->
|
||||
<!--Begin::Etnis-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<label style="font-family: Poppins; font-weight: 600"
|
||||
>Etnis</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-size="4"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
>
|
||||
<option value="default">Pilih Etnis</option>
|
||||
<option value="">Jawa</option>
|
||||
<option value="">Sunda</option>
|
||||
<option value="">Batak</option>
|
||||
<option value="">Betawi</option>
|
||||
<option value="">Dayak</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Etnis-->
|
||||
</div>
|
||||
<!--end::Row 6-->
|
||||
<!--begin::Row 7-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Identitas-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Identitas</label
|
||||
>
|
||||
<select
|
||||
class="selectpicker form-control"
|
||||
id="select1"
|
||||
data-live-search="true"
|
||||
data-style="bg-field btn-lg rounded-lg btn-custom-selectpicker"
|
||||
data-size="4"
|
||||
>
|
||||
<option value="default">Pilih Identitas</option>
|
||||
<option value="">KTP</option>
|
||||
<option value="">SIM</option>
|
||||
<option value="">Paspor</option>
|
||||
<option value="">Kartu Pelajar</option>
|
||||
<option value="">Surat Keterangan</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Identitas-->
|
||||
<!--Begin::Nomor Identitas-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Nomor Identitas</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Nomor Identitas"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Identitas-->
|
||||
</div>
|
||||
<!--end::Row 7-->
|
||||
<!--begin::Row 8-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Nomor Hp-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Nomor HP</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Nomor HP"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Hp-->
|
||||
<!--Begin::Email-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600"
|
||||
>Email</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="form-control bg-field border-0 h-auto py-6 px-6 rounded-lg"
|
||||
placeholder="Email"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Email-->
|
||||
</div>
|
||||
<!--end::Row 8-->
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<!-- person.png start -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<img
|
||||
src="asset-corporate-portal/media/person/person.png"
|
||||
style="display: block; width: 13vw"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-5">
|
||||
<div class="col">
|
||||
<button
|
||||
class="btn bg-primary-transparent text-center text-primary"
|
||||
style="width: 13vw; font-weight: 600"
|
||||
>
|
||||
Update Foto
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- person.png end -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--end::Main-->
|
||||
<script src="asset-corporate-portal/js/ktappsetting.js"></script>
|
||||
<!-- iconify -->
|
||||
<script src="assets/js/iconify/iconify.min.js"></script>
|
||||
<!--end::Global Config-->
|
||||
<!--begin::Global Theme Bundle(used by all pages)-->
|
||||
<script src="assets/plugins/global/plugins.bundle.js"></script>
|
||||
<script src="assets/plugins/custom/prismjs/prismjs.bundle.js"></script>
|
||||
<script src="assets/js/scripts.bundle.js"></script>
|
||||
<script src="assets/js/pages/crud/forms/widgets/bootstrap-datepicker.js"></script>
|
||||
|
||||
<script>
|
||||
function ShowLoading() {
|
||||
document
|
||||
.getElementById("demo")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("a")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("demo")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("a")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
// $(".selectpicker").selectpicker();
|
||||
$(".selectpicker").selectpicker({
|
||||
dropupAuto: false,
|
||||
});
|
||||
$("#datepicker").datepicker({
|
||||
format: "dd/mm/yyyy",
|
||||
});
|
||||
$("#calendar-icon").click(function () {
|
||||
$("#datepicker").datepicker("show");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<!--end::Global Theme Bundle-->
|
||||
|
||||
<!--end::Page Scripts-->
|
||||
</body>
|
||||
<!--end::Body-->
|
||||
</html>
|
||||
Reference in New Issue
Block a user