Refactor confirm modal conponent to handle forms

This commit is contained in:
wandji20
2024-10-23 16:43:25 +01:00
parent 35c50532b3
commit 9ebbcfe138
3 changed files with 27 additions and 38 deletions

View File

@@ -8,7 +8,7 @@ class ConfirmModalComponent < ModalComponent
controller: nil,
message: nil,
confirm_actions: nil,
confirm_reflexes: nil,
form_url: nil,
confirm_button_class: :primary,
confirm_button_text: I18n.t('js.admin.modals.confirm'),
cancel_button_text: I18n.t('js.admin.modals.cancel'),
@@ -17,7 +17,7 @@ class ConfirmModalComponent < ModalComponent
super(id:, close_button: true)
@confirm_actions = confirm_actions
@reflex = reflex
@confirm_reflexes = confirm_reflexes
@form_url = form_url
@controller = controller
@message = message
@confirm_button_class = confirm_button_class

View File

@@ -1,10 +1,19 @@
%div{ id: @id, "data-controller": "modal #{@controller}", "data-action": "keyup@document->modal#closeIfEscapeKey", "data-#{@controller}-reflex-value": @reflex }
.reveal-modal-bg.fade{ "data-modal-target": "background", "data-action": "click->modal#close" }
.reveal-modal.fade.tiny.modal-component{ "data-modal-target": "modal" }
= content
- if @confirm_actions
= content
= render @message if @message
= render @message if @message
%div{ class: "modal-actions #{@actions_alignment_class}" }
%input{ class: "button icon-plus #{close_button_class}", type: 'button', value: @cancel_button_text, "data-action": "click->modal#close" }
%input{ id: 'modal-confirm-button', class: "button icon-plus #{@confirm_button_class}", type: 'button', value: @confirm_button_text, "data-action": @confirm_actions, "data-reflex": @confirm_reflexes }
%div{ class: "modal-actions #{@actions_alignment_class}" }
%input{ class: "button icon-plus #{close_button_class}", type: 'button', value: @cancel_button_text, "data-action": "click->modal#close" }
%input{ id: 'modal-confirm-button', class: "button icon-plus #{@confirm_button_class}", type: 'button', value: @confirm_button_text, "data-action": @confirm_actions }
- elsif @form_url
= form_with(url: @form_url, method: :post, data: { turbo: true, controller: 'bulk-actions' }) do
= content
%p{ class: "modal-actions #{@actions_alignment_class}" }
%button.button.secondary{ type: "button", 'data-action': 'click->modal#close' }
= @cancel_button_text
%button.button.primary{ type: 'submit' }
= @confirm_button_text

View File

@@ -21,36 +21,16 @@
= render 'spree/admin/shared/custom-confirm'
= render ModalComponent.new(id: "resend_confirmation", modal_class: 'tiny', close_button: false) do
= form_with(url: resend_confirmation_emails_admin_orders_path, method: :post, data: { turbo: true, controller: 'bulk-actions' }) do
.margin-bottom-30
= t('.resend_confirmation_confirm_html')
%p.modal-actions.justify-space-around
%button.button.secondary{ type: "button", 'data-action': 'click->modal#close' }
= t('js.admin.modals.cancel')
%button.button.primary{ type: 'submit' }
= t('js.admin.modals.confirm')
= render ConfirmModalComponent.new(id: "resend_confirmation", form_url: resend_confirmation_emails_admin_orders_path) do
.margin-bottom-30
= t('.resend_confirmation_confirm_html')
= render ModalComponent.new(id: "send_invoice", modal_class: 'tiny', close_button: false) do
= form_with(url: send_invoices_admin_orders_path, method: :post, data: { turbo: true, controller: 'bulk-actions' }) do
.margin-bottom-30
= t('.send_invoice_confirm_html')
%p.modal-actions.justify-space-around
%button.button.secondary{ type: "button", 'data-action': 'click->modal#close' }
= t('js.admin.modals.cancel')
%button.button.primary{ type: 'submit' }
= t('js.admin.modals.confirm')
= render ConfirmModalComponent.new(id: "send_invoice", form_url: send_invoices_admin_orders_path) do
.margin-bottom-30
= t('.send_invoice_confirm_html')
= render ModalComponent.new(id: "cancel_orders", modal_class: 'tiny', close_button: false) do
= form_with(url: cancel_orders_admin_orders_path, method: :post, data: { turbo: true, controller: 'bulk-actions' }) do
.margin-bottom-30
= t("js.admin.orders.cancel_the_order_html")
.margin-bottom-30
= render partial: "spree/admin/orders/messages/cancel_orders"
%p.modal-actions.justify-space-around
%button.button.secondary{ type: "button", 'data-action': 'click->modal#close' }
= t('js.admin.modals.cancel')
%button.button.primary{ type: 'submit' }
= t('js.admin.modals.confirm')
= render ConfirmModalComponent.new(id: "cancel_orders", form_url: cancel_orders_admin_orders_path) do
.margin-bottom-30
= t("js.admin.orders.cancel_the_order_html")
.margin-bottom-30
= render partial: "spree/admin/orders/messages/cancel_orders"