From 76c1ce3c2eb001560bfb785f7b2f62d4ec64dcb6 Mon Sep 17 00:00:00 2001 From: Mila <Mila@pollex.com.tw> Date: 星期五, 10 十二月 2021 09:49:50 +0800 Subject: [PATCH] update 使用 currentRole 判斷目前是否為顧問/客戶登入狀態 --- PAMapp/components/Consultant/ConsultantCard.vue | 126 +++++++++++++++++++++++++---------------- 1 files changed, 77 insertions(+), 49 deletions(-) diff --git a/PAMapp/components/Consultant/ConsultantCard.vue b/PAMapp/components/Consultant/ConsultantCard.vue index d305d59..2e7937e 100644 --- a/PAMapp/components/Consultant/ConsultantCard.vue +++ b/PAMapp/components/Consultant/ConsultantCard.vue @@ -13,10 +13,14 @@ ></UiAvatar> <div> <i class="icon-star pam-icon icon--yellow satisfaction" v-if="!(latestContactedAppointment && !latestContactedAppointment.satisfactionScore)"></i> - <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span> - <span v-if="agentInfo.contactStatus === 'contacted'"> - {{ latestContactedAppointment && latestContactedAppointment.satisfactionScore || '�憛急遛��漲' }} + <span v-if="agentInfo.contactStatus === 'contacted' && latestContactedAppointment && latestContactedAppointment.satisfactionScore"> + {{ latestContactedAppointment && latestContactedAppointment.satisfactionScore}} </span> + <div class="unfilled text--center " + style="display:flex" + v-if="agentInfo.contactStatus === 'contacted' && + latestContactedAppointment && !latestContactedAppointment.satisfactionScore">�憛�<br />皛踵�漲</div> + <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span> </div> </el-col> <el-col :xs="10" :sm="15"> @@ -24,7 +28,7 @@ <div class="professionals"> <span class="professionalsTxt" - v-for="(expertise, index) in expertises" + v-for="(expertise, index) in agentInfo.expertise" :key="index" >#{{expertise}}</span> </div> @@ -41,7 +45,9 @@ @click="reserveCommunication" :class="agentInfo.contactStatus + 'Btn'" >{{ contactTxt }}</el-button> - <div class="updateTime" v-if="updateTime">{{updateTime | formatDate}}</div> + <div class="updateTime"> + {{ displayTime | formatDate }} + </div> </el-col> </el-row> </el-col> @@ -68,14 +74,14 @@ :key="index" >��蝯⊥�挾{{index + 1 | formatNumber}}嚗{ item | formatHopeContactTime }}</p> <div v-if="appointmentDetail.satisfactionScore"> - <div class="mdTxt mt-10 mb-10">皛踵�漲</div> - <el-rate + <div class="mdTxt mt-10 mb-10">皛踵�漲</div> + <el-rate :value="appointmentDetail.satisfactionScore" class="pam-myDemand-dialog__rate" disabled> - </el-rate> + </el-rate> + </div> </div> - </div> <div v-if="agentInfo.contactStatus === 'contacted' && !appointmentDetail.satisfactionScore" class="dialogInfo-btn"> @@ -89,7 +95,7 @@ </div> </div> </Ui-Dialog> - <PopUpFrame :isOpen.sync="reviewsBtn" drawerSize='30%'> + <PopUpFrame :isOpen.sync="reviewsBtn"> <div class="mdTxt"> 靽憿批�遛��漲 <span class="hint">������</span> @@ -116,13 +122,13 @@ </template> <script lang="ts"> -import { Vue, Component, Prop, Action } from 'nuxt-property-decorator'; -import { getAppointmentDetail, UserReviewsConsultantsParams, userReviewsConsultants, cancelAppointment, AppointmentRequests } from '~/assets/ts/api/consultant'; +import { Vue, Component, Prop, Action, namespace } from 'nuxt-property-decorator'; +import { getAppointmentDetail, UserReviewsConsultantsParams, userReviewsConsultants, cancelAppointment } from '~/assets/ts/api/consultant'; import { Consultant, Appointment } from '~/assets/ts/models/consultant.model'; -import { isLogin } from '~/assets/ts/auth'; import { isMobileDevice } from '~/assets/ts/device'; +import { Role } from '~/assets/ts/models/enum/Role'; - +const roleStorage = namespace('localStorage'); @Component({ filters: { formatNumber(index: number) { @@ -132,13 +138,13 @@ } }, formatHopeContactTime(item: string): string { - if (item) { + if (item) { const [hopeDay, hopeTime] = item.split('��'); const day = hopeDay.split(',').length > 6 ? '銝����' : hopeDay; const time = hopeTime.split(',').length > 3 ? '銝����' : hopeTime; return `${day}��${time}`; - } - return ''; + } + return ''; } } }) @@ -146,6 +152,8 @@ @Action removeFromMyConsultantList!: (agentNo: string) => Promise<boolean>; @Action storeConsultantList!: any; @Prop() agentInfo!: Consultant; + @roleStorage.Getter currentRole!:string; + isVisibleDialog = false; reviewsBtn = false; status = false; @@ -164,39 +172,57 @@ get latestReservedAppointment(): Appointment { return this.agentInfo.appointments! .filter((appointment) => appointment.communicateStatus !== 'contacted') - .sort((preAppointment, nextAppointment) => +nextAppointment.appointmentDate - +preAppointment.appointmentDate)[0]; + .map((reversedAppointment) => { + return { + ...reversedAppointment, + sortDate: new Date(reversedAppointment.appointmentDate) + } + }) + .sort((preAppointment, nextAppointment) => +nextAppointment.sortDate - +preAppointment.sortDate)[0]; + } + get displayTime(): string { + let time = ''; + switch(this.agentInfo.contactStatus) { + case 'reserved': + time = this.agentInfo.updateTime + break; + case 'contacted': + time = this.agentInfo.updateTime + break; + case 'picked': + time = this.agentInfo.createTime + break; + } + return time; } appointmentDetail: any = { - age:'', - agentNo: '', - appointmentDate: '', - communicateStatus: '', + 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, + contactTime : '', + contactType : '', + customerId : 0, + email : '', + gender : '', + hopeContactTime : "", + id : 0, + job : "", + lastModifiedDate : '', + name : '', + otherRequirement : null, + phone : "", + requirement : '', + satisfactionScore : 0, }; get avatarFileName() { return this.agentInfo.img; } - get expertises() { - return this.agentInfo.expertise ? this.agentInfo.expertise : this.agentInfo.expertise; - } get gender() { if (this.appointmentDetail.gender) { return this.appointmentDetail.gender === 'male' ? '���' : '憟單��'; @@ -213,10 +239,6 @@ return '�脰����'; } - get updateTime() { - return isLogin() ? this.agentInfo.updateTime : ''; - } - get hopeContactTime() { const contactList = this.appointmentDetail.hopeContactTime .split("'").map(item => item.slice(0, item.length)); @@ -226,7 +248,7 @@ reserveCommunication() { const contactStatus = this.agentInfo.contactStatus; if (!contactStatus || contactStatus === 'picked') { - isLogin() + this.currentRole === Role.USER ? this.$router.push(`/questionnaire/${this.agentInfo.agentNo}`) : this.$router.push('/login'); } else { @@ -235,9 +257,11 @@ } openPopUp() { - getAppointmentDetail(this.latestContactedAppointment - ? this.latestContactedAppointment.id - : this.latestReservedAppointment.id).then(res => { + const appointmentId = this.agentInfo.contactStatus === 'contacted' + ? this.latestContactedAppointment?.id + : this.latestReservedAppointment.id; + + getAppointmentDetail(appointmentId!).then(res => { this.appointmentDetail = { ...this.appointmentDetail, ...res.data @@ -249,7 +273,6 @@ removeAgent() { this.removeFromMyConsultantList(this.agentInfo.agentNo).then((removeOk) => { - console.log('removeOk?', removeOk); }); } @@ -307,6 +330,11 @@ font-weight: bold; margin-top: 5px; } + .unfilled { + font-size: 12px; + padding-top: 5px; + padding-left: 5px; + } .professionals { height: 20px; @@ -380,4 +408,4 @@ margin-bottom: 50px; } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0