保誠-保戶業務員媒合平台
HelenHuang
2021-12-06 9cb6d5f92ad7aeda45ad1fe6482dcfc63d17be2b
PAMapp/pages/myAppointmentList.vue
@@ -21,12 +21,26 @@
            <NuxtChild></NuxtChild>
        </div>
        <PopUpFrame
             :isOpen.sync="showNewAppointmentNumber"
        >
            <div class="text--center mdTxt">
                <p class="mb-50">你有 <span class="text--primary">{{newAppointmentNumber}}</span> 則新的預約</p>
                <div class="text--center">
                    <el-button
                        type="primary"
                        @click="showNewAppointmentNumber = 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 { allAppointmentsView, ClientInfo } from '~/assets/ts/api/appointment';
import * as _ from 'lodash';
@Component({
@@ -37,12 +51,20 @@
    appointmentList: ClientInfo[] = [];
    contactedList: ClientInfo[] = [];
    clients: ClientInfo[] = [];
    newAppointmentNumber: number = 0;
    showNewAppointmentNumber = false;
    @State('myAppointmentList') myAppointmentList!: ClientInfo[];
    @Action storeMyAppointmentList!: any;
    @Action storeMyAppointmentList!: () => Promise<number>;
    mounted() {
     this.storeMyAppointmentList();
     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]
@@ -52,11 +74,10 @@
    @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) {