| | |
| | | ></el-avatar> |
| | | <div class="satisfaction" v-if="!hideReviews"> |
| | | <template v-if="client.satisfactionScore"> |
| | | TODO:隱藏滿意度 |
| | | <i class="icon-star pam-icon icon--yellow satisfaction"></i> |
| | | <span>{{client.satisfactionScore}}</span> |
| | | </template> |
| | |
| | | v-else-if="client.communicateStatus === contactStatus.CONTACTED"> |
| | | 結案 |
| | | </div> |
| | | <div |
| | | <!-- <div |
| | | class="invite-msg smTxt_bold" |
| | | @click.stop="inviteReview" |
| | | v-else-if="!client.satisfactionScore"> |
| | | 發送滿意度 |
| | | </div> |
| | | </div> --> |
| | | |
| | | <div |
| | | class="date xsTxt text--black" |
| | |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { Vue, Component, Prop, Action, namespace, Watch } from 'nuxt-property-decorator'; |
| | | import { Vue, Component, Prop, namespace, Watch } from 'nuxt-property-decorator'; |
| | | |
| | | import appointmentService from '~/shared/services/appointment.service'; |
| | | import myConsultantService from '~/shared/services/my-consultant.service'; |
| | | import UtilsService from '~/shared/services/utils.service'; |
| | | import { hideReviews } from '~/shared/const/hide-reviews'; |
| | | import { ElRow } from 'element-ui/types/row'; |
| | | import { Appointment, AppointmentMemoInfo, ToInformAppointment } from '~/shared/models/appointment.model'; |
| | | import { Appointment, AppointmentMemoInfo } from '~/shared/models/appointment.model'; |
| | | import { ContactStatus } from '~/shared/models/enum/contact-status'; |
| | | import reviewsService from '~/shared/services/reviews.service'; |
| | | |
| | | const localStorage = namespace('localStorage'); |
| | | const appointmentStore = namespace('appointment.store'); |
| | | const localStorage = namespace('localStorage'); |
| | | |
| | | @Component({ |
| | | filters: { |
| | | formatNumber(index: number) { |
| | |
| | | } |
| | | }) |
| | | export default class ClientList extends Vue { |
| | | @Action |
| | | updateMyAppointment!: (data: Appointment) => void; |
| | | |
| | | @Prop() |
| | | client!: Appointment; |
| | | |
| | | @appointmentStore.Action |
| | | updateMyAppointmentList!: (data: Appointment) => void; |
| | | |
| | | @appointmentStore.Action |
| | | getAppointmentDetail!: (appointmentId: number) => Promise<Appointment>; |
| | | |
| | | @appointmentStore.Action |
| | | updateAppointmentDetail!: (id: number) => Appointment; |
| | | |
| | | @appointmentStore.Getter |
| | | appointmentProgress!: ContactStatus; |
| | | |
| | | @localStorage.Mutation |
| | | storageClearAppointmentIdFromMsg!: () => void; |
| | |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | viewAppointmentDetail(): void { |
| | | this.$router.push(`/appointment/${this.client.id}`); |
| | | this.getAppointmentDetail(this.client.id).then((_) => { |
| | | const unread = !this.client.consultantReadTime; |
| | | if (unread) { |
| | | this.readAppointment(); |
| | | } |
| | | this.$router.push(`/appointment/${this.client.id}`); |
| | | }); |
| | | } |
| | | |
| | | showAddInterviewDialog(): void { |
| | |
| | | } |
| | | |
| | | navigateToCloseAppointment(): void { |
| | | this.$router.push(`/appointment/${this.client.id}/close`); |
| | | } |
| | | |
| | | makeAppointment(): void { |
| | | alert('MAKE AN APPOINTMENT!'); |
| | | this.getAppointmentDetail(this.client.id).then((_) => { |
| | | this.$router.push(`/appointment/${this.client.id}/close`); |
| | | }); |
| | | } |
| | | |
| | | inviteReview(): void { |
| | | this.isShowInviteReviewDialog = true ; |
| | | reviewsService.sendSatisfactionToClient(this.client.id).then(res => { |
| | | this.isShowInviteReviewDialog = true ; |
| | | }) |
| | | } |
| | | |
| | | openDetail() { |
| | |
| | | |
| | | markAppointment() { |
| | | myConsultantService.markAsContact(this.client.id).then(data => { |
| | | this.updateMyAppointment(data); |
| | | this.updateMyAppointmentList(data); |
| | | this.isShowInformDialog = false; |
| | | }) |
| | | } |
| | | |
| | | closeInformDialog(): void { |
| | | const unread = !this.client.consultantReadTime; |
| | | if (unread) { |
| | | appointmentService.recordRead(this.client.id).then((_) => { |
| | | const updatedClient = {...this.client}; |
| | | updatedClient.consultantReadTime = new Date().toString(); |
| | | this.updateMyAppointment(updatedClient); |
| | | }); |
| | | }; |
| | | this.readAppointment(); |
| | | this.isEdit = false; |
| | | this.clearAppointmentIdFromMsg(); |
| | | } |
| | | |
| | | private readAppointment(): void { |
| | | appointmentService.recordRead(this.client.id).then((_) => { |
| | | const updatedClient = {...this.client}; |
| | | updatedClient.consultantReadTime = new Date().toString(); |
| | | this.updateMyAppointmentList(updatedClient); |
| | | this.updateAppointmentDetail(this.client.id); |
| | | }); |
| | | } |
| | | |
| | | private clearAppointmentIdFromMsg() { |
| | |
| | | this.memo = this.memoInfo.content; |
| | | } |
| | | |
| | | get newAppointment(): boolean { |
| | | get newAppointment(): boolean { |
| | | return !this.client.consultantViewTime |
| | | && this.client.communicateStatus === 'reserved'; |
| | | } |
| | |
| | | .professionals { |
| | | overflow : hidden; |
| | | text-overflow: ellipsis; |
| | | white-space : nowrap; |
| | | display: -webkit-box; |
| | | -webkit-box-orient: vertical; |
| | | -webkit-line-clamp: 1; |
| | | .professionalsTxt { |
| | | font-size : 12px; |
| | | margin-right: 5px; |
| | | |
| | | |
| | | } |
| | | .noProfessionalsTxt { |
| | | color : $PRUDENTIAL_GREY; |
| | |
| | | display: flex; |
| | | } |
| | | .invite-msg{ |
| | | width: 96px; |
| | | color: $PRIMARY_RED; |
| | | @extend .text--underline; |
| | | } |