UPDATE
marszayn
parent
709f1d99bf
commit
3d0c1ffe55
|
|
@ -3,16 +3,59 @@
|
|||
namespace App\Http\Controllers;
|
||||
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\File;
|
||||
|
||||
class JadwalSidangController extends Controller
|
||||
{
|
||||
public function index()
|
||||
public function index(Request $request)
|
||||
{
|
||||
return view('penjadwalan.jadwal_sidang');
|
||||
$jadwal = json_decode(File::get(public_path('assets/json/backend/jadwal.json')), true);
|
||||
|
||||
// Filter by document type if provided in request
|
||||
$documentType = $request->input('document_type');
|
||||
if ($documentType) {
|
||||
$jadwal = array_values(array_filter($jadwal, function($item) use ($documentType) {
|
||||
return isset($item['documentType']) && $item['documentType'] === $documentType;
|
||||
}));
|
||||
}
|
||||
|
||||
public function create()
|
||||
return view('penjadwalan.jadwal_sidang', compact('jadwal'));
|
||||
}
|
||||
|
||||
public function create(Request $request)
|
||||
{
|
||||
// Handle form submission for creating new schedule
|
||||
if ($request->isMethod('post')) {
|
||||
$jadwal = json_decode(File::get(public_path('assets/json/backend/jadwal.json')), true);
|
||||
|
||||
// Get the highest ID and increment by 1
|
||||
$maxId = 0;
|
||||
foreach ($jadwal as $item) {
|
||||
if (isset($item['id']) && $item['id'] > $maxId) {
|
||||
$maxId = $item['id'];
|
||||
}
|
||||
}
|
||||
|
||||
// Create new jadwal item
|
||||
$newJadwal = [
|
||||
'id' => $maxId + 1,
|
||||
'title' => $request->input('title'),
|
||||
'start' => $request->input('start_date'),
|
||||
'end' => $request->input('end_date'),
|
||||
'allDay' => $request->input('all_day', false),
|
||||
'documentType' => $request->input('document_type'),
|
||||
'description' => $request->input('description', '')
|
||||
];
|
||||
|
||||
// Add to existing jadwal
|
||||
$jadwal[] = $newJadwal;
|
||||
|
||||
// Save back to JSON file
|
||||
File::put(public_path('assets/json/backend/jadwal.json'), json_encode($jadwal, JSON_PRETTY_PRINT));
|
||||
|
||||
return redirect()->route('jadwal.index')->with('success', 'Jadwal berhasil ditambahkan');
|
||||
}
|
||||
|
||||
return view('penjadwalan.create_jadwal');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@
|
|||
namespace App\Http\Controllers;
|
||||
|
||||
// use Barryvdh\DomPDF\PDF;
|
||||
use Barryvdh\DomPDF\Facade as PDF;
|
||||
// use Barryvdh\DomPDF\Facade as PDF;
|
||||
use Barryvdh\DomPDF\Facade\Pdf;
|
||||
use Barryvdh\DomPDF\Facade\Pdf as FacadePdf;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
|
|
@ -11,21 +12,21 @@ class SuratArahanController extends Controller
|
|||
{
|
||||
public function show()
|
||||
{
|
||||
// $data = [
|
||||
// 'tanggal_surat' => '14 Januari 2025',
|
||||
// 'kepada' => 'Direktur Utama PT. Gedung Bank Exim',
|
||||
// 'nomor_surat' => 'e-0025/LH.01.03',
|
||||
// 'isi_surat' => 'Menindaklanjuti surat Saudara Nomor 1620/DIR-GBE/XI/2024...',
|
||||
// ];
|
||||
|
||||
return view('pertek.subkel.surat');
|
||||
}
|
||||
|
||||
|
||||
public function save(Request $request)
|
||||
{
|
||||
// Ambil data dari form
|
||||
$data = $request->all();
|
||||
$data = $request->validate([
|
||||
'nomor_surat' => 'required',
|
||||
'sifat' => 'required',
|
||||
'lampiran' => 'required',
|
||||
'hal' => 'required',
|
||||
'tanggal_surat' => 'required|date',
|
||||
'kepada' => 'required',
|
||||
'isi_surat' => 'required',
|
||||
]);
|
||||
|
||||
return view('pertek.subkel.surat', compact('data'));
|
||||
}
|
||||
|
|
@ -33,8 +34,24 @@ class SuratArahanController extends Controller
|
|||
|
||||
public function exportPDF(Request $request)
|
||||
{
|
||||
// Get data from session or request
|
||||
if ($request->has('nomor_surat')) {
|
||||
// Data is coming directly from the request
|
||||
$data = $request->all();
|
||||
$pdf = FacadePdf::loadView('pertek.subkel.surat_pdf', compact('data'));
|
||||
return $pdf->download('surat.pdf');
|
||||
} else {
|
||||
// No data provided, redirect back
|
||||
return redirect()->back()->with('error', 'No data available for PDF export.');
|
||||
}
|
||||
|
||||
// Configure PDF with proper settings
|
||||
$pdf = Pdf::loadView('pertek.subkel.surat_pdf', compact('data'))
|
||||
->setPaper('a4')
|
||||
->setOption('margin-top', 10)
|
||||
->setOption('margin-right', 10)
|
||||
->setOption('margin-bottom', 10)
|
||||
->setOption('margin-left', 10)
|
||||
->setOption('dpi', 150);
|
||||
|
||||
return $pdf->download('surat_arahan_' . date('Ymd_His') . '.pdf');
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
"barryvdh/laravel-dompdf": "^3.1",
|
||||
"laravel/framework": "^12.0",
|
||||
"laravel/tinker": "^2.10.1",
|
||||
"mallardduck/blade-lucide-icons": "^1.23",
|
||||
"spatie/laravel-html": "^3.12"
|
||||
},
|
||||
"require-dev": {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "0065f153ee5a0e14c6df3154445ad6bb",
|
||||
"content-hash": "a630bee8cc849f41bc0261821020fefa",
|
||||
"packages": [
|
||||
{
|
||||
"name": "barryvdh/laravel-dompdf",
|
||||
|
|
@ -83,6 +83,87 @@
|
|||
],
|
||||
"time": "2025-02-13T15:07:54+00:00"
|
||||
},
|
||||
{
|
||||
"name": "blade-ui-kit/blade-icons",
|
||||
"version": "1.8.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/driesvints/blade-icons.git",
|
||||
"reference": "7b743f27476acb2ed04cb518213d78abe096e814"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/driesvints/blade-icons/zipball/7b743f27476acb2ed04cb518213d78abe096e814",
|
||||
"reference": "7b743f27476acb2ed04cb518213d78abe096e814",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"illuminate/contracts": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/filesystem": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/support": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/view": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"php": "^7.4|^8.0",
|
||||
"symfony/console": "^5.3|^6.0|^7.0",
|
||||
"symfony/finder": "^5.3|^6.0|^7.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"mockery/mockery": "^1.5.1",
|
||||
"orchestra/testbench": "^6.0|^7.0|^8.0|^9.0|^10.0",
|
||||
"phpunit/phpunit": "^9.0|^10.5|^11.0"
|
||||
},
|
||||
"bin": [
|
||||
"bin/blade-icons-generate"
|
||||
],
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"laravel": {
|
||||
"providers": [
|
||||
"BladeUI\\Icons\\BladeIconsServiceProvider"
|
||||
]
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"files": [
|
||||
"src/helpers.php"
|
||||
],
|
||||
"psr-4": {
|
||||
"BladeUI\\Icons\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Dries Vints",
|
||||
"homepage": "https://driesvints.com"
|
||||
}
|
||||
],
|
||||
"description": "A package to easily make use of icons in your Laravel Blade views.",
|
||||
"homepage": "https://github.com/blade-ui-kit/blade-icons",
|
||||
"keywords": [
|
||||
"blade",
|
||||
"icons",
|
||||
"laravel",
|
||||
"svg"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/blade-ui-kit/blade-icons/issues",
|
||||
"source": "https://github.com/blade-ui-kit/blade-icons"
|
||||
},
|
||||
"funding": [
|
||||
{
|
||||
"url": "https://github.com/sponsors/driesvints",
|
||||
"type": "github"
|
||||
},
|
||||
{
|
||||
"url": "https://www.paypal.com/paypalme/driesvints",
|
||||
"type": "paypal"
|
||||
}
|
||||
],
|
||||
"time": "2025-02-13T20:35:06+00:00"
|
||||
},
|
||||
{
|
||||
"name": "brick/math",
|
||||
"version": "0.12.3",
|
||||
|
|
@ -2238,6 +2319,66 @@
|
|||
],
|
||||
"time": "2024-12-08T08:18:47+00:00"
|
||||
},
|
||||
{
|
||||
"name": "mallardduck/blade-lucide-icons",
|
||||
"version": "1.23.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/mallardduck/blade-lucide-icons.git",
|
||||
"reference": "19081819bb527e15eed22f6528b9d059c1a8df8b"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/mallardduck/blade-lucide-icons/zipball/19081819bb527e15eed22f6528b9d059c1a8df8b",
|
||||
"reference": "19081819bb527e15eed22f6528b9d059c1a8df8b",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"blade-ui-kit/blade-icons": "^1.6",
|
||||
"php": "^8.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"ext-dom": "*",
|
||||
"ext-fileinfo": "*",
|
||||
"orchestra/testbench": "^6.0|^7.0|^8.0|^9.0",
|
||||
"phpunit/phpunit": "^9.0|^10.5|^11.0",
|
||||
"spatie/phpunit-snapshot-assertions": "^4.2.14"
|
||||
},
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"laravel": {
|
||||
"providers": [
|
||||
"MallardDuck\\LucideIcons\\BladeLucideIconsServiceProvider"
|
||||
]
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"MallardDuck\\LucideIcons\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Dan Pock"
|
||||
}
|
||||
],
|
||||
"description": "A package to easily make use of Lucide icons in your Laravel Blade views.",
|
||||
"homepage": "https://github.com/mallardduck/blade-lucide-icons",
|
||||
"keywords": [
|
||||
"LucideIcons",
|
||||
"blade",
|
||||
"laravel"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/mallardduck/blade-lucide-icons/issues",
|
||||
"source": "https://github.com/mallardduck/blade-lucide-icons/tree/1.23.0"
|
||||
},
|
||||
"time": "2024-07-22T15:40:39+00:00"
|
||||
},
|
||||
{
|
||||
"name": "masterminds/html5",
|
||||
"version": "2.9.0",
|
||||
|
|
@ -8507,12 +8648,12 @@
|
|||
],
|
||||
"aliases": [],
|
||||
"minimum-stability": "stable",
|
||||
"stability-flags": [],
|
||||
"stability-flags": {},
|
||||
"prefer-stable": true,
|
||||
"prefer-lowest": false,
|
||||
"platform": {
|
||||
"php": "^8.2"
|
||||
},
|
||||
"platform-dev": [],
|
||||
"plugin-api-version": "2.3.0"
|
||||
"platform-dev": {},
|
||||
"plugin-api-version": "2.6.0"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,57 @@
|
|||
<?php
|
||||
|
||||
return [
|
||||
|
||||
/*
|
||||
|-----------------------------------------------------------------
|
||||
| Default Prefix
|
||||
|-----------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define a default prefix for
|
||||
| your icons. The dash separator will be applied automatically
|
||||
| to every icon name. It's required and needs to be unique.
|
||||
|
|
||||
*/
|
||||
|
||||
'prefix' => 'lucide',
|
||||
|
||||
/*
|
||||
|-----------------------------------------------------------------
|
||||
| Fallback Icon
|
||||
|-----------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define a fallback
|
||||
| icon when an icon in this set cannot be found.
|
||||
|
|
||||
*/
|
||||
|
||||
'fallback' => '',
|
||||
|
||||
/*
|
||||
|-----------------------------------------------------------------
|
||||
| Default Set Classes
|
||||
|-----------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define some classes which
|
||||
| will be applied by default to all icons within this set.
|
||||
|
|
||||
*/
|
||||
|
||||
'class' => '',
|
||||
|
||||
/*
|
||||
|-----------------------------------------------------------------
|
||||
| Default Set Attributes
|
||||
|-----------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define some attributes which
|
||||
| will be applied by default to all icons within this set.
|
||||
|
|
||||
*/
|
||||
|
||||
'attributes' => [
|
||||
// 'width' => 50,
|
||||
// 'height' => 50,
|
||||
],
|
||||
|
||||
];
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
.container {
|
||||
max-width: 100%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.surat-container {
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
font-size: 12pt;
|
||||
line-height: 1.5;
|
||||
width: 210mm;
|
||||
height: auto;
|
||||
min-height: 297mm;
|
||||
padding: 20mm;
|
||||
background-color: white;
|
||||
margin: 0 auto;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.kop-surat {
|
||||
text-align: center;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.kop-surat img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.surat-details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
width: calc(100% - 135px);
|
||||
border: 1px solid #000;
|
||||
padding: 5px;
|
||||
background-color: white;
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
font-size: 12pt;
|
||||
}
|
||||
|
||||
textarea {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.content-surat {
|
||||
margin-top: 20px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 20px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 10px 20px;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.preview-section {
|
||||
margin-top: 30px;
|
||||
border-top: 1px solid #ddd;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.preview-section h3 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.details-table {
|
||||
gap: 10px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.details-table td {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.details-table .label {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.details-table .colon {
|
||||
width: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ttd-section {
|
||||
margin-top: 30px;
|
||||
text-align: right;
|
||||
width: 40%;
|
||||
float: right;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,11 @@
|
|||
function getDatePicker(receiveID) {
|
||||
flatpickr(receiveID, {
|
||||
enableTime: true,
|
||||
dateFormat: "d/m/Y H:i",
|
||||
});
|
||||
}
|
||||
getDatePicker("#startDate");
|
||||
getDatePicker("#endDate");
|
||||
|
||||
getDatePicker("#editstartDate");
|
||||
getDatePicker("#editendDate");
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,41 @@
|
|||
const paginationStyles = document.createElement("style");
|
||||
paginationStyles.textContent = `
|
||||
.pagination-container {
|
||||
margin-top: 1.5rem;
|
||||
border-top: 1px solid #e9ecef;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
.pagination-ellipsis {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 31px;
|
||||
width: 31px;
|
||||
padding: 0 5px;
|
||||
color: var(--bs-secondary);
|
||||
font-weight: bold;
|
||||
}
|
||||
.btn.disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.65;
|
||||
}
|
||||
.pagination-container .btn {
|
||||
min-width: 32px;
|
||||
height: 32px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.pagination-container .btn.btn-primary {
|
||||
font-weight: 600;
|
||||
}
|
||||
`;
|
||||
document.head.appendChild(paginationStyles);
|
||||
|
||||
// Make pagination function available globally
|
||||
window.changePage = function (page) {
|
||||
const url = new URL(window.location);
|
||||
url.searchParams.set("page", page);
|
||||
window.location = url.toString();
|
||||
};
|
||||
|
|
@ -25,165 +25,165 @@ $(document).ready(function () {
|
|||
});
|
||||
/************** initialize the calendar *********************
|
||||
-----------------------------------------------------------------*/
|
||||
var calendar = $("#calendar").fullCalendar({
|
||||
header: {
|
||||
left: "title",
|
||||
center: "agendaDay,agendaWeek,month",
|
||||
right: "prev,next today",
|
||||
},
|
||||
editable: true,
|
||||
firstDay: 1, // 1(Monday) this can be changed to 0(Sunday) for the USA system
|
||||
selectable: true,
|
||||
defaultView: "month",
|
||||
axisFormat: "h:mm",
|
||||
columnFormat: {
|
||||
month: "ddd", // Mon
|
||||
week: "ddd d", // Mon 7
|
||||
day: "dddd M/d", // Monday 9/7
|
||||
agendaDay: "dddd d",
|
||||
},
|
||||
titleFormat: {
|
||||
month: "MMMM yyyy", // September 2009
|
||||
week: "MMMM yyyy", // September 2009
|
||||
day: "MMMM yyyy", // Tuesday, Sep 8, 2009
|
||||
},
|
||||
allDaySlot: false, //cambie a true
|
||||
selectHelper: true,
|
||||
dayClick: function (date, allDay, jsEvent, view) {
|
||||
if (allDay) {
|
||||
// Clicked on the day number
|
||||
calendar
|
||||
.fullCalendar("changeView", "agendaDay" /* or 'basicDay' */)
|
||||
.fullCalendar(
|
||||
"gotoDate",
|
||||
date.getFullYear(),
|
||||
date.getMonth(),
|
||||
date.getDate()
|
||||
);
|
||||
}
|
||||
},
|
||||
select: function (startDate, endDate, allDay) {
|
||||
if (!allDay) {
|
||||
swal({
|
||||
input: "text",
|
||||
title: "Event title:",
|
||||
showCancelButton: true,
|
||||
}).then((result) => {
|
||||
swal.resetDefaults();
|
||||
console.log("result: " + result);
|
||||
if (result) {
|
||||
calendar.fullCalendar(
|
||||
"renderEvent",
|
||||
{
|
||||
title: result,
|
||||
start: startDate,
|
||||
end: endDate,
|
||||
allDay: allDay,
|
||||
},
|
||||
true // make the event "stick"
|
||||
);
|
||||
swal({
|
||||
type: "success",
|
||||
title: "Agended!",
|
||||
html: "Event title: " + result,
|
||||
});
|
||||
} else {
|
||||
swal({
|
||||
type: "warning",
|
||||
title: "Not Agended!",
|
||||
html: "Title is empty! ",
|
||||
});
|
||||
}
|
||||
calendar.fullCalendar("unselect");
|
||||
});
|
||||
}
|
||||
},
|
||||
droppable: true, // this allows things to be dropped onto the calendar !!!
|
||||
drop: function (date, allDay) {
|
||||
// this function is called when something is dropped
|
||||
|
||||
// retrieve the dropped element's stored Event Object
|
||||
var originalEventObject = $(this).data("eventObject");
|
||||
|
||||
// we need to copy it, so that multiple events don't have a reference to the same object
|
||||
var copiedEventObject = $.extend({}, originalEventObject);
|
||||
|
||||
// assign it the date that was reported
|
||||
copiedEventObject.start = date;
|
||||
copiedEventObject.allDay = allDay;
|
||||
|
||||
// render the event on the calendar
|
||||
// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
|
||||
$("#calendar").fullCalendar("renderEvent", copiedEventObject, true);
|
||||
|
||||
// is the "remove after drop" checkbox checked?
|
||||
if ($("#drop-remove").is(":checked")) {
|
||||
// if so, remove the element from the "Draggable Events" list
|
||||
$(this).remove();
|
||||
}
|
||||
},
|
||||
|
||||
events: [
|
||||
// {
|
||||
// title: "All Day Event",
|
||||
// start: new Date(y, m, 1),
|
||||
// var calendar = $("#calendar").fullCalendar({
|
||||
// header: {
|
||||
// left: "title",
|
||||
// center: "agendaDay,agendaWeek,month",
|
||||
// right: "prev,next today",
|
||||
// },
|
||||
// editable: true,
|
||||
// firstDay: 1, // 1(Monday) this can be changed to 0(Sunday) for the USA system
|
||||
// selectable: true,
|
||||
// defaultView: "month",
|
||||
// axisFormat: "h:mm",
|
||||
// columnFormat: {
|
||||
// month: "ddd", // Mon
|
||||
// week: "ddd d", // Mon 7
|
||||
// day: "dddd M/d", // Monday 9/7
|
||||
// agendaDay: "dddd d",
|
||||
// },
|
||||
// titleFormat: {
|
||||
// month: "MMMM yyyy", // September 2009
|
||||
// week: "MMMM yyyy", // September 2009
|
||||
// day: "MMMM yyyy", // Tuesday, Sep 8, 2009
|
||||
// },
|
||||
// allDaySlot: false, //cambie a true
|
||||
// selectHelper: true,
|
||||
// dayClick: function (date, allDay, jsEvent, view) {
|
||||
// if (allDay) {
|
||||
// // Clicked on the day number
|
||||
// calendar
|
||||
// .fullCalendar("changeView", "agendaDay" /* or 'basicDay' */)
|
||||
// .fullCalendar(
|
||||
// "gotoDate",
|
||||
// date.getFullYear(),
|
||||
// date.getMonth(),
|
||||
// date.getDate()
|
||||
// );
|
||||
// }
|
||||
// },
|
||||
// select: function (startDate, endDate, allDay) {
|
||||
// if (!allDay) {
|
||||
// swal({
|
||||
// input: "text",
|
||||
// title: "Event title:",
|
||||
// showCancelButton: true,
|
||||
// }).then((result) => {
|
||||
// swal.resetDefaults();
|
||||
// console.log("result: " + result);
|
||||
// if (result) {
|
||||
// calendar.fullCalendar(
|
||||
// "renderEvent",
|
||||
// {
|
||||
// id: 999,
|
||||
// title: "Repeating Event",
|
||||
// start: new Date(y, m, d - 3, 16, 0),
|
||||
// title: result,
|
||||
// start: startDate,
|
||||
// end: endDate,
|
||||
// allDay: allDay,
|
||||
// },
|
||||
// true // make the event "stick"
|
||||
// );
|
||||
// swal({
|
||||
// type: "success",
|
||||
// title: "Agended!",
|
||||
// html: "Event title: " + result,
|
||||
// });
|
||||
// } else {
|
||||
// swal({
|
||||
// type: "warning",
|
||||
// title: "Not Agended!",
|
||||
// html: "Title is empty! ",
|
||||
// });
|
||||
// }
|
||||
// calendar.fullCalendar("unselect");
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
// droppable: true, // this allows things to be dropped onto the calendar !!!
|
||||
// drop: function (date, allDay) {
|
||||
// // this function is called when something is dropped
|
||||
|
||||
// // retrieve the dropped element's stored Event Object
|
||||
// var originalEventObject = $(this).data("eventObject");
|
||||
|
||||
// // we need to copy it, so that multiple events don't have a reference to the same object
|
||||
// var copiedEventObject = $.extend({}, originalEventObject);
|
||||
|
||||
// // assign it the date that was reported
|
||||
// copiedEventObject.start = date;
|
||||
// copiedEventObject.allDay = allDay;
|
||||
|
||||
// // render the event on the calendar
|
||||
// // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
|
||||
// $("#calendar").fullCalendar("renderEvent", copiedEventObject, true);
|
||||
|
||||
// // is the "remove after drop" checkbox checked?
|
||||
// if ($("#drop-remove").is(":checked")) {
|
||||
// // if so, remove the element from the "Draggable Events" list
|
||||
// $(this).remove();
|
||||
// }
|
||||
// },
|
||||
|
||||
// events: [
|
||||
// // {
|
||||
// // title: "All Day Event",
|
||||
// // start: new Date(y, m, 1),
|
||||
// // },
|
||||
// // {
|
||||
// // id: 999,
|
||||
// // title: "Repeating Event",
|
||||
// // start: new Date(y, m, d - 3, 16, 0),
|
||||
// // allDay: false,
|
||||
// // className: "info",
|
||||
// // },
|
||||
// // {
|
||||
// // id: 999,
|
||||
// // title: "Repeating Event",
|
||||
// // start: new Date(y, m, d + 4, 16, 0),
|
||||
// // allDay: false,
|
||||
// // className: "info",
|
||||
// // },
|
||||
// {
|
||||
// title: "PT Mitra Usaha Sejahtera",
|
||||
// start: new Date(y, m, d, 10, 30),
|
||||
// allDay: false,
|
||||
// className: "info",
|
||||
// },
|
||||
// // {
|
||||
// // title: "Lunch",
|
||||
// // start: new Date(y, m, d, 12, 0),
|
||||
// // end: new Date(y, m, d, 14, 0),
|
||||
// // allDay: false,
|
||||
// // className: "important",
|
||||
// // },
|
||||
// {
|
||||
// id: 999,
|
||||
// title: "Repeating Event",
|
||||
// start: new Date(y, m, d + 4, 16, 0),
|
||||
// allDay: false,
|
||||
// className: "info",
|
||||
// },
|
||||
{
|
||||
title: "PT Mitra Usaha Sejahtera",
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false,
|
||||
className: "info",
|
||||
},
|
||||
// {
|
||||
// title: "Lunch",
|
||||
// start: new Date(y, m, d, 12, 0),
|
||||
// end: new Date(y, m, d, 14, 0),
|
||||
// allDay: false,
|
||||
// title: "Cuti Bersama Idulfitri",
|
||||
// start: new Date(2025, 3, 7, 12, 0),
|
||||
// end: new Date(2025, 3, 7, 14, 0),
|
||||
// allDay: true,
|
||||
// className: "important",
|
||||
// },
|
||||
{
|
||||
title: "Cuti Bersama Idulfitri",
|
||||
start: new Date(2025, 3, 7, 12, 0),
|
||||
end: new Date(2025, 3, 7, 14, 0),
|
||||
allDay: true,
|
||||
className: "important",
|
||||
},
|
||||
{
|
||||
title: "Jumat Agung",
|
||||
start: new Date(2025, 3, 18, 12, 0),
|
||||
end: new Date(2025, 3, 18, 14, 0),
|
||||
allDay: true,
|
||||
className: "important",
|
||||
},
|
||||
// {
|
||||
// title: "Birthday Party",
|
||||
// start: new Date(y, m, d + 1, 19, 0),
|
||||
// end: new Date(y, m, d + 1, 22, 30),
|
||||
// allDay: false,
|
||||
// title: "Jumat Agung",
|
||||
// start: new Date(2025, 3, 18, 12, 0),
|
||||
// end: new Date(2025, 3, 18, 14, 0),
|
||||
// allDay: true,
|
||||
// className: "important",
|
||||
// },
|
||||
// {
|
||||
// title: "Click for Google",
|
||||
// start: new Date(y, m, 28),
|
||||
// end: new Date(y, m, 29),
|
||||
// url: "http://google.com/",
|
||||
// className: "success",
|
||||
// },
|
||||
],
|
||||
});
|
||||
// // {
|
||||
// // title: "Birthday Party",
|
||||
// // start: new Date(y, m, d + 1, 19, 0),
|
||||
// // end: new Date(y, m, d + 1, 22, 30),
|
||||
// // allDay: false,
|
||||
// // },
|
||||
// // {
|
||||
// // title: "Click for Google",
|
||||
// // start: new Date(y, m, 28),
|
||||
// // end: new Date(y, m, 29),
|
||||
// // url: "http://google.com/",
|
||||
// // className: "success",
|
||||
// // },
|
||||
// ],
|
||||
// });
|
||||
});
|
||||
/*!
|
||||
* FullCalendar v1.6.4
|
||||
|
|
@ -1654,7 +1654,7 @@ $(document).ready(function () {
|
|||
function parseISO8601(s, ignoreTimezone) {
|
||||
// ignoreTimezone defaults to false
|
||||
// derived from http://delete.me.uk/2005/03/iso8601.html
|
||||
// TODO: for a know glitch/feature, read tests/issue_206_parseDate_dst.html
|
||||
// TODO: for a know glitch/feature, read s/issue_206_parseDate_dst.html
|
||||
var m = s.match(
|
||||
/^([0-9]{4})(-([0-9]{2})(-([0-9]{2})([T ]([0-9]{2}):([0-9]{2})(:([0-9]{2})(\.([0-9]+))?)?(Z|(([-+])([0-9]{2})(:?([0-9]{2}))?))?)?)?)?$/
|
||||
);
|
||||
|
|
@ -2939,7 +2939,7 @@ function enableTextSelection(element) {
|
|||
});
|
||||
|
||||
// TODO: make it work in quirks mode (event corners, all-day height)
|
||||
// TODO: test liquid width, especially in IE6
|
||||
// TODO: liquid width, especially in IE6
|
||||
|
||||
function AgendaView(element, calendar, viewName) {
|
||||
var t = this;
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,92 @@
|
|||
[
|
||||
{
|
||||
"id": 1,
|
||||
"title": "PT Mitra Usaha Sejahtera",
|
||||
"start": "2025-05-05T10:30:00",
|
||||
"end": "2025-05-05T14:30:00",
|
||||
"allDay": false,
|
||||
"documentType": "amdal",
|
||||
"description": "Sidang AMDAL untuk evaluasi dampak lingkungan proyek pembangunan pabrik"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"title": "PT Buana Karya",
|
||||
"start": "2025-05-07T13:00:00",
|
||||
"end": "2025-05-07T15:00:00",
|
||||
"allDay": false,
|
||||
"documentType": "pertek",
|
||||
"description": "Sidang PERTEK untuk persetujuan teknis pembangunan IPAL"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"title": "CV Maju Bersama",
|
||||
"start": "2025-05-08T09:00:00",
|
||||
"end": "2025-05-08T11:30:00",
|
||||
"allDay": false,
|
||||
"documentType": "andal_rkl_rpl",
|
||||
"description": "Presentasi dan evaluasi dokumen ANDAL RKL-RPL"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"title": "PT Sejahtera Mandiri",
|
||||
"start": "2025-05-09T11:30:00",
|
||||
"end": "2025-05-09T13:00:00",
|
||||
"allDay": false,
|
||||
"documentType": "ukl_upl",
|
||||
"description": "Pemaparan dan diskusi dokumen UKL-UPL proyek perumahan"
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"title": "PT Energi Alternatif Indonesia",
|
||||
"start": "2025-05-12T10:00:00",
|
||||
"end": "2025-05-12T12:30:00",
|
||||
"allDay": false,
|
||||
"documentType": "addendum",
|
||||
"description": "Pembahasan addendum AMDAL untuk perluasan area operasional"
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"title": "PT Sinar Terang",
|
||||
"start": "2025-05-14T09:00:00",
|
||||
"end": "2025-05-14T11:00:00",
|
||||
"allDay": false,
|
||||
"documentType": "dplh",
|
||||
"description": "Presentasi Dokumen Pengelolaan Lingkungan Hidup (DPLH)"
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"title": "PT Hijau Asri",
|
||||
"start": "2025-05-15T13:30:00",
|
||||
"end": "2025-05-15T16:00:00",
|
||||
"allDay": false,
|
||||
"documentType": "delh",
|
||||
"description": "Evaluasi Dokumen Evaluasi Lingkungan Hidup (DELH)"
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"title": "Cuti Bersama Idulfitri",
|
||||
"start": "2025-03-07",
|
||||
"end": "2025-03-12",
|
||||
"allDay": true,
|
||||
"className": "important",
|
||||
"description": "Cuti bersama lebaran"
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"title": "Jumat Agung",
|
||||
"start": "2025-03-18",
|
||||
"end": "2025-03-18",
|
||||
"allDay": true,
|
||||
"className": "important",
|
||||
"description": "Libur nasional"
|
||||
},
|
||||
{
|
||||
"id": 10,
|
||||
"title": "PT Falih Ananta",
|
||||
"start": "07\/05\/2025 11:00",
|
||||
"end": "07\/05\/2025 16:00",
|
||||
"allDay": false,
|
||||
"documentType": "pertek",
|
||||
"description": "Tester"
|
||||
}
|
||||
]
|
||||
|
|
@ -0,0 +1,306 @@
|
|||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Document filter functionality with dropdown
|
||||
const documentTypeFilter = document.getElementById('document_type_filter');
|
||||
|
||||
if (documentTypeFilter) {
|
||||
documentTypeFilter.addEventListener('change', function() {
|
||||
// Update URL with filter parameter
|
||||
const url = new URL(window.location);
|
||||
|
||||
if (this.value !== 'all') {
|
||||
url.searchParams.set('document_type', this.value);
|
||||
} else {
|
||||
url.searchParams.delete('document_type');
|
||||
}
|
||||
|
||||
window.location = url.toString();
|
||||
});
|
||||
}
|
||||
|
||||
// Document type color mapping
|
||||
const documentTypeColors = {
|
||||
'amdal': 'info',
|
||||
'pertek': 'success',
|
||||
'andal_rkl_rpl': 'warning',
|
||||
'addendum': 'primary',
|
||||
'dplh': 'success',
|
||||
'delh': 'lilac',
|
||||
'ukl_upl': 'danger'
|
||||
};
|
||||
|
||||
// Get events data from PHP backend
|
||||
const jadwalEvents = @json($jadwal ?? []);
|
||||
|
||||
// Format events for fullCalendar
|
||||
const calendarEvents = jadwalEvents.map(event => {
|
||||
// If it's a holiday or special day with className already set, keep it
|
||||
if (event.className) {
|
||||
return event;
|
||||
}
|
||||
|
||||
// Otherwise, set className based on document type
|
||||
return {
|
||||
...event,
|
||||
className: documentTypeColors[event.documentType] || 'primary'
|
||||
};
|
||||
});
|
||||
|
||||
// Render the events list in the sidebar
|
||||
renderEventList(jadwalEvents);
|
||||
|
||||
// Initialize the calendar with filtered events
|
||||
var calendar = $("#calendar").fullCalendar({
|
||||
header: {
|
||||
left: "title",
|
||||
center: "agendaDay,agendaWeek,month",
|
||||
right: "prev,next today",
|
||||
},
|
||||
editable: true,
|
||||
firstDay: 1,
|
||||
selectable: true,
|
||||
defaultView: "month",
|
||||
axisFormat: "h:mm",
|
||||
columnFormat: {
|
||||
month: "ddd",
|
||||
week: "ddd d",
|
||||
day: "dddd M/d",
|
||||
agendaDay: "dddd d",
|
||||
},
|
||||
titleFormat: {
|
||||
month: "MMMM yyyy",
|
||||
week: "MMMM yyyy",
|
||||
day: "MMMM yyyy",
|
||||
},
|
||||
allDaySlot: false,
|
||||
selectHelper: true,
|
||||
// Use the events from JSON
|
||||
events: calendarEvents,
|
||||
eventClick: function(event) {
|
||||
// When an event is clicked, show details in modal
|
||||
$('#exampleModalView').modal('show');
|
||||
// Populate modal with event details
|
||||
$('#exampleModalView .modal-title').text('Detail Jadwal');
|
||||
$('#exampleModalView .modal-body').find('h6').eq(0).text(event.title);
|
||||
$('#exampleModalView .modal-body').find('h6').eq(1).text(formatEventDate(event.start));
|
||||
$('#exampleModalView .modal-body').find('h6').eq(2).text(event.end ? formatEventDate(event.end) : 'N/A');
|
||||
$('#exampleModalView .modal-body').find('h6').eq(3).text(event.description || 'N/A');
|
||||
|
||||
// Set document type indicator color and text
|
||||
const docTypeElement = $('#exampleModalView .modal-body').find('h6').eq(4);
|
||||
if (event.documentType) {
|
||||
const colorClass = `bg-${documentTypeColors[event.documentType]}-600`;
|
||||
docTypeElement.html(`<span class="w-8-px h-8-px ${colorClass} rounded-circle"></span> ${getDocumentTypeName(event.documentType)}`);
|
||||
} else {
|
||||
docTypeElement.text('N/A');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Function to render event list in sidebar
|
||||
function renderEventList(events) {
|
||||
const eventListContainer = document.querySelector('.mt-32');
|
||||
if (!eventListContainer) return;
|
||||
|
||||
// Clear existing events
|
||||
eventListContainer.innerHTML = '';
|
||||
|
||||
// Add filtered events (skip holidays or events with className="important")
|
||||
const filteredEvents = events.filter(event => !event.className || event.className !== 'important');
|
||||
|
||||
// Pagination setup
|
||||
const eventsPerPage = 5;
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const currentPage = parseInt(urlParams.get('page')) || 1;
|
||||
const totalPages = Math.ceil(filteredEvents.length / eventsPerPage);
|
||||
const startIndex = (currentPage - 1) * eventsPerPage;
|
||||
const endIndex = startIndex + eventsPerPage;
|
||||
const paginatedEvents = filteredEvents.slice(startIndex, endIndex);
|
||||
|
||||
if (filteredEvents.length > 0) {
|
||||
// Render events for current page
|
||||
paginatedEvents.forEach(event => {
|
||||
const eventItem = document.createElement('div');
|
||||
eventItem.className = 'event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0';
|
||||
|
||||
// Format date to "20 Maret 2025, 14:00 - 15:00" style
|
||||
const formatAsCustom = (date) => {
|
||||
const d = new Date(date);
|
||||
if (isNaN(d)) return '';
|
||||
|
||||
// Get day, month name in Indonesian, year
|
||||
const day = d.getDate();
|
||||
const monthNames = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
|
||||
const month = monthNames[d.getMonth()];
|
||||
const year = d.getFullYear();
|
||||
|
||||
// Get hours and minutes with leading zeros
|
||||
const hours = String(d.getHours()).padStart(2, '0');
|
||||
const minutes = String(d.getMinutes()).padStart(2, '0');
|
||||
|
||||
return `${day} ${month} ${year}, ${hours}:${minutes}`;
|
||||
};
|
||||
|
||||
const dateDisplay = event.end ?
|
||||
`${formatAsCustom(event.start)} - ${new Date(event.end).toLocaleTimeString('id-ID', {hour: '2-digit', minute: '2-digit'})}` :
|
||||
formatAsCustom(event.start);
|
||||
|
||||
const colorClass = event.documentType ? documentTypeColors[event.documentType] : 'primary';
|
||||
|
||||
eventItem.innerHTML = `
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex flex-column gap-10">
|
||||
<div class="mt-2">
|
||||
<span class="badge bg-${colorClass}-100 text-${colorClass}-600 fw-medium radius-4 text-xs px-8 py-4">
|
||||
${getDocumentTypeName(event.documentType)}
|
||||
</span>
|
||||
</div>
|
||||
<span class="text-secondary-light text-sm">${dateDisplay}</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">${event.title}</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
|
||||
</button>
|
||||
<ul class="dropdown-menu p-12 border bg-base shadow">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10"
|
||||
data-bs-toggle="modal" data-bs-target="#exampleModalView" data-event-id="${event.id}">
|
||||
<iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
|
||||
View
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10"
|
||||
data-bs-toggle="modal" data-bs-target="#exampleModalEdit" data-event-id="${event.id}">
|
||||
<iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10"
|
||||
data-bs-toggle="modal" data-bs-target="#exampleModalDelete" data-event-id="${event.id}">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
`;
|
||||
|
||||
eventListContainer.appendChild(eventItem);
|
||||
});
|
||||
|
||||
// Add pagination controls if needed
|
||||
if (totalPages > 1) {
|
||||
const paginationContainer = document.createElement('div');
|
||||
paginationContainer.className = 'pagination-container mt-16 d-flex justify-content-center align-items-center gap-2';
|
||||
|
||||
// Generate pagination HTML
|
||||
let paginationHTML = '';
|
||||
|
||||
// Previous button
|
||||
paginationHTML += `<button class="btn btn-sm ${currentPage === 1 ? 'btn-outline-secondary disabled' : 'btn-outline-primary'}"
|
||||
${currentPage === 1 ? 'disabled' : `onclick="changePage(${currentPage - 1})"`}>
|
||||
<iconify-icon icon="mdi:chevron-left" class="icon"></iconify-icon>
|
||||
</button>`;
|
||||
|
||||
// Page buttons
|
||||
const maxVisiblePages = 5;
|
||||
const halfVisiblePages = Math.floor(maxVisiblePages / 2);
|
||||
|
||||
let startPage = Math.max(1, currentPage - halfVisiblePages);
|
||||
let endPage = Math.min(totalPages, startPage + maxVisiblePages - 1);
|
||||
|
||||
if (endPage - startPage + 1 < maxVisiblePages) {
|
||||
startPage = Math.max(1, endPage - maxVisiblePages + 1);
|
||||
}
|
||||
|
||||
// First page
|
||||
if (startPage > 1) {
|
||||
paginationHTML += `<button class="btn btn-sm ${1 === currentPage ? 'btn-primary' : 'btn-outline-primary'}"
|
||||
onclick="changePage(1)">1</button>`;
|
||||
|
||||
if (startPage > 2) {
|
||||
paginationHTML += `<span class="pagination-ellipsis">...</span>`;
|
||||
}
|
||||
}
|
||||
|
||||
// Page numbers
|
||||
for (let i = startPage; i <= endPage; i++) {
|
||||
paginationHTML += `<button class="btn btn-sm ${i === currentPage ? 'btn-primary' : 'btn-outline-primary'}"
|
||||
onclick="changePage(${i})">${i}</button>`;
|
||||
}
|
||||
|
||||
// Last page
|
||||
if (endPage < totalPages) {
|
||||
if (endPage < totalPages - 1) {
|
||||
paginationHTML += `<span class="pagination-ellipsis">...</span>`;
|
||||
}
|
||||
|
||||
paginationHTML += `<button class="btn btn-sm ${totalPages === currentPage ? 'btn-primary' : 'btn-outline-primary'}"
|
||||
onclick="changePage(${totalPages})">${totalPages}</button>`;
|
||||
}
|
||||
|
||||
// Next button
|
||||
paginationHTML += `<button class="btn btn-sm ${currentPage === totalPages ? 'btn-outline-secondary disabled' : 'btn-outline-primary'}"
|
||||
${currentPage === totalPages ? 'disabled' : `onclick="changePage(${currentPage + 1})"`}>
|
||||
<iconify-icon icon="mdi:chevron-right" class="icon"></iconify-icon>
|
||||
</button>`;
|
||||
|
||||
paginationContainer.innerHTML = paginationHTML;
|
||||
eventListContainer.appendChild(paginationContainer);
|
||||
}
|
||||
} else {
|
||||
// If no events match filter
|
||||
const noEventsMsg = document.createElement('div');
|
||||
noEventsMsg.className = 'text-center text-secondary-light py-16';
|
||||
noEventsMsg.textContent = 'Tidak ada jadwal untuk ditampilkan';
|
||||
eventListContainer.appendChild(noEventsMsg);
|
||||
}
|
||||
}
|
||||
|
||||
// Add this function outside the DOMContentLoaded listener scope
|
||||
function changePage(page) {
|
||||
const url = new URL(window.location);
|
||||
url.searchParams.set('page', page);
|
||||
window.location = url.toString();
|
||||
}
|
||||
|
||||
// Helper function to format event date
|
||||
function formatEventDate(dateString) {
|
||||
const date = new Date(dateString);
|
||||
if (isNaN(date)) return dateString;
|
||||
|
||||
const options = {
|
||||
day: 'numeric',
|
||||
month: 'short',
|
||||
year: 'numeric'
|
||||
};
|
||||
|
||||
// If not all-day event, include time
|
||||
if (dateString.includes('T')) {
|
||||
options.hour = '2-digit';
|
||||
options.minute = '2-digit';
|
||||
}
|
||||
|
||||
return date.toLocaleDateString('id-ID', options);
|
||||
}
|
||||
|
||||
// Helper function to get display name for document type
|
||||
function getDocumentTypeName(type) {
|
||||
const types = {
|
||||
'amdal': 'AMDAL',
|
||||
'pertek': 'PERTEK',
|
||||
'andal_rkl_rpl': 'ANDAL RKL-RPL',
|
||||
'addendum': 'ADDENDUM',
|
||||
'dplh': 'DPLH',
|
||||
'delh': 'DELH',
|
||||
'ukl_upl': 'UKL-UPL'
|
||||
};
|
||||
return types[type] || type || 'N/A';
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalLabel">Buat Penjadwalan</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<form action="{{ route('jadwal.create') }}" method="POST">
|
||||
@csrf
|
||||
<div class="row">
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan</label>
|
||||
<input type="text" name="title" class="form-control radius-8" placeholder="Masukkan Nama Kegiatan" required>
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="startDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Mulai Tanggal</label>
|
||||
<div class="position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="startDate" name="start_date" type="text" placeholder="03/12/2024, 10:30 AM" required>
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="endDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Sampai Tanggal </label>
|
||||
<div class="position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="endDate" name="end_date" type="text" placeholder="03/12/2024, 2:30 PM" required>
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Perizinan </label>
|
||||
<div class="d-flex align-items-center flex-wrap gap-28">
|
||||
<div class="form-check checked-success d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="amdal" value="amdal" required>
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="amdal">
|
||||
<span class="w-8-px h-8-px bg-info-600 rounded-circle"></span>
|
||||
AMDAL
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-primary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="pertek" value="pertek">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="pertek">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Pertek
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-warning d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="andal_rkl_rpl" value="andal_rkl_rpl">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="andal_rkl_rpl">
|
||||
<span class="w-8-px h-8-px bg-warning-600 rounded-circle"></span>
|
||||
Andal RKL-RPL
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="addendum" value="addendum">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="addendum">
|
||||
<span class="w-8-px h-8-px bg-info-600 rounded-circle"></span>
|
||||
Addendum
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="dplh" value="dplh">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="dplh">
|
||||
<span class="w-8-px h-8-px bg-pink rounded-circle"></span>
|
||||
DPLH
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="delh" value="delh">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="delh">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
DELH
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="document_type" id="ukl_upl" value="ukl_upl">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="ukl_upl">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
UKL-UPL
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mb-20">
|
||||
<label for="desc" class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
|
||||
<textarea class="form-control" id="desc" name="description" rows="4" cols="50" placeholder="Masukkan keterangan"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Batalkan
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<div class="modal fade" id="exampleModalDelete" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-sm modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-body p-24 text-center">
|
||||
<span class="mb-16 fs-1 line-height-1 text-danger">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</span>
|
||||
<h6 class="text-lg fw-semibold text-primary-light mb-0">Apakah Anda yakin ingin menghapus jadwal sidang ini?</h6>
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="w-50 border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Tidak
|
||||
</button>
|
||||
<button type="button" class="w-50 btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Hapus
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
<div class="modal fade" id="exampleModalEdit" tabindex="-1" aria-labelledby="exampleModalEditLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalEditLabel">Edit Event</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<form action="#">
|
||||
<div class="row">
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Event Title : </label>
|
||||
<input type="text" class="form-control radius-8" placeholder="Enter Event Title ">
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="editstartDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Start Date</label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="editstartDate" type="text" placeholder="03/12/2024, 10:30 AM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="editendDate" class="form-label fw-semibold text-primary-light text-sm mb-8">End Date </label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="editendDate" type="text" placeholder="03/12/2024, 2:30 PM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Label </label>
|
||||
<div class="d-flex align-items-center flex-wrap gap-28">
|
||||
<div class="form-check checked-success d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editPersonal">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editPersonal">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Personal
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-primary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editBusiness">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editBusiness">
|
||||
<span class="w-8-px h-8-px bg-primary-600 rounded-circle"></span>
|
||||
Business
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-warning d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editFamily">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editFamily">
|
||||
<span class="w-8-px h-8-px bg-warning-600 rounded-circle"></span>
|
||||
Family
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editImportant">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editImportant">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
Important
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-danger d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editHoliday">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editHoliday">
|
||||
<span class="w-8-px h-8-px bg-danger-600 rounded-circle"></span>
|
||||
Holiday
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mb-20">
|
||||
<label for="desc" class="form-label fw-semibold text-primary-light text-sm mb-8">Description</label>
|
||||
<textarea class="form-control" id="editdesc" rows="4" cols="50" placeholder="Write some text"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Cancel
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<div class="modal fade" id="exampleModalView" tabindex="-1" aria-labelledby="exampleModalViewLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalViewLabel">View Details</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Title</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">PT. Mitra Usaha Sejahtera</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Start Date</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">25 Jan 2024, 10:30AM</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">End Date</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">25 Jan 2024, 2:30AM</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Description</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">N/A</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Jenis Perizinan</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4 d-flex align-items-center gap-2">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Pertek
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -58,6 +58,7 @@
|
|||
<link rel="stylesheet" href="{{ asset('assets/css/style.css') }}">
|
||||
{{-- custom css --}}
|
||||
{!! $css ?? '' !!}
|
||||
@stack('css')
|
||||
|
||||
<!-- Include select2 CSS -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
|
||||
|
|
|
|||
|
|
@ -14,18 +14,18 @@
|
|||
<li>
|
||||
<a href="{{ route('dashboard.index') }}">
|
||||
<iconify-icon icon="solar:home-smile-angle-outline" class="menu-icon"></iconify-icon>
|
||||
<span>Dashboard</span>
|
||||
<span>DASHBOARD</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="{{ route('jadwal.index') }}">
|
||||
<iconify-icon icon="bi:calendar-date" class="menu-icon"></iconify-icon>
|
||||
<span>Penjadwalan</span>
|
||||
<span>PENJADWALAN</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="sidebar-menu-group-title">Persetujuan Teknis</li>
|
||||
{{-- <li class="sidebar-menu-group-title">Persetujuan Teknis</li> --}}
|
||||
<li class="dropdown">
|
||||
<a href="javascript:void(0)">
|
||||
<iconify-icon icon="bi:file-earmark-medical" class="menu-icon"></iconify-icon>
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="sidebar-menu-group-title">Rincian Teknis</li>
|
||||
{{-- <li class="sidebar-menu-group-title">Rincian Teknis</li> --}}
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="javascript:void(0)">
|
||||
|
|
@ -84,7 +84,7 @@
|
|||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="sidebar-menu-group-title">Persetujuan Lingkungan</li>
|
||||
{{-- <li class="sidebar-menu-group-title">Persetujuan Lingkungan</li> --}}
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="javascript:void(0)">
|
||||
|
|
@ -148,7 +148,7 @@
|
|||
{{-- submenu --}}
|
||||
<ul class="sidebar-submenu">
|
||||
<li>
|
||||
<a href="#"><i class="text-primary-600 w-auto"></i>
|
||||
<a href="/admin/pengguna"><i class="text-primary-600 w-auto"></i>
|
||||
<iconify-icon icon="bi:person-fill" class="menu-icon"></iconify-icon>
|
||||
<span>Pengguna</span>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,800 @@
|
|||
@extends('layout.layout')
|
||||
|
||||
@php
|
||||
$title='Dashboard';
|
||||
$subTitle = 'Overview';
|
||||
$script= '<script src="' . asset('assets/js/homeOneChart.js') . '"></script>';
|
||||
@endphp
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="row gy-4 mb-4">
|
||||
<!-- Total Pengajuan -->
|
||||
<div class="col-xl-3 col-lg-6 col-sm-6">
|
||||
<div class="card shadow-none border bg-gradient-start-1 h-100">
|
||||
<div class="card-body p-20">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<p class="fw-medium text-primary-light mb-1">Total Pengajuan</p>
|
||||
<h4 class="mb-1 fw-bold text-primary-600">1,250</h4>
|
||||
<span class="text-sm text-secondary-light">+12% dari bulan lalu</span>
|
||||
</div>
|
||||
<div class="w-50-px h-50-px bg-yellow rounded-circle d-flex justify-content-center align-items-center">
|
||||
<x-lucide-equal class="text-white w-32-px h-32-px mb-0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Izin Disetujui -->
|
||||
<div class="col-xl-3 col-lg-6 col-sm-6">
|
||||
<div class="card shadow-none border bg-gradient-start-2 h-100">
|
||||
<div class="card-body p-20">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<p class="fw-medium text-primary-light mb-1">Izin Disetujui</p>
|
||||
<h4 class="mb-1 fw-bold text-success-main">850</h4>
|
||||
<span class="badge bg-success-subtle text-success-main">+8.2%</span>
|
||||
</div>
|
||||
<div class="w-50-px h-50-px bg-green rounded-circle d-flex justify-content-center align-items-center">
|
||||
<x-lucide-circle-check class="text-white w-32-px h-32-px mb-0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Izin Proses -->
|
||||
<div class="col-xl-3 col-lg-6 col-sm-6">
|
||||
<div class="card shadow-none border bg-gradient-start-3 h-100">
|
||||
<div class="card-body p-20">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<p class="fw-medium text-primary-light mb-1">Dalam Proses</p>
|
||||
<h4 class="mb-1 fw-bold text-info-main">200</h4>
|
||||
<span class="text-sm text-secondary-light">sedang ditinjau</span>
|
||||
</div>
|
||||
<div class="w-50-px h-50-px bg-info rounded-circle d-flex justify-content-center align-items-center">
|
||||
<x-lucide-refresh-cw class="text-white w-32-px h-32-px mb-0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Izin Ditolak -->
|
||||
<div class="col-xl-3 col-lg-6 col-sm-6">
|
||||
<div class="card shadow-none border bg-gradient-start-4 h-100">
|
||||
<div class="card-body p-20">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<p class="fw-medium text-primary-light mb-1">Izin Ditolak</p>
|
||||
<h4 class="mb-1 fw-bold text-danger-main">150</h4>
|
||||
<span class="text-sm text-secondary-light">perlu perbaikan</span>
|
||||
</div>
|
||||
<div class="w-50-px h-50-px bg-red rounded-circle d-flex justify-content-center align-items-center">
|
||||
<x-lucide-circle-x class="text-white w-32-px h-32-px mb-0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Top 10 Izin Tercepat Table -->
|
||||
<div class="row gy-4 mt-4">
|
||||
<div class="col-12">
|
||||
<div class="card shadow-none border h-100">
|
||||
<div class="card-body p-24">
|
||||
<h6 class="mb-3 fw-semibold">Top 5 Izin Tercepat</h6>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" class="text-sm">No</th>
|
||||
<th scope="col" class="text-sm">Nama Izin</th>
|
||||
<th scope="col" class="text-sm">Total Izin</th>
|
||||
<th scope="col" class="text-sm d-none d-lg-table-cell">Waktu Rata-Rata (Pemohon)</th>
|
||||
<th scope="col" class="text-sm d-none d-lg-table-cell">Waktu Rata-Rata (Petugas)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td class="text-sm">SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU EMISI</td>
|
||||
<td class="text-sm">125</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">58 Jam 29 Menit</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">19 Jam 12 Menit</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td class="text-sm">PERSETUJUAN TEKNIS - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</td>
|
||||
<td class="text-sm">89</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">36 Jam 0 Menit</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">26 Jam 24 Menit</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td class="text-sm">SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMBUANGAN)</td>
|
||||
<td class="text-sm">156</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">43 Jam 12 Menit</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">31 Jam 12 Menit</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td class="text-sm">PERSETUJUAN TEKNIS - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMBUANGAN)</td>
|
||||
<td class="text-sm">73</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">50 Jam 24 Menit</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">38 Jam 24 Menit</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td class="text-sm">SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</td>
|
||||
<td class="text-sm">92</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">55 Jam 12 Menit</td>
|
||||
<td class="text-sm d-none d-lg-table-cell">45 Jam 36 Menit</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row gy-4 mt-1">
|
||||
<div class="col-xxl-6 col-xl-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex flex-wrap align-items-center justify-content-between">
|
||||
<h6 class="text-lg mb-0">Grafik Trend Pengajuan Pertek/SLO</h6>
|
||||
<select class="form-select bg-base form-select-sm w-auto">
|
||||
<option>Yearly</option>
|
||||
<option>Monthly</option>
|
||||
<option>Weekly</option>
|
||||
<option>Today</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="d-flex flex-wrap align-items-center gap-2 mt-8">
|
||||
<h6 class="mb-0">1,450</h6>
|
||||
<span class="text-sm fw-semibold rounded-pill bg-success-focus text-success-main border br-success px-8 py-4 line-height-1 d-flex align-items-center gap-1">
|
||||
15% <iconify-icon icon="bxs:up-arrow" class="text-xs"></iconify-icon>
|
||||
</span>
|
||||
<span class="text-xs fw-medium">+ 125 Pengajuan/Bulan</span>
|
||||
</div>
|
||||
<div id="chart" class="pt-28 apexcharts-tooltip-style-1"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xxl-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="mb-2 fw-bold text-lg mb-0">Grafik Trend Distribusi Jenis Izin</h6>
|
||||
<span class="badge bg-info-subtle text-info-main px-8 py-4 rounded-pill fw-medium text-xs">Bidang Perusahaan</span>
|
||||
</div>
|
||||
<select class="form-select form-select-sm w-auto bg-base border text-secondary-light">
|
||||
<option>Today</option>
|
||||
<option>Weekly</option>
|
||||
<option>Monthly</option>
|
||||
<option>Yearly</option>
|
||||
</select>
|
||||
</div>
|
||||
<ul class="d-flex flex-wrap align-items-center mt-3 gap-3">
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-primary-600"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Usaha Perdagangan & Jasa
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-yellow"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Property
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-success-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Manufaktur
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-danger-400"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Lainnya
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="mt-40">
|
||||
<div id="paymentStatusChart" class="margin-16-minus"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- <div class="col-xxl-3 col-xl-6">
|
||||
<div class="card h-100 radius-8 border">
|
||||
<div class="card-body p-24">
|
||||
<h6 class="mb-12 fw-semibold text-lg mb-16">Izin Terbit PerTek</h6>
|
||||
<div class="d-flex align-items-center gap-2 mb-20">
|
||||
<h6 class="fw-semibold mb-0">5,000</h6>
|
||||
<p class="text-sm mb-0">
|
||||
<span class="bg-danger-focus border br-danger px-8 py-2 rounded-pill fw-semibold text-danger-main text-sm d-inline-flex align-items-center gap-1">
|
||||
10%
|
||||
<iconify-icon icon="iconamoon:arrow-down-2-fill" class="icon"></iconify-icon>
|
||||
</span>
|
||||
- 20 Per Day
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="barChart" class="barChart"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xxl-3 col-xl-6">
|
||||
<div class="card h-100 radius-8 border-0 overflow-hidden">
|
||||
<div class="card-body p-24">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between">
|
||||
<h6 class="mb-2 fw-bold text-lg">Users Overview</h6>
|
||||
<div class="">
|
||||
<select class="form-select form-select-sm w-auto bg-base border text-secondary-light">
|
||||
<option>Today</option>
|
||||
<option>Weekly</option>
|
||||
<option>Monthly</option>
|
||||
<option>Yearly</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="userOverviewDonutChart" class="apexcharts-tooltip-z-none"></div>
|
||||
|
||||
<ul class="d-flex flex-wrap align-items-center justify-content-between mt-3 gap-3">
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px radius-2 bg-primary-600"></span>
|
||||
<span class="text-secondary-light text-sm fw-normal">New:
|
||||
<span class="text-primary-light fw-semibold">500</span>
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px radius-2 bg-yellow"></span>
|
||||
<span class="text-secondary-light text-sm fw-normal">Subscribed:
|
||||
<span class="text-primary-light fw-semibold">300</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xxl-9 col-xl-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-body p-24">
|
||||
|
||||
<div class="d-flex flex-wrap align-items-center gap-1 justify-content-between mb-16">
|
||||
<ul class="nav border-gradient-tab nav-pills mb-0" id="pills-tab" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link d-flex align-items-center active" id="pills-to-do-list-tab" data-bs-toggle="pill" data-bs-target="#pills-to-do-list" type="button" role="tab" aria-controls="pills-to-do-list" aria-selected="true">
|
||||
Latest Registered
|
||||
<span class="text-sm fw-semibold py-6 px-12 bg-neutral-500 rounded-pill text-white line-height-1 ms-12 notification-alert">35</span>
|
||||
</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link d-flex align-items-center" id="pills-recent-leads-tab" data-bs-toggle="pill" data-bs-target="#pills-recent-leads" type="button" role="tab" aria-controls="pills-recent-leads" aria-selected="false" tabindex="-1">
|
||||
Latest Subscribe
|
||||
<span class="text-sm fw-semibold py-6 px-12 bg-neutral-500 rounded-pill text-white line-height-1 ms-12 notification-alert">35</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="javascript:void(0)" class="text-primary-600 hover-text-primary d-flex align-items-center gap-1">
|
||||
View All
|
||||
<iconify-icon icon="solar:alt-arrow-right-linear" class="icon"></iconify-icon>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="tab-content" id="pills-tabContent">
|
||||
<div class="tab-pane fade show active" id="pills-to-do-list" role="tabpanel" aria-labelledby="pills-to-do-list-tab" tabindex="0">
|
||||
<div class="table-responsive scroll-sm">
|
||||
<table class="table bordered-table sm-table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Users </th>
|
||||
<th scope="col">Registered On</th>
|
||||
<th scope="col">Plan</th>
|
||||
<th scope="col" class="text-center">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Dianne Russell</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">redaniel@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Free</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user2.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Wade Warren</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">xterris@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Basic</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user3.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Albert Flores</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">seannand@mail.ru</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Standard</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user4.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Bessie Cooper </h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">igerrin@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Business</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user5.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Arlene McCoy</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">fellora@mail.ru</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Enterprise </td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="pills-recent-leads" role="tabpanel" aria-labelledby="pills-recent-leads-tab" tabindex="0">
|
||||
<div class="table-responsive scroll-sm">
|
||||
<table class="table bordered-table sm-table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Users </th>
|
||||
<th scope="col">Registered On</th>
|
||||
<th scope="col">Plan</th>
|
||||
<th scope="col" class="text-center">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Dianne Russell</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">redaniel@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Free</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user2.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Wade Warren</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">xterris@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Basic</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user3.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Albert Flores</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">seannand@mail.ru</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Standard</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user4.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Bessie Cooper </h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">igerrin@gmail.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Business</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user5.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Arlene McCoy</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">fellora@mail.ru</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>27 Mar 2024</td>
|
||||
<td>Enterprise </td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xxl-3 col-xl-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between">
|
||||
<h6 class="mb-2 fw-bold text-lg mb-0">Top Performer</h6>
|
||||
<a href="javascript:void(0)" class="text-primary-600 hover-text-primary d-flex align-items-center gap-1">
|
||||
View All
|
||||
<iconify-icon icon="solar:alt-arrow-right-linear" class="icon"></iconify-icon>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mt-32">
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-24">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Dianne Russell</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$20</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-24">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user2.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Wade Warren</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$20</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-24">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user3.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Albert Flores</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$30</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-24">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user4.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Bessie Cooper</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$40</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-24">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user5.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Arlene McCoy</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$10</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-md mb-0 fw-medium">Arlene McCoy</h6>
|
||||
<span class="text-sm text-secondary-light fw-medium">Agent ID: 36254</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-primary-light text-md fw-medium">$10</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xxl-6 col-xl-12">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between mb-20">
|
||||
<h6 class="mb-2 fw-bold text-lg mb-0">Top Countries</h6>
|
||||
<select class="form-select form-select-sm w-auto bg-base border text-secondary-light">
|
||||
<option>Today</option>
|
||||
<option>Weekly</option>
|
||||
<option>Monthly</option>
|
||||
<option>Yearly</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="row gy-4">
|
||||
<div class="col-lg-6">
|
||||
<div id="world-map" class="h-100 border radius-8"></div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="h-100 border p-16 pe-0 radius-8">
|
||||
<div class="max-h-266-px overflow-y-auto scroll-sm pe-16">
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-12 pb-2">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">USA</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-primary-600 rounded-pill" style="width: 80%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">80%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-12 pb-2">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag2.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">Japan</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-orange rounded-pill" style="width: 60%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">60%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-12 pb-2">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag3.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">France</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-yellow rounded-pill" style="width: 49%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">49%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-12 pb-2">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag4.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">Germany</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-success-main rounded-pill" style="width: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">100%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between gap-3 mb-12 pb-2">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag5.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">South Korea</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-info-main rounded-pill" style="width: 30%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">30%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center justify-content-between gap-3">
|
||||
<div class="d-flex align-items-center w-100">
|
||||
<img src="{{ asset('assets/images/flags/flag1.png') }}" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12">
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="text-sm mb-0">USA</h6>
|
||||
<span class="text-xs text-secondary-light fw-medium">1,240 Users</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2 w-100">
|
||||
<div class="w-100 max-w-66 ms-auto">
|
||||
<div class="progress progress-sm rounded-pill" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar bg-primary-600 rounded-pill" style="width: 80%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-secondary-light font-xs fw-semibold">80%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xxl-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between">
|
||||
<h6 class="mb-2 fw-bold text-lg mb-0">Grafik Trend Distribusi Jenis Izin</h6>
|
||||
<select class="form-select form-select-sm w-auto bg-base border text-secondary-light">
|
||||
<option>Today</option>
|
||||
<option>Weekly</option>
|
||||
<option>Monthly</option>
|
||||
<option>Yearly</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<ul class="d-flex flex-wrap align-items-center mt-3 gap-3">
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-primary-600"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Industri:
|
||||
<span class="text-primary-light fw-bold">450</span>
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-yellow"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Manufaktur:
|
||||
<span class="text-primary-light fw-bold">320</span>
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-success-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Konstruksi:
|
||||
<span class="text-primary-light fw-bold">280</span>
|
||||
</span>
|
||||
</li>
|
||||
<li class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-info-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Lainnya:
|
||||
<span class="text-primary-light fw-bold">150</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="mt-40">
|
||||
<div id="jenisIzinDistributionChart" class="margin-16-minus"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xxl-6">
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 justify-content-between mb-20">
|
||||
<h6 class="mb-2 fw-bold text-lg mb-0">Peta Lokasi AMDAL</h6>
|
||||
<select class="form-select form-select-sm w-auto bg-base border text-secondary-light">
|
||||
<option>Semua Status</option>
|
||||
<option>Sudah AMDAL</option>
|
||||
<option>Belum AMDAL</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div id="amdal-map" style="height: 400px; border-radius: 8px;"></div>
|
||||
|
||||
<div class="mt-3">
|
||||
<div class="d-flex flex-wrap gap-3">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-success-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Sudah AMDAL: <span class="text-primary-light fw-bold">15</span></span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-warning-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Proses AMDAL: <span class="text-primary-light fw-bold">8</span></span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="w-12-px h-12-px rounded-circle bg-danger-main"></span>
|
||||
<span class="text-secondary-light text-sm fw-semibold">Belum AMDAL: <span class="text-primary-light fw-bold">12</span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> --}}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -13,7 +13,7 @@
|
|||
<x-navbar />
|
||||
<div class="dashboard-main-body">
|
||||
|
||||
<x-breadcrumb title='{{ isset($title) ? $title : "" }}' subTitle='{{ isset($subTitle) ? $subTitle : "" }}' />
|
||||
{{-- <x-breadcrumb title='{{ isset($title) ? $title : "" }}' subTitle='{{ isset($subTitle) ? $subTitle : "" }}' /> --}}
|
||||
|
||||
@yield('content')
|
||||
|
||||
|
|
@ -23,6 +23,7 @@
|
|||
</main>
|
||||
|
||||
<x-script script='{!! isset($script) ? $script : "" !!}' />
|
||||
@stack('scripts')
|
||||
|
||||
</body>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,459 @@
|
|||
@extends('layout.layout')
|
||||
@php
|
||||
$title='Data Pengguna';
|
||||
$subTitle = 'Data Pengguna';
|
||||
$script ='<script>
|
||||
$(".remove-item-btn").on("click", function() {
|
||||
$(this).closest("tr").addClass("d-none")
|
||||
});
|
||||
</script>';
|
||||
@endphp
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="card h-100 p-0 radius-12">
|
||||
<div class="card-header border-bottom bg-base py-16 px-24 d-flex align-items-center flex-wrap gap-3 justify-content-between">
|
||||
<div class="d-flex align-items-center flex-wrap gap-3">
|
||||
<span class="text-md fw-medium text-secondary-light mb-0">Show</span>
|
||||
<select class="form-select form-select-sm w-auto ps-12 py-6 radius-12 h-40-px">
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
<option>6</option>
|
||||
<option>7</option>
|
||||
<option>8</option>
|
||||
<option>9</option>
|
||||
<option>10</option>
|
||||
</select>
|
||||
<form class="navbar-search">
|
||||
<input type="text" class="bg-base h-40-px w-auto" name="search" placeholder="Search">
|
||||
<iconify-icon icon="ion:search-outline" class="icon"></iconify-icon>
|
||||
</form>
|
||||
<select class="form-select form-select-sm w-auto ps-12 py-6 radius-12 h-40-px">
|
||||
<option>Status</option>
|
||||
<option>Active</option>
|
||||
<option>Inactive</option>
|
||||
</select>
|
||||
</div>
|
||||
<a href="#" class="btn btn-primary text-sm btn-sm px-12 py-12 radius-8 d-flex align-items-center gap-2">
|
||||
<iconify-icon icon="ic:baseline-plus" class="icon text-xl line-height-1"></iconify-icon>
|
||||
Add New User
|
||||
</a>
|
||||
</div>
|
||||
<div class="card-body p-24">
|
||||
<div class="table-responsive scroll-sm">
|
||||
<table class="table bordered-table sm-table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
{{-- <div class="form-check style-check d-flex align-items-center">
|
||||
<input class="form-check-input radius-4 border input-form-dark" type="checkbox" name="checkbox" id="selectAll">
|
||||
</div> --}}
|
||||
No.
|
||||
</div>
|
||||
</th>
|
||||
<th scope="col">Name</th>
|
||||
<th scope="col">Email</th>
|
||||
<th scope="col">Roles</th>
|
||||
<th scope="col" class="text-center">Status</th>
|
||||
<th scope="col" class="text-center">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
01
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Kathryn Murphy</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">osgoodwy@gmail.com</span></td>
|
||||
<td>Sekretariat</td>
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
02
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Annette Black</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">redaniel@gmail.com</span></td>
|
||||
<td>Tim Teknis</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-neutral-200 text-neutral-600 border border-neutral-400 px-24 py-4 radius-4 fw-medium text-sm">Inactive</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
03
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Ronald Richards</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">seannand@mail.ru</span></td>
|
||||
<td>Tim Teknis</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
04
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Eleanor Pena</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">miyokoto@mail.ru</span></td>
|
||||
<td>Tim Teknis</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
05
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Leslie Alexander</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">icadahli@gmail.com</span></td>
|
||||
<td>Tim Teknis</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-neutral-200 text-neutral-600 border border-neutral-400 px-24 py-4 radius-4 fw-medium text-sm">Inactive</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
06
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Albert Flores</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">warn@mail.ru</span></td>
|
||||
<td>Tim Teknis</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
07
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Jacob Jones</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">zitka@mail.ru</span></td>
|
||||
<td>Kepala Dinas</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
08
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Jerome Bell</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">igerrin@gmail.com</span></td>
|
||||
<td>Kepala Dinas</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-neutral-200 text-neutral-600 border border-neutral-400 px-24 py-4 radius-4 fw-medium text-sm">Inactive</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
09
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Marvin McKinney</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">maka@yandex.ru</span></td>
|
||||
<td>Kepala Dinas</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
|
||||
10
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://img.freepik.com/premium-vector/user-profile-icon-flat-style-member-avatar-vector-illustration-isolated-background-human-permission-sign-business-concept_157943-15752.jpg?semt=ais_hybrid&w=740" alt="" class="w-40-px h-40-px rounded-circle flex-shrink-0 me-12 overflow-hidden">
|
||||
<div class="flex-grow-1">
|
||||
<span class="text-md mb-0 fw-normal text-secondary-light">Cameron Williamson</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="text-md mb-0 fw-normal text-secondary-light">danten@mail.ru</span></td>
|
||||
<td>Kepala Dinas</td>
|
||||
|
||||
<td class="text-center">
|
||||
<span class="bg-success-focus text-success-600 border border-success-main px-24 py-4 radius-4 fw-medium text-sm">Active</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex align-items-center gap-10 justify-content-center">
|
||||
<button type="button" class="bg-info-focus bg-hover-info-200 text-info-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="majesticons:eye-line" class="icon text-xl"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="bg-success-focus text-success-600 bg-hover-success-200 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="lucide:edit" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
<button type="button" class="remove-item-btn bg-danger-focus bg-hover-danger-200 text-danger-600 fw-medium w-40-px h-40-px d-flex justify-content-center align-items-center rounded-circle">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-between flex-wrap gap-2 mt-24">
|
||||
<span>Showing 1 to 10 of 12 entries</span>
|
||||
<ul class="pagination d-flex flex-wrap align-items-center gap-2 justify-content-center">
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md" href="javascript:void(0)">
|
||||
<iconify-icon icon="ep:d-arrow-left" class=""></iconify-icon>
|
||||
</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md bg-primary-600 text-white" href="javascript:void(0)">1</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px" href="javascript:void(0)">2</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md" href="javascript:void(0)">3</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md" href="javascript:void(0)">4</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md" href="javascript:void(0)">5</a>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<a class="page-link bg-neutral-200 text-secondary-light fw-semibold radius-8 border-0 d-flex align-items-center justify-content-center h-32-px w-32-px text-md" href="javascript:void(0)">
|
||||
<iconify-icon icon="ep:d-arrow-right" class=""></iconify-icon>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
|
|
@ -1,29 +1,18 @@
|
|||
@extends('layout.layout')
|
||||
|
||||
@php
|
||||
$title='Jadwal Sidang';
|
||||
$subTitle = 'Jadwal Sidang';
|
||||
$script = '<script src="' . asset('assets/js/full-calendar.js') . '"></script>
|
||||
<script src="' . asset('assets/js/flatpickr.js') . '"></script>
|
||||
<script>
|
||||
// Flat pickr or date picker js
|
||||
function getDatePicker(receiveID) {
|
||||
flatpickr(receiveID, {
|
||||
enableTime: true,
|
||||
dateFormat: "d/m/Y H:i",
|
||||
});
|
||||
}
|
||||
getDatePicker("#startDate");
|
||||
getDatePicker("#endDate");
|
||||
|
||||
getDatePicker("#editstartDate");
|
||||
getDatePicker("#editendDate");
|
||||
</script>';
|
||||
$title='Jadwal Sidang';
|
||||
$subTitle = 'Jadwal Sidang';
|
||||
$script = '
|
||||
<script src="' . asset('assets/js/backend/jadwal/full-calendar.js') . '"></script>
|
||||
<script src="' . asset('assets/js/backend/jadwal/flatpickr.js') . '"></script>
|
||||
<script src="' . asset('assets/js/backend/jadwal/pagination.js') . '"></script>
|
||||
<script src="' . asset('assets/js/backend/jadwal/datepickr.js') . '"></script>';
|
||||
@endphp
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="row gy-4">
|
||||
<div class="row gy-4">
|
||||
<div class="col-xxl-3 col-lg-4">
|
||||
<div class="card h-100 p-0">
|
||||
<div class="card-body p-24">
|
||||
|
|
@ -34,85 +23,33 @@
|
|||
</button>
|
||||
</div>
|
||||
|
||||
<div class="mb-24 document-type-filter">
|
||||
<h6 class="text-primary-light fw-semibold mb-12">Filter Jenis Dokumen</h6>
|
||||
<div class="position-relative">
|
||||
<select id="document_type_filter" class="form-select radius-8">
|
||||
<option value="all" {{ request('document_type') == '' ? 'selected' : '' }}>Semua Jenis Dokumen</option>
|
||||
<option value="amdal" {{ request('document_type') == 'amdal' ? 'selected' : '' }}>AMDAL</option>
|
||||
<option value="pertek" {{ request('document_type') == 'pertek' ? 'selected' : '' }}>PERTEK</option>
|
||||
<option value="andal_rkl_rpl" {{ request('document_type') == 'andal_rkl_rpl' ? 'selected' : '' }}>ANDAL RKL-RPL</option>
|
||||
<option value="addendum" {{ request('document_type') == 'addendum' ? 'selected' : '' }}>ADDENDUM</option>
|
||||
<option value="dplh" {{ request('document_type') == 'dplh' ? 'selected' : '' }}>DPLH</option>
|
||||
<option value="delh" {{ request('document_type') == 'delh' ? 'selected' : '' }}>DELH</option>
|
||||
<option value="ukl_upl" {{ request('document_type') == 'ukl_upl' ? 'selected' : '' }}>UKL-UPL</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-32">
|
||||
<div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
<span class="w-12-px h-12-px bg-info-600 rounded-circle fw-medium"></span>
|
||||
<div class="d-flex flex-column gap-10">
|
||||
<div class="mt-2">
|
||||
<span class="badge bg-info-100 text-info-600 fw-medium radius-4 text-xs px-8 py-4">AMDAL</span>
|
||||
</div>
|
||||
<span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
|
||||
</button>
|
||||
<ul class="dropdown-menu p-12 border bg-base shadow">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalView">
|
||||
<iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
|
||||
View
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalEdit">
|
||||
<iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalDelete">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- List Penjadwalan --}}
|
||||
{{-- <div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
<span class="w-12-px h-12-px bg-info-600 rounded-circle fw-medium"></span>
|
||||
<span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
|
||||
</button>
|
||||
<ul class="dropdown-menu p-12 border bg-base shadow">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalView">
|
||||
<iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
|
||||
View
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalEdit">
|
||||
<iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalDelete">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div> --}}
|
||||
{{-- <div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
<span class="w-12-px h-12-px bg-info-600 rounded-circle fw-medium"></span>
|
||||
<span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
|
|
@ -140,74 +77,6 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
<span class="w-12-px h-12-px bg-info-600 rounded-circle fw-medium"></span>
|
||||
<span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
|
||||
</button>
|
||||
<ul class="dropdown-menu p-12 border bg-base shadow">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalView">
|
||||
<iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
|
||||
View
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalEdit">
|
||||
<iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalDelete">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
|
||||
<div class="d-flex flex-column">
|
||||
<div class="d-flex align-items-center gap-10">
|
||||
<span class="w-12-px h-12-px bg-info-600 rounded-circle fw-medium"></span>
|
||||
<span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
|
||||
</div>
|
||||
<span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button type="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
|
||||
</button>
|
||||
<ul class="dropdown-menu p-12 border bg-base shadow">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalView">
|
||||
<iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
|
||||
View
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalEdit">
|
||||
<iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalDelete">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div> --}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -223,274 +92,21 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Add Event -->
|
||||
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalLabel">Buat Penjadwalan</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<form action="#">
|
||||
<div class="row">
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan</label>
|
||||
<input type="text" class="form-control radius-8" placeholder="Masukkan Nama Kegiatan">
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="startDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Mulai Tanggal</label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="startDate" type="text" placeholder="03/12/2024, 10:30 AM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="endDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Sampai Tanggal </label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="endDate" type="text" placeholder="03/12/2024, 2:30 PM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 mb-20">
|
||||
<label for="endDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Perizinan </label>
|
||||
<div class="d-flex align-items-center flex-wrap gap-28">
|
||||
<div class="form-check checked-success d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Personal">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Personal">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Pertek
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-primary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Business">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Business">
|
||||
<span class="w-8-px h-8-px bg-primary-600 rounded-circle"></span>
|
||||
Rintek
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-warning d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Family">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Family">
|
||||
<span class="w-8-px h-8-px bg-warning-600 rounded-circle"></span>
|
||||
Andal RKL-RPL
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Important">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
|
||||
<span class="w-8-px h-8-px bg-info-600 rounded-circle"></span>
|
||||
Addendum
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Important">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
|
||||
<span class="w-8-px h-8-px bg-pink rounded-circle"></span>
|
||||
DPLH
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Important">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
DELH
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Important">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
UKL-UPL
|
||||
</label>
|
||||
</div>
|
||||
{{-- <div class="form-check checked-danger d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="Holiday">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Holiday">
|
||||
<span class="w-8-px h-8-px bg-danger-600 rounded-circle"></span>
|
||||
Holiday
|
||||
</label>
|
||||
</div> --}}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Add Jadwal -->
|
||||
@include('components.backend.jadwal.modal_add')
|
||||
|
||||
<div class="col-12 mb-20">
|
||||
<label for="desc" class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
|
||||
<textarea class="form-control" id="desc" rows="4" cols="50" placeholder="Write some text"></textarea>
|
||||
</div>
|
||||
<!-- Modal View Jadwal -->
|
||||
@include('components.backend.jadwal.modal_view')
|
||||
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Batalkan
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Edit Jadwal -->
|
||||
@include('components.backend.jadwal.modal_edit')
|
||||
|
||||
<!-- Modal View Event -->
|
||||
<div class="modal fade" id="exampleModalView" tabindex="-1" aria-labelledby="exampleModalViewLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalViewLabel">View Details</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Title</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">PT. Mitra Usaha Sejahtera</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Start Date</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">25 Jan 2024, 10:30AM</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">End Date</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">25 Jan 2024, 2:30AM</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Description</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4">N/A</h6>
|
||||
</div>
|
||||
<div class="mb-12">
|
||||
<span class="text-secondary-light txt-sm fw-medium">Jenis Perizinan</span>
|
||||
<h6 class="text-primary-light fw-semibold text-md mb-0 mt-4 d-flex align-items-center gap-2">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Pertek
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Delete Jadwal -->
|
||||
@include('components.backend.jadwal.modal_delete')
|
||||
|
||||
<!-- Modal Edit Event -->
|
||||
<div class="modal fade" id="exampleModalEdit" tabindex="-1" aria-labelledby="exampleModalEditLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-header py-16 px-24 border border-top-0 border-start-0 border-end-0">
|
||||
<h1 class="modal-title fs-5" id="exampleModalEditLabel">Edit Event</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-24">
|
||||
<form action="#">
|
||||
<div class="row">
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Event Title : </label>
|
||||
<input type="text" class="form-control radius-8" placeholder="Enter Event Title ">
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="editstartDate" class="form-label fw-semibold text-primary-light text-sm mb-8">Start Date</label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="editstartDate" type="text" placeholder="03/12/2024, 10:30 AM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-20">
|
||||
<label for="editendDate" class="form-label fw-semibold text-primary-light text-sm mb-8">End Date </label>
|
||||
<div class=" position-relative">
|
||||
<input class="form-control radius-8 bg-base" id="editendDate" type="text" placeholder="03/12/2024, 2:30 PM">
|
||||
<span class="position-absolute end-0 top-50 translate-middle-y me-12 line-height-1">
|
||||
<iconify-icon icon="solar:calendar-linear" class="icon text-lg"></iconify-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 mb-20">
|
||||
<label class="form-label fw-semibold text-primary-light text-sm mb-8">Label </label>
|
||||
<div class="d-flex align-items-center flex-wrap gap-28">
|
||||
<div class="form-check checked-success d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editPersonal">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editPersonal">
|
||||
<span class="w-8-px h-8-px bg-success-600 rounded-circle"></span>
|
||||
Personal
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-primary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editBusiness">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editBusiness">
|
||||
<span class="w-8-px h-8-px bg-primary-600 rounded-circle"></span>
|
||||
Business
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-warning d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editFamily">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editFamily">
|
||||
<span class="w-8-px h-8-px bg-warning-600 rounded-circle"></span>
|
||||
Family
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-secondary d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editImportant">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editImportant">
|
||||
<span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
|
||||
Important
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check checked-danger d-flex align-items-center gap-2">
|
||||
<input class="form-check-input" type="radio" name="label" id="editHoliday">
|
||||
<label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="editHoliday">
|
||||
<span class="w-8-px h-8-px bg-danger-600 rounded-circle"></span>
|
||||
Holiday
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mb-20">
|
||||
<label for="desc" class="form-label fw-semibold text-primary-light text-sm mb-8">Description</label>
|
||||
<textarea class="form-control" id="editdesc" rows="4" cols="50" placeholder="Write some text"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Cancel
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Delete Event -->
|
||||
<div class="modal fade" id="exampleModalDelete" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-sm modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content radius-16 bg-base">
|
||||
<div class="modal-body p-24 text-center">
|
||||
<span class="mb-16 fs-1 line-height-1 text-danger">
|
||||
<iconify-icon icon="fluent:delete-24-regular" class="menu-icon"></iconify-icon>
|
||||
</span>
|
||||
<h6 class="text-lg fw-semibold text-primary-light mb-0">Apakah Anda yakin ingin menghapus jadwal sidang ini?</h6>
|
||||
<div class="d-flex align-items-center justify-content-center gap-3 mt-24">
|
||||
<button type="reset" class="w-50 border border-danger-600 bg-hover-danger-200 text-danger-600 text-md px-40 py-11 radius-8">
|
||||
Tidak
|
||||
</button>
|
||||
<button type="button" class="w-50 btn btn-primary border border-primary-600 text-md px-24 py-12 radius-8">
|
||||
Hapus
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- JS Filter -->
|
||||
@include('components.backend.jadwal.filter')
|
||||
|
||||
@endsection
|
||||
|
|
|
|||
|
|
@ -1,378 +0,0 @@
|
|||
<!-- Detail Modal -->
|
||||
<div class="modal fade" id="detailModal" tabindex="-1" aria-labelledby="detailModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="detailModalLabel">Detail Permohonan</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<!-- Tab Navigation -->
|
||||
<ul class="nav button-tab nav-pills mb-16" id="detailModalTabs" 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="detail-tab" data-bs-toggle="tab" data-bs-target="#detail-pane" type="button" role="tab" aria-controls="detail-pane" aria-selected="true">
|
||||
<iconify-icon icon="hugeicons:folder-details" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Data 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="timeline-tab" data-bs-toggle="tab" data-bs-target="#timeline-pane" type="button" role="tab" aria-controls="timeline-pane" aria-selected="false">
|
||||
<iconify-icon icon="material-symbols:timeline" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Timeline Status</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Tab Content -->
|
||||
<div class="tab-content" id="detailModalTabContent">
|
||||
<!-- Detail Permohonan Tab -->
|
||||
<div class="tab-pane fade show active" id="detail-pane" role="tabpanel" aria-labelledby="detail-tab">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Nomor Permohonan</div>
|
||||
<div class="col-md-8">K24/250319E5CC8C330</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Perusahaan</div>
|
||||
<div class="col-md-8">PT. Permata Hijau</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Nama Kegiatan</div>
|
||||
<div class="col-md-8">Pembangungan Gedung Baru</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Tipe Perizinan</div>
|
||||
<div class="col-md-8">UKL-UPL</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Pemohon</div>
|
||||
<div class="col-md-8">Charles Hasibuan</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Tanggal Pengajuan</div>
|
||||
<div class="col-md-8">21 Maret 2025</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Status</div>
|
||||
<div class="col-md-8"><span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses</span></div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Deskripsi</div>
|
||||
<div class="col-md-8">Permohonan arahan teknis untuk pembangunan gedung baru sesuai dengan regulasi UKL-UPL.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Timeline Status Tab -->
|
||||
<div class="tab-pane fade" id="timeline-pane" role="tabpanel" aria-labelledby="timeline-tab">
|
||||
<form id="updateStatusForm" method="POST" action="#">
|
||||
@csrf
|
||||
<input type="hidden" name="permohonan_id" value="ID_PERMOHONAN">
|
||||
|
||||
<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 name="status[1]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active">In Progress</option>
|
||||
<option value="completed" selected>Completed</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 name="notes[1]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">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 name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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">Perbaikan Dokumen 1</h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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">Perbaikan Dokumen 2</h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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">Perbaikan Dokumen 3</h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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"> Penjadwalan
|
||||
Rapat/SIdang Pembahasan
|
||||
Dokumen Persetujuan Teknis </h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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"> Rapat/SIdang Pembahasan
|
||||
Dokumen Persetujuan Teknis </h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</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"> Perbaikan Dokumen
|
||||
persetujuan Teknis hasil dari
|
||||
rapat/sidang </h6>
|
||||
<select name="status[2]" class="form-select form-select-sm status-select" style="width: 140px;">
|
||||
<option value="pending">Pending</option>
|
||||
<option value="active" selected>In Progress</option>
|
||||
<option value="completed">Completed</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 name="notes[2]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2">Sedang dalam proses verifikasi dokumen oleh tim teknis</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Item 3: 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">Tinjauan Lapangan</h6>
|
||||
<select name="status[3]" class="form-select form-select-sm status-select" style="width: 140px;" disabled>
|
||||
<option value="pending" selected>Pending</option>
|
||||
<option value="active">In Progress</option>
|
||||
<option value="completed">Completed</option>
|
||||
<option value="rejected">Rejected</option>
|
||||
</select>
|
||||
</div>
|
||||
<p class="text-muted small mb-1">
|
||||
-
|
||||
</p>
|
||||
<div class="mb-2">
|
||||
<textarea name="notes[3]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Item 4: 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 Arahan Teknis</h6>
|
||||
<select name="status[4]" class="form-select form-select-sm status-select" style="width: 140px;" disabled>
|
||||
<option value="pending" selected>Pending</option>
|
||||
<option value="active">In Progress</option>
|
||||
<option value="completed">Completed</option>
|
||||
<option value="rejected">Rejected</option>
|
||||
</select>
|
||||
</div>
|
||||
<p class="text-muted small mb-1">
|
||||
-
|
||||
</p>
|
||||
<div class="mb-2">
|
||||
<textarea name="notes[4]" class="form-control form-control-sm" placeholder="Tambahkan catatan (opsional)" rows="2"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="modal-footer">
|
||||
<button type="submit" class="btn btn-primary">Simpan Perubahan</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<script>
|
||||
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 class based on selected status
|
||||
if (this.value === 'completed') {
|
||||
timelineItem.classList.add('completed');
|
||||
} else if (this.value === 'active') {
|
||||
timelineItem.classList.add('active');
|
||||
} else if (this.value === 'rejected') {
|
||||
timelineItem.classList.add('rejected');
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</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(0,123,255,0.2);
|
||||
}
|
||||
.timeline-item.rejected .timeline-marker {
|
||||
background: #ff1100;
|
||||
box-shadow: 0 0 0 4px rgba(0,123,255,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;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -48,15 +48,10 @@
|
|||
</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('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
|
||||
<a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
|
||||
<a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">(Subkel Kerusakan Lingkungan)</a>
|
||||
<a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">(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"> --}}
|
||||
|
|
@ -79,5 +74,4 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
|
|
|
|||
|
|
@ -1,158 +0,0 @@
|
|||
<!-- Detail Modal -->
|
||||
<div class="modal fade" id="detailModal" tabindex="-1" aria-labelledby="detailModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="detailModalLabel">Detail Permohonan</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<!-- Tab Navigation -->
|
||||
<ul class="nav button-tab nav-pills mb-16" id="detailModalTabs" 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="detail-tab" data-bs-toggle="tab" data-bs-target="#detail-pane" type="button" role="tab" aria-controls="detail-pane" aria-selected="true">
|
||||
<iconify-icon icon="hugeicons:folder-details" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Data 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="timeline-tab" data-bs-toggle="tab" data-bs-target="#timeline-pane" type="button" role="tab" aria-controls="timeline-pane" aria-selected="false">
|
||||
<iconify-icon icon="material-symbols:timeline" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Timeline Status</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Tab Content -->
|
||||
<div class="tab-content" id="detailModalTabContent">
|
||||
<!-- Detail Permohonan Tab -->
|
||||
<div class="tab-pane fade show active" id="detail-pane" role="tabpanel" aria-labelledby="detail-tab">
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Nomor Permohonan</div>
|
||||
<div class="col-md-8">K24/250319E5CC8C330</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Perusahaan</div>
|
||||
<div class="col-md-8">PT. Permata Hijau</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Nama Kegiatan</div>
|
||||
<div class="col-md-8">Pembangungan Gedung Baru</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Tipe Perizinan</div>
|
||||
<div class="col-md-8">UKL-UPL</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Pemohon</div>
|
||||
<div class="col-md-8">Charles Hasibuan</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Tanggal Pengajuan</div>
|
||||
<div class="col-md-8">21 Maret 2025</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Status</div>
|
||||
<div class="col-md-8"><span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses</span></div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-4 fw-bold">Deskripsi</div>
|
||||
<div class="col-md-8">Permohonan arahan teknis untuk pembangunan gedung baru sesuai dengan regulasi UKL-UPL.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Timeline Status Tab -->
|
||||
<div class="tab-pane fade" id="timeline-pane" role="tabpanel" aria-labelledby="timeline-tab">
|
||||
<div class="timeline-status">
|
||||
<div class="timeline-item completed">
|
||||
<div class="timeline-marker"></div>
|
||||
<div class="timeline-content">
|
||||
<h6 class="mb-0">Permohonan Diajukan</h6>
|
||||
<p class="text-muted small mb-0">21 Maret 2025 - 09:30</p>
|
||||
<p class="small">Permohonan berhasil diajukan</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-item completed">
|
||||
<div class="timeline-marker"></div>
|
||||
<div class="timeline-content">
|
||||
<h6 class="mb-0">Verifikasi Dokumen</h6>
|
||||
<p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
|
||||
<p class="small">Dokumen telah diverifikasi oleh admin</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-item active">
|
||||
<div class="timeline-marker"></div>
|
||||
<div class="timeline-content">
|
||||
<h6 class="mb-0">Proses Review Teknis</h6>
|
||||
<p class="text-muted small mb-0">23 Maret 2025 - 10:45</p>
|
||||
<p class="small">Sedang dalam proses review oleh tim teknis</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<div class="timeline-marker"></div>
|
||||
<div class="timeline-content">
|
||||
<h6 class="mb-0">Persetujuan Arahan</h6>
|
||||
<p class="text-muted small mb-0">-</p>
|
||||
<p class="small">Menunggu persetujuan arahan teknis</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<div class="timeline-marker"></div>
|
||||
<div class="timeline-content">
|
||||
<h6 class="mb-0">Selesai</h6>
|
||||
<p class="text-muted small mb-0">-</p>
|
||||
<p class="small">Proses permohonan selesai</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
|
||||
</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;
|
||||
}
|
||||
.timeline-item.active .timeline-marker {
|
||||
background: #007bff;
|
||||
box-shadow: 0 0 0 4px rgba(0,123,255,0.2);
|
||||
}
|
||||
.timeline-content {
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -15,9 +15,11 @@
|
|||
<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">
|
||||
<div class="card-body p-24 pt-10 w-full">
|
||||
|
||||
<!-- Tab Navigation -->
|
||||
<ul class="nav button-tab nav-pills mb-16" id="permohonan-tabs" role="tablist">
|
||||
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
|
||||
<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>
|
||||
|
|
@ -42,8 +44,16 @@
|
|||
<span class="line-height-1">Timeline</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="tanggapan-tab" data-bs-toggle="pill" data-bs-target="#tanggapan" type="button" role="tab" aria-controls="tanggapan" aria-selected="false">
|
||||
<iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Tanggapan Arahan</span>
|
||||
</button>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
|
||||
|
||||
<!-- Tab Content -->
|
||||
<div class="tab-content" id="permohonan-tabs-content">
|
||||
<!-- Tab 1: Informasi Pemohon -->
|
||||
|
|
@ -479,6 +489,27 @@
|
|||
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<!-- Tab 5: Tanggapan -->
|
||||
<div class="tab-pane fade" id="tanggapan" role="tabpanel" aria-labelledby="tanggapan-tab" tabindex="0">
|
||||
<fieldset class="wizard-fieldset">
|
||||
<!-- Timeline Status Section -->
|
||||
<div class="section-card">
|
||||
<div class="section-header mb-3">
|
||||
<iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
|
||||
<h6 class="text-md mb-0">Tanggapan Arahan</h6>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
|
||||
<div class="pdf-container border rounded" style="height: 500px; overflow: hidden;">
|
||||
<iframe src="{{ asset('assets/documents/tanggapan_arahan/tanggapan.pdf') }}" width="100%" height="100%" frameborder="0"></iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
<div class="card-body p-24 pt-10">
|
||||
<!-- Tab Navigation -->
|
||||
<ul class="nav button-tab nav-pills mb-16" id="permohonan-tabs" role="tablist">
|
||||
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
|
||||
<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>
|
||||
|
|
@ -39,6 +40,13 @@
|
|||
<span class="line-height-1">Timeline</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="tanggapan-tab" data-bs-toggle="pill" data-bs-target="#tanggapan" type="button" role="tab" aria-controls="tanggapan" aria-selected="false">
|
||||
<iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
|
||||
<span class="line-height-1">Tanggapan Arahan</span>
|
||||
</button>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
|
||||
<!-- Tab Content -->
|
||||
|
|
@ -774,6 +782,75 @@
|
|||
});
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<!-- Tab 5: Tanggapan -->
|
||||
<div class="tab-pane fade" id="tanggapan" role="tabpanel" aria-labelledby="tanggapan-tab" tabindex="0">
|
||||
<fieldset class="wizard-fieldset">
|
||||
<!-- Timeline Status Section -->
|
||||
<div class="section-card">
|
||||
<div class="section-header mb-3">
|
||||
<iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
|
||||
<h6 class="text-md mb-0">Tanggapan Arahan</h6>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<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">Upload Tanggapan Arahan</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="position-relative">
|
||||
<div class="input-group file-upload-container">
|
||||
<input type="file" class="form-control wizard-required file-upload" id="suratPermohonan" required>
|
||||
<button class="btn btn-neutral-500 border-neutral-100 upload-btn" type="button" data-target="suratPermohonan">Upload</button>
|
||||
</div>
|
||||
<div class="wizard-form-error"></div>
|
||||
</div>
|
||||
|
||||
<!-- File Preview Section -->
|
||||
<div class="file-preview-container mt-3 d-none" id="suratPermohonanPreview">
|
||||
<div class="border rounded p-3 bg-light d-flex align-items-start">
|
||||
<div class="preview-image me-3">
|
||||
<img src="" alt="File Preview" class="preview-img" style="max-width: 150px; max-height: 150px; object-fit: cover;">
|
||||
<div class="preview-icon d-none">
|
||||
<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;"></h6>
|
||||
<p class="preview-filesize text-sm text-muted mb-0"></p>
|
||||
</div>
|
||||
<button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="suratPermohonan">
|
||||
<iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="progress mt-2" style="height: 5px;">
|
||||
<div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
|
||||
</div>
|
||||
<span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-2">
|
||||
<small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -830,4 +907,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="{{ asset('assets/js/pertek/script_fileUpload.js') }}"></script>
|
||||
@endsection
|
||||
|
|
|
|||
|
|
@ -47,8 +47,6 @@
|
|||
<a href="{{ route('pertek.detail_slo') }}" class="text-primary-600 bg-amber-300 rounded-2xl">K23/250120CAEFC3A7E</a>
|
||||
</td>
|
||||
|
||||
@include('pertek.arahan.modal_detail_arahan')
|
||||
{{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
|
||||
|
||||
<td>
|
||||
<div class="d-flex align-items-center">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,10 @@
|
|||
@extends('layout.layout')
|
||||
|
||||
@php
|
||||
$css = '
|
||||
<link rel="stylesheet" href="' . asset('assets/css/pertek/subkel/surat_arahan.css') . '">';
|
||||
@endphp
|
||||
|
||||
@section('content')
|
||||
<div class="container">
|
||||
<div class="surat-container">
|
||||
|
|
@ -15,49 +20,49 @@
|
|||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="nomor_surat">Nomor</label>
|
||||
<input type="text" id="nomor_surat" name="nomor_surat" value="{{ old('nomor_surat', 'e-0025/LH.01.03') }}">
|
||||
<input type="text" id="nomor_surat" name="nomor_surat" value="{{ old('nomor_surat', isset($data['nomor_surat']) ? $data['nomor_surat'] : 'e-0025/LH.01.03') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="sifat">Sifat</label>
|
||||
<input type="text" id="sifat" name="sifat" value="{{ old('sifat', 'Penting') }}">
|
||||
<input type="text" id="sifat" name="sifat" value="{{ old('sifat', isset($data['sifat']) ? $data['sifat'] : 'Penting') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="lampiran">Lampiran</label>
|
||||
<input type="text" id="lampiran" name="lampiran" value="{{ old('lampiran', '-') }}">
|
||||
<input type="text" id="lampiran" name="lampiran" value="{{ old('lampiran', isset($data['lampiran']) ? $data['lampiran'] : '-') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="hal">Hal</label>
|
||||
<input type="text" id="hal" name="hal" value="{{ old('hal', 'Tanggapan Permohonan Arahan Persetujuan Teknis') }}">
|
||||
<input type="text" id="hal" name="hal" value="{{ old('hal', isset($data['hal']) ? $data['hal'] : 'Tanggapan Permohonan Arahan Persetujuan Teknis') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="tanggal_surat">Tanggal</label>
|
||||
<input type="date" id="tanggal_surat" name="tanggal_surat" value="{{ old('tanggal_surat', '2025-01-14') }}">
|
||||
<input type="date" id="tanggal_surat" name="tanggal_surat" value="{{ old('tanggal_surat', isset($data['tanggal_surat']) ? $data['tanggal_surat'] : '2025-01-14') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="kepada">Kepada</label>
|
||||
<input type="text" id="kepada" name="kepada" value="{{ old('kepada', 'Yth. Direktur Utama PT. Gedung Bank Exim') }}">
|
||||
<input type="text" id="kepada" name="kepada" value="{{ old('kepada', isset($data['kepada']) ? $data['kepada'] : 'Yth. Direktur Utama PT. Gedung Bank Exim') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="isi_surat">Isi Surat</label>
|
||||
<textarea id="isi_surat" name="isi_surat" rows="15">{{ old('isi_surat', 'Menindaklanjuti surat Saudara Nomor 1620/DIR-GBE/XI/2024 tanggal 21 November 2024 perihal Permohonan Surat Arahan Persetujuan Teknis IPAL, bersama ini, disampaikan beberapa hal sebagai berikut:
|
||||
<textarea id="isi_surat" name="isi_surat" rows="15" class="form-control" style="text-align: justify; line-height: 1.5; padding: 10px;">{{ old('isi_surat', isset($data['isi_surat']) ? $data['isi_surat'] : 'Menindaklanjuti surat Saudara Nomor 1620/DIR-GBE/XI/2024 tanggal 21 November 2024 perihal Permohonan Surat Arahan Persetujuan Teknis IPAL, bersama ini, disampaikan beberapa hal sebagai berikut:
|
||||
|
||||
1. Informasi dalam surat Saudara pada intinya menjelaskan sebagai berikut:
|
||||
a. PT. Gedung Bank Exim memiliki Jenis Kegiatan Pengelolaan Gedung (Perkantoran) yang berlokasi di Plaza Mandiri Lantai Basement 1, Jl. Jend. Gatot Soebroto Kav. 36-38, Jakarta;
|
||||
|
|
@ -85,6 +90,7 @@
|
|||
|
||||
<div class="surat-preview">
|
||||
<table class="details-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="label">Nomor</td>
|
||||
<td class="colon">:</td>
|
||||
|
|
@ -105,6 +111,8 @@
|
|||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['hal'] }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="label">Tanggal</td>
|
||||
<td class="colon">:</td>
|
||||
|
|
@ -115,6 +123,7 @@
|
|||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['kepada'] }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="content-surat">
|
||||
|
|
@ -131,7 +140,15 @@
|
|||
</div>
|
||||
|
||||
<div class="form-actions">
|
||||
<form action="{{ route('surat.exportPDF') }}" method="GET">
|
||||
<form action="{{ route('surat.exportPDF') }}" method="POST">
|
||||
@csrf
|
||||
<input type="hidden" name="nomor_surat" value="{{ $data['nomor_surat'] }}">
|
||||
<input type="hidden" name="sifat" value="{{ $data['sifat'] }}">
|
||||
<input type="hidden" name="lampiran" value="{{ $data['lampiran'] }}">
|
||||
<input type="hidden" name="hal" value="{{ $data['hal'] }}">
|
||||
<input type="hidden" name="tanggal_surat" value="{{ $data['tanggal_surat'] }}">
|
||||
<input type="hidden" name="kepada" value="{{ $data['kepada'] }}">
|
||||
<input type="hidden" name="isi_surat" value="{{ $data['isi_surat'] }}">
|
||||
<button type="submit" class="btn">Export PDF</button>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -139,119 +156,4 @@
|
|||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
max-width: 100%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.surat-container {
|
||||
font-family: 'Times New Roman', Times, serif;
|
||||
font-size: 12pt;
|
||||
line-height: 1.5;
|
||||
width: 210mm;
|
||||
height: auto;
|
||||
min-height: 297mm;
|
||||
padding: 20mm;
|
||||
background-color: white;
|
||||
margin: 0 auto;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.kop-surat {
|
||||
text-align: center;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.kop-surat img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.surat-details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
input, textarea {
|
||||
width: calc(100% - 135px);
|
||||
border: 1px solid #000;
|
||||
padding: 5px;
|
||||
background-color: white;
|
||||
font-family: 'Times New Roman', Times, serif;
|
||||
font-size: 12pt;
|
||||
}
|
||||
|
||||
textarea {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.content-surat {
|
||||
margin-top: 20px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
margin-top: 20px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 10px 20px;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.preview-section {
|
||||
margin-top: 30px;
|
||||
border-top: 1px solid #ddd;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.preview-section h3 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.details-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.details-table td {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.details-table .label {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.details-table .colon {
|
||||
width: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ttd-section {
|
||||
margin-top: 30px;
|
||||
text-align: right;
|
||||
width: 40%;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
@endsection
|
||||
|
|
|
|||
|
|
@ -1,119 +1,127 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="id">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Surat Tanggapan</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title>Surat {{ $data['nomor_surat'] ?? '' }}</title>
|
||||
<style>
|
||||
@page {
|
||||
margin: 2cm 2.5cm;
|
||||
size: A4 portrait;
|
||||
}
|
||||
body {
|
||||
font-family: 'Times New Roman', Times, serif;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 12pt;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.kop-surat {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.kop-surat img {
|
||||
width: 100%;
|
||||
max-height: 120px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.surat-details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.details-table {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
border-collapse: collapse;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.details-table td {
|
||||
padding: 5px 0;
|
||||
vertical-align: top;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
.details-table .label {
|
||||
width: 120px;
|
||||
.label {
|
||||
width: 80px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.details-table .colon {
|
||||
width: 20px;
|
||||
.colon {
|
||||
width: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.value {
|
||||
text-align: left;
|
||||
}
|
||||
.content-surat {
|
||||
margin-top: 20px;
|
||||
text-align: justify;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.content-surat p {
|
||||
margin: 0 0 10px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.ttd-section {
|
||||
margin-top: 30px;
|
||||
text-align: right;
|
||||
width: 40%;
|
||||
float: right;
|
||||
margin-left: 60%;
|
||||
text-align: left;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.ttd-section p {
|
||||
margin: 5px 0;
|
||||
ol {
|
||||
padding-left: 20px;
|
||||
}
|
||||
ol ol {
|
||||
list-style-type: lower-alpha;
|
||||
padding-left: 25px;
|
||||
}
|
||||
li {
|
||||
margin-bottom: 5px;
|
||||
text-align: justify;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Kop Surat -->
|
||||
<div class="kop-surat">
|
||||
<img src="{{ public_path('assets/images/kop.jpg') }}" alt="Logo Kop Surat">
|
||||
</div>
|
||||
|
||||
<!-- Surat Details -->
|
||||
<div class="surat-details">
|
||||
<table class="details-table">
|
||||
<tr>
|
||||
<td class="label">Nomor</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['nomor_surat'] }}</td>
|
||||
<td class="value">{{ $data['nomor_surat'] ?? '' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Sifat</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['sifat'] }}</td>
|
||||
<td class="value">{{ $data['sifat'] ?? '' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Lampiran</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['lampiran'] }}</td>
|
||||
<td class="value">{{ $data['lampiran'] ?? '' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Hal</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['hal'] }}</td>
|
||||
<td class="value">{{ $data['hal'] ?? '' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Tanggal</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ date('d F Y', strtotime($data['tanggal_surat'])) }}</td>
|
||||
<td class="value">{{ isset($data['tanggal_surat']) ? date('d F Y', strtotime($data['tanggal_surat'])) : '' }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Kepada</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">{{ $data['kepada'] }}</td>
|
||||
<td class="value">{{ $data['kepada'] ?? '' }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<!-- Isi Surat -->
|
||||
<div class="content-surat">
|
||||
<p>{!! nl2br(e($data['isi_surat'])) !!}</p>
|
||||
{!! nl2br_with_indentation($data['isi_surat'] ?? '') !!}
|
||||
</div>
|
||||
|
||||
<!-- Tanda Tangan -->
|
||||
<div class="ttd-section">
|
||||
<p>Jakarta, {{ date('d F Y', strtotime($data['tanggal_surat'])) }}</p>
|
||||
<p>Jakarta, {{ isset($data['tanggal_surat']) ? date('d F Y', strtotime($data['tanggal_surat'])) : '' }}</p>
|
||||
<p>Kepala Dinas Lingkungan Hidup</p>
|
||||
<br><br><br>
|
||||
<p><u>Nama Pejabat</u></p>
|
||||
<p>NIP. 19700101 199001 1 001</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Surat Tanggapan</title>
|
||||
<title>Berita Acara Penerimaan Dokumen Pertek</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Times New Roman', Times, serif;
|
||||
|
|
@ -62,34 +62,86 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="surat-details">
|
||||
<!-- Kop Surat -->
|
||||
<h1>BERITA ACARA PENERIMAAN DOKUMEN <br> STANDART TEKNIS PEMBUANGAN AIR LIMBAH KE BADAN AIR PENERIMA</h1>
|
||||
<table class="details-table">
|
||||
<tr>
|
||||
<td class="label">Nomor</td>
|
||||
<td class="label">Nomor Berita Acara</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">Test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Sifat</td>
|
||||
<td class="label">Tanggal Berita Acara</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Lampiran</td>
|
||||
<td class="label">Nama Perusahaan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Hal</td>
|
||||
<td class="label">Nomor Perusahaan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Tanggal</td>
|
||||
<td class="label">Alamat Perusahaan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Kepada</td>
|
||||
<td class="label">Telp/Fax</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Email</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Nama Kegiatan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Alamat Kegiatan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Telp/Fax</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Penanggung Jawab / Jabatan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Contact Person</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Jabatan</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">Telp / HP</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">NIB</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">KBLI</td>
|
||||
<td class="colon">:</td>
|
||||
<td class="value">test</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -43,23 +43,23 @@ Route::get('/surat/pertek/penerimaan', function () {
|
|||
return view('/pertek/subkel/surat_penerimaan');
|
||||
});
|
||||
|
||||
Route::get('/admin/pengguna', function () {
|
||||
return view('/pengguna/index_user');
|
||||
});
|
||||
|
||||
Route::get('/news', [NewsController::class, 'index'])->name('news.index');
|
||||
Route::get('/news/detail', [NewsController::class, 'detail'])->name('news.detail');
|
||||
|
||||
Route::get('/surat', [SuratArahanController::class, 'show']);
|
||||
Route::post('/surat/save', [SuratArahanController::class, 'save'])->name('surat.save');
|
||||
Route::get('/surat/exportPDF', [SuratArahanController::class, 'exportPDF'])->name('surat.exportPDF');
|
||||
|
||||
|
||||
// Route::controller(DashboardController::class)->group(function () {
|
||||
// Route::get('/', 'index')->name('index');
|
||||
// });
|
||||
|
||||
|
||||
// Route::get('/surat/exportPDF', [SuratArahanController::class, 'exportPDF'])->name('surat.exportPDF');
|
||||
Route::match(['get', 'post'], '/surat/exportPDF', [SuratArahanController::class, 'exportPDF'])->name('surat.exportPDF');
|
||||
|
||||
// Dashboard
|
||||
Route::get('/dashboard', [DashboardController::class, 'index'])->name('dashboard.index');
|
||||
|
||||
|
||||
|
||||
// login
|
||||
Route::get('/auth/login', [LoginController::class, 'index'])->name('login.index');
|
||||
|
||||
|
|
@ -85,9 +85,14 @@ Route::prefix('admin')->group(function () {
|
|||
});
|
||||
|
||||
//rintek
|
||||
// Route::prefix('admin')->group(function () {
|
||||
// Route::get('/jadwal', [JadwalSidangController::class, 'index'])->name('jadwal.index');
|
||||
// Route::get('/jadwal/create', [JadwalSidangController::class, 'create'])->name('jadwal.create');
|
||||
// });
|
||||
|
||||
Route::prefix('admin')->group(function () {
|
||||
Route::get('/jadwal', [JadwalSidangController::class, 'index'])->name('jadwal.index');
|
||||
Route::get('/jadwal/create', [JadwalSidangController::class, 'create'])->name('jadwal.create');
|
||||
Route::get('/jadwal', [JadwalSidangController::class, 'index'])->name('jadwal.index');
|
||||
Route::match(['get', 'post'], '/jadwal/create', [JadwalSidangController::class, 'create'])->name('jadwal.create');
|
||||
});
|
||||
|
||||
// Penugasan
|
||||
|
|
|
|||
Loading…
Reference in New Issue