Index: src/main/java/com/example/skychasemk/controller/SupportTicketController.java
===================================================================
--- src/main/java/com/example/skychasemk/controller/SupportTicketController.java	(revision 07fe0be0b1334016c97035b39d3c10d47238226d)
+++ src/main/java/com/example/skychasemk/controller/SupportTicketController.java	(revision c064a42982d93c4d25f9142190171ffc6e6e12ea)
@@ -39,9 +39,9 @@
     }
 
-    @PutMapping("/{ticketID}/status")
-    public ResponseEntity<SupportTicket> updateTicket(@PathVariable("ticketID") Integer ticketID, @RequestBody String status) {
+    @PutMapping("/{ticketId}/{status}")
+    public ResponseEntity<SupportTicket> updateTicket(@PathVariable("ticketId") Integer ticketId, @PathVariable String status) {
         try {
             SupportTicket.TicketStatus newStatus = SupportTicket.TicketStatus.valueOf(status.toUpperCase());
-            return ResponseEntity.ok(supportTicketService.updateTicket(ticketID, newStatus));
+            return ResponseEntity.ok(supportTicketService.updateTicket(ticketId, newStatus));
         } catch (IllegalArgumentException e) {
             return ResponseEntity.badRequest().build();
Index: src/main/java/com/example/skychasemk/model/SupportTicket.java
===================================================================
--- src/main/java/com/example/skychasemk/model/SupportTicket.java	(revision 07fe0be0b1334016c97035b39d3c10d47238226d)
+++ src/main/java/com/example/skychasemk/model/SupportTicket.java	(revision c064a42982d93c4d25f9142190171ffc6e6e12ea)
@@ -11,10 +11,17 @@
 public class SupportTicket {
 
-    @Setter
     @Id
     @GeneratedValue(strategy = GenerationType.IDENTITY)
-    @Column(name = "TicketID")
+    @Column(name = "ticketid")
+    private Integer ticketId;
 
-    private Integer ticketID;
+    public Integer getTicketId() {
+        return ticketId;
+    }
+
+    public void setTicketId(Integer ticketId) {
+        this.ticketId = ticketId;
+    }
+
     @Setter
     @Getter
Index: src/main/java/com/example/skychasemk/repository/SupportTicketRepository.java
===================================================================
--- src/main/java/com/example/skychasemk/repository/SupportTicketRepository.java	(revision 07fe0be0b1334016c97035b39d3c10d47238226d)
+++ src/main/java/com/example/skychasemk/repository/SupportTicketRepository.java	(revision c064a42982d93c4d25f9142190171ffc6e6e12ea)
@@ -2,4 +2,5 @@
 
 import com.example.skychasemk.model.SupportTicket;
+import org.springframework.data.jpa.repository.EntityGraph;
 import org.springframework.data.jpa.repository.JpaRepository;
 import org.springframework.data.jpa.repository.Query;
Index: src/main/java/com/example/skychasemk/services/SupportTicketService.java
===================================================================
--- src/main/java/com/example/skychasemk/services/SupportTicketService.java	(revision 07fe0be0b1334016c97035b39d3c10d47238226d)
+++ src/main/java/com/example/skychasemk/services/SupportTicketService.java	(revision c064a42982d93c4d25f9142190171ffc6e6e12ea)
@@ -26,8 +26,12 @@
     }
     public List<SupportTicket> getAllTickets() {
-        return supportTicketRepository.findTickets();
+        List<SupportTicket> tickets = supportTicketRepository.findTickets();
+        tickets.forEach(ticket -> System.out.println(ticket.getTicketId() + " - " + ticket.getStatus()));
+        return tickets;
     }
     public List<SupportTicket> getResolvedTickets() {
-        return supportTicketRepository.findResolvedTickets();
+        List<SupportTicket> tickets = supportTicketRepository.findResolvedTickets();
+        tickets.forEach(ticket -> System.out.println(ticket.getTicketId() + " - " + ticket.getStatus()));
+        return tickets;
     }
 
Index: src/main/resources/static/SupportTickets.html
===================================================================
--- src/main/resources/static/SupportTickets.html	(revision 07fe0be0b1334016c97035b39d3c10d47238226d)
+++ src/main/resources/static/SupportTickets.html	(revision c064a42982d93c4d25f9142190171ffc6e6e12ea)
@@ -8,12 +8,142 @@
     <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
 </head>
+<style>
+    body {
+        background: url('images/flight.jpg') no-repeat center center fixed;
+        background-size: cover;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 100vh;
+        margin: 0;
+        font-family: Arial, sans-serif;
+        padding-top: 30px;
+        margin-top: 10px;
+    }
+
+    .header {
+        position: absolute;
+        top: 0;
+        left: 0;
+        display: flex;
+        align-items: center;
+        background-color: rebeccapurple;
+        padding: 10px;
+        width: 100%;
+        z-index: 10;
+        margin-bottom: 10px;
+    }
+    .header img {
+        width: 40px;
+        height: 40px;
+        margin-right: 20px;
+    }
+
+    .header h1 {
+        color: white;
+        margin: 0;
+        font-size: 15px;
+        padding-right: 50px;
+    }
+
+    .header button {
+        background-color: transparent;
+        border: none;
+        color: white;
+        font-size: 14px;
+    }
+
+    .header button:hover {
+        background-color: transparent;
+        cursor: pointer;
+    }
+
+    select {
+        -webkit-appearance: none;
+        -moz-appearance: none;
+        appearance: none;
+        border: 0;
+        outline: 0;
+        font: inherit;
+        width: 20em;
+        height: 3em;
+        padding: 0 4em 0 1em;
+        background: url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_whitevariation.svg) no-repeat right 0.8em center/1.4em, linear-gradient(to left, rgba(255, 255, 255, 0.3) 3em, rgba(255, 255, 255, 0.2) 3em);
+        color: white;
+        border-radius: 0.25em;
+        box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.2);
+        cursor: pointer;
+    }
+    select option {
+        color: inherit;
+        background-color: #320a28;
+    }
+    select:focus {
+        outline: none;
+    }
+    select::-ms-expand {
+        display: none;
+    }
+
+    .search-form-container h2 {
+        color: white;
+        padding-top: 110px;
+    }
+
+
+    .flights-list-container h2{
+        padding-top: 110px;
+    }
+    .flights-list .flight-item {
+        margin-bottom: 15px;
+    }
+
+    .flights-list .flight-item span {
+        margin-right: 15px;
+    }
+
+
+    .popup textarea{
+        width: 100%;
+        padding: 10px;
+        margin-top: 10px;
+        border: 1px solid #ccc;
+        border-radius: 4px;
+        resize: vertical;
+        box-sizing: border-box;
+    }
+
+
+    .popup button {
+        margin-top: 10px;
+        background-color: rebeccapurple;
+        color: white;
+        border: none;
+        padding: 5px;
+        cursor: pointer;
+    }
+
+    .popup button:hover {
+        background-color: mediumpurple;
+    }
+    .ticket-list{
+        margin-top:20px;
+        padding-top:60px;
+    }
+
+
+</style>
 <body>
 
 <div id="app" class="support-ticket-container">
-    <button @click="fetchResolved">Fetch Resolved Tickets</button>
-    <button @click="fetchTickets">Fetch Unresolved Tickets</button>
+    <header class="header">
+        <button @click="fetchResolved">Fetch Resolved Tickets</button>
+        <button @click="fetchTickets">Fetch Unresolved Tickets</button>
+    </header>
+
     <h1>Support Tickets</h1>
     <div class="ticket-list">
-        <div class="ticket-item" v-for="ticket in tickets" :key="ticket.ticketID">
+        <div class="ticket-item" v-for="ticket in tickets" :key="ticket.ticketId">
             <div class="ticket-info">
                 <p><strong>Subject:</strong> {{ ticket.subject }}</p>
@@ -22,5 +152,5 @@
             </div>
             <div class="ticket-actions">
-                <button @click="resolveTicket(ticket.ticketID)">Resolve</button>
+                <button @click="resolveTicket(ticket.ticketId)">Resolve</button>
             </div>
         </div>
@@ -61,15 +191,15 @@
                     });
             },
-            resolveTicket(ticketID) {
-                console.log(ticketID);
+            resolveTicket(ticketId) {
+                console.log(ticketId);
                 const status = 'RESOLVED';
-                axios.put(`http://localhost:8080/api/support-tickets/${ticketID}/status`, status,
+                axios.put(`api/support-tickets/${ticketId}/${status}`, {},
                 {
                     headers: {
-                        'Content-Type': 'text/plain'
+                        'Content-Type': 'application/json'
                     }
                 })
                     .then(() => {
-                        alert(`Ticket ${ticketID} resolved.`);
+                        alert(`Ticket ${ticketId} resolved.`);
                         this.fetchTickets();
                     })