first commit

support-portal-frontend/src/app/component/event/event.component.html

@@ -1,2 +1,47 @@
 <app-menu></app-menu>
 
+<div class="container mt-4">
+  <h2 class="mb-4">Events</h2>
+  <div class="mb-3">
+    <a routerLink="/eventForm" class="btn btn-primary">
+      <i class="bi bi-plus"></i> Add New Event
+    </a>
+  </div>
+  <table class="table table-bordered">
+    <thead>
+      <tr>
+        <th>Code</th>
+        <th>Year</th>
+        <th>Subject</th>
+        <th>Title</th>
+        <th>Subtitle</th>
+        <th>Date</th>
+        <th>Phone</th>
+        <th>Email</th>
+        <th>Active</th>
+        <th>Actions</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr *ngFor="let event of events">
+        <td>{{ event.code }}</td>
+        <td>{{ event.year }}</td>
+        <td>{{ event.subject }}</td>
+        <td>{{ event.title }}</td>
+        <td>{{ event.subTitle }}</td>
+        <td>{{ event.date }}</td>
+        <td>{{ event.phone }}</td>
+        <td>{{ event.email }}</td>
+        <td>{{ event.isActive ? 'Yes' : 'No' }}</td>
+        <td>
+          <a [routerLink]="['/eventForm', event.id]" class="btn btn-warning btn-sm">
+            <i class="bi bi-pencil"></i> Edit
+          </a>
+          <button (click)="deleteEvent(event.id)" class="btn btn-danger btn-sm">
+            <i class="bi bi-trash"></i> Delete
+          </button>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</div>

support-portal-frontend/src/app/component/event/event.component.ts

@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, FormArray, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { EventService } from 'src/app/service/event.service';
 
 @Component({
   selector: 'app-event',
@@ -6,13 +9,21 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./event.component.css']
 })
 export class EventComponent implements OnInit {
+  events: any[] = []; // Define the type according to your model
 
-  constructor() { }
-
-  htmlContent: string = ''; 
-
+  constructor(private eventService: EventService, private router: Router) { }
 
   ngOnInit(): void {
+    this.loadEvents();
   }
 
-}
+  loadEvents(): void {
+    this.eventService.getEvents().subscribe(events => this.events = events);
+  }
+
+  deleteEvent(id: number): void {
+    if (confirm('Are you sure you want to delete this event?')) {
+      // this.eventService.deleteEvent(id).subscribe(() => this.loadEvents());
+    }
+  }
+}