diff options
Diffstat (limited to 'pages')
-rw-r--r-- | pages/do-pobrania.vue (renamed from pages/download.vue) | 0 | ||||
-rw-r--r-- | pages/kronika/_year/_month/_day/_title/index.vue | 82 | ||||
-rw-r--r-- | pages/kronika/index.vue | 52 | ||||
-rw-r--r-- | pages/punktacja.vue | 53 |
4 files changed, 187 insertions, 0 deletions
diff --git a/pages/download.vue b/pages/do-pobrania.vue index dd6b507..dd6b507 100644 --- a/pages/download.vue +++ b/pages/do-pobrania.vue diff --git a/pages/kronika/_year/_month/_day/_title/index.vue b/pages/kronika/_year/_month/_day/_title/index.vue new file mode 100644 index 0000000..fa9a9ab --- /dev/null +++ b/pages/kronika/_year/_month/_day/_title/index.vue @@ -0,0 +1,82 @@ +<template> + <div> + <div v-if="notFound"> + <h1>404</h1> + <p>Nie znaleziono wpisu</p> + </div> + <div v-else class="article"> + <article class="content" v-html="content"></article> + </div> + </div> +</template> + +<script> +const md = require('markdown-it')() +import frontmatter from 'front-matter' +import k from '~/api' + +export default { + head() { + return { + meta: [ + { + hid: 'og:title', + property: 'og:title', + content: this.attributes.title + }, + { + hid: 'og:type', + property: 'og:type', + content: 'article' + }, + { + hid: 'og:article:author', + property: 'og:article:author', + content: this.attributes.author + } + ] + } + }, + async asyncData({ params }) { + const { year, month, day, title } = params + const post = k.getPost(year, month, day, title) + + if (post === undefined) return { notFound: true } + + return { + params, + attributes: post.content.meta, + content: post.content.html + } + }, + data() { + return { + notFound: false + } + } +} +</script> + +<style> +.article { + padding: 60px 80px; + width: 100%; + max-width: 1000px; + flex: 1; + background: #ffffff; + z-index: -1; + text-align: left; +} +.article img { + width: 100%; + border-radius: 5px; +} +@media (max-width: 720px) { + .article { + padding: 60px 20px; + } + .article p { + text-align: justify; + } +} +</style> \ No newline at end of file diff --git a/pages/kronika/index.vue b/pages/kronika/index.vue new file mode 100644 index 0000000..4a89a48 --- /dev/null +++ b/pages/kronika/index.vue @@ -0,0 +1,52 @@ +<template> + <div style="padding-top: 20px"> + <h2>Ostatnie wpisy</h2> + <div class="post-list"> + <chronicle-post + v-for="(post, index) in posts" + :key="index" + :route="post.route" + :title="post.content.meta.title" + :description="post.content.description" + /> + </div> + </div> +</template> + +<script> +import ChroniclePost from '~/components/ChroniclePost' +import k from '~/api' + +export default { + components: { + ChroniclePost + }, + async asyncData() { + return { + posts: k.getPosts() + } + }, + mounted() { + this.getPosts() + }, + methods: { + getPosts() { + if (this.posts.length < 1) { + this.$axios + .get(`${window.location.origin}/api/posts.json`) + .then(r => (this.posts = r.data)) + } + console.log(this.posts) + } + } +} +</script> + +<style scoped> +.post-list { + display: flex; + flex-wrap: wrap; + justify-content: center; + max-width: 900px; +} +</style> \ No newline at end of file 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> |