remrem 2 years ago
commit 8d0deba849

@ -43,7 +43,6 @@
<div class="col-12"> <div class="col-12">
<div>Actions</div> <div>Actions</div>
<div class="actions" id="actions"> <div class="actions" id="actions">
</div> </div>
</div> </div>
</div> </div>

@ -1,6 +1,7 @@
using Blazor.Models; using Blazor.Models;
using Blazor.Pages; using Blazor.Pages;
using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using System.Collections.ObjectModel; using System.Collections.ObjectModel;
namespace Blazor.Components namespace Blazor.Components
@ -11,6 +12,9 @@ namespace Blazor.Components
public Models.InventoryItem CurrentDragItem { get; set; } public Models.InventoryItem CurrentDragItem { get; set; }
public ObservableCollection<InventoryAction> Actions { get; set; } public ObservableCollection<InventoryAction> Actions { get; set; }
[Inject]
internal IJSRuntime JavaScriptRuntime { get; set; }
public Inventory() public Inventory()
{ {
Actions = new ObservableCollection<InventoryAction>(); Actions = new ObservableCollection<InventoryAction>();

@ -3,4 +3,12 @@
gap: 10px; gap: 10px;
display: grid; display: grid;
width: 40%; width: 40%;
}
.actions {
border: 1px solid black;
height: 250px;
overflow: scroll;
} }

@ -0,0 +1,16 @@
window.Inventory =
{
AddActions: function (data) {
data.forEach(element => {
var div = document.createElement('div');
div.innerHTML = 'Action: ' + element.action + ' - Index: ' + element.index;
if (element.item) {
div.innerHTML += ' - Item Name: ' + element.item.name;
}
document.getElementById('actions').appendChild(div);
});
}
}

@ -73,11 +73,13 @@ namespace Blazor.Components
} }
internal void OnDragEnter() internal void OnDragEnter()
{ {
if (this.Items == null) return;
Parent.Actions.Add(new InventoryAction("Drag Enter",this.Index,Items.item)); Parent.Actions.Add(new InventoryAction("Drag Enter",this.Index,Items.item));
} }
internal void OnDragLeave() internal void OnDragLeave()
{ {
if (this.Items == null) return;
Parent.Actions.Add(new InventoryAction("Drag Leave",this.Index,Items.item)); Parent.Actions.Add(new InventoryAction("Drag Leave",this.Index,Items.item));
} }
} }

@ -1,5 +1,5 @@
@page "/" @page "/"
@using Blazor.Components; @using Blazor.Components;
<div> <div>
<Blazor.Components.Inventory inventory="inventory"/> <h1>Welcome</h1>
</div> </div>

@ -1,20 +1,19 @@
@page "/inventory" @page "/inventory"
@using Blazor.Components @using Blazor.Components
@using Blazor.Models
<PageTitle>Counter</PageTitle>
<PageTitle>Counter</PageTitle>
<h1>Inventory</h1>
<h1>Inventory</h1>
<div id="master">
<div id="master"> <div class="inventory">
<div class="inventory"> <span>
<span> <Inventory/>
<Blazor.Components.Inventory/> </span>
</span> </div>
</div>
<div class="inventory-list">
<div class="inventory-list"> <InventoryList/>
<InventoryList/> </div>
</div> </div>
</div>

@ -1,14 +1,14 @@
.inventory-list { .inventory-list {
width: 40%; width: 40%;
} }
.inventory { .inventory {
width: 40%; width: 40%;
} }
#master { #master {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
} }
Loading…
Cancel
Save