diff --git a/Yi.Bbs.Vue3/src/views/chathub/Index.vue b/Yi.Bbs.Vue3/src/views/chathub/Index.vue index 6d116aab..2518c295 100644 --- a/Yi.Bbs.Vue3/src/views/chathub/Index.vue +++ b/Yi.Bbs.Vue3/src/views/chathub/Index.vue @@ -43,15 +43,15 @@ const inputListDataStore = ref([ {key: "ai@gpt-4o-mini", name: "ChatGpt聊天", titleName: "ChatGpt-全能神！综合能力最强！", logo: "openAi.png", value: ""}, - {key: "ai@claude-3-7-sonnet-20250219", name: "Claude聊天", titleName: "Claude3.7 代码逻辑地表最强！", logo: "claudeAi.png", value: ""}, - {key: "ai@claude-3-7-sonnet-20250219-thinking", name: "Claude思索", titleName: "Claude3.7 思索模式，强中强！", logo: "claudeAi.png", value: ""}, + {key: "ai@claude-3-7-sonnet", name: "Claude聊天", titleName: "Claude3.7 代码逻辑地表最强！", logo: "claudeAi.png", value: ""}, + {key: "ai@claude-3.7-sonnet-thinking", name: "Claude思索", titleName: "Claude3.7 思索模式，强中强！", logo: "claudeAi.png", value: ""}, - {key: "ai@grok-2-latest", name: "Grok聊天", titleName: "Grok2 即将为3.0王的诞生献上礼炮", logo: "grokAi.png", value: ""}, + {key: "ai@grok-3", name: "Grok聊天", titleName: "Grok3 为3.0王的诞生献上礼炮", logo: "grokAi.png", value: ""}, - {key: "ai@Qwen/QVQ-72B-Preview", name: "QWen聊天", titleName: "国产阿里千问通义72B", logo: "qwenAi.png", value: ""}, + {key: "ai@Qwen/QwQ-32B-Preview", name: "QWen聊天", titleName: "国产阿里千问通义", logo: "qwenAi.png", value: ""}, {key: "ai@DeepSeek-V3", name: "DeepSeek聊天", titleName: "满血DeepSeek-聊天模式，开源模型第一", logo: "deepSeekAi.png", value: ""}, - {key: "ai@deepseek-r1-250120", name: "DeepSeek思索", titleName: "满血DeepSeek-思索模式", logo: "deepSeekAi.png", value: ""} + {key: "ai@DeepSeek-R1", name: "DeepSeek思索", titleName: "满血DeepSeek-思索模式", logo: "deepSeekAi.png", value: ""} ]); //AI聊天临时存储 const sendAiChatContext = ref([]); @@ -59,6 +59,14 @@ var timer = null; let codeCopyDic = []; +// 添加可调整大小的变量 +const middleWidth = ref(380); +const contentHeight = ref(535); +const isDraggingVertical = ref(false); +const isDraggingHorizontal = ref(false); +const startX = ref(0); +const startY = ref(0); + //初始化 onMounted(async () => { if (!isLogin.value) { @@ -94,7 +102,12 @@ onMounted(async () => { //在线用户列表 chatStore.setUserList((await getChatUserList()).data); startCountTip(); + + // 添加全局鼠标事件监听 + document.addEventListener('mousemove', handleMouseMove); + document.addEventListener('mouseup', handleMouseUp); }) + onUnmounted(() => { if (timer != null) { clearInterval(timer) @@ -102,8 +115,57 @@ onUnmounted(() => { if (timerTip != null) { clearInterval(timerTip) } + + // 移除全局鼠标事件监听 + document.removeEventListener('mousemove', handleMouseMove); + document.removeEventListener('mouseup', handleMouseUp); }) +// 开始垂直拖拽（左右分割线） +const startDragVertical = (e) => { + isDraggingVertical.value = true; + startX.value = e.clientX; + e.preventDefault(); +}; + +// 开始水平拖拽（上下分割线） +const startDragHorizontal = (e) => { + isDraggingHorizontal.value = true; + startY.value = e.clientY; + e.preventDefault(); +}; + +// 处理鼠标移动事件 +const handleMouseMove = (e) => { + if (isDraggingVertical.value) { + const deltaX = e.clientX - startX.value; + const newWidth = middleWidth.value + deltaX; + + // 限制最小宽度和最大宽度 + if (newWidth >= 250 && newWidth <= 500) { + middleWidth.value = newWidth; + startX.value = e.clientX; + } + } + + if (isDraggingHorizontal.value) { + const deltaY = e.clientY - startY.value; + const newHeight = contentHeight.value + deltaY; + + // 限制最小高度和最大高度 + if (newHeight >= 300 && newHeight <= 600) { + contentHeight.value = newHeight; + startY.value = e.clientY; + } + } +}; + +// 处理鼠标松开事件 +const handleMouseUp = () => { + isDraggingVertical.value = false; + isDraggingHorizontal.value = false; +}; + /*-----计算属性-----*/ //当前聊天框内容显示的消息 const currentMsgContext = computed(() => { @@ -368,7 +430,7 @@ const toMarkDownHtml = (text) => { const codeHandler = (code, language) => { const codeIndex = parseInt(Date.now() + "") + Math.floor(Math.random() * 10000000); //console.log(codeIndex,"codeIndex"); - // 格式化第一行是右侧language和 “复制” 按钮； + // 格式化第一行是右侧language和 "复制" 按钮； if (code) { const navCode = navHandler(code) try { @@ -442,9 +504,9 @@ const clickCopyEvent = async function (event) {