From 1f41a6596e600e00659f76dffde5a1d5f65c688d Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期二, 16 十一月 2021 09:50:09 +0800
Subject: [PATCH] TODO#130018 嚴選顧問推薦串接加入顧問 api

---
 PAMapp/components/NavBar.vue |   98 +++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 86 insertions(+), 12 deletions(-)

diff --git a/PAMapp/components/NavBar.vue b/PAMapp/components/NavBar.vue
index 5df783d..3dbaf28 100644
--- a/PAMapp/components/NavBar.vue
+++ b/PAMapp/components/NavBar.vue
@@ -1,6 +1,6 @@
 <template>
     <header class="pam-header">
-      <img class="pam-header__logo" src="~/assets/images/logo.png" alt="" @click="$router.push('/login')">
+      <img class="pam-header__logo" src="~/assets/images/logo.png" alt="" @click="$router.push('/')">
         <div class="pam-header__title">
           ���兢蝳��蜓
           <div class="pam-header__sub-title">
@@ -8,15 +8,31 @@
           </div>
         </div>
         <div class="pam-header__action-bar">
-          <i class="icon-bell" @click="$router.push('/notification')"></i>
-          <el-dropdown @command="handleCommand">
-            <i class="icon-avatar"></i>
+          <i class="icon-bell text--dark-blue cursor--pointer" @click="$router.push('/notification')"></i>
+          <!-- <el-dropdown @command="handleCommand">
+            <i class="icon-avatar text--dark-blue cursor--pointer"></i>
             <el-dropdown-menu slot="dropdown" class="pam-header__dropdown">
+              <li class="pam-header__dropdown-item" @click="$router.push('/login')">��</li>
               <li class="pam-header__dropdown-item" @click="$router.push('/accountSetting')">�犖撣唾�身摰�</li>
               <li class="pam-header__dropdown-item" @click="$router.push('/record/contactRecord')">�������</li>
-              <li class="pam-header__dropdown-item" @click="$router.push('/contactList/consultantList')">���“���</li>
+              <li class="pam-header__dropdown-item" @click="$router.push('/myConsultantList/consultantList')">���“���</li>
               <li class="pam-header__dropdown-item">��</li>
-              <li class="pam-header__dropdown-item pam-header__dropdown-divider" @click="$router.push('/login')">憿批��</li>
+              <li class="pam-header__dropdown-item pam-header__dropdown-divider" @click="$router.push('/consultantLogin')">憿批��</li>
+            </el-dropdown-menu>
+          </el-dropdown> -->
+
+          <el-dropdown>
+            <i class="icon-avatar text--dark-blue cursor--pointer"></i>
+            <el-dropdown-menu slot="dropdown" class="pam-header__dropdown">
+              <template v-for="(navbarItem,index) in navBarList">
+                <li class="pam-header__dropdown-item" 
+                  :class="{'pam-header__dropdown-divider':navbarItem.title === '憿批��'}" 
+                  v-if="navbarItem.needRole.includes(loginRole)" 
+                  :key="index" 
+                  @click="linkTo(navbarItem.link)">
+                    {{navbarItem.title}}
+                </li>
+              </template>
             </el-dropdown-menu>
           </el-dropdown>
         </div>
@@ -25,12 +41,71 @@
 
 <script lang="ts">
 import { Vue, Component } from 'vue-property-decorator';
-
+import * as _ from 'lodash';
 @Component
 export default class NavBar extends Vue {
-  handleCommand() {
-
+  navBarList=[
+    {
+      needRole:[Role.NOT_LOGIN],
+      link:'/login',
+      title:'��',
+    },
+    {
+      needRole:[Role.USER],
+      link:'/accountSetting',
+      title:'�犖撣唾�身摰�',
+    },
+    {
+      needRole:[Role.ADMIN],
+      link:'/notFinish',
+      title:'���董�����',
+    },
+    {
+      needRole:[Role.USER,Role.ADMIN],
+      link:'/record/contactRecord',
+      title:'�������',
+    },
+    {
+      needRole:[Role.NOT_LOGIN,Role.USER],
+      link:'/myConsultantList/consultantList',
+      title:'���“���',
+    },
+    {
+      needRole:[Role.USER,Role.ADMIN],
+      link:'',
+      title:'��',
+    },
+    {
+      needRole:[Role.NOT_LOGIN,Role.USER],
+      link:'/consultantLogin',
+      title:'憿批��',
+    },
+  ];
+  get idToken():string | null{
+    return localStorage.getItem('id_token');
   }
+  get roleOfState():string | null{
+    return localStorage.getItem('roleOfState');
+  }
+  get loginRole():string{
+    return this.roleOfState&&this.idToken ? this.roleOfState : Role.NOT_LOGIN;
+  }
+
+  linkTo(routerLink:string):void{
+    _.isEqual(routerLink,'') ? this.fakeLogout() :this.$router.push(routerLink);
+  }
+
+
+  // TODO: ��TP隤����� ���蝙�
+  fakeLogout():void{
+    localStorage.clear();
+    this.$router.go(0);
+  }
+}
+export enum Role{
+  USER='user',
+  ADMIN='admin',
+  NOT_LOGIN='',
 }
 </script>
 
@@ -49,21 +124,20 @@
     border-left: 1px solid #CCCCCC;
     font-size: 16px;
     font-weight: bold;
-    color: #68737A;
+    color: $PRUDENTIAL_GREY;
     letter-spacing: 3.6px;
     flex-basis: 140px;
     .pam-header__sub-title {
       padding-top: 2px;
       font-size: 13px;
       font-weight: bold;
-      color: #F09491;
+      color: $CORAL;
       letter-spacing: 1.2px
     }
   }
   .pam-header__action-bar {
     display: flex;
     font-size: 24px;
-    color: #1B365D;
     font-weight: bold;
     justify-content: space-around;
     i {

--
Gitblit v1.8.0