Files
assets
images
js
components
blog
pages
projects
quotes
tabs
users
ProfileView.vue
UserCard.vue
AppLink.vue
HandleLogout.vue
LoginForm.vue
NotFound.vue
TheAbout.vue
TheFooter.vue
TheNavbar.vue
TheSidebar.vue
composables
router
stores
App.vue
index.js
styles
bin
config
migrations
public
src
templates
tools
translations
.env
.eslintrc
.gitignore
.php-cs-fixer.cache
.php-cs-fixer.php
LICENSE
README.md
TODO
bootstrap.js
composer.json
composer.lock
controllers.json
docker-compose.override.yml
docker-compose.yml
package.json
postcss.config.js
rector.php
symfony.lock
tailwind.config.js
webpack.config.js
yarn.lock
Spookie/assets/js/components/users/UserCard.vue
2022-05-11 14:48:04 +02:00

68 lines
1.1 KiB
Vue

<template>
<div
v-if="isLoading"
class="circle"
>
<i class="fa fa-spinner fa-spin fa-3x fa-fw"/>
<span class="sr-only">Loading </span>
</div>
<div
v-else
class="mt-1 mb-1"
>
<router-link
class="align-left blog-details"
:to="'/profile/' + author.username"
>
<img
class="article-author-img rounded-circle"
:src="'build/images/' + author.avatar"
alt="profile"
>
</router-link>
<router-link :to="'/profile/' + author.username">
{{ author.username }}
</router-link>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: 'UserCard',
props: {
authorIri: {
type: String,
required: true
}
},
data: () => ({
author: null,
isLoading: true
}),
mounted() {
this.getAuthor()
},
methods: {
getAuthor() {
console.log(`here${this.authorIri}`)
axios
.get(this.authorIri)
.then((response) => {
console.log('response')
console.log(response)
this.author = response.data
console.log(this.author)
this.isLoading = false
})
.catch((error) => {
console.log(error)
})
console.log(this.author)
}
}
}
</script>