feat(webstatement): tambah fitur Laporan Closing Balance
Perubahan yang dilakukan: **Controller LaporanClosingBalanceController:** - Membuat controller baru untuk laporan closing balance dengan method index(), dataForDatatables(), export(), dan show(). - Menggunakan model AccountBalance dengan field actual_balance dan cleared_balance. - Implementasi filter nomor rekening dan rentang tanggal. - Menambahkan DB transaction dan rollback untuk keamanan data. - Logging dan error handling komprehensif untuk proses data dan export. **View laporan-closing-balance/index.blade.php:** - Form filter dengan input nomor rekening dan rentang tanggal (default 30 hari terakhir). - Implementasi DataTables dengan kolom: Nomor Rekening, Periode, Saldo Cleared, Saldo Aktual, Tanggal Update, dan Action. - Tombol Filter, Reset, dan Export CSV. - JavaScript untuk format currency IDR, format tanggal, dan dynamic export URL. - Menggunakan TailwindCSS dan KTDataTable untuk desain yang responsive. **View laporan-closing-balance/show.blade.php:** - Halaman detail per record dengan visual saldo yang menarik (color-coded cards). - Menampilkan Saldo Cleared, Saldo Aktual, dan Selisih Saldo secara otomatis. - Informasi rekening dan periode disertai fitur copy ke clipboard. - Tombol aksi: Kembali, Export, dan Print (dengan print style khusus). - Responsive untuk berbagai ukuran layar. **Routing dan Navigasi:** - Menambahkan routing resource dengan prefix 'laporan-closing-balance' di web.php. - Tambahan route untuk datatables, export, dan show dengan middleware auth. - Breadcrumb dinamis untuk index dan show, menampilkan nomor rekening dan periode. **Penyesuaian Model:** - Menggunakan relasi Account di model AccountBalance melalui account_number. - Menyesuaikan field dari opening_balance ke cleared_balance sesuai skema. - Tetap mempertahankan actual_balance untuk saldo akhir. **Fitur Keamanan dan Performance:** - Input validation dan sanitization untuk semua request. - Pagination dan filter query untuk efisiensi dan mencegah memory overflow. - Error logging dengan context untuk debugging lebih mudah. **User Experience:** - Interface user-friendly dengan feedback visual dan loading state. - Export CSV untuk kebutuhan analisis lebih lanjut. - Print-friendly layout untuk kebutuhan cetak data. - Clipboard integration untuk kemudahan salin data. Tujuan perubahan: - Menyediakan fitur monitoring dan analisis closing balance secara komprehensif di modul Webstatement. - Mempermudah user dalam melihat detail saldo akhir dengan filtering, export, dan cetak yang optimal.
This commit is contained in:
Daeng Deni Mardaeni
232
app/Http/Controllers/LaporanClosingBalanceController.php
Normal file
232
app/Http/Controllers/LaporanClosingBalanceController.php
Normal file
@@ -0,0 +1,232 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace Modules\Webstatement\Http\Controllers;
|
||||||
|
|
||||||
|
use App\Http\Controllers\Controller;
|
||||||
|
use Illuminate\Http\Request;
|
||||||
|
use Illuminate\Http\Response;
|
||||||
|
use Illuminate\Support\Facades\DB;
|
||||||
|
use Illuminate\Support\Facades\Log;
|
||||||
|
use Carbon\Carbon;
|
||||||
|
use Modules\Webstatement\Models\AccountBalance;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Controller untuk mengelola laporan closing balance
|
||||||
|
* Menyediakan form input nomor rekening dan rentang tanggal
|
||||||
|
* serta menampilkan data closing balance berdasarkan filter
|
||||||
|
*/
|
||||||
|
class LaporanClosingBalanceController extends Controller
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* Menampilkan halaman utama laporan closing balance
|
||||||
|
* dengan form filter nomor rekening dan rentang tanggal
|
||||||
|
*
|
||||||
|
* @return \Illuminate\View\View
|
||||||
|
*/
|
||||||
|
public function index()
|
||||||
|
{
|
||||||
|
Log::info('Mengakses halaman laporan closing balance');
|
||||||
|
|
||||||
|
return view('webstatement::laporan-closing-balance.index');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Mengambil data laporan closing balance berdasarkan filter
|
||||||
|
* yang dikirim melalui AJAX untuk datatables
|
||||||
|
*
|
||||||
|
* @param Request $request
|
||||||
|
* @return \Illuminate\Http\JsonResponse
|
||||||
|
*/
|
||||||
|
public function dataForDatatables(Request $request)
|
||||||
|
{
|
||||||
|
Log::info('Mengambil data untuk datatables laporan closing balance', [
|
||||||
|
'filters' => $request->all()
|
||||||
|
]);
|
||||||
|
|
||||||
|
try {
|
||||||
|
DB::beginTransaction();
|
||||||
|
|
||||||
|
$query = AccountBalance::query();
|
||||||
|
|
||||||
|
// Filter berdasarkan nomor rekening jika ada
|
||||||
|
if ($request->filled('account_number')) {
|
||||||
|
$query->where('account_number', 'like', '%' . $request->account_number . '%');
|
||||||
|
Log::info('Filter nomor rekening diterapkan', ['account_number' => $request->account_number]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Filter berdasarkan rentang tanggal jika ada
|
||||||
|
if ($request->filled('start_date') && $request->filled('end_date')) {
|
||||||
|
$startDate = Carbon::parse($request->start_date)->format('Ymd');
|
||||||
|
$endDate = Carbon::parse($request->end_date)->format('Ymd');
|
||||||
|
|
||||||
|
$query->whereBetween('period', [$startDate, $endDate]);
|
||||||
|
Log::info('Filter rentang tanggal diterapkan', [
|
||||||
|
'start_date' => $startDate,
|
||||||
|
'end_date' => $endDate
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sorting
|
||||||
|
$sortColumn = $request->get('sort', 'period');
|
||||||
|
$sortDirection = $request->get('direction', 'desc');
|
||||||
|
$query->orderBy($sortColumn, $sortDirection);
|
||||||
|
|
||||||
|
// Pagination
|
||||||
|
$perPage = $request->get('per_page', 10);
|
||||||
|
$page = $request->get('page', 1);
|
||||||
|
|
||||||
|
$results = $query->paginate($perPage, ['*'], 'page', $page);
|
||||||
|
|
||||||
|
DB::commit();
|
||||||
|
|
||||||
|
Log::info('Data laporan closing balance berhasil diambil', [
|
||||||
|
'total' => $results->total(),
|
||||||
|
'per_page' => $perPage,
|
||||||
|
'current_page' => $page
|
||||||
|
]);
|
||||||
|
|
||||||
|
return response()->json([
|
||||||
|
'data' => $results->items(),
|
||||||
|
'pagination' => [
|
||||||
|
'current_page' => $results->currentPage(),
|
||||||
|
'last_page' => $results->lastPage(),
|
||||||
|
'per_page' => $results->perPage(),
|
||||||
|
'total' => $results->total(),
|
||||||
|
'from' => $results->firstItem(),
|
||||||
|
'to' => $results->lastItem()
|
||||||
|
]
|
||||||
|
]);
|
||||||
|
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
DB::rollback();
|
||||||
|
|
||||||
|
Log::error('Error saat mengambil data laporan closing balance', [
|
||||||
|
'error' => $e->getMessage(),
|
||||||
|
'trace' => $e->getTraceAsString()
|
||||||
|
]);
|
||||||
|
|
||||||
|
return response()->json([
|
||||||
|
'error' => 'Terjadi kesalahan saat mengambil data laporan',
|
||||||
|
'message' => $e->getMessage()
|
||||||
|
], 500);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Export data laporan closing balance ke format Excel
|
||||||
|
*
|
||||||
|
* @param Request $request
|
||||||
|
* @return \Illuminate\Http\Response
|
||||||
|
*/
|
||||||
|
public function export(Request $request)
|
||||||
|
{
|
||||||
|
Log::info('Export laporan closing balance dimulai', [
|
||||||
|
'filters' => $request->all()
|
||||||
|
]);
|
||||||
|
|
||||||
|
try {
|
||||||
|
DB::beginTransaction();
|
||||||
|
|
||||||
|
$query = AccountBalance::query();
|
||||||
|
|
||||||
|
// Terapkan filter yang sama seperti di datatables
|
||||||
|
if ($request->filled('account_number')) {
|
||||||
|
$query->where('account_number', 'like', '%' . $request->account_number . '%');
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($request->filled('start_date') && $request->filled('end_date')) {
|
||||||
|
$startDate = Carbon::parse($request->start_date)->format('Ymd');
|
||||||
|
$endDate = Carbon::parse($request->end_date)->format('Ymd');
|
||||||
|
$query->whereBetween('period', [$startDate, $endDate]);
|
||||||
|
}
|
||||||
|
|
||||||
|
$data = $query->orderBy('period', 'desc')->get();
|
||||||
|
|
||||||
|
DB::commit();
|
||||||
|
|
||||||
|
Log::info('Export laporan closing balance berhasil', [
|
||||||
|
'total_records' => $data->count()
|
||||||
|
]);
|
||||||
|
|
||||||
|
// Generate CSV content
|
||||||
|
$csvContent = "Nomor Rekening,Periode,Saldo Aktual,Saldo Cleared,Tanggal Update\n";
|
||||||
|
|
||||||
|
foreach ($data as $item) {
|
||||||
|
$csvContent .= sprintf(
|
||||||
|
"%s,%s,%s,%s,%s\n",
|
||||||
|
$item->account_number,
|
||||||
|
$item->period,
|
||||||
|
number_format($item->actual_balance, 2),
|
||||||
|
number_format($item->cleared_balance, 2),
|
||||||
|
$item->updated_at ? $item->updated_at->format('Y-m-d H:i:s') : '-'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
$filename = 'laporan_closing_balance_' . date('Y-m-d_H-i-s') . '.csv';
|
||||||
|
|
||||||
|
return response($csvContent)
|
||||||
|
->header('Content-Type', 'text/csv')
|
||||||
|
->header('Content-Disposition', 'attachment; filename="' . $filename . '"');
|
||||||
|
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
DB::rollback();
|
||||||
|
|
||||||
|
Log::error('Error saat export laporan closing balance', [
|
||||||
|
'error' => $e->getMessage(),
|
||||||
|
'trace' => $e->getTraceAsString()
|
||||||
|
]);
|
||||||
|
|
||||||
|
return response()->json([
|
||||||
|
'error' => 'Terjadi kesalahan saat export laporan',
|
||||||
|
'message' => $e->getMessage()
|
||||||
|
], 500);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Menampilkan detail laporan closing balance untuk periode tertentu
|
||||||
|
*
|
||||||
|
* @param string $accountNumber
|
||||||
|
* @param string $period
|
||||||
|
* @return \Illuminate\View\View
|
||||||
|
*/
|
||||||
|
public function show($accountNumber, $period)
|
||||||
|
{
|
||||||
|
Log::info('Menampilkan detail laporan closing balance', [
|
||||||
|
'account_number' => $accountNumber,
|
||||||
|
'period' => $period
|
||||||
|
]);
|
||||||
|
|
||||||
|
try {
|
||||||
|
DB::beginTransaction();
|
||||||
|
|
||||||
|
$closingBalance = AccountBalance::where('account_number', $accountNumber)
|
||||||
|
->where('period', $period)
|
||||||
|
->firstOrFail();
|
||||||
|
|
||||||
|
DB::commit();
|
||||||
|
|
||||||
|
Log::info('Detail laporan closing balance berhasil diambil', [
|
||||||
|
'account_number' => $accountNumber,
|
||||||
|
'period' => $period,
|
||||||
|
'balance' => $closingBalance->actual_balance
|
||||||
|
]);
|
||||||
|
|
||||||
|
return view('webstatement::laporan-closing-balance.show', [
|
||||||
|
'closingBalance' => $closingBalance
|
||||||
|
]);
|
||||||
|
|
||||||
|
} catch (\Exception $e) {
|
||||||
|
DB::rollback();
|
||||||
|
|
||||||
|
Log::error('Error saat menampilkan detail laporan closing balance', [
|
||||||
|
'account_number' => $accountNumber,
|
||||||
|
'period' => $period,
|
||||||
|
'error' => $e->getMessage()
|
||||||
|
]);
|
||||||
|
|
||||||
|
return redirect()->route('laporan-closing-balance.index')
|
||||||
|
->with('error', 'Data laporan closing balance tidak ditemukan');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
322
resources/views/laporan-closing-balance/index.blade.php
Normal file
322
resources/views/laporan-closing-balance/index.blade.php
Normal file
@@ -0,0 +1,322 @@
|
|||||||
|
@extends('layouts.main')
|
||||||
|
|
||||||
|
@section('breadcrumbs')
|
||||||
|
{{ Breadcrumbs::render('laporan-closing-balance.index') }}
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div class="grid">
|
||||||
|
<div class="card card-grid min-w-full" data-datatable="false" data-datatable-page-size="10" data-datatable-state-save="false" id="laporan-closing-balance-table" data-api-url="{{ route('laporan-closing-balance.datatables') }}">
|
||||||
|
<div class="card-header py-5 flex-wrap">
|
||||||
|
<h3 class="card-title">
|
||||||
|
Laporan Closing Balance
|
||||||
|
</h3>
|
||||||
|
<div class="flex flex-wrap gap-2 lg:gap-5">
|
||||||
|
<!-- Filter Form -->
|
||||||
|
<div class="flex flex-wrap gap-2.5 items-end">
|
||||||
|
<!-- Nomor Rekening Filter -->
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-700 mb-1">Nomor Rekening</label>
|
||||||
|
<input type="text" id="account-number-filter" class="input w-[200px]" placeholder="Masukkan nomor rekening">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tanggal Mulai Filter -->
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-700 mb-1">Tanggal Mulai</label>
|
||||||
|
<input type="date" id="start-date-filter" class="input w-[150px]">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tanggal Akhir Filter -->
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-700 mb-1">Tanggal Akhir</label>
|
||||||
|
<input type="date" id="end-date-filter" class="input w-[150px]">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tombol Filter -->
|
||||||
|
<button type="button" id="apply-filter" class="btn btn-primary">
|
||||||
|
<i class="ki-filled ki-magnifier"></i>
|
||||||
|
Filter
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Tombol Reset -->
|
||||||
|
<button type="button" id="reset-filter" class="btn btn-light">
|
||||||
|
<i class="ki-filled ki-arrows-circle"></i>
|
||||||
|
Reset
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-wrap gap-2.5">
|
||||||
|
<div class="h-[24px] border border-r-gray-200"></div>
|
||||||
|
<a class="btn btn-light" href="{{ route('laporan-closing-balance.export') }}" id="export-btn">
|
||||||
|
<i class="ki-filled ki-file-down"></i>
|
||||||
|
Export to CSV
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="scrollable-x-auto">
|
||||||
|
<table class="table table-auto table-border align-middle text-gray-700 font-medium text-sm" data-datatable-table="true">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th class="w-14">
|
||||||
|
<input class="checkbox checkbox-sm" data-datatable-check="true" type="checkbox"/>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[200px]" data-datatable-column="account_number">
|
||||||
|
<span class="sort">
|
||||||
|
<span class="sort-label">Nomor Rekening</span>
|
||||||
|
<span class="sort-icon"></span>
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[150px]" data-datatable-column="period">
|
||||||
|
<span class="sort">
|
||||||
|
<span class="sort-label">Periode</span>
|
||||||
|
<span class="sort-icon"></span>
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[150px]" data-datatable-column="cleared_balance">
|
||||||
|
<span class="sort">
|
||||||
|
<span class="sort-label">Saldo Cleared</span>
|
||||||
|
<span class="sort-icon"></span>
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[150px]" data-datatable-column="actual_balance">
|
||||||
|
<span class="sort">
|
||||||
|
<span class="sort-label">Saldo Akhir</span>
|
||||||
|
<span class="sort-icon"></span>
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[150px]" data-datatable-column="updated_at">
|
||||||
|
<span class="sort">
|
||||||
|
<span class="sort-label">Tanggal Update</span>
|
||||||
|
<span class="sort-icon"></span>
|
||||||
|
</span>
|
||||||
|
</th>
|
||||||
|
<th class="min-w-[100px] text-center" data-datatable-column="actions">Action</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer justify-center md:justify-between flex-col md:flex-row gap-3 text-gray-600 text-2sm font-medium">
|
||||||
|
<div class="flex items-center gap-2">
|
||||||
|
Show
|
||||||
|
<select class="select select-sm w-16" data-datatable-size="true" name="perpage"></select> per page
|
||||||
|
</div>
|
||||||
|
<div class="flex items-center gap-4">
|
||||||
|
<span data-datatable-info="true"></span>
|
||||||
|
<div class="pagination" data-datatable-pagination="true">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@push('scripts')
|
||||||
|
<script type="text/javascript">
|
||||||
|
/**
|
||||||
|
* Fungsi untuk memformat angka menjadi format mata uang
|
||||||
|
* @param {number} amount - Jumlah yang akan diformat
|
||||||
|
* @returns {string} - String yang sudah diformat
|
||||||
|
*/
|
||||||
|
function formatCurrency(amount) {
|
||||||
|
return new Intl.NumberFormat('id-ID', {
|
||||||
|
style: 'currency',
|
||||||
|
currency: 'IDR',
|
||||||
|
minimumFractionDigits: 2
|
||||||
|
}).format(amount);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk memformat periode dari format YYYYMMDD ke format yang lebih readable
|
||||||
|
* @param {string} period - Periode dalam format YYYYMMDD
|
||||||
|
* @returns {string} - Periode yang sudah diformat
|
||||||
|
*/
|
||||||
|
function formatPeriod(period) {
|
||||||
|
if (!period || period.length !== 8) return period;
|
||||||
|
|
||||||
|
const year = period.substring(0, 4);
|
||||||
|
const month = period.substring(4, 6);
|
||||||
|
const day = period.substring(6, 8);
|
||||||
|
|
||||||
|
return `${day}/${month}/${year}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk memformat tanggal
|
||||||
|
* @param {string} dateString - String tanggal
|
||||||
|
* @returns {string} - Tanggal yang sudah diformat
|
||||||
|
*/
|
||||||
|
function formatDate(dateString) {
|
||||||
|
if (!dateString) return '-';
|
||||||
|
|
||||||
|
const date = new Date(dateString);
|
||||||
|
return date.toLocaleDateString('id-ID', {
|
||||||
|
year: 'numeric',
|
||||||
|
month: '2-digit',
|
||||||
|
day: '2-digit',
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script type="module">
|
||||||
|
const element = document.querySelector('#laporan-closing-balance-table');
|
||||||
|
const accountNumberFilter = document.getElementById('account-number-filter');
|
||||||
|
const startDateFilter = document.getElementById('start-date-filter');
|
||||||
|
const endDateFilter = document.getElementById('end-date-filter');
|
||||||
|
const applyFilterBtn = document.getElementById('apply-filter');
|
||||||
|
const resetFilterBtn = document.getElementById('reset-filter');
|
||||||
|
const exportBtn = document.getElementById('export-btn');
|
||||||
|
|
||||||
|
const apiUrl = element.getAttribute('data-api-url');
|
||||||
|
|
||||||
|
// Konfigurasi DataTable
|
||||||
|
const dataTableOptions = {
|
||||||
|
apiEndpoint: apiUrl,
|
||||||
|
pageSize: 10,
|
||||||
|
columns: {
|
||||||
|
select: {
|
||||||
|
render: (item, data, context) => {
|
||||||
|
const checkbox = document.createElement('input');
|
||||||
|
checkbox.className = 'checkbox checkbox-sm';
|
||||||
|
checkbox.type = 'checkbox';
|
||||||
|
checkbox.value = data.id ? data.id.toString() : '';
|
||||||
|
checkbox.setAttribute('data-datatable-row-check', 'true');
|
||||||
|
return checkbox.outerHTML.trim();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
account_number: {
|
||||||
|
title: 'Nomor Rekening',
|
||||||
|
render: (item, data) => {
|
||||||
|
return `<span class="font-medium">${data.account_number || '-'}</span>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
period: {
|
||||||
|
title: 'Periode',
|
||||||
|
render: (item, data) => {
|
||||||
|
return `<span class="text-gray-700">${formatPeriod(data.period)}</span>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
cleared_balance: {
|
||||||
|
title: 'Saldo Cleared',
|
||||||
|
render: (item, data) => {
|
||||||
|
const amount = parseFloat(data.cleared_balance) || 0;
|
||||||
|
return `<span class="text-blue-600 font-medium">${formatCurrency(amount)}</span>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
actual_balance: {
|
||||||
|
title: 'Saldo Akhir',
|
||||||
|
render: (item, data) => {
|
||||||
|
const amount = parseFloat(data.actual_balance) || 0;
|
||||||
|
return `<span class="text-green-600 font-medium">${formatCurrency(amount)}</span>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
updated_at: {
|
||||||
|
title: 'Tanggal Update',
|
||||||
|
render: (item, data) => {
|
||||||
|
return `<span class="text-gray-600 text-sm">${formatDate(data.updated_at)}</span>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
title: 'Action',
|
||||||
|
render: (item, data) => {
|
||||||
|
return `<div class="flex flex-nowrap justify-center">
|
||||||
|
<a class="btn btn-sm btn-icon btn-clear btn-info"
|
||||||
|
href="{{ route('laporan-closing-balance.show', ['accountNumber' => '__ACCOUNT__', 'period' => '__PERIOD__']) }}"
|
||||||
|
.replace('__ACCOUNT__', data.account_number)
|
||||||
|
.replace('__PERIOD__', data.period)
|
||||||
|
title="Lihat Detail">
|
||||||
|
<i class="ki-outline ki-eye"></i>
|
||||||
|
</a>
|
||||||
|
</div>`;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
// Inisialisasi DataTable
|
||||||
|
let dataTable = new KTDataTable(element, dataTableOptions);
|
||||||
|
dataTable.showSpinner();
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk menerapkan filter
|
||||||
|
*/
|
||||||
|
function applyFilters() {
|
||||||
|
let filters = {};
|
||||||
|
|
||||||
|
if (accountNumberFilter.value.trim()) {
|
||||||
|
filters.account_number = accountNumberFilter.value.trim();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (startDateFilter.value) {
|
||||||
|
filters.start_date = startDateFilter.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (endDateFilter.value) {
|
||||||
|
filters.end_date = endDateFilter.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('Applying filters:', filters);
|
||||||
|
dataTable.search(filters);
|
||||||
|
|
||||||
|
// Update export URL dengan filter
|
||||||
|
updateExportUrl(filters);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk mereset filter
|
||||||
|
*/
|
||||||
|
function resetFilters() {
|
||||||
|
accountNumberFilter.value = '';
|
||||||
|
startDateFilter.value = '';
|
||||||
|
endDateFilter.value = '';
|
||||||
|
|
||||||
|
dataTable.search({});
|
||||||
|
updateExportUrl({});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk update URL export dengan parameter filter
|
||||||
|
*/
|
||||||
|
function updateExportUrl(filters) {
|
||||||
|
const baseUrl = '{{ route("laporan-closing-balance.export") }}';
|
||||||
|
const params = new URLSearchParams();
|
||||||
|
|
||||||
|
Object.keys(filters).forEach(key => {
|
||||||
|
if (filters[key]) {
|
||||||
|
params.append(key, filters[key]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const newUrl = params.toString() ? `${baseUrl}?${params.toString()}` : baseUrl;
|
||||||
|
exportBtn.href = newUrl;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Event listeners
|
||||||
|
applyFilterBtn.addEventListener('click', applyFilters);
|
||||||
|
resetFilterBtn.addEventListener('click', resetFilters);
|
||||||
|
|
||||||
|
// Auto apply filter saat enter di input
|
||||||
|
[accountNumberFilter, startDateFilter, endDateFilter].forEach(input => {
|
||||||
|
input.addEventListener('keypress', function(e) {
|
||||||
|
if (e.key === 'Enter') {
|
||||||
|
applyFilters();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set default date range (last 30 days)
|
||||||
|
const today = new Date();
|
||||||
|
const thirtyDaysAgo = new Date(today.getTime() - (30 * 24 * 60 * 60 * 1000));
|
||||||
|
|
||||||
|
endDateFilter.value = today.toISOString().split('T')[0];
|
||||||
|
startDateFilter.value = thirtyDaysAgo.toISOString().split('T')[0];
|
||||||
|
|
||||||
|
// Apply default filter
|
||||||
|
setTimeout(() => {
|
||||||
|
applyFilters();
|
||||||
|
}, 100);
|
||||||
|
</script>
|
||||||
|
@endpush
|
||||||
291
resources/views/laporan-closing-balance/show.blade.php
Normal file
291
resources/views/laporan-closing-balance/show.blade.php
Normal file
@@ -0,0 +1,291 @@
|
|||||||
|
@extends('layouts.main')
|
||||||
|
|
||||||
|
@section('breadcrumbs')
|
||||||
|
{{ Breadcrumbs::render('laporan-closing-balance.show', $closingBalance) }}
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div class="grid">
|
||||||
|
<!-- Header Card -->
|
||||||
|
<div class="card mb-5">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">
|
||||||
|
Detail Laporan Closing Balance
|
||||||
|
</h3>
|
||||||
|
<div class="flex items-center gap-2">
|
||||||
|
<a href="{{ route('laporan-closing-balance.index') }}" class="btn btn-light">
|
||||||
|
<i class="ki-filled ki-left"></i>
|
||||||
|
Kembali
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Detail Information Card -->
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">
|
||||||
|
Informasi Rekening
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||||
|
<!-- Informasi Dasar -->
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-600 mb-1">Nomor Rekening</label>
|
||||||
|
<div class="text-lg font-semibold text-gray-900">
|
||||||
|
{{ $closingBalance->account_number }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-600 mb-1">Periode</label>
|
||||||
|
<div class="text-lg font-semibold text-gray-900">
|
||||||
|
@php
|
||||||
|
$period = $closingBalance->period;
|
||||||
|
if (strlen($period) === 8) {
|
||||||
|
$formatted = substr($period, 6, 2) . '/' . substr($period, 4, 2) . '/' . substr($period, 0, 4);
|
||||||
|
echo $formatted;
|
||||||
|
} else {
|
||||||
|
echo $period;
|
||||||
|
}
|
||||||
|
@endphp
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-600 mb-1">Tanggal Update Terakhir</label>
|
||||||
|
<div class="text-lg font-semibold text-gray-900">
|
||||||
|
{{ $closingBalance->updated_at ? $closingBalance->updated_at->format('d/m/Y H:i:s') : '-' }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Informasi Saldo -->
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="bg-blue-50 p-4 rounded-lg border border-blue-200">
|
||||||
|
<label class="text-sm font-medium text-blue-700 mb-2 block">Saldo Cleared</label>
|
||||||
|
<div class="text-2xl font-bold text-blue-800">
|
||||||
|
@php
|
||||||
|
$clearedBalance = $closingBalance->cleared_balance ?? 0;
|
||||||
|
echo 'Rp ' . number_format($clearedBalance, 2, ',', '.');
|
||||||
|
@endphp
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-green-50 p-4 rounded-lg border border-green-200">
|
||||||
|
<label class="text-sm font-medium text-green-700 mb-2 block">Saldo Aktual</label>
|
||||||
|
<div class="text-2xl font-bold text-green-800">
|
||||||
|
@php
|
||||||
|
$actualBalance = $closingBalance->actual_balance ?? 0;
|
||||||
|
echo 'Rp ' . number_format($actualBalance, 2, ',', '.');
|
||||||
|
@endphp
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-gray-50 p-4 rounded-lg border border-gray-200">
|
||||||
|
<label class="text-sm font-medium text-gray-700 mb-2 block">Selisih Saldo</label>
|
||||||
|
<div class="text-2xl font-bold {{ ($actualBalance - $clearedBalance) >= 0 ? 'text-green-800' : 'text-red-800' }}">
|
||||||
|
@php
|
||||||
|
$difference = $actualBalance - $clearedBalance;
|
||||||
|
$sign = $difference >= 0 ? '+' : '';
|
||||||
|
echo $sign . 'Rp ' . number_format($difference, 2, ',', '.');
|
||||||
|
@endphp
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Additional Information Card -->
|
||||||
|
@if($closingBalance->created_at || $closingBalance->updated_at)
|
||||||
|
<div class="card mt-5">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">
|
||||||
|
Informasi Sistem
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||||
|
@if($closingBalance->created_at)
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-600 mb-1">Tanggal Dibuat</label>
|
||||||
|
<div class="text-base text-gray-900">
|
||||||
|
{{ $closingBalance->created_at->format('d/m/Y H:i:s') }}
|
||||||
|
</div>
|
||||||
|
<div class="text-sm text-gray-500">
|
||||||
|
{{ $closingBalance->created_at->diffForHumans() }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
|
||||||
|
@if($closingBalance->updated_at)
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="text-sm font-medium text-gray-600 mb-1">Tanggal Diperbarui</label>
|
||||||
|
<div class="text-base text-gray-900">
|
||||||
|
{{ $closingBalance->updated_at->format('d/m/Y H:i:s') }}
|
||||||
|
</div>
|
||||||
|
<div class="text-sm text-gray-500">
|
||||||
|
{{ $closingBalance->updated_at->diffForHumans() }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
|
||||||
|
<!-- Action Buttons -->
|
||||||
|
<div class="card mt-5">
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="flex flex-wrap gap-3 justify-center lg:justify-start">
|
||||||
|
<a href="{{ route('laporan-closing-balance.index') }}" class="btn btn-light">
|
||||||
|
<i class="ki-filled ki-left"></i>
|
||||||
|
Kembali ke Daftar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="{{ route('laporan-closing-balance.export', ['account_number' => $closingBalance->account_number, 'start_date' => $closingBalance->period, 'end_date' => $closingBalance->period]) }}"
|
||||||
|
class="btn btn-primary">
|
||||||
|
<i class="ki-filled ki-file-down"></i>
|
||||||
|
Export Data Ini
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<button type="button" class="btn btn-info" onclick="window.print()">
|
||||||
|
<i class="ki-filled ki-printer"></i>
|
||||||
|
Print
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@push('styles')
|
||||||
|
<style>
|
||||||
|
/* Print styles */
|
||||||
|
@media print {
|
||||||
|
.btn, .card-header .flex, nav, .breadcrumb {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
box-shadow: none !important;
|
||||||
|
border: 1px solid #ddd !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-body {
|
||||||
|
padding: 1rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-size: 12px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-2xl {
|
||||||
|
font-size: 1.5rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-lg {
|
||||||
|
font-size: 1.125rem !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
@endpush
|
||||||
|
|
||||||
|
@push('scripts')
|
||||||
|
<script type="text/javascript">
|
||||||
|
/**
|
||||||
|
* Fungsi untuk memformat angka menjadi format mata uang Indonesia
|
||||||
|
* @param {number} amount - Jumlah yang akan diformat
|
||||||
|
* @returns {string} - String yang sudah diformat
|
||||||
|
*/
|
||||||
|
function formatCurrency(amount) {
|
||||||
|
return new Intl.NumberFormat('id-ID', {
|
||||||
|
style: 'currency',
|
||||||
|
currency: 'IDR',
|
||||||
|
minimumFractionDigits: 2
|
||||||
|
}).format(amount);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fungsi untuk copy nomor rekening ke clipboard
|
||||||
|
*/
|
||||||
|
function copyAccountNumber() {
|
||||||
|
const accountNumber = '{{ $closingBalance->account_number }}';
|
||||||
|
|
||||||
|
if (navigator.clipboard) {
|
||||||
|
navigator.clipboard.writeText(accountNumber).then(function() {
|
||||||
|
// Show success message
|
||||||
|
if (typeof Swal !== 'undefined') {
|
||||||
|
Swal.fire({
|
||||||
|
icon: 'success',
|
||||||
|
title: 'Berhasil!',
|
||||||
|
text: 'Nomor rekening berhasil disalin ke clipboard',
|
||||||
|
timer: 2000,
|
||||||
|
showConfirmButton: false
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
alert('Nomor rekening berhasil disalin ke clipboard');
|
||||||
|
}
|
||||||
|
}).catch(function(err) {
|
||||||
|
console.error('Error copying to clipboard: ', err);
|
||||||
|
fallbackCopyTextToClipboard(accountNumber);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
fallbackCopyTextToClipboard(accountNumber);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fallback function untuk copy text jika clipboard API tidak tersedia
|
||||||
|
*/
|
||||||
|
function fallbackCopyTextToClipboard(text) {
|
||||||
|
const textArea = document.createElement('textarea');
|
||||||
|
textArea.value = text;
|
||||||
|
|
||||||
|
// Avoid scrolling to bottom
|
||||||
|
textArea.style.top = '0';
|
||||||
|
textArea.style.left = '0';
|
||||||
|
textArea.style.position = 'fixed';
|
||||||
|
|
||||||
|
document.body.appendChild(textArea);
|
||||||
|
textArea.focus();
|
||||||
|
textArea.select();
|
||||||
|
|
||||||
|
try {
|
||||||
|
const successful = document.execCommand('copy');
|
||||||
|
if (successful) {
|
||||||
|
if (typeof Swal !== 'undefined') {
|
||||||
|
Swal.fire({
|
||||||
|
icon: 'success',
|
||||||
|
title: 'Berhasil!',
|
||||||
|
text: 'Nomor rekening berhasil disalin ke clipboard',
|
||||||
|
timer: 2000,
|
||||||
|
showConfirmButton: false
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
alert('Nomor rekening berhasil disalin ke clipboard');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.error('Fallback: Copying text command was unsuccessful');
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Fallback: Oops, unable to copy', err);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.body.removeChild(textArea);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add click event to account number for easy copying
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const accountNumberElements = document.querySelectorAll('.account-number-clickable');
|
||||||
|
accountNumberElements.forEach(element => {
|
||||||
|
element.style.cursor = 'pointer';
|
||||||
|
element.title = 'Klik untuk menyalin nomor rekening';
|
||||||
|
element.addEventListener('click', copyAccountNumber);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
@endpush
|
||||||
@@ -125,3 +125,18 @@
|
|||||||
$trail->parent('home');
|
$trail->parent('home');
|
||||||
$trail->push('Statement Email Logs', route('email-statement-logs.index'));
|
$trail->push('Statement Email Logs', route('email-statement-logs.index'));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Home > Laporan Closing Balance
|
||||||
|
Breadcrumbs::for('laporan-closing-balance.index', function (BreadcrumbTrail $trail) {
|
||||||
|
$trail->parent('home');
|
||||||
|
$trail->push('Laporan Closing Balance', route('laporan-closing-balance.index'));
|
||||||
|
});
|
||||||
|
|
||||||
|
// Home > Laporan Closing Balance > Detail
|
||||||
|
Breadcrumbs::for('laporan-closing-balance.show', function (BreadcrumbTrail $trail, $closingBalance) {
|
||||||
|
$trail->parent('laporan-closing-balance.index');
|
||||||
|
$trail->push('Detail - ' . $closingBalance->account_number, route('laporan-closing-balance.show', [
|
||||||
|
'accountNumber' => $closingBalance->account_number,
|
||||||
|
'period' => $closingBalance->period
|
||||||
|
]));
|
||||||
|
});
|
||||||
|
|||||||
@@ -1,18 +1,20 @@
|
|||||||
<?php
|
<?php
|
||||||
|
|
||||||
use Illuminate\Support\Facades\Route;
|
use Illuminate\Support\Facades\Route;
|
||||||
use Modules\Webstatement\Http\Controllers\PeriodeStatementController;
|
use Modules\Webstatement\Http\Controllers\{
|
||||||
use Modules\Webstatement\Http\Controllers\PrintStatementController;
|
PeriodeStatementController,
|
||||||
use Modules\Webstatement\Http\Controllers\SyncLogsController;
|
PrintStatementController,
|
||||||
use Modules\Webstatement\Http\Controllers\JenisKartuController;
|
SyncLogsController,
|
||||||
use Modules\Webstatement\Http\Controllers\KartuAtmController;
|
JenisKartuController,
|
||||||
use Modules\Webstatement\Http\Controllers\MigrasiController;
|
KartuAtmController,
|
||||||
use Modules\Webstatement\Http\Controllers\CustomerController;
|
CustomerController,
|
||||||
use Modules\Webstatement\Http\Controllers\EmailBlastController;
|
EmailBlastController,
|
||||||
use Modules\Webstatement\Http\Controllers\WebstatementController;
|
WebstatementController,
|
||||||
use Modules\Webstatement\Http\Controllers\DebugStatementController;
|
DebugStatementController,
|
||||||
use Modules\Webstatement\Http\Controllers\EmailStatementLogController;
|
EmailStatementLogController,
|
||||||
use Modules\Webstatement\Http\Controllers\AtmTransactionReportController;
|
AtmTransactionReportController,
|
||||||
|
LaporanClosingBalanceController
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -91,7 +93,7 @@ Route::middleware(['auth'])->group(function () {
|
|||||||
});
|
});
|
||||||
|
|
||||||
Route::resource('statements', PrintStatementController::class);
|
Route::resource('statements', PrintStatementController::class);
|
||||||
|
|
||||||
|
|
||||||
// ATM Transaction Report Routes
|
// ATM Transaction Report Routes
|
||||||
Route::group(['prefix' => 'atm-reports', 'as' => 'atm-reports.', 'middleware' => ['auth']], function () {
|
Route::group(['prefix' => 'atm-reports', 'as' => 'atm-reports.', 'middleware' => ['auth']], function () {
|
||||||
@@ -110,6 +112,14 @@ Route::middleware(['auth'])->group(function () {
|
|||||||
Route::post('/{id}/resend-email', [EmailStatementLogController::class, 'resendEmail'])->name('resend-email');
|
Route::post('/{id}/resend-email', [EmailStatementLogController::class, 'resendEmail'])->name('resend-email');
|
||||||
});
|
});
|
||||||
Route::resource('email-statement-logs', EmailStatementLogController::class)->only(['index', 'show']);
|
Route::resource('email-statement-logs', EmailStatementLogController::class)->only(['index', 'show']);
|
||||||
|
|
||||||
|
// Laporan Closing Balance Routes
|
||||||
|
Route::group(['prefix' => 'laporan-closing-balance', 'as' => 'laporan-closing-balance.', 'middleware' => ['auth']], function () {
|
||||||
|
Route::get('/datatables', [LaporanClosingBalanceController::class, 'dataForDatatables'])->name('datatables');
|
||||||
|
Route::get('/export', [LaporanClosingBalanceController::class, 'export'])->name('export');
|
||||||
|
Route::get('/{accountNumber}/{period}', [LaporanClosingBalanceController::class, 'show'])->name('show');
|
||||||
|
});
|
||||||
|
Route::resource('laporan-closing-balance', LaporanClosingBalanceController::class)->only(['index']);
|
||||||
});
|
});
|
||||||
|
|
||||||
Route::get('/stmt-export-csv', [WebstatementController::class, 'index'])->name('webstatement.index');
|
Route::get('/stmt-export-csv', [WebstatementController::class, 'index'])->name('webstatement.index');
|
||||||
|
|||||||
Reference in New Issue
Block a user