feat: 颜色样式随机调整

src/pages/ChatMain/ChatLongAnswer/index.vue

@@ -12,7 +12,7 @@
           <view v-if="headerSections.title" class="long-answer-title">
             {{ headerSections.title.contentValue }}
           </view>
-          <view v-if="headerSections.tag" class="long-answer-tag">
+          <view v-if="headerSections.tag" class="long-answer-tag" :style="longAnswerTagStyle">
             {{ headerSections.tag.contentValue }}
           </view>
         </view>
@@ -48,6 +48,7 @@ import {
   getLongTextSections,
   getLongTextValue,
 } from "@/utils/longTextCard";
+import { buildTagToneStyle, pickRandomTagToneColor } from "@/utils/tagTone";
 
 const props = defineProps({
   answerText: {
@@ -59,6 +60,8 @@ const props = defineProps({
 const answerText = ref(props.answerText || "");
 const title = ref("");
 const longTextData = ref(null);
+const longAnswerTagColor = ref(pickRandomTagToneColor());
+const longAnswerTagStyle = computed(() => buildTagToneStyle(longAnswerTagColor.value));
 
 let unsubscribe = null;
 
@@ -205,11 +208,12 @@ const scrollToBottom = () => {
   }, 100);
 }
 
-onLoad(({ message = "", streamId = "", finished = "0" }) => {
+onLoad(({ message = "", streamId = "", finished = "0", tagToneColor = "" }) => {
   // 记录初始完成状态
   isFinishedOnInit = finished === "1";
+  longAnswerTagColor.value = tagToneColor ? decodeURIComponent(tagToneColor) : longAnswerTagColor.value;
 
-  console.log("LongAnswer onLoad with params:", { message, streamId, finished });
+  console.log("LongAnswer onLoad with params:", { message, streamId, finished, tagToneColor });
 
   // 初次测量 scroll-view 高度
   nextTick(() => {
@@ -282,9 +286,7 @@ onUnload(() => {
   width: fit-content;
   padding: 3px 8px;
   border-radius: 12px;
-  border: 1px solid rgba($theme-color-500, 0.2);
-  background: rgba($theme-color-500, 0.08);
-  color: $theme-color-500;
+  border: 1px solid transparent;
   font-size: 12px;
   line-height: 18px;
 }