98 lines
3.6 KiB
JavaScript
98 lines
3.6 KiB
JavaScript
import { Grid } from "gridjs/dist/gridjs.umd.js";
|
|
import "gridjs/dist/gridjs.umd.js";
|
|
import gridjs from "gridjs/dist/gridjs.umd.js";
|
|
import GlobalConfig from "../global-config";
|
|
|
|
class PbgTasks {
|
|
init() {
|
|
this.initTableRequestAssignment();
|
|
}
|
|
|
|
initTableRequestAssignment() {
|
|
let tableContainer = document.getElementById("table-pbg-tasks");
|
|
|
|
// Pastikan kontainer kosong sebelum merender ulang Grid.js
|
|
tableContainer.innerHTML = "";
|
|
let canUpdate = tableContainer.getAttribute("data-updater") === "1";
|
|
new Grid({
|
|
columns: [
|
|
"ID",
|
|
{ name: "Name", width: "15%" },
|
|
{ name: "Condition", width: "7%" },
|
|
"Registration Number",
|
|
"Document Number",
|
|
{ name: "Address", width: "30%" },
|
|
"Status",
|
|
"Function Type",
|
|
"Consultation Type",
|
|
{ name: "Due Date", width: "10%" },
|
|
{
|
|
name: "Action",
|
|
formatter: function (cell) {
|
|
let tableContainer = document.getElementById("table-pbg-tasks");
|
|
let canUpdate = tableContainer.getAttribute("data-updater") === "1";
|
|
|
|
if (!canUpdate) {
|
|
return gridjs.html(`
|
|
<span class="text-muted">No Privilege</span>
|
|
`);
|
|
}
|
|
|
|
return gridjs.html(`
|
|
<div class="d-flex justify-content-center align-items-center gap-2">
|
|
<a href="/pbg-task/${cell}" class="btn btn-yellow btn-sm d-inline-flex align-items-center justify-content-center">
|
|
Detail
|
|
</a>
|
|
</div>
|
|
`);
|
|
},
|
|
}
|
|
],
|
|
search: {
|
|
server: {
|
|
url: (prev, keyword) => `${prev}?search=${keyword}`,
|
|
},
|
|
},
|
|
pagination: {
|
|
limit: 15,
|
|
server: {
|
|
url: (prev, page) =>
|
|
`${prev}${prev.includes("?") ? "&" : "?"}page=${
|
|
page + 1
|
|
}`,
|
|
},
|
|
},
|
|
sort: true,
|
|
server: {
|
|
url: `${GlobalConfig.apiHost}/api/request-assignments`,
|
|
credentials: "include",
|
|
headers: {
|
|
Authorization: `Bearer ${document
|
|
.querySelector('meta[name="api-token"]')
|
|
.getAttribute("content")}`,
|
|
"Content-Type": "application/json",
|
|
},
|
|
then: (data) =>
|
|
data.data.map((item) => [
|
|
item.id,
|
|
item.name,
|
|
item.condition,
|
|
item.registration_number,
|
|
item.document_number,
|
|
item.address,
|
|
item.status_name,
|
|
item.function_type,
|
|
item.consultation_type,
|
|
item.due_date,
|
|
item.id,
|
|
]),
|
|
total: (data) => data.meta.total,
|
|
},
|
|
}).render(document.getElementById("table-pbg-tasks"));
|
|
}
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", function (e) {
|
|
new PbgTasks().init();
|
|
});
|