rating

src/views/systemManagement/robot/components/RobotCommentView.vue

@@ -0,0 +1,166 @@
+<template>
+  <el-dialog title="用户评论" :visible.sync="dialogVisible" width="600px" @close="close">
+    <div v-if="commentList && commentList.length > 0" class="comment-list">
+      <div v-for="item in commentList" :key="item.id" class="comment-item">
+        <div class="comment-header">
+          <el-image
+            v-if="item.itemAvatarUrl"
+            class="comment-avatar"
+            :preview-src-list="[item.itemAvatarUrl]"
+            :src="getThumbUrl(item.itemAvatarUrl)"
+          />
+          <div class="comment-meta">
+            <div class="comment-title">
+              <span class="topic-name">[{{ item.topicName }}]</span>
+              <span class="item-name">{{ item.itemName }}</span>
+            </div>
+            <div class="comment-time">{{ formatTime(item.createdAt) }}</div>
+          </div>
+          <el-tag size="mini" :type="item.status === 2 ? 'success' : 'info'">
+            {{ item.status === 2 ? '已展示' : '隐藏/待审' }}
+          </el-tag>
+        </div>
+        <div class="comment-content">
+          {{ item.content }}
+        </div>
+        <div class="comment-footer">
+          <span>
+            <i class="el-icon-thumb" />
+            {{ item.likeCount || 0 }}
+          </span>
+          <span>
+            <i class="el-icon-chat-dot-round" />
+            {{ item.replyCount || 0 }}
+          </span>
+        </div>
+      </div>
+    </div>
+    <el-empty v-else description="暂无评论数据" />
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="close">关 闭</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import { formatTime } from '@/utils'
+  import { getThumbUrl } from '@/utils/blessing'
+
+  export default {
+    name: 'RobotCommentView',
+    data() {
+      return {
+        dialogVisible: false,
+        commentList: [],
+      }
+    },
+    methods: {
+      formatTime,
+      getThumbUrl,
+      show(comments) {
+        this.commentList = comments || []
+        this.dialogVisible = true
+      },
+      close() {
+        this.commentList = []
+        this.dialogVisible = false
+      },
+    },
+  }
+</script>
+
+<style scoped>
+  .comment-list {
+    max-height: 500px;
+    overflow-y: auto;
+    padding-right: 10px;
+  }
+
+  .comment-item {
+    padding: 15px;
+    margin-bottom: 15px;
+    background-color: #f8f9fa;
+    border-radius: 8px;
+    border: 1px solid #ebeef5;
+  }
+
+  .comment-item:last-child {
+    margin-bottom: 0;
+  }
+
+  .comment-header {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 10px;
+  }
+
+  .comment-avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 4px;
+    margin-right: 10px;
+    flex-shrink: 0;
+  }
+
+  .comment-meta {
+    flex: 1;
+    overflow: hidden;
+  }
+
+  .comment-title {
+    font-size: 14px;
+    margin-bottom: 4px;
+    display: flex;
+    align-items: center;
+  }
+
+  .topic-name {
+    color: #409eff;
+    margin-right: 5px;
+    font-weight: bold;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 150px;
+  }
+
+  .item-name {
+    font-weight: bold;
+    color: #303133;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    flex: 1;
+  }
+
+  .comment-time {
+    font-size: 12px;
+    color: #909399;
+  }
+
+  .comment-content {
+    font-size: 14px;
+    color: #606266;
+    line-height: 1.6;
+    margin-bottom: 10px;
+    word-break: break-all;
+    white-space: pre-wrap;
+    background-color: #fff;
+    padding: 10px;
+    border-radius: 4px;
+  }
+
+  .comment-footer {
+    display: flex;
+    align-items: center;
+    gap: 15px;
+    font-size: 12px;
+    color: #909399;
+  }
+
+  .comment-footer span {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+  }
+</style>

src/views/systemManagement/robot/index.vue

@@ -73,7 +73,8 @@
       <el-table-column v-if="queryForm.appId === '6a0d7dbe4c5de50f2ba66475'" align="center" fixed="right" label="操作" width="100">
         <template #default="{ row }">
           <el-button type="text" @click="handleRating(row)">评分</el-button>
-          <el-button type="text" @click="handleComment(row)">评论</el-button>
+          <el-button type="text" @click="handleComment(row)">去评论</el-button>
+          <el-button type="text" @click="handleViewComment(row)">用户评论</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -90,6 +91,7 @@
 
     <robot-rating-edit ref="ratingEdit" @fetch-data="fetchData" />
     <robot-comment-edit ref="commentEdit" @fetch-data="fetchData" />
+    <robot-comment-view ref="commentView" />
   </div>
 </template>
 
@@ -100,10 +102,11 @@
   import { getThumbUrl } from '@/utils/blessing'
   import RobotRatingEdit from './components/RobotRatingEdit'
   import RobotCommentEdit from './components/RobotCommentEdit'
+  import RobotCommentView from './components/RobotCommentView'
 
   export default {
     name: 'RobotManagement',
-    components: { RobotRatingEdit, RobotCommentEdit },
+    components: { RobotRatingEdit, RobotCommentEdit, RobotCommentView },
     data() {
       return {
         list: [],
@@ -186,23 +189,26 @@
       handleComment(row) {
         this.$refs['commentEdit'].showEdit(row)
       },
+      handleViewComment(row) {
+        this.$refs['commentView'].show(row.commentInfo || [])
+      },
       getScoreTypeText(type) {
         const map = {
-          1: '夯',
-          2: '顶级',
+          5: '夯',
+          4: '顶级',
           3: '人上人',
-          4: 'NPC',
-          5: '拉',
+          2: 'NPC',
+          1: '拉',
         }
         return map[type] || '未知'
       },
       getScoreTypeTag(type) {
         const map = {
-          1: 'success', // 夯
-          2: 'primary', // 顶级
+          5: 'success', // 夯
+          4: 'primary', // 顶级
           3: 'warning', // 人上人
-          4: 'info', // NPC
-          5: 'danger', // 拉
+          2: 'info', // NPC
+          1: 'danger', // 拉
         }
         return map[type] || 'info'
       },