Skip to content

Commit 378ed49

Browse files
authored
Merge pull request #5461 from nebulab/rainerd/admin/order/address-form
[Admin] Order process: Integrate address form component for billing and shipping
2 parents 54712c7 + 3a5daf8 commit 378ed49

File tree

20 files changed

+278
-52
lines changed

20 files changed

+278
-52
lines changed
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<div class="<%= stimulus_id %>">
2+
<%= render component("orders/show").new(order: @order) %>
3+
<%= render component("ui/modal").new(title: t(".title.#{@type}"), close_path: solidus_admin.order_path(@order)) do |modal| %>
4+
<%= form_for @order, url: solidus_admin.send("order_#{@type}_address_path", @order), html: { id: form_id } do |form| %>
5+
<div class="w-full flex flex-col mb-4">
6+
<h2 class="text-sm mb-4 font-semibold"><%= t(".subtitle.#{@type}") %></h2>
7+
<div class="w-full flex gap-4">
8+
<%= form.fields_for :"#{@type}_address" do |address_form| %>
9+
<%= render component('ui/forms/address').new(form: address_form, disabled: false) %>
10+
<% end %>
11+
</div>
12+
13+
<label class="flex gap-2 items-center">
14+
<%= form.hidden_field use_attribute, value: '0', id: false %>
15+
16+
<%= render component("ui/forms/checkbox").new(
17+
name: "#{form.object_name}[#{use_attribute}]",
18+
checked: form.object.send("#{@type}_address").new_record? || form.object.bill_address == form.object.ship_address,
19+
value: '1'
20+
) %>
21+
22+
<span class="body-text-sm">
23+
<%= t(".use_this_address.#{@type}") %>
24+
</span>
25+
</label>
26+
</div>
27+
<% end %>
28+
29+
<% modal.with_actions do %>
30+
<%= render component("ui/button").new(
31+
tag: :a,
32+
scheme: :secondary,
33+
text: t(".cancel"),
34+
href: solidus_admin.order_path(@order)
35+
) %>
36+
37+
<%= render component("ui/button").new(
38+
tag: :button,
39+
text: t(".save"),
40+
form: form_id
41+
) %>
42+
<% end %>
43+
<% end %>
44+
</div>
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# frozen_string_literal: true
2+
3+
class SolidusAdmin::Orders::Show::Address::Component < SolidusAdmin::BaseComponent
4+
include SolidusAdmin::Layout::PageHelpers
5+
6+
VALID_TYPES = ['ship', 'bill'].freeze
7+
8+
def initialize(order:, type: 'ship')
9+
@order = order
10+
@type = validate_address_type(type)
11+
end
12+
13+
def form_id
14+
@form_id ||= "#{stimulus_id}--form-#{@type}-#{@order.id}"
15+
end
16+
17+
def use_attribute
18+
case @type
19+
when 'ship'
20+
'use_shipping'
21+
when 'bill'
22+
'use_billing'
23+
end
24+
end
25+
26+
def validate_address_type(type)
27+
VALID_TYPES.include?(type) ? type : raise(ArgumentError, "Invalid address type: #{type}")
28+
end
29+
end
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# Add your component translations here.
2+
# Use the translation in the example in your template with `t(".hello")`.
3+
en:
4+
save: Save
5+
cancel: Cancel
6+
back: Back
7+
title:
8+
ship: Edit Shipping Address
9+
bill: Edit Billing Address
10+
subtitle:
11+
ship: Shipping Address
12+
bill: Billing Address
13+
use_this_address:
14+
ship: Use this address also for Billing
15+
bill: Use this address also for Shipping

admin/app/components/solidus_admin/orders/show/component.html.erb

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<%= page_with_sidebar_aside do %>
1717
<%= render component('ui/panel').new(title: panel_title_with_more_links(t(".customer"), [
1818
link_to(t(".edit_email"), solidus_admin.order_customer_path(@order), class: "p-2 hover:bg-gray-25 rounded-sm text-black"),
19-
link_to(t(".edit_shipping"), "#", class: "p-2 hover:bg-gray-25 rounded-sm text-black"),
20-
link_to(t(".edit_billing"), "#", class: "p-2 hover:bg-gray-25 rounded-sm text-black"),
19+
link_to(t(".edit_shipping"), solidus_admin.new_order_ship_address_path(@order), class: "p-2 hover:bg-gray-25 rounded-sm text-black"),
20+
link_to(t(".edit_billing"), solidus_admin.new_order_bill_address_path(@order), class: "p-2 hover:bg-gray-25 rounded-sm text-black"),
2121
link_to(t(".remove_customer"), solidus_admin.order_customer_path(@order), 'data-turbo-method': :delete, class: "p-2 hover:bg-gray-25 rounded-sm text-red-500"),
2222
])) do %>
2323
<div class="flex flex-col -m-6 p-6 gap-6 border-t border-gray-100 mt-0">

admin/app/components/solidus_admin/orders/show/component.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,6 @@ import { Controller } from '@hotwired/stimulus'
22

33
export default class extends Controller {
44
closeMenus() {
5-
this.event.querySelectorAll('details').forEach(details => details.removeAttribute('open'));
5+
this.element.querySelectorAll('details').forEach(details => details.removeAttribute('open'));
66
}
77
}

admin/app/components/solidus_admin/orders/show/component.rb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ def format_address(address)
2121
address.address2,
2222
address.city,
2323
address.zipcode,
24-
address.state.name,
24+
address.state&.name,
2525
tag.br,
2626
address.country.name,
2727
tag.br,

admin/app/components/solidus_admin/ui/forms/address/component.html.erb

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66
<%= render component("ui/forms/field").text_field(@form, :name) %>
77
<%= render component("ui/forms/field").text_field(@form, :address1) %>
88
<%= render component("ui/forms/field").text_field(@form, :address2) %>
9-
<div class="flex w-full space-x-4">
10-
<%= render component("ui/forms/field").text_field(@form, :city, class: "flex-1") %>
11-
<%= render component("ui/forms/field").text_field(@form, :zipcode, class: "flex-1") %>
9+
<div class="flex gap-4 w-full">
10+
<%= render component("ui/forms/field").text_field(@form, :city) %>
11+
<%= render component("ui/forms/field").text_field(@form, :zipcode) %>
1212
</div>
1313

1414
<%= render component("ui/forms/field").select(
@@ -23,8 +23,9 @@
2323
<%= render component("ui/forms/field").select(
2424
@form,
2525
:state_id,
26-
[],
26+
state_options,
2727
value: @form.object.try(:state_id),
28+
disabled: @form.object.country&.states&.empty?,
2829
"data-#{stimulus_id}-target": "state"
2930
) %>
3031

admin/app/components/solidus_admin/ui/forms/address/component.js

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,6 @@ import { Controller } from '@hotwired/stimulus'
33
export default class extends Controller {
44
static targets = ["country", "state"]
55

6-
connect() {
7-
this.loadStates()
8-
}
9-
106
loadStates() {
117
const countryId = this.countryTarget.value
128

@@ -22,12 +18,17 @@ export default class extends Controller {
2218

2319
stateSelect.innerHTML = ""
2420

25-
data.forEach(state => {
26-
const option = document.createElement("option")
21+
if (data.length === 0) {
22+
stateSelect.disabled = true
23+
} else {
24+
stateSelect.disabled = false
2725

28-
option.value = state.id
29-
option.innerText = state.name
30-
stateSelect.appendChild(option)
31-
})
26+
data.forEach((state) => {
27+
const option = document.createElement("option")
28+
option.value = state.id
29+
option.innerText = state.name
30+
stateSelect.appendChild(option)
31+
})
32+
}
3233
}
3334
}

admin/app/components/solidus_admin/ui/forms/address/component.rb

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,9 @@ def initialize(form:, disabled: false)
55
@form = form
66
@disabled = disabled
77
end
8+
9+
def state_options
10+
return [] unless @form.object.country
11+
@form.object.country.states.map { |s| [s.name, s.id] }
12+
end
813
end

admin/app/components/solidus_admin/ui/modal/component.html.erb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
) %>
2424
</header>
2525

26-
<div class="p-4 overflow-auto max-h-96">
26+
<div class="p-4 overflow-auto">
2727
<%= content %>
2828
</div>
2929

0 commit comments

Comments
 (0)