feat: add ability to delete fee payments through frontend for system …

…admins
AEGEE · May 10, 2024 · ef3e534 · ef3e534
1 parent 7c08dc1
commit ef3e534
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 3 deletions.
diff --git a/src/views/core/bodies/ListFeePaymentsModal.vue b/src/views/core/bodies/ListFeePaymentsModal.vue
@@ -34,6 +34,13 @@
           <b-table-column field="invoice_name" label="Invoice name">
             {{ props.row.invoice_name }}
           </b-table-column>
+
+          <b-table-column label="Delete" centered :visible="canDelete">
+            <a class="button is-small is-danger" @click="askDeleteMemberPaymentFee(props.row, false)">
+              <span class="icon"><font-awesome-icon icon="minus" /></span>
+              <span>Delete</span>
+            </a>
+          </b-table-column>
         </template>
 
         <template slot="empty">
@@ -48,14 +55,41 @@
 <script>
 export default {
   name: 'ListFeePaymentsModal',
-  props: ['member'],
+  props: [
+    'member',
+    'payments',
+    'canDelete',
+    'route',
+    'services',
+    'root'
+  ],
   data () {
     return {
 
     }
   },
   methods: {
+    askDeleteMemberPaymentFee (fee) {
+      const message = `Are you sure you want to <b>delete</b> ${fee.id} from ${this.member.user.first_name} ${this.member.user.last_name}? This action cannot be undone.`
 
+      this.$buefy.dialog.confirm({
+        title: 'Deleting a fee',
+        message,
+        confirmText: 'Delete fee',
+        type: 'is-danger',
+        hasIcon: true,
+        onConfirm: () => this.deleteFee(fee)
+      })
+    },
+    deleteFee (fee) {
+      this.axios.delete(this.services['core'] + '/bodies/' + this.route.params.id + '/payments/' + fee.id).then(() => {
+        this.root.showSuccess('Fee is deleted.')
+        const updatedPayments = [...this.member.payments]
+        const index = updatedPayments.findIndex(p => p.id === fee.id)
+        updatedPayments.splice(index, 1)
+        this.member.payments = updatedPayments
+      }).catch((err) => this.root.showError('Could not delete fee', err))
+    }
   }
 }
 </script>
diff --git a/src/views/core/bodies/ViewMembers.vue b/src/views/core/bodies/ViewMembers.vue
@@ -110,7 +110,8 @@ export default {
         create: false,
         viewMember: false,
         viewPayment: false,
-        createPayment: false
+        createPayment: false,
+        deletePayment: false
       },
       PAST_DATE_PLACEHOLDER: '1900-01-1'
     }
@@ -127,7 +128,11 @@ export default {
         component: ListFeePaymentsModal,
         hasModalCard: true,
         props: {
-          member
+          member,
+          payments: this.payments,
+          canDelete: this.can.deletePayment,
+          route: this.$route,
+          root: this.$root
         }
       })
     },
@@ -243,6 +248,7 @@ export default {
         this.can.viewMember = this.permissions.some(permission => permission.combined.endsWith('view:member'))
         this.can.viewPayment = this.permissions.some(permission => permission.combined.endsWith('view:payment'))
         this.can.createPayment = this.permissions.some(permission => permission.combined.endsWith('create:payment'))
+        this.can.deletePayment = this.permissions.some(permission => permission.combined.endsWith('delete:payment'))
 
         if (!this.can.viewPayment || !this.body.pays_fees) {
           this.isLoading = false