-search project

ng-ttc-frontend/src/app/content/main-project-content/main-project-content.html

@@ -1,8 +1,9 @@
-<div class="h-screen bg-gray-100 flex flex-col">
+<div class="h-full bg-gray-100 flex flex-col w-full"> <!-- แก้ h-screen เป็น h-full -->
 
-    <header class="flex justify-between items-center py-4 px-6">
+    <!-- Header: ใช้ flex-shrink-0 เพื่อไม่ให้โดนบีบ และ bg-white เพื่อให้ตัดกับ content -->
+    <header class="shrink-0 flex justify-between items-center py-4 px-6">
       @if (mode == 'default') {
-      <div class="flex flex-col md:flex-row justify-between items-end mb-6 gap-4">
+      <div class="flex flex-col md:flex-row justify-between items-end gap-4 w-full">
           <div>
             <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
              <span class="w-2 h-8 bg-red-900 rounded-full"></span> รายการโครงการทั้งหมด
@@ -10,9 +11,8 @@
             <p class="text-gray-500 mt-1 text-sm pl-4">ติดตาม สถานะโครงการ และ เสนอโครงการ</p>
             </div>
           </div>
-        <!-- <h1 class="text-3xl font-bold text-gray-800">โครงการทั้งหมด</h1> -->
       } @else if (mode == 'add')  {
-        <div class="flex flex-col md:flex-row justify-between items-end gap-4">
+        <div class="flex flex-col md:flex-row justify-between items-end gap-4 w-full">
               <div>
                 <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
                   <button (click)="onCancelProject()"
@@ -31,7 +31,8 @@
 
     </header>
 
-    <div class="grow overflow-y-auto px-6 pb-6">
+    <!-- Content: ใช้ flex-1 เพื่อกินพื้นที่ที่เหลือ และ overflow-y-auto เพื่อให้ scroll เฉพาะส่วนนี้ -->
+    <div class="flex-1 overflow-y-auto px-6 pb-6">
 
         @if ( mode == 'default') {
             <app-main-project></app-main-project>

ng-ttc-frontend/src/app/content/main-project-content/main-project-content.ts

@@ -2,6 +2,7 @@ import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { GeneralService } from '../../services/generalservice';
 import { MainProjectAdd } from '../../component/main-project-add/main-project-add'; // Import Dumb Component
+import { ProjectStateService } from '../../services/state/project-state.service';
 
 @Component({
   selector: 'app-main-project-content',
@@ -18,6 +19,7 @@ export class MainProjectContent implements OnInit {
   constructor(
     private route: ActivatedRoute,
     private router: Router,
+    private projectStateService: ProjectStateService, // Inject ProjectStateService
     private generalService: GeneralService
   ) {}
 
@@ -33,6 +35,8 @@ export class MainProjectContent implements OnInit {
         this.mode = 'default';
       }
     });
+
+    this.onSearchPrj();
   }
 
   // รับ Event (save) จากลูก แล้วยิง API
@@ -65,6 +69,26 @@ export class MainProjectContent implements OnInit {
     });
   }
 
+    // ฟังก์ชันดึงข้อมูลโครงการ และ update state
+  onSearchPrj(): void {
+    const uri = '/api/ttc/projectsearch?column=user';
+    const request = {}; // body ว่างตามที่ระบุ
+
+    this.generalService.postRequest(uri, request).subscribe({
+      next: (result: any) => {
+        if (result.code === '200') {
+          // สำเร็จ: นำข้อมูลใส่ State (Pattern: Service ยิง -> ได้ของ -> ยัดใส่ State -> Component Subscribe รอรับ)
+          this.projectStateService.setProjectState(result.data);
+        } else {
+          this.generalService.trowApi(result);
+        }
+      },
+      error: (error: any) => {
+        this.generalService.trowApi(error);
+      }
+    });
+  }
+
   // รับ Event (cancel) จากลูก
   onCancelProject(): void {
       this.router.navigate(['/main/project']);