add export excel report tourisms

app/Exports/ReportTourismExport.php

@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Exports;
+
+use App\Models\TourismBasedKBLI;
+use Maatwebsite\Excel\Concerns\FromCollection;
+use Maatwebsite\Excel\Concerns\WithHeadings;
+
+class ReportTourismExport implements FromCollection, WithHeadings
+{
+    /**
+    * @return \Illuminate\Support\Collection
+    */
+    public function collection()
+    {
+        return TourismBasedKBLI::select('kbli_title', 'total_records')->get();
+    }
+
+    public function headings(): array{
+        return [
+            'Jenis Bisnis Pariwisata',
+            'Jumlah Total'
+        ];
+    }
+}

app/Http/Controllers/Api/ReportTourismsController.php

@@ -0,0 +1,15 @@
+<?php
+
+namespace App\Http\Controllers\Api;
+
+use App\Exports\ReportTourismExport;
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+use Maatwebsite\Excel\Facades\Excel;
+
+class ReportTourismsController extends Controller
+{
+    public function export_excel(){
+        return Excel::download(new ReportTourismExport, 'laporan-pariwisata.xlsx');
+    }
+}

app/Http/Controllers/Report/ReportTourismController.php

@@ -15,7 +15,6 @@ class ReportTourismController extends Controller
     public function index()
     {
         $tourismBasedKBLI = TourismBasedKBLI::all();
-        info($tourismBasedKBLI);
         return view('report.tourisms.index', compact('tourismBasedKBLI'));
     }
 }

resources/js/report/tourisms/index.js

@@ -3,14 +3,74 @@ import "gridjs/dist/gridjs.umd.js";
 
 // Mengambil data dari input dengan id="business_type_counts"
 const businessTypeCountsElement = document.getElementById("tourism_based_KBLI");
-console.log(businessTypeCountsElement); 
-const businessTypeCounts = JSON.parse(businessTypeCountsElement.value);  // Cek apakah data sudah terbawa dengan benar
+const businessTypeCounts = JSON.parse(businessTypeCountsElement.value); // Cek apakah data sudah terbawa dengan benar
 
 // Membuat Grid.js instance
 new gridjs.Grid({
-    columns: ["Jenis Bisnis Pariwisata", "Jumlah Total"],  // Nama kolom
-    data: businessTypeCounts.map(item => [item.kbli_title, item.total_records]),  // Mengubah data untuk Grid.js
-    search: true,  // Menambahkan fitur pencarian
-    pagination: true,  // Menambahkan fitur pagination
-    sort: true,  // Menambahkan fitur sorting
+    columns: ["Jenis Bisnis Pariwisata", "Jumlah Total"], // Nama kolom
+    data: businessTypeCounts.map((item) => [
+        item.kbli_title,
+        item.total_records,
+    ]), // Mengubah data untuk Grid.js
+    search: true, // Menambahkan fitur pencarian
+    pagination: true, // Menambahkan fitur pagination
+    sort: true, // Menambahkan fitur sorting
 }).render(document.getElementById("tourisms-report-data-table"));
+
+class TourismReport {
+    constructor() {}
+    init() {
+        this.handleExportToExcel();
+    }
+
+    async handleExportToExcel() {
+        const button = document.getElementById("btn-export-excel");
+        if (!button) {
+            console.error("Button not found: #btn-export-excel");
+            return;
+        }
+
+        let exportUrl = button.getAttribute("data-url");
+
+        button.addEventListener("click", async () => {
+            button.disabled = true;
+            try {
+                const response = await fetch(`${exportUrl}`, {
+                    method: "GET",
+                    credentials: "include",
+                    headers: {
+                        Authorization: `Bearer ${document
+                            .querySelector('meta[name="api-token"]')
+                            .getAttribute("content")}`,
+                    },
+                });
+                if (!response.ok) {
+                    console.error("Error fetching data:", response.statusText);
+                    button.disabled = false;
+                    return;
+                }
+
+                // Convert response to Blob and trigger download
+                const blob = await response.blob();
+                const url = window.URL.createObjectURL(blob);
+                const a = document.createElement("a");
+                a.href = url;
+                a.download = "laporan-pariwisata.xlsx";
+                document.body.appendChild(a);
+                a.click();
+                document.body.removeChild(a);
+                window.URL.revokeObjectURL(url);
+            } catch (error) {
+                console.error("Error fetching data:", error);
+                button.disabled = false;
+                return;
+            } finally {
+                button.disabled = false;
+            }
+        });
+    }
+}
+
+document.addEventListener("DOMContentLoaded", function () {
+    new TourismReport().init();
+});

resources/views/report/tourisms/index.blade.php

@@ -9,8 +9,18 @@
 
 <input id="tourism_based_KBLI"  type="hidden" value="{{ json_encode($tourismBasedKBLI) }}">
 <div class="card">
-    <div class="card-header">
-        <h5 class="card-title">Laporan Pariwisata</h5>
+    <div class="card-header d-flex justify-content-between align-items-center">
+        <h5 class="card-title mb-0">Laporan Pariwisata</h5>
+        <div class="d-flex gap-2">
+            <button class="btn btn-sm bg-black text-white d-flex align-items-center content-center gap-2" id="btn-export-excel" data-url="{{ route('api.report-tourisms.excel') }}">
+                <span>.xlsx</span>
+                <iconify-icon icon="mingcute:file-export-line" width="20" height="20" class="d-flex align-items-center"></iconify-icon>
+            </button>
+            <button class="btn btn-sm bg-black text-white d-flex align-items-center content-center gap-2" id="btn-export-pdf" data-url="{{ route('api.report-tourisms.excel') }}">
+                <span>.pdf</span>
+                <iconify-icon icon="mingcute:file-export-line" width="20" height="20" class="d-flex align-items-center"></iconify-icon>
+            </button>
+        </div>
     </div>
     <div class="card-body">
         <div class="row">

routes/api.php

@@ -12,6 +12,7 @@ use App\Http\Controllers\Api\LackOfPotentialController;
 use App\Http\Controllers\Api\MenusController;
 use App\Http\Controllers\Api\PbgTaskController;
 use App\Http\Controllers\Api\PbgTaskGoogleSheetsController;
+use App\Http\Controllers\Api\ReportTourismsController;
 use App\Http\Controllers\Api\RequestAssignmentController;
 use App\Http\Controllers\Api\RolesController;
 use App\Http\Controllers\Api\ScrapingController;
@@ -154,4 +155,8 @@ Route::group(['middleware' => 'auth:sanctum'], function (){
 
     // pbg-task-google-sheet
     Route::apiResource('pbg-task-google-sheet', PbgTaskGoogleSheetsController::class);
+
+    Route::controller(ReportTourismsController::class)->group(function (){
+        Route::get('/report-tourisms/excel', 'export_excel')->name('api.report-tourisms.excel');
+    });
 });

routes/web.php

@@ -136,7 +136,9 @@ Route::group(['middleware' => 'auth'], function(){
     // Report
     Route::group(['prefix' => '/report'], function(){
         // Resource route, kecuali create karena dibuat terpisah
-        Route::resource('/tourisms-report', ReportTourismController::class);
+        Route::controller(ReportTourismController::class)->group(function (){
+            Route::get('/tourisms-report','index')->name('tourisms-report.index');
+        });
 
         Route::controller(BigdataResumesController::class)->group(function (){
             Route::get('/bigdata-resumes', 'index')->name('bigdata-resumes');