webdlh-net/Views/Program/Air.cshtml

207 lines
17 KiB
Plaintext
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

@{
Layout = "_Layout";
ViewData["Title"] = "Program Air - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Program Air - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Keywords"] = "Program Air, DLH, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Program Air - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterTitle"] = "Program Air - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Dinas Lingkungan Hidup DKI Jakarta";
// Breadcumb
ViewData["BreadcrumbText"] = "Program Pengendalian Pencemaran Air";
ViewData["TitleBeforeHighlight"] = "Program Pengendalian";
ViewData["TitleHighlight"] = "Pencemaran Air";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<!-- Content Section -->
<section class="container mx-auto px-6 lg:px-12 py-16">
<div class="max-w-6xl mx-auto space-y-12">
<!-- Accordion Container -->
<div class="bg-white rounded-3xl shadow-2xl p-8 lg:p-12 border border-gray-100 space-y-4">
<!-- Accordion Item 1 -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-cyan-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between" onclick="toggleAccordion('accordion1')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="book-open"></i>
<h3 class="text-lg font-semibold text-gray-800">Definisi & Dasar Hukum</h3>
</div>
<i class="text-gray-600 transition-transform duration-200" data-lucide="chevron-down" id="icon1"></i>
</button>
<div id="accordion1" class="hidden px-6 py-4 bg-white">
<p class="text-gray-700 leading-relaxed text-md mb-6">
Pengendalian pencemaran air adalah upaya pencegahan dan penanggulangan pencemaran air serta pemulihan kualitas air untuk menjamin kualitas air agar sesuai dengan baku mutu air (PP Nomor 82 Tahun 2001 Tentang Pengelolaan Kualitas Air Dan Pengendalian Pencemaran Air). Pelaksanaan pengendalian Pencemaran air di Provinsi DKI Jakarta dilakukan berdasarkan:
</p>
<div class="grid gap-3">
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">1</span>
<p class="text-gray-700 text-sm">Undang Undang Nomor 32 Tahun 2009 tentang Perlindungan dan Pengelolaan Lingkungan Hidup</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">2</span>
<p class="text-gray-700 text-sm">Peraturan Pemerintah Nomor 82 Tahun 2001 tentang Pengelolaan Kualitas Air Dan Pengendalian Pencemaran Air</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">3</span>
<p class="text-gray-700 text-sm">Peraturan Menteri Kesehatan Nomor 416/MEN.KES/PER/IX/1990 tentang Syarat-Syarat dan Pengawasan Kualitas Air</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">4</span>
<p class="text-gray-700 text-sm">Peraturan Menteri Negara Lingkungan Hidup Nomor 01 Tahun 2010 tentang Tata Laksana Pengendalian Pencemaran Air</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">5</span>
<p class="text-gray-700 text-sm">Peraturan Menteri Lingkungan Hidup Nomor 5 Tahun 2014 tentang Baku Mutu Air Limbah</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">6</span>
<p class="text-gray-700 text-sm">Keputusan Menteri Negara Lingkungan Hidup Nomor 35 Tahun 1995 tentang Program Kali Bersih</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">7</span>
<p class="text-gray-700 text-sm">Peraturan Gubernur Nomor 122 Tahun 2005 Tentang Pengelolaan Air Limbah Domestik di Provinsi DKI Jakarta</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">8</span>
<p class="text-gray-700 text-sm">Peraturan Gubernur Nomor 69 Tahun 2013 tentang Baku Mutu Air Limbah bagi Kegiatan dan/atau Usaha</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">9</span>
<p class="text-gray-700 text-sm">Keputusan Gubernur Nomor 582 Tahun 1995 tentang Penetapan Peruntukan dan Baku Mutu Air Sungai/ Badan Air serta Baku Mutu Limbah Cair di Wilayah DKI Jakarta</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">10</span>
<p class="text-gray-700 text-sm">Instruksi Gubernur Nomor 59 Tahun 2014 tentang Pengolahan Air Limbah Domestik pada Bangunan Gedung Pemerintah Provinsi DKI Jakarta</p>
</div>
</div>
@* <div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">11</span>
<p class="text-gray-700 text-sm">Rencana Strategis 2017 2022 Dinas Lingkungan Hidup Provinsi DKI Jakarta</p>
</div>
</div> *@
</div>
</div>
</div>
<!-- Accordion Item 2 -->
@* <div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-cyan-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between" onclick="toggleAccordion('accordion2')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="file-text"></i>
<h3 class="text-lg font-semibold text-gray-800">Program & Rencana Kerja 2020</h3>
</div>
<i class="text-gray-600 transition-transform duration-200" data-lucide="chevron-down" id="icon2"></i>
</button>
<div id="accordion2" class="hidden px-6 py-4 bg-white">
<p class="text-gray-700 leading-relaxed text-md mb-6">
Program / Rencana Kerja Dinas Lingkungan Hidup Tahun 2020 yang terkait dengan Pengendalian pencemaran air antara lain:
</p>
<div class="grid gap-3">
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">1</span>
<p class="text-gray-700 text-sm">Pemantauan Kualitas Lingkungan Perairan Laut dan Muara Teluk Jakarta</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">2</span>
<p class="text-gray-700 text-sm">Pemantauan Kualitas Lingkungan Air Tanah</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">3</span>
<p class="text-gray-700 text-sm">Pemantauan Kualitas Lingkungan Air Sungai</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">4</span>
<p class="text-gray-700 text-sm">Pemantauan Kualitas Lingkungan Air Situ/Waduk</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">5</span>
<p class="text-gray-700 text-sm">Perencanaan Pemantauan Kualitas Lingkungan Air Sungai dengan Sistem Onlimo (Online Monitoring)</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">6</span>
<p class="text-gray-700 text-sm">Penyediaan Jasa Pengolahan Air Limbah</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">7</span>
<p class="text-gray-700 text-sm">Penyedotan Limbah Septik Tank</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">8</span>
<p class="text-gray-700 text-sm">Pengolahan IPAS TPST Bantar gebang</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">9</span>
<p class="text-gray-700 text-sm">Pembangunan dan Pemeliharaan Saluran Drainase/Air Lindi</p>
</div>
</div>
<div class="bg-gradient-to-r from-green-50 to-cyan-50 rounded-lg p-4 border-l-4 border-green-500">
<div class="flex items-center space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-green-500 text-white rounded-full flex items-center justify-center text-xs font-bold">10</span>
<p class="text-gray-700 text-sm">Pengolahan Air Limbah dan Pemeliharaan IPAL Laboratorium</p>
</div>
</div>
</div>
</div>
</div> *@
</div>
</div>
</section>
<register-block dynamic-section="scripts" key="jsProgramAir">
<script>
function toggleAccordion(accordionId) {
const accordion = document.getElementById(accordionId);
const icon = document.getElementById('icon' + accordionId.slice(-1));
if (accordion.classList.contains('hidden')) {
accordion.classList.remove('hidden');
icon.style.transform = 'rotate(180deg)';
} else {
accordion.classList.add('hidden');
icon.style.transform = 'rotate(0deg)';
}
}
</script>
</register-block>