```

feat(sync-logs): tambah fitur sinkronisasi log biaya kartu

- Menambahkan route, controller, model, dan migration untuk fitur baru `sync-logs`.
- Mengganti referensi `BiayaKartuController` menjadi `SyncLogsController`.
- Menyediakan halaman untuk menampilkan data log sinkronisasi dengan filter, pencarian, dan pagination.
- Menambahkan kemampuan melihat detail proses sinkronisasi langsung dari modal.
- Memperbarui `module.json` dengan item menu baru untuk fitur log sinkronisasi.
- Menghapus `BiayaKartuController` yang sudah tidak digunakan lagi.
```

Signed-off-by: Daeng Deni Mardaeni <ddeni05@gmail.com>

app/Http/Controllers/BiayaKartuController.php

@@ -1,29 +0,0 @@
-<?php
-
-    namespace Modules\Webstatement\Http\Controllers;
-
-    use App\Http\Controllers\Controller;
-    use Illuminate\Http\Request;
-    use Modules\Webstatement\Jobs\GenerateBiayaKartuCsvJob;
-    use Modules\Webstatement\Models\Atmcard;
-    use RuntimeException;
-
-    class BiayaKartuController extends Controller
-    {
-        /**
-         * Display a listing of the resource.
-         */
-        public function index()
-        {
-            // Memicu job untuk dijalankan dan menunggu hasilnya
-            $job = new GenerateBiayaKartuCsvJob();
-            $filename = $job->handle();
-
-            // Alternatif jika Anda ingin menjalankannya secara asinkron
-            // GenerateBiayaAtmCsvJob::dispatch();
-            // return response()->json(['message' => 'Proses pembuatan file CSV sedang berjalan di background']);
-
-            return response()->download($filename)->deleteFileAfterSend(true);
-
-        }
-    }

app/Http/Controllers/SyncLogsController.php

@@ -0,0 +1,126 @@
+<?php
+
+namespace Modules\Webstatement\Http\Controllers;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\File;
+use Carbon\Carbon;
+use Modules\Webstatement\Jobs\GenerateBiayaKartuCsvJob;
+use Modules\Webstatement\Models\KartuSyncLog;
+
+class SyncLogsController extends Controller
+{
+    /**
+     * Display a listing of the resource.
+     */
+    public function index()
+    {
+        return view('webstatement::sync-logs.index');
+    }
+
+    /**
+     * Provide data for datatables - sync logs
+     */
+    public function dataForDatatables(Request $request)
+    {
+        // Retrieve data from the database
+        $query = KartuSyncLog::query();
+
+        // Apply search filter if provided
+        if ($request->has('search') && !empty($request->get('search'))) {
+            $search = $request->get('search');
+            $query->where(function ($q) use ($search) {
+                $q->where('periode', 'LIKE', "%$search%")
+                  ->orWhere('sync_notes', 'LIKE', "%$search%")
+                  ->orWhere('csv_notes', 'LIKE', "%$search%")
+                  ->orWhere('ftp_notes', 'LIKE', "%$search%")
+                  ->orWhere('file_name', 'LIKE', "%$search%");
+            });
+        }
+
+        // Apply filter for sync status if provided
+        if ($request->has('is_sync') && $request->get('is_sync') !== '') {
+            $query->where('is_sync', $request->get('is_sync') == '1');
+        }
+
+        // Apply filter for CSV status if provided
+        if ($request->has('is_csv') && $request->get('is_csv') !== '') {
+            $query->where('is_csv', $request->get('is_csv') == '1');
+        }
+
+        // Apply filter for FTP status if provided
+        if ($request->has('is_ftp') && $request->get('is_ftp') !== '') {
+            $query->where('is_ftp', $request->get('is_ftp') == '1');
+        }
+
+        // Apply sorting if provided
+        if ($request->has('sortOrder') && !empty($request->get('sortOrder'))) {
+            $order  = $request->get('sortOrder');
+            $column = $request->get('sortField');
+            $query->orderBy($column, $order);
+        } else {
+            // Default sort by created_at descending
+            $query->orderBy('created_at', 'desc');
+        }
+
+        // Get the total count of records
+        $totalRecords = $query->count();
+
+        // Apply pagination if provided
+        if ($request->has('page') && $request->has('size')) {
+            $page   = $request->get('page');
+            $size   = $request->get('size');
+            $offset = ($page - 1) * $size;
+
+            $query->skip($offset)->take($size);
+        }
+
+        // Get the filtered count of records
+        $filteredRecords = $query->count();
+
+        // Get the data for the current page
+        $data = $query->get();
+
+        // Calculate the page count
+        $pageCount = ceil($filteredRecords / ($request->get('size') ?: 1));
+
+        // Calculate the current page number
+        $currentPage = $request->get('page') ?: 1;
+
+        // Return the response data as a JSON object
+        return response()->json([
+            'draw'            => $request->get('draw'),
+            'recordsTotal'    => $totalRecords,
+            'recordsFiltered' => $filteredRecords,
+            'pageCount'       => $pageCount,
+            'page'            => $currentPage,
+            'totalCount'      => $totalRecords,
+            'data'            => $data,
+        ]);
+    }
+
+    /**
+     * Format file size to human readable format
+     */
+    private function formatSize($bytes)
+    {
+        $units = ['B', 'KB', 'MB', 'GB', 'TB'];
+
+        $bytes = max($bytes, 0);
+        $pow   = floor(($bytes ? log($bytes) : 0) / log(1024));
+        $pow   = min($pow, count($units) - 1);
+
+        $bytes /= pow(1024, $pow);
+
+        return round($bytes, 2) . ' ' . $units[$pow];
+    }
+
+    public function show($id){
+        $syncLog = KartuSyncLog::find($id);
+        $csvSize = $this->formatSize(File::size($syncLog->csv_path));
+        $ftpSize = $this->formatSize(File::size($syncLog->ftp_path));
+
+        return response()->json($syncLog, 200, ['Content-Type' => 'application/json'], JSON_PRETTY_PRINT);
+    }
+}

app/Models/KartuSyncLog.php

@@ -0,0 +1,119 @@
+<?php
+
+namespace Modules\Webstatement\Models;
+
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+
+class KartuSyncLog extends Model
+{
+    use HasFactory;
+
+    /**
+     * Nama tabel yang digunakan oleh model.
+     *
+     * @var string
+     */
+    protected $table = 'kartu_sync_logs';
+
+    /**
+     * Atribut yang dapat diisi secara massal.
+     *
+     * @var array<int, string>
+     */
+    protected $fillable = [
+        'periode',
+        'is_sync',
+        'is_csv',
+        'is_ftp',
+        'sync_at',
+        'csv_at',
+        'ftp_at',
+        'sync_notes',
+        'csv_notes',
+        'ftp_notes',
+        'total_records',
+        'success_records',
+        'failed_records',
+        'file_path',
+        'file_name',
+        'ftp_destination',
+    ];
+
+    /**
+     * Atribut yang harus diubah menjadi tipe native.
+     *
+     * @var array
+     */
+    protected $casts = [
+        'is_sync' => 'boolean',
+        'is_csv' => 'boolean',
+        'is_ftp' => 'boolean',
+        'sync_at' => 'datetime',
+        'csv_at' => 'datetime',
+        'ftp_at' => 'datetime',
+        'total_records' => 'integer',
+        'success_records' => 'integer',
+        'failed_records' => 'integer',
+    ];
+
+    /**
+     * Scope untuk mendapatkan log berdasarkan periode
+     *
+     * @param \Illuminate\Database\Eloquent\Builder $query
+     * @param string $periode Format: YYYY-MM
+     * @return \Illuminate\Database\Eloquent\Builder
+     */
+    public function scopeByPeriode($query, $periode)
+    {
+        return $query->where('periode', $periode);
+    }
+
+    /**
+     * Scope untuk mendapatkan log yang sudah sync
+     *
+     * @param \Illuminate\Database\Eloquent\Builder $query
+     * @return \Illuminate\Database\Eloquent\Builder
+     */
+    public function scopeSynced($query)
+    {
+        return $query->where('is_sync', true);
+    }
+
+    /**
+     * Scope untuk mendapatkan log yang sudah membuat CSV
+     *
+     * @param \Illuminate\Database\Eloquent\Builder $query
+     * @return \Illuminate\Database\Eloquent\Builder
+     */
+    public function scopeCsvGenerated($query)
+    {
+        return $query->where('is_csv', true);
+    }
+
+    /**
+     * Scope untuk mendapatkan log yang sudah upload FTP
+     *
+     * @param \Illuminate\Database\Eloquent\Builder $query
+     * @return \Illuminate\Database\Eloquent\Builder
+     */
+    public function scopeFtpUploaded($query)
+    {
+        return $query->where('is_ftp', true);
+    }
+
+    /**
+     * Scope untuk mendapatkan log yang belum selesai prosesnya
+     *
+     * @param \Illuminate\Database\Eloquent\Builder $query
+     * @return \Illuminate\Database\Eloquent\Builder
+     */
+    public function scopeIncomplete($query)
+    {
+        return $query->where(function ($q) {
+            $q->where('is_sync', false)
+              ->orWhere('is_csv', false)
+              ->orWhere('is_ftp', false);
+        });
+    }
+}

database/migrations/2025_05_10_133532_create_kartu_sync_logs_table.php

@@ -0,0 +1,48 @@
+<?php
+
+    use Illuminate\Database\Migrations\Migration;
+    use Illuminate\Database\Schema\Blueprint;
+    use Illuminate\Support\Facades\Schema;
+
+    return new class extends Migration {
+        /**
+         * Run the migrations.
+         */
+        public function up()
+        : void
+        {
+            Schema::create('kartu_sync_logs', function (Blueprint $table) {
+                $table->id();
+                $table->string('periode')->comment('Periode sinkronisasi (format: YYYY-MM)');
+                $table->boolean('is_sync')->default(false)->comment('Status sinkronisasi data');
+                $table->boolean('is_csv')->default(false)->comment('Status pembuatan file CSV');
+                $table->boolean('is_ftp')->default(false)->comment('Status upload ke FTP');
+                $table->timestamp('sync_at')->nullable()->comment('Waktu sinkronisasi');
+                $table->timestamp('csv_at')->nullable()->comment('Waktu pembuatan CSV');
+                $table->timestamp('ftp_at')->nullable()->comment('Waktu upload FTP');
+                $table->text('sync_notes')->nullable()->comment('Catatan sinkronisasi');
+                $table->text('csv_notes')->nullable()->comment('Catatan pembuatan CSV');
+                $table->text('ftp_notes')->nullable()->comment('Catatan upload FTP');
+                $table->integer('total_records')->default(0)->comment('Jumlah total rekaman');
+                $table->integer('success_records')->default(0)->comment('Jumlah rekaman berhasil');
+                $table->integer('failed_records')->default(0)->comment('Jumlah rekaman gagal');
+                $table->string('file_path')->nullable()->comment('Path file CSV yang dihasilkan');
+                $table->string('file_name')->nullable()->comment('Nama file CSV yang dihasilkan');
+                $table->string('ftp_destination')->nullable()->comment('Tujuan upload FTP');
+                $table->timestamps();
+
+                // Indeks untuk pencarian cepat
+                $table->index('periode');
+                $table->index(['is_sync', 'is_csv', 'is_ftp']);
+            });
+        }
+
+        /**
+         * Reverse the migrations.
+         */
+        public function down()
+        : void
+        {
+            Schema::dropIfExists('kartu_sync_logs');
+        }
+    };

module.json

@@ -77,6 +77,31 @@
                 "roles": []
             }
         ],
-        "system": []
+        "system": [
+            {
+                "title": "Logs",
+                "path": "logs",
+                "icon": "ki-filled ki-tablet-text-down text-lg text-primary",
+                "classes": "",
+                "attributes": [],
+                "permission": "",
+                "roles": [
+                    "administrator"
+                ],
+                "sub": [
+                    {
+                        "title": "Log Biaya Kartu",
+                        "path": "sync-logs",
+                        "icon": "ki-filled ki-credit-cart text-lg",
+                        "classes": "",
+                        "attributes": [],
+                        "permission": "",
+                        "roles": [
+                            "administrator"
+                        ]
+                    }
+                ]
+            }
+        ]
     }
 }

resources/views/sync-logs/index.blade.php

@@ -0,0 +1,347 @@
+
+@extends('layouts.main')
+
+@section('breadcrumbs')
+    {{ Breadcrumbs::render(request()->route()->getName()) }}
+@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="sync-logs-table" data-api-url="{{ route('sync-logs.datatables') }}">
+            <div class="card-header py-5 flex-wrap">
+                <h3 class="card-title">
+                    Log Sinkronisasi Data Kartu
+                </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 Sinkronisasi" id="search" type="text" value="">
+                        </label>
+                    </div>
+                    <div class="flex">
+                        <select class="select select-sm" id="filter-sync">
+                            <option value="">Status Sinkronisasi (Semua)</option>
+                            <option value="1">Sudah Sinkronisasi</option>
+                            <option value="0">Belum Sinkronisasi</option>
+                        </select>
+                    </div>
+                    <div class="flex">
+                        <select class="select select-sm" id="filter-csv">
+                            <option value="">Status CSV (Semua)</option>
+                            <option value="1">CSV Sudah Dibuat</option>
+                            <option value="0">CSV Belum Dibuat</option>
+                        </select>
+                    </div>
+                    <div class="flex">
+                        <select class="select select-sm" id="filter-ftp">
+                            <option value="">Status FTP (Semua)</option>
+                            <option value="1">Sudah Upload ke FTP</option>
+                            <option value="0">Belum Upload ke FTP</option>
+                        </select>
+                    </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="min-w-[100px]" data-datatable-column="periode">
+                                <span class="sort"> <span class="sort-label">Periode</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[100px]" data-datatable-column="is_sync">
+                                <span class="sort"> <span class="sort-label">Status Sinkronisasi</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[150px]" data-datatable-column="sync_at">
+                                <span class="sort"> <span class="sort-label">Waktu Sinkronisasi</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[100px]" data-datatable-column="is_csv">
+                                <span class="sort"> <span class="sort-label">Status CSV</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[150px]" data-datatable-column="csv_at">
+                                <span class="sort"> <span class="sort-label">Waktu Pembuatan CSV</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[100px]" data-datatable-column="is_ftp">
+                                <span class="sort"> <span class="sort-label">Status FTP</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[150px]" data-datatable-column="ftp_at">
+                                <span class="sort"> <span class="sort-label">Waktu Upload FTP</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[100px]" data-datatable-column="total_records">
+                                <span class="sort"> <span class="sort-label">Total Rekaman</span>
+                                    <span class="sort-icon"> </span> </span>
+                            </th>
+                            <th class="min-w-[150px]" data-datatable-column="file_name">
+                                <span class="sort"> <span class="sort-label">Nama File</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="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>
+
+    <!-- Modal for detail view -->
+    <div class="modal modal-open:!flex" data-modal="true" id="detail-modal">
+        <div class="modal-content pt-7.5 w-full container-fixed px-5 overflow-hidden">
+            <div class="modal-header">
+                <h2 class="modal-title">Detail Log Sinkronisasi</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="font-bold mb-2">Informasi Umum</h3>
+                    <div class="grid grid-cols-2 gap-2">
+                        <div>Periode:</div>
+                        <div id="detail-periode"></div>
+                        <div>Total Records:</div>
+                        <div id="detail-total-records"></div>
+                        <div>Sukses Records:</div>
+                        <div id="detail-success-records"></div>
+                        <div>Gagal Records:</div>
+                        <div id="detail-failed-records"></div>
+                    </div>
+                </div>
+
+                <div class="mb-5">
+                    <h3 class="font-bold mb-2">Status Sinkronisasi</h3>
+                    <div class="grid grid-cols-2 gap-2">
+                        <div>Status:</div>
+                        <div id="detail-sync-status"></div>
+                        <div>Waktu:</div>
+                        <div id="detail-sync-at"></div>
+                        <div>Catatan:</div>
+                        <div id="detail-sync-notes"></div>
+                    </div>
+                </div>
+
+                <div class="mb-5">
+                    <h3 class="font-bold mb-2">Status CSV</h3>
+                    <div class="grid grid-cols-2 gap-2">
+                        <div>Status:</div>
+                        <div id="detail-csv-status"></div>
+                        <div>Waktu:</div>
+                        <div id="detail-csv-at"></div>
+                        <div>Nama File:</div>
+                        <div id="detail-file-name"></div>
+                        <div>Catatan:</div>
+                        <div id="detail-csv-notes"></div>
+                    </div>
+                </div>
+
+                <div class="mb-5">
+                    <h3 class="font-bold mb-2">Status FTP</h3>
+                    <div class="grid grid-cols-2 gap-2">
+                        <div>Status:</div>
+                        <div id="detail-ftp-status"></div>
+                        <div>Waktu:</div>
+                        <div id="detail-ftp-at"></div>
+                        <div>Tujuan:</div>
+                        <div id="detail-ftp-destination"></div>
+                        <div>Catatan:</div>
+                        <div id="detail-ftp-notes"></div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection
+
+@push('scripts')
+    <script type="module">
+        const element = document.querySelector('#sync-logs-table');
+        const searchInput = document.getElementById('search');
+        const filterSync = document.getElementById('filter-sync');
+        const filterCsv = document.getElementById('filter-csv');
+        const filterFtp = document.getElementById('filter-ftp');
+        const detailModal = document.getElementById('detail-modal');
+        console.log(detailModal);
+
+        const apiUrl = element.getAttribute('data-api-url');
+        const dataTableOptions = {
+            apiEndpoint: apiUrl,
+            pageSize: 10,
+            columns: {
+                periode: {
+                    title: 'Periode',
+                },
+                is_sync: {
+                    title: 'Status Sinkronisasi',
+                    render: (item, data) => {
+                        return data.is_sync
+                            ? '<span class="badge badge-success">Sudah Sinkronisasi</span>'
+                            : '<span class="badge badge-warning">Belum Sinkronisasi</span>';
+                    },
+                },
+                sync_at: {
+                    title: 'Waktu Sinkronisasi',
+                    render: (item, data) => {
+                        return data.sync_at ? new Date(data.sync_at).toLocaleString('id-ID') : '-';
+                    },
+                },
+                is_csv: {
+                    title: 'Status CSV',
+                    render: (item, data) => {
+                        return data.is_csv
+                            ? '<span class="badge badge-success">CSV Dibuat</span>'
+                            : '<span class="badge badge-warning">Belum Dibuat</span>';
+                    },
+                },
+                csv_at: {
+                    title: 'Waktu Pembuatan CSV',
+                    render: (item, data) => {
+                        return data.csv_at ? new Date(data.csv_at).toLocaleString('id-ID') : '-';
+                    },
+                },
+                is_ftp: {
+                    title: 'Status FTP',
+                    render: (item, data) => {
+                        return data.is_ftp
+                            ? '<span class="badge badge-success">Uploaded ke FTP</span>'
+                            : '<span class="badge badge-warning">Belum Upload</span>';
+                    },
+                },
+                ftp_at: {
+                    title: 'Waktu Upload FTP',
+                    render: (item, data) => {
+                        return data.ftp_at ? new Date(data.ftp_at).toLocaleString('id-ID') : '-';
+                    },
+                },
+                total_records: {
+                    title: 'Total Rekaman',
+                },
+                file_name: {
+                    title: 'Nama File',
+                    render: (item, data) => {
+                        return data.file_name || '-';
+                    },
+                },
+                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>`;
+                        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 syncValue = filterSync.value;
+            const csvValue = filterCsv.value;
+            const ftpValue = filterFtp.value;
+
+            const params = {};
+            if (syncValue !== '') params.is_sync = syncValue;
+            if (csvValue !== '') params.is_csv = csvValue;
+            if (ftpValue !== '') params.is_ftp = ftpValue;
+
+            dataTable.goPage(1);
+            dataTable.setRequestParams(params);
+            dataTable.reload();
+        };
+
+        filterSync.addEventListener('change', applyFilters);
+        filterCsv.addEventListener('change', applyFilters);
+        filterFtp.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('sync-logs') }}/${id}`)
+                    .then(response => response.json())
+                    .then(data => {
+                        console.log(data);
+                        // Populate modal with data
+                        document.getElementById('detail-periode').textContent = data.periode;
+                        document.getElementById('detail-total-records').textContent = data.total_records;
+                        document.getElementById('detail-success-records').textContent = data.success_records;
+                        document.getElementById('detail-failed-records').textContent = data.failed_records;
+
+                        document.getElementById('detail-sync-status').innerHTML = data.is_sync
+                            ? '<span class="badge badge-success">Sudah Sinkronisasi</span>'
+                            : '<span class="badge badge-warning">Belum Sinkronisasi</span>';
+                        document.getElementById('detail-sync-at').textContent = data.sync_at
+                            ? new Date(data.sync_at).toLocaleString('id-ID')
+                            : '-';
+                        document.getElementById('detail-sync-notes').textContent = data.sync_notes || '-';
+
+                        document.getElementById('detail-csv-status').innerHTML = data.is_csv
+                            ? '<span class="badge badge-success">CSV Dibuat</span>'
+                            : '<span class="badge badge-warning">Belum Dibuat</span>';
+                        document.getElementById('detail-csv-at').textContent = data.csv_at
+                            ? new Date(data.csv_at).toLocaleString('id-ID')
+                            : '-';
+                        document.getElementById('detail-file-name').textContent = data.file_name || '-';
+                        document.getElementById('detail-csv-notes').textContent = data.csv_notes || '-';
+
+                        document.getElementById('detail-ftp-status').innerHTML = data.is_ftp
+                            ? '<span class="badge badge-success">Uploaded ke FTP</span>'
+                            : '<span class="badge badge-warning">Belum Upload</span>';
+                        document.getElementById('detail-ftp-at').textContent = data.ftp_at
+                            ? new Date(data.ftp_at).toLocaleString('id-ID')
+                            : '-';
+                        document.getElementById('detail-ftp-destination').textContent = data.ftp_destination || '-';
+                        document.getElementById('detail-ftp-notes').textContent = data.ftp_notes || '-';
+
+                        // 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');
+                    });
+            }
+        });
+
+        window.dataTable = dataTable;
+    </script>
+@endpush

routes/breadcrumbs.php

@@ -83,3 +83,8 @@
         $trail->parent('home');
         $trail->push('Kartu ATM', route('kartu-atm.index'));
     });
+
+    Breadcrumbs::for('sync-logs.index', function (BreadcrumbTrail $trail) {
+        $trail->parent('home');
+        $trail->push('Sync Logs Biaya Kartu', route('sync-logs.index'));
+    });

routes/web.php

@@ -1,7 +1,7 @@
 <?php
 
 use Illuminate\Support\Facades\Route;
-    use Modules\Webstatement\Http\Controllers\BiayaKartuController;
+    use Modules\Webstatement\Http\Controllers\SyncLogsController;
     use Modules\Webstatement\Http\Controllers\JenisKartuController;
     use Modules\Webstatement\Http\Controllers\KartuAtmController;
     use Modules\Webstatement\Http\Controllers\MigrasiController;
@@ -44,6 +44,11 @@ Route::middleware(['auth'])->group(function () {
     });
     Route::resource('kartu-atm', KartuAtmController::class)->only('index');
 
+    Route::prefix('sync-logs')->name('sync-logs.')->group(function () {
+        Route::get('datatables', [SyncLogsController::class, 'dataForDatatables'])->name('datatables');
+    });
+    Route::resource('sync-logs', SyncLogsController::class);
+
     Route::prefix('emailblast')->group(function () {
         Route::get('/', [EmailBlastController::class, 'index'])->name('emailblast.index');
         Route::get('/create', [EmailBlastController::class, 'create'])->name('emailblast.create');
@@ -54,6 +59,6 @@ Route::middleware(['auth'])->group(function () {
 });
 
 Route::get('migrasi', [MigrasiController::class, 'index'])->name('migrasi.index');
-Route::get('biaya-kartu', [BiayaKartuController::class, 'index'])->name('biaya-kartu.index');
+Route::get('biaya-kartu', [SyncLogsController::class, 'index'])->name('biaya-kartu.index');
 
 Route::get('/stmt-entries/{accountNumber}', [MigrasiController::class, 'getStmtEntryByAccount']);