From 9c74f31c6e41de2bb2f6175a290f42d91968844e Mon Sep 17 00:00:00 2001 From: Mila <Mila@pollex.com.tw> Date: 星期二, 11 一月 2022 14:24:17 +0800 Subject: [PATCH] update: TODO#132493 客戶端收到簡訊/EMAIL後進行滿意度評分 --- PAMapp/pages/index.vue | 182 +++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 180 insertions(+), 2 deletions(-) diff --git a/PAMapp/pages/index.vue b/PAMapp/pages/index.vue index b267189..e4b2ea8 100644 --- a/PAMapp/pages/index.vue +++ b/PAMapp/pages/index.vue @@ -39,12 +39,82 @@ <ConsultantSwiper :agents="recommendList"></ConsultantSwiper> </div> </div> + + <Ui-Dialog + :isVisible.sync="isVisibleDialog" + :width="width" + class="pam-myDemand-dialog pam-dialog-reserved" + @closeDialog="clearSatisfactionId" + > + <div v-if="appointmentDetail"> + <h5 class="subTitle text--center mb-30">������</h5> + <p class="smTxt">{{appointmentDetail.appointmentDate | formatDate}}</p> + <div class="reserved-info"> + <p>憪��{appointmentDetail.name}}</p> + <p>�閰梧�{appointmentDetail.phone}}</p> + <p>Email嚗{appointmentDetail.email}}</p> + <p>�批嚗{gender}}</p> + <p>撟湧翩嚗{appointmentDetail.age | toAgeLabel }}</p> + <p>�璆哨�{appointmentDetail.job}}</p> + <p>��瘙�{appointmentDetail.requirement.split(',').join('��')}}</p> + <p + v-for="(item, index) in hopeContactTime" + :key="index" + >��蝯⊥�挾{{index + 1 | formatNumber}}嚗{ item | formatHopeContactTime }}</p> + <div v-if="appointmentDetail.satisfactionScore"> + <div class="mdTxt mt-10 mb-10">皛踵�漲</div> + <el-rate + :value="appointmentDetail.satisfactionScore" + class="pam-myDemand-dialog__rate" + disabled> + </el-rate> + </div> + </div> + + <div v-if="!appointmentDetail.satisfactionScore" class="reserved-btn"> + <el-button type="primary" + @click.native="reviewsBtn = true">蝯虫�遛��漲閰��</el-button> + </div> + </div> + </Ui-Dialog> + + <PopUpFrame + :isOpen.sync="reviewsBtn" + @closePopUp="clearSatisfactionId" + > + <div class="mdTxt pam-dialog-review"> + 靽憿批�遛��漲 + <span class="hint">������</span> + <div class="mt-30 review-content" v-if="agentInfo"> + <UiAvatar :size="80" :agentNo="agentInfo.agentNo"></UiAvatar> + <div class="review-text">撠憿批�� + <span class="text--primary">{{agentInfo.name}}</span> + ��擃���蝯虫�嗾憿��嚗� + </div> + </div> + + <div class="review-score"> + <el-rate v-model="inputScore" class="pam-rate mt-30"></el-rate> + </div> + + <div class="review-btn"> + <el-button + type="primary" + :disabled="!inputScore" + @click="userReviewsConsultants">�</el-button> + </div> + </div> + </PopUpFrame> </div> </template> <script lang="ts"> import { Vue, Component, State, Action, Watch, namespace } from 'nuxt-property-decorator'; import { Consultant } from '~/shared/models/consultant.model'; +import { UserReviewsConsultantsParams } from '~/shared/models/reviews.model'; + import appointmentService from '~/shared/services/appointment.service'; +import reviewsService from '~/shared/services/reviews.service'; + import UtilsService from '~/shared/services/utils.service'; const localStorage = namespace('localStorage'); @@ -70,7 +140,54 @@ @localStorage.Mutation storageClearRecommendConsultant!: () => void; + @localStorage.Getter + currentSatisfactionIdFromMsg!: string; + + @localStorage.Mutation + storageClearSatisfactionIdFromMsg!: () => 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, + }; + isVisibleDialog = false; + width = ''; + reviewsBtn = false; + inputScore = 0; + agentInfo: Consultant = { + agentNo : '', + name : '', + img : '', + expertise : [], + avgScore : 0, + contactStatus : '', + createTime : '', + updateTime : '', + customerViewTime : '', + role : '', + seniority : '', + appointments : [] + }; ////////////////////////////////////////////////////////////////////// @@ -84,6 +201,10 @@ this.storageClearRecommendConsultant(); } + destroyed() { + this.clearSatisfactionId(); + } + ////////////////////////////////////////////////////////////////////// @Watch('myConsultantList') @@ -91,13 +212,71 @@ 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) + .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(); + } + + } + } + + 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) + } + }); } ////////////////////////////////////////////////////////////////////// navigateToRoute(path: string): void { this.$router.push(path); + } + + userReviewsConsultants() { + const reviewParams: UserReviewsConsultantsParams = { + appointmentId: this.appointmentDetail.id, + score: this.inputScore, + } + this.appointmentDetail.satisfactionScore = this.inputScore; + + reviewsService.userReviewsConsultants(reviewParams).then((res) => { + this.reviewsBtn = false; + }); + } + + clearSatisfactionId() { + console.log('close'); + this.$router.push({query: {}}); + this.storageClearSatisfactionIdFromMsg(); + } + + /////////////////////////////////////////////////////////////////////////////// + + get gender() { + if (this.appointmentDetail.gender) { + return this.appointmentDetail.gender === 'male' ? '���' : '憟單��'; + } + return '' + } + + get hopeContactTime() { + const contactList = this.appointmentDetail.hopeContactTime + .split("'").map((item: any) => item.slice(0, item.length)); + return contactList.filter((item: any) => !!item && item !== ",") } } @@ -182,5 +361,4 @@ max-width: 335px; } } - </style> -- Gitblit v1.8.0