sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: update frontend templates for Letzshop order management

Browse Source 
- Add Letzshop order detail page template
- Update orders list template
- Update Letzshop orders tab with improved UI
- Add JavaScript for order confirmation flow

Note: Frontend needs alignment with new unified order schema.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Samir Boulahtit
2025-12-19 21:18:48 +01:00
parent fceaba703e
commit 8e8d1d1ac0
6 changed files with 739 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
app/templates/admin/marketplace-letzshop.html
View File

@@ -252,18 +252,33 @@
@click.stop
>
<header class="flex justify-between items-center mb-4">
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-200">Order Details</h3>
<div class="flex items-center gap-3">
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-200">Order Details</h3>
<a
:href="'/admin/letzshop/orders/' + selectedOrder?.id"
class="text-xs text-purple-600 hover:text-purple-800 dark:text-purple-400 flex items-center gap-1"
title="Open full order page"
>
<span x-html="$icon('external-link', 'w-3 h-3')"></span>
Full View
</a>
</div>
<button @click="showOrderModal = false" class="text-gray-400 hover:text-gray-600">
<span x-html="$icon('x', 'w-5 h-5')"></span>
</button>
</header>
<div x-show="selectedOrder" class="space-y-4">
<!-- Order Info Grid -->
<div class="grid grid-cols-2 gap-4 text-sm">
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Order Number:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="selectedOrder?.letzshop_order_number"></span>
</div>
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Order Date:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="formatDate(selectedOrder?.order_date || selectedOrder?.created_at)"></span>
</div>
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Status:</span>
<span
@@ -277,29 +292,67 @@
x-text="selectedOrder?.sync_status === 'rejected' ? 'DECLINED' : selectedOrder?.sync_status?.toUpperCase()"
></span>
</div>
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Customer:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="selectedOrder?.customer_email"></span>
</div>
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Total:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="selectedOrder?.total_amount + ' ' + selectedOrder?.currency"></span>
</div>
<div x-show="selectedOrder?.tracking_number">
<span class="font-medium text-gray-600 dark:text-gray-400">Tracking:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="selectedOrder?.tracking_number + ' (' + selectedOrder?.tracking_carrier + ')'"></span>
</div>
<div>
<span class="font-medium text-gray-600 dark:text-gray-400">Created:</span>
<span class="ml-2 text-gray-700 dark:text-gray-300" x-text="formatDate(selectedOrder?.created_at)"></span>
</div>
<!-- Customer & Shipping Info -->
<div class="border-t border-gray-200 dark:border-gray-600 pt-4">
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center gap-2">
<span x-html="$icon('user', 'w-4 h-4')"></span>
Customer & Shipping
</h4>
<div class="grid grid-cols-2 gap-4 text-sm">
<div>
<p class="text-gray-600 dark:text-gray-400">
<span class="font-medium">Name:</span>
<span class="ml-1" x-text="selectedOrder?.customer_name || 'N/A'"></span>
</p>
<p class="text-gray-600 dark:text-gray-400">
<span class="font-medium">Email:</span>
<a :href="'mailto:' + selectedOrder?.customer_email" class="ml-1 text-purple-600 hover:underline" x-text="selectedOrder?.customer_email"></a>
</p>
<p class="text-gray-600 dark:text-gray-400" x-show="selectedOrder?.customer_locale">
<span class="font-medium">Language:</span>
<span class="ml-1 uppercase" x-text="selectedOrder?.customer_locale"></span>
</p>
</div>
<div x-show="selectedOrder?.shipping_country_iso">
<p class="text-gray-600 dark:text-gray-400">
<span class="font-medium">Ship to:</span>
<span class="ml-1" x-text="selectedOrder?.shipping_country_iso"></span>
</p>
</div>
</div>
</div>
<div x-show="selectedOrder?.inventory_units?.length > 0">
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-2">
<!-- Tracking Info -->
<div x-show="selectedOrder?.tracking_number" class="border-t border-gray-200 dark:border-gray-600 pt-4">
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center gap-2">
<span x-html="$icon('truck', 'w-4 h-4')"></span>
Tracking
</h4>
<div class="text-sm bg-blue-50 dark:bg-blue-900/20 rounded-lg p-3">
<p class="text-gray-700 dark:text-gray-300">
<span class="font-medium">Carrier:</span>
<span class="ml-1" x-text="selectedOrder?.tracking_carrier"></span>
</p>
<p class="text-gray-700 dark:text-gray-300">
<span class="font-medium">Tracking #:</span>
<span class="ml-1 font-mono" x-text="selectedOrder?.tracking_number"></span>
</p>
</div>
</div>
<!-- Order Items -->
<div x-show="selectedOrder?.inventory_units?.length > 0" class="border-t border-gray-200 dark:border-gray-600 pt-4">
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center gap-2">
<span x-html="$icon('shopping-bag', 'w-4 h-4')"></span>
Items
<span class="text-xs font-normal text-gray-500">
(Each item must be confirmed or declined individually)
(<span x-text="selectedOrder?.inventory_units?.length"></span> item<span x-show="selectedOrder?.inventory_units?.length > 1">s</span>)
</span>
</h4>
<div class="space-y-2">