diff --git a/src/components.d.ts b/src/components.d.ts
index 330454d..8473a0c 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -22,6 +22,7 @@ declare module 'vue' {
     HomeWarning_list: typeof import('./components/home/warning_list.vue')['default']
     MessageList: typeof import('./components/message/list.vue')['default']
     ProjectItem: typeof import('./components/project/item.vue')['default']
+    ReportDeviceHeader: typeof import('./components/report/deviceHeader.vue')['default']
     ReportItem: typeof import('./components/report/item.vue')['default']
     SettingsProjectForm: typeof import('./components/settings/projectForm.vue')['default']
     SettingsProjectSettings: typeof import('./components/settings/projectSettings.vue')['default']
diff --git a/src/components/report/deviceHeader.vue b/src/components/report/deviceHeader.vue
new file mode 100644
index 0000000..64dd8a3
--- /dev/null
+++ b/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>
diff --git a/src/components/report/item.vue b/src/components/report/item.vue
index 461a278..0f1d19d 100644
--- a/src/components/report/item.vue
+++ b/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>
diff --git a/src/pages/report/detail/index.vue b/src/pages/report/detail/index.vue
new file mode 100644
index 0000000..5eabbe2
--- /dev/null
+++ b/src/pages/report/detail/index.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+definePage({
+  layout: false,
+  style: {
+    navigationStyle: 'custom',
+  },
+})
+
+const reportData = ref<any>(null)
+
+onLoad((options) => {
+  if (options?.data) {
+    console.log('222222222222', options.data)
+
+    reportData.value = JSON.parse(options.data)
+    // reportData.value = JSON.parse(decodeURIComponent(options.data))
+    console.log('2222222222223333333', reportData.value)
+  }
+})
+</script>
+
+<template>
+  <view class="page">
+    <back-nav title="报告详情" />
+
+    <view class="content">
+      <report-device-header
+        v-if="reportData"
+        :device-code="reportData.deviceCode"
+        :time="reportData.time"
+        :status="reportData.status"
+      />
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.page {
+  min-height: 100vh;
+  background-color: #EAEFF9;
+}
+
+.content {
+  padding: 16px;
+  padding-top: 72px;
+}
+</style>
diff --git a/src/pages/warning/detail/index.vue b/src/pages/warning/detail/index.vue
index c05b30c..49fcad6 100644
--- a/src/pages/warning/detail/index.vue
+++ b/src/pages/warning/detail/index.vue
@@ -10,7 +10,9 @@ const warningData = ref<any>(null)
 
 onLoad((options) => {
   if (options?.data) {
+    console.log('111111111111111', options.data)
     warningData.value = JSON.parse(decodeURIComponent(options.data))
+    console.log('11111111111111111222222', warningData.value)
   }
 })
 </script>
diff --git a/src/uni-pages.d.ts b/src/uni-pages.d.ts
index 54140ae..460e1dc 100644
--- a/src/uni-pages.d.ts
+++ b/src/uni-pages.d.ts
@@ -12,6 +12,7 @@ type _LocationUrl =
   "/pages/settings/index" |
   "/pages/warning/index" |
   "/pages/work/index" |
+  "/pages/report/detail/index" |
   "/pages/warning/detail/index";
 
 interface NavigateToOptions {
diff --git a/src/utils/storage.ts b/src/utils/storage.ts
new file mode 100644
index 0000000..8758538
--- /dev/null
+++ b/src/utils/storage.ts
@@ -0,0 +1,127 @@
+/**
+ * Storage 工具类
+ *
+ * 使用方式：
+ * import storage from '@/utils/storage'
+ *
+ * // 存储
+ * storage.set('key', value)
+ * storage.set('key', value, 60 * 1000) // 带过期时间（毫秒）
+ *
+ * // 获取
+ * const data = storage.get('key')
+ * const data = storage.get('key', '默认值') // 带默认值
+ *
+ * // 删除
+ * storage.remove('key')
+ *
+ * // 清空所有
+ * storage.clear()
+ *
+ * // 判断是否存在
+ * storage.has('key')
+ *
+ * // 获取所有key
+ * storage.keys()
+ */
+
+interface StorageItem<T = any> {
+  value: T
+  expire?: number // 过期时间戳
+}
+
+const storage = {
+  /**
+   * 存储数据
+   * @param key 键
+   * @param value 值
+   * @param expire 过期时间（毫秒），不传则永不过期
+   */
+  set<T>(key: string, value: T, expire?: number): void {
+    const item: StorageItem<T> = {
+      value,
+    }
+    if (expire) {
+      item.expire = Date.now() + expire
+    }
+    uni.setStorageSync(key, JSON.stringify(item))
+  },
+
+  /**
+   * 获取数据
+   * @param key 键
+   * @param defaultValue 默认值
+   * @returns 存储的值或默认值
+   */
+  get<T = any>(key: string, defaultValue?: T): T | undefined {
+    try {
+      const raw = uni.getStorageSync(key)
+      if (!raw)
+        return defaultValue
+
+      const item: StorageItem<T> = JSON.parse(raw)
+
+      // 检查是否过期
+      if (item.expire && item.expire < Date.now()) {
+        this.remove(key)
+        return defaultValue
+      }
+
+      return item.value
+    }
+    catch {
+      return defaultValue
+    }
+  },
+
+  /**
+   * 删除数据
+   * @param key 键
+   */
+  remove(key: string): void {
+    uni.removeStorageSync(key)
+  },
+
+  /**
+   * 清空所有数据
+   */
+  clear(): void {
+    uni.clearStorageSync()
+  },
+
+  /**
+   * 判断是否存在
+   * @param key 键
+   * @returns 是否存在
+   */
+  has(key: string): boolean {
+    try {
+      const raw = uni.getStorageSync(key)
+      if (!raw)
+        return false
+
+      const item: StorageItem = JSON.parse(raw)
+
+      // 检查是否过期
+      if (item.expire && item.expire < Date.now()) {
+        this.remove(key)
+        return false
+      }
+
+      return true
+    }
+    catch {
+      return false
+    }
+  },
+
+  /**
+   * 获取所有key
+   * @returns key数组
+   */
+  keys(): string[] {
+    return Object.keys(uni.getStorageInfoSync().keys)
+  },
+}
+
+export default storage