From 9ece54e8b526dc70b1a50014ee2c38e42bb403e4 Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期二, 25 一月 2022 12:25:43 +0800 Subject: [PATCH] update#134625: [ 客戶-我的顧問清單 ] 客戶安琪拉已預約熊蔡顧問,熊蔡顧問發送約訪通知,進入約訪中階段 , 但客戶安琪拉的顧問清單中 , 顧問熊蔡的狀態為「進行預約」 --- PAMapp/pages/index.vue | 252 +++++++++++++++++++++++++++++++++++++------------- 1 files changed, 186 insertions(+), 66 deletions(-) diff --git a/PAMapp/pages/index.vue b/PAMapp/pages/index.vue index e4b2ea8..e424a82 100644 --- a/PAMapp/pages/index.vue +++ b/PAMapp/pages/index.vue @@ -41,10 +41,9 @@ </div> <Ui-Dialog - :isVisible.sync="isVisibleDialog" - :width="width" + :isVisible.sync="isShowAppointmentDialog" + :width="appointmentDialogWidth" class="pam-myDemand-dialog pam-dialog-reserved" - @closeDialog="clearSatisfactionId" > <div v-if="appointmentDetail"> <h5 class="subTitle text--center mb-30">������</h5> @@ -71,16 +70,44 @@ </div> </div> - <div v-if="!appointmentDetail.satisfactionScore" class="reserved-btn"> + <div v-if="notScoreAppointmentYet" class="reserved-btn"> <el-button type="primary" - @click.native="reviewsBtn = true">蝯虫�遛��漲閰��</el-button> + @click.native="isShowReviewDialog = true">蝯虫�遛��漲閰��</el-button> </div> </div> </Ui-Dialog> <PopUpFrame - :isOpen.sync="reviewsBtn" - @closePopUp="clearSatisfactionId" + :isOpen.sync="isShowReAppointmentDialog" + @closePopUp="removeUrlQueryParameter('notContactAppointmentIdFromMsg')" + > + <div class="pam-dialog-review"> + <div class="mt-30 text--middle" v-if="agentInfo"> + 敺甇������<span class="text--bold">{{ consultantName }}</span>憿批�迤敹�葉嚗������蒂���隞“��� + </div> + + <el-row + type="flex" + class="mt-50" + justify="center"> + <el-button + type="primary" + @click="reAppointment">��������隞“���</el-button> + </el-row> + <el-row + type="flex" + class="mt-20" + justify="center"> + <el-button + class="outline_btn" + @click="cancelAppointment">������</el-button> + </el-row> + </div> + </PopUpFrame> + + <PopUpFrame + :isOpen.sync="isShowReviewDialog" + @closePopUp="removeUrlQueryParameter('appointmentId')" > <div class="mdTxt pam-dialog-review"> 靽憿批�遛��漲 @@ -110,13 +137,19 @@ <script lang="ts"> import { Vue, Component, State, Action, Watch, namespace } from 'nuxt-property-decorator'; + import { Appointment, AppointmentClosedInfo } from '~/shared/models/appointment.model'; import { Consultant } from '~/shared/models/consultant.model'; -import { UserReviewsConsultantsParams } from '~/shared/models/reviews.model'; + import { ContactStatus } from '~/shared/models/enum/contact-status'; + import { UserReviewsConsultantsParams } from '~/shared/models/reviews.model'; + import { StrictQueryParams } from '~/shared/models/strict-query.model'; import appointmentService from '~/shared/services/appointment.service'; -import reviewsService from '~/shared/services/reviews.service'; + import reviewsService from '~/shared/services/reviews.service'; import UtilsService from '~/shared/services/utils.service'; + import myConsultantService from '~/shared/services/my-consultant.service'; +import { AgentInfo } from '~/shared/models/agent-info.model'; const localStorage = namespace('localStorage'); + const roleStorage = namespace('localStorage'); @Component({ layout: 'home' @@ -129,10 +162,14 @@ @State('myConsultantList') myConsultantList!: Consultant[]; + @roleStorage.Getter + isAdminLogin!: boolean; + @Action storeRecommendList!: any; - @Action storeConsultantList!: any; + @Action + storeConsultantList!: any; @localStorage.Mutation storageClearQuickFilter!: () => void; @@ -143,37 +180,55 @@ @localStorage.Getter currentSatisfactionIdFromMsg!: string; + @localStorage.Getter + currentNotContactAppointmentIdFromMsg!: string; + @localStorage.Mutation storageClearSatisfactionIdFromMsg!: () => void; + @localStorage.Mutation + storageClearNotContactAppointmentIdFromMsg!: () => void; + + @localStorage.Mutation + storageStrickQueryItem!: (strictQueryDto: StrictQueryParams) => void; + consultantList: Consultant[] = []; - appointmentDetail: any = { - age : '', - agentNo : '', - appointmentDate : '', - communicateStatus : '', - consultantReadTime: null, - consultantViewTime: null, - contactTime : '', - contactType : '', - customerId : 0, - email : '', - gender : '', - hopeContactTime : "", - id : 0, - job : "", - lastModifiedDate : '', - name : '', - otherRequirement : null, - phone : "", - requirement : '', - satisfactionScore : 0, + appointmentDialogWidth = ''; + inputScore = 0; + isShowAppointmentDialog = false; + isShowReAppointmentDialog = false; + isShowReviewDialog = false; + consultantName = ''; + contactStatus = ContactStatus; + + appointmentDetail: Appointment = { + age : '', + agentNo : '', + appointmentClosedInfo: {} as AppointmentClosedInfo, + appointmentDate : '', + appointmentMemoList: [], + appointmentNoticeLogs: [], + communicateStatus : this.contactStatus.PICKED, + consultantReadTime: '', + consultantViewTime: '', + contactTime : '', + contactType : '', + customerId : 0, + email : '', + gender : '', + hopeContactTime : '', + interviewRecordDTOs: [], + id : 0, + job : '', + lastModifiedDate : '', + name : '', + otherRequirement : '', + phone : '', + requirement : '', + satisfactionScore : 0, }; - isVisibleDialog = false; - width = ''; - reviewsBtn = false; - inputScore = 0; + agentInfo: Consultant = { agentNo : '', name : '', @@ -192,17 +247,22 @@ ////////////////////////////////////////////////////////////////////// mounted() { - if (!this.recommendList?.length) { - this.storeRecommendList(); + if (this.isAdminLogin) { + this.$router.push('/myAppointmentList/appointmentList'); + } else { + if (!this.recommendList?.length) { + this.storeRecommendList(); + } + + this.storeConsultantList(); + this.storageClearQuickFilter(); + this.storageClearRecommendConsultant(); } - this.storeConsultantList(); - this.storageClearQuickFilter(); - this.storageClearRecommendConsultant(); } destroyed() { - this.clearSatisfactionId(); + this.removeUrlQueryParameter(); } ////////////////////////////////////////////////////////////////////// @@ -210,40 +270,85 @@ @Watch('myConsultantList') onMyConsultantListChange() { this.consultantList = (this.myConsultantList || []) - .filter(item => item.contactStatus !== 'contacted') .map((item) => ({ ...item, formatDate: new Date(item.updateTime || item.createTime)})) .sort((preItem, nextItem) => +nextItem.formatDate - +preItem.formatDate); - if (this.currentSatisfactionIdFromMsg) { - this.agentInfo = this.myConsultantList.filter(item => { - const satisfactionIdIndex = item.appointments?.findIndex(i => i.id === +this.currentSatisfactionIdFromMsg); - return satisfactionIdIndex !== undefined && satisfactionIdIndex > -1; - })[0]; - if (this.agentInfo) { - this.openAppointmentInfo(); - } + if (this.currentNotContactAppointmentIdFromMsg) { + this.autoOpenAppointmentBy('askReAppointment', +this.currentNotContactAppointmentIdFromMsg); + return; + } + if (this.currentSatisfactionIdFromMsg) { + this.autoOpenAppointmentBy('inviteReviewConsultant',+this.currentSatisfactionIdFromMsg); + this.storageClearSatisfactionIdFromMsg(); + return; } } - private openAppointmentInfo() { - appointmentService.getAppointmentDetail(+this.currentSatisfactionIdFromMsg).then(res => { - this.appointmentDetail = res; - this.width = UtilsService.isMobileDevice() ? '80%' : ''; - this.isVisibleDialog = true; - - if (!this.appointmentDetail.satisfactionScore) { - setTimeout(() => { - this.reviewsBtn = true; - }, 500) - } + private autoOpenAppointmentBy(reason: string, targetAppointmentId: number): void { + const setAgentInfo = new Promise((resolve, reject) => { + this.agentInfo = this.myConsultantList.filter(item => { + const appointmentIndex = item.appointments?.findIndex(i => i.id === targetAppointmentId); + return appointmentIndex !== undefined && appointmentIndex > -1; + })[0]; + if (this.agentInfo) { + myConsultantService.getConsultantDetail(this.agentInfo.agentNo).then((res) => resolve(res)); + } }); + + const setAppointment = new Promise((resolve, reject) => { + appointmentService.getAppointmentDetail(targetAppointmentId).then((res) => resolve(res)); + }); + + Promise.all([setAgentInfo, setAppointment]).then((values) => { + const agentInfo = values[0] as AgentInfo; + const appointmentInfo = values[1] as Appointment; + this.consultantName = agentInfo.name; + this.appointmentDetail = appointmentInfo; + this.appointmentDialogWidth = UtilsService.isMobileDevice() ? '80%' : ''; + this.isShowAppointmentDialog = true; + switch (reason) { + case 'inviteReviewConsultant': + if (this.notScoreAppointmentYet) { + setTimeout(() => { + this.isShowReviewDialog = true; + }, 500); + } + break; + case 'askReAppointment': + setTimeout(() => { + this.isShowReAppointmentDialog = true; + }, 500); + break; + } + }); + } ////////////////////////////////////////////////////////////////////// navigateToRoute(path: string): void { this.$router.push(path); + } + + reAppointment(): void { + appointmentService.cancelAppointment(this.appointmentDetail.id).then(() => { + const requirements = this.appointmentDetail.requirement.split(','); + this.storeConsultantList(); + this.storageStrickQueryItem({ requirements: requirements }); + this.storageClearNotContactAppointmentIdFromMsg(); + this.removeUrlQueryParameter('notContactAppointmentIdFromMsg'); + this.$router.push('/recommendConsultant'); + }); + } + + cancelAppointment(): void { + appointmentService.cancelAppointment(this.appointmentDetail.id).then(() => { + this.storeConsultantList(); + this.storageClearNotContactAppointmentIdFromMsg(); + this.removeUrlQueryParameter('notContactAppointmentIdFromMsg'); + this.$router.push(''); + }); } userReviewsConsultants() { @@ -254,14 +359,22 @@ this.appointmentDetail.satisfactionScore = this.inputScore; reviewsService.userReviewsConsultants(reviewParams).then((res) => { - this.reviewsBtn = false; + this.isShowReviewDialog = false; }); } - clearSatisfactionId() { - console.log('close'); - this.$router.push({query: {}}); - this.storageClearSatisfactionIdFromMsg(); + removeUrlQueryParameter(targetKey?: string): void { + // NOTE: ���摰�� query parameter [Tomas, 2022/1/24 11:36] + // [REF] How to remove a parameter from this.$router.query Nuxt.js? https://reurl.cc/X45aMD + let newRouteQuery = {}; + if (targetKey) { + Object.keys(this.$route.query).forEach((key) => { + if (key !== targetKey) { + newRouteQuery[key] = this.$route.query[key] + } + }) + } + this.$router.push(newRouteQuery); } /////////////////////////////////////////////////////////////////////////////// @@ -279,6 +392,13 @@ return contactList.filter((item: any) => !!item && item !== ",") } + get notScoreAppointmentYet(): boolean { + if (this.appointmentDetail.communicateStatus === 'closed' || this.appointmentDetail.communicateStatus === 'done') { + return !this.appointmentDetail.satisfactionScore; + }; + return false; + } + } </script> -- Gitblit v1.8.0