From 750f66441b36c0e17ef791c5ea548569b2877806 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <qq2178503051@163.com>
Date: Fri, 7 Nov 2025 10:45:43 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=8F=8D=E9=A6=88):=20=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?=E5=8F=8D=E9=A6=88=E8=AF=A6=E6=83=85=E9=A1=B5=E8=B7=B3=E8=BD=AC?=
 =?UTF-8?q?=E9=93=BE=E6=8E=A5=E5=B9=B6=E6=94=AF=E6=8C=81=E5=8F=8D=E9=A6=88?=
 =?UTF-8?q?=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

重构文章详情页以支持反馈类型，添加获取反馈详情和标记已读功能
---
 pages/workbench/article/article.vue   | 458 +++++++++++++++-----------
 pages/workbench/feedback/feedback.vue |   2 +-
 2 files changed, 262 insertions(+), 198 deletions(-)

diff --git a/pages/workbench/article/article.vue b/pages/workbench/article/article.vue
index b691fca..c10d594 100644
--- a/pages/workbench/article/article.vue
+++ b/pages/workbench/article/article.vue
@@ -1,220 +1,284 @@
 <template>
-  <view class="article-container">
-    <!-- 加载状态 -->
-    <view class="loading" v-if="loading">
-      <uni-loading-icon size="24" color="#007aff"></uni-loading-icon>
-      <text class="loading-text">加载中...</text>
-    </view>
+	<view class="article-container">
+		<!-- 加载状态 -->
+		<view class="loading" v-if="loading">
+			<uni-loading-icon size="24" color="#007aff"></uni-loading-icon>
+			<text class="loading-text">加载中...</text>
+		</view>
 
-    <!-- 文章内容（加载完成后显示） -->
-    <view class="article-content" v-else-if="article">
-      <!-- 帖子标题 -->
-      <view class="post-title">{{ article.title || '无标题' }}</view>
+		<!-- 文章内容（加载完成后显示） -->
+		<view class="article-content" v-else-if="article">
+			<!-- 帖子标题 -->
+			<view class="post-title">{{ article.title || '无标题' }}</view>
 
-      <!-- 用户信息 -->
-      <view class="user-info">
-        <image v-if="article.avatar" class="user-avatar" :src="article.avatar || '/static/default-avatar.png'" mode="cover"></image>
-        <view class="user-meta">
-          <view class="user-name">
-            {{ article.author || '未知用户' }}
-            <!-- <view class="user-level">Lv.1</view> -->
-          </view>
-          <view class="user-time-area">
+			<!-- 用户信息 -->
+			<view class="user-info">
+				<image v-if="article.avatar" class="user-avatar" :src="article.avatar || '/static/default-avatar.png'"
+					mode="cover"></image>
+				<view class="user-meta">
+					<view class="user-name">
+						{{ article.author || '未知用户' }}
+						<!-- <view class="user-level">Lv.1</view> -->
+					</view>
+					<view class="user-time-area">
 						<text>{{ article.createTime || '未知时间' }}</text>
 						<text v-if="article.area"> · {{ article.area || '未知地区' }}</text>
 					</view>
-        </view>
-        <!-- <view class="follow-btn">+关注</view> -->
-      </view>
+				</view>
+				<!-- <view class="follow-btn">+关注</view> -->
+			</view>
 
-      <!-- 富文本内容 -->
-      <mp-html :content="article.content"></mp-html>
-    </view>
+			<!-- 富文本内容 -->
+			<mp-html :content="article.content"></mp-html>
+		</view>
 
-    <!-- 错误状态 -->
-    <view class="error" v-else>
-      <uni-icons type="warn" size="36" color="#ff4d4f"></uni-icons>
-      <text class="error-text">加载失败</text>
-      <button class="retry-btn" @click="reload">重试</button>
-    </view>
-  </view>
+		<!-- 错误状态 -->
+		<view class="error" v-else>
+			<uni-icons type="warn" size="36" color="#ff4d4f"></uni-icons>
+			<text class="error-text">加载失败</text>
+			<button class="retry-btn" @click="reload">重试</button>
+		</view>
+	</view>
 </template>
 
 <script>
-import { getNotice } from '@/api/oa/notice';
+	import {
+		getNotice
+	} from '@/api/oa/notice';
+	import {
+		getFeedback,
+		toRead
+	} from "@/api/oa/feedback";
 
-export default {
-  data() {
-    return {
-      article: null,
-      loading: true,
-    };
-  },
-  onLoad(options) {
-    const { type, id } = options;
-    if (!type || !id) {
-      uni.showToast({ title: '参数错误', icon: 'none' });
-      setTimeout(() => uni.navigateBack(), 1000);
-      return;
-    }
-    this.fetchData(type, id);
-  },
-  methods: {
-    fetchData(type, id) {
-      this.loading = true;
-      switch (type) { 
-        case 'notice':
-          getNotice(id)
-            .then(res => {
-              this.article = {
-                ...res.data,
-                author: res.data.createBy,
-                title: res.data.noticeTitle,
-                content: res.data.noticeContent,
-              };
-              this.loading = false;
-            })
-            .catch(err => {
-              console.error('获取文章失败', err);
-              this.article = null;
-              this.loading = false;
-              uni.showToast({ title: '加载失败', icon: 'none' });
-            });
-          break;
-        default:
-          uni.showToast({ title: '未知类型', icon: 'none' });
-          setTimeout(() => uni.navigateBack(), 1000);
-          break;
-      }
-    },
-    reload() {
-      const { type, id } = this.$options.onLoad.options; 
-      this.fetchData(type, id);
-    },
-    navigateBack() {
-      uni.navigateBack();
-    }
-  }
-};
+	export default {
+		data() {
+			return {
+				article: null,
+				loading: true,
+			};
+		},
+		onLoad(options) {
+			const {
+				type,
+				id
+			} = options;
+			if (!type || !id) {
+				uni.showToast({
+					title: '参数错误',
+					icon: 'none'
+				});
+				setTimeout(() => uni.navigateBack(), 1000);
+				return;
+			}
+			this.fetchData(type, id);
+		},
+		methods: {
+			fetchData(type, id) {
+				this.loading = true;
+				switch (type) {
+					case 'notice':
+						getNotice(id)
+							.then(res => {
+								this.article = {
+									...res.data,
+									author: res.data.createBy,
+									title: res.data.noticeTitle,
+									content: res.data.noticeContent,
+								};
+								uni.setNavigationBarTitle({
+									title: '通知详情'
+								})
+								this.loading = false;
+							})
+							.catch(err => {
+								console.error('获取文章失败', err);
+								this.article = null;
+								this.loading = false;
+								uni.showToast({
+									title: '加载失败',
+									icon: 'none'
+								});
+							});
+						break;
+					case 'feedback':
+						getFeedback(id)
+							.then(res => {
+								if (res.data) {
+									this.article = res.data;
+									uni.setNavigationBarTitle({
+										title: '反馈详情'
+									})
+									// 标记为已读
+									toRead(this.article);
+								} else {
+									uni.showToast({
+										title: '未找到消息',
+										icon: 'none'
+									});
+								}
+							})
+							.catch(err => {
+								uni.showToast({
+									title: err.message || '获取消息失败',
+									icon: 'none'
+								});
+							})
+							.finally(() => {
+								this.loading = false;
+							});
+						break;
+					default:
+						uni.showToast({
+							title: '未知类型',
+							icon: 'none'
+						});
+						setTimeout(() => uni.navigateBack(), 1000);
+						break;
+				}
+			},
+			reload() {
+				const {
+					type,
+					id
+				} = this.$options.onLoad.options;
+				this.fetchData(type, id);
+			},
+			navigateBack() {
+				uni.navigateBack();
+			}
+		}
+	};
 </script>
 
 <style scoped>
-.article-container {
-  min-height: 100vh;
-  background-color: #fff;
-}
+	.article-container {
+		min-height: 100vh;
+		background-color: #fff;
+	}
 
-.loading {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 50px 0;
-}
-.loading-text {
-  margin-top: 10px;
-  color: #666;
-  font-size: 14px;
-}
+	.loading {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		padding: 50px 0;
+	}
 
-.error {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 50px 0;
-}
-.error-text {
-  margin: 15px 0;
-  color: #ff4d4f;
-  font-size: 16px;
-}
-.retry-btn {
-  background-color: #007aff;
-  color: #fff;
-  border-radius: 4px;
-  padding: 8px 20px;
-  font-size: 14px;
-}
+	.loading-text {
+		margin-top: 10px;
+		color: #666;
+		font-size: 14px;
+	}
 
-.article-content {
-  padding: 16px;
-}
+	.error {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		padding: 50px 0;
+	}
 
-.post-title {
-  font-size: 18px;
-  font-weight: bold;
-  color: #333;
-  margin-bottom: 12px;
-  line-height: 1.4;
-}
+	.error-text {
+		margin: 15px 0;
+		color: #ff4d4f;
+		font-size: 16px;
+	}
 
-.user-info {
-  display: flex;
-  align-items: center;
-  margin-bottom: 16px;
-}
-.user-avatar {
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  margin-right: 10px;
-}
-.user-meta {
-  flex: 1;
-}
-.user-name {
-  display: flex;
-  align-items: center;
-  font-size: 14px;
-  color: #333;
-  margin-bottom: 4px;
-}
-.user-level {
-  background-color: #dff0d8;
-  color: #5cb85c;
-  font-size: 10px;
-  padding: 1px 4px;
-  border-radius: 3px;
-  margin-left: 6px;
-}
-.user-time-area {
-  font-size: 12px;
-  color: #999;
-}
-.follow-btn {
-  font-size: 12px;
-  color: #5cb85c;
-  background-color: #e8f5e9;
-  padding: 4px 8px;
-  border-radius: 12px;
-}
+	.retry-btn {
+		background-color: #007aff;
+		color: #fff;
+		border-radius: 4px;
+		padding: 8px 20px;
+		font-size: 14px;
+	}
 
-.mp-html {
-  font-size: 15px;
-  color: #333;
-  line-height: 1.8;
-}
-.mp-html img {
-  max-width: 100%;
-  height: auto;
-  margin: 10px 0;
-  border-radius: 8px;
-}
+	.article-content {
+		padding: 16px;
+	}
 
-.interact-area {
-  display: flex;
-  justify-content: space-around;
-  margin-top: 20px;
-  padding: 10px 0;
-  border-top: 1px solid #eee;
-}
-.interact-item {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  font-size: 12px;
-  color: #999;
-}
-.interact-count {
-  margin-top: 4px;
-}
+	.post-title {
+		font-size: 18px;
+		font-weight: bold;
+		color: #333;
+		margin-bottom: 12px;
+		line-height: 1.4;
+	}
+
+	.user-info {
+		display: flex;
+		align-items: center;
+		margin-bottom: 16px;
+	}
+
+	.user-avatar {
+		width: 40px;
+		height: 40px;
+		border-radius: 50%;
+		margin-right: 10px;
+	}
+
+	.user-meta {
+		flex: 1;
+	}
+
+	.user-name {
+		display: flex;
+		align-items: center;
+		font-size: 14px;
+		color: #333;
+		margin-bottom: 4px;
+	}
+
+	.user-level {
+		background-color: #dff0d8;
+		color: #5cb85c;
+		font-size: 10px;
+		padding: 1px 4px;
+		border-radius: 3px;
+		margin-left: 6px;
+	}
+
+	.user-time-area {
+		font-size: 12px;
+		color: #999;
+	}
+
+	.follow-btn {
+		font-size: 12px;
+		color: #5cb85c;
+		background-color: #e8f5e9;
+		padding: 4px 8px;
+		border-radius: 12px;
+	}
+
+	.mp-html {
+		font-size: 15px;
+		color: #333;
+		line-height: 1.8;
+	}
+
+	.mp-html img {
+		max-width: 100%;
+		height: auto;
+		margin: 10px 0;
+		border-radius: 8px;
+	}
+
+	.interact-area {
+		display: flex;
+		justify-content: space-around;
+		margin-top: 20px;
+		padding: 10px 0;
+		border-top: 1px solid #eee;
+	}
+
+	.interact-item {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		font-size: 12px;
+		color: #999;
+	}
+
+	.interact-count {
+		margin-top: 4px;
+	}
 </style>
\ No newline at end of file
diff --git a/pages/workbench/feedback/feedback.vue b/pages/workbench/feedback/feedback.vue
index 0699e3e..fda74e2 100644
--- a/pages/workbench/feedback/feedback.vue
+++ b/pages/workbench/feedback/feedback.vue
@@ -219,7 +219,7 @@
 			// 跳转到详情页
 			navigateToDetail(msg) {
 				uni.navigateTo({
-					url: `/pages/workbench/feedback/detail?feedbackId=${msg.feedbackId}`
+					url: `/pages/workbench/article/article?id=${msg.feedbackId}&type=feedback`
 				});
 			},