feat(feedback): 添加反馈详情页面- 创建反馈详情页面基础结构

- 实现反馈详情数据展示功能
- 添加反馈状态标签显示
- 支持反馈图片展示
- 实现官方回复内容展示- 添加页面加载时的数据模拟
- 使用UniApp的onLoad钩子获取页面参数- 实现响应式状态标签样式- 添加暂无回复时的提示信息

src/pages/feedback/list/detail/index.vue

@@ -0,0 +1,102 @@
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+
+// 模拟反馈详情数据
+interface FeedbackDetail {
+  id: number
+  content: string
+  imageUrl?: string
+  date: string
+  status: '已回复' | '处理中' | '已解决'
+  replyContent?: string
+  replyDate?: string
+}
+
+const feedbackDetail = ref<FeedbackDetail>({
+  id: 0,
+  content: '',
+  imageUrl: '',
+  date: '',
+  status: '处理中'
+})
+
+// 使用UniApp的onLoad钩子获取页面参数
+onLoad((options) => {
+  if (options && options.id) {
+    // 模拟根据ID获取详情数据
+    // 实际项目中这里应该调用API获取数据
+    setTimeout(() => {
+      feedbackDetail.value = {
+        id: parseInt(options.id),
+        content: '这是一个详细的反馈内容，用户在这里描述了具体的问题和情况。希望团队能够尽快处理这个问题。',
+        imageUrl: '/static/plus.png',
+        date: '2025-10-28 14:30',
+        status: '已回复',
+        replyContent: '感谢您的反馈，我们已经收到并开始处理您的问题。预计会在3个工作日内解决，请耐心等待。',
+        replyDate: '2025-10-29 09:15'
+      }
+    }, 500)
+  }
+})
+</script>
+
+<template>
+  <view class="bg-gray-50 min-h-screen">
+    <!-- 详情内容 -->
+    <view class="p-4">
+      <view class="bg-white rounded-lg shadow-sm p-4 mb-4">
+        <view class="flex justify-between items-start mb-3">
+          <text class="text-gray-900 font-medium">反馈 #{{ feedbackDetail.id }}</text>
+          <text class="text-xs px-2 py-1 rounded" :class="{
+            'bg-green-100 text-green-800': feedbackDetail.status === '已解决',
+            'bg-yellow-100 text-yellow-800': feedbackDetail.status === '处理中',
+            'bg-blue-100 text-blue-800': feedbackDetail.status === '已回复'
+          }">{{ feedbackDetail.status }}</text>
+        </view>
+
+        <view class="text-gray-700 text-sm mb-4">
+          {{ feedbackDetail.content }}
+        </view>
+
+        <view v-if="feedbackDetail.imageUrl" class="mb-4">
+          <image
+            :src="feedbackDetail.imageUrl"
+            class="w-32 h-32 rounded object-cover"
+            mode="aspectFill"
+          />
+        </view>
+
+        <view class="text-xs text-gray-500 border-t border-gray-100 pt-3">
+          {{ feedbackDetail.date }}
+        </view>
+      </view>
+
+      <!-- 回复内容 -->
+      <view
+        v-if="feedbackDetail.replyContent"
+        class="bg-white rounded-lg shadow-sm p-4"
+      >
+        <view class="font-medium text-gray-900 mb-3">官方回复</view>
+        <view class="text-gray-700 text-sm mb-3">
+          {{ feedbackDetail.replyContent }}
+        </view>
+        <view class="text-xs text-gray-500 border-t border-gray-100 pt-3">
+          {{ feedbackDetail.replyDate }}
+        </view>
+      </view>
+
+      <view
+        v-else
+        class="bg-white rounded-lg shadow-sm p-4"
+      >
+        <view class="text-gray-500 text-center py-6">
+          暂无回复
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+</style>