119 lines
4.6 KiB
JavaScript
119 lines
4.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.js";
|
|
|
|
class SyncronizeTask {
|
|
init() {
|
|
this.initTableImportDatasources();
|
|
this.handleSubmitSync();
|
|
}
|
|
initTableImportDatasources() {
|
|
new Grid({
|
|
columns: ["ID", "Message", "Response", "Status", "Created"],
|
|
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/import-datasource`,
|
|
headers: {
|
|
Authorization: `Bearer ${document
|
|
.querySelector('meta[name="api-token"]')
|
|
.getAttribute("content")}`,
|
|
"Content-Type": "application/json",
|
|
},
|
|
then: (data) =>
|
|
data.data.map((item) => [
|
|
item.id,
|
|
item.message,
|
|
item.response_body,
|
|
item.status,
|
|
item.created_at,
|
|
]),
|
|
total: (data) => data.meta.total,
|
|
},
|
|
}).render(document.getElementById("table-import-datasources"));
|
|
}
|
|
handleSubmitSync() {
|
|
const button = document.getElementById("btn-sync-submit");
|
|
|
|
// Check if the button should be enabled or disabled based on the status
|
|
fetch(`${GlobalConfig.apiHost}/api/import-datasource/check-datasource`, {
|
|
method: "GET",
|
|
headers: {
|
|
Authorization: `Bearer ${document
|
|
.querySelector('meta[name="api-token"]')
|
|
.getAttribute("content")}`,
|
|
"Content-Type": "application/json",
|
|
}
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error("Network response was not ok");
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
console.log("data check button sync", data.can_execute);
|
|
button.disabled = !data.can_execute;
|
|
|
|
// If the button is enabled, add click event to trigger sync
|
|
if (!button.disabled) {
|
|
button.addEventListener("click", function(e) {
|
|
button.disabled = true; // Disable button to prevent multiple clicks
|
|
button.textContent = "Syncing..."; // Change button text to show syncing
|
|
|
|
// Trigger the scraping API call
|
|
fetch(`${GlobalConfig.apiHost}/api/scraping`, {
|
|
method: "GET",
|
|
headers: {
|
|
Authorization: `Bearer ${document
|
|
.querySelector('meta[name="api-token"]')
|
|
.getAttribute("content")}`,
|
|
"Content-Type": "application/json",
|
|
}
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error("Network response was not ok");
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
console.log("data sync button", data);
|
|
alert("Synchronization executed successfully");
|
|
window.location.reload();
|
|
})
|
|
.catch(err => {
|
|
console.error("Fetch error:", err);
|
|
alert("An error occurred during synchronization");
|
|
})
|
|
.finally(() => {
|
|
button.disabled = false; // Re-enable the button after the request is complete
|
|
button.textContent = "Sync Data"; // Reset button text
|
|
});
|
|
});
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error("Fetch error:", err);
|
|
alert("An error occurred while checking the datasource");
|
|
});
|
|
}
|
|
}
|
|
document.addEventListener("DOMContentLoaded", function (e) {
|
|
new SyncronizeTask().init();
|
|
});
|