META: refactor getUpdateShowObject & change show delete to deactivate

src/components/ShowManager.vue

@@ -74,17 +74,36 @@
           <p v-html="sanitizedShowDescription" />
           <!-- TODO: add image and logo here? -->
         </div>
-      </div>
 
-      <div align="center">
-        <b-button
+        <div
           v-if="$parent.user.steeringUser.is_superuser"
-          variant="danger"
-          size="sm"
-          @click="$refs.appModalSuperuser.showModalDeleteShow(shows[currentShow].id, shows[currentShow].name)"
+          align="center"
         >
-          Delete show
-        </b-button>
+          <div v-if="shows[currentShow].is_active">
+            <b-button
+              variant="danger"
+              size="sm"
+              @click="$refs.appModalSuperuser.showModalDeactivateShow(shows[currentShow].id, shows[currentShow].name)"
+            >
+              Deactivate show
+            </b-button>
+          </div>
+          <div v-else>
+            <b-alert
+              variant="danger"
+              show
+            >
+              This show is currently not active!<br><br>
+              <b-button
+                variant="success"
+                size="sm"
+                @click="notYetImplemented()"
+              >
+                Activate!
+              </b-button>
+            </b-alert>
+          </div>
+        </div>
       </div>
     </b-jumbotron>
 

src/components/ShowManagerModalShow.vue

@@ -397,8 +397,10 @@
 
 <script>
 import axios from 'axios'
+import showUpdates from '../mixins/showUpdates.js'
 
 export default {
+  mixins: [ showUpdates ],
   props: {
     show: { type: Object, required: true }
   },
@@ -502,27 +504,6 @@ export default {
   the info set through the modal.
   */
   methods: {
-    /* returns a new minimal object from the current show object with all
-    properties needed for a PUT request to the /show/ endpoint */
-    getUpdateShowObject () {
-      let s = {}
-      s.name = this.show.name
-      s.slug = this.show.slug
-      s.short_description = this.show.short_description
-      s.fundingcategory = this.show.fundingcategory
-      s.type = this.show.type
-      // we do not want the arrays do be passed as references, because the
-      // current show object should not get modified when the update object
-      // gets modified, therefore we use slice to clone the arrays
-      s.category = this.show.category.slice()
-      s.hosts = this.show.hosts.slice()
-      s.owners = this.show.owners.slice()
-      s.language = this.show.language.slice()
-      s.topic = this.show.topic.slice()
-      s.musicfocus = this.show.musicfocus.slice()
-      return s
-    },
-
     /*
     Functions to update certain infos about a show should first check out a
     new show object with getUpdateShowObject and then modify / add those

src/components/ShowManagerModalSuperuser.vue

@@ -82,18 +82,18 @@
       </b-container>
     </b-modal>
 
-    <!-- Modal to confirm and delete a show -->
+    <!-- Modal to confirm and deactivate a show -->
     <b-modal
-      ref="modalDeleteShow"
-      title="Delete a show"
+      ref="modalDeactivateShow"
+      title="Deactivate a show"
       size="lg"
-      @ok="deleteShow"
+      @ok="deactivateShow"
     >
       <b-alert
         variant="danger"
         show
       >
-        You are about to delete the show <b>{{ deletedShow.name }}</b>!
+        You are about to deactivate the show <b>{{ deactivatedShow.name }}</b>!
       </b-alert>
       <div align="center">
         Are you sure you want to continue?
@@ -199,9 +199,10 @@
 <script>
 import axios from 'axios'
 import slugify from '../mixins/slugify.js'
+import showUpdates from '../mixins/showUpdates.js'
 
 export default {
-  mixins: [ slugify ],
+  mixins: [ slugify, showUpdates ],
   data () {
     return {
       newShow: {
@@ -217,7 +218,7 @@ export default {
         topic: [],
         musicfocus: [],
       },
-      deletedShow: {
+      deactivatedShow: {
         id: null,
         name: '',
       },
@@ -311,16 +312,16 @@ export default {
       })
     },
 
-    // delete a show by sending a DELETE to the steering API
-    deleteShow (event) {
+    // deactivate a show by updating the is_active flag to false
+    deactivateShow (event) {
       // prevent the modal from closing automatically on click
       event.preventDefault()
-      let uri = process.env.VUE_APP_API_STEERING_SHOWS + this.deletedShow.id
+      let uri = process.env.VUE_APP_API_STEERING_SHOWS + this.deactivatedShow.id
       axios.delete(uri, {
         withCredentials: true,
         headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token }
       }).then(() => {
-        this.$refs.modalDeleteShow.hide()
+        this.$refs.modalDeactivateShow.hide()
         this.$parent.loadAndSwitch(null)
       }).catch(error => {
         this.$log.error(error.response.status + ' ' + error.response.statusText)
@@ -354,13 +355,14 @@ export default {
       // prevent the modal from closing automatically on click
       event.preventDefault()
       // now we have to fill the show's owner list anew with the selected owners
-      this.show.owners = []
+      let updatedShow = this.getUpdateShowObject()
+      updatedShow.owners = []
       for (let i in this.owners) {
-        this.show.owners.push(this.owners[i].id)
+        updatedShow.owners.push(this.owners[i].id)
       }
       // ready to update the show
       let uri = process.env.VUE_APP_API_STEERING_SHOWS + this.show.id + '/'
-      axios.put(uri, this.show, {
+      axios.put(uri, updatedShow, {
         withCredentials: true,
         headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token }
       }).then(() => {
@@ -384,11 +386,12 @@ export default {
       this.$refs.modalAddShow.show()
     },
 
-    // open the deletion confirmation modal
-    showModalDeleteShow (id, name) {
-      this.deletedShow.id = id
-      this.deletedShow.name = name
-      this.$refs.modalDeleteShow.show()
+    // open the deactivation confirmation modal
+    showModalDeactivateShow (show) {
+      this.deactivatedShow.id = show.id
+      this.deactivatedShow.name = show.name
+      this.show = show
+      this.$refs.modalDeactivateShow.show()
     },
 
     // open the modal to edit a show's owners

src/mixins/showUpdates.js

+export default {
+  methods: {
+    /* returns a new minimal object from the current show object with all
+    properties needed for a PUT request to the /show/ endpoint */
+    getUpdateShowObject () {
+      let s = {}
+      s.name = this.show.name
+      s.slug = this.show.slug
+      s.short_description = this.show.short_description
+      s.fundingcategory = this.show.fundingcategory
+      s.type = this.show.type
+      // we do not want the arrays do be passed as references, because the
+      // current show object should not get modified when the update object
+      // gets modified, therefore we use slice to clone the arrays
+      s.category = this.show.category.slice()
+      s.hosts = this.show.hosts.slice()
+      s.owners = this.show.owners.slice()
+      s.language = this.show.language.slice()
+      s.topic = this.show.topic.slice()
+      s.musicfocus = this.show.musicfocus.slice()
+      return s
+    },
+  }
+}