<!--
 * @Author: ZZT
 * @Date: 2021-12-10 18:35:20
 * @LastEditors: OBKoro1
 * @LastEditTime: 2021-12-13 17:04:50
-->
<template>
  <view>
    <u-switch />
    <u-time-line>
      <u-time-line-item
        v-for="(item, index) in remoteVisitStatusDTOList"
        :key="index + ''"
      >
        <template #node>
          <view
            class="icon"
            :class="{
              current: index + 1 === remoteVisitStatusDTOList.length
            }"
          />
        </template>
        <template #content>
          <view class="info">
            <view class="u-flex">
              <view
                class="title"
                :class="{
                  current: index + 1 === remoteVisitStatusDTOList.length
                }"
              >{{ item.remoteDescription }}</view>
              <view class="u-flex-1" />
              <view
                class="title"
                :class="{
                  current: index + 1 === remoteVisitStatusDTOList.length
                }"
              >{{
                dayjs(item.remoteUpdateTime).format('MM月DD日 HH:mm')
              }}</view>
            </view>
            <view v-if="item.visitStartTime && item.visitEndTime" class="times">
              <view
                class="text"
              >远程探视日期:{{
                dayjs(item.visitStartTime).format('YYYY-MM-DD')
              }}</view>
              <view
                class="text"
              >远程探视时间:{{
                dayjs(item.visitStartTime).format('HH:mm')
              }}~{{ dayjs(item.visitEndTime).format('HH:mm') }}</view>
            </view>
          </view>
        </template>
      </u-time-line-item>
    </u-time-line>
  </view>
</template>

<script>
export default {
  data() {
    return {
      remoteVisitStatusDTOList: []
    }
  }
}
</script>

<style lang="scss" scoped></style>
