✨ feat: 增加项目盈亏和问题反馈

pages/workbench/feedback/detail.vue

@@ -0,0 +1,186 @@
+<template>
+  <view class="message-detail-page">
+    <!-- 详情内容 -->
+    <view class="detail-content" v-loading="loading">
+      <view class="detail-header">
+        <text class="detail-title">{{ message.title }}</text>
+        
+        <view class="detail-meta">
+          <view class="meta-item">
+            <uni-icons type="user" size="14" color="#666"></uni-icons>
+            <text>创建人：{{ message.createBy || '未知' }}</text>
+          </view>
+          <view class="meta-item">
+            <uni-icons type="time" size="14" color="#666"></uni-icons>
+            <text>创建时间：{{ formatTime(message.createTime) }}</text>
+          </view>
+        </view>
+        
+        <view class="project-info" v-if="message.projectId">
+          <text class="label">项目信息：</text>
+          <text>{{ message.projectName }}</text>
+          <text v-if="message.projectCode"> ({{ message.projectCode }})</text>
+        </view>
+      </view>
+      
+      <view class="detail-divider"></view>
+      
+      <mp-html :content="message.content"></mp-html>
+    </view>
+  </view>
+</template>
+
+<script>
+import { getFeedback, listFeedback, toRead } from "@/api/oa/feedback";
+
+export default {
+  data() {
+    return {
+      message: {},
+      feedbackId: '',
+      loading: false
+    };
+  },
+  onLoad(options) {
+    this.feedbackId = options.feedbackId;
+    this.getMessageDetail();
+  },
+  methods: {
+    // 获取消息详情
+    getMessageDetail() {
+      this.loading = true;
+      // 调用列表接口获取单条数据，实际项目中应该有专门的详情接口
+      getFeedback(this.feedbackId)
+        .then(res => {
+          if (res.data) {
+            this.message = res.data;
+            
+            // 标记为已读
+            toRead(this.message);
+          } else {
+            uni.showToast({
+              title: '未找到消息',
+              icon: 'none'
+            });
+          }
+        })
+        .catch(err => {
+          uni.showToast({
+            title: err.message || '获取消息失败',
+            icon: 'none'
+          });
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    
+    // 格式化时间
+    formatTime(time) {
+      if (!time) return '';
+      const date = new Date(time);
+      return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
+    },
+    
+    // 返回上一页
+    navigateBack() {
+      uni.navigateBack();
+    }
+  }
+};
+</script>
+
+<style scoped>
+.message-detail-page {
+  background-color: #f5f5f5;
+  min-height: 100vh;
+}
+
+.navbar {
+  display: flex;
+  align-items: center;
+  height: 44px;
+  padding: 0 15px;
+  background-color: #3e7bfa;
+  color: #fff;
+}
+
+.back-btn {
+  background-color: transparent;
+  border: none;
+  color: #fff;
+  padding: 5px 10px;
+}
+
+.title {
+  font-size: 18px;
+  font-weight: bold;
+  flex: 1;
+  text-align: center;
+}
+
+.detail-content {
+  padding: 15px;
+  background-color: #fff;
+  margin: 10px;
+  border-radius: 8px;
+}
+
+.detail-header {
+  margin-bottom: 20px;
+}
+
+.detail-title {
+  font-size: 18px;
+  font-weight: bold;
+  margin-bottom: 15px;
+  display: block;
+  color: #333;
+}
+
+.detail-meta {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  margin-bottom: 15px;
+  color: #666;
+  font-size: 14px;
+}
+
+.meta-item {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+}
+
+.project-info {
+  padding: 10px;
+  background-color: #f5f7fa;
+  border-radius: 4px;
+  font-size: 14px;
+  color: #333;
+}
+
+.label {
+  color: #666;
+  font-weight: 500;
+}
+
+.detail-divider {
+  height: 1px;
+  background-color: #eee;
+  margin: 15px 0;
+}
+
+.detail-body {
+  color: #333;
+  line-height: 1.8;
+  font-size: 15px;
+  padding: 10px 0;
+}
+
+image {
+	max-width: 100vw;
+	object-fit: contain;
+}
+</style>