Fix moderation submission display:

- Add location map template for view mode
- Add coaster fields template for stats
- Fix location and stats display in both view and edit modes
This commit is contained in:
pacnpal
2024-11-14 02:16:04 +00:00
parent e86cb95f14
commit 891c29beff
2 changed files with 114 additions and 85 deletions

View File

@@ -0,0 +1,23 @@
{% load moderation_tags %}
<div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50">
<h3 class="mb-4 text-lg font-semibold">Location</h3>
<div class="h-[300px] w-full rounded-lg border border-gray-300 dark:border-gray-600"
id="viewMap-{{ submission.id }}"
x-init="setTimeout(() => {
const map = L.map('viewMap-{{ submission.id }}').setView([{{ location.latitude }}, {{ location.longitude }}], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
L.marker([{{ location.latitude }}, {{ location.longitude }}]).addTo(map);
}, 100)"></div>
<div class="mt-4 space-y-2 text-sm text-gray-600 dark:text-gray-400">
{% if location.street_address %}<div>{{ location.street_address }}</div>{% endif %}
<div>
{% if location.city %}{{ location.city }}{% endif %}
{% if location.state %}, {{ location.state }}{% endif %}
{% if location.postal_code %} {{ location.postal_code }}{% endif %}
</div>
{% if location.country %}<div>{{ location.country }}</div>{% endif %}
</div>
</div>

View File

@@ -100,77 +100,84 @@
</div> </div>
{% endif %} {% endif %}
<!-- View Mode --> <!-- View Mode -->
<div x-show="!isEditing" <div x-show="!isEditing"
class="grid grid-cols-1 gap-3 md:grid-cols-2"> class="grid grid-cols-1 gap-3 md:grid-cols-2">
{% for field, value in submission.changes.items %} {% for field, value in submission.changes.items %}
{% if field != 'model_name' %} {% if field != 'model_name' and field != 'latitude' and field != 'longitude' and field != 'street_address' and field != 'city' and field != 'state' and field != 'postal_code' and field != 'country' %}
<div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50"> <div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50">
<div class="text-sm font-medium text-gray-900 dark:text-gray-300"> <div class="text-sm font-medium text-gray-900 dark:text-gray-300">
{{ field|title }}: {{ field|title }}:
</div>
<div class="mt-1.5 text-gray-600 dark:text-gray-400">
{% if field == 'opening_date' or field == 'closing_date' or field == 'status_since' %}
{{ value|date:"Y-m-d" }}
{% elif field == 'size_acres' %}
{{ value }} acres
{% elif field == 'website' %}
<a href="{{ value }}" target="_blank" class="text-blue-600 hover:text-blue-500 dark:text-blue-400 dark:hover:text-blue-300">
{{ value }}
</a>
{% elif field == 'park' %}
{% with park_name=value|get_object_name:'parks.Park' %}
{{ park_name }}
{% endwith %}
{% elif field == 'designer' %}
{% with designer_name=value|get_object_name:'designers.Designer' %}
{{ designer_name|default:'None' }}
{% endwith %}
{% elif field == 'manufacturer' %}
{% with manufacturer_name=value|get_object_name:'companies.Manufacturer' %}
{{ manufacturer_name|default:'None' }}
{% endwith %}
{% elif field == 'ride_model' %}
{% with model_name=value|get_object_name:'rides.RideModel' %}
{{ model_name|default:'None' }}
{% endwith %}
{% elif field == 'park_area' %}
{% with park_id=submission.changes.park %}
{{ value|get_park_area_name:park_id|default:'None' }}
{% endwith %}
{% elif field == 'category' %}
{{ value|get_category_display }}
{% elif field == 'stats' %}
<div class="space-y-2">
{% if value.height_ft %}<div>Height: {{ value.height_ft }} ft</div>{% endif %}
{% if value.length_ft %}<div>Length: {{ value.length_ft }} ft</div>{% endif %}
{% if value.speed_mph %}<div>Speed: {{ value.speed_mph }} mph</div>{% endif %}
{% if value.inversions %}<div>Inversions: {{ value.inversions }}</div>{% endif %}
{% if value.launch_type %}<div>Launch Type: {{ value.launch_type }}</div>{% endif %}
{% if value.track_material %}<div>Track Material: {{ value.track_material }}</div>{% endif %}
{% if value.roller_coaster_type %}<div>Type: {{ value.roller_coaster_type }}</div>{% endif %}
{% if value.trains_count %}<div>Number of Trains: {{ value.trains_count }}</div>{% endif %}
{% if value.cars_per_train %}<div>Cars per Train: {{ value.cars_per_train }}</div>{% endif %}
{% if value.seats_per_car %}<div>Seats per Car: {{ value.seats_per_car }}</div>{% endif %}
</div>
{% else %}
{{ value }}
{% endif %}
</div>
</div>
{% endif %}
{% endfor %}
</div> </div>
<div class="mt-1.5 text-gray-600 dark:text-gray-400">
{% if field == 'opening_date' or field == 'closing_date' or field == 'status_since' %}
{{ value|date:"Y-m-d" }}
{% elif field == 'size_acres' %}
{{ value }} acres
{% elif field == 'website' %}
<a href="{{ value }}" target="_blank" class="text-blue-600 hover:text-blue-500 dark:text-blue-400 dark:hover:text-blue-300">
{{ value }}
</a>
{% elif field == 'park' %}
{% with park_name=value|get_object_name:'parks.Park' %}
{{ park_name }}
{% endwith %}
{% elif field == 'designer' %}
{% with designer_name=value|get_object_name:'designers.Designer' %}
{{ designer_name|default:'None' }}
{% endwith %}
{% elif field == 'manufacturer' %}
{% with manufacturer_name=value|get_object_name:'companies.Manufacturer' %}
{{ manufacturer_name|default:'None' }}
{% endwith %}
{% elif field == 'ride_model' %}
{% with model_name=value|get_object_name:'rides.RideModel' %}
{{ model_name|default:'None' }}
{% endwith %}
{% elif field == 'park_area' %}
{% with park_id=submission.changes.park %}
{{ value|get_park_area_name:park_id|default:'None' }}
{% endwith %}
{% elif field == 'category' %}
{{ value|get_category_display }}
{% elif field == 'stats' %}
<div class="space-y-2">
{% if value.height_ft %}<div>Height: {{ value.height_ft }} ft</div>{% endif %}
{% if value.length_ft %}<div>Length: {{ value.length_ft }} ft</div>{% endif %}
{% if value.speed_mph %}<div>Speed: {{ value.speed_mph }} mph</div>{% endif %}
{% if value.inversions %}<div>Inversions: {{ value.inversions }}</div>{% endif %}
{% if value.launch_type %}<div>Launch Type: {{ value.launch_type }}</div>{% endif %}
{% if value.track_material %}<div>Track Material: {{ value.track_material }}</div>{% endif %}
{% if value.roller_coaster_type %}<div>Type: {{ value.roller_coaster_type }}</div>{% endif %}
{% if value.trains_count %}<div>Number of Trains: {{ value.trains_count }}</div>{% endif %}
{% if value.cars_per_train %}<div>Cars per Train: {{ value.cars_per_train }}</div>{% endif %}
{% if value.seats_per_car %}<div>Seats per Car: {{ value.seats_per_car }}</div>{% endif %}
</div>
{% else %}
{{ value }}
{% endif %}
</div>
</div>
{% endif %}
{% endfor %}
<!-- Edit Mode --> <!-- Location Map (View Mode) -->
<form x-show="isEditing" {% if submission.content_type.model == 'park' and submission.changes.latitude and submission.changes.longitude %}
x-cloak <div class="col-span-2">
hx-post="{% url 'moderation:edit_submission' submission.id %}" {% include "moderation/partials/location_map.html" with location=submission.changes %}
hx-target="#submission-{{ submission.id }}" </div>
class="grid grid-cols-1 gap-3 md:grid-cols-2"> {% endif %}
{% for field, value in submission.changes.items %} </div>
{% if field != 'model_name' and field != 'stats' %}
<div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50" <!-- Edit Mode -->
<form x-show="isEditing"
x-cloak
hx-post="{% url 'moderation:edit_submission' submission.id %}"
hx-target="#submission-{{ submission.id }}"
class="grid grid-cols-1 gap-3 md:grid-cols-2">
{% for field, value in submission.changes.items %}
{% if field != 'model_name' and field != 'stats' and field != 'latitude' and field != 'longitude' and field != 'street_address' and field != 'city' and field != 'state' and field != 'postal_code' and field != 'country' %}
<div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50"
{% if field == 'post_closing_status' %}x-show="status === 'CLOSING'"{% endif %} {% if field == 'post_closing_status' %}x-show="status === 'CLOSING'"{% endif %}
{% if field == 'closing_date' %}x-show="['CLOSING', 'SBNO', 'CLOSED_PERM', 'DEMOLISHED', 'RELOCATED'].includes(status)"{% endif %}> {% if field == 'closing_date' %}x-show="['CLOSING', 'SBNO', 'CLOSED_PERM', 'DEMOLISHED', 'RELOCATED'].includes(status)"{% endif %}>
<label class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"> <label class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300">
@@ -351,23 +358,22 @@
{% endif %} {% endif %}
{% endif %} {% endif %}
</div> </div>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<!-- Location Widget for Parks --> <!-- Location Widget for Parks -->
{% if submission.content_type.model == 'park' %} {% if submission.content_type.model == 'park' %}
<div class="col-span-2 p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50"> <div class="col-span-2">
<h3 class="mb-4 text-lg font-semibold">Location</h3> {% include "moderation/partials/location_widget.html" with form=submission.changes %}
{% include "moderation/partials/location_widget.html" with form=submission.changes %} </div>
</div> {% endif %}
{% endif %}
<!-- Coaster Fields --> <!-- Coaster Fields -->
<div x-show="showCoasterFields" <div x-show="showCoasterFields"
x-cloak x-cloak
class="col-span-2"> class="col-span-2">
{% include 'moderation/partials/coaster_fields.html' with stats=submission.changes.stats %} {% include 'moderation/partials/coaster_fields.html' with stats=submission.changes.stats %}
</div> </div>
<div class="col-span-2 p-4 border rounded-lg bg-blue-50 dark:bg-blue-900/30 border-blue-200/50 dark:border-blue-700/50"> <div class="col-span-2 p-4 border rounded-lg bg-blue-50 dark:bg-blue-900/30 border-blue-200/50 dark:border-blue-700/50">
<label class="block mb-2 text-sm font-medium text-blue-900 dark:text-blue-300"> <label class="block mb-2 text-sm font-medium text-blue-900 dark:text-blue-300">
@@ -391,7 +397,7 @@
Save Changes Save Changes
</button> </button>
</div> </div>
</form> </form>
<!-- Keep existing review notes section --> <!-- Keep existing review notes section -->
{% if submission.notes %} {% if submission.notes %}