feat: add generate prompt button and improve code formatting in index.vue

v3.2
wxg0103 2025-10-28 15:11:04 +08:00
parent e6b67274a3
commit e9db3a598c
2 changed files with 98 additions and 48 deletions

View File

@ -26,7 +26,8 @@
<div class="flex-between w-full">
<div>
<span
>{{ t('views.applicationWorkflow.nodes.imageUnderstandNode.model.label')
>{{
t('views.applicationWorkflow.nodes.imageUnderstandNode.model.label')
}}<span class="color-danger">*</span></span
>
</div>
@ -68,6 +69,14 @@
<AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
</el-tooltip>
</div>
<el-button
type="primary"
link
@click="openGeneratePromptDialog(form_data.model_id)"
:disabled="!form_data.model_id"
>
<AppIcon iconName="app-generate-star"></AppIcon>
</el-button>
</div>
</template>
<MdEditorMagnify
@ -91,7 +100,8 @@
<div class="flex align-center">
<div class="mr-4">
<span
>{{ $t('views.application.form.prompt.label')
>{{
$t('views.application.form.prompt.label')
}}<span class="color-danger">*</span></span
>
</div>
@ -142,7 +152,8 @@
}"
>
<template #label
>{{ $t('views.applicationWorkflow.nodes.imageUnderstandNode.image.label')
>{{
$t('views.applicationWorkflow.nodes.imageUnderstandNode.image.label')
}}<span class="color-danger">*</span></template
>
<NodeCascader
@ -179,6 +190,7 @@
</el-form>
</el-card>
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam"/>
<GeneratePromptDialog @replace="replace" ref="GeneratePromptDialogRef"/>
</NodeContainer>
</template>
@ -192,6 +204,8 @@ import AIModeParamSettingDialog from '@/views/application/component/AIModeParamS
import {t} from '@/locales'
import {useRoute} from 'vue-router'
import {loadSharedApi} from '@/utils/dynamics-api/shared-api'
import GeneratePromptDialog from "@/views/application/component/GeneratePromptDialog.vue";
const getApplicationDetail = inject('getApplicationDetail') as any
const route = useRoute()
@ -261,6 +275,7 @@ const form_data = computed({
})
const application = getApplicationDetail()
function getSelectModel() {
const obj =
apiType.value === 'systemManage'
@ -296,6 +311,16 @@ function refreshParam(data: any) {
set(props.nodeModel.properties.node_data, 'model_params_setting', data)
}
const GeneratePromptDialogRef = ref<InstanceType<typeof GeneratePromptDialog>>()
const openGeneratePromptDialog = (modelId: string) => {
if (modelId) {
GeneratePromptDialogRef.value?.open(modelId, id)
}
}
const replace = (v: any) => {
set(props.nodeModel.properties.node_data, 'system', v)
}
onMounted(() => {
getSelectModel()

View File

@ -26,7 +26,8 @@
<div class="flex-between w-full">
<div>
<span
>{{ t('views.applicationWorkflow.nodes.videoUnderstandNode.model.label')
>{{
t('views.applicationWorkflow.nodes.videoUnderstandNode.model.label')
}}<span class="color-danger">*</span></span
>
</div>
@ -68,6 +69,14 @@
<AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
</el-tooltip>
</div>
<el-button
type="primary"
link
@click="openGeneratePromptDialog(form_data.model_id)"
:disabled="!form_data.model_id"
>
<AppIcon iconName="app-generate-star"></AppIcon>
</el-button>
</div>
</template>
<MdEditorMagnify
@ -91,7 +100,8 @@
<div class="flex align-center">
<div class="mr-4">
<span
>{{ $t('views.application.form.prompt.label')
>{{
$t('views.application.form.prompt.label')
}}<span class="color-danger">*</span></span
>
</div>
@ -100,6 +110,7 @@
<AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
</el-tooltip>
</div>
</template>
<MdEditorMagnify
@wheel="wheel"
@ -142,7 +153,8 @@
}"
>
<template #label
>{{ $t('views.applicationWorkflow.nodes.videoUnderstandNode.image.label')
>{{
$t('views.applicationWorkflow.nodes.videoUnderstandNode.image.label')
}}<span class="color-danger">*</span></template
>
<NodeCascader
@ -179,6 +191,7 @@
</el-form>
</el-card>
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam"/>
<GeneratePromptDialog @replace="replace" ref="GeneratePromptDialogRef"/>
</NodeContainer>
</template>
@ -192,6 +205,8 @@ import AIModeParamSettingDialog from '@/views/application/component/AIModeParamS
import {t} from '@/locales'
import {useRoute} from 'vue-router'
import {loadSharedApi} from '@/utils/dynamics-api/shared-api'
import GeneratePromptDialog from "@/views/application/component/GeneratePromptDialog.vue";
const getApplicationDetail = inject('getApplicationDetail') as any
const route = useRoute()
@ -261,6 +276,7 @@ const form_data = computed({
})
const application = getApplicationDetail()
function getSelectModel() {
const obj =
apiType.value === 'systemManage'
@ -291,6 +307,15 @@ const openAIParamSettingDialog = (modelId: string) => {
AIModeParamSettingDialogRef.value?.open(modelId, id, form_data.value.model_params_setting)
}
}
const GeneratePromptDialogRef = ref<InstanceType<typeof GeneratePromptDialog>>()
const openGeneratePromptDialog = (modelId: string) => {
if (modelId) {
GeneratePromptDialogRef.value?.open(modelId, id)
}
}
const replace = (v: any) => {
set(props.nodeModel.properties.node_data, 'system', v)
}
function refreshParam(data: any) {
set(props.nodeModel.properties.node_data, 'model_params_setting', data)