radzen drag

@page "/dragdrop"

@using System.Collections.Generic
@using System.Linq

<RadzenDataList Count="@Items.Count" Data="@Items" TItem="Item" Render="@((context) => RenderCard(context))">
</RadzenDataList>

@code {
    // 🔹 데이터 모델
    public class Item
    {
        public int Id { get; set; }
        public string Title { get; set; }
    }

    // 🔹 리스트 데이터
    private List<Item> Items = new()
    {
        new Item { Id = 1, Title = "Item 1" },
        new Item { Id = 2, Title = "Item 2" },
        new Item { Id = 3, Title = "Item 3" },
        new Item { Id = 4, Title = "Item 4" }
    };

    private Item? draggedItem = null;

    // 🔹 카드 렌더링 메서드
    private RenderFragment<Item> RenderCard(Item item) => builder =>
    {
        builder.OpenElement(0, "div");
        builder.AddAttribute(1, "draggable", "true");
        builder.AddAttribute(2, "ondragstart", EventCallback.Factory.Create<DragEventArgs>(this, () => StartDrag(item)));
        builder.AddAttribute(3, "ondragover", EventCallback.Factory.Create<DragEventArgs>(this, PreventDefault));
        builder.AddAttribute(4, "ondrop", EventCallback.Factory.Create<DragEventArgs>(this, () => DropItem(item)));

        builder.OpenComponent<RadzenCard>(5);
        builder.AddAttribute(6, "Style", "margin:10px; padding:20px; border:1px solid #ddd; cursor: grab;");
        builder.AddAttribute(7, "ChildContent", (RenderFragment)(contentBuilder =>
        {
            contentBuilder.AddContent(8, item.Title);
        }));
        builder.CloseComponent();

        builder.CloseElement();
    };

    // 🔹 드래그 시작
    private void StartDrag(Item item)
    {
        draggedItem = item;
    }

    // 🔹 드롭 허용 (기본 동작 방지)
    private void PreventDefault(DragEventArgs e)
    {
        e.PreventDefault();
    }

    // 🔹 아이템 드롭
    private void DropItem(Item targetItem)
    {
        if (draggedItem == null || draggedItem == targetItem) return;

        int oldIndex = Items.IndexOf(draggedItem);
        int newIndex = Items.IndexOf(targetItem);

        Items.RemoveAt(oldIndex);
        Items.Insert(newIndex, draggedItem);

        draggedItem = null;
        StateHasChanged(); // UI 업데이트
    }
}