feat(views/table): basic drag support

This commit is contained in:
Elian Doran 2025-06-27 19:53:40 +03:00
parent 9dcd79bd94
commit 80d5536503
No known key found for this signature in database
2 changed files with 47 additions and 7 deletions

View File

@ -1,11 +1,14 @@
import { GridOptions } from "ag-grid-community";
import FNote from "../../../entities/fnote.js";
import type { LabelType } from "../../../services/promoted_attribute_definition_parser.js";
import froca from "../../../services/froca.js";
export type TableData = {
noteId: string;
title: string;
labels: Record<string, boolean | string | null>;
branchId: string;
position: number;
};
export interface PromotedAttributeInformation {
@ -16,9 +19,9 @@ export interface PromotedAttributeInformation {
type GridLabelType = 'text' | 'number' | 'boolean' | 'date' | 'dateString' | 'object';
export function buildData(info: PromotedAttributeInformation[], notes: FNote[]) {
export function buildData(parentNote: FNote, info: PromotedAttributeInformation[], notes: FNote[]) {
const columnDefs = buildColumnDefinitions(info);
const rowData = buildRowDefinitions(notes, info);
const rowData = buildRowDefinitions(parentNote, notes, info);
return {
rowData,
@ -34,7 +37,11 @@ export function buildColumnDefinitions(info: PromotedAttributeInformation[]) {
},
{
field: "title",
editable: true
editable: true,
rowDrag: true,
},
{
field: "position"
}
];
@ -68,9 +75,10 @@ function mapDataType(labelType: LabelType | undefined): GridLabelType {
}
}
export function buildRowDefinitions(notes: FNote[], infos: PromotedAttributeInformation[]) {
export function buildRowDefinitions(parentNote: FNote, notes: FNote[], infos: PromotedAttributeInformation[]) {
const definitions: GridOptions<TableData>["rowData"] = [];
for (const note of notes) {
for (const branch of parentNote.getChildBranches()) {
const note = branch.getNoteFromCache();
const labels: typeof definitions[0]["labels"] = {};
for (const { name, type } of infos) {
if (type === "boolean") {
@ -82,7 +90,9 @@ export function buildRowDefinitions(notes: FNote[], infos: PromotedAttributeInfo
definitions.push({
noteId: note.noteId,
title: note.title,
labels
labels,
position: branch.notePosition,
branchId: branch.branchId
});
}

View File

@ -7,6 +7,7 @@ import applyHeaderCustomization from "./header-customization.js";
import server from "../../../services/server.js";
import type { GridApi, GridState } from "ag-grid-community";
import SpacedUpdate from "../../../services/spaced_update.js";
import branches from "../../../services/branches.js";
const TPL = /*html*/`
<div class="table-view">
@ -79,8 +80,9 @@ export default class TableView extends ViewMode<StateInfo> {
const initialState = viewStorage?.gridState;
this.api = createGrid(el, {
...buildData(info, notes),
...buildData(parentNote, info, notes),
...setupEditing(),
...setupDragging(),
initialState,
async onGridReady(event) {
applyHeaderCustomization(el, event.api);
@ -127,3 +129,31 @@ function setupEditing(): GridOptions<TableData> {
}
}
}
function setupDragging() {
return {
onRowDragEnd(e) {
const fromIndex = e.node.rowIndex;
const toIndex = e.overNode?.rowIndex;
console.log(fromIndex, toIndex);
if (fromIndex === null || toIndex === null || toIndex === undefined || fromIndex === toIndex) {
return;
}
const isBelow = (toIndex > fromIndex);
const fromBranchId = e.node.data?.branchId;
const toBranchId = e.overNode?.data?.branchId;
if (fromBranchId === undefined || toBranchId === undefined) {
return;
}
if (isBelow) {
console.log("Move below", fromIndex, toIndex);
branches.moveAfterBranch([ fromBranchId ], toBranchId);
} else {
console.log("Move above", fromIndex, toIndex);
branches.moveBeforeBranch([ fromBranchId ], toBranchId);
}
}
};
}