保誠-保戶業務員媒合平台
Tomas
2023-12-25 f065760fa7df1f88747395ab4b55349ce8b2faf0
PAMapp/pages/myAppointmentList.vue
@@ -1,7 +1,6 @@
<template>
    <div>
      <div class="pam-myAppointment-banner"></div>
    <InterviewNotification></InterviewNotification>
        <div class="pam-container">
            <div class="pam-cus-tabs mb-10">
                <div
@@ -33,26 +32,39 @@
        <!-- DIALOG -->
        <PopUpFrame
             :isOpen.sync="showNewAppointmentHint"
             :isOpen.sync="isShowNewAppointmentHint"
        >
            <div class="text--center mdTxt">
                <p class="mb-50">您有 <span class="text--primary">{{ newAppointmentSum }}</span> 則新的預約</p>
                <div class="text--center">
                    <el-button
                        type="primary"
                        @click="showNewAppointmentHint = false"
                        @click="isShowNewAppointmentHint = false"
                    >我知道了</el-button>
                </div>
            </div>
        </PopUpFrame>
      <PopUpFrame
        :isOpen.sync="isShowRemindAppointmentDialog"
      >
          <div class="text--center mdTxt">
              <p class="mb-50">您有 <span class="text--primary">{{ pendingAppointmentSum }}</span> 則預約單未進行聯繫,請盡速處理</p>
              <div class="text--center">
                  <el-button
                      type="primary"
                      @click="isShowRemindAppointmentDialog = false"
                  >我知道了</el-button>
              </div>
          </div>
      </PopUpFrame>
    </div>
</template>
<script lang="ts">
import { Vue, Component, State, Action, Watch, namespace } from 'nuxt-property-decorator';
import { Vue, Component, Watch, namespace } from 'nuxt-property-decorator';
import * as _ from 'lodash';
import appointmentService from '~/shared/services/appointment.service';
import { Appointment } from '~/shared/models/appointment.model';
import { ContactStatus } from '~/shared/models/enum/contact-status';
@@ -89,14 +101,23 @@
    @localStorage.Getter
    currentAppointmentIdFromMsg!: string;
    activeTabName          : string        = 'appointmentList';
    contactStatus          = ContactStatus;
    showNewAppointmentHint: boolean        = false;
    activeTabName                 = 'appointmentList';
    isShowNewAppointmentHint      = false;
    isShowRemindAppointmentDialog = false;
    pendingAppointmentSum         = 0;
    //////////////////////////////////////////////////////////////////////
    mounted() {
      this.getMyAppointmentList();
        appointmentService.getPendingAppointmentSum().then((pendingAppointmentSum) => {
        this.pendingAppointmentSum = pendingAppointmentSum;
        if (this.pendingAppointmentSum) {
          this.isShowRemindAppointmentDialog = true;
        }
      });
    }
    destroyed() {
@@ -135,7 +156,7 @@
    @Watch('newAppointmentSum')
    newAppointmentSumChange(): void {
      this.showNewAppointmentHint = this.newAppointmentSum > 0;
      this.isShowNewAppointmentHint = this.newAppointmentSum > 0;
    }
    @Watch('$route', {immediate: true})
@@ -160,8 +181,8 @@
    // format to {page}-banner or pam-no-banner tag
    private routeFormatBannerClass(route: string): string {
        const needBannerTags = ['myAppointmentList-appointmentList', 'myAppointmentList-closedList'];
        return _.includes(needBannerTags, route) ? route + '-banner' : 'pam-no-banner';
      const needBannerTags = ['myAppointmentList-appointmentList', 'myAppointmentList-closedList'];
      return needBannerTags.includes(route) ? route + '-banner' : 'pam-no-banner';
    };
}
</script>