Widget: Make "voucher required" clickable

This commit is contained in:
Raphael Michel
2021-08-19 10:39:36 +02:00
parent 5bc9ba4641
commit 434719285b

View File

@@ -193,7 +193,7 @@ var widget_id = makeid(16);
Vue.component('availbox', { Vue.component('availbox', {
template: ('<div class="pretix-widget-availability-box">' template: ('<div class="pretix-widget-availability-box">'
+ '<div class="pretix-widget-availability-unavailable" v-if="require_voucher">' + '<div class="pretix-widget-availability-unavailable" v-if="require_voucher">'
+ '<small>' + strings.voucher_required + '</small>' + '<small><a @click.prevent="focus_voucher_field">' + strings.voucher_required + '</a></small>'
+ '</div>' + '</div>'
+ '<div class="pretix-widget-availability-unavailable"' + '<div class="pretix-widget-availability-unavailable"'
+ ' v-if="!require_voucher && avail[0] < 100 && avail[0] > 10">' + ' v-if="!require_voucher && avail[0] < 100 && avail[0] > 10">'
@@ -279,6 +279,11 @@ Vue.component('availbox', {
} }
return u return u
} }
},
methods: {
focus_voucher_field: function () {
this.$root.$emit('focus_voucher_field')
}
} }
}); });
Vue.component('pricebox', { Vue.component('pricebox', {
@@ -796,7 +801,7 @@ Vue.component('pretix-widget-event-form', {
+ '<h3 class="pretix-widget-voucher-headline">'+ strings['redeem_voucher'] +'</h3>' + '<h3 class="pretix-widget-voucher-headline">'+ strings['redeem_voucher'] +'</h3>'
+ '<div v-if="$root.voucher_explanation_text" class="pretix-widget-voucher-text">{{ $root.voucher_explanation_text }}</div>' + '<div v-if="$root.voucher_explanation_text" class="pretix-widget-voucher-text">{{ $root.voucher_explanation_text }}</div>'
+ '<div class="pretix-widget-voucher-input-wrap">' + '<div class="pretix-widget-voucher-input-wrap">'
+ '<input class="pretix-widget-voucher-input" type="text" v-model="$parent.voucher" name="voucher" placeholder="'+strings.voucher_code+'">' + '<input class="pretix-widget-voucher-input" ref="voucherinput" type="text" v-model="$parent.voucher" name="voucher" placeholder="'+strings.voucher_code+'">'
+ '</div>' + '</div>'
+ '<input type="hidden" name="subevent" :value="$root.subevent" />' + '<input type="hidden" name="subevent" :value="$root.subevent" />'
+ '<input type="hidden" name="widget_data" :value="$root.widget_data_json" />' + '<input type="hidden" name="widget_data" :value="$root.widget_data_json" />'
@@ -815,10 +820,12 @@ Vue.component('pretix-widget-event-form', {
}, },
mounted: function() { mounted: function() {
this.$root.$on('amounts_changed', this.calculate_buy_disabled) this.$root.$on('amounts_changed', this.calculate_buy_disabled)
this.$root.$on('focus_voucher_field', this.focus_voucher_field)
this.calculate_buy_disabled() this.calculate_buy_disabled()
}, },
beforeDestroy: function() { beforeDestroy: function() {
this.$root.$off('amounts_changed', this.calculate_buy_disabled) this.$root.$off('amounts_changed', this.calculate_buy_disabled)
this.$root.$off('focus_voucher_field', this.focus_voucher_field)
}, },
computed: { computed: {
buy_label: function () { buy_label: function () {
@@ -851,6 +858,10 @@ Vue.component('pretix-widget-event-form', {
} }
}, },
methods: { methods: {
focus_voucher_field: function() {
this.$refs.voucherinput.scrollIntoView(false)
this.$refs.voucherinput.focus()
},
back_to_list: function() { back_to_list: function() {
this.$root.target_url = this.$root.parent_stack.pop(); this.$root.target_url = this.$root.parent_stack.pop();
this.$root.error = null; this.$root.error = null;