partial update add page laporan pimpinan and fix upload big data excel pdam
This commit is contained in:
arifal
154
resources/js/bigdata-resumes/index.js
Normal file
154
resources/js/bigdata-resumes/index.js
Normal file
@@ -0,0 +1,154 @@
|
||||
import { Grid } from "gridjs/dist/gridjs.umd.js";
|
||||
import gridjs from "gridjs/dist/gridjs.umd.js";
|
||||
import "gridjs/dist/gridjs.umd.js";
|
||||
import GlobalConfig, { addThousandSeparators } from "../global-config.js";
|
||||
import Swal from "sweetalert2";
|
||||
import moment from "moment";
|
||||
|
||||
class BigdataResume {
|
||||
constructor() {
|
||||
this.toastMessage = document.getElementById("toast-message");
|
||||
this.toastElement = document.getElementById("toastNotification");
|
||||
this.toast = new bootstrap.Toast(this.toastElement);
|
||||
this.table = null;
|
||||
|
||||
// Initialize functions
|
||||
this.initTableDataSettings();
|
||||
// this.initEvents();
|
||||
}
|
||||
initEvents() {
|
||||
document.body.addEventListener("click", async (event) => {
|
||||
const deleteButton = event.target.closest(
|
||||
".btn-delete-data-settings"
|
||||
);
|
||||
if (deleteButton) {
|
||||
event.preventDefault();
|
||||
await this.handleDelete(deleteButton);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
initTableDataSettings() {
|
||||
let tableContainer = document.getElementById("table-bigdata-resumes");
|
||||
// Create a new Grid.js instance only if it doesn't exist
|
||||
this.table = new Grid({
|
||||
columns: [
|
||||
{ name: "ID" },
|
||||
{ name: "Potention Count" },
|
||||
{ name: "Potention Sum" },
|
||||
{ name: "Non Verified Count" },
|
||||
{ name: "Non Verified Sum" },
|
||||
{ name: "Verified Count" },
|
||||
{ name: "Verified Sum" },
|
||||
{ name: "Business Count" },
|
||||
{ name: "Business Sum" },
|
||||
{ name: "Non Business Count" },
|
||||
{ name: "Non Business Sum" },
|
||||
{ name: "Spatial Sum" },
|
||||
{ name: "Spatial Count" },
|
||||
{
|
||||
name: "Created",
|
||||
attributes: { style: "width: 200px; white-space: nowrap;" }, // Set width dynamically
|
||||
},
|
||||
],
|
||||
pagination: {
|
||||
limit: 15,
|
||||
server: {
|
||||
url: (prev, page) =>
|
||||
`${prev}${prev.includes("?") ? "&" : "?"}page=${
|
||||
page + 1
|
||||
}`,
|
||||
},
|
||||
},
|
||||
sort: true,
|
||||
search: {
|
||||
server: {
|
||||
url: (prev, keyword) => `${prev}?search=${keyword}`,
|
||||
},
|
||||
},
|
||||
server: {
|
||||
url: `${GlobalConfig.apiHost}/api/bigdata-report`,
|
||||
headers: {
|
||||
Authorization: `Bearer ${document
|
||||
.querySelector('meta[name="api-token"]')
|
||||
.getAttribute("content")}`,
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
then: (data) =>
|
||||
data.data.map((item) => [
|
||||
item.id,
|
||||
item.potention_count,
|
||||
addThousandSeparators(item.potention_sum),
|
||||
item.non_verified_count,
|
||||
addThousandSeparators(item.non_verified_sum),
|
||||
item.verified_count,
|
||||
addThousandSeparators(item.verified_sum),
|
||||
item.business_count,
|
||||
addThousandSeparators(item.business_sum),
|
||||
item.non_business_count,
|
||||
addThousandSeparators(item.non_business_sum),
|
||||
item.spatial_count,
|
||||
addThousandSeparators(item.spatial_sum),
|
||||
moment(item.created_at).format("YYYY-MM-DD H:mm:ss"),
|
||||
]),
|
||||
total: (data) => data.total,
|
||||
},
|
||||
}).render(tableContainer);
|
||||
}
|
||||
async handleDelete(deleteButton) {
|
||||
const id = deleteButton.getAttribute("data-id");
|
||||
|
||||
const result = await Swal.fire({
|
||||
title: "Are you sure?",
|
||||
text: "You won't be able to revert this!",
|
||||
icon: "warning",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#3085d6",
|
||||
cancelButtonColor: "#d33",
|
||||
confirmButtonText: "Yes, delete it!",
|
||||
});
|
||||
|
||||
if (result.isConfirmed) {
|
||||
try {
|
||||
let response = await fetch(
|
||||
`${GlobalConfig.apiHost}/api/data-settings/${id}`,
|
||||
{
|
||||
method: "DELETE",
|
||||
credentials: "include",
|
||||
headers: {
|
||||
Authorization: `Bearer ${document
|
||||
.querySelector('meta[name="api-token"]')
|
||||
.getAttribute("content")}`,
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
if (response.ok) {
|
||||
let result = await response.json();
|
||||
this.toastMessage.innerText =
|
||||
result.message || "Deleted successfully!";
|
||||
this.toast.show();
|
||||
|
||||
// Refresh Grid.js table
|
||||
if (typeof this.table !== "undefined") {
|
||||
this.table.updateConfig({}).forceRender();
|
||||
}
|
||||
} else {
|
||||
let error = await response.json();
|
||||
console.error("Delete failed:", error);
|
||||
this.toastMessage.innerText =
|
||||
error.message || "Delete failed!";
|
||||
this.toast.show();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error deleting item:", error);
|
||||
this.toastMessage.innerText = "An error occurred!";
|
||||
this.toast.show();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function (e) {
|
||||
new BigdataResume();
|
||||
});
|
||||
27
resources/views/bigdata-resumes/index.blade.php
Normal file
27
resources/views/bigdata-resumes/index.blade.php
Normal file
@@ -0,0 +1,27 @@
|
||||
@extends('layouts.vertical', ['subtitle' => 'Laporan Pimpinan'])
|
||||
|
||||
@section('css')
|
||||
@vite(['node_modules/gridjs/dist/theme/mermaid.min.css'])
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
|
||||
@include('layouts.partials/page-title', ['title' => 'Laporan', 'subtitle' => 'Laporan Pimpinan'])
|
||||
|
||||
<x-toast-notification />
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="card w-100">
|
||||
<div class="card-body">
|
||||
<div id="table-bigdata-resumes"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
|
||||
@section('scripts')
|
||||
@vite(['resources/js/bigdata-resumes/index.js'])
|
||||
@endsection
|
||||
@@ -9,7 +9,6 @@
|
||||
@include('layouts.partials/page-title', ['title' => 'Data', 'subtitle' => 'Business Industries'])
|
||||
|
||||
<x-toast-notification />
|
||||
<x-modal-confirmation buttonText="Delete" confirmationMessage="Are you sure you want to delete this?" />
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
|
||||
Reference in New Issue
Block a user