From b1b1fa9058a8e7df07c25cf6d5be1678a042ab7e Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期二, 18 一月 2022 14:27:07 +0800
Subject: [PATCH] update: TODO#134382 [顧問管理流程] 刪除/編輯約訪紀錄
---
PAMapp/components/Appointment/AppointmentInterviewList.vue | 85 ++++++++++++++++++++++++++++++++++++------
1 files changed, 73 insertions(+), 12 deletions(-)
diff --git a/PAMapp/components/Appointment/AppointmentInterviewList.vue b/PAMapp/components/Appointment/AppointmentInterviewList.vue
index 14e66b3..e7a3325 100644
--- a/PAMapp/components/Appointment/AppointmentInterviewList.vue
+++ b/PAMapp/components/Appointment/AppointmentInterviewList.vue
@@ -13,27 +13,57 @@
</template>
<template v-if="interviewList.length">
- <div class="interview--future">
+ <div
+ v-for="(item, index) in futureList"
+ :key="index + 'feature'"
+ class="interview--future"
+ @click="editInterview(item)"
+ >
<div class="record-card">
<div class="record-card-date">
- <span class="bold">01/10</span>
- <span class="mt-5 line-space">09:00</span>
+ <div>
+ <UiDateFormat
+ class="date bold"
+ :date="item.interviewDate"
+ onlyShowSection="DAY" />
+ </div>
+ <div>
+ <UiDateFormat
+ class="time mt-5 line-space"
+ :date="item.interviewDate"
+ onlyShowSection="TIME" />
+ </div>
</div>
<div class="record-card-content">
- <span>�����恥�蝝��璅��撱喉�����������靽</span>
+ <span>{{item.content}}</span>
</div>
</div>
</div>
- <section class="interview--past">
+ <section
+ class="interview--past"
+ v-for="(item, index) in pastList"
+ :key="index + 'past'"
+ @click="editInterview(item)"
+ >
<div class="record-card">
<div class="record-card-date">
- <span class="bold">01/08</span>
- <span class="mt-5 line-space">09:00</span>
+ <div>
+ <UiDateFormat
+ class="date bold"
+ :date="item.interviewDate"
+ onlyShowSection="DAY" />
+ </div>
+ <div>
+ <UiDateFormat
+ class="time mt-5 line-space"
+ :date="item.interviewDate"
+ onlyShowSection="TIME" />
+ </div>
</div>
<div class="record-card-content">
- <span>�����縑���閰梯�Ⅳ嚗���������</span>
+ <span>{{item.content}}</span>
</div>
</div>
</section>
@@ -46,18 +76,49 @@
</template>
<script lang="ts">
-import { Vue, Component } from 'nuxt-property-decorator';
+import { Vue, Component, Prop, Watch, Mutation } from 'nuxt-property-decorator';
+import { InterviewRecord } from '~/shared/models/appointment.model';
@Component
export default class AppointmentInterviewList extends Vue {
+ @Prop()
+ interviewList!: InterviewRecord[];
- interviewList = [];
+ @Mutation
+ updateInterviewRecord!: (data: InterviewRecord) => void;
+
+ appointmentId!: string;
+
+ futureList: InterviewRecord[] = [];
+ pastList: InterviewRecord[] = [];
+
+ //////////////////////////////////////////////////////////////////////
+
+ mounted() {
+ this.appointmentId = this.$route.params.appointmentId;
+ }
+
+ //////////////////////////////////////////////////////////////////////
+
+ @Watch('interviewList', {immediate: true})
+ updateInterviewList() {
+ if (this.interviewList && this.interviewList.length > 0) {
+ this.futureList = this.interviewList
+ .filter(item => new Date(item.interviewDate).getTime() >= new Date().getTime())
+ this.pastList = this.interviewList
+ .filter(item => new Date(item.interviewDate).getTime() < new Date().getTime());
+ }
+ }
//////////////////////////////////////////////////////////////////////
addInterview(): void {
- const appointmentId = this.$route.params.appointmentId;
- this.$router.push(`/appointment/${appointmentId}/interview/new`);
+ this.$router.push(`/appointment/${this.appointmentId}/interview/new`);
+ }
+
+ editInterview(interviewRecord) {
+ this.updateInterviewRecord(interviewRecord);
+ this.$router.push(`/appointment/${this.appointmentId}/interview/${interviewRecord.id}`);
}
}
--
Gitblit v1.8.0