新增前后端AI聊天模块，包括流式对话、配置管理和UI组件优化。

frontend/src/components/ui/BaseButton.vue

@@ -0,0 +1,116 @@
+<script setup lang="ts">
+defineProps<{
+  variant?: 'primary' | 'secondary' | 'danger' | 'ghost'
+  loading?: boolean
+  disabled?: boolean
+}>()
+</script>
+
+<template>
+  <button
+    class="btn"
+    :class="[`btn--${variant ?? 'secondary'}`, { 'btn--loading': loading }]"
+    :disabled="disabled || loading"
+  >
+    <span v-if="loading" class="btn-spinner" />
+    <span class="btn-content" :class="{ 'btn-content--hidden': loading }">
+      <slot />
+    </span>
+  </button>
+</template>
+
+<style scoped>
+.btn {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-sm);
+  padding: 0.6rem 1.4rem;
+  font-family: var(--font-display);
+  font-size: 0.95rem;
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  border-radius: var(--radius-sm);
+  transition:
+    background var(--duration-fast) ease,
+    box-shadow var(--duration-normal) ease,
+    transform var(--duration-fast) ease;
+  cursor: pointer;
+  white-space: nowrap;
+}
+
+.btn:active:not(:disabled) {
+  transform: scale(0.97);
+}
+
+.btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* Primary - 朱砂红 */
+.btn--primary {
+  background: var(--vermilion);
+  color: #fff;
+  box-shadow: 0 2px 8px rgba(199, 62, 29, 0.2);
+}
+
+.btn--primary:hover:not(:disabled) {
+  background: var(--vermilion-light);
+  box-shadow: 0 4px 16px rgba(199, 62, 29, 0.3);
+}
+
+/* Secondary */
+.btn--secondary {
+  background: transparent;
+  color: var(--ink-700);
+  border: 1px solid var(--paper-300);
+}
+
+.btn--secondary:hover:not(:disabled) {
+  background: var(--paper-100);
+  border-color: var(--ink-300);
+}
+
+/* Danger */
+.btn--danger {
+  background: transparent;
+  color: var(--danger);
+  border: 1px solid var(--danger);
+}
+
+.btn--danger:hover:not(:disabled) {
+  background: var(--danger-ghost);
+}
+
+/* Ghost */
+.btn--ghost {
+  background: transparent;
+  color: var(--ink-500);
+}
+
+.btn--ghost:hover:not(:disabled) {
+  color: var(--ink-900);
+  background: var(--paper-100);
+}
+
+/* Loading */
+.btn-spinner {
+  position: absolute;
+  width: 18px;
+  height: 18px;
+  border: 2px solid currentColor;
+  border-right-color: transparent;
+  border-radius: 50%;
+  animation: spin 0.6s linear infinite;
+}
+
+.btn-content--hidden {
+  visibility: hidden;
+}
+
+@keyframes spin {
+  to { transform: rotate(360deg); }
+}
+</style>