44 lines
1.2 KiB
Vue
44 lines
1.2 KiB
Vue
|
<template>
|
||
|
<div class="mx-auto w-full max-w-xl flex-col items-center">
|
||
|
<p class="mb-10 mt-52 text-sm sm:text-base">
|
||
|
Je bent momenteel niet verbonden met Minecraft. Om toegang te krijgen tot de Minecraft server moet je in Minecraft naar de
|
||
|
server met het ip <UBadge>play.polarcraft.xeovalyte.com</UBadge> gaan. Vervolgens krijg je een code
|
||
|
te zien, vul deze code hieronder in.
|
||
|
</p>
|
||
|
<div class="flex justify-center gap-x-3">
|
||
|
<UInput v-model="code" placeholder="6 digit code" class="" />
|
||
|
<UButton :disabled="disableButtons" @click="connectMinecraft">Submit</UButton>
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script lang="ts" setup>
|
||
|
const user = useState('user')
|
||
|
|
||
|
const code = ref('')
|
||
|
const disableButtons = ref(false)
|
||
|
|
||
|
const connectMinecraft = async () => {
|
||
|
disableButtons.value = true
|
||
|
|
||
|
try {
|
||
|
const response = await $fetch('/api/users/@me/minecraft', {
|
||
|
method: 'PUT',
|
||
|
body: {
|
||
|
code: code.value
|
||
|
}
|
||
|
})
|
||
|
|
||
|
user.value.minecraft = response
|
||
|
|
||
|
useToast().add({ title: 'Successfully connected Minecraft', color: 'green' })
|
||
|
} catch (e: any) {
|
||
|
console.error(e)
|
||
|
|
||
|
useToast().add({ title: e.statusMessage, color: 'red' })
|
||
|
}
|
||
|
|
||
|
disableButtons.value = false
|
||
|
}
|
||
|
</script>
|