Skip to content

Commit 1bdfbb7

Browse files
committed
[wip] Add orders/show/shipment component
1 parent 9413383 commit 1bdfbb7

File tree

9 files changed

+160
-0
lines changed

9 files changed

+160
-0
lines changed

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

+6
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,12 @@
1212
<%= page_with_sidebar_main do %>
1313
<%= render component("orders/cart").new(order: @order) %>
1414
<%= render component("orders/show/summary").new(order: @order) %>
15+
16+
<%= render component('ui/panel').new(title: t('.shipments')) do %>
17+
<% @order.shipments.each do |shipment| %>
18+
<%= render component("orders/show/shipment").new(shipment: @shipment) %>
19+
<% end %>
20+
<% end %>
1521
<% end %>
1622

1723
<%= page_with_sidebar_aside do %>

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

+1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ en:
99
order_email: Order contact email
1010
back: Back to orders
1111
same_as_shipping: Same as shipping address
12+
shipments: Shipments
1213

1314
edit_email: "Edit order email"
1415
add_email: "Add order email"
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
<div class="<%= stimulus_id %>" data-controller="<%= stimulus_id %>">
2+
<div class="rounded p-2">
3+
<%= render component('ui/panel').new(title: @shipment.number) do |panel| %>
4+
<% panel.with_section(wide: true, high: true) do %>
5+
<div class="rounded-b-lg overflow-hidden">
6+
<table class="table-auto w-full">
7+
<thead>
8+
<tr>
9+
<th class="text-left body-small-bold text-gray-800 bg-gray-15 px-6 py-3 leading-none">Product</th>
10+
<th class="text-left body-small-bold text-gray-800 bg-gray-15 px-6 py-3 leading-none w-16">Quantity</th>
11+
<th class="text-left body-small-bold text-gray-800 bg-gray-15 px-6 py-3 leading-none w-16 whitespace-nowrap">Total Price</th>
12+
<th class="text-left body-small-bold text-gray-800 bg-gray-15 px-6 py-3 leading-none w-16"><span class="sr-only">Actions</span></th>
13+
</tr>
14+
</thead>
15+
<tbody>
16+
<%
17+
shipment_manifest = Spree::ShippingManifest.new(
18+
inventory_units: @shipment.last.inventory_units.where(carton_id: nil),
19+
).items.sort_by { |item| item.line_item.created_at }
20+
%>
21+
22+
<% shipment_manifest.each do |item| %>
23+
<tr class="border-gray-100 border-t">
24+
<td class="px-6 py-4">
25+
<div class="flex gap-2 grow">
26+
<% variant = item.variant %>
27+
<%= render component("ui/thumbnail").new(
28+
src: (variant.images.first || variant.product.gallery.images.first)&.url(:small),
29+
alt: variant.name
30+
) %>
31+
<div class="flex-col">
32+
<div class="leading-5 text-black body-small-bold"><%= variant.name %></div>
33+
<div class="leading-5 text-gray-500 body-small">
34+
SKU: <%= variant.sku %>
35+
<%= variant.options_text.presence&.prepend("- ") %>
36+
</div>
37+
</div>
38+
</div>
39+
</td>
40+
<td class="px-6 py-4">
41+
<span class="text-gray-500 body-small whitespace-nowrap">
42+
<% item.states.each do |state, count| %>
43+
<%= count %> x <%= t(state, scope: '.inventory_states') %>
44+
<% end %>
45+
</span>
46+
</td>
47+
<td class="px-6 py-4">
48+
<span class="text-gray-500 body-small"><%= item.line_item.display_amount %></span>
49+
</td>
50+
<td class="px-6 py-4 text-right">
51+
<%= form_for(item.line_item, url: '#', method: :delete) do |f| %>
52+
<%= render component('ui/button').new(
53+
scheme: :ghost,
54+
size: :s,
55+
title: t("spree.delete"),
56+
icon: 'close-line',
57+
"data-controller": "confirm",
58+
"data-confirm-text-value": t("spree.are_you_sure"),
59+
) %>
60+
<% end %>
61+
</td>
62+
</tr>
63+
<% end %>
64+
<tr class="border-gray-100 border-t">
65+
<td colspan="4" class="px-6 py-4">
66+
<%= form_for(@shipment, url: '#') do |f| %>
67+
<%= render component("ui/forms/field").select(
68+
f,
69+
:shipping_method,
70+
Spree::ShippingMethod.order(:name).pluck(:name, :id),
71+
class: "mb-4"
72+
) %>
73+
74+
<%= render component("ui/forms/field").text_field(
75+
f,
76+
:tracking
77+
) %>
78+
<% end %>
79+
</td>
80+
</tr>
81+
</tbody>
82+
</table>
83+
</div>
84+
<% end %>
85+
<% end %>
86+
</div>
87+
</div>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { Controller } from '@hotwired/stimulus'
2+
3+
export default class extends Controller {
4+
static targets = ['output']
5+
6+
typed(event) {
7+
this.text = event.currentTarget.value
8+
this.render()
9+
}
10+
11+
render() {
12+
this.outputTarget.innerText = this.text
13+
}
14+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# frozen_string_literal: true
2+
3+
class SolidusAdmin::Orders::Show::Shipment::Component < SolidusAdmin::BaseComponent
4+
def initialize(shipment:)
5+
@shipment = shipment
6+
end
7+
end
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
en:
2+
inventory_states:
3+
backordered: Backordered
4+
canceled: Canceled
5+
on_hand: On hand
6+
returned: Returned
7+
shipped: Shipped
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# frozen_string_literal: true
2+
3+
# @component "orders/show/shipment"
4+
class SolidusAdmin::Orders::Show::Shipment::ComponentPreview < ViewComponent::Preview
5+
include SolidusAdmin::Preview
6+
7+
def overview
8+
render_with_template
9+
end
10+
11+
# @param shipment text
12+
def playground(shipment: "shipment")
13+
render component("orders/show/shipment").new(shipment: shipment)
14+
end
15+
end
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div class="mb-8">
2+
<h6 class="text-gray-500 mb-3 mt-0">
3+
Scenario 1
4+
</h6>
5+
6+
<%= render current_component.new(shipment: "shipment") %>
7+
</div>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# frozen_string_literal: true
2+
3+
require "spec_helper"
4+
5+
RSpec.describe SolidusAdmin::Orders::Show::Shipment::Component, type: :component do
6+
it "renders the overview preview" do
7+
render_preview(:overview)
8+
end
9+
10+
# it "renders something useful" do
11+
# render_inline(described_class.new(shipment: "shipment"))
12+
#
13+
# expect(page).to have_text "Hello, components!"
14+
# expect(page).to have_css '.value'
15+
# end
16+
end

0 commit comments

Comments
 (0)