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

HelenHuang

2022-02-15 65ebd84c61cf86c12f6180d931a0476d5f4b3cdb

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

 PAMapp/assets/scss/_common.scss

@@ -103,6 +103,7 @@
          align-items: center;
          font-weight: bold;
          width: 70px;
          background-color: #fff;
          border-radius: 6px;
          border-bottom: 1px solid #CCCCCC;
          border-right: 1px solid #CCCCCC;
@@ -115,6 +116,7 @@
        flex:1;
        border-radius: 5px;
        padding: 10px;
        background-color: #fff;
      }
      .mb-3{
        margin-bottom: 3px;

 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`);
  }

}