Fix create trade offer flow and other related bugs
This commit is contained in:
parent
f3a1366269
commit
65ca344582
40 changed files with 867 additions and 278 deletions
91
theme/templates/cards/card_detail.html
Normal file
91
theme/templates/cards/card_detail.html
Normal file
|
|
@ -0,0 +1,91 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static card_badge %}
|
||||
{% block content %}
|
||||
<div class="container mx-auto p-4">
|
||||
<!-- Card header with badge and details -->
|
||||
<div class="flex items-center mb-6">
|
||||
<div class="ml-4">
|
||||
<h1 class="text-3xl font-bold">{{card.name}}</h1>
|
||||
<h2 class="text-lg text-gray-500">{{ card.cardset }} #{{ card.cardnum }} • {{ card.rarity_icon }}</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Trade Offers sections -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
|
||||
<!-- Trade Offers: Have -->
|
||||
<div x-data="{
|
||||
order: 'newest',
|
||||
page: 1,
|
||||
loadOffers() {
|
||||
document.activeElement.blur();
|
||||
fetch(`{% url 'cards:card_trade_offer_have_list' card.pk %}?order=` + this.order + '&page=' + this.page)
|
||||
.then(response => response.text())
|
||||
.then(html => { this.$refs.offerList.innerHTML = html; });
|
||||
}
|
||||
}"
|
||||
x-init="loadOffers()"
|
||||
x-on:change-page-have.window="page = $event.detail.page; loadOffers()"
|
||||
class="p-4">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h2 class="text-xl font-semibold">Have this Card ({{ trade_offer_have_count }})</h2>
|
||||
<!-- DaisyUI dropdown replacing the select -->
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn m-1" x-text="order === 'newest' ? 'Newest 🞃' : 'Oldest 🞃'"></div>
|
||||
<ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box z-1 w-26 p-2 shadow-sm">
|
||||
<li>
|
||||
<a href="#" @click.prevent="order = 'newest'; page = 1; loadOffers()">
|
||||
Newest
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" @click.prevent="order = 'oldest'; page = 1; loadOffers()">
|
||||
Oldest
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div x-ref="offerList">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Trade Offers: Want -->
|
||||
<div x-data="{
|
||||
order: 'newest',
|
||||
page: 1,
|
||||
loadOffers() {
|
||||
fetch(`{% url 'cards:card_trade_offer_want_list' card.pk %}?order=` + this.order + '&page=' + this.page)
|
||||
.then(response => response.text())
|
||||
.then(html => { this.$refs.offerList.innerHTML = html; });
|
||||
}
|
||||
}"
|
||||
x-init="loadOffers()"
|
||||
x-on:change-page.window="page = $event.detail.page; loadOffers()"
|
||||
class="p-4">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h2 class="text-xl font-semibold">Want this Card ({{ trade_offer_want_count }})</h2>
|
||||
<!-- DaisyUI dropdown replacing the select -->
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn m-1" x-text="order === 'newest' ? 'Newest 🞃' : 'Oldest 🞃'"></div>
|
||||
<ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box z-1 w-26 p-2 shadow-sm">
|
||||
<li>
|
||||
<a href="#" @click.prevent="order = 'newest'; page = 1; loadOffers()">
|
||||
Newest
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" @click.prevent="order = 'oldest'; page = 1; loadOffers()">
|
||||
Oldest
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div x-ref="offerList">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Loading…
Add table
Add a link
Reference in a new issue