update: 顧問登入-未聯絡清單，發送約訪通知 api 串接

Tomas

2022-01-17 4e2d4a859ec0516de067622412cfa1933163a2bb

update: 顧問登入-未聯絡清單，發送約訪通知 api 串接

 PAMapp/components/Client/ClientCard.vue

@@ -54,13 +54,13 @@

                <div
                  class="invite-msg smTxt_bold"
                  @click.stop="makeInterview"
                  @click.stop="showAddInterviewDialog"
                  v-if="client.communicateStatus === contactStatus.RESERVED">
                  傳送約訪通知
                </div>
                <div
                  class="invite-msg smTxt_bold"
                  @click.stop="closeAppointment"
                  @click.stop="navigateToCloseAppointment"
                  v-else-if="client.communicateStatus === contactStatus.CONTACTED">
                  結案
                </div>
@@ -142,7 +142,11 @@
            </div>
        </Ui-Dialog>

        <InterviewMsg :isVisible.sync="isMsgDialog"></InterviewMsg>
        <InterviewMsg
          :isVisible.sync="isShowAddInterviewDialog"
          :client="client"
          >
        </InterviewMsg>
    </div>
</template>

@@ -150,11 +154,11 @@
import { Vue, Component, Prop, Action, 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 myConsultantService from '~/shared/services/my-consultant.service';
import { ElRow } from 'element-ui/types/row';
import { Appointment, AppointmentMemoInfo } from '~/shared/models/appointment.model';
import { Appointment, AppointmentMemoInfo, ToInformAppointment } from '~/shared/models/appointment.model';
import { ContactStatus } from '~/shared/models/enum/contact-status';

const localStorage = namespace('localStorage');
@@ -187,21 +191,19 @@
    @localStorage.Mutation
    storageClearAppointmentIdFromMsg!: () => void;

    isVisibleDialog = false;
    isMsgDialog = false;
    dialogWidth = '';
    hideReviews = hideReviews;
    contactStatus            = ContactStatus;
    dialogWidth              = '';
    hideReviews              = hideReviews;
    isEdit                   = false;
    isShowAddInterviewDialog = false;
    isVisibleDialog          = false;
    memo                     = '';

    contactStatus = ContactStatus;
    // currentAppointmentStatus = this.contactStatus.RESERVED;

    isEdit = false;
    memoInfo: AppointmentMemoInfo = {
        appointmentId: 0,
        content: '',
        id: 0
        content      : '',
        id           : 0
    }
    memo = '';

    //////////////////////////////////////////////////////////////////////

@@ -228,16 +230,12 @@
      this.$router.push(`/appointment/${this.client.id}`);
    }

    makeInterview(): void {
      this.isMsgDialog = true;
    showAddInterviewDialog(): void {
      this.isShowAddInterviewDialog = true;
    }

    closeAppointment(): void {
    navigateToCloseAppointment(): void {
      this.$router.push(`/appointment/${this.client.id}/close`);
    }

    makeAppointment(): void {
      alert('MAKE AN APPOINTMENT!');
    }

    get newAppointment(): boolean {

 PAMapp/components/Interview/InterviewMsg.vue

@@ -19,20 +19,24 @@
        resize="none"
        v-model="interviewTxt">
        </el-input>

      <div class="mdTxt mt-30 mb-10">預計約訪時段</div>
      <DateTimePicker
        @changeDateTime="interviewTime = $event"
      ></DateTimePicker>

      <div class="msg-dialog-btn">
        <el-button :disabled="!interviewTime">傳送</el-button>
        <el-button @click="addInterview"  :disabled="!interviewTime">傳送</el-button>
      </div>

        </el-dialog>
  </div>
</template>
<script lang="ts">
import { Vue, Component, Prop, PropSync, Emit, Action } from 'nuxt-property-decorator';
import { Vue, Component, Prop, PropSync, Emit } from 'nuxt-property-decorator';

import appointmentService from '~/shared/services/appointment.service';
import { Appointment, ToInformAppointment } from '~/shared/models/appointment.model';

@Component
export default class InterviewMsg extends Vue {
@@ -43,7 +47,7 @@
    dialogWidth!:string;

    @Prop()
    appointmentId!: number;
    client!: Appointment;

    @Emit('closeDialog')
    closeDialog() {
@@ -53,6 +57,22 @@
    interviewTxt = "";
    interviewTime = '';

    //////////////////////////////////////////////////////////////////////

    addInterview() {
      const appointmentInformation: ToInformAppointment = {
        appointmentId: this.client.id,
        email        : this.client?.email,
        interviewDate: this.interviewTime,
        message      : this.interviewTxt,
        phone        : this.client?.phone,
      };
      appointmentService.informAppointment(appointmentInformation).then((_) => {
        // TODO: close dialog after confirm success msg drawer (assign to Helen)[Tomas, 2022/1/17 11:21];
        this.dialogVisible = false;
      });
    }

}
</script>


 PAMapp/shared/models/appointment.model.ts

@@ -150,3 +150,10 @@
  remark?          : string;
}

export interface ToInformAppointment {
  appointmentId: number;
  email        : string;
  interviewDate: string;
  message      : string;
  phone        : string;
}

 PAMapp/shared/services/appointment.service.ts

@@ -1,6 +1,6 @@
import { http } from "./httpClient";

import { Appointment, AppointmentDetail, AppointmentMemoInfo, createdMemoInfo, EditAppointmentParams, ToCloseAppointment, ToDoneAppointment, updatedMemoInfo } from "~/shared/models/appointment.model";
import { Appointment, AppointmentDetail, AppointmentMemoInfo, createdMemoInfo, EditAppointmentParams, ToCloseAppointment, ToDoneAppointment, ToInformAppointment, updatedMemoInfo } from "~/shared/models/appointment.model";

class AppointmentService {

@@ -59,6 +59,11 @@
  async closeAppointment(appointmentInfo: ToDoneAppointment | ToCloseAppointment) {
    return http.post(`/appointment/close`, appointmentInfo).then((res) => res.data);
  }

  // 約訪通知 API
  async informAppointment(appointmentInformation: ToInformAppointment) {
    return http.post(`/notice/send`, appointmentInformation).then((res) => res.data);
  }
}

export default new AppointmentService();