update rintek

main
marszayn 2025-04-10 10:47:28 +07:00
parent 9b9892cd75
commit 89104694bf
19 changed files with 2381 additions and 55 deletions

View File

@ -0,0 +1,23 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class RincianTeknisController extends Controller
{
public function index_arahan()
{
return view('rintek.index_arahan');
}
public function create_arahan()
{
return view('rintek.create_arahan');
}
public function verifikator_arahan()
{
return view('rintek/verifikator_view_arahan');
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 261 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 297 KiB

View File

@ -70,9 +70,6 @@
class="w-full h-full object-cover parallax-img transform transition-transform duration-1000">
<div class="absolute inset-0 bg-gradient-to-t from-black via-black/50 to-transparent"></div>
</div>
<div class="absolute top-4 left-4 flex items-center space-x-2">
<span class="bg-gradient-to-r from-[#7ccf00]/80 to-[#7ccf00]/80 backdrop-blur-sm text-white px-3 py-1 rounded-full text-xs font-medium shadow-md">Environment</span>
</div>
</div>
<div class="lg:w-2/5 xl:w-1/3 p-8 lg:p-12 flex flex-col justify-center relative lg:min-h-[500px]">
<div class="absolute inset-y-0 left-0 w-1 bg-gradient-to-b from-[#7ccf00] via-[#7ccf00] to-[#487fff] rounded-full hidden lg:block transform transition-transform duration-500 group-hover:scale-y-110"></div>
@ -113,9 +110,6 @@
<img src="https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg" alt="News thumbnail"
class="w-full h-64 object-cover transform group-hover:scale-105 transition-all duration-700 ease-in-out">
<div class="absolute inset-0 bg-gradient-to-t from-black via-black/70 to-transparent opacity-80"></div>
<div class="absolute top-4 right-4 flex space-x-2">
<span class="bg-gradient-to-r from-[#7ccf00]/80 to-[#7ccf00]/80 backdrop-blur-sm text-white px-3 py-1 rounded-full text-xs font-medium shadow-md">{{ ['Environment', 'Policy', 'Technology', 'Climate'][$i % 4] }}</span>
</div>
<div class="absolute bottom-0 left-0 w-full p-5">
<div class="flex items-center space-x-2">
<span class="bg-black/40 backdrop-blur-sm text-white/90 px-3 py-1 rounded-full text-xs font-medium border border-white/10">{{ 11 - $i % 10 }} Desember 2024</span>
@ -244,7 +238,7 @@
<!-- Enhanced "See More" button with 3D effect -->
<div class="flex justify-center mt-20">
<a href="#" class="inline-flex items-center px-8 py-3 bg-lime-500 text-white font-medium rounded-lg transition-all duration-300 hover:shadow-lg hover:shadow-[#487fff]/20 hover:-translate-y-1">
<a href="/news" class="inline-flex items-center px-8 py-3 bg-lime-500 text-white font-medium rounded-lg transition-all duration-300 hover:shadow-lg hover:shadow-[#487fff]/20 hover:-translate-y-1">
<span>Lihat Selengkapnya</span>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-2 transform transition-transform duration-300 group-hover:translate-x-1" viewBox="0 0 24 24" stroke="currentColor" fill="none" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7-7 7" />

View File

@ -1,50 +1,50 @@
<!-- Add this code right after the closing </style> tag in your provided code -->
<div id="popupBanner" class="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-20 hidden">
<div id="popupBanner" class="fixed inset-0 z-50 flex items-center justify-center bg-black/85 hidden">
<div class="relative bg-white w-11/12 max-w-6xl rounded-lg shadow-2xl overflow-hidden">
<!-- Header with title and close button -->
<div class="flex justify-between items-center px-6 py-3 border-b border-gray-200">
<h3 class="text-xl font-medium text-gray-800">Banner</h3>
<button id="closePopup" class="text-gray-600 hover:text-gray-900">
<!-- Close button (now floating on top of content) -->
<button id="closePopup" class="absolute right-3 top-3 z-10 text-gray-600 hover:text-gray-900 bg-white/80 rounded-full p-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
<!-- Simplified Slider container -->
<div id="bannerSlider" class="relative overflow-hidden rounded-lg h-[200px] md:h-[500px]">
<!-- Slide 1 -->
<div class="banner-slide absolute inset-0">
<img src="{{ asset ('assets/images/home/slider.jpg') }}"
alt="Banner Image" class="w-full h-full object-cover">
</div>
<!-- Slider container -->
<div id="bannerSlider" class="relative w-full">
<!-- Slide 1 - Government Banner -->
<div class="banner-slide">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Government Banner" class="w-[800px] h-[400px]">
<!-- Slide 2 -->
<div class="banner-slide absolute inset-0 hidden">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png"
alt="Banner Image" class="w-full h-full object-cover">
</div>
<!-- Slide 2 - Government Banner -->
<div class="banner-slide hidden">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Government Banner" class="w-[800px] h-[400px]">
<!-- Slide 3 -->
<div class="banner-slide absolute inset-0 hidden">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png"
alt="Banner Image" class="w-full h-full object-cover">
</div>
<!-- Slide 3 - Government Banner -->
<div class="banner-slide hidden">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Government Banner" class="w-[800px] h-[400px]">
</div>
<!-- Navigation arrows -->
<button id="prevSlide" class="absolute left-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-70 hover:bg-opacity-90 rounded-full p-3 shadow-md transition">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-gray-800" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<!-- Navigation -->
<button id="prevSlide" class="absolute left-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
</svg>
</button>
<button id="nextSlide" class="absolute right-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-70 hover:bg-opacity-90 rounded-full p-3 shadow-md transition">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-gray-800" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<button id="nextSlide" class="absolute right-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</button>
<!-- Dots indicator -->
<!-- Dots -->
<div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2">
<button class="w-3 h-3 rounded-full bg-gray-300 dot-indicator active"></button>
<button class="w-3 h-3 rounded-full bg-gray-300 dot-indicator"></button>
<button class="w-3 h-3 rounded-full bg-gray-300 dot-indicator"></button>
<button class="w-3 h-3 rounded-full bg-white/50 dot-indicator active"></button>
<button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
<button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
</div>
</div>
</div>

View File

@ -114,7 +114,7 @@
</div>
<!-- Login Button with enhanced style -->
<a href="#login" class=" bg-lime-500 ml-4 relative overflow-hidden group text-white px-6 py-2.5 rounded-full
<a href="/auth/login" class=" bg-lime-500 ml-4 relative overflow-hidden group text-white px-6 py-2.5 rounded-full
hover:shadow-lg">
<span class="relative z-10">MASUK</span>
<span class="absolute left-0 bottom-0 w-0 h-full bg-blue-600 group-hover:w-full transition-all duration-300"></span>

View File

@ -1,4 +1,4 @@
<section class="relative bg-gray-100 font-sans" style="z-index: 10;">
<section class="relative bg-gray-100 font-sans" style="z-index: 9;">
<div class="bg-gradient-to-r from-blue-600 to-indigo-800 text-white" >
<div class="container mx-auto px-4 py-16 md:py-24">
<div class="max-w-3xl mx-auto text-center">
@ -11,7 +11,7 @@
</div>
</div>
<div class="container mx-auto px-4 py-12 mx-auto max-w-7xl">
<div class="container mx-auto px-4 py-12 max-w-7xl">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Article (Kiri) -->
<div class="w-full lg:w-2/3">
@ -128,6 +128,21 @@
<svg class="w-3 h-3 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
</a>
</div>
<!-- Article 3 -->
<div class="group transition-all duration-300 hover:translate-y-[-2px]">
<div class="relative overflow-hidden rounded-lg mb-2">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png"
alt="Masa Depan Transportasi"
class="w-full h-40 object-cover transform group-hover:scale-105 transition-transform duration-300">
</div>
<h4 class="font-semibold text-gray-900 group-hover:text-blue-600 transition-colors">Masa Depan Transportasi</h4>
<p class="text-gray-500 text-sm mt-1 mb-2 line-clamp-2">Dari mobil listrik hingga hyperloop, menjelajahi cara kita akan berpergian di masa depan.</p>
<a href="#" class="text-blue-600 text-sm font-medium hover:text-blue-800 inline-flex items-center">
Baca selengkapnya
<svg class="w-3 h-3 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
</a>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,253 @@
<section class="relative bg-gray-100 font-sans" style="z-index: 9;">
<div class="bg-gradient-to-r from-blue-600 to-indigo-800 text-white" >
<div class="container mx-auto px-4 py-16 md:py-24">
<div class="max-w-3xl mx-auto text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-4">Berita & Updates</h1>
<p class="text-xl md:text-2xl opacity-90">Temukan informasi terbaru dan video menarik seputar Sistem Pengelolaan Dokumen Lingkungan dan kebijakan lingkungan hidup</p>
</div>
</div>
</div>
<div class="container mx-auto px-4 py-12 max-w-7xl">
<!-- News Articles Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="news-container">
<!-- Sample article 1 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Teknologi AI" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">5 April 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">Kemajuan AI dalam Industri Kesehatan</h3>
<p class="text-gray-600 mb-4">Bagaimana kecerdasan buatan merevolusi diagnosis dan perawatan dalam bidang medis...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
<!-- Sample article 2 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Robotika" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">2 April 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">Robot Asisten Rumah Tangga Masa Depan</h3>
<p class="text-gray-600 mb-4">Perkembangan terbaru dalam robotika yang membantu pekerjaan rumah tangga sehari-hari...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
<!-- Sample article 3 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Eksplorasi Luar Angkasa" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">30 Maret 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">Misi Mars Pertama dengan Awak Manusia</h3>
<p class="text-gray-600 mb-4">Persiapan dan tantangan untuk misi bersejarah pengiriman manusia ke planet merah...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
<!-- Sample article 4 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Energi Terbarukan" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">25 Maret 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">Terobosan Baru dalam Teknologi Panel Surya</h3>
<p class="text-gray-600 mb-4">Efisiensi panel surya mencapai level tertinggi dengan material nano-photonic...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
<!-- Sample article 5 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Komputasi Kuantum" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">20 Maret 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">Komputer Kuantum Merevolusi Kriptografi</h3>
<p class="text-gray-600 mb-4">Implikasi dari pengembangan komputer kuantum terhadap keamanan data global...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
<!-- Sample article 6 -->
<div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
<img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Bioteknologi" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">15 Maret 2025</span>
</div>
<h3 class="text-xl font-bold mb-2">CRISPR Menjadi Pilihan Utama Terapi Gen</h3>
<p class="text-gray-600 mb-4">Perkembangan terapi gen dengan teknologi CRISPR untuk mengobati penyakit genetik...</p>
<a href="#" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
</div>
</div>
<!-- Load More Button -->
<div class="flex justify-center mt-10">
<button id="load-more-btn" class="bg-indigo-600 hover:bg-indigo-700 text-white font-bold py-3 px-8 rounded-lg transition-all duration-300 transform hover:scale-105 flex items-center" data-page="1">
<span>Lihat Artikel Lainnya</span>
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
</svg>
</button>
</div>
<!-- JavaScript for Load More functionality -->
<script>
document.addEventListener('DOMContentLoaded', function() {
const loadMoreBtn = document.getElementById('load-more-btn');
const newsContainer = document.getElementById('news-container');
// Sample data for demonstration
const moreArticles = [
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "10 Maret 2025",
title: "Virtual Reality untuk Pendidikan Jarak Jauh",
excerpt: "Bagaimana teknologi VR mengubah cara kita belajar dan mengajar dalam era digital",
slug: "virtual-reality-pendidikan"
},
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "5 Maret 2025",
title: "Mobil Terbang Mulai Uji Coba di Perkotaan",
excerpt: "Prototipe mobil terbang memasuki fase uji coba di lingkungan perkotaan untuk pertama kalinya",
slug: "mobil-terbang-uji-coba"
},
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "1 Maret 2025",
title: "Interface Otak-Komputer Generasi Baru",
excerpt: "Perangkat non-invasif baru memungkinkan kendali komputer hanya dengan pikiran",
slug: "brain-computer-interface"
},
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "25 Februari 2025",
title: "Daging Kultur Laboratorium Memasuki Pasar Global",
excerpt: "Produksi daging dalam laboratorium mencapai skala komersial dan mulai tersedia untuk konsumen",
slug: "daging-laboratorium"
},
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "20 Februari 2025",
title: "Drone Pengirim Bantuan Medis di Daerah Terpencil",
excerpt: "Jaringan drone otonom menyediakan layanan medis darurat ke wilayah yang sulit dijangkau",
slug: "drone-medis"
},
{
image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
published_date: "15 Februari 2025",
title: "Material Super-Konduktor Bekerja pada Suhu Ruangan",
excerpt: "Penemuan material super-konduktor yang bekerja pada suhu kamar membuka peluang untuk revolusi energi",
slug: "super-konduktor"
}
];
let currentPage = 1;
const totalPages = 3;
loadMoreBtn.addEventListener('click', function() {
currentPage++;
const loadingText = loadMoreBtn.innerHTML;
// Show loading state
loadMoreBtn.innerHTML = `
<svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
Loading...
`;
// Simulate AJAX request with setTimeout
setTimeout(() => {
if (currentPage <= totalPages) {
// For demo, we'll just use our sample data
moreArticles.forEach(article => {
const articleElement = createArticleElement(article);
newsContainer.appendChild(articleElement);
});
// If reached the last page, hide the button
if (currentPage === totalPages) {
loadMoreBtn.style.display = 'none';
} else {
loadMoreBtn.innerHTML = loadingText;
}
} else {
// No more articles
loadMoreBtn.innerHTML = 'Tidak ada artikel lagi';
loadMoreBtn.disabled = true;
loadMoreBtn.classList.remove('bg-indigo-600', 'hover:bg-indigo-700');
loadMoreBtn.classList.add('bg-gray-400', 'cursor-not-allowed');
}
}, 1000);
});
// Helper function to create an article element
function createArticleElement(article) {
const div = document.createElement('div');
div.className = 'bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1';
div.innerHTML = `
<img src="${article.image}" alt="${article.title}" class="w-full h-48 object-cover">
<div class="p-5">
<div class="flex items-center mb-3">
<span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">${article.published_date}</span>
</div>
<h3 class="text-xl font-bold mb-2">${article.title}</h3>
<p class="text-gray-600 mb-4">${article.excerpt}</p>
<a href="/news/${article.slug}" class="inline-flex items-center text-blue-600 hover:underline">
Baca Selengkapnya
<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
</svg>
</a>
</div>
`;
return div;
}
});
</script>
</div>
</section>

View File

@ -53,11 +53,20 @@
</ul>
</li>
<li>
<a href="#">
<li class="dropdown">
<a href="javascript:void(0)">
<iconify-icon icon="bi:card-text" class="menu-icon"></iconify-icon>
<span>Rincian Teknis</span>
</a>
{{-- submenu --}}
<ul class="sidebar-submenu">
<li>
<a href="{{ route('rintek.index_arahan') }}"><i class="text-primary-600 w-auto"></i>
<iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
<span>Permohonan Arahan</span>
</a>
</li>
</ul>
</li>
<li class="dropdown">

View File

@ -2,7 +2,7 @@
@section('content')
{{-- @include('components.frontend.home.popup') --}}
@include('components.frontend.home.popup')
@include('components.frontend.home.hero')
@include('components.frontend.home.layanan')
@include('components.frontend.home.faq')

View File

@ -2,7 +2,7 @@
@section('content')
@include('components.frontend.news.detail_artikel')
@include('components.frontend.news.index_news')
@include('components.frontend.footer')

View File

@ -0,0 +1,10 @@
@extends('components.frontend.layout')
@section('content')
@include('components.frontend.news.detail_news')
@include('components.frontend.footer')
@endsection

View File

@ -287,12 +287,12 @@
<small class="text-muted d-block">Dokumen telah diverifikasi dan disetujui</small>
<!-- Message Section -->
{{-- <div class="mt-3 border-top pt-3">
<div class="mt-3 border-top pt-3">
<!-- Message History Container -->
<div class="message-history mb-3">
<div class="d-flex flex-column gap-3">
<!-- User Message -->
<div class="d-flex flex-row-reverse gap-2">
{{-- <div class="d-flex flex-row-reverse gap-2">
<div class="avatar avatar-sm bg-primary-600 rounded-circle d-flex align-items-center justify-content-center">
<iconify-icon icon="bi:person-fill" class="text-white"></iconify-icon>
</div>
@ -303,16 +303,16 @@
<div class="text-muted text-xs mt-1">10:30 AM</div>
</div>
</div>
</div>
</div> --}}
<!-- Admin Message -->
<div class="d-flex gap-2">
<div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
<iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
</div>
<div style="max-width: 85%;">
<div class="fw-semibold text-xs mb-1">Budi Santoso</div>
<div class="fw-semibold text-xs mb-1">Tim Sekretariat</div>
<div class="bg-light rounded p-2 px-3">
<div>Baik, saya akan upload dokumen tambahan</div>
<div>Perbaiki detail dari keterangan Air Limbah B3</div>
<div class="text-muted text-xs mt-1">10:45 AM</div>
</div>
@ -331,7 +331,7 @@
<iconify-icon icon="f7:paperplane" class="ms-1 text-white"></iconify-icon>
</button>
</div>
</div> --}}
</div>
</div>
</div>
</div>

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,85 @@
@extends('layout.layout')
@php
$title='Permohonan Arahan Dokumen Rincian Teknis';
$subTitle = 'Permohonan Arahan Dokumen Rincian Teknis';
$script = '<script>
let table = new DataTable("#dataTable");
</script>';
@endphp
@section('content')
<div class="card basic-data-table">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">
</h5>
<a href="{{ route('rintek.create_arahan') }}">
<button type="button" class="btn btn-primary-600 radius-8 px-20 py-11">Buat Permohonan</button>
</a>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
<thead>
<tr>
<th scope="col">
<div class="form-check style-check d-flex align-items-center">
{{-- <input class="form-check-input" type="checkbox"> --}}
<label class="form-check-label">
No
</label>
</div>
</th>
<th scope="col">Nomor Permohonan</th>
<th scope="col">Perusahaan</th>
<th scope="col">Nama Kegiatan</th>
<th scope="col">Tipe Perizinan</th>
<th scope="col">Pemohon</th>
<th scope="col">Tanggal</th>
<th scope="col">Status</th>
<th scope="col">Dok</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-check style-check d-flex align-items-center">
{{-- <input class="form-check-input" type="checkbox"> --}}
<label class="form-check-label">
01
</label>
</div>
</td>
{{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
<td>
<a href="{{ route('rintek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
<a href="{{ route('pertek.user_arahan') }}" class="text-primary-600">K24/User</a>
</td>
@include('pertek.arahan.modal_detail_arahan')
{{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
<td>
<div class="d-flex align-items-center">
{{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
<h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
</div>
</td>
<td>Pembangungan Gedung Baru</td>
<td>UKL-UPL</td>
<td>Charles Hasibuan</td>
<td>21 Maret 2025</td>
<td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
<td>
<a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
<iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
@endsection

View File

@ -0,0 +1,833 @@
@extends('layout.layout')
@php
$title='Permohonan Surat Arahan Persetujuan Teknis - Admin View';
$subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
$css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
@endphp
@section('content')
<div class="row gy-4">
<div class="col-md-8">
<div class="card p-0 overflow-hidden position-relative radius-12 h-100">
<div class="card-header py-16 px-24 bg-base border border-end-0 border-start-0 border-top-0">
<h6 class="text-lg mb-0">Detail Permohonan</h6>
</div>
<div class="card-body p-24 pt-10">
<!-- Tab Navigation -->
<ul class="nav button-tab nav-pills mb-16" id="permohonan-tabs" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10 active" id="info-pemohon-tab" data-bs-toggle="pill" data-bs-target="#info-pemohon" type="button" role="tab" aria-controls="info-pemohon" aria-selected="true">
<iconify-icon icon="bi:person-fill" class="text-xl"></iconify-icon>
<span class="line-height-1">Informasi Pemohon</span>
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="persyaratan-tab" data-bs-toggle="pill" data-bs-target="#persyaratan" type="button" role="tab" aria-controls="persyaratan" aria-selected="false">
<iconify-icon icon="bi:file-earmark-text" class="text-xl"></iconify-icon>
<span class="line-height-1">Persyaratan Izin</span>
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="pertanyaan-tab" data-bs-toggle="pill" data-bs-target="#pertanyaan" type="button" role="tab" aria-controls="pertanyaan" aria-selected="false">
<iconify-icon icon="bi:patch-question" class="text-xl"></iconify-icon>
<span class="line-height-1">Pertanyaan</span>
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="timeline-tab" data-bs-toggle="pill" data-bs-target="#timeline" type="button" role="tab" aria-controls="timeline" aria-selected="false">
<iconify-icon icon="material-symbols:timeline" class="text-xl"></iconify-icon>
<span class="line-height-1">Timeline</span>
</button>
</li>
</ul>
<!-- Tab Content -->
<div class="tab-content" id="permohonan-tabs-content">
<!-- Tab 1: Informasi Pemohon -->
<div class="tab-pane fade show active" id="info-pemohon" role="tabpanel" aria-labelledby="info-pemohon-tab" tabindex="0">
<!-- Section Card: Data Pemohon -->
<div class="section-card mb-8">
<div class="section-header active" data-bs-toggle="collapse" href="#dataPemohon" role="button" aria-expanded="true" aria-controls="dataPemohon">
<iconify-icon icon="bi:person-fill" class="section-icon"></iconify-icon>
<h6 class="text-md mb-0">Data Pemohon</h6>
<iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow rotated"></iconify-icon>
</div>
<div class="collapse show" id="dataPemohon">
<div class="section-content p-3">
<div class="row">
<div class="col-sm-6">
<div class="mb-20">
<label for="NamaPemohon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Pemohon <span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="NamaPemohon" value="John Doe" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="Jabatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jabatan <span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="Jabatan" value="Direktur" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="Email" class="form-label fw-semibold text-primary-light text-sm mb-8">Email <span class="text-danger-600">*</span></label>
<input type="email" class="form-control radius-8" id="Email" value="john.doe@example.com" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="Telepon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nomor Telepon</label>
<input type="text" class="form-control radius-8" id="Telepon" value="08123456789" disabled>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Section Card: Data Kegiatan -->
<div class="section-card mb-8">
<div class="section-header" data-bs-toggle="collapse" href="#dataKegiatan" role="button" aria-expanded="false" aria-controls="dataKegiatan">
<iconify-icon icon="bi:building" class="section-icon"></iconify-icon>
<h6 class="text-md mb-0">Data Kegiatan</h6>
<iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
</div>
<div class="collapse" id="dataKegiatan">
<div class="section-content p-3">
<div class="row">
<div class="col-sm-6">
<div class="mb-20">
<label for="NamaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan <span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="NamaKegiatan" value="Pengolahan Limbah Industri" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="JenisKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Kegiatan <span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="JenisKegiatan" value="Industri Pengolahan" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="PelaksanaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Pelaksana Kegiatan</label>
<input type="text" class="form-control radius-8" id="PelaksanaKegiatan" value="PT Example Industries" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="AlamatKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Alamat Kegiatan <span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="AlamatKegiatan" value="Jl. Industri No. 123, Jakarta Utara" disabled>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Section Card: Detail Informasi -->
<div class="section-card mb-8">
<div class="section-header" data-bs-toggle="collapse" href="#detailInformasi" role="button" aria-expanded="false" aria-controls="detailInformasi">
<iconify-icon icon="bi:info-circle-fill" class="section-icon"></iconify-icon>
<h6 class="text-md mb-0">Detail Informasi</h6>
<iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
</div>
<div class="collapse" id="detailInformasi">
<div class="section-content p-3">
<div class="row">
<div class="col-sm-6">
<div class="mb-20">
<label for="JenisIzinLingkungan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Izin Lingkungan <span class="text-danger-600">*</span></label>
<select class="form-control radius-8 form-select" id="JenisIzinLingkungan" disabled>
<option selected>Persetujuan Teknis - Pemenuhan Baku Mutu Air Limbah (Pemanfaatan)</option>
</select>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="StatusPemodalan" class="form-label fw-semibold text-primary-light text-sm mb-8">Status Pemodalan</label>
<input type="text" class="form-control radius-8" id="StatusPemodalan" value="PMDN" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="NIB" class="form-label fw-semibold text-primary-light text-sm mb-8">NIB<span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="NIB" value="8123456789012" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="KBLI" class="form-label fw-semibold text-primary-light text-sm mb-8">KBLI <span class="text-danger-600">*</span></label>
<select class="form-control radius-8 form-select" id="KBLI" disabled>
<option selected>10293 (lndustri Pembekuan Biota Air Lainnya)</option>
</select>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="OperasionalKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Operasional Kegiatan<span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="OperasionalKegiatan" value="24 Jam" disabled>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label for="Skala" class="form-label fw-semibold text-primary-light text-sm mb-8">Skala<span class="text-danger-600">*</span></label>
<input type="text" class="form-control radius-8" id="Skala" value="Menengah" disabled>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tab 2: Persyaratan Izin -->
<div class="tab-pane fade" id="persyaratan" role="tabpanel" aria-labelledby="persyaratan-tab" tabindex="0">
<div class="row gy-4">
<!-- Surat Permohonan -->
<div class="col-12">
<div class="card border">
<div class="card-body">
<div class="d-flex align-items-center justify-content-between mb-3">
<div class="d-flex align-items-center">
<div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">1</div>
<label class="form-label required-field mb-0">Surat Permohonan</label>
</div>
<div class="d-flex align-items-center">
<select class="form-select form-select-sm status-dropdown" style="max-width: 160px;">
<option value="approved" selected data-icon="bi:check-circle-fill" data-color="success">Disetujui</option>
<option value="revision" data-icon="bi:exclamation-triangle" data-color="warning">Perlu Perbaikan</option>
</select>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const statusDropdowns = document.querySelectorAll('.status-dropdown');
statusDropdowns.forEach(dropdown => {
// Initialize with proper styling
styleDropdown(dropdown);
// Update styling when changed
dropdown.addEventListener('change', function() {
styleDropdown(this);
});
});
function styleDropdown(dropdown) {
const selectedOption = dropdown.options[dropdown.selectedIndex];
const color = selectedOption.getAttribute('data-color');
const icon = selectedOption.getAttribute('data-icon');
// Reset classes
dropdown.className = 'form-select form-select-sm status-dropdown';
// Add styling based on selection
dropdown.classList.add(`bg-${color}-100`, `text-${color}-600`);
// Create custom appearance with icon
dropdown.style.borderColor = `var(--bs-${color}-200)`;
dropdown.style.paddingLeft = '28px'; // Space for icon
// Add icon through pseudo-element (controlled by CSS)
const iconStyle = document.createElement('style');
iconStyle.textContent = `
.status-dropdown.bg-${color}-100::before {
content: '';
position: absolute;
left: 8px;
top: 50%;
transform: translateY(-50%);
width: 16px;
height: 16px;
background: url("https://api.iconify.design/${icon}.svg") no-repeat center center;
background-size: contain;
}
`;
// Remove any previous custom styles
const prevStyle = dropdown.nextElementSibling;
if (prevStyle && prevStyle.tagName === 'STYLE') {
prevStyle.remove();
}
dropdown.parentNode.insertBefore(iconStyle, dropdown.nextSibling);
}
});
</script>
</div>
<!-- File Preview Section -->
<div class="file-preview-container mt-3">
<div class="border rounded p-3 bg-light d-flex align-items-start">
<div class="preview-image me-3">
<div class="preview-icon">
<iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
</div>
</div>
<div class="flex-grow-1">
<div class="d-flex justify-content-between align-items-start">
<div>
<h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">surat_permohonan.pdf</h6>
<p class="preview-filesize text-sm text-muted mb-0">1.2 MB</p>
</div>
<div class="d-flex gap-2">
<a href="#" class="btn btn-sm btn-primary-600 d-flex align-items-center justify-content-center gap-2" target="_blank">
<iconify-icon icon="bi:eye-fill" class="text-white"></iconify-icon>
Lihat
</a>
</div>
</div>
<div class="progress mt-2" style="height: 5px;">
<div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
</div>
</div>
</div>
</div>
<div class="mt-2">
<small class="text-muted d-block">Dokumen telah diverifikasi dan disetujui</small>
<!-- Message Section -->
<div class="mt-3 border-top pt-3">
<!-- Message History Container -->
<div class="message-history mb-3">
<div class="d-flex flex-column gap-3">
<!-- User Message -->
{{-- <div class="d-flex flex-row-reverse gap-2">
<div class="avatar avatar-sm bg-primary-600 rounded-circle d-flex align-items-center justify-content-center">
<iconify-icon icon="bi:person-fill" class="text-white"></iconify-icon>
</div>
<div style="max-width: 85%;">
<div class="fw-semibold text-xs mb-1 text-end">Admin Perizinan</div>
<div class="bg-primary-50 rounded p-2 px-3">
<div>Silahkan upload dokumen pendukung lainnya jika ada</div>
<div class="text-muted text-xs mt-1">10:30 AM</div>
</div>
</div>
</div> --}}
<!-- Admin Message -->
<div class="d-flex gap-2">
<div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
<iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
</div>
<div style="max-width: 85%;">
<div class="fw-semibold text-xs mb-1">Tim Sekretariat</div>
<div class="bg-light rounded p-2 px-3">
<div>Perbaiki detail dari keterangan Air Limbah B3</div>
<div class="text-muted text-xs mt-1">10:45 AM</div>
</div>
</div>
</div>
</div>
</div>
<!-- Message Input -->
<div class="d-flex gap-2">
<textarea class="form-control" rows="2" placeholder="Tulis balasan..."></textarea>
<button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
Kirim
<iconify-icon icon="f7:paperplane" class="ms-1 text-white"></iconify-icon>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tab 3: Pertanyaan -->
<div class="tab-pane fade" id="pertanyaan" role="tabpanel" aria-labelledby="pertanyaan-tab" tabindex="0">
<div class="section-card mb-8">
<div class="section-header active">
<iconify-icon icon="bi:question-circle-fill" class="section-icon"></iconify-icon>
<h6 class="text-md mb-0">Pertanyaan dan Jawaban</h6>
</div>
<div class="section-content p-3">
<div class="row">
<div class="col-sm-6">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah berada di lokasi kawasan industri?</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam Kawasan Lindung?</label>
<div class="form-control-plaintext">Tidak</div>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam PIPPIB?</label>
<div class="form-control-plaintext">Tidak</div>
</div>
</div>
<div class="col-sm-6">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengumpulan limbah B3?</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
<div class="col-sm-12">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengolahan air limbah?</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
<!-- Additional details for "Ya" response -->
<div class="col-12">
<div class="card border border-primary-100 rounded-3 p-3 mb-20">
<div class="row">
<div class="col-sm-12 mb-3">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Jumlah IPAL yang telah beroperasi?</label>
<div class="form-control-plaintext">2 Unit</div>
</div>
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
<div class="form-control-plaintext">IPAL beroperasi sejak tahun 2020 dengan kapasitas 100 /hari</div>
</div>
</div>
<div class="col-sm-12">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">
Apakah sebelumnya mempunyai izin IPAL?
</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan emisi?</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
<!-- Additional details for emisi -->
<div class="col-12">
<div class="card border border-primary-100 rounded-3 p-3 mb-20">
<div class="row">
<div class="col-sm-12 mb-3">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
<div class="form-control-plaintext">Emisi dari mesin diesel dan proses produksi</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan Limbah B3?</label>
<div class="form-control-plaintext">Ya</div>
</div>
</div>
<!-- Additional details for limbah B3 -->
<div class="col-12">
<div class="card border border-primary-100 rounded-3 p-3 mb-20">
<div class="row">
<div class="col-sm-12 mb-3">
<div class="mb-20">
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
<div class="form-control-plaintext">Limbah B3 berupa oli bekas, kemasan bekas bahan kimia, dan sludge dari IPAL</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tab 4: Timeline -->
<div class="tab-pane fade" id="timeline" role="tabpanel" aria-labelledby="timeline-tab" tabindex="0">
<div class="section-card mb-8">
<div class="section-header active d-flex justify-content-between align-items-center">
<div class="d-flex align-items-center">
<iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
<h6 class="text-md mb-0">Timeline Status Permohonan</h6>
</div>
<button class="btn btn-success">Simpan</button>
</div>
<div class="section-content p-3">
<div class="timeline-status">
<!-- Item 1: Completed -->
<div class="timeline-item completed">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Permohonan Diterima</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed" selected>Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending">Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">
21 Mar 2025 - 09:30
</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Permohonan telah diterima dan diverifikasi</textarea>
</div>
</div>
</div>
<!-- Item 2: Active -->
<div class="timeline-item active">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Verifikasi Dokumen</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress" selected>In Progress</option>
<option value="pending">Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">
22 Mar 2025 - 10:15
</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Sedang dalam proses verifikasi dokumen oleh tim teknis</textarea>
</div>
</div>
</div>
<!-- Item 3: Active -->
<div class="timeline-item active">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Pembuatan Surat Tanggapan
Arahan Persetujuan Teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress" selected>In Progress</option>
<option value="pending">Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">
25 Mar 2025 - 14:30
</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Pemohon diminta melakukan perbaikan pada dokumen teknis</textarea>
</div>
</div>
</div>
<!-- Item 4: Active -->
<div class="timeline-item active">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Penerbitan Surat Tanggapan
Arahan Persetujuan Teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress" selected>In Progress</option>
<option value="pending">Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">
28 Mar 2025 - 09:45
</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Perbaikan lanjutan pada dokumen pendukung</textarea>
</div>
</div>
</div>
<!-- Item 5: Active -->
<div class="timeline-item active">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Pengajuan Permohonan
Dokumen Persetujuan Teknis(Jakevo)</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress" selected>In Progress</option>
<option value="pending">Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">
02 Apr 2025 - 11:20
</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Pemohon sedang melakukan perbaikan akhir pada dokumen</textarea>
</div>
</div>
</div>
<!-- Item 6: Penjadwalan with date time picker -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Verifikasi Administrasi
berkas permohonan dokumen
persetujuan teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending" selected>Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan..."></textarea>
</div>
</div>
</div>
<!-- Item 7: Pending -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Penjadwalan
Rapat/Sidang Pembahasan
Dokumen Persetujuan Teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending" selected>Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">-</p>
<div class="row mb-2">
<div class="col-md-6">
<label class="form-label text-sm mb-1">Tanggal Rapat</label>
<input type="date" class="form-control form-control-sm">
</div>
<div class="col-md-6">
<label class="form-label text-sm mb-1">Jam</label>
<input type="time" class="form-control form-control-sm">
</div>
</div>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan...">Menunggu kelengkapan dokumen</textarea>
</div>
</div>
</div>
<!-- Item 8: Pending -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Rapat/Sidang Pembahasan
Dokumen Persetujuan Teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending" selected>Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">-</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan..."></textarea>
</div>
</div>
</div>
<!-- Item 9: Pending -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Perbaikan Dokumen
persetujuan Teknis hasil dari
rapat/sidang</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending" selected>Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">-</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan..."></textarea>
</div>
</div>
</div>
<!-- Item 9: Pending -->
<div class="timeline-item">
<div class="timeline-marker"></div>
<div class="timeline-content">
<div class="d-flex justify-content-between align-items-center mb-2">
<h6 class="mb-0">Penerbitan Rekomendasi Persetujuan Teknis</h6>
<select class="form-select form-select-sm status-select" style="width: auto;">
<option value="completed">Completed</option>
<option value="in-progress">In Progress</option>
<option value="pending" selected>Pending</option>
<option value="rejected">Rejected</option>
</select>
</div>
<p class="text-muted small mb-1">-</p>
<div class="mb-2">
<textarea class="form-control form-control-sm mb-2" placeholder="Tambahkan catatan..."></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.timeline-status {
position: relative;
padding-left: 25px;
}
.timeline-status:before {
content: '';
position: absolute;
left: 9px;
top: 6px;
height: calc(100% - 12px);
width: 2px;
background: #e9ecef;
}
.timeline-item {
position: relative;
padding-bottom: 20px;
}
.timeline-marker {
position: absolute;
left: -25px;
top: 6px;
width: 14px;
height: 14px;
border-radius: 50%;
background: #e9ecef;
border: 2px solid #fff;
}
.timeline-item.completed .timeline-marker {
background: #28a745;
box-shadow: 0 0 0 4px rgba(40, 167, 69, 0.2);
}
.timeline-item.rejected .timeline-marker {
background: #dc3545;
box-shadow: 0 0 0 4px rgba(220, 53, 69, 0.2);
}
.timeline-item.active .timeline-marker {
background: #007bff;
box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.2);
}
.timeline-content {
padding-left: 10px;
}
.status-select {
min-width: 120px;
}
</style>
<script>
// Add script to handle status changes
document.addEventListener('DOMContentLoaded', function() {
const statusSelects = document.querySelectorAll('.status-select');
statusSelects.forEach(select => {
select.addEventListener('change', function() {
const timelineItem = this.closest('.timeline-item');
// Remove all status classes
timelineItem.classList.remove('completed', 'active', 'rejected');
// Add the appropriate class based on selection
if (this.value === 'completed') {
timelineItem.classList.add('completed');
} else if (this.value === 'in-progress') {
timelineItem.classList.add('active');
} else if (this.value === 'rejected') {
timelineItem.classList.add('rejected');
}
});
});
});
</script>
</div>
</div>
</div>
</div>
</div>
<!-- Informasi Permohonan -->
<div class="col-md-4">
<div class="card">
<div class="card-header bg-light py-3">
<div class="d-flex align-items-center">
<iconify-icon icon="bi:file-earmark-medical" class="text-xl text-primary-600 me-2"></iconify-icon>
<h6 class="mb-0 fw-semibold">Informasi Permohonan</h6>
</div>
</div>
<div class="card-body">
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Nomor Pengajuan</span>
<span class="text-md fw-medium">K24/250319E5CC8C330</span>
</div>
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Jenis Izin</span>
<span class="text-md fw-medium">PERSETUJUAN TEKNIS - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</span>
</div>
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Tipe Perizinan</span>
<span class="text-md fw-medium">Perusahaan/Yayasan/Pemerintahan</span>
</div>
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Status</span>
<span class="badge bg-warning-100 text-warning-600">Menunggu Revisi</span>
</div>
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Kantor/Wilayah</span>
<span class="text-md fw-medium">DPMPTSP DKI JAKARTA
Gedung Mal Pelayanan Publik. Jl.HR. Rasuna Said Kav. 22, Telp. 021-50810900 Website: pelayanan.jakarta.go.id, email: dpmptsp@jakarta.go.id</span>
</div>
<div class="mb-3">
<span class="d-block text-neutral-500 mb-1 text-sm">Tanggal Pengajuan</span>
<span class="text-md">{{ date('d/m/Y') }}</span>
</div>
<!-- Action Buttons -->
<div class="d-flex flex-column gap-2 mt-4">
<button type="button" class="btn btn-primary-600 d-flex align-items-center justify-content-center gap-2">
<iconify-icon icon="bi:check-circle-fill"></iconify-icon>
Setujui Permohonan
</button>
<button type="button" class="btn btn-outline-danger d-flex align-items-center justify-content-center gap-2">
<iconify-icon icon="bi:x-circle-fill"></iconify-icon>
Tolak Permohonan
</button>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@ -6,6 +6,7 @@ use App\Http\Controllers\PenugasanController;
use App\Http\Controllers\PerizinanLingkunganController;
use App\Http\Controllers\PersetujuanTeknisController;
use App\Http\Controllers\ProfileController;
use App\Http\Controllers\RincianTeknisController;
use App\Http\Controllers\SuratArahanController;
use Illuminate\Support\Facades\Route;
@ -13,6 +14,10 @@ Route::get('/', function () {
return view('/frontend/home');
});
Route::get('/news/detail', function () {
return view('/frontend/news_detail');
});
Route::get('/news', function () {
return view('/frontend/news');
});
@ -34,17 +39,24 @@ Route::get('/dashboard', [DashboardController::class, 'index'])->name('dashboard
// login
Route::get('/auth/login', [LoginController::class, 'index'])->name('login.index');
// Perizinan
// Pertek
Route::prefix('admin')->group(function () {
Route::get('/pertek/arahan', [PersetujuanTeknisController::class, 'index_arahan'])->name('pertek.index_arahan');
Route::get('/create/arahan', [PersetujuanTeknisController::class, 'create_arahan'])->name('pertek.create_arahan');
Route::get('/verifikator/arahan', [PersetujuanTeknisController::class, 'verifikator_arahan'])->name('pertek.verifikator_arahan');
Route::get('/user/arahan', [PersetujuanTeknisController::class, 'user_arahan'])->name('pertek.user_arahan');
Route::get('/pertek/create-arahan', [PersetujuanTeknisController::class, 'create_arahan'])->name('pertek.create_arahan');
Route::get('/pertek/verifikator/arahan', [PersetujuanTeknisController::class, 'verifikator_arahan'])->name('pertek.verifikator_arahan');
Route::get('/pertek/user/arahan', [PersetujuanTeknisController::class, 'user_arahan'])->name('pertek.user_arahan');
Route::get('/pertek/emisi', [PersetujuanTeknisController::class, 'index_emisi'])->name('pertek.index_emisi');
Route::get('/pertek/airlimbah', [PersetujuanTeknisController::class, 'index_airlimbah'])->name('pertek.index_airlimbah');
Route::get('/pertek/limbahb3', [PersetujuanTeknisController::class, 'index_limbahb3'])->name('pertek.index_limbahb3');
});
//rintek
Route::prefix('admin')->group(function () {
Route::get('/rintek/arahan', [RincianTeknisController::class, 'index_arahan'])->name('rintek.index_arahan');
Route::get('/rintek/create-arahan', [RincianTeknisController::class, 'create_arahan'])->name('rintek.create_arahan');
Route::get('/rintek/verifikator/arahan', [RincianTeknisController::class, 'verifikator_arahan'])->name('rintek.verifikator_arahan');
});
// Penugasan
Route::prefix('admin')->group(function () {
Route::get('/penugasan', [PenugasanController::class, 'index'])->name('penugasan.index');