diff --git a/src/views/Match.vue b/src/views/Match.vue
index f362da8..c3d86cd 100644
--- a/src/views/Match.vue
+++ b/src/views/Match.vue
@@ -5,11 +5,18 @@
-
{{ data.score[0] }}
+
{{ data.score[0] }}
+
+
![]()
+
-
{{ data.score[1] }}
+
{{ data.score[1] }}
+
+
![]()
+
@@ -74,6 +88,7 @@
+
+
@@ -128,7 +144,8 @@ import {onBeforeMount, onBeforeUnmount, onMounted, reactive, watch} from "vue";
import {
closeNav,
CreatePlayersArray,
- DisplayRank, errorHandling,
+ DisplayRank,
+ errorHandling,
FixMapName,
FormatDuration,
FormatFullDate,
@@ -136,7 +153,7 @@ import {
GoToLink,
LoadImage,
ProcessName
-} from "../utils";
+} from "@/utils";
import {useStore} from "vuex";
import {useRoute} from 'vue-router'
import {DateTime} from "luxon/build/es6/luxon";
@@ -157,6 +174,8 @@ export default {
matchDetails: {},
stats: [],
score: [0],
+ team1Avg: 0,
+ team2Avg: 0
})
// Functions
@@ -183,6 +202,8 @@ export default {
data.stats = data.matchDetails.stats
data.score = data.matchDetails.score
+ data.team1Avg = getTeamAvgRank(1).reduce((a, b) => a + b) / 5
+ data.team2Avg = getTeamAvgRank(2).reduce((a, b) => a + b) / 5
LoadImage(data.matchDetails.map ? data.matchDetails.map : 'random')
@@ -234,6 +255,14 @@ export default {
}
}
+ const getTeamAvgRank = (team) => {
+ let arr = []
+ for (let i = (team - 1) * 5; i < team * 5; i++) {
+ arr.push(data.matchDetails.stats[i].rank.old)
+ }
+ return arr
+ }
+
const handleDownloadMenu = () => {
const downloadGroup = document.getElementById('downloadGroup')
const menuBtn = document.getElementById('downloadMenuBtn')
@@ -291,7 +320,7 @@ export default {
})
return {
- data, DisplayRank, FormatFullDate, FormatDuration, FixMapName, route, checkWin, handleDownloadMenu
+ data, DisplayRank, FormatFullDate, FormatDuration, FixMapName, route, checkWin, handleDownloadMenu, getTeamAvgRank
}
}
}
@@ -329,17 +358,24 @@ export default {
.score-team-1,
.score-team-2 {
position: absolute;
- top: 3.5rem;
+ top: 2rem;
h1 {
+ margin: 0 auto .5rem;
font-size: 4rem;
}
+ .team-avg-rank {
+ margin: 3.5rem auto 0;
+
+ .team-avg-rank-icon {
+ width: 60px;
+ }
+ }
+
.team-1,
.team-2 {
position: relative;
- right: 30%;
-
color: white;
font-size: 1rem;
opacity: .8;
@@ -359,6 +395,14 @@ export default {
}
}
}
+
+ .team-1 {
+ right: 1.4rem;
+ }
+
+ .team-2 {
+ left: -1.5rem;
+ }
}
.score-team-1 {
@@ -459,10 +503,29 @@ export default {
@media (max-width: 991px) {
.score-team-1,
.score-team-2 {
- top: 2rem !important;
+ top: 1rem !important;
h1 {
- font-size: 3.5rem !important;
+ font-size: 2.8rem !important;
+ margin-bottom: 0 !important;
+ }
+
+ .team-avg-rank {
+ margin: 2rem auto 0 !important;
+
+ .team-avg-rank-icon {
+ width: 50px !important;
+ }
+ }
+
+ .team-1, .team-2 {
+ img {
+ width: 25px !important;
+ height: 25px !important;
+ }
+ }
+ .team-2 {
+ left: -1.3rem !important;
}
}