From bdae23a40c461c2c6b6ee614f661eac731c949c8 Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期三, 22 十二月 2021 14:12:05 +0800
Subject: [PATCH] Merge branch 'master' of https://192.168.0.10:8443/r/pcalife/PAM

---
 PAMapp/pages/myAppointmentList.vue |   89 ++++++++++++++++++++++++++------------------
 1 files changed, 52 insertions(+), 37 deletions(-)

diff --git a/PAMapp/pages/myAppointmentList.vue b/PAMapp/pages/myAppointmentList.vue
index 103b62a..f5198db 100644
--- a/PAMapp/pages/myAppointmentList.vue
+++ b/PAMapp/pages/myAppointmentList.vue
@@ -6,31 +6,33 @@
                 <div
                     class="cus-tab-item"
                     :class="{'is-active': activeTabName === 'appointmentList'}"
-                    @click="tabClick('appointmentList')"
+                    @click="clickTab('appointmentList')"
                 >摰Ｘ����
                     <span class="p">({{appointmentList.length}})</span>
                 </div>
                 <div
                     class="cus-tab-item"
                     :class="{'is-active': activeTabName === 'contactedList'}"
-                    @click="tabClick('contactedList')"
+                    @click="clickTab('contactedList')"
                 >撌脰蝯�
                     <span class="p">({{contactedList.length}})</span>
                 </div>
             </div>
 
             <NuxtChild></NuxtChild>
+
         </div>
 
+        <!-- DIALOG -->
         <PopUpFrame
-             :isOpen.sync="showNewAppointmentNumber"
+             :isOpen.sync="showNewAppointmentHint"
         >
             <div class="text--center mdTxt">
-                <p class="mb-50">雿�� <span class="text--primary">{{newAppointmentNumber}}</span> �������</p>
+                <p class="mb-50">雿�� <span class="text--primary">{{ newAppointmentSum }}</span> �������</p>
                 <div class="text--center">
                     <el-button
                         type="primary"
-                        @click="showNewAppointmentNumber = false"
+                        @click="showNewAppointmentHint = false"
                     >������</el-button>
                 </div>
             </div>
@@ -40,37 +42,19 @@
 
 <script lang="ts">
 import { Vue, Component, State, Action, Watch } from 'nuxt-property-decorator';
-import { allAppointmentsView, ClientInfo } from '~/assets/ts/api/appointment';
+
 import * as _ from 'lodash';
+
+import { ClientInfo } from '~/shared/models/client.model';
 
 @Component({
     layout: 'home',
     middleware: 'myAppointmentMiddleware'
 })
 export default class ClientReservedList extends Vue {
-    activeTabName = 'appointmentList';
-    appointmentList: ClientInfo[] = [];
-    contactedList: ClientInfo[] = [];
-    clients: ClientInfo[] = [];
-    newAppointmentNumber: number = 0;
-    showNewAppointmentNumber = false;
 
-    @State('myAppointmentList') myAppointmentList!: ClientInfo[];
-    @Action storeMyAppointmentList!: () => Promise<number>;
-
-    mounted() {
-     this.storeMyAppointmentList().then(newDataLength => {
-         this.newAppointmentNumber = newDataLength;
-         if (this.newAppointmentNumber > 0) {
-             this.showNewAppointmentNumber = true;
-             allAppointmentsView().then(res => res);
-         }
-    });
-
-     if (this.$route.name) {
-         this.activeTabName = this.$route.name.split('-')[1]
-     }
-    }
+    @State('myAppointmentList')
+    myAppointmentList!: ClientInfo[];
 
     @Watch('myAppointmentList')
     onMyAppointmentListChange() {
@@ -81,25 +65,56 @@
             .filter(item => item.communicateStatus !== 'contacted');
     }
 
-    tabClick(path: string) {
-        this.activeTabName = path;
-        this.$router.push('/myAppointmentList/' + this.activeTabName)
+    @State('myNewAppointmentSum')
+    newAppointmentSum!: number;
+
+    @Watch('newAppointmentSum')
+    newAppointmentSumChange(): void {
+      this.showNewAppointmentHint = this.newAppointmentSum > 0;
     }
 
-    get route(): string{
-        const routeName = this.$route.name;
-        return routeName ? routeName:'';
-    };
+    activeTabName = 'appointmentList';
+    appointmentList: ClientInfo[] = [];
+    contactedList: ClientInfo[] = [];
+    clients: ClientInfo[] = [];
+    showNewAppointmentHint = false;
 
     get bannerClassName() {
-        return this.routeFormatBannerClass(this.route);
+        const routeName = this.$route.name || '';
+        return this.routeFormatBannerClass(routeName);
     };
 
+    //////////////////////////////////////////////////////////////////////
+
+    mounted() {
+      this.setActivatedTab();
+      this.storeMyAppointmentList();
+    }
+
+    //////////////////////////////////////////////////////////////////////
+
+    @Action
+    storeMyAppointmentList!: () => Promise<number>;
+
+
+    clickTab(path: string): void {
+      this.activeTabName = path;
+      this.$router.push(`/myAppointmentList/${this.activeTabName}`);
+    }
+
+    //////////////////////////////////////////////////////////////////////
     // format to {page}-banner or pam-no-banner tag
     private routeFormatBannerClass(route: string): string {
         const needBannerTags = ['myAppointmentList-appointmentList', 'myAppointmentList-contactedList'];
         return _.includes(needBannerTags, route) ? route + '-banner' : 'pam-no-banner';
     };
+
+    private setActivatedTab(): void {
+      const routeFullName = this.$route.name;
+      if (routeFullName) {
+        this.activeTabName = routeFullName.split('-')[1];
+      }
+    }
 
 }
 </script>
@@ -131,4 +146,4 @@
             margin: 30px auto;
         }
     }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0