From f7c5d3d175c3144e6fc9fe31efda09727de5b328 Mon Sep 17 00:00:00 2001 From: iamareebjamal Date: Sun, 31 May 2020 06:48:28 +0530 Subject: [PATCH 1/4] wip: Order Amount calculation integration --- app/components/public/ticket-list.js | 37 ++++---- app/helpers/currency-symbol.js | 2 +- .../components/public/ticket-list.hbs | 86 ++++++++----------- app/utils/dictionary/payment.ts | 2 +- 4 files changed, 59 insertions(+), 68 deletions(-) diff --git a/app/components/public/ticket-list.js b/app/components/public/ticket-list.js index 4caefbd017f..ba8b097b2e9 100644 --- a/app/components/public/ticket-list.js +++ b/app/components/public/ticket-list.js @@ -10,6 +10,8 @@ export default Component.extend(FormMixin, { promotionalCodeApplied: false, + orderAmount: null, + isUnverified: computed('session.isAuthenticated', 'authManager.currentUser.isVerified', function() { return this.session.isAuthenticated && !this.authManager.currentUser.isVerified; @@ -68,6 +70,20 @@ export default Component.extend(FormMixin, { ticket => ((ticket.price || 0) - (ticket.discount || 0)) * (ticket.orderQuantity || 0) ); }), + + orderAmountInput: computed('order.tickets.@each.orderQuantity', 'order.discountCode', function() { + console.log(this.order.tickets.toArray()); + + return { + tickets: this.order.tickets.toArray().map(ticket => ({ + id : ticket.id, + quantity : ticket.orderQuantity, + price : ticket.price + })), + 'discount-code': this.order.get('discountCode.id') + }; + }), + actions: { async togglePromotionalCode(queryParam) { this.toggleProperty('enterPromotionalCode'); @@ -88,14 +104,6 @@ export default Component.extend(FormMixin, { }); this.discountedTickets.forEach(ticket => { let taxRate = ticket.get('event.tax.rate'); - let ticketPrice = ticket.get('price'); - if (taxRate && !this.showTaxIncludedMessage) { - let ticketPriceWithTax = ticketPrice * (1 + taxRate / 100); - ticket.set('ticketPriceWithTax', ticketPriceWithTax); - } else if (taxRate && this.showTaxIncludedMessage) { - let includedTaxAmount = (taxRate * ticketPrice) / (100 + taxRate); - ticket.set('includedTaxAmount', includedTaxAmount); - } ticket.set('discount', 0); }); this.accessCodeTickets.clear(); @@ -132,16 +140,8 @@ export default Component.extend(FormMixin, { const tickets = await discountCode.tickets; tickets.forEach(ticket => { const ticketPrice = ticket.price; - const taxRate = ticket.get('event.tax.rate'); const discount = discountType === 'amount' ? Math.min(ticketPrice, discountValue) : ticketPrice * (discountValue / 100); ticket.set('discount', discount); - if (taxRate && !this.showTaxIncludedMessage) { - const ticketPriceWithTax = (ticketPrice - ticket.discount) * (1 + taxRate / 100); - ticket.set('ticketPriceWithTax', ticketPriceWithTax); - } else if (taxRate && this.showTaxIncludedMessage) { - const includedTaxAmount = (taxRate * (ticketPrice - discount)) / (100 + taxRate); - ticket.set('includedTaxAmount', includedTaxAmount); - } this.discountedTickets.addObject(ticket); this.set('invalidPromotionalCode', false); }); @@ -166,7 +166,7 @@ export default Component.extend(FormMixin, { this.order.set('amount', this.total); }, - updateOrder(ticket, count) { + async updateOrder(ticket, count) { ticket.set('orderQuantity', count); this.order.set('amount', this.total); if (!this.total) { @@ -179,6 +179,9 @@ export default Component.extend(FormMixin, { this.order.tickets.removeObject(ticket); } } + console.log(this.orderAmountInput); + this.orderAmount = await this.loader.post('/orders/calculate-amount', this.orderAmountInput); + console.log(this.orderAmount); }, handleKeyPress() { diff --git a/app/helpers/currency-symbol.js b/app/helpers/currency-symbol.js index e095869bd54..834b0628b0b 100644 --- a/app/helpers/currency-symbol.js +++ b/app/helpers/currency-symbol.js @@ -4,7 +4,7 @@ import { paymentCurrencies } from 'open-event-frontend/utils/dictionary/payment' export function currencySymbol(params) { const currency = find(paymentCurrencies, ['code', params[0]]); - return currency ? currency.symbol : 'UNKNOWN'; + return currency ? currency.symbol : params[0]; } export default Helper.helper(currencySymbol); diff --git a/app/templates/components/public/ticket-list.hbs b/app/templates/components/public/ticket-list.hbs index cc043c7a8df..039e92d87ad 100644 --- a/app/templates/components/public/ticket-list.hbs +++ b/app/templates/components/public/ticket-list.hbs @@ -4,8 +4,8 @@ {{t 'Type'}} - {{t 'Sales Ends'}} - {{t 'Ticket Price'}} + + {{t 'Price'}} {{t 'Quantity'}} {{t 'Subtotal'}} @@ -27,62 +27,50 @@ {{#if ticket.isDescriptionVisible}} {{ticket.description}} {{/if}} +
+ Sale ends on {{moment-format ticket.salesEndsAt 'ddd, DD MMMM YY, h:mm A'}} +
- {{moment-format ticket.salesEndsAt 'ddd, DD MMMM YY, h:mm A'}} - {{#if ticket.discount}} - -
- {{this.eventCurrency}} {{format-money ticket.price}} + + + {{#if (eq ticket.type 'donation') }} +
+ +
-
- {{this.eventCurrency}} {{format-money (sub ticket.price ticket.discount)}} - {{#if this.taxInfo}} - {{#if this.showTaxIncludedMessage}} - - {{t 'includes'}} {{this.eventCurrency}} {{format-money ticket.includedTaxAmount}} - - {{else}} - - + {{this.eventCurrency}} - {{format-money (add (sub ticket.ticketPriceWithTax ticket.price) ticket.discount)}} - - {{/if}} -
- ({{this.taxInfo.name}}) -
- {{/if}} + {{else}} +
+ {{currency-symbol this.eventCurrency}} {{format-number ticket.price}}
- - {{else}} - - {{#if (eq ticket.type 'donation') }} -
-
+ {{#if ticket.discount}} +
+ {{currency-symbol this.eventCurrency}} {{format-number (sub ticket.price ticket.discount)}}
- {{else}} - {{this.eventCurrency}} {{format-money ticket.price}} {{/if}} - {{#if (and this.taxInfo (not-eq ticket.type 'free'))}} + {{/if}} + {{#if (and this.taxInfo (not-eq ticket.type 'free'))}} +

{{#if this.showTaxIncludedMessage}} - {{t 'includes'}} {{this.eventCurrency}} {{format-money ticket.includedTaxAmount}} + {{t 'includes'}} {{currency-symbol this.eventCurrency}} {{format-number ticket.includedTaxAmount}} {{else}} - + {{this.eventCurrency}} {{format-money (sub ticket.ticketPriceWithTax ticket.price)}} + + {{currency-symbol this.eventCurrency}} {{format-number (sub ticket.ticketPriceWithTax ticket.price)}} {{/if}} -

+ ({{this.taxInfo.name}}) -
- {{/if}} - - {{/if}} + +

+ {{/if}} +
{{#if this.taxInfo}} - {{this.eventCurrency}} - {{format-money (mult (sub ticket.ticketPriceWithTax ticket.discount) ticket.orderQuantity)}} + {{currency-symbol this.eventCurrency}} + {{format-number (mult (sub ticket.ticketPriceWithTax ticket.discount) ticket.orderQuantity)}} {{else}} - {{this.eventCurrency}} {{format-money (mult (sub ticket.price ticket.discount) ticket.orderQuantity)}} + {{currency-symbol this.eventCurrency}} {{format-number (mult (sub ticket.price ticket.discount) ticket.orderQuantity)}} {{/if}} @@ -124,7 +112,7 @@
- {{t 'Total'}}: {{this.eventCurrency}} {{format-money this.total}} + {{t 'Total'}}: {{currency-symbol this.eventCurrency}} {{format-number this.total}}
diff --git a/app/utils/dictionary/payment.ts b/app/utils/dictionary/payment.ts index fefc5064dc3..a6afaf811b5 100644 --- a/app/utils/dictionary/payment.ts +++ b/app/utils/dictionary/payment.ts @@ -135,7 +135,7 @@ export const paymentCurrencies: PaymentCurrency[] = [ { paypal : true, code : 'USD', - symbol : 'US$', + symbol : '$', name : 'United States dollar', stripe : true, alipay : true, From 0eb0ead1fac9e8598fb57bac79a3f05715d41a61 Mon Sep 17 00:00:00 2001 From: iamareebjamal Date: Mon, 1 Jun 2020 02:45:40 +0530 Subject: [PATCH 2/4] wip --- app/components/public/ticket-list.js | 34 ++++++++++++++++--- .../components/public/ticket-list.hbs | 7 +--- 2 files changed, 30 insertions(+), 11 deletions(-) diff --git a/app/components/public/ticket-list.js b/app/components/public/ticket-list.js index ba8b097b2e9..e284d0565d6 100644 --- a/app/components/public/ticket-list.js +++ b/app/components/public/ticket-list.js @@ -39,9 +39,26 @@ export default Component.extend(FormMixin, { invalidPromotionalCode: false, - tickets: computed(function() { - return this.data.sortBy('position'); + tickets: computed('orderAmount', function() { + const ticketMap = {}; + if (this.orderAmount) { + this.orderAmount.tickets.forEach(ticket => { + ticketMap[ticket.id] = ticket; + }); + } + + return this.data.sortBy('position').map(ticket => { + const ticketExtra = ticketMap[ticket.id]; + + if (ticketExtra) { + ticket.set('subTotal', ticketExtra.sub_total); + ticket.set('discountInfo', ticketExtra.discount); + } + + return ticket; + }); }), + hasTicketsInOrder: computed('tickets.@each.orderQuantity', function() { return sumBy(this.tickets.toArray(), ticket => (ticket.orderQuantity || 0) @@ -103,7 +120,6 @@ export default Component.extend(FormMixin, { this.tickets.removeObject(ticket); }); this.discountedTickets.forEach(ticket => { - let taxRate = ticket.get('event.tax.rate'); ticket.set('discount', 0); }); this.accessCodeTickets.clear(); @@ -164,8 +180,9 @@ export default Component.extend(FormMixin, { this.set('promotionalCode', 'Promotional code applied successfully'); } this.order.set('amount', this.total); - + this.send('updateOrderAmount'); }, + async updateOrder(ticket, count) { ticket.set('orderQuantity', count); this.order.set('amount', this.total); @@ -179,8 +196,15 @@ export default Component.extend(FormMixin, { this.order.tickets.removeObject(ticket); } } + + this.send('updateOrderAmount'); + }, + + async updateOrderAmount() { console.log(this.orderAmountInput); - this.orderAmount = await this.loader.post('/orders/calculate-amount', this.orderAmountInput); + + this.set('orderAmount', await this.loader.post('/orders/calculate-amount', this.orderAmountInput)); + console.log(this.orderAmount); }, diff --git a/app/templates/components/public/ticket-list.hbs b/app/templates/components/public/ticket-list.hbs index 039e92d87ad..e799b3bb826 100644 --- a/app/templates/components/public/ticket-list.hbs +++ b/app/templates/components/public/ticket-list.hbs @@ -93,12 +93,7 @@
- {{#if this.taxInfo}} - {{currency-symbol this.eventCurrency}} - {{format-number (mult (sub ticket.ticketPriceWithTax ticket.discount) ticket.orderQuantity)}} - {{else}} - {{currency-symbol this.eventCurrency}} {{format-number (mult (sub ticket.price ticket.discount) ticket.orderQuantity)}} - {{/if}} + {{currency-symbol this.eventCurrency}} {{format-number ticket.subTotal}} {{/unless}} From 4f50d2e25a84cb9a765a150d7d9b0b442e2bf818 Mon Sep 17 00:00:00 2001 From: iamareebjamal Date: Mon, 1 Jun 2020 08:06:17 +0530 Subject: [PATCH 3/4] fix --- app/components/public/ticket-list.js | 38 ++++++---------- .../components/public/ticket-list.hbs | 45 ++++++++++++------- 2 files changed, 42 insertions(+), 41 deletions(-) diff --git a/app/components/public/ticket-list.js b/app/components/public/ticket-list.js index e284d0565d6..4bf4ff08755 100644 --- a/app/components/public/ticket-list.js +++ b/app/components/public/ticket-list.js @@ -1,5 +1,6 @@ import Component from '@ember/component'; import { computed } from '@ember/object'; +import { debounce } from '@ember/runloop'; import FormMixin from 'open-event-frontend/mixins/form'; import { inject as service } from '@ember/service'; import { sumBy, merge } from 'lodash-es'; @@ -27,13 +28,6 @@ export default Component.extend(FormMixin, { } }), - showTaxIncludedMessage: computed('taxInfo.isTaxIncludedInPrice', function() { - if (this.taxInfo !== null) { - return (this.taxInfo.isTaxIncludedInPrice); - } - return false; - }), - accessCodeTickets : A(), discountedTickets : A(), @@ -88,8 +82,7 @@ export default Component.extend(FormMixin, { ); }), - orderAmountInput: computed('order.tickets.@each.orderQuantity', 'order.discountCode', function() { - console.log(this.order.tickets.toArray()); + orderAmountInput: computed('tickets.@each.price', 'order.tickets.@each.orderQuantity', 'order.discountCode', function() { return { tickets: this.order.tickets.toArray().map(ticket => ({ @@ -115,15 +108,16 @@ export default Component.extend(FormMixin, { this.set('code', null); this.order.set('accessCode', undefined); this.order.set('discountCode', undefined); + this.tickets.forEach(ticket => { + ticket.set('discount', null); + }); this.accessCodeTickets.forEach(ticket => { ticket.set('isHidden', true); this.tickets.removeObject(ticket); }); - this.discountedTickets.forEach(ticket => { - ticket.set('discount', 0); - }); this.accessCodeTickets.clear(); this.discountedTickets.clear(); + this.send('updateOrderAmount'); } } @@ -150,13 +144,10 @@ export default Component.extend(FormMixin, { const discountCode = await this.store.queryRecord('discount-code', { eventIdentifier: this.event.id, code: this.promotionalCode, include: 'event,tickets' }); const discountCodeEvent = await discountCode.event; if (this.currentEventIdentifier === discountCodeEvent.identifier) { - const discountType = discountCode.type; - const discountValue = discountCode.value; this.order.set('discountCode', discountCode); const tickets = await discountCode.tickets; tickets.forEach(ticket => { - const ticketPrice = ticket.price; - const discount = discountType === 'amount' ? Math.min(ticketPrice, discountValue) : ticketPrice * (discountValue / 100); + const discount = discountCode.type === 'amount' ? Math.min(ticket.price, discountCode.value) : ticket.price * (discountCode.value / 100); ticket.set('discount', discount); this.discountedTickets.addObject(ticket); this.set('invalidPromotionalCode', false); @@ -179,19 +170,16 @@ export default Component.extend(FormMixin, { this.set('promotionalCodeApplied', true); this.set('promotionalCode', 'Promotional code applied successfully'); } - this.order.set('amount', this.total); this.send('updateOrderAmount'); }, async updateOrder(ticket, count) { ticket.set('orderQuantity', count); - this.order.set('amount', this.total); - if (!this.total) { - this.order.set('amount', 0); - } if (count > 0) { this.order.tickets.addObject(ticket); } else { + ticket.set('subTotal', null); + ticket.set('discountInfo', null); if (this.order.tickets.includes(ticket)) { this.order.tickets.removeObject(ticket); } @@ -201,11 +189,7 @@ export default Component.extend(FormMixin, { }, async updateOrderAmount() { - console.log(this.orderAmountInput); - this.set('orderAmount', await this.loader.post('/orders/calculate-amount', this.orderAmountInput)); - - console.log(this.orderAmount); }, handleKeyPress() { @@ -213,6 +197,10 @@ export default Component.extend(FormMixin, { this.send('applyPromotionalCode'); this.set('code', this.promotionalCode); } + }, + + onChangeDonation() { + debounce(this, () => this.send('updateOrderAmount'), this.tickets, 250); } }, didInsertElement() { diff --git a/app/templates/components/public/ticket-list.hbs b/app/templates/components/public/ticket-list.hbs index e799b3bb826..13691acc42b 100644 --- a/app/templates/components/public/ticket-list.hbs +++ b/app/templates/components/public/ticket-list.hbs @@ -42,27 +42,28 @@ @name={{ticket.id}} placeholder={{t "Enter Donation"}} @min={{ticket.minPrice}} @max={{ticket.maxPrice}} - @value={{ticket.price}} /> + @value={{ticket.price}} + @keyUp={{action "onChangeDonation"}} />
{{else}}
- {{currency-symbol this.eventCurrency}} {{format-number ticket.price}} + {{currency-symbol this.eventCurrency}} {{format-money ticket.price}}
{{#if ticket.discount}}
- {{currency-symbol this.eventCurrency}} {{format-number (sub ticket.price ticket.discount)}} + {{currency-symbol this.eventCurrency}} {{format-money (sub ticket.price ticket.discount)}}
{{/if}} {{/if}} {{#if (and this.taxInfo (not-eq ticket.type 'free'))}}

- {{#if this.showTaxIncludedMessage}} + {{#if this.taxInfo.isTaxIncludedInPrice}} - {{t 'includes'}} {{currency-symbol this.eventCurrency}} {{format-number ticket.includedTaxAmount}} + {{t 'includes'}} {{currency-symbol this.eventCurrency}} {{format-money ticket.includedTaxAmount}} {{else}} - + {{currency-symbol this.eventCurrency}} {{format-number (sub ticket.ticketPriceWithTax ticket.price)}} + + {{currency-symbol this.eventCurrency}} {{format-money (sub ticket.ticketPriceWithTax ticket.price)}} {{/if}} @@ -93,7 +94,7 @@

- {{currency-symbol this.eventCurrency}} {{format-number ticket.subTotal}} + {{currency-symbol this.eventCurrency}} {{format-money ticket.subTotal}} {{/unless}} @@ -101,15 +102,27 @@ - - - - - -
- {{t 'Total'}}: {{currency-symbol this.eventCurrency}} {{format-number this.total}} -
- + + + + + + {{#if orderAmount.tax}} + + + + + + {{/if}} + + +
{{t 'Sub-Total'}}{{currency-symbol this.eventCurrency}} {{format-money this.orderAmount.sub_total}}
+
{{t 'Tax'}} ({{this.orderAmount.tax.percent}}% {{this.orderAmount.tax.name}})
+ {{#if orderAmount.tax.included}} + Included in Total + {{/if}} + 		{{currency-symbol this.eventCurrency}} {{this.orderAmount.tax.amount}}
{{t 'Total'}}{{currency-symbol this.eventCurrency}} {{format-money this.orderAmount.total}}
+ From d45289023de31e2af3da273c841340a6d74954bb Mon Sep 17 00:00:00 2001 From: iamareebjamal Date: Tue, 2 Jun 2020 05:42:38 +0530 Subject: [PATCH 4/4] fix --- app/components/public/ticket-list.js | 15 ++++++++++++- app/styles/partials/utils.scss | 4 ++++ .../components/public/ticket-list.hbs | 22 ++++++++++--------- .../helpers/currency-symbol-test.js | 2 +- 4 files changed, 31 insertions(+), 12 deletions(-) diff --git a/app/components/public/ticket-list.js b/app/components/public/ticket-list.js index 4bf4ff08755..efa102a3a33 100644 --- a/app/components/public/ticket-list.js +++ b/app/components/public/ticket-list.js @@ -189,7 +189,20 @@ export default Component.extend(FormMixin, { }, async updateOrderAmount() { - this.set('orderAmount', await this.loader.post('/orders/calculate-amount', this.orderAmountInput)); + if (this.shouldDisableOrderButton) { + this.set('orderAmount', null); + return; + } + + try { + this.set('orderAmount', await this.loader.post('/orders/calculate-amount', this.orderAmountInput)); + this.order.amount = this.orderAmount.total; + } catch (e) { + console.error('Error while calculating order amount', e); + this.notify.error(e.response.errors[0].detail, { + id: 'order-amount-error' + }); + } }, handleKeyPress() { diff --git a/app/styles/partials/utils.scss b/app/styles/partials/utils.scss index e0e103935e8..9b159475112 100644 --- a/app/styles/partials/utils.scss +++ b/app/styles/partials/utils.scss @@ -35,3 +35,7 @@ .mb-8 { margin-bottom: 2rem; } + +.m-0 { + margin: 0 !important; +} diff --git a/app/templates/components/public/ticket-list.hbs b/app/templates/components/public/ticket-list.hbs index 13691acc42b..c1c0377db7b 100644 --- a/app/templates/components/public/ticket-list.hbs +++ b/app/templates/components/public/ticket-list.hbs @@ -34,16 +34,18 @@ {{#if (eq ticket.type 'donation') }} -
- - +
+
+ + +
{{else}}
diff --git a/tests/integration/helpers/currency-symbol-test.js b/tests/integration/helpers/currency-symbol-test.js index ca43da1c6ec..0cb26f4f86f 100644 --- a/tests/integration/helpers/currency-symbol-test.js +++ b/tests/integration/helpers/currency-symbol-test.js @@ -11,7 +11,7 @@ module('Integration | Helper | currency-symbol', function(hooks) { await render(hbs`{{currency-symbol inputValue}}`); - assert.equal(this.element.textContent.trim(), 'US$'); + assert.equal(this.element.textContent.trim(), '$'); }); });