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

@@ -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;
}
}