565 lines
40 KiB
PHP
565 lines
40 KiB
PHP
|
|
<div class="row" >
|
|
<!--end col-->
|
|
<div class="col-xxl-12">
|
|
<div class="card mt-xxl-n5">
|
|
<div class="card-header">
|
|
<ul class="nav nav-tabs-custom rounded card-header-tabs border-bottom-0" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" data-bs-toggle="tab" href="#personalDetails" role="tab">
|
|
<i class="fas fa-home"></i> Identitas Lokasi
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-bs-toggle="tab" href="#changePassword" role="tab">
|
|
<i class="far fa-user"></i> Data Verifikator
|
|
</a>
|
|
</li>
|
|
{{-- <li class="nav-item">
|
|
<a class="nav-link" data-bs-toggle="tab" href="#experience" role="tab">
|
|
<i class="far fa-envelope"></i> Experience
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-bs-toggle="tab" href="#privacy" role="tab">
|
|
<i class="far fa-envelope"></i> Privacy Policy
|
|
</a>
|
|
</li> --}}
|
|
</ul>
|
|
</div>
|
|
<div class="card-body p-4">
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="personalDetails" role="tabpanel">
|
|
<form action="javascript:void(0);">
|
|
<div class="row">
|
|
<div class="mb-3 border-bottom pb-1">
|
|
<h5 class="card-title">Informasi Lokasi</h5>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="provinsi" class="form-label">Provinsi</label>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<select class="form-select form-select-sm mb-3" data-choices
|
|
data-choices-search-false name="provinsi" id="provinsi"
|
|
style="padding: 10px" onchange="updateKota()">
|
|
<option value="">-- Pilih Provinsi --</option>
|
|
<option value="aceh">Aceh</option>
|
|
<option value="sumut">Sumatera Utara</option>
|
|
<option value="sumbar">Sumatera Barat</option>
|
|
<option value="riau">Riau</option>
|
|
<option value="kepri">Kepulauan Riau</option>
|
|
<option value="jambi">Jambi</option>
|
|
<option value="sumsel">Sumatera Selatan</option>
|
|
<option value="babel">Bangka Belitung</option>
|
|
<option value="bengkulu">Bengkulu</option>
|
|
<option value="lampung">Lampung</option>
|
|
<option value="jakarta">DKI Jakarta</option>
|
|
<option value="banten">Banten</option>
|
|
<option value="jabar">Jawa Barat</option>
|
|
<option value="jateng">Jawa Tengah</option>
|
|
<option value="yogyakarta">DI Yogyakarta</option>
|
|
<option value="jatim">Jawa Timur</option>
|
|
<option value="kalbar">Kalimantan Barat</option>
|
|
<option value="kalteng">Kalimantan Tengah</option>
|
|
<option value="kalsel">Kalimantan Selatan</option>
|
|
<option value="kaltim">Kalimantan Timur</option>
|
|
<option value="kalut">Kalimantan Utara</option>
|
|
<option value="sulut">Sulawesi Utara</option>
|
|
<option value="gorontalo">Gorontalo</option>
|
|
<option value="sulteng">Sulawesi Tengah</option>
|
|
<option value="sulbar">Sulawesi Barat</option>
|
|
<option value="sulsel">Sulawesi Selatan</option>
|
|
<option value="sultenggara">Sulawesi Tenggara</option>
|
|
<option value="bali">Bali</option>
|
|
<option value="ntb">Nusa Tenggara Barat</option>
|
|
<option value="ntt">Nusa Tenggara Timur</option>
|
|
<option value="maluku">Maluku</option>
|
|
<option value="malut">Maluku Utara</option>
|
|
<option value="papua">Papua</option>
|
|
<option value="papua_tengah">Papua Tengah</option>
|
|
<option value="papua_pegunungan">Papua Pegunungan</option>
|
|
<option value="papua_selatan">Papua Selatan</option>
|
|
<option value="papua_barat">Papua Barat</option>
|
|
<option value="papua_barat_daya">Papua Barat Daya</option>
|
|
</select>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="kota" class="form-label">Kota</label>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<select class="form-select form-select-sm mb-3" data-choices
|
|
data-choices-search-false name="kota" id="kota"
|
|
style="padding: 10px" onchange="updateKecamatan()">
|
|
<option value="">-- Pilih Kota --</option>
|
|
</select>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="kecamatan" class="form-label">Kecamatan</label>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<select class="form-select form-select-sm mb-3" data-choices
|
|
data-choices-search-false name="kecamatan" id="kecamatan"
|
|
style="padding: 10px" onchange="updateKelurahan()">
|
|
<option value="">-- Pilih Kecamatan --</option>
|
|
</select>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="kelurahan" class="form-label">Kelurahan</label>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<select class="form-control" data-choices data-choices-search-false
|
|
name="kelurahan" id="kelurahan">
|
|
<option value="">-- Pilih Kelurahan --</option>
|
|
</select>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3 pb-2">
|
|
<label for="exampleFormControlTextarea" class="form-label">Alamat</label>
|
|
<textarea class="form-control" id="exampleFormControlTextarea" placeholder="" rows="6"></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Website</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="" rows="2">
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="mb-6">
|
|
<label for="emailInput" class="form-label">Email</label>
|
|
<input type="email" class="form-control" id="emailInput"
|
|
placeholder="" value="" rows="2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
|
|
<div class="mt-4 mb-3 border-bottom pb-1">
|
|
<h5 class="card-title">Nara Hubung di Lokasi ProKlim</h5>
|
|
</div>
|
|
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="firstname" class="form-label">Nama</label>
|
|
<input type="text" class="form-control" id="firstname" placeholder=""
|
|
value="">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="institusi" class="form-label">Institusi</label>
|
|
<input type="text" class="form-control" id="institusi" placeholder=""
|
|
value="">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="mb-3">
|
|
<label for="jabatan" class="form-label">Jabatan / Posisi dalam
|
|
Proklim</label>
|
|
<input type="text" class="form-control" id="jabatan" placeholder=""
|
|
value="">
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3 pb-2">
|
|
<label for="exampleFormControlTextarea" class="form-label">Alamat</label>
|
|
<textarea class="form-control" id="exampleFormControlTextarea" placeholder="" rows="6"></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Telepon/HP</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="" rows="2">
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="mb-6">
|
|
<label for="emailInput" class="form-label">Email</label>
|
|
<input type="email" class="form-control" id="emailInput"
|
|
placeholder="" value="" rows="2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
|
|
<!--end col-->
|
|
<div class="col-lg-12" style="padding: 100 px 0 0 0">
|
|
<div class="hstack gap-2 justify-content-end">
|
|
<button type="submit" class="btn btn-primary">Updates</button>
|
|
<button type="button" class="btn btn-soft-success">Cancel</button>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</form>
|
|
</div>
|
|
<!--end tab-pane-->
|
|
|
|
<div class="tab-pane" id="changePassword" role="tabpanel">
|
|
<form action="javascript:void(0);">
|
|
<div class="row">
|
|
<div class="mb-3 border-bottom pb-1">
|
|
<h5 class="card-title">Data Ketua TIM</h5>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Nomor Registrasi</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Nama</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Instansi</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Telpon / HP</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<label for="phonenumberInput" class="form-label">Email</label>
|
|
<input type="text" class="form-control" id="phonenumberInput"
|
|
placeholder="" value="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="mb-3 border-bottom pb-1">
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="card" id="tasksList">
|
|
<div class="card-header border-0">
|
|
<div class="d-flex align-items-center">
|
|
<h5 class="card-title mb-0 flex-grow-1">Data Verifikator</h5>
|
|
<div class="flex-shrink-0">
|
|
<div class="d-flex flex-wrap gap-2">
|
|
<button class="btn btn-danger add-btn" data-bs-toggle="modal"
|
|
data-bs-target="#showModal"><i
|
|
class="ri-add-line align-bottom me-1"></i>Tambah</button>
|
|
<button class="btn btn-secondary" id="remove-actions"
|
|
onClick="deleteMultiple()"><i
|
|
class="ri-delete-bin-2-line"></i></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body border border-dashed border-end-0 border-start-0">
|
|
<form>
|
|
<div class="row g-3">
|
|
<div class="col-xxl-5 col-sm-12">
|
|
<div class="search-box">
|
|
<input type="text"
|
|
class="form-control search bg-light border-light"
|
|
placeholder="Search for tasks or something...">
|
|
<i class="ri-search-line search-icon"></i>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
|
|
<div class="col-xxl-3 col-sm-4">
|
|
<input type="text"
|
|
class="form-control bg-light border-light"
|
|
id="demo-datepicker" data-provider="flatpickr"
|
|
data-date-format="d M, Y" data-range-date="true"
|
|
placeholder="Select date range">
|
|
</div>
|
|
<!--end col-->
|
|
|
|
<div class="col-xxl-3 col-sm-4">
|
|
<div class="input-light">
|
|
<select class="form-control" data-choices
|
|
data-choices-search-false name="choices-single-default"
|
|
id="idStatus">
|
|
<option value="">Status</option>
|
|
<option value="all" selected>All</option>
|
|
<option value="New">New</option>
|
|
<option value="Pending">Pending</option>
|
|
<option value="Inprogress">Inprogress</option>
|
|
<option value="Completed">Completed</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-xxl-1 col-sm-4">
|
|
<button type="button" class="btn btn-primary w-100"
|
|
onclick="SearchData();"> <i
|
|
class="ri-equalizer-fill me-1 align-bottom"></i>
|
|
Filters
|
|
</button>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</form>
|
|
</div>
|
|
<!--end card-body-->
|
|
<div class="card-body">
|
|
<div class="table-responsive table-card mb-4">
|
|
<table class="table align-middle table-nowrap mb-0" id="tasksTable">
|
|
<thead class="table-light text-muted">
|
|
<tr>
|
|
<th scope="col" style="width: 40px;">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox"
|
|
id="checkAll" value="option">
|
|
</div>
|
|
</th>
|
|
<th class="sort" data-sort="id">ID</th>
|
|
<th class="sort" data-sort="tasks_name">Nama</th>
|
|
<th class="sort" data-sort="client_name">Instansi</th>
|
|
<th class="sort" data-sort="assignedto">Telpon/HP</th>
|
|
<th class="sort" data-sort="due_date">Email</th>
|
|
<th class="sort" data-sort="status">Status</th>
|
|
<th class="sort" data-sort="priority">#</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="list form-check-all">
|
|
<tr>
|
|
<th scope="row">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox"
|
|
name="chk_child" value="option1">
|
|
</div>
|
|
</th>
|
|
<td class="id"><a href="apps-tasks-details.html"
|
|
class="fw-medium link-primary">#VLZ501</a></td>
|
|
<td>
|
|
<div class="d-flex">
|
|
<div class="flex-grow-1 tasks_name">Admin</div>
|
|
</div>
|
|
</td>
|
|
<td class="client_name">Dinas Lingkungan Hidup</td>
|
|
<td class="client_name">089526433447</td>
|
|
<td class="due_date">dinaslh123@gmail.com</td>
|
|
<td class="status"><span
|
|
class="badge badge-soft-secondary text-uppercase">Anggota
|
|
Verifikator</span></td>
|
|
<td>
|
|
<div class="d-flex">
|
|
|
|
<div class="flex-shrink-0 ms-4">
|
|
<ul class="list-inline tasks-list-menu mb-0">
|
|
<li class="list-inline-item"><a
|
|
href="apps-tasks-details.html"><i
|
|
class="ri-eye-fill align-bottom me-2 text-muted"></i></a>
|
|
</li>
|
|
<li class="list-inline-item"><a
|
|
class="edit-item-btn"
|
|
href="#showModal"
|
|
data-bs-toggle="modal"><i
|
|
class="ri-pencil-fill align-bottom me-2 text-muted"></i></a>
|
|
</li>
|
|
<li class="list-inline-item">
|
|
<a class="remove-item-btn"
|
|
data-bs-toggle="modal"
|
|
href="#deleteOrder">
|
|
<i
|
|
class="ri-delete-bin-fill align-bottom me-2 text-muted"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</td>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<!--end table-->
|
|
<div class="noresult" style="display: none">
|
|
<div class="text-center">
|
|
<lord-icon src="https://cdn.lordicon.com/msoeawqm.json"
|
|
trigger="loop" colors="primary:#121331,secondary:#08a88a"
|
|
style="width:75px;height:75px"></lord-icon>
|
|
<h5 class="mt-2">Sorry! No Result Found</h5>
|
|
<p class="text-muted mb-0">We've searched more than 200k+ tasks We
|
|
did not find any tasks for you search.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12" style="padding: 100 px 0 0 0">
|
|
<div class="hstack gap-2 justify-content-end">
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end card-body-->
|
|
</div>
|
|
<!--end card-->
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
|
|
<div class="modal fade flip" id="deleteOrder" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-body p-5 text-center">
|
|
<lord-icon src="https://cdn.lordicon.com/gsqxdxog.json" trigger="loop"
|
|
colors="primary:#405189,secondary:#f06548"
|
|
style="width:90px;height:90px"></lord-icon>
|
|
<div class="mt-4 text-center">
|
|
<h4>You are about to delete a task ?</h4>
|
|
<p class="text-muted fs-14 mb-4">Deleting your task will remove all of
|
|
your information from our database.</p>
|
|
<div class="hstack gap-2 justify-content-center remove">
|
|
<button
|
|
class="btn btn-link btn-ghost-success fw-medium text-decoration-none"
|
|
id="deleteRecord-close" data-bs-dismiss="modal"><i
|
|
class="ri-close-line me-1 align-middle"></i> Close</button>
|
|
<button class="btn btn-danger" id="delete-record">Yes, Delete It</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end delete modal -->
|
|
|
|
<div class="modal fade zoomIn" id="showModal" tabindex="-1" aria-labelledby="exampleModalLabel"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content border-0">
|
|
<div class="modal-header p-3 bg-soft-info">
|
|
<h5 class="modal-title" id="exampleModalLabel">Tambah</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"
|
|
aria-label="Close" id="close-modal"></button>
|
|
</div>
|
|
<form class="tablelist-form" autocomplete="off">
|
|
<div class="modal-body">
|
|
<input type="hidden" id="tasksId">
|
|
<div class="row g-3">
|
|
<div class="col-lg-12">
|
|
|
|
<label for="verifikator2" class="input-group">Pilih
|
|
Verifikator</label>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<select class="form-select form-select-sm mb-3" data-choices
|
|
data-choices-search-false name="verifikator2"
|
|
id="verifikator2" style="padding: 10px">
|
|
<option value="">-- Pilih disini --</option>
|
|
<option value="aceh">Anggota Verifikator</option>
|
|
<option value="sumut">Perwakilan DLH/K Provinsi</option>
|
|
<option value="sumbar">Perwakilan DLH/K Provinsi Kabupaten
|
|
/ Kota</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
<div class="col-lg-12">
|
|
<label for="projectName-field" class="form-label">Nama</label>
|
|
<input type="text" id="projectName-field" class="form-control"
|
|
placeholder="Project name" required />
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-12">
|
|
<div>
|
|
<label for="tasksTitle-field" class="form-label">Instansi</label>
|
|
<input type="text" id="tasksTitle-field" class="form-control"
|
|
placeholder="Title" required />
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-12">
|
|
<label for="clientName-field" class="form-label">Telpon/HP</label>
|
|
<input type="text" id="clientName-field" class="form-control"
|
|
placeholder="Client name" required />
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-12">
|
|
<label for="clientName-field" class="form-label">Email</label>
|
|
<input type="text" id="clientName-field" class="form-control"
|
|
placeholder="Client name" required />
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</div>
|
|
<div class="modal-footer">
|
|
<div class="hstack gap-2 justify-content-end">
|
|
<button type="button" class="btn btn-light" id="close-modal"
|
|
data-bs-dismiss="modal">Close</button>
|
|
<button type="submit" class="btn btn-success" id="add-btn">Add
|
|
Task</button>
|
|
<!-- <button type="button" class="btn btn-success" id="edit-btn">Update Task</button> -->
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end modal-->
|
|
|
|
</div>
|
|
<!-- container-fluid -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|