Adjust page style
This commit is contained in:
parent
9f4da44b59
commit
f5d5d26b0e
3 changed files with 52 additions and 64 deletions
|
@ -3,7 +3,26 @@
|
|||
<portal to="avatar" v-if="page"><mk-avatar class="avatar" :user="page.user" :disable-preview="true"/></portal>
|
||||
<portal to="title" v-if="page">{{ page.title || page.name }}</portal>
|
||||
|
||||
<x-page v-if="page" :page="page" :key="page.id" :show-footer="true"/>
|
||||
<div class="_section" v-if="page" :key="page.id">
|
||||
<div class="_title">{{ page.title }}</div>
|
||||
<div class="_content">
|
||||
<x-page :page="page"/>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<small>@{{ page.user.username }}</small>
|
||||
<template v-if="$store.getters.isSignedIn && $store.state.i.id === page.userId">
|
||||
<router-link :to="`/my/pages/edit/${page.id}`">{{ $t('edit-this-page') }}</router-link>
|
||||
<a v-if="$store.state.i.pinnedPageId === page.id" @click="pin(false)">{{ $t('unpin-this-page') }}</a>
|
||||
<a v-else @click="pin(true)">{{ $t('pin-this-page') }}</a>
|
||||
</template>
|
||||
<router-link :to="`./${page.name}/view-source`">{{ $t('view-source') }}</router-link>
|
||||
<div class="like">
|
||||
<button @click="unlike()" v-if="page.isLiked" :title="$t('unlike')"><fa :icon="faHeartS"/></button>
|
||||
<button @click="like()" v-else :title="$t('like')"><fa :icon="faHeart"/></button>
|
||||
<span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -58,6 +77,35 @@ export default Vue.extend({
|
|||
this.page = page;
|
||||
});
|
||||
},
|
||||
|
||||
like() {
|
||||
this.$root.api('pages/like', {
|
||||
pageId: this.page.id,
|
||||
}).then(() => {
|
||||
this.page.isLiked = true;
|
||||
this.page.likedCount++;
|
||||
});
|
||||
},
|
||||
|
||||
unlike() {
|
||||
this.$root.api('pages/unlike', {
|
||||
pageId: this.page.id,
|
||||
}).then(() => {
|
||||
this.page.isLiked = false;
|
||||
this.page.likedCount--;
|
||||
});
|
||||
},
|
||||
|
||||
pin(pin) {
|
||||
this.$root.api('i/update', {
|
||||
pinnedPageId: pin ? this.page.id : null,
|
||||
}).then(() => {
|
||||
this.$root.dialog({
|
||||
type: 'success',
|
||||
splash: true
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue