Add favorite-button.
This commit is contained in:
parent
b96b5eb327
commit
8630f91a13
7 changed files with 85 additions and 11 deletions
22
src/components/favorite_button/favorite_button.js
Normal file
22
src/components/favorite_button/favorite_button.js
Normal file
|
@ -0,0 +1,22 @@
|
|||
const FavoriteButton = {
|
||||
props: [ 'status' ],
|
||||
methods: {
|
||||
favorite () {
|
||||
if (!this.status.favorited) {
|
||||
this.$store.dispatch('favorite', { id: this.status.id})
|
||||
} else {
|
||||
this.$store.dispatch('unfavorite', { id: this.status.id})
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
classes () {
|
||||
return {
|
||||
'icon-star-empty': !this.status.favorited,
|
||||
'icon-star': this.status.favorited
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default FavoriteButton
|
14
src/components/favorite_button/favorite_button.vue
Normal file
14
src/components/favorite_button/favorite_button.vue
Normal file
|
@ -0,0 +1,14 @@
|
|||
<template>
|
||||
<div>
|
||||
<i :class='classes' class='favorite-button fa' v-on:click.prevent='favorite()'></i>
|
||||
<span v-if='status.fave_num > 0'>{{status.fave_num}}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script src="./favorite_button.js" ></script>
|
||||
|
||||
<style>
|
||||
.favorite-button {
|
||||
cursor: pointer
|
||||
}
|
||||
</style>
|
|
@ -1,4 +1,5 @@
|
|||
import Attachment from '../attachment/attachment.vue'
|
||||
import FavoriteButton from '../favorite_button/favorite_button.vue'
|
||||
|
||||
const Status = {
|
||||
props: [ 'statusoid' ],
|
||||
|
@ -14,9 +15,9 @@ const Status = {
|
|||
}
|
||||
},
|
||||
components: {
|
||||
Attachment
|
||||
Attachment,
|
||||
FavoriteButton
|
||||
}
|
||||
}
|
||||
|
||||
export default Status
|
||||
|
||||
|
|
|
@ -23,7 +23,9 @@
|
|||
<small>{{status.created_at_parsed}}</small>
|
||||
</h4>
|
||||
|
||||
<div v-html="status.statusnet_html"></div>
|
||||
<p>
|
||||
<div v-html="status.statusnet_html"></div>
|
||||
</p>
|
||||
|
||||
<div v-if='status.attachments' class='attachments'>
|
||||
<attachment :status-id="status.id" :nsfw="status.nsfw" :attachment="attachment" v-for="attachment in status.attachments">
|
||||
|
@ -33,12 +35,12 @@
|
|||
<div>
|
||||
<div class='status-actions'>
|
||||
<div ng-click="toggleReplying()">
|
||||
<i class='fa fa-reply'></i>
|
||||
<i class='fa icon-reply'></i>
|
||||
</div>
|
||||
<div>
|
||||
<i class='fa fa-retweet'></i>
|
||||
<i class='fa icon-retweet'></i>
|
||||
</div>
|
||||
<favorite-button status=status></favorite-button>
|
||||
<favorite-button :status=status></favorite-button>
|
||||
</div>
|
||||
|
||||
<!-- <post-status-form ng-if="replying" toggle="toggleReplying" reply-to-status="status" reply-to="{{status.id}}"></post-status-form> -->
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue