commit: 56e6d86f882a154f233616f79172391e9d097fcd
parent db5c0c3502d4db4da49fe4406422b4b53087a0ba
Author: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 15:45:45 -0400
Allow posting announcements with other metadata
Diffstat:
3 files changed, 40 insertions(+), 4 deletions(-)
diff --git a/src/components/announcements_page/announcements_page.js b/src/components/announcements_page/announcements_page.js
@@ -1,14 +1,19 @@
import { mapState } from 'vuex'
import Announcement from '../announcement/announcement.vue'
+import Checkbox from '../checkbox/checkbox.vue'
const AnnouncementsPage = {
components: {
- Announcement
+ Announcement,
+ Checkbox
},
data () {
return {
newAnnouncement: {
- content: ''
+ content: '',
+ startsAt: undefined,
+ endsAt: undefined,
+ allDay: false
},
posting: false,
error: undefined
@@ -29,6 +34,11 @@ const AnnouncementsPage = {
postAnnouncement () {
this.posting = true
this.$store.dispatch('postAnnouncement', this.newAnnouncement)
+ .then(() => {
+ this.newAnnouncement.content = ''
+ this.startsAt = undefined
+ this.endsAt = undefined
+ })
.catch(error => {
this.error = error.error
})
diff --git a/src/components/announcements_page/announcements_page.vue b/src/components/announcements_page/announcements_page.vue
@@ -23,6 +23,29 @@
:placeholder="$t('announcements.post_placeholder')"
:disabled="posting"
/>
+ <span class="announcement-metadata">
+ <label for="announcement-start-time">{{ $t('announcements.start_time_prompt') }}</label>
+ <input
+ id="announcement-start-time"
+ v-model="newAnnouncement.startsAt"
+ :type="newAnnouncement.allDay ? 'date' : 'datetime-local'"
+ >
+ </span>
+ <span class="announcement-metadata">
+ <label for="announcement-end-time">{{ $t('announcements.end_time_prompt') }}</label>
+ <input
+ id="announcement-end-time"
+ v-model="newAnnouncement.endsAt"
+ :type="newAnnouncement.allDay ? 'date' : 'datetime-local'"
+ >
+ </span>
+ <span class="announcement-metadata">
+ <Checkbox
+ id="announcement-all-day"
+ v-model="newAnnouncement.allDay"
+ />
+ <label for="announcement-all-day">{{ $t('announcements.all_day_prompt') }}</label>
+ </span>
</div>
<div class="footer">
<button
@@ -80,6 +103,9 @@
display: flex;
align-items: stretch;
flex-direction: column;
+ .announcement-metadata {
+ margin-top: 0.5em;
+ }
}
.post-textarea {
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
@@ -1381,11 +1381,11 @@ const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) =>
const payload = { content }
if (typeof startsAt !== 'undefined') {
- payload['starts_at'] = startsAt
+ payload['starts_at'] = new Date(startsAt).toISOString()
}
if (typeof endsAt !== 'undefined') {
- payload['ends_at'] = endsAt
+ payload['ends_at'] = new Date(endsAt).toISOString()
}
if (typeof allDay !== 'undefined') {