feat 报告详情

src/components/report/deviceHeader.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+defineProps<{
+  deviceCode: string
+  time: string
+  status: string
+}>()
+</script>
+
+<template>
+  <view class="device-header">
+    <view class="device-info">
+      <text class="device-code">
+        备ID: {{ deviceCode }}
+      </text>
+      <text class="device-time">
+        {{ time }}
+      </text>
+    </view>
+    <view class="status-btn">
+      <text class="status-text">
+        {{ status }}
+      </text>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.device-header {
+  background-color: #ffffff;
+  border-radius: 12px;
+  padding: 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.device-info {
+  display: flex;
+  flex-direction: column;
+}
+
+.device-code {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 8px;
+}
+
+.device-time {
+  font-size: 14px;
+  color: #666;
+}
+
+.status-btn {
+  background-color: #4080ff;
+  border-radius: 8px;
+  padding: 8px 16px;
+}
+
+.status-text {
+  font-size: 16px;
+  color: #ffffff;
+}
+</style>

src/components/report/item.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-defineProps<{
+const props = defineProps<{
   title: string
   deviceCode: string
   status: string
@@ -9,6 +9,23 @@ defineProps<{
   areaCount: string
   passRate: string
 }>()
+
+function goToDetail() {
+  const data = encodeURIComponent(JSON.stringify({
+    title: props.title,
+    deviceCode: props.deviceCode,
+    status: props.status,
+    time: props.time,
+    area: props.area,
+    duration: props.duration,
+    areaCount: props.areaCount,
+    passRate: props.passRate,
+  }))
+  console.log('22222222222data', data)
+  uni.navigateTo({
+    url: `/pages/report/detail/index?data=${data}`,
+  })
+}
 </script>
 
 <template>
@@ -66,7 +83,7 @@ defineProps<{
               {{ passRate }} 合格率
             </text>
           </view>
-          <text class="view-detail">
+          <text class="view-detail" @tap="goToDetail">
             查看详情>
           </text>
         </view>