diff options
Diffstat (limited to 'pages')
-rw-r--r-- | pages/punktacja.vue | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/pages/punktacja.vue b/pages/punktacja.vue new file mode 100644 index 0000000..cefcdad --- /dev/null +++ b/pages/punktacja.vue @@ -0,0 +1,53 @@ +<template> + <div style="max-width: 900px"> + <h1>Punktacja</h1> + <ranking-list v-if="scores" :scores="scores" /> + <p v-else>Loading...</p> + <ranking-rules /> + </div> +</template> + +<script> +import RankingList from '~/components/Ranking/RankingList' +import RankingRules from '~/components/Ranking/RankingRules' + +const FAUNA_KEY = 'fnADeP_U0uACC4Hruw9JvjexNsvB-V-QjI3wr8yH' +const b64encodedSecret = Buffer.from(FAUNA_KEY + ':').toString('base64') +const query = ` +{ + getPoints{data {points troop{name}}} +}` +const URL = 'https://graphql.fauna.com/graphql' +const FETCH_OPTIONS = { + method: 'POST', + headers: { + Authorization: `Basic ${b64encodedSecret}` + }, + body: JSON.stringify({ query }) +} + +export default { + components: { + RankingList, + RankingRules + }, + data() { + return { + scores: undefined + } + }, + mounted() { + this.getScores() + }, + methods: { + async getScores() { + const r = await fetch(URL, FETCH_OPTIONS) + const { data } = await r.json() + this.scores = data.getPoints.data.map(({ points, troop }) => ({ + troop: troop.name, + points + })) + } + } +} +</script> |