forked from CSGOWTF/csgowtf
119 lines
3.0 KiB
Vue
119 lines
3.0 KiB
Vue
<template>
|
|
<div class="scoreboard" :class="'team-' + props.team_id">
|
|
<table>
|
|
<caption :class="props.score === 16 ? 'text-success' : props.score === 15 ? 'text-warning' : 'text-danger'">{{props.score}}</caption>
|
|
<thead>
|
|
<tr>
|
|
<th class="player__avatar"></th>
|
|
<th class="player__name"></th>
|
|
<th class="player__rank"></th>
|
|
<th class="player__kills">K</th>
|
|
<th class="player__assist">A</th>
|
|
<th class="player__deaths">D</th>
|
|
<th class="player__diff cursor__help" title="Kill death difference">+/-</th>
|
|
<th class="player__kd">K/D</th>
|
|
<th class="player__adr cursor__help" title="Average damage per round">ADR</th>
|
|
<th class="player__hs cursor__help" title="Percentage of kills with a headshot">HS%</th>
|
|
<th class="player__rating cursor__help" title="Estimated HLTV Rating 1.0">Rating</th>
|
|
<th class="player__mvp cursor__help" title="Most valuable player">MVP</th>
|
|
<th class="player__score">Score</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody v-for="player in props.stats" :key="player.player.steamid64">
|
|
<tr v-if="player.team_id === props.team_id" class="player">
|
|
<ScoreTeamPlayer
|
|
:steamid64="player.player.steamid64"
|
|
:assists="player.assists"
|
|
:avatar="player.player.avatar"
|
|
:deaths="player.deaths"
|
|
:dmg="player.extended?.dmg?.enemy"
|
|
:hs="player.headshot"
|
|
:kdiff="player.kills - player.deaths"
|
|
:kills="player.kills"
|
|
:mk_duo="player.extended?.multi_kills?.duo"
|
|
:mk_pent="player.extended?.multi_kills?.pent"
|
|
:mk_quad="player.extended?.multi_kills?.quad"
|
|
:mk_triple="player.extended?.multi_kills?.triple"
|
|
:mvp="player.mvp"
|
|
:name="player.player.name"
|
|
:player_score="player.score"
|
|
:rank="player.extended?.rank?.old"
|
|
:rounds_played="props.rounds_played"
|
|
/>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<hr v-if="props.team_id === 1">
|
|
</template>
|
|
|
|
<script>
|
|
import ScoreTeamPlayer from '@/components/ScoreTeamPlayer.vue'
|
|
|
|
export default {
|
|
name: 'ScoreTeam',
|
|
components: {ScoreTeamPlayer},
|
|
props: {
|
|
stats: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
rounds_played: {
|
|
type: Number,
|
|
required: true,
|
|
default: 0
|
|
},
|
|
team_id: {
|
|
type: Number,
|
|
required: true,
|
|
default: 1
|
|
},
|
|
score: {
|
|
type: Number,
|
|
required: true,
|
|
default: 0
|
|
}
|
|
},
|
|
setup(props) {
|
|
return {props}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.scoreboard {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
hr {
|
|
width: 900px;
|
|
}
|
|
|
|
table {
|
|
width: 900px;
|
|
text-align: center;
|
|
margin-top: 120px;
|
|
margin-bottom: -100px;
|
|
|
|
caption {
|
|
color: white;
|
|
font-size: 3rem;
|
|
caption-side: top;
|
|
padding: 0;
|
|
margin-left: -70px;
|
|
margin-bottom: -178px;
|
|
}
|
|
|
|
tr {
|
|
height: 40px;
|
|
}
|
|
|
|
td {
|
|
padding: 5px 10px;
|
|
}
|
|
|
|
.cursor__help {
|
|
cursor: help;
|
|
}
|
|
}
|
|
</style> |