style: truncate spam rule tags with tooltip

web/static/index.html

@@ -75,6 +75,8 @@
   .chat-item .user { font-weight: 700; color: #2563eb; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
   .chat-item .time { flex-shrink: 0; font-size: 11px; color: #9ca3af; white-space: nowrap; }
   .chat-item .text { font-size: 13px; color: #374151; line-height: 1.55; white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere; }
+  .reason-tag { display: inline-block; max-width: 100%; margin-top: 4px; }
+  .reason-tag .el-tag { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
 
   .log-window {
     flex: 1;
@@ -217,7 +219,9 @@
               </span>
             </div>
             <div class="text">{{ item.text }}</div>
-            <el-tag v-if="item.spam" size="mini" type="danger">垃圾：{{ item.reason || item.spam_reason }}</el-tag>
+            <el-tooltip v-if="item.spam" effect="dark" placement="top-start" :content="item.reason || item.spam_reason || ''">
+              <span class="reason-tag"><el-tag size="mini" type="danger">垃圾：{{ item.reason || item.spam_reason }}</el-tag></span>
+            </el-tooltip>
             <el-tag v-if="item.deleted" size="mini" type="info">已手动删除 · {{ formatTime(item.deleted_at) }}</el-tag>
           </div>
         </div>