diff --git a/CHANGELOG.md b/CHANGELOG.md index d89c41786c0..617db7aa6ad 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,8 @@ ## Solidus 2.2.0 (master, unreleased) +* Promotion and Shipping calculators can be created or have their type + changed without saving and reloading the page. [#1618](https://github.com/solidusio/solidus/pull/1618) + ## Solidus 2.1.0 (unreleased) * The OrderUpdater (as used by `order.update!`) now fully updates taxes. diff --git a/backend/app/assets/javascripts/spree/backend/calculator.js b/backend/app/assets/javascripts/spree/backend/calculator.js index fd39f36cda6..001f62abe5f 100644 --- a/backend/app/assets/javascripts/spree/backend/calculator.js +++ b/backend/app/assets/javascripts/spree/backend/calculator.js @@ -1,16 +1,26 @@ +Spree.CalculatorEditView = Backbone.View.extend({ + events: { + "change .js-calculator-type": "render", + }, + + initialize: function() { + this.render(); + }, + + render: function() { + var selected_class = this.$('.js-calculator-type option:selected').val(); + this.$('.js-calculator-preferences').each(function() { + var selected = ($(this).data('calculator-type') === selected_class); + $(this).find(':input').prop("disabled", !selected); + $(this).toggle(selected); + }); + } +}) + $(function() { - var calculator_select = $('select#calc_type') - var original_calc_type = calculator_select.prop('value'); - $('.calculator-settings-warning').hide(); - calculator_select.change(function() { - if (calculator_select.prop('value') == original_calc_type) { - $('div.calculator-settings').show(); - $('.calculator-settings-warning').hide(); - $('.calculator-settings').find('input,textarea').prop("disabled", false); - } else { - $('div.calculator-settings').hide(); - $('.calculator-settings-warning').show(); - $('.calculator-settings').find('input,texttarea').prop("disabled", true); - } + $('.js-calculator-fields').each(function() { + new Spree.CalculatorEditView({ + el: this + }); }); -}) +}); diff --git a/backend/app/assets/javascripts/spree/backend/promotions.js.coffee b/backend/app/assets/javascripts/spree/backend/promotions.js.coffee index 6605fab3e59..fcfaadc36e8 100644 --- a/backend/app/assets/javascripts/spree/backend/promotions.js.coffee +++ b/backend/app/assets/javascripts/spree/backend/promotions.js.coffee @@ -1,4 +1,49 @@ -window.initProductActions = -> + +# +# Tiered Calculator +# +TieredCalculatorView = Backbone.View.extend + initialize: -> + @calculatorName = @$('.js-tiers').data('calculator') + @tierFieldsTemplate = HandlebarsTemplates["promotions/calculators/fields/#{@calculatorName}"] + @originalTiers = @$('.js-tiers').data('original-tiers') + @formPrefix = @$('.js-tiers').data('form-prefix') + + for base, value of @originalTiers + @$('.js-tiers').append @tierFieldsTemplate + baseField: + value: base + valueField: + name: @tierInputName(base) + value: value + + events: + 'click .js-add-tier': 'onAdd' + 'click .js-remove-tier': 'onRemove' + 'change .js-base-input': 'onChange' + + tierInputName: (base) -> + "#{@formPrefix}[calculator_attributes][preferred_tiers][#{base}]" + + onAdd: (event) -> + event.preventDefault() + @$('.js-tiers').append @tierFieldsTemplate(valueField: name: null) + + onRemove: (event) -> + event.preventDefault() + $(event.target).parents('.tier').remove() + + onChange: (event) -> + valueInput = $(event.target).parents('.tier').find('.js-value-input') + valueInput.attr 'name', @tierInputName($(event.target).val()) + +initTieredCalculators = -> + $('.js-tiered-calculator').each -> + if !$(this).data('has-view') + $(this).data('has-view', true) + new TieredCalculatorView(el: this) + +window.initPromotionActions = -> # Add classes on promotion items for design $(document).on 'mouseover', 'a.delete', (event) -> $(this).parent().addClass 'action-remove' @@ -8,23 +53,6 @@ window.initProductActions = -> $('#promotion-filters').find('.variant_autocomplete').variantAutocomplete() - $('.calculator-fields').each -> - $fields_container = $(this) - $type_select = $fields_container.find('.type-select') - $settings = $fields_container.find('.settings') - $warning = $fields_container.find('.warning') - originalType = $type_select.val() - $warning.hide() - $type_select.change -> - if $(this).val() == originalType - $warning.hide() - $settings.show() - $settings.find('input').removeProp 'disabled' - else - $warning.show() - $settings.hide() - $settings.find('input').prop 'disabled', 'disabled' - # # Option Value Promo Rule # @@ -66,36 +94,6 @@ window.initProductActions = -> optionValueSelect.prop('disabled', $(this).val() == '').select2 'val', '' return - # - # Tiered Calculator - # - if $('.js-tiers').length - calculatorName = $('.js-tiers').data('calculator') - tierFieldsTemplate = HandlebarsTemplates["promotions/calculators/fields/#{calculatorName}"] - originalTiers = $('.js-tiers').data('original-tiers') - formPrefix = $('.js-tiers').data('form-prefix') - - tierInputName = (base) -> - "#{formPrefix}[calculator_attributes][preferred_tiers][#{base}]" - - $.each originalTiers, (base, value) -> - $('.js-tiers').append tierFieldsTemplate - baseField: - value: base - valueField: - name: tierInputName(base) - value: value - - $(document).on 'click', '.js-add-tier', (event) -> - event.preventDefault() - $('.js-tiers').append tierFieldsTemplate(valueField: name: null) - - $(document).on 'click', '.js-remove-tier', (event) -> - event.preventDefault() - $(this).parents('.tier').remove() - - $(document).on 'change', '.js-base-input', (event) -> - valueInput = $(this).parents('.tier').find('.js-value-input') - valueInput.attr 'name', tierInputName($(this).val()) + initTieredCalculators() -$ initProductActions +$ initPromotionActions diff --git a/backend/app/views/spree/admin/promotion_actions/create.js.erb b/backend/app/views/spree/admin/promotion_actions/create.js.erb index 9700fc67170..ea8371ec7d0 100644 --- a/backend/app/views/spree/admin/promotion_actions/create.js.erb +++ b/backend/app/views/spree/admin/promotion_actions/create.js.erb @@ -5,9 +5,10 @@ $(document).ready(function(){ //enable select2 functions for recently added box $('.type-select.select2').last().select2(); }); -initProductActions(); +initPromotionActions(); $('#<%= dom_id @promotion_action %>').hide(); $('#<%= dom_id @promotion_action %>').fadeIn(); +new Spree.CalculatorEditView({el: $('#<%= dom_id @promotion_action %> .js-calculator-fields')}); diff --git a/backend/app/views/spree/admin/promotions/actions/_promotion_calculators_with_custom_fields.html.erb b/backend/app/views/spree/admin/promotions/actions/_promotion_calculators_with_custom_fields.html.erb index 47c8b7560b5..7aa14bc5cd4 100644 --- a/backend/app/views/spree/admin/promotions/actions/_promotion_calculators_with_custom_fields.html.erb +++ b/backend/app/views/spree/admin/promotions/actions/_promotion_calculators_with_custom_fields.html.erb @@ -1,5 +1,5 @@