Files
sibedas/resources/js/master/users/users.js

79 lines
2.6 KiB
JavaScript

import { Grid } from "gridjs/dist/gridjs.umd.js";
import gridjs from "gridjs/dist/gridjs.umd.js";
import "gridjs/dist/gridjs.umd.js";
import GlobalConfig from "../../global-config";
class UsersTable {
init() {
this.initTableUsers();
}
initTableUsers() {
new Grid({
columns: [
"ID",
"Name",
"Email",
"Firstname",
"Lastname",
"Position",
"Roles",
{
name: "Action",
formatter: (cell) =>
gridjs.html(`
<div class="d-flex justify-content-center">
<a href="/master/users/${cell}/edit" class="btn btn-yellow btn-sm d-inline-flex align-items-center justify-content-center">
<i class='bx bx-edit'></i>
</a>
</div>
`),
},
],
pagination: {
limit: 50,
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/users`,
credentials: "include",
headers: {
Authorization: `Bearer ${document
.querySelector('meta[name="api-token"]')
.getAttribute("content")}`,
"Content-Type": "application/json",
},
then: (data) => {
console.log(data.data);
return data.data.map((item) => [
item.id,
item.name,
item.email,
item.firstname,
item.lastname,
item.position,
item.roles,
item.id,
]);
},
total: (data) => data.meta.total,
},
}).render(document.getElementById("table-users"));
}
}
document.addEventListener("DOMContentLoaded", function (e) {
new UsersTable().init();
});