Skip to content

Commit ba4e55d

Browse files
wangdan-fit2cloudwangdan-fit2cloud
authored
perf: refine user input style
1 parent 3594fda commit ba4e55d

File tree

12 files changed

+97
-73
lines changed

12 files changed

+97
-73
lines changed

‎ui/src/assets/fx/bochaai/detail.md‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,14 @@
22

33
博查工具是一个支持自然语言搜索的 Web Search API，从近百亿网页和生态内容源中搜索高质量世界知识，包括新闻、图片、视频、百科、机酒、学术等.
44

5-
65
## 配置
76

87
1. 获取API Key 
9-
在[博查开放平台](https://open.bochaai.com/overview) 上申请 API 密钥。
10-
![API Key](/src/assets/fx/img/bocha_APIKey.jpg)
8+
在[博查开放平台](https://open.bochaai.com/overview) 上申请 API 密钥。
9+
![API Key](/src/assets/fx/img/bocha_APIKey.jpg)
1110
1. 在函数库中配置
12-
在函数库的博查函数面板中，点击 … > 启用参数，填写 API 密钥，并启用博查函数。
13-
![启动参数](/src/assets/fx/img/bocha_setting.jpg)
11+
在函数库的博查函数面板中，点击 … > 启用参数，填写 API 密钥，并启用博查函数。
12+
![启动参数](/src/assets/fx/img/bocha_setting.jpg)
1413
1. 在应用中使用
15-
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
16-
![应用中使用](/src/assets/fx/img/bocha_app_used.jpg)
14+
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
15+
![应用中使用](/src/assets/fx/img/bocha_app_used.jpg)

‎ui/src/assets/fx/google_search/detail.md‎

Lines changed: 12 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,18 @@ Google 搜索工具是一个实时 API，可提取搜索引擎结果，提供来
55
## 配置
66

77
1. 创建 Google Custom Search Engine
8-
在[Programmable Search Engine]（https://programmablesearchengine.google.com/）中 添加 Search Engine
9-
![google 创建引擎](/src/assets/fx/img/google_AddSearchEngine.jpg)
8+
在[Programmable Search Engine]（https://programmablesearchengine.google.com/）中 添加 Search Engine
9+
![google 创建引擎](/src/assets/fx/img/google_AddSearchEngine.jpg)
1010
2. 获取cx参数
11-
进入添加引擎，在【基本】菜单中获取搜索引擎的ID，即cx。
12-
![google cx ](/src/assets/fx/img/google_cx.jpg)
13-
3.获取 API Key
14-
打开 https://developers.google.com/custom-search/v1/overview?hl=zh-cn，获取API Key。
15-
![google API Key](/src/assets/fx/img/google_APIKey.jpg)
11+
进入添加引擎，在【基本】菜单中获取搜索引擎的ID，即cx。
12+
![google cx ](/src/assets/fx/img/google_cx.jpg) 3.获取 API Key
13+
打开 https://developers.google.com/custom-search/v1/overview?hl=zh-cn，获取API Key。
14+
![google API Key](/src/assets/fx/img/google_APIKey.jpg)
1615

17-
4. 配置启动参数
18-
在Google搜索函数的启动参数中填写配置以上参数。
19-
![启动参数](/src/assets/fx/img/google_setting.jpg)
16+
3. 配置启动参数
17+
在Google搜索函数的启动参数中填写配置以上参数。
18+
![启动参数](/src/assets/fx/img/google_setting.jpg)
2019

21-
5. 在应用中使用
22-
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
23-
![应用中使用](/src/assets/fx/img/google_app_used.jpg)
20+
4. 在应用中使用
21+
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
22+
![应用中使用](/src/assets/fx/img/google_app_used.jpg)

‎ui/src/assets/fx/langsearch/detail.md‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22

33
博查工具是一个支持自然语言搜索的 Web Search API，从近百亿网页和生态内容源中搜索高质量世界知识，包括新闻、图片、视频、百科、机酒、学术等.
44

5-
65
## 配置
76

87
1. 获取API Key 
9-
在[博查开放平台](https://open.bochaai.com/overview) 上申请 API 密钥。
10-
![API Key](/src/assets/fx/img/langsearch_APIKey.jpg)
8+
在[博查开放平台](https://open.bochaai.com/overview) 上申请 API 密钥。
9+
![API Key](/src/assets/fx/img/langsearch_APIKey.jpg)
1110
2. 在函数库中配置
12-
在函数库的博查函数面板中，点击 … > 启用参数，填写 API 密钥，并启用博查函数。
13-
![启动参数](/src/assets/fx/img/langsearch_setting.jpg)
14-
1. 在应用中使用
15-
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
16-
![应用中使用](/src/assets/fx/img/langsearch_app_used.jpg)
17-
11+
在函数库的博查函数面板中，点击 … > 启用参数，填写 API 密钥，并启用博查函数。
12+
![启动参数](/src/assets/fx/img/langsearch_setting.jpg)
13+
3. 在应用中使用
14+
在高级编排应用中，点击添加组件->函数库->博查，设置使用参数。
15+
![应用中使用](/src/assets/fx/img/langsearch_app_used.jpg)

‎ui/src/components/ai-chat/component/chat-input-operate/index.vue‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -749,7 +749,6 @@ onMounted(() => {
749749
750750
@media only screen and (max-width: 768px) {
751751
.ai-chat {
752-
height: calc(100% - 100px);
753752
&__operate {
754753
position: fixed;
755754
bottom: 0;

‎ui/src/components/ai-chat/component/user-form/index.vue‎

Lines changed: 19 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
(inputFieldList.length > 0 || (type === 'debug-ai-chat' && apiInputFieldList.length > 0)) &&
55
type !== 'log'
66
"
7-
class="mb-16 w-full"
8-
style="padding: 0 24px; max-width: 400px"
7+
class="user-form-container mb-16 w-full"
98
>
109
<el-card shadow="always" class="border-r-8" style="--el-card-padding: 16px 8px">
1110
<div class="flex align-center cursor w-full" style="padding: 0 8px">
@@ -16,9 +15,14 @@
1615
{{ inputFieldConfig.title }}
1716
</span>
1817
</div>
19-
<el-scrollbar max-height="160">
18+
19+
<el-scrollbar :max-height="first ? 0 : 450">
2020
<el-collapse-transition>
21-
<div v-show="showUserInput" class="mt-16" style="padding: 0 8px">
21+
<div
22+
v-show="showUserInput"
23+
class="mt-16"
24+
style="padding: 0 8px; height: calc(100% - 100px)"
25+
>
2226
<DynamicsForm
2327
:key="dynamicsFormRefresh"
2428
v-model="form_data_context"
@@ -40,6 +44,7 @@
4044
</div>
4145
</el-collapse-transition>
4246
</el-scrollbar>
47+
4348
<div class="text-right mr-8">
4449
<el-button type="primary" v-if="first" @click="confirmHandle">{{
4550
$t('chat.operation.startChat')
@@ -359,4 +364,13 @@ onMounted(() => {
359364
handleInputFieldList()
360365
})
361366
</script>
362-
<style lang="scss" scoped></style>
367+
<style lang="scss" scoped>
368+
.user-form-container {
369+
padding: 0 24px;
370+
}
371+
@media only screen and (max-width: 768px) {
372+
.user-form-container {
373+
max-width: 100%;
374+
}
375+
}
376+
</style>

‎ui/src/components/ai-chat/index.vue‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
<template>
2-
<div ref="aiChatRef" class="ai-chat" :class="type">
2+
<div
3+
ref="aiChatRef"
4+
class="ai-chat"
5+
:class="type"
6+
:style="{ height: firsUserInput ? '100%' : undefined }"
7+
>
38
<div
49
v-show="showUserInputContent"
510
:class="firsUserInput ? 'firstUserInput' : 'popperUserInput'"
@@ -521,7 +526,15 @@ defineExpose({
521526
height: 100%;
522527
display: flex;
523528
justify-content: center;
524-
align-items: center;
529+
overflow: auto;
530+
.user-form-container {
531+
max-width: 70%;
532+
}
533+
}
534+
.debug-ai-chat {
535+
.user-form-container {
536+
max-width: 100%;
537+
}
525538
}
526539
.popperUserInput {
527540
position: absolute;
@@ -531,4 +544,11 @@ defineExpose({
531544
width: calc(100% - 50px);
532545
max-width: 400px;
533546
}
547+
@media only screen and (max-width: 768px) {
548+
.firstUserInput {
549+
.user-form-container {
550+
max-width: 100%;
551+
}
552+
}
553+
}
534554
</style>

‎ui/src/layout/components/sidebar/SidebarItem.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,8 +58,8 @@ function showMenu() {
5858
}
5959
}
6060
61-
function clickHandle(item: any) {
62-
if (isWorkFlow(type) && item.name === 'AppSetting') {
61+
function clickHandle(item?: any) {
62+
if (isWorkFlow(type) && item?.name === 'AppSetting') {
6363
router.push({ path: `/application/${id}/workflow` })
6464
}
6565
}

‎ui/src/views/function-lib/index.vue‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,12 +152,21 @@
152152
size="small"
153153
class="mr-4"
154154
/>
155+
<el-divider direction="vertical" />
155156
<el-dropdown trigger="click">
156157
<el-button text @click.stop>
157158
<el-icon><MoreFilled /></el-icon>
158159
</el-button>
159160
<template #dropdown>
160161
<el-dropdown-menu>
162+
<el-dropdown-item
163+
v-if="!item.template_id"
164+
:disabled="item.permission_type === 'PUBLIC' && !canEdit(item)"
165+
@click.stop="openCreateDialog(item)"
166+
>
167+
<el-icon><EditPen /></el-icon>
168+
{{ $t('common.edit') }}
169+
</el-dropdown-item>
161170
<el-dropdown-item
162171
:disabled="item.permission_type === 'PUBLIC' && !canEdit(item)"
163172
v-if="!item.template_id"

‎ui/src/workflow/common/NodeControl.vue‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
<el-card shadow="always" style="--el-card-padding: 8px 12px; --el-card-border-radius: 8px">
33
<el-button link @click="zoomOut">
44
<el-tooltip
5-
class="box-item"
65
effect="dark"
76
:content="$t('views.applicationWorkflow.control.zoomOut')"
87
placement="top"
@@ -14,7 +13,6 @@
1413
</el-button>
1514
<el-button link @click="zoomIn">
1615
<el-tooltip
17-
class="box-item"
1816
effect="dark"
1917
:content="$t('views.applicationWorkflow.control.zoomIn')"
2018
placement="top"
@@ -26,7 +24,6 @@
2624
</el-button>
2725
<el-button link @click="fitView">
2826
<el-tooltip
29-
class="box-item"
3027
effect="dark"
3128
:content="$t('views.applicationWorkflow.control.fitView')"
3229
placement="top"
@@ -40,7 +37,6 @@
4037
<el-divider direction="vertical" />
4138
<el-button link @click="retract">
4239
<el-tooltip
43-
class="box-item"
4440
effect="dark"
4541
:content="$t('views.applicationWorkflow.control.retract')"
4642
placement="top"
@@ -54,7 +50,6 @@
5450
</el-button>
5551
<el-button link @click="extend">
5652
<el-tooltip
57-
class="box-item"
5853
effect="dark"
5954
:content="$t('views.applicationWorkflow.control.extend')"
6055
placement="top"
@@ -68,7 +63,6 @@
6863
</el-button>
6964
<el-button link @click="layout">
7065
<el-tooltip
71-
class="box-item"
7266
effect="dark"
7367
:content="$t('views.applicationWorkflow.control.beautify')"
7468
placement="top"

‎ui/src/workflow/icons/function-lib-node-icon.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<script setup lang="ts">
1616
import { isAppIcon } from '@/utils/application'
1717
const props = defineProps<{
18-
item: {
18+
item?: {
1919
name: string
2020
icon: string
2121
}

0 commit comments

Comments
 (0)