|
@@ -1,25 +1,27 @@
|
|
|
<template>
|
|
|
<view class="timeline-container">
|
|
|
- <view
|
|
|
- v-for="(item, index) in timelineData"
|
|
|
- :key="index"
|
|
|
- class="timeline-item"
|
|
|
- >
|
|
|
- <!-- 时间节点 -->
|
|
|
- <view class="timeline-node">
|
|
|
- <view class="node-circle"></view>
|
|
|
- <view
|
|
|
- class="node-line"
|
|
|
- v-if="index !== timelineData.length - 1"
|
|
|
- ></view>
|
|
|
- </view>
|
|
|
+ <view class="timeBox">
|
|
|
+ <view
|
|
|
+ v-for="(item, index) in timelineData"
|
|
|
+ :key="index"
|
|
|
+ class="timeline-item"
|
|
|
+ >
|
|
|
+ <!-- 时间节点 -->
|
|
|
+ <view class="timeline-node">
|
|
|
+ <view class="node-circle"></view>
|
|
|
+ <view
|
|
|
+ class="node-line"
|
|
|
+ v-if="index !== timelineData.length - 1"
|
|
|
+ ></view>
|
|
|
+ </view>
|
|
|
|
|
|
- <!-- 内容区域 -->
|
|
|
- <view class="timeline-content">
|
|
|
- <view class="timeline-time">{{ item.time }}</view>
|
|
|
- <view class="timeline-desc" v-if="item.title">{{
|
|
|
- item.title
|
|
|
- }}</view>
|
|
|
+ <!-- 内容区域 -->
|
|
|
+ <view class="timeline-content">
|
|
|
+ <view class="timeline-time">{{ item.time }}</view>
|
|
|
+ <view class="timeline-desc" v-if="item.title">{{
|
|
|
+ item.title
|
|
|
+ }}</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -32,29 +34,53 @@ export default {
|
|
|
type: Array,
|
|
|
default: () => [
|
|
|
{
|
|
|
- time: "16:12",
|
|
|
- title: "进入卫生间(房间)",
|
|
|
+ time: "9:44",
|
|
|
+ title: "离开房间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ time: "9:32",
|
|
|
+ title: "进入房间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ time: "9:29",
|
|
|
+ title: "离开房间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ time: "9:26",
|
|
|
+ title: "进入房间",
|
|
|
},
|
|
|
{
|
|
|
- time: "16:42",
|
|
|
+ time: "9:23",
|
|
|
title: "离开房间",
|
|
|
},
|
|
|
{
|
|
|
- time: "16:12",
|
|
|
- title: "进入卫生间(房间)",
|
|
|
+ time: "9:08",
|
|
|
+ title: "进入房间",
|
|
|
},
|
|
|
{
|
|
|
- time: "16:42",
|
|
|
+ time: "9:17",
|
|
|
title: "离开房间",
|
|
|
},
|
|
|
{
|
|
|
- time: "16:12",
|
|
|
- title: "进入卫生间(房间)",
|
|
|
+ time: "9:07",
|
|
|
+ title: "进入房间",
|
|
|
},
|
|
|
{
|
|
|
- time: "16:42",
|
|
|
+ time: "9:03",
|
|
|
title: "离开房间",
|
|
|
},
|
|
|
+ {
|
|
|
+ time: "8:55",
|
|
|
+ title: "进入房间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ time: "8:40",
|
|
|
+ title: "离开房间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ time: "8:30",
|
|
|
+ title: "进入房间",
|
|
|
+ },
|
|
|
],
|
|
|
},
|
|
|
},
|
|
@@ -66,6 +92,12 @@ export default {
|
|
|
padding: 20rpx 30rpx;
|
|
|
height: 100vh;
|
|
|
background: linear-gradient(180deg, #faede2 0%, #f4f4f4 100%);
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.timeBox {
|
|
|
+ overflow: scroll;
|
|
|
+ height: 98vh;
|
|
|
}
|
|
|
|
|
|
.timeline-item {
|