aboutsummaryrefslogtreecommitdiff
path: root/src/components/announcement/announcement.js
blob: 30254926a96ef90b60eb9ef303b5051aeec32c78 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
import { mapState } from 'vuex'
import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
import RichContent from '../rich_content/rich_content.jsx'
import localeService from '../../services/locale/locale.service.js'

const Announcement = {
  components: {
    AnnouncementEditor,
    RichContent
  },
  data () {
    return {
      editing: false,
      editedAnnouncement: {
        content: '',
        startsAt: undefined,
        endsAt: undefined,
        allDay: undefined
      },
      editError: ''
    }
  },
  props: {
    announcement: Object
  },
  computed: {
    ...mapState({
      currentUser: state => state.users.currentUser
    }),
    canEditAnnouncement () {
      return this.currentUser && this.currentUser.privileges.includes('announcements_manage_announcements')
    },
    content () {
      return this.announcement.content
    },
    isRead () {
      return this.announcement.read
    },
    publishedAt () {
      const time = this.announcement.published_at
      if (!time) {
        return
      }

      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
    },
    startsAt () {
      const time = this.announcement.starts_at
      if (!time) {
        return
      }

      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
    },
    endsAt () {
      const time = this.announcement.ends_at
      if (!time) {
        return
      }

      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
    },
    inactive () {
      return this.announcement.inactive
    }
  },
  methods: {
    markAsRead () {
      if (!this.isRead) {
        return this.$store.dispatch('markAnnouncementAsRead', this.announcement.id)
      }
    },
    deleteAnnouncement () {
      return this.$store.dispatch('deleteAnnouncement', this.announcement.id)
    },
    formatTimeOrDate (time, locale) {
      const d = new Date(time)
      return this.announcement.all_day ? d.toLocaleDateString(locale) : d.toLocaleString(locale)
    },
    enterEditMode () {
      this.editedAnnouncement.content = this.announcement.pleroma.raw_content
      this.editedAnnouncement.startsAt = this.announcement.starts_at
      this.editedAnnouncement.endsAt = this.announcement.ends_at
      this.editedAnnouncement.allDay = this.announcement.all_day
      this.editing = true
    },
    submitEdit () {
      this.$store.dispatch('editAnnouncement', {
        id: this.announcement.id,
        ...this.editedAnnouncement
      })
        .then(() => {
          this.editing = false
        })
        .catch(error => {
          this.editError = error.error
        })
    },
    cancelEdit () {
      this.editing = false
    },
    clearError () {
      this.editError = undefined
    }
  }
}

export default Announcement