forked from AkkomaGang/akkoma-fe
updated FollowCard component
This commit is contained in:
parent
d2079ecef4
commit
60828f119c
4 changed files with 12 additions and 50 deletions
|
@ -1,6 +1,6 @@
|
||||||
import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
|
import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
|
||||||
export default {
|
export default {
|
||||||
props: ['user'],
|
props: ['user', 'labelFollowing', 'buttonClass'],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
inProgress: false
|
inProgress: false
|
||||||
|
@ -23,7 +23,7 @@ export default {
|
||||||
if (this.inProgress) {
|
if (this.inProgress) {
|
||||||
return this.$t('user_card.follow_progress')
|
return this.$t('user_card.follow_progress')
|
||||||
} else if (this.user.following) {
|
} else if (this.user.following) {
|
||||||
return this.$t('user_card.following')
|
return this.labelFollowing || this.$t('user_card.following')
|
||||||
} else if (this.user.requested) {
|
} else if (this.user.requested) {
|
||||||
return this.$t('user_card.follow_sent')
|
return this.$t('user_card.follow_sent')
|
||||||
} else {
|
} else {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<button
|
<button
|
||||||
class="btn btn-default follow-button"
|
class="btn btn-default follow-button"
|
||||||
:class="{ pressed: isPressed }"
|
:class="[buttonClass, { pressed: isPressed}]"
|
||||||
:disabled="inProgress"
|
:disabled="inProgress"
|
||||||
:title="title"
|
:title="title"
|
||||||
@click="onClick"
|
@click="onClick"
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
|
import BasicUserCard from '../basic_user_card/basic_user_card.vue'
|
||||||
import RemoteFollow from '../remote_follow/remote_follow.vue'
|
import RemoteFollow from '../remote_follow/remote_follow.vue'
|
||||||
import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
|
import FollowButton from '../follow_button/follow_button.vue'
|
||||||
|
|
||||||
const FollowCard = {
|
const FollowCard = {
|
||||||
props: [
|
props: [
|
||||||
|
@ -8,13 +8,12 @@ const FollowCard = {
|
||||||
'noFollowsYou'
|
'noFollowsYou'
|
||||||
],
|
],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return { }
|
||||||
inProgress: false
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
BasicUserCard,
|
BasicUserCard,
|
||||||
RemoteFollow
|
RemoteFollow,
|
||||||
|
FollowButton
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
isMe () {
|
isMe () {
|
||||||
|
@ -25,18 +24,6 @@ const FollowCard = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
followUser () {
|
|
||||||
this.inProgress = true
|
|
||||||
requestFollow(this.user, this.$store).then(() => {
|
|
||||||
this.inProgress = false
|
|
||||||
})
|
|
||||||
},
|
|
||||||
unfollowUser () {
|
|
||||||
this.inProgress = true
|
|
||||||
requestUnfollow(this.user, this.$store).then(() => {
|
|
||||||
this.inProgress = false
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -16,36 +16,11 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<button
|
<FollowButton
|
||||||
v-if="!user.following"
|
:user="user"
|
||||||
class="btn btn-default follow-card-follow-button"
|
button-class="follow-card-follow-button"
|
||||||
:disabled="inProgress"
|
:label-following="$t('user_card.follow_unfollow')"
|
||||||
:title="user.requested ? $t('user_card.follow_again') : ''"
|
/>
|
||||||
@click="followUser"
|
|
||||||
>
|
|
||||||
<template v-if="inProgress">
|
|
||||||
{{ $t('user_card.follow_progress') }}
|
|
||||||
</template>
|
|
||||||
<template v-else-if="user.requested">
|
|
||||||
{{ $t('user_card.follow_sent') }}
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
{{ $t('user_card.follow') }}
|
|
||||||
</template>
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
v-else
|
|
||||||
class="btn btn-default follow-card-follow-button pressed"
|
|
||||||
:disabled="inProgress"
|
|
||||||
@click="unfollowUser"
|
|
||||||
>
|
|
||||||
<template v-if="inProgress">
|
|
||||||
{{ $t('user_card.follow_progress') }}
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
{{ $t('user_card.follow_unfollow') }}
|
|
||||||
</template>
|
|
||||||
</button>
|
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</basic-user-card>
|
</basic-user-card>
|
||||||
|
|
Loading…
Reference in a new issue