TODO#135406 [顧問] 預約單明細 - 點擊更多約訪紀錄時，改為展開而非導頁

HelenHuang

2022-02-15 65ebd84c61cf86c12f6180d931a0476d5f4b3cdb

 PAMapp/components/Appointment/AppointmentInterviewList.vue

@@ -5,28 +5,37 @@
            <div class="pam-link-button"
            @click="addInterview">+新增</div>
        </div>
        <InterviewCard :interviewList="displayList.slice(0, 3)"></InterviewCard>

        <InterviewCard :interviewList="displayAppointmentList"></InterviewCard>

        <section class="text--right mt-30 interview-check-more" v-if="interviewList.length > 3">
                <div class="pam-link-button" @click="readMoreBtn">
                  展開看更多
                  <i class="icon-expand"></i>
                <div class="pam-link-button" @click="readAllList = !readAllList">
                  {{ readAllList ?  '顯示較少' : '展開看更多' }}
                  <i :class="readAllList ? 'icon-top' : 'icon-down'"></i>
                  </div>
        </section>
    </div>
</template>

<script lang="ts">
import { Vue, Component, Prop, Watch } from 'nuxt-property-decorator';
import { Vue, Component, Prop, Watch, namespace } from 'nuxt-property-decorator';

import { InterviewRecord } from '~/shared/models/appointment.model';

@Component
export default class AppointmentInterviewList extends Vue {

  @Prop()
  interviewList!: InterviewRecord[];

  appointmentId!: string;
  displayList: InterviewRecord[] = [];
  readAllList = false;

  get displayAppointmentList(): InterviewRecord[] {
    return this.readAllList ? this.displayList : this.displayList.slice(0, 3);
  }


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

@@ -49,10 +58,6 @@

  addInterview(): void {
    this.$router.push(`/appointment/${this.appointmentId}/interview/new`);
  }

  readMoreBtn() {
      this.$router.push(`/appointment/${this.appointmentId}/interviewList`);
  }

}