Skip to content

Commit e9db3a5

Browse files
wxg0103wxg0103
committed
feat: add generate prompt button and improve code formatting in index.vue
1 parent e6b6727 commit e9db3a5

File tree

2 files changed

+98
-48
lines changed

2 files changed

+98
-48
lines changed

‎ui/src/workflow/nodes/image-understand/index.vue‎

Lines changed: 49 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@
2626
<div class="flex-between w-full">
2727
<div>
2828
<span
29-
>{{ t('views.applicationWorkflow.nodes.imageUnderstandNode.model.label')
29+
>{{
30+
t('views.applicationWorkflow.nodes.imageUnderstandNode.model.label')
3031
}}<span class="color-danger">*</span></span
3132
>
3233
</div>
@@ -68,6 +69,14 @@
6869
<AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
6970
</el-tooltip>
7071
</div>
72+
<el-button
73+
type="primary"
74+
link
75+
@click="openGeneratePromptDialog(form_data.model_id)"
76+
:disabled="!form_data.model_id"
77+
>
78+
<AppIcon iconName="app-generate-star"></AppIcon>
79+
</el-button>
7180
</div>
7281
</template>
7382
<MdEditorMagnify
@@ -91,12 +100,13 @@
91100
<div class="flex align-center">
92101
<div class="mr-4">
93102
<span
94-
>{{ $t('views.application.form.prompt.label')
103+
>{{
104+
$t('views.application.form.prompt.label')
95105
}}<span class="color-danger">*</span></span
96106
>
97107
</div>
98108
<el-tooltip effect="dark" placement="right" popper-class="max-w-200">
99-
<template #content>{{ $t('views.application.form.prompt.tooltip') }} </template>
109+
<template #content>{{ $t('views.application.form.prompt.tooltip') }}</template>
100110
<AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
101111
</el-tooltip>
102112
</div>
@@ -115,8 +125,8 @@
115125
<div class="flex-between">
116126
<div>{{ $t('views.application.form.historyRecord.label') }}</div>
117127
<el-select v-model="form_data.dialogue_type" type="small" style="width: 100px">
118-
<el-option :label="$t('views.applicationWorkflow.node')" value="NODE" />
119-
<el-option :label="$t('views.applicationWorkflow.workflow')" value="WORKFLOW" />
128+
<el-option :label="$t('views.applicationWorkflow.node')" value="NODE"/>
129+
<el-option :label="$t('views.applicationWorkflow.workflow')" value="WORKFLOW"/>
120130
</el-select>
121131
</div>
122132
</template>
@@ -142,7 +152,8 @@
142152
}"
143153
>
144154
<template #label
145-
>{{ $t('views.applicationWorkflow.nodes.imageUnderstandNode.image.label')
155+
>{{
156+
$t('views.applicationWorkflow.nodes.imageUnderstandNode.image.label')
146157
}}<span class="color-danger">*</span></template
147158
>
148159
<NodeCascader
@@ -163,8 +174,8 @@
163174
<div class="flex align-center">
164175
<div class="mr-4">
165176
<span>{{
166-
$t('views.applicationWorkflow.nodes.aiChatNode.returnContent.label')
167-
}}</span>
177+
$t('views.applicationWorkflow.nodes.aiChatNode.returnContent.label')
178+
}}</span>
168179
</div>
169180
<el-tooltip effect="dark" placement="right" popper-class="max-w-200">
170181
<template #content>
@@ -174,29 +185,32 @@
174185
</el-tooltip>
175186
</div>
176187
</template>
177-
<el-switch size="small" v-model="form_data.is_result" />
188+
<el-switch size="small" v-model="form_data.is_result"/>
178189
</el-form-item>
179190
</el-form>
180191
</el-card>
181-
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam" />
192+
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam"/>
193+
<GeneratePromptDialog @replace="replace" ref="GeneratePromptDialogRef"/>
182194
</NodeContainer>
183195
</template>
184196

185197
<script setup lang="ts">
186198
import NodeContainer from '@/workflow/common/NodeContainer.vue'
187-
import { computed, onMounted, ref, inject } from 'vue'
188-
import { groupBy, set } from 'lodash'
199+
import {computed, onMounted, ref, inject} from 'vue'
200+
import {groupBy, set} from 'lodash'
189201
import NodeCascader from '@/workflow/common/NodeCascader.vue'
190-
import type { FormInstance } from 'element-plus'
202+
import type {FormInstance} from 'element-plus'
191203
import AIModeParamSettingDialog from '@/views/application/component/AIModeParamSettingDialog.vue'
192-
import { t } from '@/locales'
193-
import { useRoute } from 'vue-router'
194-
import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
204+
import {t} from '@/locales'
205+
import {useRoute} from 'vue-router'
206+
import {loadSharedApi} from '@/utils/dynamics-api/shared-api'
207+
import GeneratePromptDialog from "@/views/application/component/GeneratePromptDialog.vue";
208+
195209
const getApplicationDetail = inject('getApplicationDetail') as any
196210
const route = useRoute()
197211
198212
const {
199-
params: { id },
213+
params: {id},
200214
} = route as any
201215
202216
const apiType = computed(() => {
@@ -218,7 +232,7 @@ const validate = () => {
218232
nodeCascaderRef.value ? nodeCascaderRef.value.validate() : Promise.resolve(''),
219233
aiChatNodeFormRef.value?.validate(),
220234
]).catch((err: any) => {
221-
return Promise.reject({ node: props.nodeModel, errMessage: err })
235+
return Promise.reject({node: props.nodeModel, errMessage: err})
222236
})
223237
}
224238
@@ -261,17 +275,18 @@ const form_data = computed({
261275
})
262276
263277
const application = getApplicationDetail()
278+
264279
function getSelectModel() {
265280
const obj =
266281
apiType.value === 'systemManage'
267282
? {
268-
model_type: 'IMAGE',
269-
workspace_id: application.value?.workspace_id,
270-
}
283+
model_type: 'IMAGE',
284+
workspace_id: application.value?.workspace_id,
285+
}
271286
: {
272-
model_type: 'IMAGE',
273-
}
274-
loadSharedApi({ type: 'model', systemType: apiType.value })
287+
model_type: 'IMAGE',
288+
}
289+
loadSharedApi({type: 'model', systemType: apiType.value})
275290
.getSelectModelList(obj)
276291
.then((res: any) => {
277292
modelOptions.value = groupBy(res?.data, 'provider')
@@ -296,6 +311,16 @@ function refreshParam(data: any) {
296311
set(props.nodeModel.properties.node_data, 'model_params_setting', data)
297312
}
298313
314+
const GeneratePromptDialogRef = ref<InstanceType<typeof GeneratePromptDialog>>()
315+
const openGeneratePromptDialog = (modelId: string) => {
316+
if (modelId) {
317+
GeneratePromptDialogRef.value?.open(modelId, id)
318+
}
319+
}
320+
const replace = (v: any) => {
321+
set(props.nodeModel.properties.node_data, 'system', v)
322+
}
323+
299324
onMounted(() => {
300325
getSelectModel()
301326

‎ui/src/workflow/nodes/video-understand/index.vue‎

Lines changed: 49 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@
2626
<div class="flex-between w-full">
2727
<div>
2828
<span
29-
>{{ t('views.applicationWorkflow.nodes.videoUnderstandNode.model.label')
29+
>{{
30+
t('views.applicationWorkflow.nodes.videoUnderstandNode.model.label')
3031
}}<span class="color-danger">*</span></span
3132
>
3233
</div>
@@ -68,6 +69,14 @@
6869
<AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
6970
</el-tooltip>
7071
</div>
72+
<el-button
73+
type="primary"
74+
link
75+
@click="openGeneratePromptDialog(form_data.model_id)"
76+
:disabled="!form_data.model_id"
77+
>
78+
<AppIcon iconName="app-generate-star"></AppIcon>
79+
</el-button>
7180
</div>
7281
</template>
7382
<MdEditorMagnify
@@ -91,15 +100,17 @@
91100
<div class="flex align-center">
92101
<div class="mr-4">
93102
<span
94-
>{{ $t('views.application.form.prompt.label')
103+
>{{
104+
$t('views.application.form.prompt.label')
95105
}}<span class="color-danger">*</span></span
96106
>
97107
</div>
98108
<el-tooltip effect="dark" placement="right" popper-class="max-w-200">
99-
<template #content>{{ $t('views.application.form.prompt.tooltip') }} </template>
109+
<template #content>{{ $t('views.application.form.prompt.tooltip') }}</template>
100110
<AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
101111
</el-tooltip>
102112
</div>
113+
103114
</template>
104115
<MdEditorMagnify
105116
@wheel="wheel"
@@ -115,8 +126,8 @@
115126
<div class="flex-between">
116127
<div>{{ $t('views.application.form.historyRecord.label') }}</div>
117128
<el-select v-model="form_data.dialogue_type" type="small" style="width: 100px">
118-
<el-option :label="$t('views.applicationWorkflow.node')" value="NODE" />
119-
<el-option :label="$t('views.applicationWorkflow.workflow')" value="WORKFLOW" />
129+
<el-option :label="$t('views.applicationWorkflow.node')" value="NODE"/>
130+
<el-option :label="$t('views.applicationWorkflow.workflow')" value="WORKFLOW"/>
120131
</el-select>
121132
</div>
122133
</template>
@@ -142,7 +153,8 @@
142153
}"
143154
>
144155
<template #label
145-
>{{ $t('views.applicationWorkflow.nodes.videoUnderstandNode.image.label')
156+
>{{
157+
$t('views.applicationWorkflow.nodes.videoUnderstandNode.image.label')
146158
}}<span class="color-danger">*</span></template
147159
>
148160
<NodeCascader
@@ -163,8 +175,8 @@
163175
<div class="flex align-center">
164176
<div class="mr-4">
165177
<span>{{
166-
$t('views.applicationWorkflow.nodes.aiChatNode.returnContent.label')
167-
}}</span>
178+
$t('views.applicationWorkflow.nodes.aiChatNode.returnContent.label')
179+
}}</span>
168180
</div>
169181
<el-tooltip effect="dark" placement="right" popper-class="max-w-200">
170182
<template #content>
@@ -174,29 +186,32 @@
174186
</el-tooltip>
175187
</div>
176188
</template>
177-
<el-switch size="small" v-model="form_data.is_result" />
189+
<el-switch size="small" v-model="form_data.is_result"/>
178190
</el-form-item>
179191
</el-form>
180192
</el-card>
181-
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam" />
193+
<AIModeParamSettingDialog ref="AIModeParamSettingDialogRef" @refresh="refreshParam"/>
194+
<GeneratePromptDialog @replace="replace" ref="GeneratePromptDialogRef"/>
182195
</NodeContainer>
183196
</template>
184197

185198
<script setup lang="ts">
186199
import NodeContainer from '@/workflow/common/NodeContainer.vue'
187-
import { computed, onMounted, ref, inject } from 'vue'
188-
import { groupBy, set } from 'lodash'
200+
import {computed, onMounted, ref, inject} from 'vue'
201+
import {groupBy, set} from 'lodash'
189202
import NodeCascader from '@/workflow/common/NodeCascader.vue'
190-
import type { FormInstance } from 'element-plus'
203+
import type {FormInstance} from 'element-plus'
191204
import AIModeParamSettingDialog from '@/views/application/component/AIModeParamSettingDialog.vue'
192-
import { t } from '@/locales'
193-
import { useRoute } from 'vue-router'
194-
import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
205+
import {t} from '@/locales'
206+
import {useRoute} from 'vue-router'
207+
import {loadSharedApi} from '@/utils/dynamics-api/shared-api'
208+
import GeneratePromptDialog from "@/views/application/component/GeneratePromptDialog.vue";
209+
195210
const getApplicationDetail = inject('getApplicationDetail') as any
196211
const route = useRoute()
197212
198213
const {
199-
params: { id },
214+
params: {id},
200215
} = route as any
201216
202217
const apiType = computed(() => {
@@ -218,7 +233,7 @@ const validate = () => {
218233
nodeCascaderRef.value ? nodeCascaderRef.value.validate() : Promise.resolve(''),
219234
aiChatNodeFormRef.value?.validate(),
220235
]).catch((err: any) => {
221-
return Promise.reject({ node: props.nodeModel, errMessage: err })
236+
return Promise.reject({node: props.nodeModel, errMessage: err})
222237
})
223238
}
224239
@@ -261,17 +276,18 @@ const form_data = computed({
261276
})
262277
263278
const application = getApplicationDetail()
279+
264280
function getSelectModel() {
265281
const obj =
266282
apiType.value === 'systemManage'
267283
? {
268-
model_type: 'IMAGE',
269-
workspace_id: application.value?.workspace_id,
270-
}
284+
model_type: 'IMAGE',
285+
workspace_id: application.value?.workspace_id,
286+
}
271287
: {
272-
model_type: 'IMAGE',
273-
}
274-
loadSharedApi({ type: 'model', systemType: apiType.value })
288+
model_type: 'IMAGE',
289+
}
290+
loadSharedApi({type: 'model', systemType: apiType.value})
275291
.getSelectModelList(obj)
276292
.then((res: any) => {
277293
modelOptions.value = groupBy(res?.data, 'provider')
@@ -291,6 +307,15 @@ const openAIParamSettingDialog = (modelId: string) => {
291307
AIModeParamSettingDialogRef.value?.open(modelId, id, form_data.value.model_params_setting)
292308
}
293309
}
310+
const GeneratePromptDialogRef = ref<InstanceType<typeof GeneratePromptDialog>>()
311+
const openGeneratePromptDialog = (modelId: string) => {
312+
if (modelId) {
313+
GeneratePromptDialogRef.value?.open(modelId, id)
314+
}
315+
}
316+
const replace = (v: any) => {
317+
set(props.nodeModel.properties.node_data, 'system', v)
318+
}
294319
295320
function refreshParam(data: any) {
296321
set(props.nodeModel.properties.node_data, 'model_params_setting', data)

0 commit comments

Comments
 (0)