保誠-保戶業務員媒合平台
wayne
2021-11-30 202f69ff07a2840a9746cda72361f0f67a20a85a
PAMapp/components/NavBar.vue
@@ -9,11 +9,11 @@
    <div class="pam-header__action-bar">
      <i class="icon-bell text--dark-blue cursor--pointer fix-chrome-click--issue"
        @click="$router.push('/notification')"></i>
        <el-dropdown :class="{'is-open':isOpenDropdown}"
        <el-dropdown :class="{'is-open':isOpenDropdown}"
          ref="dropdown"
          trigger="click"
          @command="routerNavigateTo">
          <i class="icon-avatar text--dark-blue cursor--pointer fix-chrome-click--issue" @click="isOpenDropdown =!isOpenDropdown" ></i>
          <i class="icon-avatar text--dark-blue cursor--pointer fix-chrome-click--issue" @click="isOpenDropdown =!isOpenDropdown" @blur="isOpenDropdown =false"></i>
          <el-dropdown-menu
            class="pam-header__dropdown">
            <template v-for="(item,index) in navBarList">
@@ -34,18 +34,22 @@
<script lang="ts">
  import { Vue, Component } from 'vue-property-decorator';
  import { namespace } from 'nuxt-property-decorator';
  import { Role } from '~/assets/ts/models/enum/Role';
  import * as _ from 'lodash';
  const localStorage = namespace('localStorage');
  const roleStorage = namespace('localStorage');
  @Component
  export default class NavBar extends Vue {
    @localStorage.Mutation storageClear!: () => void;
    @localStorage.Getter idToken!: string | null;
    @localStorage.Getter currentRole!: string | null;
    @roleStorage.Mutation storageClear!: () => void;
    @roleStorage.Mutation storageClearQuickFilter!: () => void;
    @roleStorage.Mutation storageClearRecommendConsultant!: () => void;
    @roleStorage.Getter idToken!: string | null;
    @roleStorage.Getter currentRole!: string | null;
    navBarList = [{
        authorityOfRoleList: [Role.NOT_LOGIN],
        routeUrl: '/login',
        title: '登入',
        title: '登入 | 註冊',
      },
      {
        authorityOfRoleList: [Role.USER],
@@ -53,13 +57,18 @@
        title: '個人帳號設定',
      },
      {
        authorityOfRoleList: [Role.ADMIN],
        routeUrl: '/notFinish',
        authorityOfRoleList:[Role.ADMIN],
        routeUrl: '/consultantAccountSetting',
        title: '查看帳號資訊',
      },
      {
        authorityOfRoleList: [Role.USER, Role.ADMIN],
        routeUrl: '/record/contactRecord',
        authorityOfRoleList:[Role.ADMIN],
        routeUrl: '/record',
        title: '查看紀錄',
      },
      {
        authorityOfRoleList: [Role.USER],
        routeUrl: '/userReviewsRecord',
        title: '查看紀錄',
      },
      {
@@ -86,7 +95,6 @@
    }
    routerNavigateTo(url: string): void {
      this.isOpenDropdown = !this.isOpenDropdown;
      (this.$refs.dropdown as any).hide();
      _.isEqual(url, '') ? this.fakeLogout() : this.$router.push(url);
    }
@@ -98,13 +106,10 @@
    // TODO: 僅OTP認證開發前 暫時使用
    fakeLogout(): void {
      this.storageClear();
      this.storageClearQuickFilter();
      this.storageClearRecommendConsultant();
      _.isEqual(this.$route.name, 'index') ? location.reload() : this.$router.push('/');
    }
  }
  export enum Role {
    USER = 'user',
    ADMIN = 'admin',
    NOT_LOGIN = '',
  }
</script>
@@ -118,7 +123,7 @@
    display: flex;
    align-items: center;
    background-color: $PRIMARY_WHITE;
    z-index: 3;
    z-index: 6;
    .pam-header__logo {
      height: 30px;
@@ -188,7 +193,7 @@
        color: $PRIMARY_WHITE;
      }
    }
  }
  }
  @include desktop {
    .pam-header {
@@ -206,7 +211,7 @@
      .pam-header__title {
        display: flex;
        justify-content: start;
        justify-content: flex-start;
        align-items: center;
        border: none;
        padding-left: 30px;