implements selecting an item and buying that if the coin is sufficent.

src/module/dialog/itemBrowserDialog.mjs

@@ -22,6 +22,10 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
         window: {
             resizable: true,
             title: "Gegenstände Browser"
+        },
+        actions: {
+            select: ItemBrowserDialog.#selectItem,
+            buy: ItemBrowserDialog.#buyItem
         }
     }
 
@@ -42,6 +46,7 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
      * @private
      */
     _items = []
+    _selectedItem = null
     filter_price_lower = 0
     filter_price_upper = 0
     filter_weight_lower = 0
@@ -53,6 +58,7 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
         super();
         this._actor = actor
         this._items = []
+        this._selectedItem = null
     }
 
     static async #onSubmitForm(event, form, formData) {
@@ -67,6 +73,37 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
         this.render({parts: ["form"]})
     }
 
+    static async #selectItem(event, target) {
+        const {itemId} = target.dataset
+        const selectedItem = this._items.find(item => item.uuid === itemId)
+
+        this._items?.forEach((item) => {
+            item.selected = item.uuid === itemId
+        })
+
+        if (selectedItem) {
+            this._selectedItem = selectedItem
+        }
+        this.render({parts: ["form"]})
+    }
+
+    static async #buyItem(event, target) {
+        if (this._actor && this._selectedItem) {
+            const canBuy = await this._actor.reduceWealth(this._selectedItem.price)
+            if (canBuy) {
+                const document = await foundry.utils.fromUuid(this._selectedItem.uuid)
+                if (document) {
+                    await this._actor.createEmbeddedDocuments("Item", [document])
+                    ui.notifications.info(this._selectedItem.name + " wurde von " + this._actor.name + " gekauft")
+                }
+            } else {
+                ui.notifications.error(this._selectedItem.name + " ist zu teuer für " + this._actor.name)
+            }
+
+
+        }
+    }
+
     _canDragDrop(event, options) {
         return game.user.isGM
     }
@@ -117,6 +154,7 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
         context.price_upper = this._maxPrice
         context.weight_lower = this._minWeight
         context.weight_upper = this._maxWeight
+        context.hasSelectedItem = this._selectedItem != null
 
         context.items = this._items
             ?.filter(p => p.name.toLowerCase().indexOf(context.filterName.toLowerCase()) !== -1 || context.filterName === "")
@@ -171,7 +209,8 @@ export class ItemBrowserDialog extends HandlebarsApplicationMixin(ApplicationV2)
                         name: item.name,
                         price: e.system.price,
                         weight: e.system.weight,
-                        category: e.system.category.join(", ")
+                        category: e.system.category.join(", "),
+                        selected: false,
                     })
 
                     parsedEntries += 1

src/style/organisms/_item-browser-dialog.scss

@@ -84,6 +84,11 @@
           &:nth-child(odd) {
             background-color: rgba(0, 0, 0, 0.1);
           }
+
+          &.selected {
+            background-color: rgba(255, 140, 0, 0.2);
+            border: 1px solid orange;
+          }
         }
 
       }

src/templates/dialog/item-browser-dialog.hbs

@@ -41,6 +41,11 @@
             </label>
         </fieldset>
 
+        <div class="options">
+            <button {{#if hasSelectedItem}}data-action="buy" {{else}} disabled="disabled" {{/if}}><i
+                    class="fa-solid fa-coins"></i> Kaufen
+            </button>
+        </div>
     </aside>
 
     <div class="scrollable-table">
@@ -53,7 +58,8 @@
         </div>
         <div class="scroll-y items">
             {{#each items}}
-                <div class="item" data-item-id="{{this.uuid}}" draggable="true">
+                <div data-action="select" class="item {{#if this.selected}}selected{{/if}}" data-item-id="{{this.uuid}}"
+                     draggable="true">
                     <img class="image" src="{{this.img}}" alt="{{this.name}}"/>
                     <span class="name">{{this.name}}</span>
                     <span class="category">{{this.category}}</span>