add table scraping log and datatable server side

resources/js/app.js

@@ -251,7 +251,7 @@ class ThemeLayout {
         e &&
             e.addEventListener("click", function (e) {
                 "light" === n.config.theme
-                    ? n.changeThemeMode("dark")
+                    ? n.changeThemeMode("light")
                     : n.changeThemeMode("light");
             }),
             (e = document.querySelector("#reset-layout")) &&

resources/js/dashboards/bigdata.js

@@ -7,7 +7,7 @@ import GlobalConfig, {addThousandSeparators} from '../global-config.js';
 
 class BigData {
   init(){
-    this.initChartKekuranganPotensi();
+    this.initAllChart();
     this.initChartTargetPAD();
     this.initChartUsaha();
     this.initChartNonUsaha();
@@ -224,7 +224,7 @@ class BigData {
     });
   }
 
-  initChartKekuranganPotensi(){
+  initAllChart(){
     var options1 = {
       chart: {
         type: 'area',

resources/js/settings/syncronize/syncronize.js

@@ -1,7 +1,36 @@
+import { Grid } from "gridjs/dist/gridjs.umd.js";
+import gridjs from 'gridjs/dist/gridjs.umd.js'
+import 'gridjs/dist/gridjs.umd.js'
+import GlobalConfig from "../../global-config.js";
+
 class SyncronizeTask {
   init(){
+    this.initTableImportDatasources();
     this.onSyncSubmit();
   }
+  initTableImportDatasources(){
+    new Grid({
+      columns: [
+          "ID", "Message", "Response", "Status", "Created",
+      ],
+      pagination: {
+          limit: 15,
+          server: {
+               url: (prev, page, limit) => `${prev}?page=${page}`
+          }
+      },
+      sort: true,
+      search: {
+          server: {
+               url: (prev, page, keyword) => `${prev}?page=${page}&search=${keyword}`
+          }
+      },
+      server: {
+          url: `${GlobalConfig.apiHost}/api/import-datasource`,
+          then: data => data.data.map((item) => [item.id, item.message, item.response_body, item.status, item.created_at])
+      }
+    }).render(document.getElementById("table-import-datasources"));
+  }
   onSyncSubmit(){
     const form = document.getElementById("sync-form");
     if(form){

resources/js/tables/common-table.js

@@ -76,7 +76,7 @@ class CommonTable {
   }
 
   CommonTableInitWithFetchApi(){
-    fetch(`${GlobalConfig.apiHost}/users`)
+    fetch(`${GlobalConfig.apiHost}/api/users`)
     .then((response) => response.json())
     .then((data) => {
       console.log("check log response");
@@ -116,7 +116,7 @@ class CommonTable {
         },
         sort: true,
         search: true,
-        data: data.data
+        data: data
       }).render(document.getElementById("common-table"));
     })
     .catch((error) => console.error("Error fetching data: " + error));

resources/views/layouts/partials/topbar.blade.php

@@ -26,8 +26,8 @@
                          <button type="button" class="topbar-button" id="light-dark-mode">
                               <iconify-icon icon="solar:moon-outline"
                                    class="fs-22 align-middle light-mode"></iconify-icon>
-                              <iconify-icon icon="solar:sun-2-outline"
-                                   class="fs-22 align-middle dark-mode"></iconify-icon>
+                              <!-- <iconify-icon icon="solar:sun-2-outline"
+                                   class="fs-22 align-middle dark-mode"></iconify-icon> -->
                          </button>
                     </div>
 

resources/views/settings/syncronize/index.blade.php

@@ -1,5 +1,9 @@
 @extends('layouts.vertical', ['subtitle' => 'Syncronize'])
 
+@section('css')
+@vite(['node_modules/gridjs/dist/theme/mermaid.min.css'])
+@endsection
+
 @section('content')
 
 @include('layouts.partials/page-title', ['title' => 'Settings', 'subtitle' => 'Syncronize'])
@@ -11,6 +15,9 @@
             <button type="submit" class="btn btn-success width-lg" id="btn-sync-submit">Sync SIMBG</button>
         </form>
     </div>
+    <div>
+        <div id="table-import-datasources"></div>
+    </div>
 </div>
 
 @endsection