perf: Optimize the folder to enter the second level page and retain records and the first conversation does not display the previous record (#3917)

This commit is contained in:
wangdan-fit2cloud 2025-08-22 16:27:13 +08:00 committed by GitHub
parent 600cd73d2d
commit 1f5544b13e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 232 additions and 116 deletions

View File

@ -11,7 +11,7 @@
>
<el-button type="primary">{{ $t('chat.uploadFile.label') }}</el-button>
<template #file="{ file }">
<el-card style="--el-card-padding: 0" shadow="never">
<el-card style="--el-card-padding: 0" shadow="never" class="upload_content">
<div
class="flex-between"
:class="[inputDisabled ? 'is-disabled' : '']"
@ -112,13 +112,15 @@ const uploadFile = async (file: any, fileList: Array<any>) => {
})
}
</script>
<style lang="scss">
.is-disabled {
background-color: var(--el-fill-color-light);
color: var(--el-text-color-placeholder);
cursor: not-allowed;
&:hover {
<style lang="scss" scoped>
.upload_content {
.is-disabled {
background-color: var(--el-fill-color-light);
color: var(--el-text-color-placeholder);
cursor: not-allowed;
&:hover {
cursor: not-allowed;
}
}
}
</style>

View File

@ -1,6 +1,6 @@
<template>
<div class="breadcrumb ml-4 mt-4 mb-12 flex">
<back-button :to="toBackPath" class="mt-4"></back-button>
<back-button @click="toBack"></back-button>
<div class="flex align-center">
<el-avatar
v-if="isApplication"
@ -30,8 +30,9 @@ import { onBeforeRouteLeave, useRouter, useRoute } from 'vue-router'
import { resetUrl } from '@/utils/common'
import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
import useStore from '@/stores'
const { common, application } = useStore()
const { common, folder } = useStore()
const route = useRoute()
const router = useRouter()
const {
meta: { activeMenu },
@ -104,6 +105,20 @@ function getApplicationDetail() {
})
}
function toBack() {
if (isKnowledge.value) {
folder.setCurrentFolder({
id: folderId,
})
} else if (isApplication.value) {
folder.setCurrentFolder({
id: current.value.folder,
})
}
router.push({ path: toBackPath.value })
}
onMounted(() => {
if (isKnowledge.value) {
getKnowledgeDetail()

View File

@ -3,8 +3,13 @@
<template #left>
<h4 class="p-12-16 pb-0 mt-12">{{ $t('views.application.title') }}</h4>
<div class="p-8">
<folder-tree :source="SourceTypeEnum.APPLICATION" :data="folderList" :currentNodeKey="folder.currentFolder?.id"
@handleNodeClick="folderClickHandle" @refreshTree="refreshFolder" />
<folder-tree
:source="SourceTypeEnum.APPLICATION"
:data="folderList"
:currentNodeKey="folder.currentFolder?.id"
@handleNodeClick="folderClickHandle"
@refreshTree="refreshFolder"
/>
</div>
</template>
<ContentContainer>
@ -14,22 +19,44 @@
<template #search>
<div class="flex">
<div class="flex-between complex-search">
<el-select class="complex-search__left" v-model="search_type" style="width: 120px"
@change="search_type_change">
<el-select
class="complex-search__left"
v-model="search_type"
style="width: 120px"
@change="search_type_change"
>
<el-option :label="$t('common.creator')" value="create_user" />
<el-option :label="$t('common.name')" value="name" />
<el-option :label="$t('common.publishStatus')" value="publish_status" />
</el-select>
<el-input v-if="search_type === 'name'" v-model="search_form.name" @change="searchHandle"
:placeholder="$t('common.searchBar.placeholder')" style="width: 220px" clearable />
<el-select v-else-if="search_type === 'create_user'" v-model="search_form.create_user"
@change="searchHandle" filterable clearable style="width: 220px">
<el-input
v-if="search_type === 'name'"
v-model="search_form.name"
@change="searchHandle"
:placeholder="$t('common.searchBar.placeholder')"
style="width: 220px"
clearable
/>
<el-select
v-else-if="search_type === 'create_user'"
v-model="search_form.create_user"
@change="searchHandle"
filterable
clearable
style="width: 220px"
>
<el-option v-for="u in user_options" :key="u.id" :value="u.id" :label="u.nick_name" />
</el-select>
<el-select v-else-if="search_type === 'publish_status'" v-model="search_form.publish_status"
@change="searchHandle" filterable clearable style="width: 220px">
<el-select
v-else-if="search_type === 'publish_status'"
v-model="search_form.publish_status"
@change="searchHandle"
filterable
clearable
style="width: 220px"
>
<el-option :label="$t('common.published')" value="published" />
<el-option :label="$t('common.unpublished')" value="unpublished" />
</el-select>
@ -46,11 +73,16 @@
<el-dropdown-item @click="openCreateDialog('SIMPLE')">
<div class="flex">
<el-avatar shape="square" class="avatar-blue mt-4" :size="36">
<img src="@/assets/application/icon_simple_application.svg" style="width: 65%" alt="" />
<img
src="@/assets/application/icon_simple_application.svg"
style="width: 65%"
alt=""
/>
</el-avatar>
<div class="pre-wrap ml-8">
<div class="lighter">{{ $t('views.application.simple') }}</div>
<el-text type="info" size="small">{{ $t('views.application.simplePlaceholder') }}
<el-text type="info" size="small"
>{{ $t('views.application.simplePlaceholder') }}
</el-text>
</div>
</div>
@ -58,18 +90,31 @@
<el-dropdown-item @click="openCreateDialog('WORK_FLOW')">
<div class="flex">
<el-avatar shape="square" class="avatar-purple mt-4" :size="36">
<img src="@/assets/application/icon_workflow_application.svg" style="width: 65%" alt="" />
<img
src="@/assets/application/icon_workflow_application.svg"
style="width: 65%"
alt=""
/>
</el-avatar>
<div class="pre-wrap ml-8">
<div class="lighter">{{ $t('views.application.workflow') }}</div>
<el-text type="info" size="small">{{ $t('views.application.workflowPlaceholder') }}
<el-text type="info" size="small"
>{{ $t('views.application.workflowPlaceholder') }}
</el-text>
</div>
</div>
</el-dropdown-item>
<el-upload class="import-button" ref="elUploadRef" :file-list="[]" action="#" multiple
:auto-upload="false" :show-file-list="false" :limit="1"
:on-change="(file: any, fileList: any) => importApplication(file)">
<el-upload
class="import-button"
ref="elUploadRef"
:file-list="[]"
action="#"
multiple
:auto-upload="false"
:show-file-list="false"
:limit="1"
:on-change="(file: any, fileList: any) => importApplication(file)"
>
<el-dropdown-item>
<div class="flex align-center w-full">
<el-avatar shape="square" class="mt-4" :size="36" style="background: none">
@ -96,16 +141,35 @@
</el-dropdown>
</div>
</template>
<div v-loading.fullscreen.lock="paginationConfig.current_page === 1 && loading"
style="max-height: calc(100vh - 120px)">
<InfiniteScroll :size="applicationList.length" :total="paginationConfig.total"
:page_size="paginationConfig.page_size" v-model:current_page="paginationConfig.current_page" @load="getList"
:loading="loading">
<div
v-loading.fullscreen.lock="paginationConfig.current_page === 1 && loading"
style="max-height: calc(100vh - 120px)"
>
<InfiniteScroll
:size="applicationList.length"
:total="paginationConfig.total"
:page_size="paginationConfig.page_size"
v-model:current_page="paginationConfig.current_page"
@load="getList"
:loading="loading"
>
<el-row v-if="applicationList.length > 0" :gutter="15" class="w-full">
<template v-for="(item, index) in applicationList" :key="index">
<el-col v-if="item.resource_type === 'folder'" :xs="24" :sm="12" :md="12" :lg="8" :xl="6" class="mb-16">
<CardBox :title="item.name" :description="item.desc || $t('components.noDesc')" class="cursor"
@click="clickFolder(item)">
<el-col
v-if="item.resource_type === 'folder'"
:xs="24"
:sm="12"
:md="12"
:lg="8"
:xl="6"
class="mb-16"
>
<CardBox
:title="item.name"
:description="item.desc || $t('components.noDesc')"
class="cursor"
@click="clickFolder(item)"
>
<template #icon>
<el-avatar shape="square" :size="32" style="background: none">
<AppIcon iconName="app-folder" style="font-size: 32px"></AppIcon>
@ -119,7 +183,12 @@
</CardBox>
</el-col>
<el-col v-else :xs="24" :sm="12" :md="12" :lg="8" :xl="6" class="mb-16">
<CardBox :title="item.name" :description="item.desc" class="cursor" @click="goApp(item)">
<CardBox
:title="item.name"
:description="item.desc"
class="cursor"
@click="goApp(item)"
>
<template #icon>
<el-avatar shape="square" :size="32" style="background: none">
<img :src="resetUrl(item?.icon, resetUrl('./favicon.ico'))" alt="" />
@ -173,33 +242,51 @@
<AppIcon iconName="app-create-chat" class="color-secondary"></AppIcon>
{{ $t('views.application.operation.toChat') }}
</el-dropdown-item>
<el-dropdown-item @click.stop="settingApplication(item)"
v-if="permissionPrecise.edit(item.id)">
<el-dropdown-item
@click.stop="settingApplication(item)"
v-if="permissionPrecise.edit(item.id)"
>
<AppIcon iconName="app-setting" class="color-secondary"></AppIcon>
{{ $t('common.setting') }}
</el-dropdown-item>
<el-dropdown-item @click.stop="openAuthorization(item)"
v-if="permissionPrecise.auth(item.id)">
<AppIcon iconName="app-resource-authorization" class="color-secondary"></AppIcon>
<el-dropdown-item
@click.stop="openAuthorization(item)"
v-if="permissionPrecise.auth(item.id)"
>
<AppIcon
iconName="app-resource-authorization"
class="color-secondary"
></AppIcon>
{{ $t('views.system.resourceAuthorization.title') }}
</el-dropdown-item>
<el-dropdown-item @click.stop="openMoveToDialog(item)"
v-if="permissionPrecise.edit(item.id) && apiType === 'workspace'">
<el-dropdown-item
@click.stop="openMoveToDialog(item)"
v-if="permissionPrecise.edit(item.id) && apiType === 'workspace'"
>
<AppIcon iconName="app-migrate" class="color-secondary"></AppIcon>
{{ $t('common.moveTo') }}
</el-dropdown-item>
<el-dropdown-item @click="copyApplication(item)" v-if="permissionPrecise.create()">
<el-dropdown-item
@click="copyApplication(item)"
v-if="permissionPrecise.create()"
>
<AppIcon iconName="app-copy" class="color-secondary"></AppIcon>
{{ $t('common.copy') }}
</el-dropdown-item>
<el-dropdown-item divided @click.stop="exportApplication(item)"
v-if="permissionPrecise.export(item.id)">
<el-dropdown-item
divided
@click.stop="exportApplication(item)"
v-if="permissionPrecise.export(item.id)"
>
<AppIcon iconName="app-export" class="color-secondary"></AppIcon>
{{ $t('common.export') }}
</el-dropdown-item>
<el-dropdown-item divided @click.stop="deleteApplication(item)"
v-if="permissionPrecise.delete(item.id)">
<el-dropdown-item
divided
@click.stop="deleteApplication(item)"
v-if="permissionPrecise.delete(item.id)"
>
<AppIcon iconName="app-delete" class="color-secondary"></AppIcon>
{{ $t('common.delete') }}
</el-dropdown-item>
@ -219,9 +306,16 @@
<CreateApplicationDialog ref="CreateApplicationDialogRef" />
<CopyApplicationDialog ref="CopyApplicationDialogRef" />
<CreateFolderDialog ref="CreateFolderDialogRef" @refresh="refreshFolder" />
<MoveToDialog ref="MoveToDialogRef" :source="SourceTypeEnum.APPLICATION" @refresh="refreshApplicationList"
v-if="apiType === 'workspace'" />
<ResourceAuthorizationDrawer :type="SourceTypeEnum.APPLICATION" ref="ResourceAuthorizationDrawerRef" />
<MoveToDialog
ref="MoveToDialogRef"
:source="SourceTypeEnum.APPLICATION"
@refresh="refreshApplicationList"
v-if="apiType === 'workspace'"
/>
<ResourceAuthorizationDrawer
:type="SourceTypeEnum.APPLICATION"
ref="ResourceAuthorizationDrawerRef"
/>
</LayoutContainer>
</template>
@ -248,7 +342,6 @@ import { ComplexPermission } from '@/utils/permission/type'
import { EditionConst, PermissionConst, RoleConst } from '@/utils/permission/data'
const router = useRouter()
const route = useRoute()
const apiType = computed<'workspace'>(() => {
return 'workspace'
@ -257,7 +350,7 @@ const permissionPrecise = computed(() => {
return permissionMap['application'][apiType.value]
})
const { folder, application, user, common } = useStore()
const { folder, application, user } = useStore()
const loading = ref(false)
@ -444,20 +537,20 @@ function toChat(row: any) {
.map((v: any) => {
apiInputParams.value = v.properties.api_input_field_list
? v.properties.api_input_field_list.map((v: any) => {
return {
name: v.variable,
value: v.default_value,
}
})
return {
name: v.variable,
value: v.default_value,
}
})
: v.properties.input_field_list
? v.properties.input_field_list
.filter((v: any) => v.assignment_method === 'api_input')
.map((v: any) => {
return {
name: v.variable,
value: v.default_value,
}
})
.filter((v: any) => v.assignment_method === 'api_input')
.map((v: any) => {
return {
name: v.variable,
value: v.default_value,
}
})
: []
})
const apiParams = mapToUrlParams(apiInputParams.value)
@ -499,7 +592,6 @@ function settingApplication(row: any) {
function deleteApplication(row: any) {
MsgConfirm(
// @ts-ignore
`${t('views.application.delete.confirmTitle')}${row.name} ?`,
t('views.application.delete.confirmMessage'),
{
@ -515,7 +607,7 @@ function deleteApplication(row: any) {
MsgSuccess(t('common.deleteSuccess'))
})
})
.catch(() => { })
.catch(() => {})
}
const exportApplication = (application: any) => {
@ -617,7 +709,7 @@ function getList() {
}
onMounted(() => {
getFolder(true)
getFolder(folder.currentFolder?.id ? false : true)
WorkspaceApi.getAllMemberList(user.getWorkspaceId(), loading).then((res) => {
user_options.value = res.data
})

View File

@ -176,7 +176,7 @@ function newChat() {
show.value = false
}
function getChatLog(id: string) {
function getChatLog(refresh?: boolean) {
const page = {
current_page: 1,
page_size: 20,
@ -184,12 +184,11 @@ function getChatLog(id: string) {
chatAPI.pageChat(page.current_page, page.page_size, left_loading).then((res: any) => {
chatLogData.value = res.data.records
paginationConfig.current_page = 1
paginationConfig.total = 0
currentRecordList.value = []
currentChatId.value = chatLogData.value?.[0]?.id || 'new'
if (currentChatId.value !== 'new') {
getChatRecord()
if (!refresh) {
paginationConfig.current_page = 1
paginationConfig.total = 0
currentRecordList.value = []
currentChatId.value = 'new'
}
})
}
@ -241,14 +240,14 @@ function refreshFieldTitle(chatId: string, abstract: string) {
}
function refresh(id: string) {
getChatLog(applicationDetail.value.id)
currentChatId.value = id
getChatLog(true)
}
/**
*初始化历史对话记录
*/
const init = () => {
getChatLog(applicationDetail.value.id)
getChatLog()
}
onMounted(() => {

View File

@ -182,7 +182,7 @@ function newChat() {
show.value = false
}
function getChatLog(id: string) {
function getChatLog(refresh?: boolean) {
const page = {
current_page: 1,
page_size: 20,
@ -190,12 +190,11 @@ function getChatLog(id: string) {
chatAPI.pageChat(page.current_page, page.page_size, left_loading).then((res: any) => {
chatLogData.value = res.data.records
paginationConfig.current_page = 1
paginationConfig.total = 0
currentRecordList.value = []
currentChatId.value = chatLogData.value?.[0]?.id || 'new'
if (currentChatId.value !== 'new') {
getChatRecord()
if (!refresh) {
paginationConfig.current_page = 1
paginationConfig.total = 0
currentRecordList.value = []
currentChatId.value = 'new'
}
})
}
@ -247,14 +246,14 @@ function refreshFieldTitle(chatId: string, abstract: string) {
}
function refresh(id: string) {
getChatLog(applicationDetail.value.id)
currentChatId.value = id
getChatLog(true)
}
/**
*初始化历史对话记录
*/
const init = () => {
getChatLog(applicationDetail.value.id)
getChatLog()
}
onMounted(() => {

View File

@ -324,7 +324,7 @@ function deleteLog(row: any) {
paginationConfig.value.total = 0
currentRecordList.value = []
}
getChatLog(applicationDetail.value.id)
getChatLog()
})
}
@ -335,7 +335,7 @@ function clearChat() {
paginationConfig.value.current_page = 1
paginationConfig.value.total = 0
currentRecordList.value = []
getChatLog(applicationDetail.value.id)
getChatLog()
})
}
@ -372,7 +372,7 @@ function newChat() {
}
}
function getChatLog(id: string, refresh?: boolean) {
function getChatLog(refresh?: boolean) {
const page = {
current_page: 1,
page_size: 20,
@ -386,11 +386,8 @@ function getChatLog(id: string, refresh?: boolean) {
paginationConfig.value.current_page = 1
paginationConfig.value.total = 0
currentRecordList.value = []
currentChatId.value = chatLogData.value?.[0]?.id || 'new'
currentChatName.value = chatLogData.value?.[0]?.abstract || t('chat.createChat')
if (currentChatId.value !== 'new') {
getChatRecord()
}
currentChatId.value = 'new'
currentChatName.value = t('chat.createChat')
}
})
}
@ -449,7 +446,7 @@ const clickListHandle = (item: any) => {
function refresh(id: string) {
currentChatId.value = id
getChatLog(applicationDetail.value.id, true)
getChatLog(true)
}
async function exportMarkdown(): Promise<void> {
@ -477,7 +474,7 @@ async function exportHTML(): Promise<void> {
*初始化历史对话记录
*/
const init = () => {
getChatLog(applicationDetail.value?.id)
getChatLog()
}
onMounted(() => {
init()

View File

@ -74,7 +74,7 @@ function refreshFolder() {
}
onMounted(() => {
getFolder(true)
getFolder(folder.currentFolder?.id ? false : true)
})
</script>

View File

@ -81,9 +81,7 @@
<!--  应用 icon -->
<LogoIcon v-else-if="isApplication" height="20px" />
<!-- 工具 icon -->
<el-avatar v-else-if="isTool" class="avatar-green" shape="square" :size="20">
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt="" />
</el-avatar>
<ToolIcon v-else-if="isTool" :size="20" :type="row?.tool_type" />
<!-- 模型 icon -->
<span
v-else-if="isModel"

View File

@ -89,7 +89,7 @@ function refreshFolder() {
}
onMounted(() => {
getFolder(true)
getFolder(folder.currentFolder?.id ? false : true)
})
</script>

View File

@ -130,16 +130,24 @@
<el-switch size="small" v-model="chat_data.mcp_enable" />
</div>
</div>
<div class="w-full" v-if="
(chat_data.mcp_tool_id) ||
(chat_data.mcp_servers && chat_data.mcp_servers.length > 0)"
<div
class="w-full mb-16"
v-if="
chat_data.mcp_tool_id || (chat_data.mcp_servers && chat_data.mcp_servers.length > 0)
"
>
<div class="flex-between border border-r-6 white-bg mb-4" style="padding: 5px 8px">
<div class="flex align-center" style="line-height: 20px">
<ToolIcon type="MCP" class="mr-8" :size="20" />
<div class="ellipsis" :title="relatedObject(toolSelectOptions, chat_data.mcp_tool_id, 'id')?.name">
{{ relatedObject(mcpToolSelectOptions, chat_data.mcp_tool_id, 'id')?.name || $t('common.custom') + ' MCP' }}
<div
class="ellipsis"
:title="relatedObject(toolSelectOptions, chat_data.mcp_tool_id, 'id')?.name"
>
{{
relatedObject(mcpToolSelectOptions, chat_data.mcp_tool_id, 'id')?.name ||
$t('common.custom') + ' MCP'
}}
</div>
</div>
<el-button text @click="chat_data.mcp_tool_id = ''">
@ -163,7 +171,7 @@
<el-switch size="small" v-model="chat_data.tool_enable" />
</div>
</div>
<div class="w-full" v-if="chat_data.tool_ids?.length > 0">
<div class="w-full mb-16" v-if="chat_data.tool_ids?.length > 0">
<template v-for="(item, index) in chat_data.tool_ids" :key="index">
<div class="flex-between border border-r-6 white-bg mb-4" style="padding: 5px 8px">
<div class="flex align-center" style="line-height: 20px">
@ -186,17 +194,23 @@
<div>
<span>{{ $t('views.application.form.reasoningContent.label') }}</span>
</div>
<el-button
type="primary"
link
@click="openReasoningParamSettingDialog"
@refreshForm="refreshParam"
>
<AppIcon iconName="app-setting"></AppIcon>
</el-button>
<div>
<el-button
type="primary"
link
@click="openReasoningParamSettingDialog"
@refreshForm="refreshParam"
class="mr-4"
>
<AppIcon iconName="app-setting"></AppIcon>
</el-button>
<el-switch
size="small"
v-model="chat_data.model_setting.reasoning_content_enable"
/>
</div>
</div>
</template>
<el-switch size="small" v-model="chat_data.model_setting.reasoning_content_enable" />
</el-form-item>
<el-form-item @click.prevent>
<template #label>
@ -241,7 +255,7 @@ import McpServersDialog from '@/views/application/component/McpServersDialog.vue
import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
import { useRoute } from 'vue-router'
import ToolDialog from '@/views/application/component/ToolDialog.vue'
import {relatedObject} from "@/utils/array.ts";
import { relatedObject } from '@/utils/array.ts'
const getApplicationDetail = inject('getApplicationDetail') as any
const route = useRoute()