chore: No more javascript in show

This commit is contained in:
kbe
2025-08-30 14:02:41 +02:00
parent 394190ace8
commit 58dbcf3a6a
2 changed files with 19 additions and 306 deletions

View File

@@ -1,41 +1,4 @@
<div class="bg-white rounded-xl border <%= sold_out ? "border-gray-200 opacity-75" : "border-purple-200" %> shadow-sm overflow-hidden"
x-data="{
quantity: 0,
max: <%= remaining %>,
ticketTypeId: <%= id %>,
name: '<%= name %>',
price: <%= price_cents %>
}"
x-init="
$watch('quantity', (value) => {
$dispatch('update-cart-item', {
ticketTypeId: ticketTypeId,
name: name,
price: price,
quantity: value,
max: max
});
});
$nextTick(() => {
$dispatch('cart-initialized', { ticketTypeId: ticketTypeId });
});
"
@update-cart-item.window="
if ($event.detail.ticketTypeId === ticketTypeId) {
quantity = $event.detail.quantity;
}
"
@cart-change.window="
if (!$event.detail.cart[ticketTypeId]) {
quantity = 0;
}
"
@restore-cart.window="
if ($event.detail.cart[ticketTypeId]) {
quantity = $event.detail.cart[ticketTypeId].quantity;
}
">
<div class="bg-white rounded-xl border <%= sold_out ? "border-gray-200 opacity-75" : "border-purple-200" %> shadow-sm overflow-hidden">
<div class="p-5">
<div class="flex justify-between items-start mb-3">
<div>
@@ -72,19 +35,18 @@
<div class="flex items-center space-x-2 order-1 sm:order-2">
<button type="button"
class="w-8 h-8 rounded-full bg-gray-100 hover:bg-gray-200 flex items-center justify-center transition-colors duration-200"
@click="quantity = Math.max(0, quantity - 1)"
:disabled="quantity <= 0">
disabled>
<span class="text-gray-600 font-bold">-</span>
</button>
<input type="number"
min="0"
:max="max"
x-model="quantity"
class="w-12 text-center border border-gray-300 rounded-md px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-1">
max="<%= remaining %>"
value="0"
class="w-12 text-center border border-gray-300 rounded-md px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-1"
disabled>
<button type="button"
class="w-8 h-8 rounded-full bg-gray-100 hover:bg-gray-200 flex items-center justify-center transition-colors duration-200"
@click="quantity = Math.min(max, quantity + 1)"
:disabled="quantity >= max">
disabled>
<span class="text-gray-600 font-bold">+</span>
</button>
</div>