magdev/wc-bootstrap
1
Fork 0
Code Issues Pull Requests Actions Releases 8 Activity

Implement Phase 6 & 7: My Account and Order Details templates (Bootstrap 5, HPOS)

Browse Source 
Phase 6 - My Account (15 templates):
- Account layout with sidebar navigation (list-group) and content area
- Orders table with status badges, pagination, and responsive design
- View order with order notes as list-group items
- Address cards with edit/add buttons
- Login/Register side-by-side card layout
- Account edit, password change, downloads, payment methods forms
- Lost/reset password forms and confirmation

Phase 7 - Order Details (5 templates):
- Order details table with items, totals, and customer note
- Line item rows with refund quantity display
- Customer billing/shipping address cards
- Order tracking form
- Order again button

All order templates use WC_Order object methods only (HPOS compatible).
Bootstrap 5 components: cards, tables, list-groups, badges, forms, alerts.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Marco Grätsch
2026-02-28 10:43:30 +01:00
parent 594d810439
commit 8b1793097c
22 changed files with 1377 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
templates/myaccount/payment-methods.html.twig Normal file
View File

@@ -0,0 +1,78 @@
{#
# Payment Methods (Bootstrap 5 Override)
#
# Shows saved payment methods on the account page.
#
# WooCommerce PHP equivalent: myaccount/payment-methods.php
#
# @package WcBootstrap
# @since 0.1.0
#}
{% set saved_methods = wc_get_customer_saved_methods_list(get_current_user_id()) %}
{% set has_methods = saved_methods is not empty %}
{{ do_action('woocommerce_before_account_payment_methods', has_methods) }}
{% if has_methods %}
<div class="table-responsive">
<table class="table table-hover align-middle mb-4">
<thead class="table-light">
<tr>
{% for column_id, column_name in wc_get_account_payment_methods_columns() %}
<th>{{ column_name|esc_html }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for type, methods in saved_methods %}
{% for method in methods %}
<tr class="{% if method.is_default|default(false) %}table-active{% endif %}">
{% for column_id, column_name in wc_get_account_payment_methods_columns() %}
<td data-title="{{ column_name|esc_attr }}">
{% if column_id == 'method' %}
{% if method.method.last4 is defined and method.method.last4 %}
{{ __('%1$s ending in %2$s')|format(wc_get_credit_card_type_label(method.method.brand)|esc_html, method.method.last4|esc_html) }}
{% else %}
{{ wc_get_credit_card_type_label(method.method.brand)|esc_html }}
{% endif %}
{% if method.is_default|default(false) %}
<span class="badge text-bg-primary ms-1">{{ __('Default') }}</span>
{% endif %}
{% elseif column_id == 'expires' %}
{{ method.expires|esc_html }}
{% elseif column_id == 'actions' %}
<div class="btn-group btn-group-sm" role="group">
{% for key, action in method.actions %}
<a href="{{ action.url|esc_url }}"
class="btn btn-outline-primary {{ key }}">
{{ action.name|esc_html }}
</a>
{% endfor %}
</div>
{% else %}
{{ do_action('woocommerce_account_payment_methods_column_' ~ column_id, method) }}
{% endif %}
</td>
{% endfor %}
</tr>
{% endfor %}
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="alert alert-info" role="alert">
<i class="bi bi-info-circle me-2" aria-hidden="true"></i>
{{ __('No saved methods found.') }}
</div>
{% endif %}
{{ do_action('woocommerce_after_account_payment_methods', has_methods) }}
{% if fn('WC').payment_gateways.get_available_payment_gateways() is not empty %}
<a href="{{ wc_get_endpoint_url('add-payment-method')|esc_url }}" class="btn btn-outline-primary">
<i class="bi bi-plus-lg me-1" aria-hidden="true"></i>
{{ __('Add payment method') }}
</a>
{% endif %}