<template>
|
<section class="close-appointment-detail">
|
|
<div class="close-appointment-detail-nav">
|
<div class="mdTxt">結案方式</div>
|
<div class="mdTxt text--primary text--underline cursor--pointer" @click="editAppointmentHasClosed">編輯</div>
|
</div>
|
<span class="mt-10 mb-30">{{ displayClosedType }}</span>
|
<template v-if="appointmentDetail.appointmentClosedInfo.policyholderIdentityId && appointmentDetail.communicateStatus === 'done'">
|
<div class="mdTxt mb-10">保戶身份證字號</div>
|
<div class="mb-30">{{ appointmentDetail.appointmentClosedInfo.policyholderIdentityId }}</div>
|
</template>
|
|
<template v-if="appointmentDetail.appointmentClosedInfo.planCode && appointmentDetail.communicateStatus === 'done'">
|
<div class="mdTxt mb-10">商品名稱</div>
|
<div class="mb-30">{{ appointmentDetail.appointmentClosedInfo.planCode }}</div>
|
</template>
|
|
<template v-if="appointmentDetail.appointmentClosedInfo.closedReason && appointmentDetail.communicateStatus !== 'done'">
|
<div class="mdTxt mb-10">未成交原因</div>
|
<div >{{ appointmentDetail.appointmentClosedInfo.closedReason | toFailReasonLabel }}</div>
|
<div v-if="appointmentDetail.appointmentClosedInfo.closedOtherReason" class="mt-10">{{ appointmentDetail.appointmentClosedInfo.closedOtherReason }}</div>
|
<div class="mb-30"></div>
|
</template>
|
|
<template v-if="appointmentDetail.appointmentClosedInfo.policyEntryDate && appointmentDetail.communicateStatus === 'done'">
|
<div class="mdTxt mb-10">進件時間</div>
|
<div class="mb-30">{{ appointmentDetail.appointmentClosedInfo.policyEntryDate | formatDate }}</div>
|
</template>
|
|
<template>
|
<div class="mdTxt mb-10">最後編輯時間</div>
|
<div class="mb-30">{{ appointmentDetail.lastModifiedDate | formatDate }}</div>
|
</template>
|
|
<div class="mdTxt mb-10">備註</div>
|
<div>{{ appointmentDetail.appointmentClosedInfo.remark || '無' }}</div>
|
|
</section>
|
</template>
|
|
<script lang="ts">
|
import { Vue, Component, Prop } from 'nuxt-property-decorator';
|
|
import { Appointment } from '~/shared/models/appointment.model';
|
import { ContactStatus } from '~/shared/models/enum/contact-status';
|
|
@Component
|
export default class AppointmentClosedInfo extends Vue {
|
|
@Prop()
|
appointmentDetail!: Appointment;
|
|
contactStatus = ContactStatus;
|
|
//////////////////////////////////////////////////////////////////////
|
|
editAppointmentHasClosed(): void{
|
this.$router.push(`/appointment/${this.appointmentDetail.id}/close`);
|
}
|
|
get displayClosedType(): string {
|
let closedType = '成交';
|
switch (this.appointmentDetail.communicateStatus) {
|
case this.contactStatus.CLOSE:
|
closedType = '未成交';
|
break;
|
case this.contactStatus.CANCEL:
|
closedType = '取消';
|
break;
|
}
|
return closedType;
|
}
|
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
</style>
|
