60 lines
1.9 KiB
JavaScript
60 lines
1.9 KiB
JavaScript
|
const createTh = (value) => {
|
||
|
|
const th = document.createElement("th");
|
||
|
|
th.setAttribute("scope", "row");
|
||
|
|
th.innerText = value;
|
||
|
|
return th;
|
||
|
|
};
|
||
|
|
const createTd = (value) => {
|
||
|
|
const td = document.createElement("td");
|
||
|
|
td.innerText = value;
|
||
|
|
return td;
|
||
|
|
};
|
||
|
|
const createButton = (text, type, action) => {
|
||
|
|
const btn = document.createElement("button");
|
||
|
|
btn.setAttribute("type", "button");
|
||
|
|
btn.classList.add("btn", type);
|
||
|
|
btn.innerHTML = text;
|
||
|
|
btn.addEventListener("click", action);
|
||
|
|
const td = document.createElement("td");
|
||
|
|
td.appendChild(btn);
|
||
|
|
return td;
|
||
|
|
};
|
||
|
|
|
||
|
|
const studentTable = (tableId, editCallback, deleteCallback) => {
|
||
|
|
const draw = async (data) => {
|
||
|
|
const students = document.getElementById(tableId);
|
||
|
|
students.innerHTML = "";
|
||
|
|
|
||
|
|
data.forEach((element) => {
|
||
|
|
const container = document.createElement("tr");
|
||
|
|
container.classList.add("align-middle");
|
||
|
|
container.appendChild(createTh(element.id));
|
||
|
|
container.appendChild(createTd(element.last_name));
|
||
|
|
container.appendChild(createTd(element.first_name));
|
||
|
|
container.appendChild(createTd(element.bdate));
|
||
|
|
container.appendChild(createTd(element.email));
|
||
|
|
container.appendChild(createTd(element.phone));
|
||
|
|
container.appendChild(createTd(element.group.name));
|
||
|
|
container.appendChild(
|
||
|
|
createButton("Edit", "btn-warning", async () => {
|
||
|
|
if (editCallback) {
|
||
|
|
editCallback(element);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
);
|
||
|
|
container.appendChild(
|
||
|
|
createButton("Delete", "btn-danger", async () => {
|
||
|
|
if (deleteCallback) {
|
||
|
|
deleteCallback(element.id);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
);
|
||
|
|
students.appendChild(container);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
return { draw };
|
||
|
|
};
|
||
|
|
|
||
|
|
export default studentTable;
|