LivaDocs

LivaDNDTree

DevExtreme TreeList üzerine kurulu, sürükle-bırak ile yeniden düzenlenebilen ağaç bileşeni. Düz liste (id / parentId) yapısındaki veriyi hiyerarşik gösterir; bir düğüm başka bir düğümün üzerine bırakıldığında onun altına taşınır, araya bırakıldığında kardeş olarak sıralanır. Her değişiklikte onChange güncel listeyi döndürür ve kardeş düğümlerin order alanlarını yeniden numaralandırır.

import { LivaDNDTree, type DNDTreeItem } from "@dataliva/livalib";

Sürükle-bırak hiyerarşi

Departman/kişi hiyerarşisini sürükleyerek değiştirin: bir kişiyi başka bir departmanın üzerine bırakın ya da satırlar arasına bırakarak sırasını değiştirin. Satıra tıklamak seçimi günceller ve onSelect tetiklenir.

Sürükle-bırak hiyerarşi
Önizleme yükleniyor…

Satır aksiyonları

onAdd, onRename veya onDelete geri çağrılarından en az biri verildiğinde satır sonunda bir aksiyon menüsü düğmesi görünür (showRowActions ile bu davranış elle de kontrol edilebilir). Menü; yeniden adlandırma, alt öğe ekleme ve silme komutlarını sunar — veri güncellemesi tamamen size aittir.

Satır aksiyonları
Önizleme yükleniyor…

onRename geri çağrısına öğeyle birlikte mevcut ad iletilir; yeni adın nasıl alınacağı (satır içi düzenleme, popup vb.) uygulamaya bırakılmıştır. Özel columns verildiğinde varsayılan ad kolonu ve aksiyon kolonu yerine tamamen sizin kolonlarınız kullanılır.

Veri tipi

type DNDTreeItem = Record<string, any> & {
  id: string | number;
  parentId?: string | number | null;
  name?: string;
  order?: number; // kardeşler arası sıra; taşımalarda yeniden numaralandırılır
};