-

ng-ttc-frontend/src/app/component/budget-aproval/budget-aproval.html

@@ -115,6 +115,7 @@
   </form> -->
 
   <div class="bg-white rounded-lg shadow-md border border-gray-200 ">
+    <!-- หัวพับได้ -->
     <div class="flex justify-between items-center p-4 border-b bg-gray-50 rounded-t-lg" (click)="toggleFormCollapse()">
         <h3 class="text-base font-semibold text-gray-700">เพิ่มรายการงบประมาณสำหรับโครงการ</h3>
         <button class="text-gray-400 hover:text-gray-600 focus:outline-none">
@@ -125,6 +126,7 @@
 
         </button>
     </div>
+    <!-- เนื้อหาพับได้ -->
   @if(!isFormExpanded){
       <div class="p-4 space-y-4">
           <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
@@ -142,11 +144,6 @@
                   <label for="first_name" class="block text-sm font-medium text-gray-700 mb-1">จำนวนเงิน</label>
                   <input type="text" id="first_name" name="first_name" type="number" class="w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500 shadow-sm" placeholder="">
               </div>
-  <!--
-              <div>
-                  <label for="last_name" class="block text-sm font-medium text-gray-700 mb-1">นามสกุล</label>
-                  <input type="text" id="last_name" name="last_name" class="w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500 shadow-sm" placeholder="">
-              </div> -->
           </div>
 
           <div class="flex justify-end pt-4 space-x-2">
@@ -187,6 +184,9 @@
 
 
 
+
+
+
   <!-- Table -->
   <!-- <div class="overflow-x-auto bg-white shadow rounded-xl border">
     <table class="min-w-full border-collapse text-sm">
@@ -254,19 +254,14 @@
 
     </table>
   </div> -->
-    <div class="overflow-x-auto bg-white border border-gray-200 rounded-2xl shadow-sm">
+<div class="overflow-x-auto bg-white border border-gray-200 rounded-2xl shadow-sm">
     <table class="min-w-full text-left border-collapse">
       <thead class="bg-gray-100 border-b border-gray-200 text-gray-700 text-sm">
         <tr>
           <th class="py-3 px-4 font-semibold">ลำดับ</th>
-          <th class="py-3 px-4 font-semibold">รหัสโครงการ</th>
-          <th class="py-3 px-4 font-semibold">ชื่อโครงการ</th>
-          <th class="py-3 px-4 font-semibold">ผู้รับผิดชอบ</th>
-          <th class="py-3 px-4 font-semibold">งบที่ขออนุมัติ</th>
-          <th class="py-3 px-4 font-semibold">หมวดงบ</th>
-          <th class="py-3 px-4 font-semibold">จำนวนที่อนุมัติ</th>
-          <th class="py-3 px-4 font-semibold text-center">สถานะ</th>
-          <th class="py-3 px-4 font-semibold text-center">ดำเนินการ</th>
+          <th class="py-3 px-4 font-semibold">ชื่องบประมาณ</th>
+          <th class="py-3 px-4 font-semibold text-center">จำนวนเงิน</th>
+          <th class="py-3 px-4 font-semibold text-right pr-11">ดำเนินการ</th>
         </tr>
       </thead>
 
@@ -275,55 +270,24 @@
       class="border-b border-gray-100 hover:bg-blue-50/20 transition">
         <td class="py-4 px-4 text-gray-700">{{ i + 1 }}</td>
         <td class="py-4 px-4 font-medium text-gray-700"> {{ p.code }}</td>
-        <td class="py-4 px-4 text-gray-800 font-semibold leading-tight">{{ p.name }}</td>
-        <td class="py-4 px-4 text-gray-700">{{ p.owner }}</td>
-        <td class="py-4 px-4 text-blue-700 font-bold whitespace-nowrap"> {{ p.budget | number:'1.0-0' }} บาท</td>
-
-        <td class="py-4 px-4 w-64">
-          <!-- <select class="w-full px-4 py-2.5 border border-gray-300 rounded-xl bg-white
-            focus:outline-none focus:ring-2 focus:ring-blue-200 focus:border-blue-300
-            text-sm transition">
-          <option value="">ไม่เลือก</option>
-            @for (item of budgetCategoriesDrop.expense; track item.dtlcod) {
-              <option [value]="item.dtlcod">
-                {{ item.dtlnam }}
-              </option>
-            }
-          </select> -->
-          {{ p.bdgnam }}
-        </td>
-
-        <td class="py-4 px-4 w-40">
-          <!-- <input type="number" class="w-full px-4 py-2.5 border border-gray-300 rounded-xl bg-white focus:outline-none focus:ring-2 focus:ring-blue-200 focus:border-blue-300 text-sm transition"/> -->
-           {{ p.acp }} บาท
-        </td>
 
         <td class="py-4 px-4 text-center">
-          <span
-            class="px-3 py-1.5 rounded-full text-xs font-semibold inline-flex items-center gap-1
-                  shadow-sm border"
-            [ngClass]="{
-              'bg-yellow-50 text-yellow-700 border-yellow-200': p.status === 'WAIT',
-              'bg-green-50 text-green-700 border-green-200': p.status === 'APPROVED',
-              'bg-red-50 text-red-700 border-red-200': p.status === 'REJECTED'
-            }"
-          >
-            <ng-container *ngIf="p.status === 'APPROVED'">อนุมัติแล้ว</ng-container>
-            <ng-container *ngIf="p.status === 'WAIT'">รออนุมัติ</ng-container>
-            <ng-container *ngIf="p.status === 'REJECTED'">ไม่อนุมัติ</ng-container>
-          </span>
+          <input type="number" class="w-40 px-3 py-2 border border-gray-300 rounded-lg text-center hover:shadow-2xl">
         </td>
 
-        <td class="py-4 px-4 text-center space-x-2 whitespace-nowrap">
+        <td class="py-4 px-4 text-right space-x-2 whitespace-nowrap pr-8">
 
              <button
-            class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-xl text-sm
-                  shadow-sm font-medium transition"
+              class="bg-red-500 hover:bg-red-600 text-white px-3 py-2 rounded-lg shadow"
             >
-            จัดสรรงบประมาณ
+              🗑
             </button>
 
-
+            <button
+              class="bg-gray-600 hover:bg-gray-700 text-white px-3 py-2 rounded-lg shadow"
+            >
+              🖊
+            </button>
         </td>
       </tr>
     </tbody>

ng-ttc-frontend/src/app/component/budget-aproval/budget-aproval.ts

@@ -25,9 +25,9 @@ export class BudgetAproval {
   ];
 
   projects = [
-    { code: 'PRJ001', name: 'ระบบจัดการน้ำดื่ม', owner: 'นาย A', budget: 20000, status: 'WAIT', acp: 0, bdgnam: 'ยังไมจัดสรร' },
-    { code: 'PRJ002', name: 'ปรับปรุงอาคาร B',    owner: 'นางสาว B', budget: 45000, status: 'WAIT', acp: 0, bdgnam: 'ยังไมจัดสรร'},
-    { code: 'PRJ003', name: 'ซื้อคอมพิวเตอร์',    owner: 'นาย C', budget: 30000, status: 'APPROVED', acp: 20000, bdgnam: 'งบดำเนินงาน' }
+    { code: 'เงินรายได้', name: 'ระบบจัดการน้ำดื่ม', owner: 'นาย A', budget: 20000, status: 'WAIT', acp: 0, bdgnam: 'ยังไมจัดสรร' },
+    { code: 'งบดำเนินงาน', name: 'ปรับปรุงอาคาร B',    owner: 'นางสาว B', budget: 45000, status: 'WAIT', acp: 0, bdgnam: 'ยังไมจัดสรร'},
+    { code: 'ค่ากิจกรรมพัฒนาคุณภาพผู้เรียน', name: 'ซื้อคอมพิวเตอร์',    owner: 'นาย C', budget: 30000, status: 'APPROVED', acp: 20000, bdgnam: 'งบดำเนินงาน' }
   ];
 
   budgetCategoriesDrop = {

ng-ttc-frontend/src/app/component/main-manager/main-manager.component.ts

@@ -114,7 +114,8 @@ export class MainManagerComponent implements OnInit {
   // readonly ownerName = 'Nuttakit';
 
   constructor(
-    private router: Router
+    private router: Router,
+    private dashboardStateService: DashboardStateService
   ) {}
 
 

ng-ttc-frontend/src/app/content/main-manager-content/main-manager-content.component.ts

@@ -38,9 +38,9 @@ export class MainManagerContentComponent implements OnInit {
 
   ngOnInit(): void {
     let token = localStorage.getItem('access_token')
-    this.OnSearchAct(token, true);
-    this.OnSetupDashboard(token, true);
-    this.OnSearchSum(token, true);
+    // this.OnSearchAct(token, true);
+    // this.OnSetupDashboard(token, true);
+    // this.OnSearchSum(token, true);
   }
 
   OnSearchAct(value: any, setupFirst: boolean): void {