mock and truncate

This commit is contained in:
Grzegorz Leoniec 2018-10-16 11:18:54 +02:00
parent 14b9f3d3dc
commit 4df66b219f
2 changed files with 21 additions and 8 deletions

View File

@ -14,16 +14,17 @@
style="position: absolute; bottom: 44px;"> style="position: absolute; bottom: 44px;">
<hc-author <hc-author
:post="post" :post="post"
:trunc="35"
:show-author-popover="showAuthorPopover" /> :show-author-popover="showAuthorPopover" />
</ds-space> </ds-space>
<template slot="footer"> <template slot="footer">
<span :style="{ opacity: post.commentsCount ? 1 : .5 }">
<ds-icon name="comments" /> <small>{{ post.commentsCount }}</small>
</span>
&nbsp;
<span :style="{ opacity: post.shoutedCount ? 1 : .5 }"> <span :style="{ opacity: post.shoutedCount ? 1 : .5 }">
<ds-icon name="heart-o" /> <small>{{ post.shoutedCount }}</small> <ds-icon name="heart-o" /> <small>{{ post.shoutedCount }}</small>
</span> </span>
&nbsp;
<span :style="{ opacity: post.commentsCount ? 1 : .5 }">
<ds-icon name="comments" /> <small>{{ post.commentsCount }}</small>
</span>
</template> </template>
</ds-card> </ds-card>
</a> </a>

View File

@ -22,7 +22,7 @@
<ds-flex-item style="text-align: center;"> <ds-flex-item style="text-align: center;">
<ds-text <ds-text
size="x-large" size="x-large"
style="margin-bottom: 0;">{{ user.followedByCount }}</ds-text> style="margin-bottom: 0;">{{ fanCount }}</ds-text>
<ds-text size="small">Fans</ds-text> <ds-text size="small">Fans</ds-text>
</ds-flex-item> </ds-flex-item>
<ds-flex-item style="text-align: center;"> <ds-flex-item style="text-align: center;">
@ -36,18 +36,21 @@
margin="small"> margin="small">
<hc-follow-button <hc-follow-button
:follow-id="user.id" :follow-id="user.id"
@update="fetchUser" /> @update="voted = true && fetchUser" />
</ds-space> </ds-space>
</ds-card> </ds-card>
<ds-space/> <ds-space/>
<h2 style="text-align: center; margin-bottom: 10px;">Netzwerk</h2> <h2 style="text-align: center; margin-bottom: 10px;">Netzwerk</h2>
<ds-card style="position: relative; height: auto;"> <ds-card style="position: relative; height: auto;">
<p>Folgt:</p>
<template v-if="user.following.length"> <template v-if="user.following.length">
<ds-space <ds-space
v-for="follow in user.following" v-for="follow in user.following"
:key="follow.id" :key="follow.id"
margin="x-small"> margin="x-small">
<hc-related-user :post="follow" /> <hc-related-user
:post="follow"
:trunc="15" />
</ds-space> </ds-space>
</template> </template>
<template v-else> <template v-else>
@ -129,10 +132,19 @@ export default {
data() { data() {
return { return {
User: [] User: [],
voted: false
} }
}, },
computed: { computed: {
fanCount() {
let count = Number(this.user.followedByCount) || 0
if (this.voted) {
// NOTE: this is used for presentation
count += 1
}
return count
},
user() { user() {
return this.User ? this.User[0] : {} return this.User ? this.User[0] : {}
} }