ADD : drag working

myBlazorApp/myBlazorApp/Components/InventoryItem.razor

@@ -1,4 +1,14 @@
-<div class="inventory-item">
+
+<div
+    class="inventory-item"
+    ondragover="event.preventDefault();"
+    draggable="true"
+
+    @ondragstart="@OnDragStart"
+    @ondrop="@OnDrop"
+    @ondragenter="@OnDragEnter"
+    @ondragleave="@OnDragLeave"
+>
     @if (Item != null)
     {
         @Item.DisplayName

myBlazorApp/myBlazorApp/Components/InventoryItem.razor.cs

@@ -1,6 +1,5 @@
 using System;
 namespace myBlazorApp.Components;
-
 using Blazorise;
 using Microsoft.AspNetCore.Components;
 using myBlazorApp.Models;
@@ -9,27 +8,41 @@ public partial class InventoryItem
 {
     [Parameter]
     public Item Item { get; set; }
+
     [Parameter]
     public int Index { get; set; }
+
+    [Parameter]
+    public bool NoDrop { get; set; }
+
     [CascadingParameter]
     public MyInventory Parent { get; set; }
 
     internal void OnDragEnter()
     {
-
+        if (NoDrop)
+        {
+            return;
+        }
         Parent.Actions.Add(new InventoryAction { Action = "Drag Enter", Item = this.Item, Index = this.Index });
     }
 
     internal void OnDragLeave()
     {
-
+        if (NoDrop)
+        {
+            return;
+        }
         Parent.Actions.Add(new InventoryAction { Action = "Drag Leave", Item = this.Item, Index = this.Index });
     }
 
     internal void OnDrop()
     {
+        if (NoDrop)
+        {
+            return;
+        }
         this.Item = Parent.CurrentDragItem;
-
         Parent.Actions.Add(new InventoryAction { Action = "Drop", Item = this.Item, Index = this.Index });
 
     }
@@ -37,7 +50,6 @@ public partial class InventoryItem
     private void OnDragStart()
     {
         Parent.CurrentDragItem = this.Item;
-
         Parent.Actions.Add(new InventoryAction { Action = "Drag Start", Item = this.Item, Index = this.Index });
     }
 }

myBlazorApp/myBlazorApp/Components/MyInventory.razor

@@ -1,16 +1,18 @@
-<h3>My Inventory</h3>
+<CascadingValue Value="@this">
+    <h3>My Inventory</h3>
 
-<div class="inventory-items">
+    <div class="inventory-items">
 
-    @foreach (var item in ItemsInventory)
+        @foreach (var item in ItemsInventory)
-    {
+        {
-        <InventoryItem Index="@index" Item="item" />
+            <InventoryItem Index="@index" Item="item" NoDrop="true" />
             index++;
-    }
+        }
-    @for (int i = @index; i<18; i++)
+        @for (int i = @index; i < 18; i++)
-    {
+        {
-        <InventoryItem Index="i" />
+            <InventoryItem Index="i" />
-    }
+        }
-</div>
+    </div>
+</CascadingValue>
 
 

myBlazorApp/myBlazorApp/Components/MyInventory.razor.cs

@@ -11,11 +11,14 @@ namespace myBlazorApp.Components
     {
         [Parameter]
         public List<Item> ItemsInventory { get; set; } = new List<Item>();
-        public ObservableCollection<InventoryAction> Actions { get; set; }
+
-        public Item CurrentDragItem { get; set; }
         [Parameter]
         public int index { get; set; } = 0;
 
+        public ObservableCollection<InventoryAction> Actions { get; set; }
+
+        public Item CurrentDragItem { get; set; } = new Item();
+
         public MyInventory()
         {
             Actions = new ObservableCollection<InventoryAction>();
@@ -34,20 +37,6 @@ namespace myBlazorApp.Components
         [Inject]
         internal IJSRuntime JavaScriptRuntime { get; set; }
 
-        /*
-        protected override async Task OnAfterRenderAsync(bool firstRender)
-        {
-            base.OnAfterRenderAsync(firstRender);
-
-            if (!firstRender)
-            {
-                return;
-            }
-            itemsInventory = await DataService.List(0, await DataService.Count());
-            StateHasChanged();
-        }
-        */
-
         private void OnActionsCollectionChanged(object? sender, NotifyCollectionChangedEventArgs e)
         {
             JavaScriptRuntime.InvokeVoidAsync("MyInventory.AddActions", e.NewItems);