Initial commit
This commit is contained in:
root
@@ -0,0 +1,75 @@
|
||||
<div class="container mt-4">
|
||||
|
||||
<div class="card border-0 shadow-sm rounded-4">
|
||||
|
||||
<div class="card-body p-4">
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Monitoring Absensi
|
||||
</h5>
|
||||
|
||||
<input type="date"
|
||||
id="filterDate"
|
||||
class="form-control"
|
||||
style="max-width:220px"
|
||||
value="<?= date('Y-m-d') ?>">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
|
||||
<table id="tableAttendance"
|
||||
class="table modern-table align-middle w-100">
|
||||
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>Kode</th>
|
||||
<th>Nama</th>
|
||||
<th>Shift</th>
|
||||
<th>Checkin</th>
|
||||
<th>Checkout</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
|
||||
let table = $('#tableAttendance').DataTable({
|
||||
ajax:{
|
||||
url:`<?= base_url(); ?>attendancemonitoring/get_data`,
|
||||
data:function(d){
|
||||
d.date = $('#filterDate').val();
|
||||
},
|
||||
dataSrc:'data'
|
||||
},
|
||||
columns:[
|
||||
{data:0},
|
||||
{data:1},
|
||||
{data:2},
|
||||
{data:3},
|
||||
{data:4},
|
||||
{data:5},
|
||||
{data:6}
|
||||
]
|
||||
});
|
||||
|
||||
$('#filterDate').change(function(){
|
||||
table.ajax.reload();
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,334 @@
|
||||
<div class="container mt-4">
|
||||
|
||||
<div class="card modern-card shadow-sm border-0 rounded-4">
|
||||
|
||||
<div class="card-body p-4">
|
||||
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Master Holiday
|
||||
</h5>
|
||||
|
||||
<button class="btn btn-warning btn-add">
|
||||
Tambah Holiday
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
|
||||
<table id="tableHoliday"
|
||||
class="table modern-table align-middle w-100">
|
||||
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th width="5%">No</th>
|
||||
<th>Tanggal</th>
|
||||
<th>Nama Holiday</th>
|
||||
<th>Type</th>
|
||||
<th width="15%">Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody></tbody>
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- MODAL -->
|
||||
<div class="modal fade" id="modalHoliday">
|
||||
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
|
||||
<div class="modal-content rounded-4">
|
||||
|
||||
<div class="modal-header bg-warning text-white">
|
||||
|
||||
<h5 class="modal-title">
|
||||
Tambah Holiday
|
||||
</h5>
|
||||
|
||||
<button class="btn-close btn-close-white"
|
||||
data-bs-dismiss="modal"></button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
|
||||
<input type="hidden" id="inputId">
|
||||
|
||||
<label class="fw-semibold">
|
||||
Tanggal Holiday
|
||||
</label>
|
||||
|
||||
<input type="date"
|
||||
class="form-control"
|
||||
id="holiday_date">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Nama Holiday
|
||||
</label>
|
||||
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="holiday_name">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jenis Holiday
|
||||
</label>
|
||||
|
||||
<select class="form-control"
|
||||
id="is_national">
|
||||
|
||||
<option value="1">
|
||||
Nasional
|
||||
</option>
|
||||
|
||||
<option value="0">
|
||||
Perusahaan
|
||||
</option>
|
||||
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
|
||||
<button class="btn btn-secondary"
|
||||
data-bs-dismiss="modal">
|
||||
|
||||
Batal
|
||||
|
||||
</button>
|
||||
|
||||
<button class="btn btn-warning"
|
||||
id="btnSimpan">
|
||||
|
||||
Simpan
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
|
||||
let table = $('#tableHoliday').DataTable({
|
||||
processing:true,
|
||||
responsive:true,
|
||||
autoWidth:false,
|
||||
ajax:{
|
||||
url:`<?= base_url(); ?>holidays/get_data`,
|
||||
dataSrc:'data'
|
||||
},
|
||||
order:[],
|
||||
columns:[
|
||||
{data:0, orderable:false},
|
||||
{data:1},
|
||||
{data:2},
|
||||
{data:3},
|
||||
{data:4, orderable:false}
|
||||
],
|
||||
language:{
|
||||
processing:`
|
||||
<div class="text-center">
|
||||
<div class="spinner-border text-warning"></div>
|
||||
</div>
|
||||
`
|
||||
}
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// RESET
|
||||
// =========================================
|
||||
function resetForm(){
|
||||
|
||||
$('#inputId').val('');
|
||||
$('#holiday_date').val('');
|
||||
$('#holiday_name').val('');
|
||||
$('#is_national').val(1);
|
||||
|
||||
$('#modalHoliday .modal-title')
|
||||
.text('Tambah Holiday');
|
||||
}
|
||||
|
||||
// =========================================
|
||||
// ADD
|
||||
// =========================================
|
||||
$('.btn-add').click(function(){
|
||||
|
||||
resetForm();
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','add');
|
||||
|
||||
$('#modalHoliday').modal('show');
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// SAVE UPDATE
|
||||
// =========================================
|
||||
$('#btnSimpan').click(function(){
|
||||
|
||||
let action = $(this).data('action');
|
||||
|
||||
let data = {
|
||||
id: $('#inputId').val(),
|
||||
holiday_date: $('#holiday_date').val(),
|
||||
holiday_name: $('#holiday_name').val(),
|
||||
is_national: $('#is_national').val()
|
||||
};
|
||||
|
||||
if(
|
||||
!data.holiday_date ||
|
||||
!data.holiday_name
|
||||
){
|
||||
Swal.fire(
|
||||
'Warning',
|
||||
'Tanggal & Nama Holiday wajib diisi',
|
||||
'warning'
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
let url = action === 'add'
|
||||
? `<?= base_url(); ?>holidays/save`
|
||||
: `<?= base_url(); ?>holidays/update`;
|
||||
|
||||
$.ajax({
|
||||
url:url,
|
||||
type:'POST',
|
||||
data:data,
|
||||
dataType:'json',
|
||||
success:function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
$('#modalHoliday').modal('hide');
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
}
|
||||
},
|
||||
error:function(){
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
'Terjadi kesalahan server',
|
||||
'error'
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// EDIT
|
||||
// =========================================
|
||||
$(document).on('click','.btn-edit',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>holidays/detail/` + id,
|
||||
function(res){
|
||||
|
||||
$('#inputId').val(res.id);
|
||||
$('#holiday_date').val(res.holiday_date);
|
||||
$('#holiday_name').val(res.holiday_name);
|
||||
$('#is_national').val(res.is_national);
|
||||
|
||||
$('#modalHoliday .modal-title')
|
||||
.text('Edit Holiday');
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','edit');
|
||||
|
||||
$('#modalHoliday').modal('show');
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// DELETE
|
||||
// =========================================
|
||||
$(document).on('click','.btn-delete',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
Swal.fire({
|
||||
title:'Yakin hapus?',
|
||||
text:'Data tidak bisa dikembalikan!',
|
||||
icon:'warning',
|
||||
showCancelButton:true,
|
||||
confirmButtonText:'Ya, hapus'
|
||||
}).then((result)=>{
|
||||
|
||||
if(result.isConfirmed){
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>holidays/delete/` + id,
|
||||
function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,418 @@
|
||||
<div class="container mt-4">
|
||||
|
||||
<div class="card modern-card shadow-sm border-0 rounded-4">
|
||||
|
||||
<div class="card-body p-4">
|
||||
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Leave Requests
|
||||
</h5>
|
||||
|
||||
<button class="btn btn-warning btn-add">
|
||||
Tambah Leave
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
|
||||
<table id="tableLeave"
|
||||
class="table modern-table align-middle w-100">
|
||||
|
||||
<thead class="table-light">
|
||||
|
||||
<tr>
|
||||
|
||||
<th width="5%">No</th>
|
||||
<th>Finger ID</th>
|
||||
<th>Employee</th>
|
||||
<th>Jenis Leave</th>
|
||||
<th>Tanggal Mulai</th>
|
||||
<th>Tanggal Selesai</th>
|
||||
<th>Total</th>
|
||||
<th>Status</th>
|
||||
<th width="15%">Aksi</th>
|
||||
|
||||
</tr>
|
||||
|
||||
</thead>
|
||||
|
||||
<tbody></tbody>
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- MODAL -->
|
||||
<div class="modal fade" id="modalLeave">
|
||||
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
|
||||
<div class="modal-content rounded-4">
|
||||
|
||||
<div class="modal-header bg-warning text-white">
|
||||
|
||||
<h5 class="modal-title">
|
||||
Tambah Leave
|
||||
</h5>
|
||||
|
||||
<button class="btn-close btn-close-white"
|
||||
data-bs-dismiss="modal"></button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
|
||||
<input type="hidden" id="inputId">
|
||||
|
||||
<label class="fw-semibold">
|
||||
Employee
|
||||
</label>
|
||||
|
||||
<select class="form-control select-search"
|
||||
id="employee_id">
|
||||
|
||||
<option value="">
|
||||
Pilih Employee
|
||||
</option>
|
||||
|
||||
<?php foreach($employees as $e): ?>
|
||||
|
||||
<option value="<?= $e->id ?>">
|
||||
|
||||
<?= $e->fingerprint_user_id ?>
|
||||
-
|
||||
<?= $e->full_name ?>
|
||||
|
||||
</option>
|
||||
|
||||
<?php endforeach; ?>
|
||||
|
||||
</select>
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jenis Cuti / Izin
|
||||
</label>
|
||||
|
||||
<select class="form-control"
|
||||
id="leave_type">
|
||||
|
||||
<option value="annual">
|
||||
Cuti Tahunan
|
||||
</option>
|
||||
|
||||
<option value="sick">
|
||||
Sakit
|
||||
</option>
|
||||
|
||||
<option value="permit">
|
||||
Izin
|
||||
</option>
|
||||
|
||||
<option value="maternity">
|
||||
Cuti Melahirkan
|
||||
</option>
|
||||
|
||||
<option value="unpaid">
|
||||
Cuti Tidak Dibayar
|
||||
</option>
|
||||
|
||||
</select>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Start Date
|
||||
</label>
|
||||
|
||||
<input type="date"
|
||||
class="form-control"
|
||||
id="start_date">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
End Date
|
||||
</label>
|
||||
|
||||
<input type="date"
|
||||
class="form-control"
|
||||
id="end_date">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Approval Status
|
||||
</label>
|
||||
|
||||
<select class="form-control"
|
||||
id="approval_status">
|
||||
|
||||
<option value="pending">
|
||||
Pending
|
||||
</option>
|
||||
|
||||
<option value="approved">
|
||||
Approved
|
||||
</option>
|
||||
|
||||
<option value="rejected">
|
||||
Rejected
|
||||
</option>
|
||||
|
||||
</select>
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Reason
|
||||
</label>
|
||||
|
||||
<textarea class="form-control"
|
||||
id="reason"
|
||||
rows="4"></textarea>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
|
||||
<button class="btn btn-secondary"
|
||||
data-bs-dismiss="modal">
|
||||
|
||||
Batal
|
||||
|
||||
</button>
|
||||
|
||||
<button class="btn btn-warning"
|
||||
id="btnSimpan">
|
||||
|
||||
Simpan
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
$(function(){
|
||||
|
||||
let table = $('#tableLeave').DataTable({
|
||||
processing:true,
|
||||
responsive:true,
|
||||
autoWidth:false,
|
||||
ajax:{
|
||||
url:`<?= base_url(); ?>leaverequests/get_data`,
|
||||
dataSrc:'data'
|
||||
},
|
||||
order:[]
|
||||
});
|
||||
|
||||
// =====================================
|
||||
// RESET
|
||||
// =====================================
|
||||
function resetForm(){
|
||||
|
||||
$('#inputId').val('');
|
||||
$('#employee_id').val('');
|
||||
$('#leave_type').val('annual');
|
||||
$('#start_date').val('');
|
||||
$('#end_date').val('');
|
||||
$('#approval_status').val('pending');
|
||||
$('#reason').val('');
|
||||
|
||||
$('#modalLeave .modal-title')
|
||||
.text('Tambah Leave');
|
||||
}
|
||||
|
||||
// =====================================
|
||||
// ADD
|
||||
// =====================================
|
||||
$('.btn-add').click(function(){
|
||||
|
||||
resetForm();
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','add');
|
||||
|
||||
$('#modalLeave').modal('show');
|
||||
|
||||
});
|
||||
|
||||
// =====================================
|
||||
// SAVE UPDATE
|
||||
// =====================================
|
||||
$('#btnSimpan').click(function(){
|
||||
|
||||
let action = $(this).data('action');
|
||||
|
||||
let data = {
|
||||
|
||||
id: $('#inputId').val(),
|
||||
|
||||
employee_id: $('#employee_id').val(),
|
||||
|
||||
leave_type: $('#leave_type').val(),
|
||||
|
||||
start_date: $('#start_date').val(),
|
||||
|
||||
end_date: $('#end_date').val(),
|
||||
|
||||
approval_status: $('#approval_status').val(),
|
||||
|
||||
reason: $('#reason').val()
|
||||
};
|
||||
|
||||
if(
|
||||
!data.employee_id ||
|
||||
!data.start_date ||
|
||||
!data.end_date
|
||||
){
|
||||
|
||||
Swal.fire(
|
||||
'Warning',
|
||||
'Data wajib diisi',
|
||||
'warning'
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
let url = action == 'add'
|
||||
? `<?= base_url(); ?>leaverequests/save`
|
||||
: `<?= base_url(); ?>leaverequests/update`;
|
||||
|
||||
$.ajax({
|
||||
url:url,
|
||||
type:'POST',
|
||||
data:data,
|
||||
dataType:'json',
|
||||
success:function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
$('#modalLeave').modal('hide');
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// =====================================
|
||||
// EDIT
|
||||
// =====================================
|
||||
$(document).on('click','.btn-edit',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>leaverequests/detail/` + id,
|
||||
function(res){
|
||||
|
||||
$('#inputId').val(res.id);
|
||||
|
||||
$('#employee_id').val(res.employee_id);
|
||||
|
||||
$('#leave_type').val(res.leave_type);
|
||||
|
||||
$('#start_date').val(res.start_date);
|
||||
|
||||
$('#end_date').val(res.end_date);
|
||||
|
||||
$('#approval_status')
|
||||
.val(res.approval_status);
|
||||
|
||||
$('#reason').val(res.reason);
|
||||
|
||||
$('#modalLeave .modal-title')
|
||||
.text('Edit Leave');
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','edit');
|
||||
|
||||
$('#modalLeave').modal('show');
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
// =====================================
|
||||
// DELETE
|
||||
// =====================================
|
||||
$(document).on('click','.btn-delete',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
Swal.fire({
|
||||
title:'Yakin hapus?',
|
||||
text:'Data tidak bisa dikembalikan',
|
||||
icon:'warning',
|
||||
showCancelButton:true
|
||||
}).then((result)=>{
|
||||
|
||||
if(result.isConfirmed){
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>leaverequests/delete/` + id,
|
||||
function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,831 @@
|
||||
<div class="container mt-4">
|
||||
|
||||
<div class="card modern-card shadow-sm border-0 rounded-4">
|
||||
|
||||
<div class="card-body p-4">
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
|
||||
<div>
|
||||
<h4 class="mb-1">
|
||||
Payroll Karyawan
|
||||
</h4>
|
||||
|
||||
<small class="text-muted">
|
||||
Generate dan kelola payroll karyawan
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div class="d-flex gap-2">
|
||||
|
||||
<input
|
||||
type="month"
|
||||
id="filterMonth"
|
||||
class="form-control">
|
||||
|
||||
<button
|
||||
class="btn btn-warning"
|
||||
id="btnGeneratePayroll">
|
||||
|
||||
<i class="fa fa-refresh me-1"></i>
|
||||
Generate Payroll
|
||||
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-dark"
|
||||
id="btnReload">
|
||||
|
||||
<i class="fa fa-search me-1"></i>
|
||||
Filter
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- TABLE -->
|
||||
<div class="table-responsive">
|
||||
|
||||
<table
|
||||
id="tablePayroll"
|
||||
class="table modern-table align-middle w-100">
|
||||
|
||||
<thead class="table-light">
|
||||
|
||||
<tr>
|
||||
|
||||
<th width="50">
|
||||
No
|
||||
</th>
|
||||
|
||||
<th>
|
||||
Karyawan
|
||||
</th>
|
||||
|
||||
<th>
|
||||
Gaji Pokok
|
||||
</th>
|
||||
|
||||
<th>
|
||||
Pendapatan
|
||||
</th>
|
||||
|
||||
<th>
|
||||
Potongan
|
||||
</th>
|
||||
|
||||
<th>
|
||||
THP
|
||||
</th>
|
||||
|
||||
<th width="180">
|
||||
Status
|
||||
</th>
|
||||
|
||||
<th width="180">
|
||||
Aksi
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
|
||||
</thead>
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- ========================================= -->
|
||||
<!-- MODAL DETAIL PAYROLL -->
|
||||
<!-- ========================================= -->
|
||||
<div class="modal fade" id="modalPayroll">
|
||||
<div class="modal-dialog modal-xl modal-dialog-centered">
|
||||
<div class="modal-content border-0 rounded-4">
|
||||
|
||||
<!-- HEADER -->
|
||||
<div class="modal-header bg-warning text-white">
|
||||
|
||||
<div>
|
||||
|
||||
<h5 class="modal-title mb-0">
|
||||
Detail Payroll
|
||||
</h5>
|
||||
|
||||
<small id="employeeNameHeader"></small>
|
||||
|
||||
</div>
|
||||
|
||||
<button
|
||||
class="btn-close"
|
||||
data-bs-dismiss="modal">
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- BODY -->
|
||||
<div class="modal-body">
|
||||
|
||||
<input type="hidden" id="payroll_id">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<!-- LEFT -->
|
||||
<div class="col-md-6">
|
||||
|
||||
<div class="card border-0 shadow-sm rounded-4 h-100">
|
||||
|
||||
<div class="card-body">
|
||||
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Pendapatan
|
||||
</h5>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-success"
|
||||
id="btnTambahPendapatan">
|
||||
|
||||
<i class="fa fa-plus"></i>
|
||||
Tambah
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- BASIC SALARY -->
|
||||
<div class="border rounded-4 p-3 mb-3 bg-light">
|
||||
|
||||
<div class="fw-bold">
|
||||
Gaji Pokok
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="text-success fw-bold"
|
||||
id="basicSalaryText">
|
||||
|
||||
Rp 0
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- ITEMS -->
|
||||
<div id="earningItems"></div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- RIGHT -->
|
||||
<div class="col-md-6">
|
||||
|
||||
<div class="card border-0 shadow-sm rounded-4 h-100">
|
||||
|
||||
<div class="card-body">
|
||||
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Potongan
|
||||
</h5>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-danger"
|
||||
id="btnTambahPotongan">
|
||||
|
||||
<i class="fa fa-plus"></i>
|
||||
Tambah
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- ITEMS -->
|
||||
<div id="deductionItems"></div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- TAKE HOME PAY -->
|
||||
<div class="card border-0 shadow-sm rounded-4 mt-4">
|
||||
|
||||
<div class="card-body">
|
||||
|
||||
<div class="row text-center">
|
||||
|
||||
<div class="col-md-4">
|
||||
|
||||
<small class="text-muted">
|
||||
Total Pendapatan
|
||||
</small>
|
||||
|
||||
<h5
|
||||
class="text-success mt-1"
|
||||
id="totalPendapatan">
|
||||
|
||||
Rp 0
|
||||
|
||||
</h5>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
|
||||
<small class="text-muted">
|
||||
Total Potongan
|
||||
</small>
|
||||
|
||||
<h5
|
||||
class="text-danger mt-1"
|
||||
id="totalPotongan">
|
||||
|
||||
Rp 0
|
||||
|
||||
</h5>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
|
||||
<small class="text-muted">
|
||||
Take Home Pay
|
||||
</small>
|
||||
|
||||
<h3
|
||||
class="mt-1 fw-bold"
|
||||
id="totalTakeHome">
|
||||
|
||||
Rp 0
|
||||
|
||||
</h3>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<div class="modal-footer">
|
||||
|
||||
<button
|
||||
class="btn btn-secondary"
|
||||
data-bs-dismiss="modal">
|
||||
|
||||
Tutup
|
||||
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-warning"
|
||||
id="btnSavePayroll">
|
||||
|
||||
<i class="fa fa-save me-1"></i>
|
||||
Simpan Payroll
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ========================================= -->
|
||||
<!-- TEMPLATE ITEM -->
|
||||
<!-- ========================================= -->
|
||||
<script type="text/template" id="templatePayrollItem">
|
||||
|
||||
<div class="payroll-item border rounded-4 p-3 mb-3">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-5">
|
||||
|
||||
<label class="form-label">
|
||||
Nama Item
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="form-control item-name"
|
||||
placeholder="Contoh : Bonus Proyek">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
|
||||
<label class="form-label">
|
||||
Nominal
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
class="form-control item-amount"
|
||||
value="0">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
|
||||
<label class="form-label">
|
||||
Tipe
|
||||
</label>
|
||||
|
||||
<select class="form-control item-type">
|
||||
|
||||
<option value="allowance">
|
||||
Tunjangan
|
||||
</option>
|
||||
|
||||
<option value="bonus">
|
||||
Bonus
|
||||
</option>
|
||||
|
||||
<option value="overtime">
|
||||
Lembur
|
||||
</option>
|
||||
|
||||
<option value="deduction">
|
||||
Potongan
|
||||
</option>
|
||||
|
||||
<option value="bpjs">
|
||||
BPJS
|
||||
</option>
|
||||
|
||||
<option value="tax">
|
||||
Pajak
|
||||
</option>
|
||||
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-1 d-flex align-items-end">
|
||||
|
||||
<button
|
||||
class="btn btn-danger btn-remove-item w-100">
|
||||
|
||||
<i class="fa fa-trash"></i>
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
|
||||
$(function(){
|
||||
|
||||
// =========================================
|
||||
// DEFAULT MONTH
|
||||
// =========================================
|
||||
let now = new Date();
|
||||
|
||||
let month =
|
||||
now.getFullYear()
|
||||
+ '-'
|
||||
+ String(now.getMonth()+1).padStart(2,'0');
|
||||
|
||||
$('#filterMonth').val(month);
|
||||
|
||||
// =========================================
|
||||
// DATATABLE
|
||||
// =========================================
|
||||
let table = $('#tablePayroll').DataTable({
|
||||
|
||||
processing:true,
|
||||
serverSide:false,
|
||||
|
||||
ajax:{
|
||||
url:"<?= base_url('payroll/get_data'); ?>",
|
||||
type:"POST",
|
||||
data:function(d){
|
||||
d.month = $('#filterMonth').val();
|
||||
}
|
||||
},
|
||||
|
||||
columnDefs:[
|
||||
{
|
||||
targets:[2,3,4,5],
|
||||
className:'text-end'
|
||||
}
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// RELOAD
|
||||
// =========================================
|
||||
$('#btnReload').click(function(){
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// GENERATE PAYROLL
|
||||
// =========================================
|
||||
$('#btnGeneratePayroll').click(function(){
|
||||
|
||||
let month = $('#filterMonth').val();
|
||||
|
||||
if(!month){
|
||||
|
||||
Swal.fire(
|
||||
'Warning',
|
||||
'Pilih bulan terlebih dahulu',
|
||||
'warning'
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
Swal.fire({
|
||||
|
||||
title:'Generate Payroll?',
|
||||
text:'Payroll akan dibuat otomatis',
|
||||
icon:'question',
|
||||
showCancelButton:true,
|
||||
confirmButtonText:'Generate'
|
||||
|
||||
}).then((r)=>{
|
||||
|
||||
if(r.isConfirmed){
|
||||
|
||||
$.post(
|
||||
|
||||
"<?= base_url('payroll/generate_payroll'); ?>",
|
||||
|
||||
{
|
||||
month:month
|
||||
},
|
||||
|
||||
function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
'json'
|
||||
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// OPEN DETAIL
|
||||
// =========================================
|
||||
$(document).on(
|
||||
'click',
|
||||
'.btn-edit',
|
||||
function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
$('#payroll_id').val(id);
|
||||
|
||||
$('#earningItems').html('');
|
||||
$('#deductionItems').html('');
|
||||
|
||||
$.get(
|
||||
|
||||
"<?= base_url('payroll/detail/'); ?>"+id,
|
||||
|
||||
function(res){
|
||||
|
||||
$('#employeeNameHeader').html(
|
||||
res.employee.full_name
|
||||
);
|
||||
|
||||
$('#basicSalaryText').html(
|
||||
'Rp ' +
|
||||
parseFloat(
|
||||
res.payroll.basic_salary
|
||||
).toLocaleString('id-ID')
|
||||
);
|
||||
|
||||
// =========================
|
||||
// LOAD ITEMS
|
||||
// =========================
|
||||
$.each(res.items,function(i,item){
|
||||
|
||||
appendItem(
|
||||
item.item_name,
|
||||
item.amount,
|
||||
item.item_type
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
calculateTHP();
|
||||
|
||||
$('#modalPayroll').modal('show');
|
||||
|
||||
},
|
||||
|
||||
'json'
|
||||
|
||||
);
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
// =========================================
|
||||
// ADD EARNING
|
||||
// =========================================
|
||||
$('#btnTambahPendapatan').click(function(){
|
||||
|
||||
appendItem(
|
||||
'',
|
||||
0,
|
||||
'allowance'
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// ADD DEDUCTION
|
||||
// =========================================
|
||||
$('#btnTambahPotongan').click(function(){
|
||||
|
||||
appendItem(
|
||||
'',
|
||||
0,
|
||||
'deduction'
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// APPEND ITEM
|
||||
// =========================================
|
||||
function appendItem(
|
||||
name='',
|
||||
amount=0,
|
||||
type='allowance'
|
||||
){
|
||||
|
||||
let html =
|
||||
$('#templatePayrollItem').html();
|
||||
|
||||
let el = $(html);
|
||||
|
||||
el.find('.item-name').val(name);
|
||||
el.find('.item-amount').val(amount);
|
||||
el.find('.item-type').val(type);
|
||||
|
||||
if(
|
||||
type == 'allowance'
|
||||
||
|
||||
type == 'bonus'
|
||||
||
|
||||
type == 'overtime'
|
||||
){
|
||||
|
||||
$('#earningItems').append(el);
|
||||
|
||||
} else {
|
||||
|
||||
$('#deductionItems').append(el);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// =========================================
|
||||
// REMOVE ITEM
|
||||
// =========================================
|
||||
$(document).on(
|
||||
'click',
|
||||
'.btn-remove-item',
|
||||
function(){
|
||||
|
||||
$(this)
|
||||
.closest('.payroll-item')
|
||||
.remove();
|
||||
|
||||
calculateTHP();
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
// =========================================
|
||||
// CALCULATE
|
||||
// =========================================
|
||||
$(document).on(
|
||||
'keyup change',
|
||||
'.item-amount',
|
||||
function(){
|
||||
|
||||
calculateTHP();
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
function calculateTHP(){
|
||||
|
||||
let basicSalary =
|
||||
parseFloat(
|
||||
$('#basicSalaryText')
|
||||
.text()
|
||||
.replace(/[^0-9]/g,'')
|
||||
) || 0;
|
||||
|
||||
let totalEarning = 0;
|
||||
let totalDeduction = 0;
|
||||
|
||||
$('#earningItems .payroll-item').each(function(){
|
||||
|
||||
totalEarning += parseFloat(
|
||||
$(this)
|
||||
.find('.item-amount')
|
||||
.val()
|
||||
) || 0;
|
||||
|
||||
});
|
||||
|
||||
$('#deductionItems .payroll-item').each(function(){
|
||||
|
||||
totalDeduction += parseFloat(
|
||||
$(this)
|
||||
.find('.item-amount')
|
||||
.val()
|
||||
) || 0;
|
||||
|
||||
});
|
||||
|
||||
let thp =
|
||||
(
|
||||
basicSalary
|
||||
+
|
||||
totalEarning
|
||||
)
|
||||
-
|
||||
totalDeduction;
|
||||
|
||||
$('#totalPendapatan').html(
|
||||
'Rp '+
|
||||
totalEarning.toLocaleString('id-ID')
|
||||
);
|
||||
|
||||
$('#totalPotongan').html(
|
||||
'Rp '+
|
||||
totalDeduction.toLocaleString('id-ID')
|
||||
);
|
||||
|
||||
$('#totalTakeHome').html(
|
||||
'Rp '+
|
||||
thp.toLocaleString('id-ID')
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
// =========================================
|
||||
// SAVE PAYROLL
|
||||
// =========================================
|
||||
$('#btnSavePayroll').click(function(){
|
||||
|
||||
let items = [];
|
||||
|
||||
$('#earningItems .payroll-item').each(function(){
|
||||
|
||||
items.push({
|
||||
|
||||
item_name:
|
||||
$(this)
|
||||
.find('.item-name')
|
||||
.val(),
|
||||
|
||||
amount:
|
||||
$(this)
|
||||
.find('.item-amount')
|
||||
.val(),
|
||||
|
||||
item_type:
|
||||
$(this)
|
||||
.find('.item-type')
|
||||
.val()
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$('#deductionItems .payroll-item').each(function(){
|
||||
|
||||
items.push({
|
||||
|
||||
item_name:
|
||||
$(this)
|
||||
.find('.item-name')
|
||||
.val(),
|
||||
|
||||
amount:
|
||||
$(this)
|
||||
.find('.item-amount')
|
||||
.val(),
|
||||
|
||||
item_type:
|
||||
$(this)
|
||||
.find('.item-type')
|
||||
.val()
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$.post(
|
||||
|
||||
"<?= base_url('payroll/save_items'); ?>",
|
||||
|
||||
{
|
||||
|
||||
payroll_id:
|
||||
$('#payroll_id').val(),
|
||||
|
||||
items:items
|
||||
|
||||
},
|
||||
|
||||
function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
$('#modalPayroll').modal('hide');
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
'json'
|
||||
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,411 @@
|
||||
<div class="container mt-4">
|
||||
|
||||
<div class="card modern-card shadow-sm border-0 rounded-4">
|
||||
|
||||
<div class="card-body p-4">
|
||||
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
|
||||
<h5 class="mb-0">
|
||||
Master Shift
|
||||
</h5>
|
||||
|
||||
<button class="btn btn-warning btn-add">
|
||||
Tambah Shift
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
|
||||
<table id="tableShifts"
|
||||
class="table modern-table align-middle w-100">
|
||||
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th width="5%">No</th>
|
||||
<th>Kode</th>
|
||||
<th>Nama Shift</th>
|
||||
<th>Jam Masuk</th>
|
||||
<th>Jam Pulang</th>
|
||||
<th>Toleransi</th>
|
||||
<th>Jam Kerja</th>
|
||||
<th>Type</th>
|
||||
<th width="15%">Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody></tbody>
|
||||
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- MODAL -->
|
||||
<div class="modal fade" id="modalShift">
|
||||
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
|
||||
<div class="modal-content rounded-4">
|
||||
|
||||
<div class="modal-header bg-warning text-white">
|
||||
|
||||
<h5 class="modal-title">
|
||||
Tambah Shift
|
||||
</h5>
|
||||
|
||||
<button class="btn-close btn-close-white"
|
||||
data-bs-dismiss="modal"></button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
|
||||
<input type="hidden" id="inputId">
|
||||
|
||||
<label class="fw-semibold">
|
||||
Kode Shift
|
||||
</label>
|
||||
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="shift_code">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Nama Shift
|
||||
</label>
|
||||
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="shift_name">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jam Masuk
|
||||
</label>
|
||||
|
||||
<input type="time"
|
||||
class="form-control"
|
||||
id="checkin_time">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jam Pulang
|
||||
</label>
|
||||
|
||||
<input type="time"
|
||||
class="form-control"
|
||||
id="checkout_time">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Toleransi Telat
|
||||
</label>
|
||||
|
||||
<input type="number"
|
||||
class="form-control"
|
||||
id="late_tolerance_minutes">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jam Kerja
|
||||
</label>
|
||||
|
||||
<input type="number"
|
||||
step="0.1"
|
||||
class="form-control"
|
||||
id="work_hours">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<label class="fw-semibold mt-2">
|
||||
Jenis Shift
|
||||
</label>
|
||||
|
||||
<select class="form-control"
|
||||
id="is_night_shift">
|
||||
|
||||
<option value="0">
|
||||
Normal Shift
|
||||
</option>
|
||||
|
||||
<option value="1">
|
||||
Night Shift
|
||||
</option>
|
||||
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
|
||||
<button class="btn btn-secondary"
|
||||
data-bs-dismiss="modal">
|
||||
|
||||
Batal
|
||||
|
||||
</button>
|
||||
|
||||
<button class="btn btn-warning"
|
||||
id="btnSimpan">
|
||||
|
||||
Simpan
|
||||
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
|
||||
let table = $('#tableShifts').DataTable({
|
||||
processing:true,
|
||||
responsive:true,
|
||||
autoWidth:false,
|
||||
ajax:{
|
||||
url: `<?= base_url(); ?>` + 'shifts/get_data',
|
||||
dataSrc:'data'
|
||||
},
|
||||
order:[],
|
||||
columns:[
|
||||
{data:0, orderable:false},
|
||||
{data:1},
|
||||
{data:2},
|
||||
{data:3},
|
||||
{data:4},
|
||||
{data:5},
|
||||
{data:6},
|
||||
{data:7},
|
||||
{data:8, orderable:false}
|
||||
],
|
||||
language:{
|
||||
processing:`
|
||||
<div class="text-center">
|
||||
<div class="spinner-border text-warning"></div>
|
||||
</div>
|
||||
`
|
||||
}
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// RESET
|
||||
// =========================================
|
||||
function resetForm(){
|
||||
|
||||
$('#inputId').val('');
|
||||
$('#shift_code').val('');
|
||||
$('#shift_name').val('');
|
||||
$('#checkin_time').val('');
|
||||
$('#checkout_time').val('');
|
||||
$('#late_tolerance_minutes').val(0);
|
||||
$('#work_hours').val(8);
|
||||
$('#is_night_shift').val(0);
|
||||
|
||||
$('#modalShift .modal-title')
|
||||
.text('Tambah Shift');
|
||||
}
|
||||
|
||||
// =========================================
|
||||
// ADD
|
||||
// =========================================
|
||||
$('.btn-add').click(function(){
|
||||
|
||||
resetForm();
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','add');
|
||||
|
||||
$('#modalShift').modal('show');
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// SAVE UPDATE
|
||||
// =========================================
|
||||
$('#btnSimpan').click(function(){
|
||||
|
||||
let action = $(this).data('action');
|
||||
|
||||
let data = {
|
||||
id: $('#inputId').val(),
|
||||
shift_code: $('#shift_code').val(),
|
||||
shift_name: $('#shift_name').val(),
|
||||
checkin_time: $('#checkin_time').val(),
|
||||
checkout_time: $('#checkout_time').val(),
|
||||
late_tolerance_minutes: $('#late_tolerance_minutes').val(),
|
||||
work_hours: $('#work_hours').val(),
|
||||
is_night_shift: $('#is_night_shift').val()
|
||||
};
|
||||
|
||||
if(
|
||||
!data.shift_code ||
|
||||
!data.shift_name
|
||||
){
|
||||
Swal.fire(
|
||||
'Warning',
|
||||
'Kode & Nama Shift wajib diisi',
|
||||
'warning'
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
let url = action === 'add'
|
||||
? `<?= base_url(); ?>` + 'shifts/save'
|
||||
: `<?= base_url(); ?>` + 'shifts/update';
|
||||
|
||||
$.ajax({
|
||||
url:url,
|
||||
type:'POST',
|
||||
data:data,
|
||||
dataType:'json',
|
||||
success:function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
$('#modalShift').modal('hide');
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
}
|
||||
},
|
||||
error:function(){
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
'Terjadi kesalahan server',
|
||||
'error'
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// EDIT
|
||||
// =========================================
|
||||
$(document).on('click','.btn-edit',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>` + 'shifts/detail/' + id,
|
||||
function(res){
|
||||
|
||||
$('#inputId').val(res.id);
|
||||
$('#shift_code').val(res.shift_code);
|
||||
$('#shift_name').val(res.shift_name);
|
||||
$('#checkin_time').val(res.checkin_time);
|
||||
$('#checkout_time').val(res.checkout_time);
|
||||
$('#late_tolerance_minutes').val(res.late_tolerance_minutes);
|
||||
$('#work_hours').val(res.work_hours);
|
||||
$('#is_night_shift').val(res.is_night_shift);
|
||||
|
||||
$('#modalShift .modal-title')
|
||||
.text('Edit Shift');
|
||||
|
||||
$('#btnSimpan')
|
||||
.data('action','edit');
|
||||
|
||||
$('#modalShift').modal('show');
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
});
|
||||
|
||||
// =========================================
|
||||
// DELETE
|
||||
// =========================================
|
||||
$(document).on('click','.btn-delete',function(){
|
||||
|
||||
let id = $(this).data('id');
|
||||
|
||||
Swal.fire({
|
||||
title:'Yakin hapus?',
|
||||
text:'Data tidak bisa dikembalikan!',
|
||||
icon:'warning',
|
||||
showCancelButton:true,
|
||||
confirmButtonText:'Ya, hapus'
|
||||
}).then((result)=>{
|
||||
|
||||
if(result.isConfirmed){
|
||||
|
||||
$.get(
|
||||
`<?= base_url(); ?>` + 'shifts/delete/' + id,
|
||||
function(res){
|
||||
|
||||
if(res.status){
|
||||
|
||||
table.ajax.reload(null,false);
|
||||
|
||||
Swal.fire(
|
||||
'Sukses',
|
||||
res.message,
|
||||
'success'
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
Swal.fire(
|
||||
'Error',
|
||||
res.message,
|
||||
'error'
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
'json'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user