53 lines
1.5 KiB
Vue
53 lines
1.5 KiB
Vue
<template lang="pug">
|
|
.notification
|
|
account(:account="notification.account" :showMedia="showMedia")
|
|
|
|
span.colored.text-icon.letter(v-if="notification.type == 'mention'") ✉
|
|
span.colored.text-icon.letter(v-if="notification.type == 'reblog'") ⟳
|
|
span.colored.text-icon.letter(v-if="notification.type == 'favourite'") ⚝
|
|
|
|
from-now.date(:date="notification.created_at" :now="now")
|
|
|
|
.content
|
|
template(v-if="notification.type == 'follow'") Vous suit
|
|
status.reblog(v-else-if="notification.status" :status="notification.status" :now="now"
|
|
:showMedia="showMedia" :withAccount="notification.type != 'mention'" @mark="passMark")
|
|
|
|
a.date(@click.stop.prevent="makeDismiss" style="margin-top: -1em") ❌
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Emit, Mixins, Prop } from 'vue-property-decorator'
|
|
|
|
import ShowMediaMixin from '../../components/ShowMediaMixin'
|
|
import FromNowVue from '../../components/time/FromNow.vue'
|
|
import TimedMixin from '../../components/time/TimedMixin'
|
|
import AccountVue from './Account.vue'
|
|
import StatusVue from './Status.vue'
|
|
import { MarkMessage, Notification as INotification } from './Types'
|
|
|
|
@Component({
|
|
components: {
|
|
fromNow: FromNowVue,
|
|
account: AccountVue,
|
|
status: StatusVue
|
|
}
|
|
})
|
|
export default class Notification extends Mixins(TimedMixin, ShowMediaMixin) {
|
|
|
|
@Prop(Object)
|
|
readonly notification!: INotification
|
|
|
|
@Emit('dismiss')
|
|
makeDismiss() {
|
|
return this.notification.id
|
|
}
|
|
|
|
@Emit('mark')
|
|
passMark(action: MarkMessage) {
|
|
return action
|
|
}
|
|
|
|
}
|
|
</script>
|