|
@@ -0,0 +1,118 @@
|
|
|
|
|
+<script setup lang="ts">
|
|
|
|
|
+import { ref, onMounted } from 'vue'
|
|
|
|
|
+
|
|
|
|
|
+// 模拟反馈数据
|
|
|
|
|
+interface FeedbackItem {
|
|
|
|
|
+ id: number
|
|
|
|
|
+ content: string
|
|
|
|
|
+ imageUrl?: string
|
|
|
|
|
+ date: string
|
|
|
|
|
+ status: '已回复' | '处理中' | '已解决'
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const feedbackList = ref<FeedbackItem[]>([
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 1,
|
|
|
|
|
+ content: '这是一个测试反馈内容,用户提出的问题在这里展示。',
|
|
|
|
|
+ imageUrl: '',
|
|
|
|
|
+ date: '2025-10-28 14:30',
|
|
|
|
|
+ status: '已回复'
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 2,
|
|
|
|
|
+ content: '另一个反馈示例,带有图片附件。',
|
|
|
|
|
+ imageUrl: '/static/plus.png',
|
|
|
|
|
+ date: '2025-10-29 09:15',
|
|
|
|
|
+ status: '处理中'
|
|
|
|
|
+ }
|
|
|
|
|
+])
|
|
|
|
|
+
|
|
|
|
|
+// 返回上一页
|
|
|
|
|
+const goBack = () => {
|
|
|
|
|
+ uni.navigateBack()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 页面加载时获取数据
|
|
|
|
|
+onMounted(() => {
|
|
|
|
|
+ // 这里可以调用 API 获取实际数据
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 下拉刷新
|
|
|
|
|
+const onPullDownRefresh = () => {
|
|
|
|
|
+ // 模拟刷新数据
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ uni.stopPullDownRefresh()
|
|
|
|
|
+
|
|
|
|
|
+ // 模拟更新数据
|
|
|
|
|
+ feedbackList.value.unshift({
|
|
|
|
|
+ id: feedbackList.value.length + 1,
|
|
|
|
|
+ content: '这是下拉刷新后新增的反馈内容',
|
|
|
|
|
+ imageUrl: '',
|
|
|
|
|
+ date: new Date().toLocaleString('zh-CN', {
|
|
|
|
|
+ year: 'numeric',
|
|
|
|
|
+ month: '2-digit',
|
|
|
|
|
+ day: '2-digit',
|
|
|
|
|
+ hour: '2-digit',
|
|
|
|
|
+ minute: '2-digit'
|
|
|
|
|
+ }).replace(/\//g, '-'),
|
|
|
|
|
+ status: '处理中'
|
|
|
|
|
+ })
|
|
|
|
|
+ }, 1000)
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 跳转到详情页
|
|
|
|
|
+const goToDetail = (id: number) => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: `/pages/feedback/list/detail/index?id=${id}`
|
|
|
|
|
+ })
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 触发下拉刷新的方法(用于测试)
|
|
|
|
|
+const triggerRefresh = () => {
|
|
|
|
|
+ onPullDownRefresh()
|
|
|
|
|
+}
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<template>
|
|
|
|
|
+ <!-- 列表内容 -->
|
|
|
|
|
+ <view class="p-3">
|
|
|
|
|
+ <view
|
|
|
|
|
+ v-for="item in feedbackList"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ class="bg-white rounded-lg shadow-sm mb-4 p-4"
|
|
|
|
|
+ @click="goToDetail(item.id)"
|
|
|
|
|
+ >
|
|
|
|
|
+ <view class="flex justify-between items-start mb-2">
|
|
|
|
|
+ <text class="text-gray-900 font-medium">反馈 #{{ item.id }}</text>
|
|
|
|
|
+ <text class="text-xs px-2 py-1 rounded" :class="{
|
|
|
|
|
+ 'bg-green-100 text-green-800': item.status === '已解决',
|
|
|
|
|
+ 'bg-yellow-100 text-yellow-800': item.status === '处理中',
|
|
|
|
|
+ 'bg-blue-100 text-blue-800': item.status === '已回复'
|
|
|
|
|
+ }">{{ item.status }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="text-gray-700 text-sm mb-3">
|
|
|
|
|
+ {{ item.content }}
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view v-if="item.imageUrl" class="mb-3">
|
|
|
|
|
+ <image
|
|
|
|
|
+ :src="item.imageUrl"
|
|
|
|
|
+ class="w-24 h-24 rounded object-cover"
|
|
|
|
|
+ mode="aspectFill"
|
|
|
|
|
+ />
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="text-xs text-gray-500">
|
|
|
|
|
+ {{ item.date }}
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view v-if="feedbackList.length === 0" class="text-center py-10 text-gray-500">
|
|
|
|
|
+ 暂无反馈记录
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<style scoped>
|
|
|
|
|
+</style>
|