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/appointmentList.vue | 72 ++++++++++++++++++++++++++++++----- 1 files changed, 61 insertions(+), 11 deletions(-) diff --git a/PAMapp/pages/myAppointmentList/appointmentList.vue b/PAMapp/pages/myAppointmentList/appointmentList.vue index 0a9286a..7c39615 100644 --- a/PAMapp/pages/myAppointmentList/appointmentList.vue +++ b/PAMapp/pages/myAppointmentList/appointmentList.vue @@ -5,6 +5,7 @@ placeholder="隢撓���摮�" class="mb-30 pam-clientReserved-input" v-model="keyWord" + @keyup.enter.native="search" > <i slot="suffix" class="icon-search search cursor--pointer" @click="search"></i> </el-input> @@ -16,35 +17,84 @@ <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/consultant'; +import { Vue, Component, State, Watch, namespace } from 'nuxt-property-decorator'; +import { ClientInfo } from '~/shared/models/client.model'; + +const localStorage = namespace('localStorage'); @Component export default class ClientReservedList extends Vue { - @Prop({default: []}) appointmentList!: ClientInfo[]; - pageList: ClientInfo[] = []; - keyWord: string = ''; - filterList: ClientInfo[] = []; + + @State('myAppointmentList') + myAppointmentList!: ClientInfo[]; + + @localStorage.Getter + currentAppointmentIdFromMsg!: string; + + appointmentList: ClientInfo[] = []; + filterList : ClientInfo[] = []; + keyWord : string = ''; + pageList : ClientInfo[] = []; + currentPage : number = 1; + + ////////////////////////////////////////////////////////////////////// mounted() { - this.filterList = JSON.parse(JSON.stringify(this.appointmentList)) + this.onMyAppointmentListChange(); } - changePage(pageList: ClientInfo[]) { - this.pageList = pageList; + ////////////////////////////////////////////////////////////////////// + + @Watch('myAppointmentList') + onMyAppointmentListChange(): void { + const unViewList = this.myAppointmentList + .filter((item) => item.communicateStatus !== 'contacted' && !item.consultantViewTime) + .map((item) => ({ ...item, sortTime: new Date(item.appointmentDate)})) + .sort((preItem, nextItem) => +nextItem.sortTime - +preItem.sortTime); + + const tempViewList = this.myAppointmentList + .filter(item => item.communicateStatus !== 'contacted' && item.consultantViewTime); + + // TODO: 敺������� unreadList ��蝝啁溶�������隢�垢����靘������ createTime嚗�Tomas, 2021/12/16];疇 + const unreadList = tempViewList + .filter((item) => !item.consultantReadTime); + const readList = tempViewList + .filter((item) => item.consultantReadTime) + .map((item) => ({ ...item, sortTime: new Date(item.consultantReadTime)})) + .sort((preItem, nextItem) => +nextItem.sortTime - +preItem.sortTime); + + this.appointmentList = [...unViewList, ...unreadList, ...readList]; + this.filterList = this.appointmentList; + + this.getCurrentPage(); } - search() { + 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.appointmentList.filter(item => { return item.name.match(this.keyWord) || item.requirement.match(this.keyWord) }) } + changePage(pageList: ClientInfo[]): void { + this.pageList = pageList; + } + } -</script> \ No newline at end of file +</script> -- Gitblit v1.8.0