TurTaskProject/TurTaskWeb
1
0
Fork 0
mirror of https://github.com/TurTaskProject/TurTaskWeb.git synced 2025-12-20 06:24:07 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Connect API on ListBoard in Kanban

Browse Source
This commit is contained in:
sosokker 2023-11-21 05:54:55 +07:00
parent 81914dd7fa
commit ddac2bc5ee
1 changed files with 35 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
frontend/src/components/kanbanBoard/kanbanBoard.jsx
View File

@ -110,12 +110,12 @@ function KanbanBoard() {
useEffect(() => { useEffect(() => {
const fetchBoardData = async () => { const fetchBoardData = async () => {
try { try {
const response = await axiosInstance.get('boards/'); const response = await axiosInstance.get("boards/");
if (response.data && response.data.length > 0) { if (response.data && response.data.length > 0) {
setBoardData(response.data[0]); setBoardData(response.data[0]);
} }
} catch (error) { } catch (error) {
console.error('Error fetching board data:', error); console.error("Error fetching board data:", error);
} }
}; };
fetchBoardData(); fetchBoardData();
@ -222,15 +222,15 @@ function KanbanBoard() {
} }
function createNewColumn() { function createNewColumn() {
axiosInstance.post('lists/', { name: `Column ${columns.length + 1}`, position: 1, board: boardId }) axiosInstance
.post("lists/", { name: `Column ${columns.length + 1}`, position: 1, board: boardId.id })
.then(response => { .then(response => {
const newColumn = { const newColumn = {
id: response.data.id, id: response.data.id,
title: response.data.name, title: response.data.name,
}; };
setColumns([...columns, newColumn]); setColumns(prevColumns => [...prevColumns, newColumn]);
}) })
.catch(error => { .catch(error => {
console.error("Error creating ListBoard:", error); console.error("Error creating ListBoard:", error);
@ -238,20 +238,39 @@ function KanbanBoard() {
} }
function deleteColumn(id) { function deleteColumn(id) {
const filteredColumns = columns.filter(col => col.id !== id); axiosInstance
setColumns(filteredColumns); .delete(`lists/${id}/`)
.then(response => {
setColumns(prevColumns => prevColumns.filter(col => col.id !== id));
})
.catch(error => {
console.error("Error deleting ListBoard:", error);
});
const newTasks = tasks.filter(t => t.columnId !== id); const tasksToDelete = tasks.filter(t => t.columnId === id);
setTasks(newTasks);
tasksToDelete.forEach(task => {
axiosInstance
.delete(`todo/${task.id}/`)
.then(response => {
setTasks(prevTasks => prevTasks.filter(t => t.id !== task.id));
})
.catch(error => {
console.error("Error deleting Task:", error);
});
});
} }
function updateColumn(id, title) { function updateColumn(id, title) {
const newColumns = columns.map(col => { // Update the column
if (col.id !== id) return col; axiosInstance
return { ...col, title }; .patch(`lists/${id}/`, { name: title }) // Adjust the payload based on your API requirements
.then(response => {
setColumns(prevColumns => prevColumns.map(col => (col.id === id ? { ...col, title } : col)));
})
.catch(error => {
console.error("Error updating ListBoard:", error);
}); });
setColumns(newColumns);
} }
function onDragStart(event) { function onDragStart(event) {
@ -289,15 +308,6 @@ function KanbanBoard() {
const reorderedColumns = arrayMove(columns, activeColumnIndex, overColumnIndex); const reorderedColumns = arrayMove(columns, activeColumnIndex, overColumnIndex);
axiosInstance
.put("todo/change_task_list_board/", { columns: reorderedColumns })
.then(response => {
// Successful handle
})
.catch(error => {
console.error("Error updating column order:", error);
});
return reorderedColumns; return reorderedColumns;
}); });
} }
@ -323,20 +333,9 @@ function KanbanBoard() {
const newColumnId = overId; const newColumnId = overId;
const new_index = event.over?.index; const new_index = event.over?.index;
if (newColumnId != tasks[activeIndex].columnId) {
// Update the columnId of the task // Update the columnId of the task
tasks[activeIndex].columnId = newColumnId; tasks[activeIndex].columnId = newColumnId;
axiosInstance
.put(`todo/change_task_order/`, { activeId, newColumnId, new_index })
.then(response => {
// Successful update handle
})
.catch(error => {
console.error("Error updating task columnId and index:", error);
});
}
// If new_index is not provided, insert the task at the end // If new_index is not provided, insert the task at the end
if (new_index !== null && 0 <= new_index && new_index <= tasks.length) { if (new_index !== null && 0 <= new_index && new_index <= tasks.length) {
return arrayMove(tasks, activeIndex, new_index); return arrayMove(tasks, activeIndex, new_index);