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

Tomas

2022-01-17 4e2d4a859ec0516de067622412cfa1933163a2bb

 PAMapp/components/Interview/InterviewMsg.vue

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

      <div class="mdTxt mt-30 mb-10">預計約訪時段</div>
      <div class="date-input">
            2022/01/10 09:00
            <i class="icon-calender icon"></i>
        </div>
      <DateTimePicker
        @changeDateTime="interviewTime = $event"
      ></DateTimePicker>

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

        </el-dialog>
  </div>
</template>
<script lang="ts">
import { AppointmentLog } from '~/shared/models/appointment.model';
import { Vue, Component, Prop, PropSync, Emit } from 'nuxt-property-decorator';
import authService from '~/shared/services/auth.service';

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

@Component
export default class InterviewAdd extends Vue {
export default class InterviewMsg extends Vue {
    @PropSync('isVisible')
    dialogVisible!: boolean;

    @Prop({default:'90%'})
    dialogWidth!:string;

    @Prop()
    client!: Appointment;

    @Emit('closeDialog')
    closeDialog() {
@@ -51,6 +55,24 @@
    }

    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>

@@ -80,25 +102,6 @@
  margin-top: 30px;
  display: flex;
  justify-content: center;
}

.date-input {
    align-items     : center;
    background-color: #fff;
    border          : 1px solid #707070;
    border-radius   : 5px;
    display         : flex;
    font-size       : 20px;
    height          : 46px;
    margin-bottom   : 30px;
    padding-left    : 20px;
    padding-right   : 20px;
}
.icon {
    color          : $PRIMARY_RED;
    display        : flex;
    flex           : 1;
    justify-content: flex-end;
}

</style>