partial update circle chart can click

resources/views/components/circle.blade.php

@@ -1,8 +1,11 @@
+@props(['document_url' => '#'])
+
 @section('css')
 @vite(['resources/scss/components/_circle.scss'])
 @endsection
 
-<div class="circle-container"  id="{{$document_id}}" style="--circle-color: {{$document_color}};{{$style}}">
+<div class="circle-container"  id="{{$document_id}}" style="--circle-color: {{$document_color}};{{$style}}" data-url="{{ $document_url }}"
+     onclick="handleCircleClick(this)">
     <div class="circle-content">
         <p class="document-title {{$document_id}}" >{{$document_title}}</p>
         <p class="document-total {{$document_id}}" >Rp.0</p>
@@ -17,3 +20,12 @@
     </div>
     @endif
 </div>
+
+<script>
+    function handleCircleClick(element) {
+        const url = element.getAttribute('data-url') || '#';
+        if (url !== '#') {
+            window.location.href = url;
+        }
+    }
+</script>

resources/views/dashboards/bigdata.blade.php

@@ -9,22 +9,6 @@
 @include('layouts.partials/page-title', ['title' => 'Dashboards', 'subtitle' => 'Dashboard Pimpinan'])
 
 <div id="dashboard-fixed-wrapper" class="row">
-    <!-- <div class="col-12">
-        <h2 class="mt-3 ms-2 text-danger">
-            <span class="float-end fs-6 me-3 text-black d-block d-sm-inline text-end">Terakhir di update - {{$latest_created}}</span>
-            ANALISA BIG DATA PROSES PBG <br> 
-            MELALUI APLIKASI SIBEDAS PBG
-    
-        </h2>
-    </div>
-
-    <div class="row d-flex justify-content-end">
-        <div class="col-12 col-sm-6 col-md-3">
-            <div class="d-flex flex-sm-nowrap flex-wrap justify-content-end">
-                <input type="text" class="form-control" style="max-width: 125px;" id="datepicker-dashboard-bigdata" placeholder="Filter Date" />
-            </div>
-        </div>
-    </div> -->
     <div class="col-12">
         <div class="d-flex justify-content-between align-items-center mt-3 ms-2">
             <h2 class="text-danger m-0">