From 2f225a54054ae44df2d8fa691efcf247a82f94a1 Mon Sep 17 00:00:00 2001
From: schneefux <schneefux+commit@schneefux.xyz>
Date: Fri, 11 May 2018 20:21:18 +0200
Subject: refactor: create ReportService, move tabs to component

---
 src/BlitzTab.vue | 48 ++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 src/BlitzTab.vue

(limited to 'src/BlitzTab.vue')

diff --git a/src/BlitzTab.vue b/src/BlitzTab.vue
new file mode 100644
index 0000000..5d711a2
--- /dev/null
+++ b/src/BlitzTab.vue
@@ -0,0 +1,48 @@
+<template>
+  <div>
+    <div class="tile is-ancestor">
+      <div class="tile is-parent">
+        <talent-box class="tile is-child is-warning notification"
+                    title="Overpowered!"
+                    :entry="topWin">
+          {{ Math.round(100 * topWin.Winner) }}% Win Rate
+        </talent-box>
+      </div>
+
+      <div class="tile is-parent">
+        <talent-box class="tile is-child is-success notification"
+                    title="Trending"
+                    :entry="topPick">
+          {{ (100 * 6 * topPick.Count / totalPicks).toFixed(2) }}% Pick Rate
+        </talent-box>
+      </div>
+    </div>
+
+    <h2 class="title is-2">Blitz Hero Statistics</h2>
+    <report-table :report="report" :totalPicks="totalPicks"></report-table>
+  </div>
+</template>
+
+<script>
+import Vue from 'vue';
+import ReportTable from './ReportTable.vue';
+import TalentBox from './TalentBox.vue';
+
+export default Vue.component('blitz-tab', {
+  props: [ 'reportService' ],
+  data: function() {
+    return {
+      report: this.reportService.getReport('blitz_pvp_ranked'),
+      topWin: this.reportService.getTopWin('blitz_pvp_ranked'),
+      topPick: this.reportService.getTopPick('blitz_pvp_ranked'),
+      totalPicks: this.reportService.getTotalPicks('blitz_pvp_ranked'),
+    };
+  },
+  computed: {
+  },
+  components: {
+    ReportTable,
+    TalentBox,
+  },
+});
+</script>
-- 
cgit v1.3.1