修复 AI 助手页面 SCSS 语法错误

将 lang=\"scss\" 改为普通 CSS，
并将嵌套 SCSS 语法转换为标准 CSS 选择器。

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/views/ai-chat/index.vue

@@ -254,7 +254,7 @@ onMounted(() => {
 })
 </script>
 
-<style scoped lang="scss">
+<style scoped>
 .ai-chat-container {
   display: flex;
   gap: 20px;
@@ -265,30 +265,30 @@ onMounted(() => {
   flex: 1;
   display: flex;
   flex-direction: column;
+}
 
-  :deep(.el-card__body) {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    padding: 0;
-  }
+.chat-card :deep(.el-card__body) {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 0;
 }
 
 .chat-header {
   display: flex;
   align-items: center;
   gap: 10px;
+}
 
-  .chat-icon {
-    font-size: 24px;
-    color: #409eff;
-  }
+.chat-icon {
+  font-size: 24px;
+  color: #409eff;
+}
 
-  .chat-title {
-    font-size: 18px;
-    font-weight: 600;
-    color: #303133;
-  }
+.chat-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
 }
 
 .chat-messages {
@@ -302,92 +302,84 @@ onMounted(() => {
   display: flex;
   gap: 12px;
   margin-bottom: 20px;
+}
 
-  .message-avatar {
-    flex-shrink: 0;
-  }
+.message-avatar {
+  flex-shrink: 0;
+}
 
-  .message-content {
-    flex: 1;
-    max-width: 70%;
+.message-content {
+  flex: 1;
+  max-width: 70%;
+}
 
-    .message-sender {
-      font-size: 13px;
-      color: #909399;
-      margin-bottom: 6px;
-    }
+.message-sender {
+  font-size: 13px;
+  color: #909399;
+  margin-bottom: 6px;
+}
 
-    .message-text {
-      padding: 12px 16px;
-      border-radius: 8px;
-      font-size: 14px;
-      line-height: 1.6;
-      word-wrap: break-word;
-    }
+.message-text {
+  padding: 12px 16px;
+  border-radius: 8px;
+  font-size: 14px;
+  line-height: 1.6;
+  word-wrap: break-word;
+}
 
-    .message-time {
-      font-size: 12px;
-      color: #c0c4cc;
-      margin-top: 6px;
-    }
-  }
+.message-time {
+  font-size: 12px;
+  color: #c0c4cc;
+  margin-top: 6px;
 }
 
 .user-message {
   flex-direction: row-reverse;
+}
 
-  .message-content {
-    .message-text {
-      background-color: #409eff;
-      color: #fff;
-      border-bottom-right-radius: 4px;
-    }
+.user-message .message-text {
+  background-color: #409eff;
+  color: #fff;
+  border-bottom-right-radius: 4px;
+}
 
-    .message-sender,
-    .message-time {
-      text-align: right;
-    }
-  }
+.user-message .message-sender,
+.user-message .message-time {
+  text-align: right;
 }
 
-.ai-message {
-  .message-content {
-    .message-text {
-      background-color: #fff;
-      color: #303133;
-      border: 1px solid #e4e7ed;
-      border-bottom-left-radius: 4px;
-    }
-  }
+.ai-message .message-text {
+  background-color: #fff;
+  color: #303133;
+  border: 1px solid #e4e7ed;
+  border-bottom-left-radius: 4px;
 }
 
-.typing-message {
-  .typing-indicator {
-    display: flex;
-    gap: 4px;
-    padding: 12px 16px;
-    background-color: #fff;
-    border: 1px solid #e4e7ed;
-    border-radius: 8px;
-    border-bottom-left-radius: 4px;
-    width: fit-content;
-
-    span {
-      width: 8px;
-      height: 8px;
-      background-color: #409eff;
-      border-radius: 50%;
-      animation: typing 1.4s infinite ease-in-out both;
-
-      &:nth-child(1) {
-        animation-delay: -0.32s;
-      }
-
-      &:nth-child(2) {
-        animation-delay: -0.16s;
-      }
-    }
-  }
+.typing-message .typing-indicator {
+  display: flex;
+  gap: 4px;
+  padding: 12px 16px;
+  background-color: #fff;
+  border: 1px solid #e4e7ed;
+  border-radius: 8px;
+  border-bottom-left-radius: 4px;
+  width: fit-content;
+}
+
+.typing-indicator span {
+  width: 8px;
+  height: 8px;
+  background-color: #409eff;
+  border-radius: 50%;
+  animation: typing 1.4s infinite ease-in-out both;
+}
+
+.typing-indicator span:nth-child(1) {
+  animation-delay: -0.32s;
+}
+
+.typing-indicator span:nth-child(2) {
+  animation-delay: -0.16s;
 }
 
 @keyframes typing {
@@ -414,29 +406,29 @@ onMounted(() => {
 .input-box {
   display: flex;
   gap: 12px;
+}
 
-  .el-textarea {
-    flex: 1;
-  }
+.input-box .el-textarea {
+  flex: 1;
+}
 
-  .input-actions {
-    display: flex;
-    align-items: flex-end;
+.input-actions {
+  display: flex;
+  align-items: flex-end;
+}
 
-    .el-button {
-      height: 100%;
-      min-height: 74px;
-    }
-  }
+.input-actions .el-button {
+  height: 100%;
+  min-height: 74px;
 }
 
 .quick-questions {
   width: 280px;
   flex-shrink: 0;
+}
 
-  :deep(.el-card__body) {
-    padding: 15px;
-  }
+.quick-questions :deep(.el-card__body) {
+  padding: 15px;
 }
 
 .question-tags {
@@ -450,11 +442,11 @@ onMounted(() => {
   padding: 10px 15px;
   font-size: 13px;
   transition: all 0.3s;
+}
 
-  &:hover {
-    background-color: #409eff;
-    color: #fff;
-    border-color: #409eff;
-  }
+.question-tag:hover {
+  background-color: #409eff;
+  color: #fff;
+  border-color: #409eff;
 }
 </style>