feat: 对接AI对话接口

src/views/home/agent/components/List.vue

@@ -1,20 +1,41 @@
 <template>
-	<div class="agent-list flex flex-col flex-1">
+	<div class="agent-list flex flex-col flex-1" ref="listContainer">
 		<Item v-for="message in messageList" :key="message.id" :content="message" />
 	</div>
 </template>
 
 <script setup lang="ts">
-	import { ref } from 'vue'
+	import { ref, nextTick, watch } from 'vue'
 	import Item from './Item.vue'
 
 	const props = defineProps<{
     messageList: Array<any>
   }>()
+
+	const listContainer = ref<HTMLDivElement>()
+
+	const scrollToBottom = () => {
+		nextTick(() => {
+			if (listContainer.value) {
+				listContainer.value.scrollTop = listContainer.value.scrollHeight
+			}
+		})
+	}
+
+	watch(() => props.messageList, () => {
+		scrollToBottom()
+	}, { deep: true })
+
+	defineExpose({ scrollToBottom })
 </script>
 
 <style lang="less" scoped>
 	.agent-list {
 		row-gap: 3.2rem;
+    overflow-y: auto;
+    // 隐藏滚动条
+    &::-webkit-scrollbar {
+      display: none;
+    }
 	}
 </style>