From bb682522ce2e18f7c67f087620134d3aadba559d Mon Sep 17 00:00:00 2001 From: Mila <Mila@pollex.com.tw> Date: 星期二, 16 十一月 2021 21:00:50 +0800 Subject: [PATCH] update 預約清單: 使用 store 存放 AppointmentList --- PAMapp/pages/myAppointmentList/contactedList.vue | 19 +++++++++++++++---- 1 files changed, 15 insertions(+), 4 deletions(-) diff --git a/PAMapp/pages/myAppointmentList/contactedList.vue b/PAMapp/pages/myAppointmentList/contactedList.vue index de75b31..857d6cd 100644 --- a/PAMapp/pages/myAppointmentList/contactedList.vue +++ b/PAMapp/pages/myAppointmentList/contactedList.vue @@ -19,25 +19,36 @@ ></ClientList> <UiPagination - :totalList="filterList" + :totalList="contactedList" @changePage="changePage" ></UiPagination> </div> </template> <script lang="ts"> -import { Vue, Component, Prop } from 'nuxt-property-decorator'; +import { Vue, Component, Watch, State } from 'nuxt-property-decorator'; import { ClientInfo } from '~/assets/ts/api/appointment'; @Component export default class ClientContactedList extends Vue { - @Prop({default: []}) contactedList!: ClientInfo[]; + @State('myAppointmentList') myAppointmentList!: ClientInfo[]; + + contactedList: ClientInfo[] = []; pageList: ClientInfo[] = []; keyWord: string = ''; filterList: ClientInfo[] = []; + @Watch('myAppointmentList') + onMyAppointmentListChange() { + this.contactedList = (this.myAppointmentList || []) + .filter(item => item.communicateStatus === 'contacted') + .sort((a, b) => a.appointmentDate > b.appointmentDate ? -1 : 1); + } + mounted() { - this.filterList = JSON.parse(JSON.stringify(this.contactedList)); + console.log('ClientContactedList mounted'); + + this.onMyAppointmentListChange(); } changePage(pageList: ClientInfo[]) { -- Gitblit v1.8.0