fixed broken elements due to api changes

This commit is contained in:
cnachtigall1991
2021-10-17 19:52:12 +02:00
parent 123f78cb21
commit 6310295795
10 changed files with 228 additions and 69 deletions

View File

@@ -35,39 +35,38 @@
</button>
<div id="matchNav" class="collapse navbar-collapse">
<ul class="list-unstyled d-flex m-auto">
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
<li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/overview'" replace
class="nav-link">Scoreboard
<router-link :to="'/match/' + data.matchDetails.match_id + '/overview'" class="nav-link"
replace>Scoreboard
</router-link>
</li>
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
<li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/details'" replace
class="nav-link">Details
<router-link :class="!data.matchDetails.parsed ? 'disabled' : ''" :disabled="!data.matchDetails.parsed"
:to="'/match/' + data.matchDetails.match_id + '/details'" class="nav-link"
replace>Details
</router-link>
</li>
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
<li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/flashes'" replace
class="nav-link">Flashes
<router-link :class="!data.matchDetails.parsed ? 'disabled' : ''" :disabled="!data.matchDetails.parsed"
:to="'/match/' + data.matchDetails.match_id + '/flashes'" class="nav-link"
replace>Flashes
</router-link>
</li>
<!-- <li :class="!data.matchDetails.parsed ? 'disabled' : ''"-->
<!-- :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"-->
<!-- class="list-item nav-item">-->
<!-- <router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/utility'" replace-->
<!-- <router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/utility'" replace :class="!data.matchDetails.parsed ? 'disabled' : ''"-->
<!-- class="nav-link">Utility-->
<!-- </router-link>-->
<!-- </li>-->
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
<li :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/damage'" replace
class="nav-link">Damage
<router-link :class="!data.matchDetails.parsed ? 'disabled' : ''" :disabled="!data.matchDetails.parsed"
:to="'/match/' + data.matchDetails.match_id + '/damage'" class="nav-link"
replace>Damage
</router-link>
</li>
</ul>
@@ -121,7 +120,7 @@ export default {
LoadImage(data.matchDetails.map ? data.matchDetails.map : 'random')
GetAvgRank(data.stats)
data.avgRank = GetAvgRank(data.stats)
console.log(data.matchDetails)
})
@@ -239,7 +238,7 @@ export default {
color: #585858;
&:hover {
background: transparent;
background: lime;
cursor: default;
}
}
@@ -251,7 +250,6 @@ export default {
flex-wrap: wrap;
padding-left: 70px;
z-index: 1;
height: 100%;
width: 100%;
@@ -266,6 +264,7 @@ export default {
@media screen and (max-width: 991px) {
#scoreWrapper {
justify-content: flex-start;
overflow-x: scroll;
overflow-y: hidden;
}

View File

@@ -6,16 +6,11 @@
<div class="row g-0">
<div class="img-container col-md-2 pt-3">
<img
:class="data.tracked ? 'tracked' : ''" :src="store.state.playerDetails.avatar"
:class="data.tracked ? 'tracked' : ''"
:src="constructAvatarUrl(store.state.playerDetails.avatar, 'full')"
:title="data.tracked ? 'Tracked' : ''"
alt="Player avatar"
class="img-fluid avatar">
<!-- <img-->
<!-- :class="data.tracked ? 'tracked' : ''"-->
<!-- :src="constructAvatarUrl(store.state.playerDetails.avatar, 'full')"-->
<!-- :title="data.tracked ? 'Tracked' : ''"-->
<!-- alt="Player avatar"-->
<!-- class="img-fluid avatar">-->
</div>
<div class="col-md-8 d-flex">
<div class="card-body">
@@ -41,11 +36,11 @@
<td class="wlt-loss">{{ data.match_stats.loss }}</td>
<td class="wlt-tie">{{ data.match_stats.tie }}</td>
<td class="wlt-win-rate">{{
(data.match_stats.win / (data.match_stats.win + data.match_stats.loss + data.match_stats.tie) * 100).toFixed(0)
data.match_stats.win && data.match_stats.loss && data.match_stats.tie ? (data.match_stats.win / (data.match_stats.win + data.match_stats.loss + data.match_stats.tie) * 100).toFixed(0) : 0
}}%
</td>
<td class="wlt-tie-rate">{{
(data.match_stats.tie / (data.match_stats.win + data.match_stats.loss + data.match_stats.tie) * 100).toFixed(0)
data.match_stats.win && data.match_stats.loss && data.match_stats.tie ? (data.match_stats.tie / (data.match_stats.win + data.match_stats.loss + data.match_stats.tie) * 100).toFixed(0) : 0
}}%
</td>
</tr>
@@ -108,7 +103,7 @@
</div>
<div class="match-container">
<div class="matches">
<table v-if="data.matches" class="table table-borderless">
<table v-if="store.state.playerDetails.matches" class="table table-borderless">
<thead class="border-bottom">
<tr>
<th class="text-center map" scope="col">Map</th>
@@ -203,7 +198,7 @@
</table>
<h5 v-else>No matches on record</h5>
</div>
<div class="side-info">
<div v-if="store.state.playerDetails.matches" class="side-info">
<div class="side-info-box best-mate">
<div class="heading">
<h5>Best Mate</h5>
@@ -254,6 +249,7 @@
import {onBeforeUnmount, onMounted, reactive, watch} from "vue";
import {useStore} from "vuex";
import {
constructAvatarUrl,
DisplayRank,
FormatDate,
FormatDuration,
@@ -295,10 +291,13 @@ export default {
const SetPlayerData = () => {
data.tracked = store.state.playerDetails.tracked
data.matches = store.state.playerDetails.matches
data.match_stats.loss = store.state.playerDetails.match_stats.loss || 0
data.match_stats.win = store.state.playerDetails.match_stats.win || 0
data.match_stats.tie = store.state.playerDetails.match_stats.tie || 0
if (store.state.playerDetails.matches)
data.matches = store.state.playerDetails.matches
if (store.state.playerDetails.match_stats) {
data.match_stats.loss = store.state.playerDetails.match_stats.loss || 0
data.match_stats.win = store.state.playerDetails.match_stats.win || 0
data.match_stats.tie = store.state.playerDetails.match_stats.tie || 0
}
store.commit({
type: 'changeId64',
@@ -309,15 +308,14 @@ export default {
id: store.state.playerDetails.vanity_url || ''
})
if (data.matches)
if (store.state.playerDetails.matches)
LoadImage(data.matches[0].map ? data.matches[0].map : 'random')
let player = {
'steamid64': store.state.playerDetails.steamid64,
'vanity_url': store.state.playerDetails.vanity_url || '',
'name': store.state.playerDetails.name,
'avatar': store.state.playerDetails.avatar
// 'avatar': constructAvatarUrl(store.state.playerDetails.avatar, 'medium')
'avatar': constructAvatarUrl(store.state.playerDetails.avatar, 'medium')
}
SaveLastVisitedToLocalStorage(player)
@@ -371,6 +369,7 @@ export default {
if (Object.entries(store.state.playerDetails).length === 0) {
GetPlayer()
} else {
console.log(store.state.playerDetails)
SetPlayerData()
}
}, 200)
@@ -397,7 +396,8 @@ export default {
FormatFullDuration,
GoToMatch,
GetHLTV_1,
DisplayRank
DisplayRank,
constructAvatarUrl
}
}
}
@@ -604,9 +604,10 @@ table {
width: 120px;
}
.td-date svg {
margin-left: -5px;
margin-right: 5px;
.td-date, .date {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}