提交出入详情

src/components/component/alarModel.vue

@@ -533,7 +533,8 @@ export default {
                 });
         },
     },
-    beforeMount() {
+    mounted() {
+        console.log("mounted");
         if (uni.getStorageSync("userId")) {
             this.connectMQTT();
         }

src/pages.json

@@ -183,6 +183,15 @@
                         "navigationBarBackgroundColor": "#faede2",
                         "navigationBarTextStyle": "black"
                     }
+                },
+                {
+                    "path": "discrepancy/discrepancy",
+                    "style": {
+                        "enablePullDownRefresh": true,
+                        "navigationBarTitleText": "出入详情",
+                        "navigationBarBackgroundColor": "#faede2",
+                        "navigationBarTextStyle": "black"
+                    }
                 }
             ]
         }

src/pagesA/deviceDetail/deviceDetail.vue

@@ -90,9 +90,12 @@
             />
         </view>
         <view class="notice-info">
-            <text style="color: #95a4b3; font-size: 28rpx">{{
-                todayDate
-            }}</text>
+            <view class="notice_title" @click="discrepancy">
+                <text style="color: #95a4b3; font-size: 28rpx">{{
+                    todayDate
+                }}</text>
+                <image src="../../static/rightArrow.png"></image>
+            </view>
             <view class="title" v-if="devInfo.installPosition == 'Toilet'">
                 <view class="title-text" style="color: #22dea7"
                     >今日卫生间使用频次</view
@@ -285,7 +288,7 @@ export default {
             wsj: false,
             todayWcTimes: "",
             stayDetail: "",
-            todayDate: "",
+            todayDate: "2025年8月17日",
             dev_id: "",
             nowTime: "",
             devName: "",
@@ -737,6 +740,19 @@ export default {
                 }, 3000); // 每3秒自动滚动一次
             }
         },
+        discrepancy() {
+            uni.navigateTo({
+                url:
+                    "/pagesA/discrepancy/discrepancy?devId=" +
+                    this.devInfo.devId,
+            });
+        },
+        getCurrentDate() {
+            const now = new Date();
+            this.currentDate = `${now.getFullYear()}-${
+                now.getMonth() + 1
+            }月${now.getDate().toString().padStart(2, "0")}日`;
+        },
     },
     onLoad(options) {
         try {
@@ -763,6 +779,8 @@ export default {
         this.autoPlayinterval = setTimeout(() => {
             this.autoSwipe();
         }, 3000);
+
+        this.getCurrentDate();
     },
     onUnload() {
         if (this.mqttClient) this.mqttClient.end(true);
@@ -893,6 +911,16 @@ export default {
         box-sizing: border-box;
         margin: 0 auto;
 
+        .notice_title {
+            display: flex;
+            align-items: space-between;
+            image {
+                margin-left: auto;
+                width: 30rpx;
+                height: 30rpx;
+            }
+        }
+
         .title {
             margin-top: 10rpx;
             margin-bottom: 10rpx;

src/pagesA/discrepancy/discrepancy.vue

@@ -0,0 +1,108 @@
+<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="timeline-content">
+                <view class="timeline-time">{{ item.time }}</view>
+                <view class="timeline-desc" v-if="item.title">{{
+                    item.title
+                }}</view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            currentDate: "",
+        };
+    },
+    methods: {
+        getCurrentDate() {
+            const now = new Date();
+            this.currentDate = `${now.getFullYear()}-${
+                now.getMonth() + 1
+            }月${now.getDate().toString().padStart(2, "0")}日`;
+        },
+    },
+    mounted() {
+        this.getCurrentDate();
+    },
+};
+</script>
+
+<style scoped>
+.timeline-container {
+    padding: 20rpx 30rpx;
+    height: 100vh;
+    background: linear-gradient(180deg, #faede2 0%, #f4f4f4 100%);
+}
+
+.timeline-item {
+    display: flex;
+    padding-bottom: 40rpx;
+    position: relative;
+}
+
+.timeline-node {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 40rpx;
+    margin-right: 20rpx;
+}
+
+.node-circle {
+    width: 20rpx;
+    height: 20rpx;
+    border-radius: 50%;
+    background-color: #7f5447;
+    z-index: 1;
+}
+
+.node-line {
+    flex: 1;
+    width: 2rpx;
+    background-color: #eaeaea;
+    margin-top: 10rpx;
+}
+
+.timeline-content {
+    flex: 1;
+    padding-bottom: 20rpx;
+}
+
+.timeline-time {
+    font-size: 24rpx;
+    color: #999;
+    margin-bottom: 8rpx;
+}
+
+.timeline-title {
+    font-size: 32rpx;
+    color: #333;
+    font-weight: bold;
+    margin-bottom: 8rpx;
+}
+
+.timeline-desc {
+    font-size: 28rpx;
+    color: #666;
+    line-height: 1.5;
+}
+</style>