update

app/Http/Controllers/HomeController.php

@@ -8,20 +8,17 @@ use App\Models\Master\Topik;
 use App\Models\Master\Instansi;
 use App\Models\Master\Template;
 use App\Models\Master\Group;
+use App\Repositories\Eloquent\DatasetRepository;
 
 class HomeController extends Controller
 {
     protected $template = 'modules.dashboard';
     protected $route = 'modules.dashboard';
+    private $datasetRepository;
 
-    /**
+    public function __construct(DatasetRepository $datasetRepository){
-     * Create a new controller instance.
-     *
-     * @return void
-     */
-    public function __construct()
-    {
         $this->middleware('auth');
+        $this->repository = $datasetRepository;
     }
 
     /**
@@ -162,13 +159,22 @@ class HomeController extends Controller
         return view($this->template.'.resource',$data);
     }
     function resource_instansi($instansi_id,$id){
-
         $data['id']          = decode_id($id);
         $data['instansi_id'] = decode_id($instansi_id);
         $data['dataset']     = Dataset::with(['template'])->where('instansi_id',decode_id($instansi_id))->where('template_id',decode_id($id))->first();
+        $data['template']    = Template::where('MsTemplateId',decode_id($id))->first();
         $data['title']       = 'Dashboard '.@$data['dataset']->template->name;
 
         return view($this->template.'.resource_detail',$data);
+    }
 
+    function apiChart($templateId,$instansi_id){
+        $template   = Template::where('MsTemplateId',decode_id($templateId))->first();
+        $dataset    = Dataset::with(['template'])->where('instansi_id',decode_id($instansi_id))->where('template_id',decode_id($templateId))->first();
+        $filename   = pathinfo($template->template_url, PATHINFO_FILENAME); 
+        $modelClass = "App\\Models\\Dataset\\Dataset" . ucfirst($filename);
+        $insert     = $this->repository->getChartData($modelClass,$dataset->DatasetId,decode_id($templateId));
+
+        return $insert;
     }
 }

app/Models/Dataset/DatasetTable11.php

@@ -10,13 +10,65 @@ use Illuminate\Database\Eloquent\Model;
 class DatasetTable11 extends Model
 {
     use HasFactory;
-use SoftDeletes;
+    use SoftDeletes;
+
     protected $table = 'dataset_table11';
     protected $primaryKey = 'DatasetTable11Id';
 
     protected $guarded = [];
 
-function dataset() {
+    function dataset() {
         return $this->belongsTo('App\Models\Dataset','dataset_id');
     }
+
+    public static function dataChart($modelClass,$datasetId,$templateId){
+
+        $datasets = \App\Models\Dataset::where('template_id', $templateId)
+            ->orderBy('tahun', 'asc')
+            ->get()
+            ->map(function ($dataset) use ($modelClass) {
+                $dataset->items = (new $modelClass)->where('dataset_id', $dataset->id)->get();
+                return $dataset;
+            });
+        $years  = $datasets->pluck('tahun')->toArray();
+        $model = self::with('dataset')->whereHas('dataset',function($query) use ($years){
+            $query->whereIn('tahun',$years);
+        })->where('dataset_id',$datasetId)->get();
+        
+        $result = [];
+        foreach ($model as $row) {
+            $lokasi = $row->lokasi ?? 'Unknown';
+
+            if (!isset($result[$lokasi])) {
+                $result[$lokasi] = [
+                    'luas' => [],
+                    'persen' => []
+                ];
+            }
+
+            $result[$lokasi]['luas'][]   = (float) $row->luas;
+            $result[$lokasi]['persen'][] = (float) $row->persentase_area_kerusakan;
+        }
+
+        return [
+            'title'     => 'Luas & Persentase Area Kerusakan per Wilayah',
+            'years'     => $years,
+            'yTitle'    => 'Luas (Ha)',
+            'yOpposite'    => 'Persentase (%)',
+            'series'    => collect($result)->flatMap(function ($item, $lokasi) {
+                return [
+                    [
+                        'name' => "Luas - {$lokasi}",
+                        'type' => 'column',
+                        'data' => $item['luas']
+                    ],
+                    [
+                        'name' => "Persentase - {$lokasi}",
+                        'type' => 'line',
+                        'data' => $item['persen']
+                    ]
+                ];
+            })->values()
+        ];
+    }
 }

app/Repositories/Eloquent/DatasetRepository.php

@@ -292,4 +292,10 @@ class DatasetRepository implements DatasetRepositoryInterface
             return $masterModel;
         });
     }
+
+    public function getChartData($modelClass,$datasetId,$templateId)
+    {
+        $data = $modelClass::dataChart($modelClass,$datasetId,$templateId);        
+        return $data;
+    }
 }

resources/views/modules/dashboard/resource.blade.php

@@ -11,7 +11,7 @@
     <a href="{{url('dashboard/dataset/resource/instansi/'.encode_id($dataInstansi->MsInstansiId).'/'.$id)}}">
         <?php
             $tahun = '';
-            $dataset = \App\Models\Dataset::where('instansi_id',$dataInstansi->MsInstansiId)->orderBy('tahun','ASC')->pluck('tahun')->toArray();
+            $year = \App\Models\Dataset::where('template_id',decode_id($id))->where('instansi_id',$dataInstansi->MsInstansiId)->orderBy('tahun','ASC')->pluck('tahun')->toArray();
             $bg = 'info';
 
             if(@$dataInstansi->alias == 'dinas'){
@@ -46,7 +46,7 @@
                         <div class="">
                             <div class="mb-2"><h5 class="text-sm font-bold mt-0 truncate">{{$dataInstansi->name}}</h5></div>
                             <div class="mb-2">
-                                @foreach ($dataset as $tahun)
+                                @foreach ($year as $tahun)
                                     <span class="p-1 bg-info-light rounded text-white">{{ $tahun }}</span>
                                 @endforeach
                             </div>

resources/views/modules/dashboard/resource_detail.blade.php

@@ -26,7 +26,6 @@
 <!-- end row -->
 @endsection
 @section('js')
-<script src="{{asset('assets/js/pages/dashboard-analytics.js')}}"></script>
 <!-- Apex Charts js -->
 <script src="{{asset('assets/libs/apexcharts/apexcharts.min.js')}}"></script>
 
@@ -34,60 +33,29 @@
 <script src="{{asset('assets/libs/jsvectormap/js/jsvectormap.min.js')}}"></script>
 <script src="{{asset('assets/libs/jsvectormap/maps/world-merc.js')}}"></script>
 <script src="{{asset('assets/libs/jsvectormap/maps/world.js')}}"></script>
-
 <script>
-     var options = {
+  var base_url = '{{ url("dashboard/api/chart/".encode_id($template->MsTemplateId)."/".encode_id($instansi_id)) }}';
-          series: [{
+  fetch(base_url)
-          name: 'Luas Kawasan',
+  .then(res => res.json())
-          data: [41176, 13176, 38176, 55176, 42176]
+  .then(res => {
-        }, {
+    const options = {
-          name: 'Kawasan Hutan Lindung',
+      chart: { type: 'line', height: 480 },
-          data: [31176, 23176, 58176, 65176, 42176]
+      title: { text: res.title, align: 'center' },
-        }, {
+      xaxis: { categories: res.years, title: { text: 'Tahun' } },
-          name: 'Kawasan Air',
+      yaxis: [
-          data: [11176, 23176, 58176, 25176, 12176]
+        { title: { text: res.yTitle } },
-        }],
+        { opposite: true, min: 0, max: 100, title: { text: res.yOpposite } }
-          chart: {
+      ],
-          type: 'bar',
+      tooltip: { shared: true, intersect: false },
-          height: 350
+      stroke: { width: [0,3] },
-        },
+      plotOptions: { bar: { columnWidth: '45%' } },
-        plotOptions: {
+      legend: { position: 'bottom' },
-          bar: {
+      series: res.series
-            horizontal: false,
-            columnWidth: '55%',
-            borderRadius: 5,
-            borderRadiusApplication: 'end'
-          },
-        },
-        dataLabels: {
-          enabled: false
-        },
-        stroke: {
-          show: true,
-          width: 2,
-          colors: ['transparent']
-        },
-        xaxis: {
-          categories: ['2020', '2021', '2022', '2023', '2024'],
-        },
-        yaxis: {
-          title: {
-            text: ''
-          }
-        },
-        fill: {
-          opacity: 1
-        },
-        tooltip: {
-          y: {
-            formatter: function (val) {
-              return " " + val + " "
-            }
-          }
-        }
     };
 
-        var chart = new ApexCharts(document.querySelector("#chart"), options);
+    new ApexCharts(document.querySelector("#chart"), options).render();
-        chart.render();
+  });
+
 </script>
+
 @endsection

routes/modules/modules.php

@@ -20,6 +20,7 @@ Route::name('dashboard.')->prefix('dashboard')->group(function () {
     Route::get('/dataset/resource/instansi/{instansi_id}/{id}',[HomeController::class,'resource_instansi'])->name('resource_instansi');
     Route::get('/grid',[HomeController::class,'grid'])->name('grid');
     Route::get('/datasetGrid/{alias}',[HomeController::class,'datasetGrid'])->name('datasetGrid');
+    Route::get('/api/chart/{template_id}/{instansi_id}',[HomeController::class,'apiChart'])->name('apiChart');
 });