保誠-保戶業務員媒合平台
wayne
2022-03-10 e8241decc705f9db3e46aed7b3a3f8b3188cf820
PAMapp/components/Client/ClientCard.vue
@@ -14,7 +14,7 @@
            </div>
            <div class="pl-10">
                <div class="smTxt_bold name">{{ client.name }}</div>
                <div class="smTxt_bold name">{{ client.name || 'NO NAME' }}</div>
                <div  v-if="client.communicateStatus === contactStatus.RESERVED" class="my-10 xsTxt">預約成功</div>
                <div
                  class="xsTxt mb-10 mt-10"
@@ -25,10 +25,12 @@
                  class="xsTxt mb-10 mt-10"
                  v-else>
                  滿意度
                  <span v-if="client.satisfactionScore" class="xsTxt">{{ client.satisfactionScore }}</span>
                  <span v-if="client.satisfactionScore" class="xsTxt text--primary">
                    <UiReviewScore :score="client.satisfactionScore"></UiReviewScore>
                  </span>
                  <span v-else class="xsTxt text--mid_grey">未填</span>
                </div>
                <div class="professionals" v-if="client.communicateStatus === contactStatus.RESERVED">
                <div class="professionals mb-10" v-if="client.communicateStatus === contactStatus.RESERVED">
                    <template v-if="client.requirement">
                        <span
                            v-for="(item, index) in requirements"
@@ -52,7 +54,6 @@
                ></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>
@@ -76,12 +77,12 @@
                  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"
@@ -168,17 +169,20 @@
</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) {
@@ -199,11 +203,20 @@
    }
})
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;
@@ -246,7 +259,13 @@
    //////////////////////////////////////////////////////////////////////
    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 {
@@ -254,15 +273,15 @@
    }
    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() {
@@ -275,22 +294,24 @@
    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() {
@@ -347,7 +368,7 @@
        this.memo = this.memoInfo.content;
    }
      get newAppointment(): boolean {
    get newAppointment(): boolean {
      return !this.client.consultantViewTime
            && this.client.communicateStatus === 'reserved';
    }
@@ -443,10 +464,14 @@
        .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;
@@ -494,6 +519,7 @@
        display: flex;
    }
    .invite-msg{
      width: 96px;
      color: $PRIMARY_RED;
      @extend .text--underline;
    }