st-comp 0.0.277 → 0.0.279

package/packages/VarietyAiHelper/index.vue

@@ -1,910 +0,0 @@
-<script setup>
-import dayjs from "dayjs";
-import { ElMessage } from "element-plus";
-import { getUserData, getToken } from "st-func";
-import { inject, ref, nextTick, watch, reactive, computed } from "vue";
-import { sendToNodeVarietyAiHelper } from "../../public/aiTools";
-import { UserFilled, Service, Promotion, Refresh, SuccessFilled } from "@element-plus/icons-vue";
-
-const stConfig = inject("stConfig");
-const userData = reactive(getUserData());
-const visible = ref(false);
-const emit = defineEmits(["callBack"]);
-const props = defineProps({
-  defaultMessage: {
-    type: String,
-    default:
-      "你好呀！我是你的品种池AI助手，会根据您的自然语言去进行品种的条件查询\n\n示例: \n帮我查A股科创板下品种转价差上证50并且总市值大于1千万, 最近一次红箱的开盘价大于前5根K线的最高价, 并按照总市值升序进行排序",
-  },
-});
-
-const isSending = ref(false);
-const isThinking = ref(false);
-const showFinalResult = ref(false);
-const messageListRef = ref(null);
-const messageList = ref([
-  {
-    role: "defaultMessage", // defaultMessage-组件内置, assistant-智能体, user-用户
-    content: props.defaultMessage,
-    fullQuery: "",
-    historyList: [],
-    userContent: null,
-    showFeedback: false,
-    createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-    resTime: 0,
-    firstPackageTime: 0,
-  },
-]);
-const sessionId = ref(null);
-const userInput = ref("");
-
-// 反馈相关
-const feedbackDialogVisible = ref(false);
-const feedbackContent = ref("");
-const feedbackMessageIndex = ref({});
-
-// 节点相关
-const nodeProgressList = ref([]);
-const totalCount = computed(() => nodeProgressList.value.length);
-const completedCount = computed(() => nodeProgressList.value.filter((n) => n.status === "success").length);
-const progressPercent = computed(() => (totalCount.value ? (completedCount.value / totalCount.value) * 100 : 0));
-const currentStepName = computed(() => {
-  const running = nodeProgressList.value.find((n) => n.status === "executing");
-  return running ? running.name : "处理中";
-});
-
-// 发送消息
-const sendMessage = async () => {
-  const content = userInput.value.trim();
-  if (!content) return ElMessage.warning("请输入消息内容");
-  if (isSending.value) return;
-
-  nodeProgressList.value = [];
-  showFinalResult.value = false;
-
-  messageList.value.push({
-    role: "user",
-    content: content,
-    createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-  });
-  userInput.value = "";
-  await scrollToBottom();
-
-  messageList.value.push({
-    role: "assistant",
-    content: "",
-    fullQuery: "",
-    historyList: [],
-    userContent: content,
-    showFeedback: false,
-    createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-    resTime: 0,
-    firstPackageTime: 0,
-  });
-  await scrollToBottom();
-
-  isSending.value = true;
-  isThinking.value = true;
-
-  let fullResponse = "";
-  let resTime = new Date().getTime();
-  let firstNodeReceived = false;
-
-  try {
-    await sendToNodeVarietyAiHelper({
-      baseUrl: stConfig.env.VITE_BASE_URL,
-      token: getToken(),
-      value: content,
-      sessionId: sessionId.value,
-      callback: (type, data) => {
-        if (type === "session") {
-          sessionId.value = data;
-        }
-        if (type === "historyList") {
-          const lastMessage = messageList.value[messageList.value.length - 1];
-          lastMessage.historyList = data;
-        }
-        if (type === "fullQuery") {
-          const lastMessage = messageList.value[messageList.value.length - 1];
-          lastMessage.fullQuery = data;
-        }
-        if (type === "node") {
-          if (!firstNodeReceived) {
-            firstNodeReceived = true;
-            isThinking.value = false;
-            const lastMessage = messageList.value[messageList.value.length - 1];
-            if (lastMessage && lastMessage.role === "assistant" && lastMessage.firstPackageTime === 0) {
-              lastMessage.firstPackageTime = new Date().getTime() - resTime;
-            }
-          }
-
-          const existing = nodeProgressList.value.find((n) => n.name === data.name);
-          if (existing) {
-            existing.status = data.status;
-          } else {
-            nodeProgressList.value.push({ name: data.name, status: data.status });
-          }
-          scrollToBottom();
-          return;
-        }
-        if (type === "message") {
-          fullResponse = data;
-          const lastMessage = messageList.value[messageList.value.length - 1];
-          if (lastMessage && lastMessage.role === "assistant") {
-            lastMessage.content = fullResponse;
-            scrollToBottom();
-          }
-        }
-        if (type === "finish") {
-          isSending.value = false;
-          showFinalResult.value = true;
-          const lastMessage = messageList.value[messageList.value.length - 1];
-
-          if (lastMessage && lastMessage.role === "assistant") {
-            lastMessage.showFeedback = true;
-            lastMessage.resTime = new Date().getTime() - resTime;
-            handleFeedbackAction("default", messageList.value.length - 1);
-          }
-        }
-        if (type === "error") {
-          isThinking.value = false;
-          isSending.value = false;
-          messageList.value.pop();
-          messageList.value.push({
-            role: "assistant",
-            userContent: content,
-            content: `❌ ${data}`,
-            showFeedback: false,
-            createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-            resTime: new Date().getTime() - resTime,
-            firstPackageTime: 0,
-          });
-          handleFeedbackAction("default", messageList.value.length - 1);
-          scrollToBottom();
-          return;
-        }
-      },
-    });
-  } catch (error) {
-    ElMessage.error(`AI响应异常: ${error}`);
-    messageList.value.pop();
-    messageList.value.push({
-      role: "assistant",
-      userContent: content,
-      content: "❌ 抱歉，AI服务响应异常，请稍后重试。",
-      showFeedback: true,
-      createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-      resTime: new Date().getTime() - resTime,
-      firstPackageTime: 0,
-    });
-    handleFeedbackAction("default", messageList.value.length - 1);
-    await scrollToBottom();
-    isSending.value = false;
-    isThinking.value = false;
-  }
-};
-// 确认查询
-const lookResult = (content) => {
-  const { parsedConditions, ...webParams } = JSON.parse(content);
-  console.log({ parsedConditions, webParams });
-  emit("callBack", webParams);
-};
-// 用户反馈
-const handleFeedbackAction = async (action, messageIndex) => {
-  switch (action) {
-    // 满意
-    case "satisfied": {
-      const message = messageList.value[messageIndex];
-      await stConfig.request.post("/alarm/deliversign/addVarietyAiHelperLog", {
-        userName: userData.username,
-        userContent: message.userContent,
-        sessionId: sessionId.value,
-        fullQuery: message.fullQuery,
-        historyList: JSON.stringify(message.historyList ?? []),
-        aiContent: message.content,
-        type: 1,
-        createTime: message.createTime,
-        resTime: message.resTime,
-        firstPackageTime: message.firstPackageTime,
-        isSolved: 1,
-        logOrigin: 1,
-      });
-      ElMessage.success("感谢您的评价！");
-      messageList.value[messageIndex].showFeedback = false;
-      break;
-    }
-    // 不满意-打开窗口
-    case "open": {
-      feedbackMessageIndex.value = messageIndex;
-      feedbackDialogVisible.value = true;
-      break;
-    }
-    // 不满意-确认提交
-    case "unsatisfied": {
-      const message = messageList.value[messageIndex];
-      await stConfig.request.post("/alarm/deliversign/addVarietyAiHelperLog", {
-        userName: userData.username,
-        userContent: message.userContent,
-        sessionId: sessionId.value,
-        fullQuery: message.fullQuery,
-        historyList: JSON.stringify(message.historyList ?? []),
-        userSuggestion: feedbackContent.value,
-        aiContent: message.content,
-        type: 2,
-        resTime: message.resTime,
-        createTime: message.createTime,
-        firstPackageTime: message.firstPackageTime,
-        isSolved: 0,
-        logOrigin: 1,
-      });
-      ElMessage.success("感谢您的反馈！我们将持续跟踪并进行优化");
-      feedbackDialogVisible.value = false;
-      messageList.value[messageIndex].showFeedback = false;
-      break;
-    }
-    // 默认记录
-    case "default": {
-      const message = messageList.value[messageIndex];
-      console.log({
-        userName: userData.username,
-        userContent: message.userContent,
-        sessionId: sessionId.value,
-        fullQuery: message.fullQuery,
-        historyList: JSON.stringify(message.historyList ?? []),
-        aiContent: message.content,
-        type: null,
-        resTime: message.resTime,
-        createTime: message.createTime,
-        firstPackageTime: message.firstPackageTime,
-        isSolved: 1,
-        logOrigin: 1,
-      });
-      await stConfig.request.post("/alarm/deliversign/addVarietyAiHelperLog", {
-        userName: userData.username,
-        userContent: message.userContent,
-        sessionId: sessionId.value,
-        fullQuery: message.fullQuery,
-        historyList: JSON.stringify(message.historyList ?? []),
-        aiContent: message.content,
-        type: null,
-        resTime: message.resTime,
-        createTime: message.createTime,
-        firstPackageTime: message.firstPackageTime,
-        isSolved: 1,
-        logOrigin: 1,
-      });
-    }
-  }
-};
-// 键盘事件
-const handleKeydown = (event) => {
-  if (event.key === "Enter") {
-    if (event.ctrlKey) {
-      event.preventDefault();
-      const textarea = event.target;
-      const start = textarea.selectionStart;
-      const end = textarea.selectionEnd;
-      userInput.value = userInput.value.substring(0, start) + "\n" + userInput.value.substring(end);
-      nextTick(() => {
-        textarea.selectionStart = textarea.selectionEnd = start + 1;
-      });
-    } else {
-      event.preventDefault();
-      sendMessage();
-    }
-  }
-};
-// 滚动到底部
-const scrollToBottom = async () => {
-  await nextTick();
-  if (messageListRef.value) {
-    messageListRef.value.scrollTop = messageListRef.value.scrollHeight;
-  }
-};
-// 校验是否支持JSON解析
-const isJSONSerializable = (str) => {
-  if (typeof str !== "string") return false;
-  try {
-    const parsed = JSON.parse(str);
-    return parsed !== null && typeof parsed === "object";
-  } catch {
-    return false;
-  }
-};
-// 动态生成渲染DOM
-const renderJSONContent = (content) => {
-  const { parsedConditions } = JSON.parse(content);
-  // 创建DOM
-  let html = "";
-  if (parsedConditions?.length) {
-    html += '<div class="parsed-conditions">';
-    parsedConditions.forEach((text) => {
-      html += `<div class="parsed-conditions-item">${text}</div>`;
-    });
-    html += "</div>";
-  }
-  return html;
-};
-
-watch(
-  () => messageList.value,
-  () => {
-    scrollToBottom();
-  },
-  { deep: true },
-);
-watch(
-  () => feedbackDialogVisible.value,
-  (newValue) => {
-    if (!newValue) feedbackContent.value = "";
-  },
-);
-
-defineExpose({
-  open: () => {
-    visible.value = true;
-    nextTick(() => {
-      scrollToBottom();
-    });
-  },
-});
-</script>
-
-<template>
-  <el-dialog
-    class="ai-dialog"
-    v-model="visible"
-    title="✨ 品种池参数解析AI助手"
-    width="500px"
-    center
-    draggable
-    overflow
-    :modal="false"
-    :modal-penetrable="true"
-  >
-    <div class="ai-dialog-body">
-      <!-- 对话展示 -->
-      <div
-        ref="messageListRef"
-        class="message-list"
-      >
-        <div
-          v-for="(message, index) in messageList"
-          :key="index"
-          :class="message.role"
-          class="message-item"
-        >
-          <template v-if="message.content || (index === messageList.length - 1 && message.role === 'assistant' && nodeProgressList.length > 0)">
-            <!-- 头像 -->
-            <div class="avatar">
-              <el-avatar
-                :size="32"
-                :icon="message.role === 'user' ? UserFilled : Service"
-              />
-            </div>
-            <!-- 响应 -->
-            <div class="message-content">
-              <div
-                v-if="message.fullQuery"
-                style="font-weight: bold; margin-bottom: 10px"
-              >
-                筛选结果: {{ message.fullQuery }}
-              </div>
-              <!-- 节点展示 -->
-              <div
-                v-if="index === messageList.length - 1 && message.role === 'assistant' && nodeProgressList.length > 0 && !showFinalResult"
-                class="node-progress"
-              >
-                <div
-                  v-for="node in nodeProgressList"
-                  :key="node.name"
-                  class="node-progress-item"
-                >
-                  <span class="node-status-icon">
-                    <el-icon
-                      v-if="node.status === 'success'"
-                      class="node-icon done"
-                      ><SuccessFilled
-                    /></el-icon>
-                    <el-icon
-                      v-else
-                      class="node-icon running"
-                      ><Refresh
-                    /></el-icon>
-                  </span>
-                  <span class="node-name">{{ node.name }}</span>
-                </div>
-
-                <div class="progress-footer">
-                  <el-progress
-                    :percentage="progressPercent"
-                    :show-text="false"
-                    :stroke-width="4"
-                    color="#667eea"
-                  />
-                  <span class="progress-text">第 {{ completedCount }}/{{ totalCount }} 步 · {{ currentStepName }}</span>
-                </div>
-              </div>
-              <!-- 成功结果展示 -->
-              <div
-                v-if="isJSONSerializable(message.content)"
-                class="message-content-json"
-                :class="{ 'result-animation': index === messageList.length - 1 && showFinalResult }"
-                v-html="renderJSONContent(message.content)"
-              />
-              <!-- 失败结果展示 -->
-              <div
-                v-else-if="message.content"
-                class="message-content-text"
-                :class="{ 'result-animation': index === messageList.length - 1 && showFinalResult }"
-              >
-                {{ message.content }}
-              </div>
-
-              <!-- 消息底部按钮 -->
-              <div
-                v-if="message.role === 'assistant'"
-                class="message-content-footer"
-              >
-                <!-- 反馈按钮 -->
-                <div
-                  v-if="message.showFeedback"
-                  class="feedback-box"
-                >
-                  <el-tooltip
-                    content="满意"
-                    placement="bottom"
-                  >
-                    <img
-                      src="./images/like.png"
-                      alt="满意"
-                      @click="handleFeedbackAction('satisfied', index)"
-                    />
-                  </el-tooltip>
-                  <el-tooltip
-                    content="满意"
-                    placement="bottom"
-                  >
-                    <img
-                      src="./images/like_no.png"
-                      alt="不满意"
-                      @click="handleFeedbackAction('open', index)"
-                    />
-                  </el-tooltip>
-                </div>
-                <!-- 确认查询 -->
-                <el-button
-                  v-if="isJSONSerializable(message.content)"
-                  class="confirm-btn"
-                  @click="lookResult(message.content)"
-                >
-                  确认查询
-                </el-button>
-              </div>
-            </div>
-          </template>
-        </div>
-      </div>
-      <!-- 用户输入 -->
-      <div class="input-area">
-        <el-input
-          class="message-input"
-          v-model="userInput"
-          type="textarea"
-          :rows="4"
-          :autosize="{ minRows: 2, maxRows: 4 }"
-          placeholder="输入您想查询的品种条件..."
-          @keydown="handleKeydown"
-        />
-        <div class="input-actions">
-          <div class="input-hint">
-            <span>Enter 发送 | Ctrl + Enter 换行</span>
-          </div>
-          <el-button
-            class="send-btn"
-            type="primary"
-            :icon="Promotion"
-            :loading="isSending"
-            @click="sendMessage"
-            round
-          >
-            发送
-          </el-button>
-        </div>
-      </div>
-    </div>
-  </el-dialog>
-
-  <!-- 窗口: 反馈意见 -->
-  <el-dialog
-    v-model="feedbackDialogVisible"
-    title="📝 反馈意见"
-    width="400px"
-  >
-    <div class="feedback-dialog-content">
-      <div class="feedback-emoji">😟</div>
-      <p class="feedback-tip">很抱歉没能帮到您，请告诉我们哪里需要改进：</p>
-      <el-input
-        v-model="feedbackContent"
-        type="textarea"
-        :rows="4"
-        placeholder="[非必填]例如：回答不够准确、查询结果有误、界面体验不佳..."
-      />
-    </div>
-    <template #footer>
-      <span class="dialog-footer">
-        <el-button @click="feedbackDialogVisible = false">取消</el-button>
-        <el-button
-          type="primary"
-          @click="handleFeedbackAction('unsatisfied', feedbackMessageIndex)"
-          >提交反馈</el-button
-        >
-      </span>
-    </template>
-  </el-dialog>
-</template>
-
-<style lang="scss" scoped>
-.ai-dialog {
-  .ai-dialog-body {
-    display: flex;
-    flex-direction: column;
-    height: 480px;
-    background: transparent;
-    // 对话展示
-    .message-list {
-      flex: 1;
-      overflow-y: auto;
-      padding: 20px 24px;
-      &::-webkit-scrollbar {
-        width: 6px;
-      }
-      &::-webkit-scrollbar-track {
-        background: rgba(0, 0, 0, 0.05);
-        border-radius: 3px;
-      }
-      &::-webkit-scrollbar-thumb {
-        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-        border-radius: 3px;
-        &:hover {
-          background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
-        }
-      }
-      .message-item {
-        display: flex;
-        margin-bottom: 20px;
-        .avatar {
-          flex-shrink: 0;
-          :deep(.el-avatar) {
-            background: linear-gradient(135deg, #f0f2ff 0%, #e8ecff 100%);
-            color: #667eea;
-            svg {
-              width: 18px;
-              height: 18px;
-            }
-          }
-        }
-        .message-content {
-          width: calc(100% - 88px);
-          display: flex;
-          flex-direction: column;
-        }
-      }
-      // 智能体
-      .defaultMessage,
-      .assistant {
-        .avatar {
-          margin-right: 12px;
-        }
-        .message-content {
-          align-items: flex-start;
-          .node-progress {
-            background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);
-            border: 1px solid rgba(102, 126, 234, 0.15);
-            border-radius: 16px;
-            padding: 12px 16px;
-            margin-bottom: 8px;
-            min-width: 200px;
-            animation: breathe 2s ease-in-out infinite;
-
-            .node-progress-item {
-              display: flex;
-              align-items: center;
-              gap: 10px;
-              padding: 6px 0;
-              position: relative;
-              animation: slideIn 0.3s ease-out;
-
-              &:not(:last-child)::after {
-                content: "";
-                position: absolute;
-                left: 9px;
-                top: 28px;
-                width: 2px;
-                height: calc(100% - 8px);
-                background: linear-gradient(to bottom, #c7d2fe, transparent);
-              }
-
-              .node-status-icon {
-                position: relative;
-                z-index: 1;
-                border-radius: 50%;
-                width: 20px;
-                height: 20px;
-                display: inline-flex;
-                align-items: center;
-                justify-content: center;
-                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
-              }
-
-              .node-icon {
-                font-size: 12px;
-                &.done {
-                  color: #22c55e;
-                }
-                &.running {
-                  color: #667eea;
-                  animation: spin 0.6s linear infinite;
-                }
-                &.waiting {
-                  color: #d1d5db;
-                  animation: spin 0.8s linear infinite;
-                }
-              }
-
-              .node-name {
-                font-size: 13px;
-                color: #6b7280;
-                line-height: 20px;
-              }
-
-              &:has(.running) .node-name {
-                font-weight: 500;
-                color: #667eea;
-              }
-            }
-
-            .progress-footer {
-              margin-top: 12px;
-              padding-top: 8px;
-              border-top: 1px solid rgba(102, 126, 234, 0.1);
-
-              :deep(.el-progress) {
-                margin-bottom: 6px;
-              }
-
-              .progress-text {
-                font-size: 11px;
-                color: #9ca3af;
-                display: block;
-                text-align: center;
-              }
-            }
-          }
-          .message-content-json {
-            width: 100%;
-            overflow: hidden;
-            :deep(.parsed-conditions) {
-              margin: 0;
-              padding: 0;
-              .parsed-conditions-item {
-                text-align: center;
-                color: #f56c6c;
-                margin-bottom: 8px;
-                padding: 8px 12px;
-                background: linear-gradient(135deg, #ffebeb 0%, #ffe0e0 100%);
-                border-radius: 12px;
-                font-weight: 500;
-                transition: all 0.2s ease;
-                &:last-child {
-                  margin-bottom: 0;
-                }
-              }
-            }
-          }
-          .message-content-footer {
-            width: 100%;
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            .feedback-box {
-              display: flex;
-              align-items: center;
-              margin-top: 10px;
-              img {
-                cursor: pointer;
-                width: 26px;
-                height: 26px;
-                margin-right: 10px;
-                &:hover {
-                  transition: 0.2s;
-                  transform: scale(1.1);
-                }
-              }
-            }
-            .confirm-btn {
-              margin-left: auto;
-              margin-top: 8px;
-              padding: 6px 20px;
-              font-size: 13px;
-              border-radius: 20px;
-              background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);
-              color: #667eea;
-              border: 1px solid rgba(102, 126, 234, 0.15);
-              cursor: pointer;
-              transition: all 0.2s ease;
-              font-weight: 500;
-
-              &:hover {
-                background: linear-gradient(135deg, #f0f2ff 0%, #e8ecff 100%);
-                border-color: rgba(102, 126, 234, 0.3);
-                transform: translateY(-1px);
-                box-shadow: 0 2px 8px rgba(102, 126, 234, 0.1);
-              }
-            }
-          }
-          .result-animation {
-            animation: resultAppear 0.5s cubic-bezier(0.2, 0.9, 0.4, 1.1);
-          }
-        }
-      }
-      // 用户
-      .user {
-        flex-direction: row-reverse;
-        .avatar {
-          margin-left: 12px;
-          margin-right: 0;
-        }
-        .message-content {
-          align-items: flex-end;
-          .message-content-text {
-            color: white;
-            border-radius: 18px 18px 4px 18px;
-            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-          }
-        }
-      }
-      .message-content-json,
-      .message-content-text {
-        box-sizing: border-box;
-        padding: 12px 16px;
-        font-size: 14px;
-        line-height: 1.6;
-        word-wrap: break-word;
-        white-space: pre-wrap;
-        border-radius: 18px 18px 18px 4px;
-        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-        border: 1px solid rgba(102, 126, 234, 0.2);
-        transition: all 0.3s ease;
-      }
-    }
-
-    // 用户输入
-    .input-area {
-      padding: 16px 24px 24px;
-      backdrop-filter: blur(10px);
-
-      .message-input {
-        :deep(.el-textarea__inner) {
-          border-radius: 16px;
-          border: 1px solid rgba(102, 126, 234, 0.2);
-          font-size: 14px;
-          padding: 12px 16px;
-          transition: all 0.3s ease;
-          &:focus {
-            border-color: #667eea;
-            box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-          }
-        }
-      }
-
-      .input-actions {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-top: 12px;
-
-        .input-hint {
-          font-size: 11px;
-          color: var(--el-color-info);
-        }
-
-        .send-btn {
-          background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-          border: none;
-          padding: 8px 20px;
-          font-weight: 500;
-          transition: all 0.3s ease;
-          &:hover {
-            transform: translateY(-2px);
-            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
-          }
-          &:active {
-            transform: translateY(0);
-          }
-        }
-      }
-    }
-  }
-}
-
-@keyframes slideIn {
-  from {
-    opacity: 0;
-    transform: translateX(-8px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes breathe {
-  0%,
-  100% {
-    border-color: rgba(102, 126, 234, 0.15);
-    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.05);
-  }
-  50% {
-    border-color: rgba(102, 126, 234, 0.35);
-    box-shadow: 0 4px 16px rgba(102, 126, 234, 0.12);
-  }
-}
-
-@keyframes resultAppear {
-  0% {
-    opacity: 0;
-    transform: scale(0.95);
-  }
-  100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-.feedback-dialog-content {
-  text-align: center;
-  padding: 12px 0;
-
-  .feedback-emoji {
-    font-size: 48px;
-    margin-bottom: 16px;
-    animation: shake 0.5s ease-in-out;
-  }
-  .feedback-tip {
-    font-size: 14px;
-    color: #666;
-    margin-bottom: 20px;
-    line-height: 1.6;
-  }
-
-  :deep(.el-textarea__inner) {
-    border-radius: 12px;
-    border: 1px solid rgba(102, 126, 234, 0.2);
-    font-size: 14px;
-    &:focus {
-      border-color: #667eea;
-      box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-    }
-  }
-}
-
-@keyframes shake {
-  0%,
-  100% {
-    transform: translateX(0);
-  }
-  25% {
-    transform: translateX(-5px);
-  }
-  75% {
-    transform: translateX(5px);
-  }
-}
-</style>