Allow items to be equipped

src/components/Profile.vue

@@ -2,7 +2,7 @@
   <div class="character-layout">
     <button @click="$emit('exit')" class="profile-exit">Exit</button>
     <div class="character-items">
-      <ItemView :item="item" v-for="(item, index) in world.player.items" :key="'item-' + index" />
+      <ItemView @click.native="useItem(item)" :item="item" v-for="(item, index) in world.player.items" :key="'item-' + index" />
     </div>
     <div class="character-containers">
       <ContainerView :container="container" v-for="(container, index) in world.player.containers" :key="'explore-container-' + index" />
@@ -21,6 +21,8 @@ import ContainerView from './ContainerView.vue'
 import ItemView from './ItemView.vue'
 import { Creature } from '@/game/creature'
 import { World } from '@/game/world'
+import { LogEntry } from '@/game/interface'
+import { Item, ItemKind, Equipment } from '@/game/items'
 @Component({
   components: {
     Statblock, ContainerView, ItemView
@@ -30,6 +32,20 @@ import { World } from '@/game/world'
 export default class Explore extends Vue {
   @Prop()
   world!: World
+
+  useItem (item: Item): void {
+    switch (item.kind) {
+      case ItemKind.Key:
+        break
+      case ItemKind.Consumable:
+        item.actions[0].execute(this.world.player, this.world.player)
+        break
+      case ItemKind.Equipment:
+        this.world.player.equip(item as Equipment, (item as Equipment).slot)
+        this.world.player.items = this.world.player.items.filter(i => item !== i)
+        break
+    }
+  }
 }
 
 </script>