Add Vue user H5 client

ai_knowledge_base_v2/apps/user-client/src/components/SessionDrawer.vue

@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import type { ChatSession } from "../types/api";
+
+defineProps<{
+  open: boolean;
+  sessions: ChatSession[];
+  activeSessionId: number | null;
+}>();
+
+const emit = defineEmits<{
+  close: [];
+  select: [sessionId: number];
+  create: [];
+  delete: [sessionId: number];
+}>();
+</script>
+
+<template>
+  <div class="drawer-mask" :class="{ show: open }" @click="emit('close')"></div>
+  <aside class="session-drawer" :class="{ open }">
+    <div class="drawer-head">
+      <strong>历史会话</strong>
+      <button type="button" class="icon-btn" @click="emit('close')">×</button>
+    </div>
+    <button type="button" class="new-session-btn" @click="emit('create')">＋ 新聊天</button>
+    <div class="session-list">
+      <button
+        v-for="session in sessions"
+        :key="session.id"
+        type="button"
+        class="session-item"
+        :class="{ active: session.id === activeSessionId }"
+        @click="emit('select', session.id)"
+      >
+        <span>{{ session.title }}</span>
+        <small>{{ session.messageCount }} 条消息</small>
+      </button>
+    </div>
+  </aside>
+</template>