diff --git a/app/Http/Controllers/AjaxController.php b/app/Http/Controllers/AjaxController.php
index c7facf0..c37cd6e 100644
--- a/app/Http/Controllers/AjaxController.php
+++ b/app/Http/Controllers/AjaxController.php
@@ -43,6 +43,36 @@ class AjaxController extends Controller
             'message' => 'Upload failed.',
         ]);
     }
+    public function uploadTempImage(Request $request)
+    {
+        $request->validate([
+            'file.*' => 'required|file|mimes:png,jpg,jpeg|max:5120',
+        ]);
+
+        $uploadedFiles = [];
+
+        if ($request->hasFile('file')) {
+            foreach ($request->file('file') as $file) {
+                $filename = uniqid() . '-' . time() . '.' . $file->getClientOriginalExtension();
+                $path = $file->storeAs('tmp_uploads', $filename);
+
+                $uploadedFiles[] = [
+                    'filename' => $filename,
+                    'url' => asset('storage/tmp_uploads/' . $filename),
+                ];
+            }
+
+            return response()->json([
+                'success' => true,
+                'files' => $uploadedFiles, // Kembalikan semua file
+            ]);
+        }
+
+        return response()->json([
+            'success' => false,
+            'message' => 'Upload failed.',
+        ]);
+    }
     public function sekolahNpsn(Request $request)
     {
         // dd($request->all());
diff --git a/app/Http/Controllers/FrontController.php b/app/Http/Controllers/FrontController.php
index 6972483..f9b7e07 100644
--- a/app/Http/Controllers/FrontController.php
+++ b/app/Http/Controllers/FrontController.php
@@ -23,6 +23,7 @@ class FrontController extends Controller
         return view('kegiatan_detail',$data);
     }
     function galeri() {
-        return view('galeri');
+        $data['kegiatan'] = Kegiatan::orderBy('KegiatanId','DESC')->paginate(8);
+        return view('galeri',$data);
     }
 }
diff --git a/app/Http/Controllers/Modules/Konten/KegiatanController.php b/app/Http/Controllers/Modules/Konten/KegiatanController.php
index 3499b6f..c5033bd 100644
--- a/app/Http/Controllers/Modules/Konten/KegiatanController.php
+++ b/app/Http/Controllers/Modules/Konten/KegiatanController.php
@@ -45,13 +45,14 @@ class KegiatanController extends Controller
                 $action .= '<a href="'.url('konten/kegiatan/update/'.encode_id($row->KegiatanId)).'" data-toggle="tooltip" title="Edit Data" class="btn btn-xs btn-block btn-primary"><i class="fal fa-pencil text-white"></i></a>';
                 $action .= '<a href="#" data-href="'.url('konten/kegiatan/delete/'.encode_id($row->KegiatanId)).'" data-toggle="tooltip" title="Hapus Data" class="remove_data btn btn-xs btn-block btn-danger"><i class="fal fa-trash text-white"></i></a>';
             }
+            $image = json_decode($row->image);
 
             $_data[] = [
                 'no'                => $key+1,
                 'id'                => encode_id($row->KegiatanId),
                 'judul'             => $row->judul,
                 'created_at'        => dateTime($row->created_at),
-                'image'             => '<image src="'.asset('uploads/'.$row->image).'" width="80">',
+                'image'             => '<image src="'.asset($image[0]).'" width="80">',
                 'action'            => $action,
             ];
 
@@ -93,30 +94,46 @@ class KegiatanController extends Controller
                 $keg->kategori = $request->kategori;
                 $keg->body = $request->body;
 
-                if (@$request->hasFile('image')) {
-                    $file = $request->file('image');
-                    $destinationPath = public_path('uploads/kegiatan');
-                    $current = Carbon::now()->format('Y/m/d');
-                    $path = $destinationPath . '/' . $current;
-                    $fileName = $file->getClientOriginalName();
-                    $fileMime = $file->getClientMimeType();
-                    $fileExtension = $file->getClientOriginalExtension();
-                    $fileSize = $file->getSize();
-                    if(($fileExtension != 'jpg') && ($fileExtension != 'jpeg') && ($fileExtension != 'png')){
-                        return redirect()->back()->with([
-                            'message' => 'Maaf File Harus Berupa PNG,JPEG,JPG!',
-                            'type'    => "error"
-                        ]);   
-                    }
-                    $newFilename = session('id').'_'.uniqid('file_') . '.' . $fileExtension;
+                if(@$request->input_upload_files){
 
-                    if (!File::exists($path)) {
-                        File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
-                    }
+                    $filePaths = [];
+                    if(is_array(@$request->input_upload_files)){
 
-                    $filePathTim = 'kegiatan/' . $current . '/' . $newFilename;
-                    $uploaded = $file->move($path, $newFilename);
-                    $keg->image = $filePathTim;
+                        $oldImages = json_decode($keg->image, true) ?? [];
+                        foreach (@$request->input_upload_files as $file) {
+                            $tempPath = storage_path('app/tmp_uploads/' . $file);
+
+                            if (file_exists($tempPath)) {
+                                $path = public_path('uploads/kegiatan/' . date('Y') );
+                                if (!File::exists($path)) {
+                                    File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
+                                }
+
+                                $newPath = 'uploads/kegiatan/'.date('Y').'/'.$file;
+                                copy($tempPath, public_path($newPath));
+                                $newfilePaths[] = $newPath;
+                            }
+                        }
+
+                        // gabungkan file lama + file baru
+                        $filePaths = array_merge($oldImages, $newfilePaths);
+                    }else{
+                        $tempPath = storage_path('app/tmp_uploads/' . @$request->input_upload_files);
+
+                        if (file_exists($tempPath)) {
+                            $path = public_path('uploads/kegiatan/' . date('Y') );
+                            if (!File::exists($path)) {
+                                File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
+                            }
+
+                            $newPath = 'uploads/kegiatan/'.date('Y').'/'.@$request->input_upload_files;
+                            copy($tempPath, public_path($newPath));
+                            $filePaths[] = $newPath;
+                        }
+                    }
+                        
+                        $path = $filePaths;
+                        $keg->image = json_encode($path);
                 }
                 $keg->save();
             }else{
@@ -126,31 +143,69 @@ class KegiatanController extends Controller
                 $keg->kategori = $request->kategori;
                 $keg->body = $request->body;
 
-                if (@$request->hasFile('image')) {
-                    $file = $request->file('image');
-                    $destinationPath = public_path('uploads/kegiatan');
-                    $current = Carbon::now()->format('Y/m/d');
-                    $path = $destinationPath . '/' . $current;
-                    $fileName = $file->getClientOriginalName();
-                    $fileMime = $file->getClientMimeType();
-                    $fileExtension = $file->getClientOriginalExtension();
-                    $fileSize = $file->getSize();
-                    if(($fileExtension != 'jpg') && ($fileExtension != 'jpeg') && ($fileExtension != 'png')){                        
-                        return redirect()->back()->with([
-                            'message' => 'Maaf File Harus Berupa PNG,JPEG,JPG!',
-                            'type'    => "error"
-                        ]);   
-                    }
-                    $newFilename = session('id').'_'.uniqid('file_') . '.' . $fileExtension;
+                // if (@$request->hasFile('image')) {
+                //     $file = $request->file('image');
+                //     $destinationPath = public_path('uploads/kegiatan');
+                //     $current = Carbon::now()->format('Y/m/d');
+                //     $path = $destinationPath . '/' . $current;
+                //     $fileName = $file->getClientOriginalName();
+                //     $fileMime = $file->getClientMimeType();
+                //     $fileExtension = $file->getClientOriginalExtension();
+                //     $fileSize = $file->getSize();
+                //     if(($fileExtension != 'jpg') && ($fileExtension != 'jpeg') && ($fileExtension != 'png')){                        
+                //         return redirect()->back()->with([
+                //             'message' => 'Maaf File Harus Berupa PNG,JPEG,JPG!',
+                //             'type'    => "error"
+                //         ]);   
+                //     }
+                //     $newFilename = session('id').'_'.uniqid('file_') . '.' . $fileExtension;
 
-                    if (!File::exists($path)) {
-                        File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
-                    }
+                //     if (!File::exists($path)) {
+                //         File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
+                //     }
 
-                    $filePathTim = 'kegiatan/' . $current . '/' . $newFilename;
-                    $uploaded = $file->move($path, $newFilename);
-                    $keg->image = $filePathTim;
+                //     $filePathTim = 'kegiatan/' . $current . '/' . $newFilename;
+                //     $uploaded = $file->move($path, $newFilename);
+                //     $keg->image = $filePathTim;
+                // }
+
+                if(@$request->input_upload_files){
+
+                    $filePaths = [];
+                    if(is_array(@$request->input_upload_files)){
+                        foreach (@$request->input_upload_files as $file) {
+                            $tempPath = storage_path('app/tmp_uploads/' . $file);
+
+                            if (file_exists($tempPath)) {
+                                $path = public_path('uploads/kegiatan/' . date('Y') );
+                                if (!File::exists($path)) {
+                                    File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
+                                }
+
+                                $newPath = 'uploads/kegiatan/'.date('Y').'/'.$file;
+                                copy($tempPath, public_path($newPath));
+                                $filePaths[] = $newPath;
+                            }
+                        }
+                    }else{
+                        $tempPath = storage_path('app/tmp_uploads/' . @$request->input_upload_files);
+
+                        if (file_exists($tempPath)) {
+                            $path = public_path('uploads/kegiatan/' . date('Y') );
+                            if (!File::exists($path)) {
+                                File::isDirectory($path) or File::makeDirectory($path, 0777, true, true);
+                            }
+
+                            $newPath = 'uploads/kegiatan/'.date('Y').'/'.@$request->input_upload_files;
+                            copy($tempPath, public_path($newPath));
+                            $filePaths[] = $newPath;
+                        }
+                    }
+                        
+                        $path = $filePaths;
+                        $keg->image = json_encode($path);
                 }
+                
                 $keg->save();
             }
             return redirect()->back()->with([
@@ -224,4 +279,34 @@ class KegiatanController extends Controller
 
         return response()->json(['success' => true,'message' => 'Berhasil update data','type' => 'success']);
     }
+    function imageDelete(Request $request,$id){
+        $keyId = decode_id($id);
+        $keg = Kegiatan::where('KegiatanId',$keyId)->first();
+
+        // Ambil nama file yang mau dihapus
+        $fileToDelete = $request->url; // contoh: 'uploads/kegiatan/2025/file2.pdf'
+
+        // Ambil data lama
+        $images = json_decode($keg->image, true) ?? [];
+
+        // Cari dan hapus dari array
+        $newImages = array_filter($images, function ($img) use ($fileToDelete) {
+            return $img !== $fileToDelete;
+        });
+
+        // Hapus file fisik juga
+        $fullPath = public_path($fileToDelete);
+        if (File::exists($fullPath)) {
+            File::delete($fullPath);
+        }
+
+        // Simpan array baru ke DB
+        $keg->image = json_encode(array_values($newImages)); // reset index array
+        $keg->save();
+
+        return response()->json([
+            'status' => 'success',
+            'message' => 'Image deleted successfully',
+        ]);    
+    }
 }
diff --git a/database/migrations/2025_08_08_085907_create_kegiatans_table.php b/database/migrations/2025_08_08_085907_create_kegiatans_table.php
index 7dc47b7..5d67497 100644
--- a/database/migrations/2025_08_08_085907_create_kegiatans_table.php
+++ b/database/migrations/2025_08_08_085907_create_kegiatans_table.php
@@ -17,7 +17,7 @@ return new class extends Migration
             $table->string('judul')->nullable();
             $table->text('body')->nullable();
             $table->string('kategori')->nullable();
-            $table->string('image')->nullable();
+            $table->json('image')->nullable();
             $table->timestampsTz();
         });
     }
diff --git a/resources/views/galeri.blade.php b/resources/views/galeri.blade.php
index ef6efdb..035779d 100644
--- a/resources/views/galeri.blade.php
+++ b/resources/views/galeri.blade.php
@@ -6,98 +6,36 @@
 	</div>
 	<div class="flex flex-row gap-10">
 		<div class="grid grid-rows-1 md:grid-cols-3 lg:grid-cols-4 gap-5">
+			@foreach($kegiatan as $dataKeg)
+			<?php
+				$images = json_decode($dataKeg->image);
+			?>
 			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('SDN Ciracas 15.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
+				<img src="{{ asset($images[0]) }}" class="w-full h-full object-cover" alt="Galeri">
 				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 15 Ciracas</h4>
+					<h4 class="mb-5 font-bold text-white w-50">{{ $dataKeg->judul }}</h4>
 					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
 					{{-- <button  class="rounded-md bg-gray-950/5 px-2.5 py-1.5 text-sm font-semibold text-gray-900 hover:bg-gray-950/10">Open dialog</button> --}}
 					
-					<a href="#" data-url="{{ asset('SDN Ciracas 15.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('SDN Pondok Kelapa 05.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 05 Pondok Kelapa</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('SDN Pondok Kelapa 05.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sma 67.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMAN 67 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('sma 67.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('man 2 jakarta.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi MAN 2 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('man 2 jakarta.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sdn lebak bulus 4.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 04 Lebak Bulus</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('sdn lebak bulus 4.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sma 10.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMAN 10 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('sma 10.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sdn pulogadung 07.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 07 Pulogadung</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('sdn pulogadung 07.jpg') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('berita.png') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMPN 197 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" data-url="{{ asset('berita.png') }}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
+					<a href="#" data-url="{{$dataKeg->image}}" data-judul="{{$dataKeg->judul}}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
 						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
 					</a>
 				</div>
 			</div>
+			@endforeach
 		</div>
 	</div>
 </section>
 
 <div id="myModal" class="fixed inset-0 z-50 hidden bg-black/50 flex items-center justify-center">
 	<div class="bg-white rounded-lg shadow-lg w-1/2 p-6 relative">
-		<img src="" id="image" alt="" class="w-full">
-		<!-- Tombol aksi -->
-		<br>
-		<div class="flex justify-end space-x-2">
+		<div id="carousel" class="relative w-full flex transition-transform duration-500">
+			<img id="image" src="" alt="" class="w-full rounded">
+			<!-- tombol navigasi -->
+			<button id="prev" class="absolute left-0 top-1/2 transform -translate-y-1/2 bg-gray-800 text-white px-3 py-1 rounded">‹</button>
+			<button id="next" class="absolute right-0 top-1/2 transform -translate-y-1/2 bg-gray-800 text-white px-3 py-1 rounded">›</button>
+		</div>
+		<div class="flex justify-end space-x-2 mt-1">
 			<button onclick="closeModal()" class="bg-gray-300 text-gray-700 px-4 py-2 cursor-pointer rounded">Tutup</button>
 		</div>
 	</div>
@@ -106,12 +44,44 @@
 @section('js')
 <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
 <script>
-$('.btnmodal').on('click',function(){
-	document.getElementById('myModal').classList.remove('hidden');
-	$('#image').attr('src',$(this).data('url'));
-});
-function closeModal() {
-document.getElementById('myModal').classList.add('hidden');
-}
+	let slides = [];
+	let currentIndex = 0;
+
+	$('.btnmodal').on('click', function(e){
+		e.preventDefault();
+		$('#myModal').removeClass('hidden');
+
+		$('#judul').html($(this).data('judul'));
+		// ambil data-images dan parse JSON
+		slides = $(this).data('url');
+		if (!Array.isArray(slides)) {
+			slides = JSON.parse(slides);
+		}
+
+		console.log(slides);
+
+		currentIndex = 0;
+		$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+	});
+
+	// tombol navigasi
+	$('#next').on('click', function(){
+		if(slides.length > 0){
+			currentIndex = (currentIndex + 1) % slides.length;
+			$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+		}
+	});
+
+	$('#prev').on('click', function(){
+		if(slides.length > 0){
+			currentIndex = (currentIndex - 1 + slides.length) % slides.length;
+			$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+		}
+	});
+
+	function closeModal(){
+		$('#myModal').addClass('hidden');
+	}
+
 </script>
 @endsection
\ No newline at end of file
diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php
index 378c698..7c6bb7e 100644
--- a/resources/views/index.blade.php
+++ b/resources/views/index.blade.php
@@ -88,7 +88,10 @@
 	<div class="flex flex-row gap-10">
 		<div class="w-full lg:w-2/3">
 			<div class="flex flex-col gap-3">
-				<img src="{{ asset('uploads/'.$kegiatan[0]->image) }}" alt="" class="w-full lg:w-[100%] rounded-[10px]">
+				<?php
+				$image = json_decode($kegiatan[0]->image);
+				?>
+				<img src="{{ asset($image[0]) }}" alt="" class="w-full lg:w-[100%] rounded-[10px]">
 				<div class="flex flex-row gap-3 items-center">
 					<span class="p-2 bg-warning text-xs rounded-[10px] text-white">Kegiatan {{ $kegiatan[0]->kategori }}</span>
 					<span class="text-xs opacity-[50%]">{{ date('D',strtotime($kegiatan[0]->created_at)) }}, {{ date('d M Y',strtotime($kegiatan[0]->created_at)) }}</span>
@@ -105,9 +108,12 @@
 		<div class="hidden lg:block w-1/3">
 			<div class="flex flex-col gap-3">
 				@foreach($kegiatan as $dataKeg)
+				<?php
+				$images = json_decode($dataKeg->image);
+				?>
 				<div class="flex items-center gap-3 flex-row border-b-1 border-b-[#eee] pb-3">
 					<div class="flex justify-end w-2/5">
-						<img src="{{ asset('uploads/'.$dataKeg->image) }}" class="rounded-[10px] ">
+						<img src="{{ asset($images[0]) }}" class="rounded-[10px] ">
 					</div>
 					<div class="flex flex-col gap-3 justify-center w-3/5">
 						<span class="text-xs opacity-[50%]">{{ date('D',strtotime($dataKeg->created_at)) }}, {{ date('d M Y',strtotime($dataKeg->created_at)) }}</span>
@@ -130,87 +136,80 @@
 	</div>
 	<div class="flex flex-row gap-10">
 		<div class="grid grid-rows-1 md:grid-cols-3 lg:grid-cols-4 gap-5">
+			@foreach($kegiatan as $dataKeg)
+			<?php
+				$images = json_decode($dataKeg->image);
+			?>
 			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('SDN Ciracas 15.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
+				<img src="{{ asset($images[0]) }}" class="w-full h-full object-cover" alt="Galeri">
 				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 15 Ciracas</h4>
+					<h4 class="mb-5 font-bold text-white w-50">{{ $dataKeg->judul }}</h4>
 					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('SDN Pondok Kelapa 05.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 05 Pondok Kelapa</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sma 67.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMAN 67 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('man 2 jakarta.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi MAN 2 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sdn lebak bulus 4.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 04 Lebak Bulus</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sma 10.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMAN 10 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('sdn pulogadung 07.jpg') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SDN 07 Pulogadung</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
-						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
-					</a>
-				</div>
-			</div>
-			<div class="relative group  w-full overflow-hidden rounded-lg shadow-[10px_10px_10px_0px_rgba(0,0,0,0.25)]">
-				<img src="{{ asset('berita.png') }}" class="w-full h-full object-cover" alt="Galeri">
-				<div class="absolute inset-0 bg-success bg-opacity-50 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-center p-4 gap-3">
-					<h4 class="mb-5 font-bold text-white w-50">Dokumentasi SMPN 197 Jakarta</h4>
-					{{-- <p class="text-white text-sm font-normal">1 Agustus 2025</p> --}}
-					<a href="#" class="p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
+					<a href="#" data-url="{{$dataKeg->image}}" data-judul="{{$dataKeg->judul}}" class="btnmodal p-2 text-black text-sm bg-white opacity-50 rounded-[10px] mx-auto md:mx-0 text-center flex flex-row justify-between gap-3 w-40 ">
 						<span>Lihat Detail</span> <x-lucide-arrow-right width="20" class="text-black text-right"/>
 					</a>
 				</div>
 			</div>
+			@endforeach
 		</div>
 	</div>
 </section>
+
+<div id="myModal" class="fixed inset-0 z-50 hidden bg-black/50 flex items-center justify-center">
+	<div class="bg-white rounded-lg shadow-lg w-1/2 p-6 relative">
+		<div id="carousel" class="relative w-full flex transition-transform duration-500">
+			<img id="image" src="" alt="" class="w-full rounded">
+			<!-- tombol navigasi -->
+			<button id="prev" class="absolute left-0 top-1/2 transform -translate-y-1/2 bg-gray-800 text-white px-3 py-1 rounded">‹</button>
+			<button id="next" class="absolute right-0 top-1/2 transform -translate-y-1/2 bg-gray-800 text-white px-3 py-1 rounded">›</button>
+		</div>
+		<div class="flex justify-end space-x-2 mt-1">
+			<button onclick="closeModal()" class="bg-gray-300 text-gray-700 px-4 py-2 cursor-pointer rounded">Tutup</button>
+		</div>
+	</div>
+</div>
+@endsection
+@section('js')
+<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
+<script>
+	let slides = [];
+	let currentIndex = 0;
+
+	$('.btnmodal').on('click', function(e){
+		e.preventDefault();
+		$('#myModal').removeClass('hidden');
+
+		$('#judul').html($(this).data('judul'));
+		// ambil data-images dan parse JSON
+		slides = $(this).data('url');
+		if (!Array.isArray(slides)) {
+			slides = JSON.parse(slides);
+		}
+
+		console.log(slides);
+
+		currentIndex = 0;
+		$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+	});
+
+	// tombol navigasi
+	$('#next').on('click', function(){
+		if(slides.length > 0){
+			currentIndex = (currentIndex + 1) % slides.length;
+			$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+		}
+	});
+
+	$('#prev').on('click', function(){
+		if(slides.length > 0){
+			currentIndex = (currentIndex - 1 + slides.length) % slides.length;
+			$('#image').attr('src', "{{ asset('/') }}"+slides[currentIndex]);
+		}
+	});
+
+	function closeModal(){
+		$('#myModal').addClass('hidden');
+	}
+
+</script>
 @endsection
\ No newline at end of file
diff --git a/resources/views/kegiatan.blade.php b/resources/views/kegiatan.blade.php
index 6d0c008..f4bae9e 100644
--- a/resources/views/kegiatan.blade.php
+++ b/resources/views/kegiatan.blade.php
@@ -7,9 +7,12 @@
 	<div class="flex flex-row">
 		<div class="grid grid-rows-1 md:grid-cols-3 lg:grid-cols-4 gap-5">
 			@foreach($kegiatan as $dataKeg)
+				<?php
+				        $image = json_decode($dataKeg->image);
+				    ?>
 				<div class="p-3 border border-[#eaeaea] rounded-[10px] shadow-[2px_1px_5px_0px_rgba(0,0,0,0.10)]">
 					<div class="flex flex-col gap-3">
-						<img src="{{ asset('uploads/'.$dataKeg->image) }}" alt="" class="w-full object-cover rounded-sm h-40 lg:w-[100%]">
+						<img src="{{ asset($image[0]) }}" alt="" class="w-full object-cover rounded-sm h-40 lg:w-[100%]">
 						<div class="flex flex-row gap-3 items-center">
 							<span class="p-2 bg-warning text-xs rounded-[10px] text-white">Kegiatan {{ $dataKeg->kategori }}</span>
 							<span class="text-xs opacity-[50%]">{{ date('D',strtotime($dataKeg->created_at)) }}, {{ date('d M Y',strtotime($dataKeg->created_at)) }}</span>
diff --git a/resources/views/kegiatan_detail.blade.php b/resources/views/kegiatan_detail.blade.php
index 9fc60f3..8433e27 100644
--- a/resources/views/kegiatan_detail.blade.php
+++ b/resources/views/kegiatan_detail.blade.php
@@ -5,7 +5,44 @@
         <div class="w-full lg:w-2/3">
             <div class="p-3 shadow-[1px_1px_5px_0px_rgba(0,0,0,0.25)] rounded-[10px]">
                 <div class="flex flex-col gap-3">
-                    <img src="{{ asset('uploads/'.$kegiatan->image) }}" alt="" class="w-full lg:w-[100%] rounded-[10px]">
+                    
+                    <?php
+				        $image = json_decode($kegiatan->image);
+				    ?>
+                    <div id="carousel" class="relative w-full mx-auto">
+                    <!-- Images -->
+                        <div class="overflow-hidden rounded-xl relative">
+                            <div id="carousel-inner" class="flex transition-transform duration-500">
+                                @foreach ($image as $img)
+                                    <div class="w-full flex-shrink-0">
+                                        <img src="{{ asset($img) }}" class="w-full lg:w-[100%] rounded-[10px] object-cover" alt="Image">
+                                    </div>
+                                @endforeach
+                            </div>
+                        </div>
+
+                        <!-- Prev button -->
+                        <button id="prevBtn"
+                            class="absolute left-2 top-1/2 -translate-y-1/2 bg-gray-800/60 text-white p-2 rounded-full">
+                            ‹
+                        </button>
+
+                        <!-- Next button -->
+                        <button id="nextBtn"
+                            class="absolute right-2 top-1/2 -translate-y-1/2 bg-gray-800/60 text-white p-2 rounded-full">
+                            ›
+                        </button>
+
+                        <!-- Indicators -->
+                        <div id="indicators" class="absolute bottom-3 left-1/2 -translate-x-1/2 flex space-x-2">
+                            @foreach ($image as $index => $img)
+                                <button class="w-3 h-3 rounded-full {{ $index === 0 ? 'bg-white' : 'bg-gray-400' }}"></button>
+                            @endforeach
+                        </div>
+                    </div>
+
+
+                    {{-- <img src="{{ asset($image[0]) }}" alt="" class="w-full lg:w-[100%] rounded-[10px]"> --}}
                     <div class="flex flex-row gap-3 items-center">
                         <span class="p-2 bg-warning text-xs rounded-[10px] text-white">Kegiatan {{ $kegiatan->kategori }}</span>
                         <span class="text-xs opacity-[50%]">{{ date('D',strtotime($kegiatan->created_at)) }}, {{ date('d M Y',strtotime($kegiatan->created_at)) }}</span>
@@ -46,9 +83,12 @@
             <div class="p-3 shadow-[1px_1px_5px_0px_rgba(0,0,0,0.25)] rounded-[10px]">
                 <div class="flex flex-col gap-3">
                     @foreach($lainnya as $dataKeg)
+                    <?php
+				        $image = json_decode($dataKeg->image);
+				    ?>
                     <div class="flex items-center gap-3 flex-row pb-3">
                         <div class="flex justify-end w-2/5">
-                            <img src="{{ asset('uploads/'.$dataKeg->image) }}" class="rounded-[10px] ">
+                            <img src="{{ asset($image[0]) }}" class="rounded-[10px] ">
                         </div>
                         <div class="flex flex-col gap-3 justify-center w-3/5">
                             <span class="text-xs opacity-[50%]">{{ date('D',strtotime($dataKeg->created_at)) }}, {{ date('d M Y',strtotime($dataKeg->created_at)) }}</span>
@@ -89,4 +129,40 @@
             window.open(`https://www.linkedin.com/sharing/share-offsite/?url=${url}`, '_blank', 'noopener,noreferrer,width=600,height=400');
         }
     </script>
+    <script>
+    const carouselInner = document.getElementById("carousel-inner");
+    const prevBtn = document.getElementById("prevBtn");
+    const nextBtn = document.getElementById("nextBtn");
+    const indicators = document.querySelectorAll("#indicators button");
+    const totalSlides = indicators.length;
+
+    let currentIndex = 0;
+
+    function updateCarousel() {
+        carouselInner.style.transform = `translateX(-${currentIndex * 100}%)`;
+
+        indicators.forEach((dot, idx) => {
+            dot.classList.toggle("bg-white", idx === currentIndex);
+            dot.classList.toggle("bg-gray-400", idx !== currentIndex);
+        });
+    }
+
+    prevBtn.addEventListener("click", () => {
+        currentIndex = (currentIndex - 1 + totalSlides) % totalSlides;
+        updateCarousel();
+    });
+
+    nextBtn.addEventListener("click", () => {
+        currentIndex = (currentIndex + 1) % totalSlides;
+        updateCarousel();
+    });
+
+    indicators.forEach((dot, idx) => {
+        dot.addEventListener("click", () => {
+            currentIndex = idx;
+            updateCarousel();
+        });
+    });
+</script>
+
 @endsection
\ No newline at end of file
diff --git a/resources/views/modules/konten/kegiatan/form.blade.php b/resources/views/modules/konten/kegiatan/form.blade.php
index fefd89f..b8d0f24 100644
--- a/resources/views/modules/konten/kegiatan/form.blade.php
+++ b/resources/views/modules/konten/kegiatan/form.blade.php
@@ -1,6 +1,7 @@
 @extends('layouts.master')
 @section('page-css')
 <link href="https://cdn.jsdelivr.net/npm/summernote@0.9.0/dist/summernote.min.css" rel="stylesheet">
+<link rel="stylesheet" href="{{asset('assets/css/formplugins/dropzone/dropzone.css')}}">
 @endsection
 @section('breadcrumbs')
 <ol class="breadcrumb page-breadcrumb">
@@ -22,7 +23,7 @@
             <div class="card-header">
                 <i class="fal fa-align-justify"></i> {{$title}}
             </div>
-            <form action="{{route($route.'.store')}}" method="POST" enctype="multipart/form-data">
+            <form action="{{route($route.'.store')}}" method="POST" enctype="multipart/form-data" id="form">
             {{csrf_field()}}
             <div class="card-body">
                 <div class="row">
@@ -76,7 +77,16 @@
                         <div class="form-group">
                             <label class="col-xl-12 form-label" for="fname">Image</label>
                             <div class="col-12 pr-1">
-                                <input type="file" accept=".png,.jpg,.jpeg" name="image"  class="form-control @error('image') is-invalid @enderror">
+                                {{-- <input type="file" accept=".png,.jpg,.jpeg" name="image"  class="form-control @error('image') is-invalid @enderror"> --}}
+                                <div style="border: 2px dashed #0087F7; padding: 20px;" class="dropzone" id="my-dropzone">
+                                    <div class="dz-message">
+                                        Drop PDF files here or click to upload
+                                    </div>
+                                </div>
+                                <div id="uploaded-files" style="margin-top: 20px; display:none;">
+                                    <ul id="file-list">
+                                    </ul>
+                                </div>
                                 @error('image')
                                 <span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
                                 @enderror
@@ -84,6 +94,26 @@
                         </div>
                     </div>
 
+                    @if(@$item->image)
+                        <?php
+                            $image = json_decode($item->image);
+                        ?>
+                        <div class="col-12 mb-3">
+                            <div class="form-group">
+                                <div class="col-12 pr-1">
+                                    <div class="row mb-2">
+                                        @foreach($image as $img)
+                                        <div class="col-3">
+                                            <img src="{{ asset($img) }}" alt="" class="img-fluid">
+                                            <a href="#" data-url="{{ $img }}" data-href="{{ route($route.'.image.delete',encode_id($item->KegiatanId)) }}" class="btn btn-danger btnDeleteImage mt-1 btn-block">Hapus</a>
+                                        </div>
+                                        @endforeach
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    @endif
+
                 </div>
             </div>
             <div class="card-footer">
@@ -102,9 +132,59 @@
 @section('page-js')
 <!-- include summernote css/js -->
     <script src="https://cdn.jsdelivr.net/npm/summernote@0.9.0/dist/summernote.min.js"></script>
+    <script type="text/javascript" src="{{asset('assets/js/formplugins/dropzone/dropzone.js')}}"></script>
 	<script type="text/javascript">
     $(document).ready(function() {
         $('#summernote').summernote();
+    });
+    $('.btnDeleteImage').on('click',function(){
+        var base_url = $(this).attr('data-href');
+        var url = $(this).attr('data-url');
+            swal({
+                title: "Hapus Data!",
+                text: "Apa anda yakin ingin menghapus data ini ?",
+                type: "warning",
+                showCancelButton: true,
+                confirmButtonColor: "#DD6B55",
+                confirmButtonText: "Ya Hapus Sekarang",
+                cancelButtonText: "Tidak",
+                closeOnConfirm: true,
+                closeOnCancel: true
+            },
+            function(isConfirm) {
+                if(isConfirm){
+                
+                request = $.ajax({
+                    url: base_url,
+                    xhrFields: {
+                        withCredentials: true
+                    },
+                    headers: {
+                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
+                        'X-Requested-With': 'XMLHttpRequest'
+                    },
+                    data:{
+                        url:url
+                    },
+                    type: "POST",
+                });
+
+                // Callback handler that will be called on success
+                request.done(function(response, textStatus, jqXHR){
+                    console.log(response);
+                    toastr.success("Berhasil Menhapus Data", 'Berhasil!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
+                    setInterval(window.location.reload(), 5000);
+                });
+
+                // Callback handler that will be called on failure
+                request.fail(function (jqXHR, textStatus, errorThrown){
+                    toastr.error(
+                        "Gagal "+textStatus, errorThrown
+                    );
+                });
+                }
+            }); 
+            return false;
     });
      $(document).ready(function() {
             $('.numberInput').on('input', function() {
@@ -124,5 +204,52 @@
                 }
             });
         });   
+
+        const myDropzone = new Dropzone(".dropzone", {
+                url: "{{ url('uploadTempImage') }}", // URL ke controller kamu
+                method: "POST",
+                xhrFields: {
+                    withCredentials: true
+                },
+                headers: {
+                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
+                    'X-Requested-With': 'XMLHttpRequest'
+                },
+                // maxFilesize: 1, // dalam MB
+                acceptedFiles: ".png,.jpg,.jpeg",
+                paramName: "file", // nama input file yang dikirim ke controller
+                params: {
+                    _token: document.querySelector('meta[name="csrf-token"]').getAttribute('content')
+                },
+                uploadMultiple: true,
+                init: function() {
+                    this.on("successmultiple", function(files, response) {
+                        console.log('Upload success multiple:', response);
+
+                        const fileList = document.getElementById('file-list');
+
+                        response.files.forEach(function(fileInfo) {
+                            const li = document.createElement('li');
+                            li.innerHTML = `<a>${fileInfo.filename}</a>`;
+                            fileList.appendChild(li);
+
+                            // Tambahkan ke hidden input kalau perlu
+                            const hiddenInput = document.createElement('input');
+                            hiddenInput.type = 'hidden';
+                            hiddenInput.name = 'input_upload_files[]';
+                            hiddenInput.class = 'removeFormKriteria';
+                            hiddenInput.value = fileInfo.filename;
+                            var elem = '<input type="hidden" name="input_upload_files[]" value="'+fileInfo.filename+'" class="removeFormKriteria uploadedFiles is-required">';
+                            $('#form').append(elem);
+                        });
+                    });
+
+                    this.on("error", function(file, response) {
+                        console.error('Upload error:', response);
+                        toastr.error(response, 'Error!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
+                        this.removeFile(file);
+                    });
+                }
+            });
     </script>
 @endsection
\ No newline at end of file
diff --git a/routes/modules/modules.php b/routes/modules/modules.php
index 6230ab2..c269c7a 100644
--- a/routes/modules/modules.php
+++ b/routes/modules/modules.php
@@ -43,6 +43,7 @@ Route::name('konten.')->prefix('konten')->group(function () {
         Route::get('/update/{id?}',[KegiatanController::class,'update'])->name('update');
         Route::get('/grid',[KegiatanController::class,'grid'])->name('grid');
         Route::get('delete/{id?}',[KegiatanController::class,'delete'])->name('delete');
+        Route::post('image/delete/{id?}',[KegiatanController::class,'imageDelete'])->name('image.delete');
     });
 
     Route::name('galeri.')->prefix('galeri')->group(function () {
diff --git a/routes/web.php b/routes/web.php
index 801f3d8..4399d15 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -28,6 +28,7 @@ Route::post('get/kecamatan',[AjaxController::class,'getKecamatan'])->name('getKe
 Route::post('get/sekolah',[AjaxController::class,'getSekolah'])->name('getSekolah');
 Route::post('sekolahNpsn',[AjaxController::class,'sekolahNpsn'])->name('sekolahNpsn');
 Route::post('uploadTemp', [AjaxController::class, 'uploadTemp'])->name('uploadTemp');
+Route::post('uploadTempImage', [AjaxController::class, 'uploadTempImage'])->name('uploadTempImage');
 Route::get('hash/{hash}', function ($hash) {
     return Hash::make($hash);
 });