xinyin025/geekai
1
0
Fork 0
mirror of https://github.com/yangjian102621/geekai.git synced 2025-11-12 20:23:46 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Optimize the UI of config dialoy

Browse Source
This commit is contained in:
RockYang
2023-04-12 09:02:39 +08:00
parent aef3414928
commit a88f55372c
4 changed files with 50 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
web/src/views/Chat.vue
View File

@@ -21,7 +21,7 @@
</el-icon>
</el-button>
<el-button type="info" size="small" class="config" ref="send-btn" circle @click="showConnectDialog = true">
<el-button type="info" size="small" class="config" ref="send-btn" circle @click="configDialog">
<el-icon>
<Tools/>
</el-icon>
@@ -65,7 +65,7 @@
</div><!-- end container -->
<config-dialog v-model:show="showConnectDialog"></config-dialog>
<config-dialog v-model:show="showConfigDialog" :user="userInfo"></config-dialog>
<div class="token-dialog">
<el-dialog
@@ -107,7 +107,7 @@ import {ElMessage, ElMessageBox} from 'element-plus'
import {Tools, Lock, Delete} from '@element-plus/icons-vue'
import ConfigDialog from '@/components/ConfigDialog.vue'
import {httpPost, httpGet} from "@/utils/http";
import {getSessionId, setLoginUser} from "@/utils/storage";
import {getSessionId, getUserInfo, setLoginUser} from "@/utils/storage";
import hl from 'highlight.js'
import 'highlight.js/styles/a11y-dark.css'
@@ -123,8 +123,11 @@ export default defineComponent({
role: 'gpt',
inputValue: '', // 聊天内容
chatBoxHeight: 0, // 聊天内容框高度
showConnectDialog: false,
showConfigDialog: false,
userInfo: {},
showLoginDialog: false,
token: '', // 会话 token
replyIcon: 'images/avatar/gpt.png', // 回复信息的头像
@@ -159,6 +162,10 @@ export default defineComponent({
},
methods: {
configDialog: function () {
this.showConfigDialog = true;
this.userInfo = getUserInfo();
},
// 创建 socket 会话连接
connect: function () {
// 初始化 WebSocket 对象
@@ -240,26 +247,6 @@ export default defineComponent({
httpGet("/api/session/get").then(() => {
// 自动重新连接
this.connect();
// if (this.connectingMessageBox === null) {
// this.connectingMessageBox = ElMessageBox.confirm(
// '^_^ 会话发生异常，您已经从服务器断开连接!',
// '注意：',
// {
// confirmButtonText: '重连会话',
// cancelButtonText: '不聊了',
// type: 'warning',
// showClose: false,
// closeOnClickModal: false
// }
// ).then(() => {
// this.connect();
// }).catch(() => {
// ElMessage({
// type: 'info',
// message: '您关闭了会话',
// })
// })
// }
}).catch((res) => {
if (res.code === 400) {
this.showLoginDialog = true;

16
web/src/views/ChatPlus.vue
View File

@@ -19,7 +19,7 @@
</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="showConnectDialog = true">
<el-dropdown-item @click="configDialog()">
<el-icon>
<Tools/>
</el-icon>
@@ -135,7 +135,7 @@
</div>
</el-row>
<config-dialog v-model:show="showConnectDialog"></config-dialog>
<config-dialog v-model:show="showConfigDialog" :user="userInfo"></config-dialog>
<div class="token-dialog">
<el-dialog
@@ -189,7 +189,7 @@ import {
} from '@element-plus/icons-vue'
import ConfigDialog from '@/components/ConfigDialog.vue'
import {httpPost, httpGet} from "@/utils/http";
import {getSessionId, setLoginUser} from "@/utils/storage";
import {getSessionId, getUserInfo, setLoginUser} from "@/utils/storage";
import hl from 'highlight.js'
import 'highlight.js/styles/a11y-dark.css'
@@ -218,7 +218,10 @@ export default defineComponent({
allChatRoles: [], // 所有角色集合
role: 'gpt',
inputValue: '', // 聊天内容
showConnectDialog: false,
showConfigDialog: false, // 显示配置对话框
userInfo: {},
showLoginDialog: false,
token: '', // 会话 token
replyIcon: 'images/avatar/gpt.png', // 回复信息的头像
@@ -258,6 +261,11 @@ export default defineComponent({
},
methods: {
configDialog() {
this.showConfigDialog = true
this.userInfo = getUserInfo();
},
resizeElement: function () {
this.chatBoxHeight = window.innerHeight - 61 - 115 - 38;
this.mainWinHeight = window.innerHeight - 61;