You've already forked wc-bootstrap
magdev
7034134678
Redesign navigation with endpoint icons, offcanvas-lg responsive pattern, and sticky sidebar. Replace flat dashboard with card-based welcome greeting (avatar) and quick-action grid. Wrap all forms (edit-account, edit-address, lost/reset-password) in card sections with icon headers. Restructure view-order with summary card and status badge component. Override WooCommerce's float-based layout and max-width constraint to let Bootstrap flex grid handle sizing. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
78 lines
3.0 KiB
Twig
78 lines
3.0 KiB
Twig
{#
|
|
# View Order (Bootstrap 5 Override)
|
|
#
|
|
# Shows details of a specific order on the account page
|
|
# with summary card, status badge, and order notes.
|
|
# HPOS compatible: uses WC_Order methods only.
|
|
#
|
|
# Expected context:
|
|
# order_id - Order ID
|
|
# order - WC_Order object
|
|
#
|
|
# WooCommerce PHP equivalent: myaccount/view-order.php
|
|
#
|
|
# @package WcBootstrap
|
|
# @since 0.1.0
|
|
#}
|
|
|
|
{% set notes = order.get_customer_order_notes() %}
|
|
|
|
<div class="card shadow-sm mb-4">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<h2 class="h5 mb-0">
|
|
{{ __('Order #%s')|format(order.get_order_number()) }}
|
|
</h2>
|
|
{% include 'components/status-badge.html.twig' with { status: order.get_status() } %}
|
|
</div>
|
|
<ul class="list-group list-group-flush">
|
|
<li class="list-group-item d-flex justify-content-between">
|
|
<span class="text-body-secondary">{{ __('Date') }}</span>
|
|
<time datetime="{{ order.get_date_created().date('c')|esc_attr }}">
|
|
{{ wc_format_datetime(order.get_date_created())|esc_html }}
|
|
</time>
|
|
</li>
|
|
<li class="list-group-item d-flex justify-content-between">
|
|
<span class="text-body-secondary">{{ __('Status') }}</span>
|
|
{% include 'components/status-badge.html.twig' with { status: order.get_status() } %}
|
|
</li>
|
|
<li class="list-group-item d-flex justify-content-between">
|
|
<span class="text-body-secondary">{{ __('Total') }}</span>
|
|
<strong>{{ order.get_formatted_order_total()|wp_kses_post }}</strong>
|
|
</li>
|
|
{% if order.get_payment_method_title() %}
|
|
<li class="list-group-item d-flex justify-content-between">
|
|
<span class="text-body-secondary">{{ __('Payment method') }}</span>
|
|
<span>{{ order.get_payment_method_title()|esc_html }}</span>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
</div>
|
|
|
|
{% if notes %}
|
|
<div class="card shadow-sm mb-4">
|
|
<div class="card-header">
|
|
<h3 class="h6 mb-0">
|
|
<i class="bi bi-chat-left-text me-1" aria-hidden="true"></i>
|
|
{{ __('Order updates') }}
|
|
</h3>
|
|
</div>
|
|
<div class="list-group list-group-flush">
|
|
{% for note in notes %}
|
|
<div class="list-group-item">
|
|
<div class="d-flex justify-content-between align-items-center mb-1">
|
|
<small class="text-body-secondary">
|
|
<i class="bi bi-clock me-1" aria-hidden="true"></i>
|
|
{{ date_i18n(__('l jS \\o\\f F Y, h:ia'), strtotime(note.comment_date)) }}
|
|
</small>
|
|
</div>
|
|
<div class="mb-0">
|
|
{{ wpautop(wptexturize(note.comment_content))|raw }}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{{ do_action('woocommerce_view_order', order_id) }}
|