update rintek
marszayn
parent
9b9892cd75
commit
89104694bf
|
|
@ -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 |
|
|
@ -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" />
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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')
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
@section('content')
|
||||
|
||||
@include('components.frontend.news.detail_artikel')
|
||||
@include('components.frontend.news.index_news')
|
||||
@include('components.frontend.footer')
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
@extends('components.frontend.layout')
|
||||
|
||||
@section('content')
|
||||
|
||||
@include('components.frontend.news.detail_news')
|
||||
@include('components.frontend.footer')
|
||||
|
||||
|
||||
|
||||
@endsection
|
||||
|
|
@ -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
|
|
@ -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
|
||||
|
|
@ -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 m³/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
|
||||
|
|
@ -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');
|
||||
|
|
|
|||
Loading…
Reference in New Issue