Skip to content

feat: Update function setting style #2573

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Mar 17, 2025
Merged

feat: Update function setting style #2573

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ui/src/locales/lang/zh-CN/views/function-lib.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export default {
},
form: {
functionName: {
label: '函数名称',
label: '名称',
placeholder: '请输入函数名称',
requiredMessage: '请输入函数名称'
},
Expand Down
2 changes: 1 addition & 1 deletion ui/src/locales/lang/zh-Hant/views/function-lib.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export default {
},
form: {
functionName: {
label: '函數名稱',
label: '名稱',
placeholder: '請輸入函數名稱',
requiredMessage: '請輸入函數名稱'
},
Expand Down
2 changes: 1 addition & 1 deletion ui/src/utils/application.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
export const defaultIcon = '/ui/favicon.ico'

// 是否显示字母 / icon
export function isAppIcon(url: string | undefined) {
export function isAppIcon(url: String | undefined) {
return url === defaultIcon ? '' : url
}

Expand Down
49 changes: 23 additions & 26 deletions ui/src/views/application/component/ParamSettingDialog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,32 +131,29 @@
v-model="form.dataset_setting.no_references_setting.status"
class="radio-block"
>
<div>
<el-radio value="ai_questioning">
<p>
{{ $t('views.application.applicationForm.dialog.continueQuestioning') }}
</p>
</el-radio>
</div>
<div>
<el-radio value="designated_answer">
<p>{{ $t('views.application.applicationForm.dialog.provideAnswer') }}</p>
<el-form-item
v-if="
form.dataset_setting.no_references_setting.status === 'designated_answer'
"
prop="designated_answer"
>
<el-input
v-model="noReferencesform.designated_answer"
:rows="2"
type="textarea"
maxlength="2048"
:placeholder="defaultValue['designated_answer']"
/>
</el-form-item>
</el-radio>
</div>
<el-radio value="ai_questioning">
<p>
{{ $t('views.application.applicationForm.dialog.continueQuestioning') }}
</p>
</el-radio>

<el-radio value="designated_answer">
<p>{{ $t('views.application.applicationForm.dialog.provideAnswer') }}</p>
<el-form-item
v-if="
form.dataset_setting.no_references_setting.status === 'designated_answer'
"
prop="designated_answer"
>
<el-input
v-model="noReferencesform.designated_answer"
:rows="2"
type="textarea"
maxlength="2048"
:placeholder="defaultValue['designated_answer']"
/>
</el-form-item>
</el-radio>
</el-radio-group>
</el-form>
</el-form-item>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No significant issues were found in the provided CSS code snippet. It appears to be properly formatted and contains no syntax errors or missing components. The structure of the el-radio-group with nested radio buttons is correct, ensuring that users can choose between "continueQuestioning" or "provideAnswer". There are also two instances where duplicate content has been removed for consistency.

This CSS should work as intended without further modifications. If you need to implement any specific changes based on additional context, I'd be happy to help suggest those!

Expand Down
2 changes: 1 addition & 1 deletion ui/src/views/function-lib/component/EditAvatarDialog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<template>
<el-dialog
:title="$t('views.applicationOverview.appInfo.EditAvatarDialog.title')"
:title="`Logo ${$t('common.setting')}`"
v-model="dialogVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
Expand Down
91 changes: 48 additions & 43 deletions ui/src/views/function-lib/component/FunctionFormDrawer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,47 +20,54 @@
:label="$t('views.functionLib.functionForm.form.functionName.label')"
prop="name"
>
<div v-if="form.id"
class="edit-avatar mr-12"
@mouseenter="showEditIcon = true"
@mouseleave="showEditIcon = false"
>
<AppAvatar
v-if="isAppIcon(form.icon as string)"
:id="form.id"
shape="square"
:size="32"
style="background: none"
<div class="flex w-full">
<div
v-if="form.id"
class="edit-avatar mr-12"
@mouseenter="showEditIcon = true"
@mouseleave="showEditIcon = false"
>
<img :src="form.icon as string" alt="" />
<AppAvatar
v-if="isAppIcon(form.icon)"
:id="form.id"
shape="square"
:size="32"
style="background: none"
>
<img :src="String(form.icon)" alt="" />
</AppAvatar>
<AppAvatar
v-else-if="form.name"
:id="form.id"
:name="form.name"
pinyinColor
shape="square"
:size="32"
/>
<AppAvatar
v-if="showEditIcon"
:id="form.id"
shape="square"
class="edit-mask"
:size="32"
@click="openEditAvatar"
>
<el-icon><EditPen /></el-icon>
</AppAvatar>
</div>
<AppAvatar shape="square" style="background: #34c724" class="mr-12" v-else>
<img src="@/assets/icon_function_outlined.svg" style="width: 75%" alt="" />
</AppAvatar>
<AppAvatar
v-else-if="form.name"
:id="form.id"
:name="form.name"
pinyinColor
shape="square"
:size="32"
<el-input
v-model="form.name"
:placeholder="$t('views.functionLib.functionForm.form.functionName.placeholder')"
maxlength="64"
show-word-limit
@blur="form.name = form.name?.trim()"
/>
<AppAvatar
v-if="showEditIcon"
:id="form.id"
shape="square"
class="edit-mask"
:size="32"
@click="openEditAvatar"
>
<el-icon><EditPen /></el-icon>
</AppAvatar>
</div>
<el-input
v-model="form.name"
:placeholder="$t('views.functionLib.functionForm.form.functionName.placeholder')"
maxlength="64"
show-word-limit
@blur="form.name = form.name?.trim()"
/>
</el-form-item>

<el-form-item :label="$t('views.functionLib.functionForm.form.functionDescription.label')">
<el-input
v-model="form.desc"
Expand All @@ -72,7 +79,7 @@
@blur="form.desc = form.desc?.trim()"
/>
</el-form-item>
<!--
<!--
<el-form-item prop="permission_type">
<template #label>
<span>{{ $t('views.functionLib.functionForm.form.permission_type.label') }}</span>
Expand Down Expand Up @@ -110,7 +117,7 @@
</el-button>
</div>
<el-table :data="form.init_field_list" class="mb-16">
<el-table-column prop="field" :label="$t('dynamicsForm.paramForm.field.label')" >
<el-table-column prop="field" :label="$t('dynamicsForm.paramForm.field.label')">
<template #default="{ row }">
<span :title="row.field" class="ellipsis-1">{{ row.field }}</span>
</template>
Expand Down Expand Up @@ -266,7 +273,7 @@

<FunctionDebugDrawer ref="FunctionDebugDrawerRef" />
<FieldFormDialog ref="FieldFormDialogRef" @refresh="refreshFieldList" />
<UserFieldFormDialog ref="UserFieldFormDialogRef" @refresh="refreshInitFieldList"/>
<UserFieldFormDialog ref="UserFieldFormDialogRef" @refresh="refreshInitFieldList" />
<EditAvatarDialog ref="EditAvatarDialogRef" @refresh="refreshFunctionLib" />
</el-drawer>
</template>
Expand All @@ -283,8 +290,8 @@ import { cloneDeep } from 'lodash'
import { PermissionType, PermissionDesc } from '@/enums/model'
import { t } from '@/locales'
import UserFieldFormDialog from '@/workflow/nodes/base-node/component/UserFieldFormDialog.vue'
import {isAppIcon} from "@/utils/application";
import EditAvatarDialog from "./EditAvatarDialog.vue";
import { isAppIcon } from '@/utils/application'
import EditAvatarDialog from './EditAvatarDialog.vue'

const props = defineProps({
title: String
Expand Down Expand Up @@ -402,7 +409,6 @@ function refreshFieldList(data: any) {
currentIndex.value = null
}


function openAddInitDialog(data?: any, index?: any) {
if (typeof index !== 'undefined') {
currentIndex.value = index
Expand Down Expand Up @@ -434,7 +440,6 @@ function openEditAvatar() {
EditAvatarDialogRef.value.open(form.value)
}


const submit = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid: any) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code appears to be well-written and mostly functional, but there are a few minor issues that could potentially improve readability or performance:

  1. Use of as keyword: In TypeScript, it's not recommended to use the as keyword for type assertions. You can directly assign types using the colon (:).

    class A {}

let a: A = new A() // Correct

  2. Unnecessary semicolons: While semicolons at the end of statements are syntactically required, they do not need to be included unless absolutely necessary.

  3. Empty comment block: The empty comment block between lines 105 and 106 doesn't contribute anything useful and should likely be removed.

  4. Unused variables: It seems like some unused variables (currentIndex, permissionTypes, etc.) have been added without being used throughout the component.

Here is an optimized version of the relevant section with these improvements:

<template>
  <el-drawer
    v-model="drawerVisible"
    size="50%"
    @close="onCloseDrawer"
    append-to-body
  >
    <template #header slot-scope="{ close }">
      {{ title }}
      <el-button @click="close" style="float: right; padding: 0;">X</el-button>
    </template>

    <div class="px-8 pb-2">...</div> <!-- Continue rest -->

<script lang='ts'>
// Import statements remain unchanged

const currentStepValue = ref<number>(0);
const permissionTypes = [
  PermissionType.Public,
  PermissionType.Protected,
  PermissionType.Private,
] as number[] | string[];

function onChange(current_step_index_num) {
  currentStepValue.value = parseInt(String(current_step_index_num), 10);
}

function onRefresh(stepIndexNum?: number): void {
  refreshInitFieldList();

  if (stepIndexNum > currentIndex.value) return;

  currentIndex.value = stepIndexNum;
}
//

These changes make the code cleaner and more maintainable while maintaining its functionality.

Expand Down
28 changes: 15 additions & 13 deletions ui/src/views/function-lib/component/PermissionDialog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
:close-on-press-escape="false"
:destroy-on-close="true"
append-to-body
width="450"
>
<el-form
label-position="top"
Expand All @@ -14,17 +15,20 @@
:model="form"
require-asterisk-position="right"
>
<el-radio-group v-model="form.permission_type">
<el-radio value="PRIVATE">
<el-radio-group v-model="form.permission_type" class="radio-block">
<el-radio value="PRIVATE" size="large" class="mb-16">
{{ $t('common.private') }}
{{ $t('views.template.templateForm.form.permissionType.privateDesc') }}
<el-text type="info">{{
$t('views.template.templateForm.form.permissionType.privateDesc')
}}</el-text>
</el-radio>
<el-radio value="PUBLIC">
<el-radio value="PUBLIC" size="large">
{{ $t('common.public') }}
{{ $t('views.template.templateForm.form.permissionType.publicDesc') }}
<el-text type="info">{{
$t('views.template.templateForm.form.permissionType.publicDesc')
}}</el-text>
</el-radio>
</el-radio-group>

</el-form>
<template #footer>
<span class="dialog-footer">
Expand All @@ -44,7 +48,6 @@ import { t } from '@/locales'
import functionLibApi from '@/api/function-lib'
import { MsgSuccess } from '@/utils/message'


const emit = defineEmits(['refresh'])

const fieldFormRef = ref()
Expand Down Expand Up @@ -89,12 +92,11 @@ const submit = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid) => {
if (valid) {
functionLibApi.putFunctionLib(form.value?.id as string, form.value, loading)
.then((res) => {
MsgSuccess(t('common.editSuccess'))
emit('refresh')
dialogVisible.value = false
})
functionLibApi.putFunctionLib(form.value?.id as string, form.value, loading).then((res) => {
MsgSuccess(t('common.editSuccess'))
emit('refresh')
dialogVisible.value = false
})
}
})
}
Expand Down
Loading