@page "/reordergridtest/{siteId:int}" @using BLAIzor.Components.Layout @using BLAIzor.Components.Partials @using BLAIzor.Models @using BLAIzor.Services @using System.Collections.ObjectModel @using Microsoft.JSInterop @using Newtonsoft.Json @inject ScopedContentService scopedContentService @inject ContentEditorService contentEditorService @inject QDrantService qDrantService @layout AdminLayout @* @inherits DbContextPage *@ @inject IJSRuntime JSRuntime; @if (menuItems == null) {

Loading...

} else { @{ @(allowReorder? "Cancel" : "Reorder") } @* *@ @* *@ Site: @* @selectedMenuItems.FirstOrDefault()?.SiteInfo.SiteName *@ @* *@ } @code { [Parameter] public int siteId { get; set; } ObservableCollection menuItems; IList selectedMenuItems; private string document = ""; private string subject = ""; public bool hasCollection = false; public bool MenuItemsSaved = false; private bool allowReorder = false; private int pagesize = 5; private List ExtractedMenuItems = new(); MenuItem draggedItem; MenuItemModel SelectedMenuItemModel = new(""); private RadzenDataGrid dataGrid; protected override async Task OnParametersSetAsync() { await base.OnParametersSetAsync(); var siteInfo = await scopedContentService.GetSiteInfoByIdAsync(siteId); // var menuItems1 = await contentEditorService.GetMenuItemsBySiteIdAsync(1); menuItems = new ObservableCollection(await contentEditorService.GetMenuItemsBySiteIdAsync(siteId)); selectedMenuItems = new List() { menuItems.FirstOrDefault() }; var collectionResult = await qDrantService.GetCollectionBySiteIdAsync(siteId); if (!string.IsNullOrEmpty(collectionResult)) { //create colection hasCollection = true; Console.Write("Has collection already"); } if (menuItems.Count() > 0) { foreach (var menuItem in menuItems) { string content; MenuItemModel model = new MenuItemModel(""); //try to get content from qDrant if (menuItem.QdrantPointId != null) { content = await qDrantService.GetContentAsync(siteId, menuItem.SortOrder); var selectedPoint = JsonConvert.DeserializeObject(content)!; if (selectedPoint != null) { model.Content = selectedPoint.result.payload.content; Console.Write($"Found point: {selectedPoint.result.payload.content}"); } } model.MenuItem.Name = menuItem.Name; ExtractedMenuItems.Add(model); // UpdateMenuItem(model); } SelectedMenuItemModel.MenuItem.Name = selectedMenuItems.FirstOrDefault().Name; SelectedMenuItemModel.Content = (ExtractedMenuItems.Where(x => x.MenuItem.Name == selectedMenuItems.FirstOrDefault().Name).FirstOrDefault()).Content; MenuItemsSaved = true; } } async void ToggleReorder() { if (!allowReorder) { pagesize = 20; } else { pagesize = 5; } allowReorder = !allowReorder; } void Select(MenuItem menuItem) { SelectedMenuItemModel.MenuItem.Name = menuItem.Name; SelectedMenuItemModel.Content = ExtractedMenuItems.Where(x => x.MenuItem.Name == menuItem.Name).FirstOrDefault().Content; } void OnRowSelect(MenuItem menuItem) { Select(menuItem); } private void UpdateMenuItem(MenuItemModel updatedItem) { var item = ExtractedMenuItems!.FirstOrDefault(i => i.MenuItem.Name == updatedItem.MenuItem.Name); if (item != null) { item.Content = updatedItem.Content; } } void RowRender(RowRenderEventArgs args) { if(allowReorder) { args.Attributes.Add("title", "Drag row to reorder"); args.Attributes.Add("style", "cursor:grab"); args.Attributes.Add("draggable", "true"); args.Attributes.Add("ondragover", "event.preventDefault();event.target.closest('.rz-data-row').classList.add('my-class')"); args.Attributes.Add("ondragleave", "event.target.closest('.rz-data-row').classList.remove('my-class')"); args.Attributes.Add("ondragstart", EventCallback.Factory.Create(this, () => draggedItem = args.Data)); args.Attributes.Add("ondrop", EventCallback.Factory.Create(this, () => { var draggedIndex = menuItems.IndexOf(draggedItem); var droppedIndex = menuItems.IndexOf(args.Data); menuItems.Remove(draggedItem); menuItems.Insert(draggedIndex <= droppedIndex ? droppedIndex++ : droppedIndex, draggedItem); foreach (var menuItemToReorder in menuItems) { menuItemToReorder.SortOrder = menuItems.IndexOf(menuItemToReorder); } JSRuntime.InvokeVoidAsync("eval", $"document.querySelector('.my-class').classList.remove('my-class')"); })); } } }