124 lines
4.1 KiB
Vue
124 lines
4.1 KiB
Vue
<template>
|
|
<div class="activity-item">
|
|
<o-icon :icon="'chat'" :type="iconColor" />
|
|
<div class="subject">
|
|
<i18n-t :path="translation" tag="p">
|
|
<template #discussion v-if="activity.object">
|
|
<router-link
|
|
:to="{
|
|
name: RouteName.DISCUSSION,
|
|
params: { slug: subjectParams.discussion_slug },
|
|
}"
|
|
>{{ subjectParams.discussion_title }}</router-link
|
|
>
|
|
</template>
|
|
<template v-else #discussion>
|
|
<b>{{ subjectParams.discussion_title }}</b>
|
|
</template>
|
|
<template
|
|
v-if="activity.object && subjectParams.old_discussion_title"
|
|
#old_discussion
|
|
>
|
|
<router-link
|
|
:to="{
|
|
name: RouteName.DISCUSSION,
|
|
params: { slug: subjectParams.discussion_slug },
|
|
}"
|
|
>{{ subjectParams.old_discussion_title }}</router-link
|
|
>
|
|
</template>
|
|
<template
|
|
#old_discussion
|
|
v-else-if="subjectParams.old_discussion_title"
|
|
>
|
|
<b>{{ subjectParams.old_discussion_title }}</b>
|
|
</template>
|
|
<template #profile>
|
|
<popover-actor-card :actor="activity.author" :inline="true">
|
|
<b>
|
|
{{
|
|
$t("@{username}", {
|
|
username: usernameWithDomain(activity.author),
|
|
})
|
|
}}</b
|
|
></popover-actor-card
|
|
>
|
|
</template></i18n-t
|
|
>
|
|
<small class="has-text-grey-dark activity-date">{{
|
|
activity.insertedAt | formatTimeString
|
|
}}</small>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script lang="ts">
|
|
import { usernameWithDomain } from "@/types/actor";
|
|
import { ActivityDiscussionSubject } from "@/types/enums";
|
|
import { Options } from "vue-property-decorator";
|
|
import RouteName from "../../router/name";
|
|
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
|
import ActivityMixin from "../../mixins/activity";
|
|
import { mixins } from "vue-class-component";
|
|
|
|
@Options({
|
|
components: {
|
|
PopoverActorCard,
|
|
},
|
|
})
|
|
export default class DiscussionActivityItem extends mixins(ActivityMixin) {
|
|
usernameWithDomain = usernameWithDomain;
|
|
RouteName = RouteName;
|
|
ActivityDiscussionSubject = ActivityDiscussionSubject;
|
|
|
|
get translation(): string | undefined {
|
|
switch (this.activity.subject) {
|
|
case ActivityDiscussionSubject.DISCUSSION_CREATED:
|
|
if (this.isAuthorCurrentActor) {
|
|
return "You created the discussion {discussion}.";
|
|
}
|
|
return "{profile} created the discussion {discussion}.";
|
|
case ActivityDiscussionSubject.DISCUSSION_REPLIED:
|
|
if (this.isAuthorCurrentActor) {
|
|
return "You replied to the discussion {discussion}.";
|
|
}
|
|
return "{profile} replied to the discussion {discussion}.";
|
|
case ActivityDiscussionSubject.DISCUSSION_RENAMED:
|
|
if (this.isAuthorCurrentActor) {
|
|
return "You renamed the discussion from {old_discussion} to {discussion}.";
|
|
}
|
|
return "{profile} renamed the discussion from {old_discussion} to {discussion}.";
|
|
case ActivityDiscussionSubject.DISCUSSION_ARCHIVED:
|
|
if (this.isAuthorCurrentActor) {
|
|
return "You archived the discussion {discussion}.";
|
|
}
|
|
return "{profile} archived the discussion {discussion}.";
|
|
case ActivityDiscussionSubject.DISCUSSION_DELETED:
|
|
if (this.isAuthorCurrentActor) {
|
|
return "You deleted the discussion {discussion}.";
|
|
}
|
|
return "{profile} deleted the discussion {discussion}.";
|
|
default:
|
|
return undefined;
|
|
}
|
|
}
|
|
|
|
get iconColor(): string | undefined {
|
|
switch (this.activity.subject) {
|
|
case ActivityDiscussionSubject.DISCUSSION_CREATED:
|
|
case ActivityDiscussionSubject.DISCUSSION_REPLIED:
|
|
return "is-success";
|
|
case ActivityDiscussionSubject.DISCUSSION_RENAMED:
|
|
case ActivityDiscussionSubject.DISCUSSION_ARCHIVED:
|
|
return "is-grey";
|
|
case ActivityDiscussionSubject.DISCUSSION_DELETED:
|
|
return "is-danger";
|
|
default:
|
|
return undefined;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import "./activity.scss";
|
|
</style>
|