...

actix_mvc_app/src/views/tickets/my_tickets.html

@@ -0,0 +1,89 @@
+{% extends "base.html" %}
+
+{% block title %}My Tickets - Actix MVC App{% endblock %}
+
+{% block content %}
+<div class="d-flex justify-content-between align-items-center mb-4">
+    <h1>My Support Tickets</h1>
+    <a href="/tickets/new" class="btn btn-primary">New Ticket</a>
+</div>
+
+<div id="my-tickets-container">
+    {% if tickets | length > 0 %}
+    <div class="table-responsive">
+        <table class="table table-hover">
+            <thead class="table-light">
+                <tr>
+                    <th>ID</th>
+                    <th>Title</th>
+                    <th>Status</th>
+                    <th>Priority</th>
+                    <th>Created</th>
+                    <th>Updated</th>
+                    <th>Actions</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for ticket in tickets %}
+                <tr>
+                    <td>{{ ticket.id | truncate(length=8) }}</td>
+                    <td>
+                        <a href="/tickets/{{ ticket.id }}" up-layer="new modal" up-size="large">
+                            {{ ticket.title }}
+                        </a>
+                    </td>
+                    <td>
+                        <span class="badge 
+                            {% if ticket.status == 'Open' %}bg-danger{% endif %}
+                            {% if ticket.status == 'In Progress' %}bg-warning{% endif %}
+                            {% if ticket.status == 'Waiting for Customer' %}bg-info{% endif %}
+                            {% if ticket.status == 'Resolved' %}bg-success{% endif %}
+                            {% if ticket.status == 'Closed' %}bg-secondary{% endif %}
+                        ">
+                            {{ ticket.status }}
+                        </span>
+                    </td>
+                    <td>
+                        <span class="badge 
+                            {% if ticket.priority == 'Low' %}bg-success{% endif %}
+                            {% if ticket.priority == 'Medium' %}bg-info{% endif %}
+                            {% if ticket.priority == 'High' %}bg-warning{% endif %}
+                            {% if ticket.priority == 'Critical' %}bg-danger{% endif %}
+                        ">
+                            {{ ticket.priority }}
+                        </span>
+                    </td>
+                    <td>{{ ticket.created_at | date(format="%Y-%m-%d %H:%M") }}</td>
+                    <td>{{ ticket.updated_at | date(format="%Y-%m-%d %H:%M") }}</td>
+                    <td>
+                        <a href="/tickets/{{ ticket.id }}" class="btn btn-sm btn-outline-primary" up-layer="new modal" up-size="large">
+                            View
+                        </a>
+                    </td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+    {% else %}
+    <div class="alert alert-info">
+        <h4 class="alert-heading">No tickets found!</h4>
+        <p>You haven't created any support tickets yet.</p>
+        <hr>
+        <p class="mb-0">
+            <a href="/tickets/new" class="btn btn-primary">Create Your First Ticket</a>
+        </p>
+    </div>
+    {% endif %}
+</div>
+{% endblock %}
+
+{% block extra_js %}
+<script>
+    // Initialize Unpoly event handlers
+    up.on('up:fragment:inserted', function(event) {
+        // This will run whenever a fragment is updated via Unpoly
+        console.log('Fragment updated:', event.target);
+    });
+</script>
+{% endblock %}