เพิ่มปุ่ม ตั้งค่าที่คลิกหน้าโปรไฟล์

src/app/shared/components/header/header.component.html

@@ -38,16 +38,10 @@
         <div class="responsive-headernav">
           <div class="header-nav-right">
             <div class="header-fullscreen hidden lg:block">
-              <a
-                aria-label="anchor"
-                href="javascript:void(0);"
-                appFullscreen
-                class="inline-flex flex-shrink-0 justify-center items-center gap-2 h-[2.375rem] w-[2.375rem] rounded-full font-medium bg-gray-100 hover:bg-gray-200 text-gray-500 align-middle focus:outline-none focus:ring-0 focus:ring-gray-400 focus:ring-offset-0 focus:ring-offset-white transition-all text-xs dark:bg-bgdark dark:hover:bg-black/20 dark:text-white/70 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10"
-              >
+              <a aria-label="anchor" href="javascript:void(0);" appFullscreen
+                class="inline-flex flex-shrink-0 justify-center items-center gap-2 h-[2.375rem] w-[2.375rem] rounded-full font-medium bg-gray-100 hover:bg-gray-200 text-gray-500 align-middle focus:outline-none focus:ring-0 focus:ring-gray-400 focus:ring-offset-0 focus:ring-offset-white transition-all text-xs dark:bg-bgdark dark:hover:bg-black/20 dark:text-white/70 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10">
                 <i class="ri-fullscreen-line header-icon full-screen-open"></i>
-                <i
-                  class="ri-fullscreen-line header-icon fullscreen-exit-line hidden"
-                ></i>
+                <i class="ri-fullscreen-line header-icon fullscreen-exit-line hidden"></i>
               </a>
             </div>
             <div class="switcher-icon">
@@ -698,10 +692,8 @@
                     src="./assets/img/users/defaultperson.jpg"
                     alt="Image Description" />
                 </ng-template> -->
-                <img
-                    class="inline-block rounded-full ring-2 h-full !ring-transparent"
-                    src="./assets/img/users/man.PNG"
-                    alt="Image Description" />
+                <img class="inline-block rounded-full ring-2 h-full !ring-transparent" src="./assets/img/users/man.PNG"
+                  alt="Image Description" />
               </button>
 
               <div class="hs-dropdown-menu ti-dropdown-menu border-0 w-[20rem]" aria-labelledby="dropdown-profile">
@@ -709,7 +701,7 @@
                   <div class="ltr:mr-3 rtl:ml-3">
                     <!-- <img class="avatar shadow-none rounded-full h-full !ring-transparent" src="./assets/img/users/profile2.jpg"
                       alt="profile-img" /> -->
-                      <!-- <img *ngIf="employeeProfile?.picture && employeeProfile.picture !== ''; else defaultImage"
+                    <!-- <img *ngIf="employeeProfile?.picture && employeeProfile.picture !== ''; else defaultImage"
                         class="inline-block rounded-full ring-2 h-12 w-12 !ring-transparent"
                         [src]="employeeProfile.picture"
                         alt="Image Description" 
@@ -721,10 +713,8 @@
                         src="./assets/img/users/defaultperson.jpg"
                         alt="Image Description" />
                     </ng-template> -->
-                    <img
-                    class="inline-block rounded-full ring-2 h-full !ring-transparent"
-                    src="./assets/img/users/man.PNG"
-                    alt="Image Description" />
+                    <img class="inline-block rounded-full ring-2 h-full !ring-transparent"
+                      src="./assets/img/users/man.PNG" alt="Image Description" />
                   </div>
                   <div>
                     <p class="ti-dropdown-header-title !text-white">
@@ -747,15 +737,12 @@
                   <a routerLink="/page/tasks" class="ti-dropdown-item">
                     <i class="ti ti-clipboard-check text-lg"></i>
                     Task Manager
-                  </a>
-                  <a
-                    routerLink="/profile/profilesettings"
-                    class="ti-dropdown-item"
-                  >
-                    <i class="ti ti-adjustments-horizontal text-lg"></i>
+                  </a> -->
+                  <a (click)="onSettingsClick()" class="ti-dropdown-item cursor-pointer">
+                    <i class="ti ti-settings text-lg"></i>
                     Settings
                   </a>
-                  <a routerLink="/dashboard/crypto" class="ti-dropdown-item">
+                  <!-- <a routerLink="/dashboard/crypto" class="ti-dropdown-item">
                     <i class="ti ti-wallet text-lg"></i>
                     Bal: $7,12,950
                   </a> -->
@@ -767,7 +754,8 @@
               </div>
             </div>
             <div class="header-name">
-              <span class="dark:text-black/30 text-black text-center"> {{this.employeeProfile.thFullName?this.employeeProfile.thFullName:''}} </span>
+              <span class="dark:text-black/30 text-black text-center">
+                {{this.employeeProfile.thFullName?this.employeeProfile.thFullName:''}} </span>
             </div>
           </div>
         </div>
@@ -918,4 +906,4 @@
     </div>
   </div>
 </div>
-<!-- ========== END Search Modal ========== -->
+<!-- ========== END Search Modal ========== -->
\ No newline at end of file

src/app/shared/components/header/header.component.ts

@@ -18,7 +18,8 @@ export class HeaderComponent {
     private authService: AuthService,
     public tokenService:TokenService,
     private employeeService: EmployeeService,
-    private elementRef: ElementRef) {
+    private elementRef: ElementRef,
+    private navService: NavService) {
     this.getEvaluatee();
       
   }
@@ -137,4 +138,8 @@ export class HeaderComponent {
     const target = event.target as HTMLImageElement;
     target.src = './assets/img/users/defaultperson.jpg';
   }
+
+  onSettingsClick() {
+    this.navService.toggleEvaluationMenu();
+  }
 }

src/app/shared/services/navservice.ts

@@ -88,7 +88,7 @@ export class NavService implements OnDestroy {
     this.screenWidth.next(width);
   }
 
-  MENUITEMS: Menu[] = [
+  private MENUITEMS: Menu[] = [
     {
       title: 'การประเมินผล',
       type: 'sub',
@@ -96,10 +96,10 @@ export class NavService implements OnDestroy {
       active: false,
       path: '',
       id: 'm1',
-      show: false,
+      show: true,
       children: [
-        { id: 'm11', path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link', show: false },
-        { id: 'm12', path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link', show: false },
+        { id: 'm11', path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link', show: true },
+        { id: 'm12', path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link', show: true },
       ],
     },
     {
@@ -182,4 +182,28 @@ export class NavService implements OnDestroy {
   ];
   // Array
   items = new BehaviorSubject<Menu[]>(this.MENUITEMS);
+  
+  private menuItemsSubject = new BehaviorSubject<Menu[]>(this.MENUITEMS);
+  menuItems$ = this.menuItemsSubject.asObservable();
+
+
+  toggleEvaluationMenu() {
+    // const menuItem = this.MENUITEMS.find(item => item.id === 'm1');
+    // if (menuItem) {
+    //   menuItem.show = !menuItem.show;  // Toggle ซ่อน/แสดง
+    //   menuItem.children?.forEach(child => child.show = menuItem.show);
+    //   this.menuItemsSubject.next([...this.MENUITEMS]);
+
+    //   const currentUrl = this.router.url;
+    //   const evaluationPaths = menuItem.children?.map(child => child.path) || [];
+
+    //   if (!menuItem.show && evaluationPaths.includes(currentUrl)) {
+    //     this.router.navigate(['/company-registration']);
+    //   }
+
+    //   if (menuItem.show) {
+    //     this.router.navigate(['/self-evaluation']);
+    //   }
+    // }
+  }
 }