<template>
|
<div class="edit-appointment-record">
|
<div class="edit-appointment-record-date">
|
<span>今天 11:00 建立</span>
|
<span>今天 11:00 更新</span>
|
</div>
|
|
<div class="mdTxt mb-10">約訪時間</div>
|
<DateTimePicker
|
@changeDateTime="interviewTime = $event"
|
></DateTimePicker>
|
|
<div class="mdTxt mb-10 mt-10">約訪紀錄</div>
|
<el-input
|
type="textarea"
|
:rows="5"
|
placeholder="請輸入約訪紀錄"
|
resize="none"
|
v-model="content"
|
>
|
</el-input>
|
|
<div class="edit-appointment-record-btn">
|
<el-button>取消</el-button>
|
<el-button :disabled="!interviewTime || !content" @click="createInterviewRecord">確定</el-button>
|
</div>
|
|
<PopUpFrame :isOpen.sync="isConfirmPopup"
|
@closePopUp="closeConfirmPopup">
|
<div class="text--center mdTxt">新增成功</div>
|
<div class="text--center mt-30">
|
<el-button @click="closeConfirmPopup" type="primary">確定</el-button>
|
</div>
|
</PopUpFrame>
|
</div>
|
</template>
|
<script lang="ts">
|
import { AppointmentLog, InterviewRecordInfo } from '~/shared/models/appointment.model';
|
import { Vue, Component, Prop } from 'nuxt-property-decorator';
|
import authService from '~/shared/services/auth.service';
|
import appointmentService from '~/shared/services/appointment.service';
|
|
@Component
|
export default class InterviewAdd extends Vue {
|
interviewTime = '';
|
content = '';
|
isConfirmPopup = false;
|
|
// @Prop()
|
// myAppointmentReviewLogList!: AppointmentLog[];
|
|
// isUserLogin = false;
|
|
//////////////////////////////////////////////////////////////////////
|
// mounted() {
|
// this.isUserLogin = authService.isUserLogin();
|
// }
|
|
createInterviewRecord() {
|
const interviewRecordInfo: InterviewRecordInfo = {
|
content: this.content,
|
interviewDate: this.interviewTime,
|
appointmentId: +this.$route.params.appointmentId
|
}
|
appointmentService.createInterviewRecord(interviewRecordInfo).then(res => {
|
this.isConfirmPopup = true;
|
});
|
|
}
|
|
closeConfirmPopup() {
|
this.isConfirmPopup = false;
|
this.$router.go(-1);
|
}
|
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.edit-appointment-record {
|
padding-left : 10px;
|
padding-right: 10px;
|
.edit-appointment-record-date{
|
color : #68737A;
|
display : flex;
|
justify-content: space-between;
|
margin-bottom : 26px;
|
}
|
}
|
.icon {
|
color : $PRIMARY_RED;
|
display : flex;
|
flex : 1;
|
justify-content: flex-end;
|
}
|
.edit-appointment-record-btn{
|
margin-top: 30px;
|
display: flex;
|
justify-content: center;
|
}
|
</style>
|
