123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162 |
- /**
- * Copyright © Magento, Inc. All rights reserved.
- * See COPYING.txt for license details.
- */
- define([
- 'jquery',
- 'mage/template',
- 'Magento_Ui/js/modal/alert',
- 'jquery/ui',
- 'mage/translate'
- ], function ($, mageTemplate, alert) {
- 'use strict';
- $.widget('mage.payment', {
- options: {
- continueSelector: '#payment-continue',
- methodsContainer: '#payment-methods',
- minBalance: 0,
- tmpl: '<input id="hidden-free" type="hidden" name="payment[method]" value="free">'
- },
- /** @inheritdoc */
- _create: function () {
- this.element.find('dd [name^="payment["]').prop('disabled', true).end()
- .on('click', this.options.continueSelector, $.proxy(this._submitHandler, this))
- .on('updateCheckoutPrice', $.proxy(function (event, data) {
- //updating the checkoutPrice
- if (data.price) {
- this.options.checkoutPrice += data.price;
- }
- //updating total price
- if (data.totalPrice) {
- data.totalPrice = this.options.checkoutPrice;
- }
- if (this.options.checkoutPrice <= this.options.minBalance) {
- // Add free input field, hide and disable unchecked
- // checkbox payment method and all radio button payment methods
- this._disablePaymentMethods();
- } else {
- // Remove free input field, show all payment method
- this._enablePaymentMethods();
- }
- }, this))
- .on('click', 'dt input:radio', $.proxy(this._paymentMethodHandler, this));
- if (this.options.checkoutPrice < this.options.minBalance) {
- this._disablePaymentMethods();
- } else {
- this._enablePaymentMethods();
- }
- },
- /**
- * Display payment details when payment method radio button is checked
- * @private
- * @param {EventObject} e
- */
- _paymentMethodHandler: function (e) {
- var element = $(e.target),
- parentsDl = element.closest('dl');
- parentsDl.find('dt input:radio').prop('checked', false);
- parentsDl.find('dd').addClass('no-display').end()
- .find('.items').hide()
- .find('[name^="payment["]').prop('disabled', true);
- element.prop('checked', true).parent()
- .next('dd').removeClass('no-display')
- .find('.items').show().find('[name^="payment["]').prop('disabled', false);
- },
- /**
- * make sure one payment method is selected
- * @private
- * @return {Boolean}
- */
- _validatePaymentMethod: function () {
- var methods = this.element.find('[name^="payment["]'),
- isValid = false;
- if (methods.length === 0) {
- alert({
- content: $.mage.__('We can\'t complete your order because you don\'t have a payment method set up.')
- });
- } else if (this.options.checkoutPrice <= this.options.minBalance) {
- isValid = true;
- } else if (methods.filter('input:radio:checked').length) {
- isValid = true;
- } else {
- alert({
- content: $.mage.__('Please choose a payment method.')
- });
- }
- return isValid;
- },
- /**
- * Disable and enable payment methods
- * @private
- */
- _disablePaymentMethods: function () {
- var tmpl = mageTemplate(this.options.tmpl, {
- data: {}
- });
- this.element.find('input[name="payment[method]"]').prop('disabled', true).end()
- .find('input[id^="use"][name^="payment[use"]:not(:checked)').prop('disabled', true).parent().hide();
- this.element.find('[name="payment[method]"][value="free"]').parent('dt').remove();
- this.element.find(this.options.methodsContainer).hide().find('[name^="payment["]').prop('disabled', true);
- $(tmpl).appendTo(this.element);
- },
- /**
- * Enable and enable payment methods
- * @private
- */
- _enablePaymentMethods: function () {
- this.element.find('input[name="payment[method]"]').prop('disabled', false).end()
- .find('dt input:radio:checked').trigger('click').end()
- .find('input[id^="use"][name^="payment[use"]:not(:checked)').prop('disabled', false).parent().show();
- this.element.find(this.options.methodsContainer).show();
- },
- /**
- * Returns checked payment method.
- *
- * @private
- */
- _getSelectedPaymentMethod: function () {
- return this.element.find('input[name=\'payment[method]\']:checked');
- },
- /**
- * Validate before form submit
- * @private
- * @param {EventObject} e
- */
- _submitHandler: function (e) {
- var currentMethod,
- submitButton;
- e.preventDefault();
- if (this._validatePaymentMethod()) {
- currentMethod = this._getSelectedPaymentMethod();
- submitButton = currentMethod.parent().next('dd').find('button[type=submit]');
- if (submitButton.length) {
- submitButton.first().trigger('click');
- } else {
- this.element.submit();
- }
- }
- }
- });
- return $.mage.payment;
- });
|