badblocks/pkmntrade.club
1
1
Fork 0
Code Issues 14 Pull requests Projects 1 Releases Packages Wiki Activity

Move profile and settings into the new unified dashboard, showing user info in one place

Browse source
This commit is contained in:
badblocks 2025-03-31 22:20:59 -07:00
parent 2d826734a0
commit 7edefe23c3
37 changed files with 726 additions and 500 deletions
Download patch file Download diff file Expand all files Collapse all files

62
theme/templates/trades/trade_offer_all_list.html
View file

@ -1,13 +1,13 @@
{% extends 'base.html' %}
{% load static %}
{% load static pagination_tags %}
{% block title %}All Trade Offers{% endblock title %}
{% block title %}Trade Offers{% endblock title %}
{% block content %}
<div class="container mx-auto max-w-4xl mt-6" x-data="{ allExpanded: false }">
<!-- Header-->
<div class="flex justify-between items-center mb-4">
<h1 class="text-2xl font-bold">All Trade Offers</h1>
<h1 class="text-2xl font-bold">Trade Offers</h1>
<div>
<form method="get" class="flex items-center gap-4" x-data>
<label class="cursor-pointer flex items-center gap-2">
@ -27,47 +27,23 @@
<div class="flex justify-end mb-4">
<a href="{% url 'trade_offer_create' %}" class="btn btn-success">Create New Offer</a>
</div>
<div
id="all-trade-offers"
x-data="tradeOffersPagination('{% url 'trade_offer_list' %}?')"
x-init="init()"
>
{% include "trades/_trade_offer_list_paginated.html" with offers=all_trade_offers_paginated %}
<div id="all-trade-offers"
x-data="{
page: {{ all_trade_offers_paginated.number|default:1 }},
loadOffers() {
let url = new URL('{% url 'trade_offer_list' %}', window.location.origin);
let params = new URLSearchParams(window.location.search);
params.set('page', this.page);
url.search = params.toString();
fetch(url, { headers: { 'X-Requested-With': 'XMLHttpRequest' }})
.then(response => response.text())
.then(html => { this.$el.innerHTML = html; });
}
}"
x-init="loadOffers()"
x-on:change-page.window="page = $event.detail.page; loadOffers()">
{% include "trades/_trade_offer_list.html" with offers=all_trade_offers_paginated %}
</div>
</section>
</div>
<script>
function tradeOffersPagination(baseUrl) {
return {
baseUrl: baseUrl,
loadPage(page) {
let url = new URL(this.baseUrl, window.location.origin);
url.searchParams.set("page", page);
this.$el.innerHTML = '<div class="flex justify-center items-center w-full mt-10"><span class="loading loading-dots loading-xl"></span></div>';
fetch(url, {
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => response.text())
.then(html => {
this.$el.innerHTML = html;
// Reinitialize the click events after injecting the new fragment.
this.init();
});
},
init() {
// Bind click events for AJAX pagination links within this component.
this.$el.querySelectorAll("a.ajax-page-link").forEach(link => {
link.addEventListener("click", (event) => {
event.preventDefault();
const page = link.getAttribute("data-page");
this.loadPage(page);
});
});
}
}
}
</script>
{% endblock content %}