From 1dc2da25147e3e063b72045000ba2f4ae6575be7 Mon Sep 17 00:00:00 2001 From: marlon-erler Date: Thu, 25 Jul 2024 16:24:09 +0200 Subject: [PATCH] implement drag&drop for status grid --- dist/index.js | 14 ++++++++++++-- src/View/ChatPages/boardStatusGridPage.tsx | 16 +++++++++++++++- 2 files changed, 27 insertions(+), 3 deletions(-) diff --git a/dist/index.js b/dist/index.js index a75a7447..f3deffa5 100644 --- a/dist/index.js +++ b/dist/index.js @@ -2806,7 +2806,12 @@ boardViewModel.taskViewModels, (taskViewModels) => { const statusNameConverter = (statusName) => { - return CategoryStatusColumn(statusName, taskViewModels); + return CategoryStatusColumn( + categoryName, + statusName, + boardViewModel, + taskViewModels + ); }; const viewModel = new TaskCategoryBulkChangeViewModel(taskViewModels, categoryName); return /* @__PURE__ */ createElement("div", { class: "flex-row flex-no large-gap" }, /* @__PURE__ */ createElement("div", { class: "property-input-wrapper" }, /* @__PURE__ */ createElement( @@ -2834,7 +2839,7 @@ } ); } - function CategoryStatusColumn(statusName, taskViewModelsWithMatchingCategory) { + function CategoryStatusColumn(categoryName, statusName, boardViewModel, taskViewModelsWithMatchingCategory) { const taskViewModels = new ListState(); taskViewModelsWithMatchingCategory.handleAddition((taskViewModel) => { const doesMatchStatus = taskViewModel.status.value == statusName; @@ -2844,10 +2849,15 @@ taskViewModels.remove(taskViewModel); }); }); + function drop() { + boardViewModel.handleDrop(categoryName, statusName); + } return /* @__PURE__ */ createElement( "div", { class: "status-column gap", + "on:dragover": allowDrop, + "on:drop": drop, "children:append": [taskViewModels, TaskViewModelToEntry] } ); diff --git a/src/View/ChatPages/boardStatusGridPage.tsx b/src/View/ChatPages/boardStatusGridPage.tsx index 99c20b14..c55d9954 100644 --- a/src/View/ChatPages/boardStatusGridPage.tsx +++ b/src/View/ChatPages/boardStatusGridPage.tsx @@ -10,6 +10,7 @@ import { FilteredList } from "../Components/filteredList"; import { PropertyValueList } from "../Components/propertyList"; import TaskViewModel from "../../ViewModel/Pages/taskViewModel"; import { TaskViewModelToEntry } from "../Components/taskEntry"; +import { allowDrop } from "../utility"; import { collectObjectValuesForKey } from "../../Model/Utility/utility"; import { translations } from "../translations"; @@ -117,7 +118,12 @@ function CategoryRow( const statusNameConverter: React.StateItemConverter = ( statusName: string ) => { - return CategoryStatusColumn(statusName, taskViewModels); + return CategoryStatusColumn( + categoryName, + statusName, + boardViewModel, + taskViewModels + ); }; const viewModel: TaskCategoryBulkChangeViewModel = @@ -153,7 +159,9 @@ function CategoryRow( } function CategoryStatusColumn( + categoryName: string, statusName: string, + boardViewModel: BoardViewModel, taskViewModelsWithMatchingCategory: React.ListState ) { const taskViewModels: React.ListState = new React.ListState(); @@ -168,9 +176,15 @@ function CategoryStatusColumn( }); }); + function drop() { + boardViewModel.handleDrop(categoryName, statusName); + } + return (
);