kamilniemczycki/kamilcraft-cv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

- more api

Browse Source
This commit is contained in:
Kamil Niemczycki 2023-07-04 01:11:09 +02:00
parent 9f5613b647
commit e46bb38a53
Signed by: kamilniemczycki
GPG Key ID: 04D4E2012F969213
5 changed files with 95 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/Body.vue
View File

@ -10,7 +10,15 @@ const props = defineProps({
token: {
default: null,
type: [String, null],
}
},
rodo: {
default: null,
type: [String, null],
},
loading: {
required: true,
type: Boolean,
},
});
const qrCodeLink = computed(() => {
@ -27,14 +35,21 @@ const qrCodeLink = computed(() => {
<MajorAchivments />
<Education />
<div class="print:absolute bottom-5 left-0 w-full pt-3 print:pt-0 px-2 print:px-6 text-[.5rem] leading-3 l text-justify text-[#E57D4C]">
Wyrażam zgodę na przetwarzanie moich danych osobowych dla potrzeb
niezbędnych do realizacji procesu rekrutacji (zgodnie z ustawą z
dnia 10 maja 2018 roku o ochronie danych osobowych (Dz. Ustaw z 2018,
poz. 1000) oraz zgodnie z Rozporządzeniem Parlamentu
Europejskiego i Rady (UE) 2016/679 z dnia 27 kwietnia 2016 r. w sprawie
ochrony osób fizycznych w związku z przetwarzaniem danych
osobowych i w sprawie swobodnego przepływu takich danych oraz
uchylenia dyrektywy 95/46/WE (RODO)
<template v-if="!loading">
<template v-if="rodo">
{{ rodo }}
</template>
<template v-else>
Wyrażam zgodę na przetwarzanie moich danych osobowych dla potrzeb
niezbędnych do realizacji procesu rekrutacji (zgodnie z ustawą z
dnia 10 maja 2018 roku o ochronie danych osobowych (Dz. Ustaw z 2018,
poz. 1000) oraz zgodnie z Rozporządzeniem Parlamentu
Europejskiego i Rady (UE) 2016/679 z dnia 27 kwietnia 2016 r. w sprawie
ochrony osób fizycznych w związku z przetwarzaniem danych
osobowych i w sprawie swobodnego przepływu takich danych oraz
uchylenia dyrektywy 95/46/WE (RODO).
</template>
</template>
</div>
</div>
<div class="relative print:w-1/3 print:flex-shrink-1 md:w-1/3 md:flex-shrink-1 bg-[#fff0e9]">

24
src/components/ContactList.vue
View File

@ -27,30 +27,6 @@ const location = computed(() => {
});
</script>
<style lang="css">
.animated-bg {
animation-duration: 10s;
animation-fill-mode: forwards;
animation-iteration-count: infinite;
animation-name: placeHolderShimmer;
animation-timing-function: linear;
background-color: #f6f7f8;
background: linear-gradient(to right, #eeeeee 8%, #bbbbbb 18%, #eeeeee 33%);
position: relative;
width: 150px;
height: 20px;
}
@keyframes placeHolderShimmer {
0% {
background-position: -800px 0
}
100% {
background-position: 800px 0
}
}
</style>
<template>
<ul v-if="loading">
<li class="animated-bg"></li>

34
src/components/Header.vue
View File

@ -17,9 +17,39 @@ defineProps({
locations: {
type: Array,
},
position: {
type: [String, null],
},
mission: {
type: Array,
},
});
</script>
<style lang="css">
.animated-bg {
animation-duration: 10s;
animation-fill-mode: forwards;
animation-iteration-count: infinite;
animation-name: placeHolderShimmer;
animation-timing-function: linear;
background-color: #f6f7f8;
background: linear-gradient(to right, #eeeeee 8%, #bbbbbb 18%, #eeeeee 33%);
position: relative;
width: 150px;
height: 20px;
}
@keyframes placeHolderShimmer {
0% {
background-position: -800px 0
}
100% {
background-position: 800px 0
}
}
</style>
<template>
<div class="flex justify-between mx-1 mt-1 print:border-b-2 md:border-b-2">
<div class="flex-shrink-0 w-32 h-32">
@ -28,7 +58,7 @@ defineProps({
<div class="flex flex-col flex-shrink-1 justify-center gap-3 w-full px-4 py-3">
<div>
<h1 class="text-2xl pb-0.5">Kamil Niemczycki</h1>
<p>Inżynier oprogramowania</p>
<p>{{ position ?? 'Inżynier oprogramowania' }}</p>
</div>
<ContactList
:loading="loading"
@ -44,5 +74,5 @@ defineProps({
:tel="tel"
:locations="locations"
class="md:hidden print:hidden flex flex-col gap-2 px-5 py-3 border-b text-sm" />
<Mission />
<Mission :mission="mission" :loading="loading" />
</template>

21
src/components/Mission.vue
View File

@ -1,6 +1,25 @@
<script setup>
import { defineProps } from 'vue';
defineProps({
loading: {
type: Boolean,
},
mission: {
type: Array,
},
});
</script>
<template>
<div class="px-5 py-3 border-b text-justify text-slate-600">
<div v-if="loading" class="px-5 py-3 border-b">
<p v-for="key in [1, 2, 3]" :key="key" style="width:100%" class="mb-3 last-of-type:mb-0 animated-bg"></p>
</div>
<div v-else-if="mission.length === 0" class="px-5 py-3 border-b text-justify text-slate-600">
<p>Ambitny i nastawiony na cel, gotowy do podjęcia wyzwań absolwent informatyki, który szuka pierwszej pracy jako inżynier oprogramowania.</p>
<p>Wyróżnia mnie pracowitość i umiejętność pracy w zespole. Szybko zdobywam potrzebną mi wiedzę i potrafię ją dobrze wykorzystać. Przyjemność sprawia mi tworzenie web aplikacji. Jestem gotowy by rozwijać swoją wiedzę jak i karierę zawodową w tym kierunku.</p>
</div>
<div v-else class="px-5 py-3 border-b text-justify text-slate-600">
<p v-for="(line, key) in mission" :key="key">{{ line }}</p>
</div>
</template>

23
src/views/Home.vue
View File

@ -19,6 +19,10 @@ const locations = reactive([
'Remote',
]);
const position = ref(null);
const mission = reactive([]);
const rodo = ref(null);
onMounted(() => {
const router = useRoute();
token.value = router.params['token'] ?? null;
@ -48,14 +52,23 @@ function showData(response) {
const data = response.data;
email.value = data.email;
tel.hasPhoneNumber = true;
tel.phoneNumber = data.phoneNumber;
tel.formattedPhoneNumber = data.formattedPhoneNumber;
tel.phoneNumber = data.phone.number;
tel.formattedPhoneNumber = data.phone.formattedNumber;
while(locations.length > 0) {
locations.pop();
}
if (data.position) {
position.value = data.position;
}
data.locations?.forEach(value => {
locations.push(value);
});
data.mission?.forEach(value => {
mission.push(value);
});
if (data.rodo) {
rodo.value = data.rodo;
}
loading.value = false;
}
}
@ -66,7 +79,9 @@ function showData(response) {
<Header :loading="loading"
:email="email"
:tel="tel"
:locations="locations" />
<Body :token="token" />
:locations="locations"
:position="position"
:mission="mission" />
<Body :token="token" :rodo="rodo" :loading="loading" />
</div>
</template>