- **Perbaikan dan Penambahan Komando:**
- Memberikan komando baru `webstatement:check-progress` untuk memantau progres pengiriman email statement.
- Menampilkan informasi seperti `Log ID`, `Batch ID`, `Request Type`, status, hingga persentase progress.
- Menangani secara detail jumlah akun yang diproses, sukses, gagal, dan kalkulasi tingkat keberhasilan.
- Menyediakan penanganan error jika log tidak ditemukan atau terjadi kegagalan lainnya.
- Memperluas komando `webstatement:send-email`:
- Mendukung pengiriman berdasarkan `single account`, `branch`, atau `all branches`.
- Menambahkan validasi parameter `type` (`single`, `branch`, `all`) dan input spesifik seperti `--account` atau `--branch` untuk mode tertentu.
- Melakukan pencatatan log awal dengan metadata lengkap seperti `request_type`, `batch_id`, dan status.
- **Peningkatan Logika Proses Backend:**
- Menambahkan fungsi `createLogEntry` untuk mencatat log pengiriman email statement secara dinamis berdasarkan tipe request.
- Menyediakan reusable method seperti `validateParameters` dan `determineRequestTypeAndTarget` untuk mempermudah pengelolaan parameter pengiriman.
- Memberikan feedback dan panduan kepada pengguna mengenai ID log dan komando monitoring (`webstatement:check-progress`).
- **Penambahan Controller dan Fitur UI:**
- Menambahkan controller baru `EmailStatementLogController`:
- Mendukung pengelolaan log seperti list, detail, dan retry untuk pengiriman ulang email statement.
- Menyediakan fitur pencarian, filter, dan halaman data log yang responsif menggunakan datatable.
- Menambahkan kemampuan resend email untuk log dengan status `completed` atau `failed`.
- Mengimplementasikan UI untuk log pengiriman:
- Halaman daftar monitoring dengan filter berdasarkan branch, account number, request type, status, dan tanggal.
- Menampilkan kemajuan, tingkat keberhasilan, serta tombol aksi seperti detail dan pengiriman ulang.
- **Peningkatan Model dan Validasi:**
- Menyesuaikan model `PrintStatementLog` untuk mendukung lebih banyak atribut seperti `processed_accounts`, `success_count`, `failed_count`, `request_type`, serta metode utilitas seperti `getProgressPercentage()` dan `getSuccessRate()`.
- Memvalidasi parameter input lebih mendalam agar kesalahan dapat diminimalisasi di awal proses.
- **Peningkatan pada View dan Feedback Pengguna:**
- Menambah daftar command berguna untuk user di interface log:
- Status antrian dengan `php artisan queue:work`.
- Monitoring menggunakan komando custom yang baru ditambahkan.
- **Perbaikan Logging dan Error Handling:**
- Menambahkan logging komprehensif pada semua proses, termasuk batch pengiriman ulang.
- Memastikan rollback pada database jika terjadi error melalui transaksi pada critical path.
Signed-off-by: Daeng Deni Mardaeni <ddeni05@gmail.com>
394 lines
20 KiB
PHP
394 lines
20 KiB
PHP
@extends('layouts.main')
|
|
|
|
@section('breadcrumbs')
|
|
{{ Breadcrumbs::render(request()->route()->getName()) }}
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="grid">
|
|
<div class="min-w-full card card-grid" data-datatable="false" data-datatable-page-size="10"
|
|
data-datatable-state-save="false" id="email-statement-logs-table"
|
|
data-api-url="{{ route('email-statement-logs.datatables') }}">
|
|
<div class="flex-wrap py-5 card-header">
|
|
<h3 class="card-title">
|
|
Log Pengiriman Email Statement
|
|
</h3>
|
|
<div class="flex flex-wrap gap-2 lg:gap-5">
|
|
<div class="flex">
|
|
<label class="input input-sm"> <i class="ki-filled ki-magnifier"> </i>
|
|
<input placeholder="Cari Log Email Statement" id="search" type="text" value="">
|
|
</label>
|
|
</div>
|
|
<div class="flex">
|
|
<select class="select select-sm" id="filter-branch">
|
|
<option value="">Cabang (Semua)</option>
|
|
@foreach ($branches as $branch)
|
|
<option value="{{ $branch }}">{{ $branch }}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
<div class="flex">
|
|
<select class="select select-sm" id="filter-email-status">
|
|
<option value="">Status Email (Semua)</option>
|
|
<option value="sent">Terkirim</option>
|
|
<option value="failed">Gagal</option>
|
|
<option value="pending">Pending</option>
|
|
</select>
|
|
</div>
|
|
<div class="flex">
|
|
<select class="select select-sm" id="filter-email-source">
|
|
<option value="">Sumber Email (Semua)</option>
|
|
<option value="account">Email Akun</option>
|
|
<option value="customer">Email Nasabah</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="scrollable-x-auto">
|
|
<table class="table text-sm font-medium text-gray-700 align-middle table-auto table-border"
|
|
data-datatable-table="true">
|
|
<thead>
|
|
<tr>
|
|
<th class="min-w-[120px]" data-datatable-column="branch_code">
|
|
<span class="sort"> <span class="sort-label">Cabang</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[150px]" data-datatable-column="account_number">
|
|
<span class="sort"> <span class="sort-label">No. Rekening</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[120px]" data-datatable-column="period_from">
|
|
<span class="sort"> <span class="sort-label">Periode Dari</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[120px]" data-datatable-column="period_to">
|
|
<span class="sort"> <span class="sort-label">Periode Sampai</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[200px]" data-datatable-column="email_address">
|
|
<span class="sort"> <span class="sort-label">Email</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[120px]" data-datatable-column="email_source">
|
|
<span class="sort"> <span class="sort-label">Sumber Email</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[120px]" data-datatable-column="email_status">
|
|
<span class="sort"> <span class="sort-label">Status Email</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[150px]" data-datatable-column="email_sent_at">
|
|
<span class="sort"> <span class="sort-label">Waktu Kirim</span>
|
|
<span class="sort-icon"> </span> </span>
|
|
</th>
|
|
<th class="min-w-[100px]" data-datatable-column="actions">
|
|
<span>Aksi</span>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
</table>
|
|
</div>
|
|
<div
|
|
class="flex-col gap-3 justify-center font-medium text-gray-600 card-footer md:justify-between md:flex-row text-2sm">
|
|
<div class="flex gap-2 items-center">
|
|
Show
|
|
<select class="w-16 select select-sm" data-datatable-size="true" name="perpage"> </select> per page
|
|
</div>
|
|
<div class="flex gap-4 items-center">
|
|
<span data-datatable-info="true"> </span>
|
|
<div class="pagination" data-datatable-pagination="true">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal for detail view -->
|
|
<div class="modal modal-open:!flex" data-modal="true" id="detail-modal">
|
|
<div class="overflow-hidden px-5 w-full modal-content pt-7.5 container-fixed">
|
|
<div class="modal-header">
|
|
<h2 class="modal-title">Detail Log Email Statement</h2>
|
|
<button class="btn btn-sm btn-icon btn-active-color-danger" data-modal-dismiss="true">
|
|
<i class="ki-outline ki-cross fs-1"></i>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="mb-5">
|
|
<h3 class="mb-2 font-bold">Informasi Umum</h3>
|
|
<div class="grid grid-cols-2 gap-2">
|
|
<div>Cabang:</div>
|
|
<div id="detail-branch-code"></div>
|
|
<div>No. Rekening:</div>
|
|
<div id="detail-account-number"></div>
|
|
<div>Periode:</div>
|
|
<div id="detail-period"></div>
|
|
<div>Email:</div>
|
|
<div id="detail-email-address"></div>
|
|
<div>Sumber Email:</div>
|
|
<div id="detail-email-source"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-5">
|
|
<h3 class="mb-2 font-bold">Status Pengiriman Email</h3>
|
|
<div class="grid grid-cols-2 gap-2">
|
|
<div>Status:</div>
|
|
<div id="detail-email-status"></div>
|
|
<div>Waktu Kirim:</div>
|
|
<div id="detail-email-sent-at"></div>
|
|
<div>Error Message:</div>
|
|
<div id="detail-error-message"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-5">
|
|
<h3 class="mb-2 font-bold">Informasi Tambahan</h3>
|
|
<div class="grid grid-cols-2 gap-2">
|
|
<div>Dibuat Oleh:</div>
|
|
<div id="detail-user-id"></div>
|
|
<div>Waktu Dibuat:</div>
|
|
<div id="detail-created-at"></div>
|
|
<div>Waktu Update:</div>
|
|
<div id="detail-updated-at"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" id="btn-resend-email" class="btn btn-primary btn-sm me-3">
|
|
<i class="ki-outline ki-send me-1"></i> Kirim Ulang Email
|
|
</button>
|
|
<button type="button" class="btn btn-light" data-modal-dismiss="true">Tutup</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
<script type="module">
|
|
const element = document.querySelector('#email-statement-logs-table');
|
|
const searchInput = document.getElementById('search');
|
|
const filterBranch = document.getElementById('filter-branch');
|
|
const filterEmailStatus = document.getElementById('filter-email-status');
|
|
const filterEmailSource = document.getElementById('filter-email-source');
|
|
const detailModal = document.getElementById('detail-modal');
|
|
const btnResendEmail = document.getElementById('btn-resend-email');
|
|
|
|
const apiUrl = element.getAttribute('data-api-url');
|
|
const dataTableOptions = {
|
|
apiEndpoint: apiUrl,
|
|
pageSize: 10,
|
|
columns: {
|
|
branch_code: {
|
|
title: 'Cabang',
|
|
},
|
|
account_number: {
|
|
title: 'No. Rekening',
|
|
},
|
|
period_from: {
|
|
title: 'Periode Dari',
|
|
render: (item, data) => {
|
|
return data.period_from ? new Date(data.period_from).toLocaleDateString('id-ID') : '-';
|
|
},
|
|
},
|
|
period_to: {
|
|
title: 'Periode Sampai',
|
|
render: (item, data) => {
|
|
return data.period_to ? new Date(data.period_to).toLocaleDateString('id-ID') : '-';
|
|
},
|
|
},
|
|
email_address: {
|
|
title: 'Email',
|
|
},
|
|
email_source: {
|
|
title: 'Sumber Email',
|
|
render: (item, data) => {
|
|
if (data.email_source === 'account') {
|
|
return '<span class="badge badge-info">Email Akun</span>';
|
|
} else if (data.email_source === 'customer') {
|
|
return '<span class="badge badge-primary">Email Nasabah</span>';
|
|
}
|
|
return '-';
|
|
},
|
|
},
|
|
email_status: {
|
|
title: 'Status Email',
|
|
render: (item, data) => {
|
|
if (data.email_status === 'sent') {
|
|
return '<span class="badge badge-success">Terkirim</span>';
|
|
} else if (data.email_status === 'failed') {
|
|
return '<span class="badge badge-danger">Gagal</span>';
|
|
} else if (data.email_status === 'pending') {
|
|
return '<span class="badge badge-warning">Pending</span>';
|
|
}
|
|
return '<span class="badge badge-secondary">Unknown</span>';
|
|
},
|
|
},
|
|
email_sent_at: {
|
|
title: 'Waktu Kirim',
|
|
render: (item, data) => {
|
|
return data.email_sent_at ? new Date(data.email_sent_at).toLocaleString('id-ID') : '-';
|
|
},
|
|
},
|
|
actions: {
|
|
title: 'Aksi',
|
|
render: (item, data) => {
|
|
let actions = `<div class="flex gap-2">`;
|
|
|
|
// Detail button
|
|
actions += `<button class="btn btn-sm btn-icon btn-light btn-detail" data-id="${data.id}">
|
|
<i class="ki-outline ki-eye fs-3"></i>
|
|
</button>`;
|
|
|
|
// Resend button for failed emails
|
|
if (data.email_status === 'failed') {
|
|
actions += `<button class="btn btn-sm btn-icon btn-warning btn-resend" data-id="${data.id}" title="Kirim Ulang Email">
|
|
<i class="ki-outline ki-send fs-3"></i>
|
|
</button>`;
|
|
}
|
|
|
|
actions += `</div>`;
|
|
return actions;
|
|
},
|
|
}
|
|
},
|
|
};
|
|
|
|
let dataTable = new KTDataTable(element, dataTableOptions);
|
|
|
|
// Custom search functionality
|
|
searchInput.addEventListener('change', function() {
|
|
const searchValue = this.value.trim();
|
|
dataTable.goPage(1);
|
|
dataTable.search(searchValue, true);
|
|
});
|
|
|
|
// Filter functionality
|
|
const applyFilters = () => {
|
|
const branchValue = filterBranch.value;
|
|
const emailStatusValue = filterEmailStatus.value;
|
|
const emailSourceValue = filterEmailSource.value;
|
|
|
|
const params = {};
|
|
if (searchInput.value) {
|
|
params.search = searchInput.value;
|
|
}
|
|
if (branchValue !== '') params.branch_code = branchValue;
|
|
if (emailStatusValue !== '') params.email_status = emailStatusValue;
|
|
if (emailSourceValue !== '') params.email_source = emailSourceValue;
|
|
|
|
dataTable.goPage(1);
|
|
dataTable.search(params);
|
|
dataTable.reload();
|
|
};
|
|
|
|
filterBranch.addEventListener('change', applyFilters);
|
|
filterEmailStatus.addEventListener('change', applyFilters);
|
|
filterEmailSource.addEventListener('change', applyFilters);
|
|
|
|
// Detail modal functionality
|
|
document.addEventListener('click', function(e) {
|
|
if (e.target.closest('.btn-detail')) {
|
|
const id = e.target.closest('.btn-detail').getAttribute('data-id');
|
|
|
|
// Fetch log details by ID
|
|
fetch(`{{ url('email-statement-logs') }}/${id}`)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
// Store current log ID for resend functionality
|
|
btnResendEmail.setAttribute('data-id', data.id);
|
|
|
|
// Show/hide resend button based on email status
|
|
if (data.email_status === 'failed') {
|
|
btnResendEmail.classList.remove('hidden');
|
|
} else {
|
|
btnResendEmail.classList.add('hidden');
|
|
}
|
|
|
|
// Populate modal with data
|
|
document.getElementById('detail-branch-code').textContent = data.branch_code;
|
|
document.getElementById('detail-account-number').textContent = data.account_number;
|
|
document.getElementById('detail-period').textContent =
|
|
`${new Date(data.period_from).toLocaleDateString('id-ID')} - ${new Date(data.period_to).toLocaleDateString('id-ID')}`;
|
|
document.getElementById('detail-email-address').textContent = data.email_address;
|
|
|
|
const emailSourceText = data.email_source === 'account' ? 'Email Akun' : (data
|
|
.email_source === 'customer' ? 'Email Nasabah' : '-');
|
|
document.getElementById('detail-email-source').textContent = emailSourceText;
|
|
|
|
let emailStatusBadge = '';
|
|
if (data.email_status === 'sent') {
|
|
emailStatusBadge = '<span class="badge badge-success">Terkirim</span>';
|
|
} else if (data.email_status === 'failed') {
|
|
emailStatusBadge = '<span class="badge badge-danger">Gagal</span>';
|
|
} else if (data.email_status === 'pending') {
|
|
emailStatusBadge = '<span class="badge badge-warning">Pending</span>';
|
|
}
|
|
document.getElementById('detail-email-status').innerHTML = emailStatusBadge;
|
|
|
|
document.getElementById('detail-email-sent-at').textContent = data.email_sent_at ?
|
|
new Date(data.email_sent_at).toLocaleString('id-ID') :
|
|
'-';
|
|
document.getElementById('detail-error-message').textContent = data.error_message || '-';
|
|
document.getElementById('detail-user-id').textContent = data.user_id || '-';
|
|
document.getElementById('detail-created-at').textContent = data.created_at ?
|
|
new Date(data.created_at).toLocaleString('id-ID') :
|
|
'-';
|
|
document.getElementById('detail-updated-at').textContent = data.updated_at ?
|
|
new Date(data.updated_at).toLocaleString('id-ID') :
|
|
'-';
|
|
|
|
// Show modal
|
|
const modalEl = KTDom.getElement('#detail-modal');
|
|
const modal = KTModal.getInstance(modalEl);
|
|
modal.show();
|
|
|
|
})
|
|
.catch(error => {
|
|
console.error('Error fetching log details:', error);
|
|
alert('Gagal mengambil detail log');
|
|
});
|
|
}
|
|
|
|
// Resend email functionality
|
|
if (e.target.closest('.btn-resend') || e.target.closest('#btn-resend-email')) {
|
|
const id = e.target.closest('.btn-resend, #btn-resend-email').getAttribute('data-id');
|
|
|
|
if (confirm('Apakah Anda yakin ingin mengirim ulang email ini?')) {
|
|
fetch(`{{ url('email-statement-logs') }}/${id}/resend`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute(
|
|
'content')
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
alert('Email berhasil dikirim ulang');
|
|
dataTable.reload();
|
|
|
|
// Close modal if open
|
|
const modalEl = KTDom.getElement('#detail-modal');
|
|
const modal = KTModal.getInstance(modalEl);
|
|
if (modal) {
|
|
modal.hide();
|
|
}
|
|
} else {
|
|
alert('Gagal mengirim ulang email: ' + (data.message || 'Unknown error'));
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error resending email:', error);
|
|
alert('Gagal mengirim ulang email');
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
window.dataTable = dataTable;
|
|
</script>
|
|
@endpush
|