Fix useAsync

This commit is contained in:
2021-08-17 16:22:21 +02:00
parent adb052d1de
commit ea2a007c9a
17 changed files with 102 additions and 108 deletions

View File

@@ -1,5 +1,5 @@
<template>
<section v-if="info && info.age" class="w-full flex items-center justify-center my-12">
<section v-if="age" class="w-full flex items-center justify-center my-12">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-12 md:mb-0 w-full md:w-1/2 flex justify-center">
<img src="~/assets/images/memojies/Hat.png" alt="It's me !" class="xl:w-1/2" />
@@ -9,7 +9,7 @@
{{ $t('home.about.title') }}
</h2>
<p class="text-xl my-6 text-gray-700 dark:text-gray-400">
{{ $t('home.about.description', {age: info.age}) }}
{{ $t('home.about.description', {age: age}) }}
</p>
<div class="flex justify-center md:justify-start">
<Button content="home.about.about" link="about"/>
@@ -26,17 +26,22 @@ import {InfoData} from "~/types/types";
export default defineComponent({
name: "AboutHome",
setup() {
const {$content, $sentry} = useContext()
const info = useAsync(() => {
return $content('infos')
.fetch<InfoData>()
.catch((error) => {
$sentry.captureEvent(error)
});
const {$axios, $sentry} = useContext()
const age = useAsync(async () => {
const response = await $axios.get('/api/informations', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (response.status === 200) {
return response.data.informations.age
} else {
$sentry.captureEvent(response.data)
}
}, 'infos')
return {
info
age
}
}
})

View File

@@ -24,23 +24,22 @@ export default {
name: "Announcement",
setup() {
const {$axios, $sentry} = useContext()
const announce = ref<Announce>()
useAsync(async () => {
const announce = useAsync(async () => {
const response = await $axios.get('/api/announces', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (response.status === 200) {
announce.value = response.data.announce
return response.data.announce
} else {
$sentry.captureEvent(response.data)
}
})
}, 'announce')
const getBackgroundColor = computed(() => {
switch (announce.value!.color) {
switch (announce.value.color) {
case 'black': {
return 'bg-black text-white dark:(bg-white text-black)'
}
@@ -48,7 +47,7 @@ export default {
})
const getHoverColor = computed(() => {
switch (announce.value!.hover_color) {
switch (announce.value.hover_color) {
case 'gray': {
return 'hover:bg-gray-800 dark:hover:bg-gray-300'
}

View File

@@ -123,23 +123,19 @@ export default defineComponent({
const getDate = ref(new Date().getFullYear())
const hiring_message = ref("")
useAsync(async () => {
const hiring_message = useAsync(async () => {
const request = await $axios.get('/api/informations', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (request.status === 200) {
hiring_message.value = request.data.informations.translation.code
return request.data.informations.translation.code
} else {
app.error({statusCode: 500})
$sentry.captureEvent(request.data)
}
})
const store = useStore<State>()
const route = computed(() => store.state.route)
}, 'hiring_message')
return {
getDate,

View File

@@ -31,7 +31,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'formations')
return {
formations

View File

@@ -75,7 +75,7 @@ export default defineComponent({
window.removeEventListener('scroll', updateScroll)
})
const {i18n} = useContext()
const {i18n, } = useContext()
const $router = useRouter()
const changeLanguage = () => useAsync(() => {
i18n.setLocale(i18n.locale === 'fr' ? 'en' : 'fr')

View File

@@ -30,6 +30,10 @@ import {State} from "~/types/types";
const PAGE_TYPE = {
projects: 1,
services: 2,
env: 3,
about: 4,
guestbook: 5
}
export default defineComponent({

View File

@@ -31,7 +31,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'skills')
return {
skills

View File

@@ -16,6 +16,37 @@
<path d="M4 28l5.455 4l7.272-4L24 32l7.273-4l7.272 4L44 28" />
</g>
</svg>
<svg v-else-if="type === 2" class="inline" width="0.75em" height="2.5em" viewBox="0 0 3 16" focusable="false">
<path
fill-rule="evenodd"
d="M0 2.5a1.5 1.5 0 1 0 3 0a1.5 1.5 0 0 0-3 0zm0 5a1.5 1.5 0 1 0 3 0a1.5 1.5 0 0 0-3 0zM1.5 14a1.5 1.5 0 1 1 0-3a1.5 1.5 0 0 1 0 3z"
fill="currentColor" />
</svg>
<svg v-else-if="type === 3" class="inline" width="2.5em" height="2.5em" viewBox="0 0 24 24" focusable="false">
<g fill="none">
<path
d="M7 6a3 3 0 0 0-3 3h16a3 3 0 0 0-3-3H7z"
fill="currentColor" />
<path
d="M7 18a3 3 0 0 1-3-3h16a3 3 0 0 1-3 3H7z"
fill="currentColor" />
<path
d="M3 11a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3z"
fill="currentColor" />
</g>
</svg>
<svg v-else-if="type === 4" class="inline" width="2.5em" height="2.5em" viewBox="0 0 24 24" focusable="false">
<g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M7.05 11.293l4.243-4.243a2 2 0 0 1 2.828 0l2.829 2.83a2 2 0 0 1 0 2.828l-4.243 4.243a2 2 0 0 1-2.828 0L7.05 14.12a2 2 0 0 1 0-2.828z" />
<path d="M16.243 9.172l3.086-.772a1.5 1.5 0 0 0 .697-2.516L17.81 3.667a1.5 1.5 0 0 0-2.44.47L14.122 7.05" />
<path d="M9.172 16.243L8.4 19.329a1.5 1.5 0 0 1-2.516.697L3.667 17.81a1.5 1.5 0 0 1 .47-2.44l2.913-1.248" />
</g>
</svg>
<svg v-else-if="type === 5" class="inline" width="2.5em" height="2.5em" viewBox="0 0 20 20" focusable="false">
<path
d="M9.584 6.036c1.952 0 2.591-1.381 1.839-2.843c-.871-1.693 1.895-3.155.521-3.155c-1.301 0-3.736 1.418-4.19 3.183c-.339 1.324.296 2.815 1.83 2.815zm5.212 8.951l-.444-.383a1.355 1.355 0 0 0-1.735 0l-.442.382a3.326 3.326 0 0 1-2.174.801a3.325 3.325 0 0 1-2.173-.8l-.444-.384a1.353 1.353 0 0 0-1.734.001l-.444.383c-1.193 1.028-2.967 1.056-4.204.1V19a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-3.912c-1.237.954-3.011.929-4.206-.101zM10 7c-7.574 0-9 3.361-9 5v.469l1.164 1.003a1.355 1.355 0 0 0 1.735 0l.444-.383a3.353 3.353 0 0 1 4.345 0l.444.384c.484.417 1.245.42 1.735-.001l.442-.382a3.352 3.352 0 0 1 4.346-.001l.444.383c.487.421 1.25.417 1.735 0L19 12.469V12c0-1.639-1.426-5-9-5z"
fill="currentColor"/>
</svg>
</div>
</template>