Electron35-DeepSeek桌面端AI系统|vue3.5+electron+arco客户端ai模板

# 项目名称
VITE_APPNAME = 'Electron35-DeepSeek'

# 运行端口
VITE_PORT = 3003

# 是否加载调试工具devtools
VITE_DEVTOOLS = true

# 是否打开调试工具devtools
VITE_OPEN_DEVTOOLS = true

# 是否删除生产环境console
VITE_DROP_CONSOLE = true

# DeepSeek API配置
VITE_DEEPSEEK_API_KEY = 替换为你的 API Key
VITE_DEEPSEEK_BASE_URL = https://api.deepseek.com

import { createApp } from 'vue'import'./style.scss'import App from './App.vue'import { launchApp } from '@/windows/actions'//引入路由/状态配置import Router from './router'import Pinia from './pinia'//引入插件配置import Plugins from './plugins'launchApp().then(config=>{if(config) {//全局存储窗口配置 window.config = config } //初始化app实例 createApp(App) .use(Router) .use(Pinia) .use(Plugins) .mount('#app')})

<scriptsetup> import Titlebar from '@/layouts/components/titlebar/index.vue' import Sidebar from '@/layouts/components/sidebar/index.vue'</script><template><divclass="vu__container"><divclass="vu__layout flexbox flex-col"><!--导航栏--><Titlebar/><divclass="vu__layout-body flex1 flexbox"><!--侧边--><Sidebar/><!--对话区--><divclass="vu__layout-main flex1"><router-viewv-slot="{ Component, route }"><keep-alive><component:is="Component":key="route.path"/></keep-alive></router-view></div></div></div></div></template>

import { createRouter, createWebHashHistory } from 'vue-router'import { authState } from '@/pinia/modules/auth'import Layout from '@/layouts/index.vue'import { loginWindow } from '@/windows/actions'//批量导入路由const modules = import.meta.glob('./modules/*.js', { eager: true })const patchRouters = Object.keys(modules).map(key =>modules[key].default).flat()/** * meta配置 * @param meta.requireAuth 需登录验证页面 */const routes = [ ...patchRouters, //错误模块 { path: '/:pathMatch(.*)*', redirect: '/404', component: Layout, meta: { title: '404 error', }, children: [ { path: '404', component: () =>import('@/views/error/404.vue'), } ] },]const router = createRouter({ history: createWebHashHistory(), routes,})//全局路由钩子拦截router.beforeEach((to, from) => { const authstate =authState()//登录验证if(to?.meta?.requireAuth && !authstate.authorization) { //console.log('你还未登录!') loginWindow() }})router.afterEach(() =>{//...})router.onError(error=> { console.warn('[Router Error]', error)})export defaultrouter

<template><divclass="v3ai__footbar flexbox flex-col"><!--技能栏--><divv-if="skillbar"class="v3ai__skills flexbox flex-alignc">...</div><!--编辑栏--><divclass="v3ai__inputbox flexbox flex-col"><divclass="v3ai__editor flexbox">...</div><!--操作栏--><divclass="v3ai__tools flexbox flex-alignc"><divclass="option flex1 flexbox"><divclass="btn":class="{'active': isDeep}"@click="isDeep =! isDeep"><iclass="iconfont ai-deepthink"></i>深度思考<spanclass="fs-12">(R1)</span></div><divclass="btn":class="{'active': isNetwork}"@click="isNetwork =! isNetwork"><iclass="iconfont ai-network"></i>联网</div></div><a-dropdowntrigger="hover":show-arrow="false"position="lb":content-style="{'min-width': '250px'}"><a-buttonshape="circle"><icon-attachmentsize="18"/></a-button><template#content><a-dgroup><template#title><divstyle="margin-bottom: 5px;">从网盘添加</div></template><a-doptionvalue="wx"><icon-more/>选择网盘文件</a-doption></a-dgroup><a-dgroup><template#title><divstyle="margin-bottom: 5px;">从本地添加</div></template><a-doptionvalue="wx"><icon-apps/>上传文件</a-doption><a-dsubmenutrigger="hover"position="rb":popup-translate="[8, 8]"value="option-1":content-style="{'min-width': '125px'}"><template#default><icon-apps/>上传代码</template><template#content><a-doptionvalue="pyq"><icon-apps/>代码文件</a-doption><a-doptionvalue="qq"><icon-apps/>代码文件夹</a-doption><a-doptionvalue="qq"><icon-apps/>GitHub仓库</a-doption></template></a-dsubmenu></a-dgroup></template></a-dropdown><a-tooltipcontent="截图提问"position="top"mini><a-buttonshape="circle"><icon-scissorsize="18"@click="handleCut"/></a-button></a-tooltip><a-dropdown:show-arrow="false"position="top":popup-translate="[-10, -5]":content-style="{'min-width': '160px'}"><a-buttonshape="circle"><icon-plussize="18"/></a-button><template#content><a-doptionvalue="image"><icon-file-image/>图片</a-doption><a-doptionvalue="file"><icon-file/>本地文件</a-doption><a-doptionvalue="pdf"><icon-file-pdf/>PDF文档分析</a-doption><a-doptionvalue="page"><icon-cloud/>网页总结</a-doption></template></a-dropdown><a-dividerdirection="vertical"style="margin: 0 7px;"/><a-buttonclass="submit"type="primary"shape="circle":disabled="!editorText?.trim() || sessionstate.loading"@click="handleSubmit"><icon-arrow-upv-if="!sessionstate.loading"size="20"/><icon-loadingv-else size="18"/></a-button></div></div></div></template>

const completion = await openai.chat.completions.create({ //单一会话 messages: [ {role: 'user', content: editorValue} ], //多轮会话// messages: props.multiConversation ? historySession.value : [{role: 'user', content: editorValue}], model: 'deepseek-chat', stream: false,//非流式输出 max_tokens: 8192, // 限制一次请求中模型生成 completion 的最大 token 数(默认使用 4096) temperature: 0.4, // 严谨采样 越低越严谨(默认1)})//一次性返回非流式内容console.log(completion.choices[0].message.content)

//使用数组存储chunk内容，提高拼接效率let chunks = []let lastUpdate = 0//处理流式输出for await (const chunk of completion) { const content = chunk.choices[0]?.delta?.content || '' if(content) { chunks.push(content) //限制更新频率：每100ms最多更新一次 const now =Date.now()if (now - lastUpdate >100) { sessionstate.updateSession(botKey, {content: chunks.join('')}) lastUpdate =now//滚动最底部if (sessionstate.reachBottom) { props.scrollBottom() } } } if(chunk.choices[0]?.finish_reason === 'stop') { sessionstate.loading =false//确保最终内容完整更新 sessionstate.updateSession(botKey, {content: chunks.join(''), loading: false})if (sessionstate.reachBottom) { props.scrollBottom() } }}