working on economy graph

package.json

@@ -17,7 +17,7 @@
     "luxon": "^2.0.2",
     "string-sanitizer": "^2.0.2",
     "vue": "^3.2.19",
-    "vue-router": "^4.0.11",
+    "vue-router": "next",
     "vuex": "^4.0.2"
   },
   "devDependencies": {

src/components/EqValueGraph.vue

@@ -0,0 +1,108 @@
+<template>
+  <table v-if="data.rounds">
+    <thead>
+    <tr>
+      <th>p1</th>
+      <th>p2</th>
+    </tr>
+    </thead>
+    <tbody v-if="data.eq_teams">
+        <tr v-for="(round, i) in data.eq_teams[0][0]" :key="data.eq_teams[0][i]">
+          <td>{{i + ' - ' + round}}</td>
+        </tr>
+    </tbody>
+  </table>
+</template>
+
+<script>
+
+import {getPlayerValue} from "../utils";
+import {useStore} from "vuex";
+import {onMounted, reactive} from "vue";
+
+export default {
+  name: "EqValueGraph",
+  setup() {
+    const store = useStore()
+
+    const data = reactive({
+      rounds: {},
+      team: [],
+      eq_team_1: [],
+      eq_team_2: [],
+      eq_team_player_1: [],
+      eq_team_player_2: [],
+      eq_teams: []
+    })
+
+    const getTeamPlayer = (stats, team) => {
+      let arr = []
+      for (let i = (team - 1) * 5; i < team * 5; i++) {
+        arr.push(stats[i].player.steamid64)
+      }
+
+      return arr
+    }
+
+    const parseObject = async () => {
+      data.rounds = await getPlayerValue(store.state.matchDetails.match_id)
+
+      let eq_1 = []
+      let eq_2 = []
+
+      for (const round in data.rounds) {
+        for (const player in data.rounds[round]) {
+          for (let p in data.team[0]) {
+            if (data.team[0][p] === player) {
+              eq_1.push({
+                round: round,
+                player: player,
+                eq: (data.rounds[round][player][0] + data.rounds[round][player][2])
+              })
+            }
+          }
+          for (let p in data.team[1]) {
+            if (data.team[1][p] === player) {
+              eq_2.push({
+                round: round,
+                player: player,
+                eq: (data.rounds[round][player][0] + data.rounds[round][player][2])
+              })
+            }
+          }
+        }
+      }
+
+      data.eq_team_player_1.push(eq_1)
+      data.eq_team_player_2.push(eq_2)
+
+      data.eq_team_1.push(sumArr(eq_1))
+      data.eq_team_2.push(sumArr(eq_2))
+    }
+
+    const sumArr = (arr) => {
+      return arr.reduce((acc, current) => ({
+        ...acc,
+        [current.round]: (acc[current.round] || 0) + current.eq
+      }), {})
+    }
+
+    onMounted(() => {
+      data.team.push(getTeamPlayer(store.state.matchDetails.stats, 1))
+      data.team.push(getTeamPlayer(store.state.matchDetails.stats, 2))
+
+      parseObject()
+
+      data.eq_teams.push(data.eq_team_1, data.eq_team_2)
+
+      // console.log(data.eq_team)
+    })
+
+    return {data}
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/constants/index.js

@@ -9,3 +9,12 @@ export const HITGROUPS = {
   7: 'HitGroupRightLeg',
   10: 'HitGroupGear'
 }
+
+export const GRENADES = {
+  501: 'EqDecoy', // eqElementToName[EqDecoy] = "Decoy Grenade"
+  502: 'EqMolotov', // eqElementToName[EqMolotov] = "Molotov"
+  503: 'EqIncendiary', // eqElementToName[EqIncendiary] = "Incendiary Grenade"
+  504: 'EqFlash', // eqElementToName[EqFlash] = "Flashbang"
+  505: 'EqSmoke', // eqElementToName[EqSmoke] = "Smoke Grenade"
+  506: 'EqHE', // eqElementToName[EqHE] = "HE Grenade"
+}

src/router/index.js

@@ -46,6 +46,12 @@ const routes = [
           score: lazyLoadComponent('ScoreTeam')
         }
       },
+      {
+        path: 'Economy',
+        components: {
+          score: lazyLoadComponent('EqValueGraph')
+        }
+      },
       {
         path: 'details',
         components: {

src/utils/ApiRequests.js

@@ -54,3 +54,15 @@ export const TrackMe = async (id64, authcode, sharecode) => {
 
   return [status, statusError]
 }
+
+export const getPlayerValue = async (match_id) => {
+  try {
+    const res = await axios.get(`${API_URL}/match/${match_id}/rounds`)
+
+    if (res.status === 200) {
+      return res.data
+    }
+  } catch (err) {
+    console.log(err.response.status, err.response.statusText)
+  }
+}

src/utils/index.js

@@ -3,7 +3,7 @@ import {GoToLink, GoToMatch, GoToPlayer} from "./GoTo";
 import {SaveLastVisitedToLocalStorage} from "./LocalStorage";
 import {GetHLTV_1} from "./HLTV";
 import {DisplayRank, LoadImage} from "./Display";
-import {GetUser, TrackMe} from "./ApiRequests";
+import {GetUser, TrackMe, getPlayerValue} from "./ApiRequests";
 import {setTitle, GetWinLoss, truncate, checkStatEmpty, getPlayerArr, constructAvatarUrl, GetAvgRank} from "./Utils";
 
 export {
@@ -12,6 +12,6 @@ export {
   SaveLastVisitedToLocalStorage,
   GetHLTV_1,
   DisplayRank, LoadImage,
-  GetUser, TrackMe,
+  GetUser, TrackMe, getPlayerValue,
   setTitle, GetWinLoss, truncate, checkStatEmpty, getPlayerArr, constructAvatarUrl, GetAvgRank
 }

src/views/Match.vue

@@ -41,6 +41,13 @@
                        replace>Scoreboard
           </router-link>
         </li>
+        <li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
+            class="list-item nav-item">
+          <router-link :class="!data.matchDetails.parsed ? 'disabled' : ''" :disabled="!data.matchDetails.parsed"
+                       :to="'/match/' + data.matchDetails.match_id + '/economy'" class="nav-link"
+                       replace>Economy
+          </router-link>
+        </li>
         <li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
             class="list-item nav-item">
           <router-link :class="!data.matchDetails.parsed ? 'disabled' : ''" :disabled="!data.matchDetails.parsed"

yarn.lock

@@ -2011,7 +2011,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/devtools-api@npm:^6.0.0-beta.11, @vue/devtools-api@npm:^6.0.0-beta.14":
+"@vue/devtools-api@npm:^6.0.0-beta.11, @vue/devtools-api@npm:^6.0.0-beta.18":
   version: 6.0.0-beta.19
   resolution: "@vue/devtools-api@npm:6.0.0-beta.19"
   checksum: 2eecb7096540ed2777d16e9be21f81429cc8eeed8fcef14dc0481db3f213dad8e3534e099cf268bc91ffbc5a721b3e5252a3ae38a5cc9f67ab59ee24204e974c
@@ -4042,7 +4042,7 @@ __metadata:
     sass-loader: ^10.2.0
     string-sanitizer: ^2.0.2
     vue: ^3.2.19
-    vue-router: ^4.0.11
+    vue-router: next
     vuex: ^4.0.2
   languageName: unknown
   linkType: soft
@@ -11621,14 +11621,14 @@ fsevents@~2.3.2:
   languageName: node
   linkType: hard
 
-"vue-router@npm:^4.0.11":
+"vue-router@npm:next":
-  version: 4.0.11
+  version: 4.0.12
-  resolution: "vue-router@npm:4.0.11"
+  resolution: "vue-router@npm:4.0.12"
   dependencies:
-    "@vue/devtools-api": ^6.0.0-beta.14
+    "@vue/devtools-api": ^6.0.0-beta.18
   peerDependencies:
     vue: ^3.0.0
-  checksum: 0b78314daf240252744b7d9a66c2167ff0e7824be5c0f622439d5102b62e0f568e697d353f779c025c653e2fae393313357d30b7c703268640a00f8efe83f61e
+  checksum: 5ac66dffd956d088267ba45ec17e390de0aebb1ad08fc9431deb1397e265a003ae99b705fe7ca4ee610782de70aef129b4adf0a494171620d8153d794b2e5498
   languageName: node
   linkType: hard