From cc663139f6abd63f7deac4739b63db754baf595c Mon Sep 17 00:00:00 2001 From: Mila <Mila@pollex.com.tw> Date: 星期三, 29 十二月 2021 12:31:00 +0800 Subject: [PATCH] update: TODO#132858 顧問經由簡訊或mail 點擊 url 查看客戶預約清單 --- PAMapp/pages/myAppointmentList/contactedList.vue | 66 ++++++++++++++++++++++++++------- 1 files changed, 52 insertions(+), 14 deletions(-) diff --git a/PAMapp/pages/myAppointmentList/contactedList.vue b/PAMapp/pages/myAppointmentList/contactedList.vue index de75b31..aedf894 100644 --- a/PAMapp/pages/myAppointmentList/contactedList.vue +++ b/PAMapp/pages/myAppointmentList/contactedList.vue @@ -5,6 +5,7 @@ placeholder="隢撓���摮�" class="mb-30 pam-clientReserved-input" v-model="keyWord" + @keyup.enter.native="search" > <i slot="suffix" @@ -20,34 +21,71 @@ <UiPagination :totalList="filterList" + :currentPage="currentPage" @changePage="changePage" ></UiPagination> </div> </template> <script lang="ts"> -import { Vue, Component, Prop } from 'nuxt-property-decorator'; -import { ClientInfo } from '~/assets/ts/api/appointment'; +import { Vue, Component, Watch, State, namespace } from 'nuxt-property-decorator'; +import { ClientInfo } from '~/shared/models/client.model'; + +const localStorage = namespace('localStorage'); @Component export default class ClientContactedList extends Vue { - @Prop({default: []}) contactedList!: ClientInfo[]; - pageList: ClientInfo[] = []; - keyWord: string = ''; - filterList: ClientInfo[] = []; + + @State('myAppointmentList') + myAppointmentList!: ClientInfo[]; + + @localStorage.Getter + currentAppointmentIdFromMsg!: string; + + contactedList: ClientInfo[] = []; + filterList : ClientInfo[] = []; + keyWord : string = ''; + pageList : ClientInfo[] = []; + currentPage : number = 1; + + ////////////////////////////////////////////////////////////////////// mounted() { - this.filterList = JSON.parse(JSON.stringify(this.contactedList)); + this.onMyAppointmentListChange(); } - changePage(pageList: ClientInfo[]) { + ////////////////////////////////////////////////////////////////////// + + @Watch('myAppointmentList') + onMyAppointmentListChange() { + this.contactedList = (this.myAppointmentList || []) + .filter(item => item.communicateStatus === 'contacted') + .map((item) => ({...item, sortTime: new Date(item.contactTime)})) + .sort((prevItem, nextItem) => +nextItem.sortTime - +prevItem.sortTime); + this.filterList = this.contactedList; + + this.getCurrentPage(); + } + + private getCurrentPage() { + const currentIndex = this.filterList.findIndex(item => item.id === +this.currentAppointmentIdFromMsg); + const pageSize = 5; + if (currentIndex > -1) { + this.currentPage = Math.ceil((currentIndex + 1) / pageSize); + } + } + + ////////////////////////////////////////////////////////////////////// + + search(): void { + this.filterList = this.contactedList.filter(item => { + return item?.name?.match(this.keyWord) || item?.requirement?.match(this.keyWord) + }) + } + + changePage(pageList: ClientInfo[]): void { this.pageList = pageList; } - search() { - this.filterList = this.contactedList.filter(item => { - return item.name.match(this.keyWord) || item.requirement.match(this.keyWord) - }) - } } -</script> \ No newline at end of file +</script> -- Gitblit v1.8.0