forked from AkkomaGang/akkoma-fe
Merge branch 'dev_vald_fe/timeago_panel' into 'develop'
added activatePanel onclick for timeago button See merge request pleroma/pleroma-fe!407
This commit is contained in:
commit
f0fb6e6015
7 changed files with 16 additions and 13 deletions
|
@ -30,7 +30,7 @@
|
||||||
<instance-specific-panel v-if="showInstanceSpecificPanel"></instance-specific-panel>
|
<instance-specific-panel v-if="showInstanceSpecificPanel"></instance-specific-panel>
|
||||||
<features-panel v-if="!currentUser"></features-panel>
|
<features-panel v-if="!currentUser"></features-panel>
|
||||||
<who-to-follow-panel v-if="currentUser && suggestionsEnabled"></who-to-follow-panel>
|
<who-to-follow-panel v-if="currentUser && suggestionsEnabled"></who-to-follow-panel>
|
||||||
<notifications v-if="currentUser"></notifications>
|
<notifications :activatePanel="activatePanel" v-if="currentUser"></notifications>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -11,7 +11,8 @@ const Notification = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
props: [
|
props: [
|
||||||
'notification'
|
'notification',
|
||||||
|
'activatePanel'
|
||||||
],
|
],
|
||||||
components: {
|
components: {
|
||||||
Status, StillImage, UserCardContent
|
Status, StillImage, UserCardContent
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<status v-if="notification.type === 'mention'" :compact="true" :statusoid="notification.status"></status>
|
<status :activatePanel="activatePanel" v-if="notification.type === 'mention'" :compact="true" :statusoid="notification.status"></status>
|
||||||
<div class="non-mention" :class="[userClass, { highlighted: userStyle }]" :style="[ userStyle ]"v-else>
|
<div class="non-mention" :class="[userClass, { highlighted: userStyle }]" :style="[ userStyle ]"v-else>
|
||||||
<a class='avatar-container' :href="notification.action.user.statusnet_profile_url" @click.stop.prevent.capture="toggleUserExpanded">
|
<a class='avatar-container' :href="notification.action.user.statusnet_profile_url" @click.stop.prevent.capture="toggleUserExpanded">
|
||||||
<StillImage class='avatar-compact' :class="{'better-shadow': betterShadow}" :src="notification.action.user.profile_image_url_original"/>
|
<StillImage class='avatar-compact' :class="{'better-shadow': betterShadow}" :src="notification.action.user.profile_image_url_original"/>
|
||||||
|
@ -25,13 +25,13 @@
|
||||||
<small>{{$t('notifications.followed_you')}}</small>
|
<small>{{$t('notifications.followed_you')}}</small>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<small class="timeago"><router-link v-if="notification.status" :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
|
<small class="timeago"><router-link @click.native="activatePanel('timeline')" v-if="notification.status" :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
|
||||||
</span>
|
</span>
|
||||||
<div class="follow-text" v-if="notification.type === 'follow'">
|
<div class="follow-text" v-if="notification.type === 'follow'">
|
||||||
<router-link :to="{ name: 'user-profile', params: { id: notification.action.user.id } }">@{{notification.action.user.screen_name}}</router-link>
|
<router-link @click.native="activatePanel('timeline')" :to="{ name: 'user-profile', params: { id: notification.action.user.id } }">@{{notification.action.user.screen_name}}</router-link>
|
||||||
</div>
|
</div>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<status v-if="notification.status" class="faint" :compact="true" :statusoid="notification.status" :noHeading="true"></status>
|
<status :activatePanel="activatePanel" v-if="notification.status" class="faint" :compact="true" :statusoid="notification.status" :noHeading="true"></status>
|
||||||
<div class="broken-favorite" v-else>
|
<div class="broken-favorite" v-else>
|
||||||
{{$t('notifications.broken_favorite')}}
|
{{$t('notifications.broken_favorite')}}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -4,6 +4,7 @@ import notificationsFetcher from '../../services/notifications_fetcher/notificat
|
||||||
import { sortBy, filter } from 'lodash'
|
import { sortBy, filter } from 'lodash'
|
||||||
|
|
||||||
const Notifications = {
|
const Notifications = {
|
||||||
|
props: [ 'activatePanel' ],
|
||||||
created () {
|
created () {
|
||||||
const store = this.$store
|
const store = this.$store
|
||||||
const credentials = store.state.users.currentUser.credentials
|
const credentials = store.state.users.currentUser.credentials
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
<div v-for="notification in visibleNotifications" :key="notification.action.id" class="notification" :class='{"unseen": !notification.seen}'>
|
<div v-for="notification in visibleNotifications" :key="notification.action.id" class="notification" :class='{"unseen": !notification.seen}'>
|
||||||
<div class="notification-overlay"></div>
|
<div class="notification-overlay"></div>
|
||||||
<notification :notification="notification"></notification>
|
<notification :activatePanel="activatePanel" :notification="notification"></notification>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="panel-footer">
|
<div class="panel-footer">
|
||||||
|
|
|
@ -20,7 +20,8 @@ const Status = {
|
||||||
'replies',
|
'replies',
|
||||||
'noReplyLinks',
|
'noReplyLinks',
|
||||||
'noHeading',
|
'noHeading',
|
||||||
'inlineExpanded'
|
'inlineExpanded',
|
||||||
|
'activatePanel'
|
||||||
],
|
],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="status-el" v-if="!hideReply && !deleted" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
|
<div class="status-el" v-if="!hideReply && !deleted" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
|
||||||
<template v-if="muted && !noReplyLinks">
|
<template v-if="muted && !noReplyLinks">
|
||||||
<div class="media status container muted">
|
<div class="media status container muted">
|
||||||
<small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
|
<small><router-link @click.native="activatePanel('timeline')" :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
|
||||||
<small class="muteWords">{{muteWordHits.join(', ')}}</small>
|
<small class="muteWords">{{muteWordHits.join(', ')}}</small>
|
||||||
<a href="#" class="unmute" @click.prevent="toggleMute"><i class="icon-eye-off"></i></a>
|
<a href="#" class="unmute" @click.prevent="toggleMute"><i class="icon-eye-off"></i></a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -34,10 +34,10 @@
|
||||||
<h4 class="user-name" v-if="status.user.name_html" v-html="status.user.name_html"></h4>
|
<h4 class="user-name" v-if="status.user.name_html" v-html="status.user.name_html"></h4>
|
||||||
<h4 class="user-name" v-else>{{status.user.name}}</h4>
|
<h4 class="user-name" v-else>{{status.user.name}}</h4>
|
||||||
<span class="links">
|
<span class="links">
|
||||||
<router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link>
|
<router-link @click.native="activatePanel('timeline')" :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link>
|
||||||
<span v-if="status.in_reply_to_screen_name" class="faint reply-info">
|
<span v-if="status.in_reply_to_screen_name" class="faint reply-info">
|
||||||
<i class="icon-right-open"></i>
|
<i class="icon-right-open"></i>
|
||||||
<router-link :to="{ name: 'user-profile', params: { id: status.in_reply_to_user_id } }">
|
<router-link @click.native="activatePanel('timeline')" :to="{ name: 'user-profile', params: { id: status.in_reply_to_user_id } }">
|
||||||
{{status.in_reply_to_screen_name}}
|
{{status.in_reply_to_screen_name}}
|
||||||
</router-link>
|
</router-link>
|
||||||
</span>
|
</span>
|
||||||
|
@ -54,7 +54,7 @@
|
||||||
</h4>
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="media-heading-right">
|
<div class="media-heading-right">
|
||||||
<router-link class="timeago" :to="{ name: 'conversation', params: { id: status.id } }">
|
<router-link @click.native="activatePanel('timeline')" :to="{ name: 'conversation', params: { id: status.id } }">
|
||||||
<timeago :since="status.created_at" :auto-update="60"></timeago>
|
<timeago :since="status.created_at" :auto-update="60"></timeago>
|
||||||
</router-link>
|
</router-link>
|
||||||
<div class="visibility-icon" v-if="status.visibility">
|
<div class="visibility-icon" v-if="status.visibility">
|
||||||
|
@ -73,7 +73,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="showPreview" class="status-preview-container">
|
<div v-if="showPreview" class="status-preview-container">
|
||||||
<status class="status-preview" v-if="preview" :noReplyLinks="true" :statusoid="preview" :compact=true></status>
|
<status :activatePanel="activatePanel" class="status-preview" v-if="preview" :noReplyLinks="true" :statusoid="preview" :compact=true></status>
|
||||||
<div class="status-preview status-preview-loading" v-else>
|
<div class="status-preview status-preview-loading" v-else>
|
||||||
<i class="icon-spin4 animate-spin"></i>
|
<i class="icon-spin4 animate-spin"></i>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue