stash

core/tickets/models.py

@@ -1,3 +1,4 @@
+from django.utils import timezone
 from django.db import models
 from django_softdelete.models import SoftDeleteModel
 
@@ -148,3 +149,10 @@ class ShippingVoucher(models.Model):
 
     def __str__(self):
         return self.voucher + ' (' + self.type + ')'
+
+    def save(self, *args, **kwargs):
+        if self.used_at is None and self.issue_thread is not None:
+            self.used_at = timezone.now()
+        super().save(*args, **kwargs)
+
+

web/src/components/Timeline.vue

@@ -18,7 +18,7 @@
             <span class="timeline-item-icon faded-icon" v-else-if="item.type === 'item_relation'">
                 <font-awesome-icon icon="object-group"/>
             </span>
-            <span class="timeline-item-icon faded-icon" v-else-if="item.type === 'shipping_code'">
+            <span class="timeline-item-icon faded-icon" v-else-if="item.type === 'shipping_voucher'">
                 <font-awesome-icon icon="truck"/>
             </span>
             <span class="timeline-item-icon faded-icon" v-else>
@@ -29,7 +29,7 @@
             <TimelineStateChange v-else-if="item.type === 'state'" :item="item"/>
             <TimelineAssignment v-else-if="item.type === 'assignment'" :item="item"/>
             <TimelineRelatedItem v-else-if="item.type === 'item_relation'" :item="item"/>
-            <TimelineShippingVoucher v-else-if="item.type === 'shipping_code'" :item="item"/>
+            <TimelineShippingVoucher v-else-if="item.type === 'shipping_voucher'" :item="item"/>
             <p v-else>{{ item }}</p>
         </li>
         <li class="timeline-item">

web/src/store.js

@@ -86,6 +86,12 @@ const store = createStore({
                 }
             }
         },
+        availableShippingVoucherTypes: state => {
+            return Object.keys(state.shippingVoucherTypes).map(key => {
+                var count = state.shippingVouchers.filter(voucher => voucher.type === key && voucher.issue_thread === null).length;
+                return {id: key, count: count, name: state.shippingVoucherTypes[key]};
+            });
+        },
         layout: (state, getters) => {
             if (state.route.query.layout)
                 return state.route.query.layout;
@@ -464,6 +470,16 @@ const store = createStore({
             if (data && success) {
                 dispatch('fetchShippingVouchers');
             }
+        },
+        async claimShippingVoucher({dispatch, state}, {ticket, shipping_voucher_type}) {
+            const id = state.shippingVouchers.filter(voucher => voucher.type === shipping_voucher_type && voucher.issue_thread === null)[0].id;
+            const {
+                data,
+                success
+            } = await http.patch(`/2/shipping_vouchers/${id}/`, {issue_thread: ticket}, state.user.token);
+            if (data && success) {
+                dispatch('fetchShippingVouchers');
+            }
         }
     },
     plugins: [

web/src/views/Ticket.vue

@@ -13,10 +13,6 @@
                             <font-awesome-icon icon="trash"/>
                             Delete
                         </button-->
-                        <ClipboardButton :payload="shippingEmail" class="btn btn-primary">
-                            <font-awesome-icon icon="clipboard"/>
-                            Copy DHL contact to clipboard
-                        </ClipboardButton>
                         <div class="btn-group">
                             <select class="form-control" v-model="ticket.assigned_to">
                                 <option v-for="user in users" :value="user.username">{{ user.username }}</option>
@@ -34,6 +30,23 @@
                             </button>
                         </div>
                     </div>
+                    <div class="card-footer d-flex justify-content-between">
+                        <ClipboardButton :payload="shippingEmail" class="btn btn-primary">
+                            <font-awesome-icon icon="clipboard"/>
+                            Copy&nbsp;DHL&nbsp;contact&nbsp;to&nbsp;clipboard
+                        </ClipboardButton>
+                        <div class="btn-group">
+                            <select class="form-control" v-model="shipping_voucher_type">
+                                <option v-for="type in availableShippingVoucherTypes.filter(t=>t.count>0)"
+                                        :value="type.id">{{ type.name }}
+                                </option>
+                            </select>
+                            <button class="form-control btn btn-success"
+                                    @click="claimShippingVoucher({ticket: ticket.id, shipping_voucher_type})">
+                                Claim&nbsp;Shipping&nbsp;Voucher
+                            </button>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
@@ -41,15 +54,21 @@
 </template>
 
 <script>
-import {mapActions, mapState} from 'vuex';
+import {mapActions, mapGetters, mapState} from 'vuex';
 import Timeline from "@/components/Timeline.vue";
 import ClipboardButton from "@/components/inputs/ClipboardButton.vue";
 
 export default {
     name: 'Ticket',
     components: {ClipboardButton, Timeline},
+    data() {
+        return {
+            shipping_voucher_type: null
+        }
+    },
     computed: {
         ...mapState(['tickets', 'state_options', 'users']),
+        ...mapGetters(['availableShippingVoucherTypes']),
         ticket() {
             const id = parseInt(this.$route.params.id)
             const ret = this.tickets.find(ticket => ticket.id === id);
@@ -63,6 +82,7 @@ export default {
     methods: {
         ...mapActions(['deleteItem', 'markItemReturned', 'sendMail', 'updateTicketPartial', 'postComment']),
         ...mapActions(['loadTickets', 'fetchTicketStates', 'loadUsers', 'scheduleAfterInit']),
+        ...mapActions(['claimShippingVoucher']),
         handleMail(mail) {
             this.sendMail({
                 id: this.ticket.id,
@@ -86,7 +106,8 @@ export default {
                 id: ticket.id,
                 assigned_to: ticket.assigned_to
             })
-        }
+        },
+
     },
     mounted() {
         this.scheduleAfterInit(() => [this.fetchTicketStates(), this.loadTickets(), this.loadUsers()]);

web/src/views/admin/Shipping.vue

@@ -3,7 +3,7 @@
         <h3>Shipping Vouchers</h3>
         <div class="mt-3">
             <h5>Shipping Voucher Types</h5>
-            <span v-for="(type, key) in availableShippingVoucherTypes()" :key="key" class="mr-2">
+            <span v-for="(type, key) in availableShippingVoucherTypes" :key="key" class="mr-2">
                 <span v-if="type.count > 2" class="badge badge-success">{{ type.name }} - {{ type.count }}</span>
                 <span v-else-if="type.count > 0" class="badge badge-warning" v-if="type.count > 0">
                     {{ type.name }} - {{ type.count }}
@@ -64,7 +64,7 @@ export default {
     },
     computed: {
         ...mapState(['shippingVouchers', 'shippingVoucherTypes']),
-        ...mapGetters(['getEventSlug']),
+        ...mapGetters(['getEventSlug', 'availableShippingVoucherTypes']),
     },
     methods: {
         ...mapActions(['fetchShippingVouchers', 'createShippingVoucher']),
@@ -85,12 +85,6 @@ export default {
                 });
             }
         },
-        availableShippingVoucherTypes() {
-            return Object.keys(this.shippingVoucherTypes).map(key => {
-                var count = this.shippingVouchers.filter(voucher => voucher.type === key && voucher.issue_thread === null).length;
-                return {id: key, count: count, name: this.shippingVoucherTypes[key]};
-            });
-        },
     },
     mounted() {
         this.fetchShippingVouchers();