feat: check user permissions in calendar

refs #247

src/Pages/EmissionManager.vue

@@ -138,6 +138,7 @@ import {
 import CalendarDayView from '@/components/CalendarDayView.vue'
 import { mapStores } from 'pinia'
 import { useRRuleStore } from '@/stores/rrules'
+import { useAuthStore, useShowStore } from '@/stores'
 
 export default {
   components: {
@@ -184,7 +185,7 @@ export default {
       getShow: 'shows/getShowByDataParam',
     }),
 
-    ...mapStores(useRRuleStore),
+    ...mapStores(useRRuleStore, useShowStore, useAuthStore),
 
     resolvedScheduleRRule() {
       return this.rrulesStore.itemMap.get(this.resolveData.schedule.rruleId)
@@ -292,7 +293,7 @@ export default {
         },
         eventClick: this.eventSelected,
         select: this.createEvent,
-        selectable: true,
+        selectable: this.authStore.hasUserPermission(['program.add_schedule']),
         selectMirror: true,
         slotDuration: `00:${slotDurationMinutes.toString().padStart(2, '0')}:00`,
         eventMinHeight: 1,
@@ -420,7 +421,7 @@ export default {
 
     // this handler will be called whenever the user clicks on one of the
     // displayed timeslots
-    eventSelected({ event }) {
+    async eventSelected({ event }) {
       // in conflict resolution mode only the newly generated events are
       // clickable. if there is no conflict for an event, only a modal
       // with a short notice should be opened, otherwise the resolution modal
@@ -437,6 +438,8 @@ export default {
       else {
         const selectedTimeslotId = event.extendedProps.id
         const timeslot = this.timeslots.find((slot) => slot.id === selectedTimeslotId)
+        const show = await this.showsStore.retrieve(timeslot.showId, { useCached: true })
+        if (!this.authStore.isOwner(show.ownerIds)) return
         if (timeslot.showId !== this.selectedShow.id) {
           this.switchShow(this.getShowIndexById(timeslot.showId))
         } else {

src/components/emissions/ModalEdit.vue

@@ -103,58 +103,57 @@
         <img src="/assets/radio.gif" :alt="$t('loading')" />
       </div>
 
-      <hr />
-
-      <h4>{{ $t('scheduleEditor.addRepetition') }}</h4>
-      <b-row>
-        <b-col cols="6">
-          <label class="tw-leading-loose">
-            {{ $t('scheduleEditor.whenToRepeat') }}
-
-            <b-form-select v-model="repetitionRule" :options="repetitionOptions" />
-          </label>
-
-          <b-checkbox v-if="repetitionRule !== 4" v-model="useSameTime">
-            {{ $t('scheduleEditor.useSameTime') }}
-          </b-checkbox>
-        </b-col>
-        <b-col v-if="!useSameTime" cols="6">
-          <label class="tw-leading-loose">
-            {{ $t('scheduleEditor.repeatAt') }}
-            <b-form-input v-model="repetitionTime" type="time" />
-          </label>
-        </b-col>
-      </b-row>
-
-      <b-row v-if="repetitionRule === 3" class="tw-mt-4">
-        <b-col cols="6">
-          <label class="tw-leading-loose">
-            {{ $t('scheduleEditor.addNoOfDays') }}
-
-            <b-form-input v-model="addNoOfDays" type="number" />
-          </label>
-
-          <b-checkbox v-model="onlyBusinessDays">
-            {{ $t('scheduleEditor.onlyBusinessDays') }}
-          </b-checkbox>
-        </b-col>
-      </b-row>
-
-      <b-row class="my-4">
-        <b-col>
-          <b-button variant="primary" size="sm" @click="createRepetitionSchedule">
-            {{ $t('scheduleEditor.addRepetition') }}
-          </b-button>
-        </b-col>
-      </b-row>
+      <APermissionGuard show-permissions="program.add_schedule">
+        <hr />
+
+        <h4>{{ $t('scheduleEditor.addRepetition') }}</h4>
+        <b-row>
+          <b-col cols="6">
+            <label class="tw-leading-loose">
+              {{ $t('scheduleEditor.whenToRepeat') }}
+
+              <b-form-select v-model="repetitionRule" :options="repetitionOptions" />
+            </label>
+
+            <b-checkbox v-if="repetitionRule !== 4" v-model="useSameTime">
+              {{ $t('scheduleEditor.useSameTime') }}
+            </b-checkbox>
+          </b-col>
+          <b-col v-if="!useSameTime" cols="6">
+            <label class="tw-leading-loose">
+              {{ $t('scheduleEditor.repeatAt') }}
+              <b-form-input v-model="repetitionTime" type="time" />
+            </label>
+          </b-col>
+        </b-row>
+
+        <b-row v-if="repetitionRule === 3" class="tw-mt-4">
+          <b-col cols="6">
+            <label class="tw-leading-loose">
+              {{ $t('scheduleEditor.addNoOfDays') }}
+
+              <b-form-input v-model="addNoOfDays" type="number" />
+            </label>
+
+            <b-checkbox v-model="onlyBusinessDays">
+              {{ $t('scheduleEditor.onlyBusinessDays') }}
+            </b-checkbox>
+          </b-col>
+        </b-row>
+
+        <b-row class="my-4">
+          <b-col>
+            <b-button variant="primary" size="sm" @click="createRepetitionSchedule">
+              {{ $t('scheduleEditor.addRepetition') }}
+            </b-button>
+          </b-col>
+        </b-row>
+      </APermissionGuard>
 
       <template #modal-footer>
-        <div
-          v-if="loaded.scheduleTimeslots"
-          class="tw-w-full tw-flex tw-justify-between tw-items-center"
-        >
-          <div class="tw-space-x-2">
-            <template v-if="isInTheFuture(timeslot)">
+        <template v-if="loaded.scheduleTimeslots">
+          <template v-if="isInTheFuture(timeslot)">
+            <APermissionGuard show-permissions="program.delete_schedule">
               <b-button variant="danger" size="sm" @click="deleteFullSchedule(schedule.id)">
                 <span v-if="scheduleTimeslots.length === 1">{{
                   $t('scheduleEditor.delete.delete')
@@ -164,7 +163,9 @@
                 }}</span>
                 <span v-else>{{ $t('scheduleEditor.delete.scheduleTimeslots') }}</span>
               </b-button>
+            </APermissionGuard>
 
+            <APermissionGuard show-permissions="program.delete_timeslot">
               <b-button
                 v-if="scheduleRRule?.count !== 1 && scheduleTimeslots.length > 1"
                 variant="danger"
@@ -173,21 +174,21 @@
               >
                 {{ $t('scheduleEditor.delete.timeslot') }}
               </b-button>
-            </template>
+            </APermissionGuard>
+          </template>
 
+          <APermissionGuard show-permissions="program.delete_timeslot">
             <b-button
               v-if="scheduleRRule?.count !== 1 && scheduleTimeslots.length > 1"
               variant="danger"
               size="sm"
+              class="tw-ml-auto"
               @click="deleteAllFutureTimeslots(schedule.id, timeslot.id)"
             >
               {{ $t('scheduleEditor.delete.allTimeslots') }}
             </b-button>
-          </div>
-        </div>
-        <div v-else>
-          <img src="/assets/radio.gif" :alt="$t('loading')" />
-        </div>
+          </APermissionGuard>
+        </template>
       </template>
     </b-modal>
 
@@ -214,12 +215,13 @@ import { mapGetters } from 'vuex'
 
 import prettyDate, { formatSeconds, hmsToSeconds } from '../../mixins/prettyDate'
 import ServerErrors from '@/components/ServerErrors.vue'
+import APermissionGuard from '@/components/generic/APermissionGuard.vue'
 import { sanitizeHTML } from '@/util'
 import { useRRuleStore } from '@/stores/rrules'
 import SafeHTML from '@/components/generic/SafeHTML.ts'
 
 export default {
-  components: { SafeHTML, ServerErrors },
+  components: { APermissionGuard, SafeHTML, ServerErrors },
   mixins: [prettyDate],
   emits: ['conflict', 'update'],