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

put model and app selector on the top of chat page

Browse Source
This commit is contained in:
RockYang
2024-05-24 12:33:22 +08:00
parent 2f9b1b7835
commit e18e5a38c6
3 changed files with 66 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -4,6 +4,7 @@
* 功能优化：聊天输入框会随着输入内容的增多自动调整高度
* Bug修复：修复移动端聊天页面模型切换不生效的Bug
* 功能优化：给PC端扫码支付增加签名验证和有效期验证
* Bug修复：修复支付码生成API权限控制的问题
## v4.0.7

28
web/src/assets/css/chat-plus.styl
View File

@@ -135,6 +135,34 @@ $borderColor = #4676d0;
background-color: var(--el-bg-color)
color var(--el-text-color-primary)
.chat-config {
height 30px
padding 10px 30px
display flex
justify-content center
justify-items center
border-bottom 1px solid #d9d9e3
.role-select-label {
color #ffffff
}
.el-select {
max-width 150px;
margin-right 10px;
}
.role-select {
max-width 130px;
}
.el-button {
.el-icon {
margin-right 5px;
}
}
}
#container {
overflow: hidden;
width: 100%;

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

@@ -66,6 +66,41 @@
</el-aside>
<el-main v-loading="loading" element-loading-background="rgba(122, 122, 122, 0.3)">
<div class="chat-container">
<div class="chat-config">
<el-select v-model="roleId" filterable placeholder="角色" @change="_newChat"
class="role-select"
style="width:150px">
<el-option
v-for="item in roles"
:key="item.id"
:label="item.name"
:value="item.id"
>
<div class="role-option">
<el-image :src="item.icon"></el-image>
<span>{{ item.name }}</span>
</div>
</el-option>
</el-select>
<el-select v-model="modelID" filterable placeholder="模型" @change="_newChat"
:disabled="disableModel"
style="width:150px">
<el-option
v-for="item in models"
:key="item.id"
:label="item.name"
:value="item.id"
>
<span>{{ item.name }}</span>
<el-tag style="margin-left: 5px; position: relative; top:-2px" type="info" size="small">{{
item.power
}}算力
</el-tag>
</el-option>
</el-select>
</div>
<div>
<div id="container" :style="{height: mainWinHeight+'px'}">
<div class="chat-box" id="chat-box" :style="{height: chatBoxHeight+'px'}">
@@ -86,59 +121,6 @@
<div class="input-box">
<div class="input-box-inner">
<span class="tool-item">
<el-popover
:width="300"
trigger="click"
placement="top-start"
>
<template #reference>
<div>
<el-tooltip effect="dark" content="模型选择">
<i class="iconfont icon-model"></i>
</el-tooltip>
</div>
</template>
<template #default>
<div class="chat-config">
<el-select v-model="roleId" filterable placeholder="角色" @change="_newChat"
class="role-select"
style="width:150px">
<el-option
v-for="item in roles"
:key="item.id"
:label="item.name"
:value="item.id"
>
<div class="role-option">
<el-image :src="item.icon"></el-image>
<span>{{ item.name }}</span>
</div>
</el-option>
</el-select>
<el-select v-model="modelID" filterable placeholder="模型" @change="_newChat"
:disabled="disableModel"
style="width:150px">
<el-option
v-for="item in models"
:key="item.id"
:label="item.name"
:value="item.id"
>
<span>{{ item.name }}</span>
<el-tag style="margin-left: 5px; position: relative; top:-2px" type="info" size="small">{{
item.power
}}算力
</el-tag>
</el-option>
</el-select>
</div>
</template>
</el-popover>
</span>
<span class="tool-item" @click="ElMessage.info('暂时不支持语音输入')">
<el-tooltip class="box-item" effect="dark" content="语音输入">
<i class="iconfont icon-mic-bold"></i>
@@ -376,8 +358,8 @@ const getRoleById = function (rid) {
}
const resizeElement = function () {
chatBoxHeight.value = window.innerHeight - 50 - 82 - 38;
mainWinHeight.value = window.innerHeight - 50;
chatBoxHeight.value = window.innerHeight - 101 - 82 - 38;
mainWinHeight.value = window.innerHeight - 101;
leftBoxHeight.value = window.innerHeight - 90 - 45 - 82;
};
@@ -944,29 +926,4 @@ const insertURL = (url) => {
}
}
}
.chat-config {
display flex
flex-direction row
padding-top 10px;
.role-select-label {
color #ffffff
}
.el-select {
max-width 150px;
margin-right 10px;
}
.role-select {
max-width 130px;
}
.el-button {
.el-icon {
margin-right 5px;
}
}
}
</style>