From 6eb7a5d782155d9d90c73b6e0aa30283a29366aa Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期三, 09 三月 2022 13:51:01 +0800 Subject: [PATCH] fix#136534: 客戶預約顧問收到的簡訊中,未包含時間 --- PAMapp/components/Interview/InterviewMsg.vue | 180 +++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 142 insertions(+), 38 deletions(-) diff --git a/PAMapp/components/Interview/InterviewMsg.vue b/PAMapp/components/Interview/InterviewMsg.vue index b9518c4..61aaa8d 100644 --- a/PAMapp/components/Interview/InterviewMsg.vue +++ b/PAMapp/components/Interview/InterviewMsg.vue @@ -1,5 +1,5 @@ <template> - <div> + <div class="interview-msg-component"> <el-dialog :visible.sync="dialogVisible" :width="dialogWidth" @@ -9,33 +9,60 @@ <div class="subTitle msg-dialog-title">蝝赤�</div> <div class="send-msg-nav"> <div class="mdTxt">��摰�</div> - <div class="mdTxt text--primary text--underline">蝺刻摩</div> </div> <el-input type="textarea" - :rows="9" + :autosize="true" placeholder="蝝赤�" resize="none" v-model="interviewTxt"> </el-input> - <div class="mdTxt mt-30 mb-10">����赤��挾</div> - <DateTimePicker - @changeDateTime="interviewTime = $event" - ></DateTimePicker> + + <div v-if="client.phone"> + <div class="mdTxt mt-30 mb-10 required">����赤��挾</div> + <DateTimePicker + @changeDateTime="interviewTime = $event" + :isPastDateDisabled="true" + :defaultValue="defaultValue" + ></DateTimePicker> + </div> <div class="msg-dialog-btn"> - <el-button :disabled="!interviewTime">���</el-button> + <el-button @click="addInterview" :disabled="isBtnDisabled">���</el-button> </div> </el-dialog> + + <PopUpFrame + :isOpen.sync="isShowSuccessAlert" + @closePopUp="closeAllDialog"> + <div class="text--middle invite-review"> + <div class="mb-30 mt-10">撌脩��赤�</div> + <div class="text--primary text--middle cursor--pointer text--underline" @click="closeAllDialog " :size="'250px'">������</div> + </div> + </PopUpFrame> </div> </template> <script lang="ts"> -import { Vue, Component, Prop, PropSync, Emit, Action } from 'nuxt-property-decorator'; +import { Vue, Component, Prop, PropSync, Emit, namespace } from 'nuxt-property-decorator'; + +import appointmentService from '~/shared/services/appointment.service'; +import { Appointment, ToInformAppointment } from '~/shared/models/appointment.model'; +import { AgentInfo } from '~/shared/models/agent-info.model'; + +const loginStore = namespace('login.store'); +const appointmentStore = namespace('appointment.store'); @Component -export default class InterviewAdd extends Vue { +export default class InterviewMsg extends Vue { + + @appointmentStore.Action + updateAppointmentDetail!: (id: number) => Appointment; + + @appointmentStore.Action + getMyAppointmentList!: () => Promise<Appointment[]>; + @PropSync('isVisible') dialogVisible!: boolean; @@ -43,45 +70,122 @@ dialogWidth!:string; @Prop() - appointmentId!: number; + client!: Appointment; + + @Prop() + defaultValue!: string; @Emit('closeDialog') closeDialog() { return; } + @loginStore.State + loginConsultant!: AgentInfo; + + isShowSuccessAlert = false; + interviewTxt = ""; interviewTime = ''; + ////////////////////////////////////////////////////////////////////// + + mounted() { + if(this.loginConsultant.phoneNumber && this.loginConsultant.email) + { + this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����閰梯�Ⅳ/Email嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����"} + else if (!this.loginConsultant.phoneNumber && this.loginConsultant.email) + { + this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����mail嚗�"+"\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����" + } + else + this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����閰梯�Ⅳ嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n"+"�甇斗���靘選����蝜恬�����" + } + + addInterview() { + const message = this.getMessage(); + const appointmentInformation: ToInformAppointment = { + appointmentId: this.client.id, + email : this.client?.email, + interviewDate: this.interviewTime, + message, + phone : this.client?.phone, + }; + appointmentService.informAppointment(appointmentInformation).then((_) => { + this.isShowSuccessAlert = true ; + }); + } + + closeAllDialog() { + this.isShowSuccessAlert = false ; + this.dialogVisible = false; + this.updateAppointmentDetail(this.client.id); + this.getMyAppointmentList(); + } + + private getMessage(): string { + const targetDate = new Date(this.interviewTime); + const interviewTime = `${targetDate.getFullYear()}撟�${targetDate.getMonth() + 1}���${targetDate.getDate()}� ${targetDate.getHours()}���${targetDate.getMinutes()}��; + let result = ''; + if(this.loginConsultant.phoneNumber && this.loginConsultant.email) { + result = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n" + interviewTime + "\n" +"隞乩����閰梯�Ⅳ/Email嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����"} + else if (!this.loginConsultant.phoneNumber && this.loginConsultant.email) { + result = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n" + interviewTime + "\n" +"隞乩����mail嚗�"+"\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����" + } else { + result = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n" + interviewTime + "\n" +"隞乩����閰梯�Ⅳ嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n"+"�甇斗���靘選����蝜恬�����" + } + return result; + } + + get isBtnDisabled() :Boolean { + const isFormValid = this.client.phone ? this.interviewTxt && this.interviewTime :this.interviewTxt + return !isFormValid + } } </script> -<style lang="scss" scoped> -.msg-dialog-title{ - display: flex; - justify-content: center; - margin-bottom:30px; - color: $PRIMARY_BLACK; -} -.send-msg-nav{ - display: flex; - justify-content: space-between; - margin-bottom: 10px; - color: $PRIMARY_BLACK; -} -.el-dialog{ - width:90% -} -.el-textarea__inner{ - font-size: 20px; - padding:10px; - text-align: justify; - font-weight: 500; -} -.msg-dialog-btn{ - margin-top: 30px; - display: flex; - justify-content: center; -} +<style lang="scss" > +.interview-msg-component{ + .required { + position: relative; + &::before { + content: '*'; + position: absolute; + color: #FF0000; + transform: translate(-12px, 0); + } + } + .msg-dialog-title{ + display: flex; + justify-content: center; + margin-bottom:30px; + color: $PRIMARY_BLACK; + } + .send-msg-nav{ + display: flex; + justify-content: space-between; + margin-bottom: 10px; + color: $PRIMARY_BLACK; + } + .el-dialog{ + width:90% + } + .el-textarea__inner{ + font-size: 20px; + padding:10px; + text-align: justify; + font-weight: 600; + } + .msg-dialog-btn{ + margin-top: 30px; + display: flex; + justify-content: center; + } + .invite-review{ + display: flex; + flex-direction: column; + align-items: center; + } +} </style> -- Gitblit v1.8.0