From abfd26bb700d93a92da6a04703b0187d4acaaeb5 Mon Sep 17 00:00:00 2001
From: Tomas <tomasysh@gmail.com>
Date: 星期三, 22 十二月 2021 10:13:02 +0800
Subject: [PATCH] refactor: move ts folder to shared folder

---
 PAMapp/pages/myAppointmentList.vue |  101 ++++++++++++++++++++++++++++++++++----------------
 1 files changed, 69 insertions(+), 32 deletions(-)

diff --git a/PAMapp/pages/myAppointmentList.vue b/PAMapp/pages/myAppointmentList.vue
index 53529c0..f5198db 100644
--- a/PAMapp/pages/myAppointmentList.vue
+++ b/PAMapp/pages/myAppointmentList.vue
@@ -6,78 +6,115 @@
                 <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="showNewAppointmentHint"
+        >
+            <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"
+                    >������</el-button>
+                </div>
+            </div>
+        </PopUpFrame>
     </div>
 </template>
 
 <script lang="ts">
 import { Vue, Component, State, Action, Watch } from 'nuxt-property-decorator';
-import { ClientInfo } from '~/assets/ts/api/appointment';
+
 import * as _ from 'lodash';
 
+import { ClientInfo } from '~/shared/models/client.model';
+
 @Component({
-    layout: 'home'
+    layout: 'home',
+    middleware: 'myAppointmentMiddleware'
 })
 export default class ClientReservedList extends Vue {
-    activeTabName = 'appointmentList';
-    appointmentList: ClientInfo[] = [];
-    contactedList: ClientInfo[] = [];
-    clients: ClientInfo[] = [];
 
-    @State('myAppointmentList') myAppointmentList!: ClientInfo[];
-    @Action storeMyAppointmentList!: any;
-
-    mounted() {
-     this.storeMyAppointmentList();
-
-     if (this.$route.name) {
-         this.activeTabName = this.$route.name.split('-')[1]
-     }
-    }
+    @State('myAppointmentList')
+    myAppointmentList!: ClientInfo[];
 
     @Watch('myAppointmentList')
     onMyAppointmentListChange() {
         this.contactedList = this.myAppointmentList
-            .filter(item => item.communicateStatus === 'contacted')
-            .sort((a, b) => a.appointmentDate > b.appointmentDate ? -1 : 1);
+            .filter(item => item.communicateStatus === 'contacted');
+
         this.appointmentList = this.myAppointmentList
-            .filter(item => item.communicateStatus !== 'contacted')
-            .sort((a, b) => a.appointmentDate > b.appointmentDate ? -1 : 1);;
+            .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>
@@ -106,7 +143,7 @@
     @include desktop {
         .pam-container {
             width: 700px;
-            margin: 30px auto 0px auto;
+            margin: 30px auto;
         }
     }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0