add goal completion composition.

2021-01-19 19:45:12 +01:00
parent 282b304f3f
commit 5e1a6f7343
11 changed files with 95 additions and 14 deletions
@@ -0,0 +1,84 @@
+<script lang="ts">
+  import type { GoalCompositionMode } from "../models/goal";
+  import type { LogResult } from "../models/log";
+import type { TaskResult } from "../models/task";
+
+  interface CompositionItem {
+    link: string
+    amount: number
+    name: string
+  }
+
+  export let logs: LogResult[] = [];
+  export let mode: GoalCompositionMode = "item";
+
+  let list: CompositionItem[] = [];
+
+  $: {
+    const map: {[k: string]: CompositionItem} = {}
+  
+    if (mode === "item") {
+      for (const log of logs) {
+        const item = log.item;
+        if (!map[item.name]) {
+          map[item.name] = {name: item.name, amount: log.itemAmount, link: `/items#${item.id}`};
+        } else {
+          map[item.name].amount += log.itemAmount;
+        }
+
+        if (log.secondaryItem) {
+          const item = log.secondaryItem;
+          if (!map[item.name]) {
+            map[item.name] = {name: item.name, amount: log.secondaryItemAmount, link: `/items#${item.id}`};
+          } else {
+            map[item.name].amount += log.secondaryItemAmount;
+          }
+        }
+      }
+    } else {
+      for (const log of logs) {
+        const task = log.task;
+
+        const amount = log.secondaryItem ? log.secondaryItemAmount + log.itemAmount : log.itemAmount;
+
+        if (!map[task.name]) {
+          map[task.name] = {name: task.name, amount, link: `/questlog#${task.projectId}`};
+        } else {
+          map[task.name].amount += amount;
+        }
+      }
+    }
+  
+    list = Object.keys(map).sort((a, b) => map[b].amount - map[a].amount).map(k => map[k]);
+  }
+</script>
+
+<div class="composition">
+  {#each list as item (item.name)}
+    <div class="item">
+      <span class="amount">{item.amount}x&nbsp;</span>
+      <a href={item.link}>{item.name}</a>
+    </div>
+  {/each}
+</div>
+
+<style>
+  div.composition {
+    padding: 0.25em 0ch;
+    color: #555;
+    font-size: 0.75em;
+  }
+
+  div.item {
+    padding: 0.125em 0.5ch;
+    display: inline-block;
+  }
+
+  span.amount {
+    color: #777;
+  }
+
+  a {
+    color: inherit;
+  }
+</style>