zhuchaowe/maxkb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: tree style

Browse Source
This commit is contained in:
wangdan-fit2cloud 2025-07-15 18:40:53 +08:00
parent df9245a5a4
commit b4569fc88d
13 changed files with 168 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
ui/src/components/dynamics-form/constructor/index.vue
View File

@ -7,7 +7,12 @@
:model="form_data" :model="form_data"
v-bind="$attrs" v-bind="$attrs"
> >
<el-form-item :label="$t('dynamicsForm.paramForm.field.label')" :required="true" prop="field" :rules="rules.field"> <el-form-item
:label="$t('dynamicsForm.paramForm.field.label')"
:required="true"
prop="field"
:rules="rules.field"
>
<el-input <el-input
v-model="form_data.field" v-model="form_data.field"
:maxlength="64" :maxlength="64"
@ -15,7 +20,12 @@
show-word-limit show-word-limit
/> />
</el-form-item> </el-form-item>
<el-form-item :label="$t('dynamicsForm.paramForm.name.label')" :required="true" prop="label" :rules="rules.label"> <el-form-item
:label="$t('dynamicsForm.paramForm.name.label')"
:required="true"
prop="label"
:rules="rules.label"
>
<el-input <el-input
v-model="form_data.label" v-model="form_data.label"
:maxlength="64" :maxlength="64"
@ -31,11 +41,25 @@
:placeholder="$t('dynamicsForm.paramForm.tooltip.placeholder')" :placeholder="$t('dynamicsForm.paramForm.tooltip.placeholder')"
/> />
</el-form-item> </el-form-item>
<el-form-item :label="$t('dynamicsForm.paramForm.required.label')" :required="true" prop="required" :rules="rules.required"> <el-form-item
:label="$t('dynamicsForm.paramForm.required.label')"
:required="true"
prop="required"
:rules="rules.required"
@click.prevent
>
<el-switch v-model="form_data.required" :active-value="true" :inactive-value="false" /> <el-switch v-model="form_data.required" :active-value="true" :inactive-value="false" />
</el-form-item> </el-form-item>
<el-form-item :label="$t('dynamicsForm.paramForm.input_type.label')" :required="true" prop="input_type" :rules="rules.input_type"> <el-form-item
<el-select v-model="form_data.input_type" :placeholder="$t('dynamicsForm.paramForm.input_type.placeholder')"> :label="$t('dynamicsForm.paramForm.input_type.label')"
:required="true"
prop="input_type"
:rules="rules.input_type"
>
<el-select
v-model="form_data.input_type"
:placeholder="$t('dynamicsForm.paramForm.input_type.placeholder')"
>
<el-option <el-option
v-for="input_type in input_type_list" v-for="input_type in input_type_list"
:key="input_type.value" :key="input_type.value"
@ -65,8 +89,11 @@ const props = withDefaults(
}>(), }>(),
{ {
input_type_list: () => input_type_list: () =>
input_type_list_data.map((item) => ({ label: item.label, value: item.value + 'Constructor' })) input_type_list_data.map((item) => ({
} label: item.label,
value: item.value + 'Constructor',
})),
},
) )
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue'])
@ -78,13 +105,13 @@ const form_data = ref<any>({
field: '', field: '',
tooltip: '', tooltip: '',
required: false, required: false,
input_type: '' input_type: '',
}) })
const rules = { const rules = {
label: [{ required: true, message: t('dynamicsForm.paramForm.name.requiredMessage') }], label: [{ required: true, message: t('dynamicsForm.paramForm.name.requiredMessage') }],
field: [{ required: true, message: t('dynamicsForm.paramForm.field.requiredMessage') }], field: [{ required: true, message: t('dynamicsForm.paramForm.field.requiredMessage') }],
required: [{ required: true, message: t('dynamicsForm.paramForm.required.requiredMessage') }], required: [{ required: true, message: t('dynamicsForm.paramForm.required.requiredMessage') }],
input_type: [{ required: true, message: t('dynamicsForm.paramForm.input_type.requiredMessage') }] input_type: [{ required: true, message: t('dynamicsForm.paramForm.input_type.requiredMessage') }],
} }
const getData = () => { const getData = () => {
let label: string | any = form_data.value.label let label: string | any = form_data.value.label
@ -93,7 +120,7 @@ const getData = () => {
input_type: 'TooltipLabel', input_type: 'TooltipLabel',
label: form_data.value.label, label: form_data.value.label,
attrs: { tooltip: form_data.value.tooltip }, attrs: { tooltip: form_data.value.tooltip },
props_info: {} props_info: {},
} }
} }
return { return {
@ -102,7 +129,7 @@ const getData = () => {
field: form_data.value.field, field: form_data.value.field,
default_value: form_data.value.default_value, default_value: form_data.value.default_value,
show_default_value: form_data.value.show_default_value, show_default_value: form_data.value.show_default_value,
...componentFormRef.value.getData() ...componentFormRef.value.getData(),
} }
} }

33
ui/src/components/dynamics-form/constructor/items/SliderConstructor.vue
View File

@ -1,5 +1,10 @@
<template> <template>
<el-form-item :label="$t('dynamicsForm.Slider.showInput.label')" required prop="showInput"> <el-form-item
:label="$t('dynamicsForm.Slider.showInput.label')"
required
prop="showInput"
@click.prevent
>
<el-switch v-model="formValue.showInput" /> <el-switch v-model="formValue.showInput" />
</el-form-item> </el-form-item>
<el-form-item :label="$t('dynamicsForm.Slider.valueRange.label')" required> <el-form-item :label="$t('dynamicsForm.Slider.valueRange.label')" required>
@ -9,8 +14,8 @@
{ {
required: true, required: true,
message: $t('dynamicsForm.Slider.valueRange.minRequired'), message: $t('dynamicsForm.Slider.valueRange.minRequired'),
trigger: 'change' trigger: 'change',
} },
]" ]"
prop="min" prop="min"
> >
@ -26,8 +31,8 @@
{ {
required: true, required: true,
message: $t('dynamicsForm.Slider.valueRange.maxRequired'), message: $t('dynamicsForm.Slider.valueRange.maxRequired'),
trigger: 'change' trigger: 'change',
} },
]" ]"
prop="max" prop="max"
><el-input-number ><el-input-number
@ -89,7 +94,7 @@ const formValue = computed({
}, },
get: () => { get: () => {
return props.modelValue return props.modelValue
} },
}) })
const getData = () => { const getData = () => {
@ -101,19 +106,19 @@ const getData = () => {
step: formValue.value.step, step: formValue.value.step,
precision: formValue.value.precision, precision: formValue.value.precision,
'show-input-controls': false, 'show-input-controls': false,
'show-input': formValue.value.showInput 'show-input': formValue.value.showInput,
}, },
props_info: { props_info: {
rules: [ rules: [
{ {
message: formValue.value.label + ' ' + t('dynamicsForm.tip.requiredMessage'), message: formValue.value.label + ' ' + t('dynamicsForm.tip.requiredMessage'),
trigger: 'blur', trigger: 'blur',
required: formValue.value.required required: formValue.value.required,
} },
] ],
}, },
show_default_value: true, show_default_value: true,
default_value: formValue.value.default_value default_value: formValue.value.default_value,
} }
} }
watch( watch(
@ -122,7 +127,7 @@ watch(
if (formValue.value.min > formValue.value.max) { if (formValue.value.min > formValue.value.max) {
formValue.value.max = formValue.value.min formValue.value.max = formValue.value.min
} }
} },
) )
const rander = (form_data: any) => { const rander = (form_data: any) => {
const attrs = form_data.attrs const attrs = form_data.attrs
@ -147,8 +152,8 @@ const step_rules = [
} }
return true return true
}, },
trigger: 'blur' trigger: 'blur',
} },
] ]
defineExpose({ getData, rander }) defineExpose({ getData, rander })
onBeforeMount(() => { onBeforeMount(() => {

12
ui/src/components/dynamics-form/constructor/items/SwitchInputConstructor.vue
View File

@ -5,9 +5,15 @@
prop="default_value" prop="default_value"
:rules=" :rules="
formValue.required formValue.required
? [{ required: true, message: `${$t('dynamicsForm.default.label')}${$t('dynamicsForm.default.requiredMessage')}` }] ? [
{
required: true,
message: `${$t('dynamicsForm.default.label')}${$t('dynamicsForm.default.requiredMessage')}`,
},
]
: [] : []
" "
@click.prevent
> >
<el-switch v-model="formValue.default_value" /> <el-switch v-model="formValue.default_value" />
</el-form-item> </el-form-item>
@ -25,7 +31,7 @@ const formValue = computed({
}, },
get: () => { get: () => {
return props.modelValue return props.modelValue
} },
}) })
const getData = () => { const getData = () => {
@ -33,7 +39,7 @@ const getData = () => {
input_type: 'SwitchInput', input_type: 'SwitchInput',
show_default_value: true, show_default_value: true,
attrs: {}, attrs: {},
default_value: formValue.value.default_value default_value: formValue.value.default_value,
} }
} }

3
ui/src/components/folder-tree/MoveToDialog.vue
View File

@ -5,13 +5,14 @@
append-to-body append-to-body
:close-on-click-modal="false" :close-on-click-modal="false"
:close-on-press-escape="false" :close-on-press-escape="false"
align-center
> >
<folder-tree <folder-tree
ref="treeRef" ref="treeRef"
:source="source" :source="source"
:data="folderList" :data="folderList"
:treeStyle="{ :treeStyle="{
height: 'auto', height: 'calc(100vh - 320px)',
border: '1px solid #ebeef5', border: '1px solid #ebeef5',
borderRadius: '6px', borderRadius: '6px',
padding: '8px', padding: '8px',

3
ui/src/styles/element-plus.scss
View File

@ -111,6 +111,9 @@
.el-message { .el-message {
--el-message-close-icon-color: var(--app-text-color-secondary); --el-message-close-icon-color: var(--app-text-color-secondary);
} }
.el-message__content {
word-break: break-all;
}
.el-message-box { .el-message-box {
--el-messagebox-font-size: 16px; --el-messagebox-font-size: 16px;
--el-messagebox-width: 475px; --el-messagebox-width: 475px;

40
ui/src/views/application-overview/xpack-component/XPackLimitDrawer.vue
View File

@ -23,11 +23,14 @@
step-strictly step-strictly
/> />
<span class="ml-4">{{ <span class="ml-4">{{
$t('views.applicationOverview.appInfo.LimitDialog.timesDays') $t('views.applicationOverview.appInfo.LimitDialog.timesDays')
}}</span> }}</span>
</el-form-item> </el-form-item>
<!-- 身份验证 --> <!-- 身份验证 -->
<el-form-item :label="$t('views.applicationOverview.appInfo.LimitDialog.authentication')"> <el-form-item
:label="$t('views.applicationOverview.appInfo.LimitDialog.authentication')"
@click.prevent
>
<el-switch size="small" v-model="form.authentication"></el-switch> <el-switch size="small" v-model="form.authentication"></el-switch>
</el-form-item> </el-form-item>
<el-radio-group <el-radio-group
@ -72,7 +75,7 @@
style="margin: 0 4px 0 0 !important" style="margin: 0 4px 0 0 !important"
> >
<el-icon> <el-icon>
<RefreshRight/> <RefreshRight />
</el-icon> </el-icon>
</el-button> </el-button>
</el-tooltip> </el-tooltip>
@ -109,7 +112,7 @@
> >
<el-checkbox-group v-model="form.authentication_value.login_value"> <el-checkbox-group v-model="form.authentication_value.login_value">
<template v-for="t in auth_list" :key="t.value"> <template v-for="t in auth_list" :key="t.value">
<el-checkbox :label="t.label" :value="t.value"/> <el-checkbox :label="t.label" :value="t.value" />
</template> </template>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
@ -142,18 +145,18 @@
</el-drawer> </el-drawer>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {ref, watch} from 'vue' import { ref, watch } from 'vue'
import {useRoute, useRouter} from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import type {FormInstance, FormRules} from 'element-plus' import type { FormInstance, FormRules } from 'element-plus'
import applicationApi from '@/api/application/application' import applicationApi from '@/api/application/application'
import {MsgSuccess} from '@/utils/message' import { MsgSuccess } from '@/utils/message'
import {t} from '@/locales' import { t } from '@/locales'
import {copyClick} from '@/utils/clipboard' import { copyClick } from '@/utils/clipboard'
const router = useRouter() const router = useRouter()
const route = useRoute() const route = useRoute()
const { const {
params: {id}, params: { id },
} = route } = route
const emit = defineEmits(['refresh']) const emit = defineEmits(['refresh'])
@ -198,7 +201,10 @@ const open = (data: any) => {
form.value.authentication_value = data.authentication_value || { form.value.authentication_value = data.authentication_value || {
type: 'password', type: 'password',
} }
if (form.value.authentication_value.type === 'password' && !form.value.authentication_value.password_value) { if (
form.value.authentication_value.type === 'password' &&
!form.value.authentication_value.password_value
) {
refreshAuthentication() refreshAuthentication()
} }
form.value.authentication = data.authentication form.value.authentication = data.authentication
@ -243,12 +249,16 @@ function refreshAuthentication() {
} }
function firstGeneration() { function firstGeneration() {
if (form.value.authentication && form.value.authentication_value.type === 'password' && !form.value.authentication_value.password_value) { if (
form.value.authentication &&
form.value.authentication_value.type === 'password' &&
!form.value.authentication_value.password_value
) {
form.value.authentication_value.password_value = generateAuthenticationValue() form.value.authentication_value.password_value = generateAuthenticationValue()
} }
} }
defineExpose({open}) defineExpose({ open })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.authentication-append-input { .authentication-append-input {

38
ui/src/views/application-workflow/component/DropdownMenu.vue
View File

@ -71,16 +71,17 @@
<el-tab-pane :label="$t('views.tool.title')" name="tool"> <el-tab-pane :label="$t('views.tool.title')" name="tool">
<LayoutContainer> <LayoutContainer>
<template #left> <template #left>
<folder-tree <div class="p-8">
:source="SourceTypeEnum.TOOL" <folder-tree
:data="toolTreeData" :source="SourceTypeEnum.TOOL"
:currentNodeKey="folder.currentFolder?.id" :data="toolTreeData"
@handleNodeClick="folderClickHandle" :currentNodeKey="folder.currentFolder?.id"
:shareTitle="$t('views.shared.shared_tool')" @handleNodeClick="folderClickHandle"
:showShared="permissionPrecise['is_share']()" :shareTitle="$t('views.shared.shared_tool')"
class="p-8" :showShared="permissionPrecise['is_share']()"
:canOperation="false" :canOperation="false"
/> />
</div>
</template> </template>
<el-scrollbar height="450"> <el-scrollbar height="450">
<NodeContent <NodeContent
@ -95,14 +96,15 @@
<el-tab-pane :label="$t('views.application.title')" name="application"> <el-tab-pane :label="$t('views.application.title')" name="application">
<LayoutContainer> <LayoutContainer>
<template #left> <template #left>
<folder-tree <div class="p-8">
:source="SourceTypeEnum.APPLICATION" <folder-tree
:data="applicationTreeData" :source="SourceTypeEnum.APPLICATION"
:currentNodeKey="folder.currentFolder?.id" :data="applicationTreeData"
@handleNodeClick="folderClickHandle" :currentNodeKey="folder.currentFolder?.id"
class="p-8" @handleNodeClick="folderClickHandle"
:canOperation="false" :canOperation="false"
/> />
</div>
</template> </template>
<el-scrollbar height="450"> <el-scrollbar height="450">
<NodeContent <NodeContent

25
ui/src/views/application/component/AddKnowledgeDialog.vue
View File

@ -29,17 +29,18 @@
</template> </template>
<LayoutContainer class="application-manage"> <LayoutContainer class="application-manage">
<template #left> <template #left>
<folder-tree <div class="p-8">
:data="folderList" <folder-tree
:currentNodeKey="currentFolder?.id" :data="folderList"
@handleNodeClick="folderClickHandle" :currentNodeKey="currentFolder?.id"
class="p-8" @handleNodeClick="folderClickHandle"
v-loading="folderLoading" v-loading="folderLoading"
:canOperation="false" :canOperation="false"
showShared showShared
:shareTitle="$t('views.shared.shared_knowledge')" :shareTitle="$t('views.shared.shared_knowledge')"
:treeStyle="{ height: 'calc(100vh - 320px)' }" :treeStyle="{ height: 'calc(100vh - 320px)' }"
/> />
</div>
</template> </template>
<div class="layout-bg"> <div class="layout-bg">
<div class="flex-between p-16 ml-8"> <div class="flex-between p-16 ml-8">
@ -197,7 +198,7 @@ const submitHandle = () => {
const refresh = () => { const refresh = () => {
searchValue.value = '' searchValue.value = ''
knowledgeList.value= [] knowledgeList.value = []
getList() getList()
} }

6
ui/src/views/application/component/McpServersDialog.vue
View File

@ -14,7 +14,7 @@
:model="form" :model="form"
require-asterisk-position="right" require-asterisk-position="right"
> >
<el-form-item label="MCP" prop="mcp_enable"> <el-form-item label="MCP" prop="mcp_enable" @click.prevent>
<el-switch v-model="form.mcp_enable" /> <el-switch v-model="form.mcp_enable" />
</el-form-item> </el-form-item>
<el-form-item <el-form-item
@ -58,7 +58,7 @@ const mcpServerJson = `{
const form = ref<any>({ const form = ref<any>({
mcp_servers: '', mcp_servers: '',
mcp_enable: false mcp_enable: false,
}) })
const dialogVisible = ref<boolean>(false) const dialogVisible = ref<boolean>(false)
@ -67,7 +67,7 @@ watch(dialogVisible, (bool) => {
if (!bool) { if (!bool) {
form.value = { form.value = {
mcp_servers: '', mcp_servers: '',
mcp_enable: false mcp_enable: false,
} }
} }
}) })

7
ui/src/views/application/component/ParamSettingDialog.vue
View File

@ -156,7 +156,7 @@
</el-radio-group> </el-radio-group>
</el-form> </el-form>
</el-form-item> </el-form-item>
<el-form-item @click.prevent v-if="!isWorkflowType"> <el-form-item @click.prevent v-if="!isWorkflowType">
<template #label> <template #label>
<div class="flex align-center"> <div class="flex align-center">
<span class="mr-4">{{ <span class="mr-4">{{
@ -178,7 +178,6 @@
:placeholder="defaultPrompt" :placeholder="defaultPrompt"
/> />
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
</el-scrollbar> </el-scrollbar>
@ -198,6 +197,7 @@ import { ref, watch, reactive } from 'vue'
import type { FormInstance, FormRules } from 'element-plus' import type { FormInstance, FormRules } from 'element-plus'
import { isWorkFlow } from '@/utils/application' import { isWorkFlow } from '@/utils/application'
import { t } from '@/locales' import { t } from '@/locales'
import { cloneDeep } from 'lodash'
const emit = defineEmits(['refresh']) const emit = defineEmits(['refresh'])
const paramFormRef = ref() const paramFormRef = ref()
@ -285,10 +285,11 @@ watch(dialogVisible, (bool) => {
const open = (data: any, type?: string) => { const open = (data: any, type?: string) => {
isWorkflowType.value = isWorkFlow(type) isWorkflowType.value = isWorkFlow(type)
form.value = { form.value = {
knowledge_setting: { ...data.knowledge_setting }, knowledge_setting: cloneDeep(data.knowledge_setting),
problem_optimization: data.problem_optimization, problem_optimization: data.problem_optimization,
problem_optimization_prompt: data.problem_optimization_prompt, problem_optimization_prompt: data.problem_optimization_prompt,
} }
console.log(form.value.knowledge_setting.no_references_setting.status)
if (!isWorkflowType.value) { if (!isWorkflowType.value) {
noReferencesform.value[form.value.knowledge_setting.no_references_setting.status] = noReferencesform.value[form.value.knowledge_setting.no_references_setting.status] =
form.value.knowledge_setting.no_references_setting.value form.value.knowledge_setting.no_references_setting.value

17
ui/src/views/application/index.vue
View File

@ -2,14 +2,15 @@
<LayoutContainer showCollapse class="application-manage"> <LayoutContainer showCollapse class="application-manage">
<template #left> <template #left>
<h4 class="p-12-16 pb-0 mt-12">{{ $t('views.application.title') }}</h4> <h4 class="p-12-16 pb-0 mt-12">{{ $t('views.application.title') }}</h4>
<folder-tree <div class="p-8">
:source="SourceTypeEnum.APPLICATION" <folder-tree
:data="folderList" :source="SourceTypeEnum.APPLICATION"
:currentNodeKey="folder.currentFolder?.id" :data="folderList"
@handleNodeClick="folderClickHandle" :currentNodeKey="folder.currentFolder?.id"
@refreshTree="refreshFolder" @handleNodeClick="folderClickHandle"
class="p-8" @refreshTree="refreshFolder"
/> />
</div>
</template> </template>
<ContentContainer> <ContentContainer>
<template #header> <template #header>

21
ui/src/views/knowledge/index.vue
View File

@ -2,16 +2,17 @@
<LayoutContainer showCollapse class="knowledge-manage"> <LayoutContainer showCollapse class="knowledge-manage">
<template #left> <template #left>
<h4 class="p-12-16 pb-0 mt-12">{{ $t('views.knowledge.title') }}</h4> <h4 class="p-12-16 pb-0 mt-12">{{ $t('views.knowledge.title') }}</h4>
<folder-tree <div class="p-8">
:source="SourceTypeEnum.KNOWLEDGE" <folder-tree
:data="folderList" :source="SourceTypeEnum.KNOWLEDGE"
:currentNodeKey="folder.currentFolder?.id" :data="folderList"
@handleNodeClick="folderClickHandle" :currentNodeKey="folder.currentFolder?.id"
class="p-8" @handleNodeClick="folderClickHandle"
:shareTitle="$t('views.shared.shared_knowledge')" :shareTitle="$t('views.shared.shared_knowledge')"
:showShared="permissionPrecise['is_share']()" :showShared="permissionPrecise['is_share']()"
@refreshTree="refreshFolder" @refreshTree="refreshFolder"
/> />
</div>
</template> </template>
<KnowledgeListContainer @refreshFolder="refreshFolder"> <KnowledgeListContainer @refreshFolder="refreshFolder">
<template #header> <template #header>

21
ui/src/views/tool/index.vue
View File

@ -2,16 +2,17 @@
<LayoutContainer showCollapse class="tool-manage"> <LayoutContainer showCollapse class="tool-manage">
<template #left> <template #left>
<h4 class="p-12-16 pb-0 mt-12">{{ $t('views.tool.title') }}</h4> <h4 class="p-12-16 pb-0 mt-12">{{ $t('views.tool.title') }}</h4>
<folder-tree <div class="p-8">
:source="SourceTypeEnum.TOOL" <folder-tree
:data="folderList" :source="SourceTypeEnum.TOOL"
:currentNodeKey="folder.currentFolder?.id" :data="folderList"
@handleNodeClick="folderClickHandle" :currentNodeKey="folder.currentFolder?.id"
@refreshTree="refreshFolder" @handleNodeClick="folderClickHandle"
:shareTitle="$t('views.shared.shared_tool')" @refreshTree="refreshFolder"
:showShared="permissionPrecise['is_share']()" :shareTitle="$t('views.shared.shared_tool')"
class="p-8" :showShared="permissionPrecise['is_share']()"
/> />
</div>
</template> </template>
<ToolListContainer @refreshFolder="refreshFolder"> <ToolListContainer @refreshFolder="refreshFolder">
<template #header> <template #header>