diff --git a/packages/web/components/common/Icon/constants.ts b/packages/web/components/common/Icon/constants.ts index a3b7441d13ae..e6d3d82bbc47 100644 --- a/packages/web/components/common/Icon/constants.ts +++ b/packages/web/components/common/Icon/constants.ts @@ -5,6 +5,7 @@ export const iconPaths = { change: () => import('./icons/change.svg'), chatSend: () => import('./icons/chatSend.svg'), check: () => import('./icons/check.svg'), + checkCircle: () => import('./icons/checkCircle.svg'), closeSolid: () => import('./icons/closeSolid.svg'), collectionLight: () => import('./icons/collectionLight.svg'), collectionSolid: () => import('./icons/collectionSolid.svg'), @@ -184,6 +185,7 @@ export const iconPaths = { 'core/workflow/debugNext': () => import('./icons/core/workflow/debugNext.svg'), 'core/workflow/debugResult': () => import('./icons/core/workflow/debugResult.svg'), 'core/workflow/edgeArrow': () => import('./icons/core/workflow/edgeArrow.svg'), + 'core/workflow/edgeArrowBold': () => import('./icons/core/workflow/edgeArrowBold.svg'), 'core/workflow/grout': () => import('./icons/core/workflow/grout.svg'), 'core/workflow/inputType/array': () => import('./icons/core/workflow/inputType/array.svg'), 'core/workflow/inputType/customVariable': () => diff --git a/packages/web/components/common/Icon/icons/check.svg b/packages/web/components/common/Icon/icons/check.svg index 5332e60860e5..d43d66d291cf 100644 --- a/packages/web/components/common/Icon/icons/check.svg +++ b/packages/web/components/common/Icon/icons/check.svg @@ -1,3 +1,3 @@ - - + + \ No newline at end of file diff --git a/packages/web/components/common/Icon/icons/checkCircle.svg b/packages/web/components/common/Icon/icons/checkCircle.svg new file mode 100644 index 000000000000..1c41452e0b94 --- /dev/null +++ b/packages/web/components/common/Icon/icons/checkCircle.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/packages/web/components/common/Icon/icons/common/file/move.svg b/packages/web/components/common/Icon/icons/common/file/move.svg index 7e23ef30fa84..38465aaabff3 100644 --- a/packages/web/components/common/Icon/icons/common/file/move.svg +++ b/packages/web/components/common/Icon/icons/common/file/move.svg @@ -1 +1,6 @@ - \ No newline at end of file + + + + + + \ No newline at end of file diff --git a/packages/web/components/common/Icon/icons/core/workflow/edgeArrowBold.svg b/packages/web/components/common/Icon/icons/core/workflow/edgeArrowBold.svg new file mode 100644 index 000000000000..bca309065992 --- /dev/null +++ b/packages/web/components/common/Icon/icons/core/workflow/edgeArrowBold.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/packages/web/components/common/MyBox/IconButton.tsx b/packages/web/components/common/MyBox/IconButton.tsx new file mode 100644 index 000000000000..a812301ed434 --- /dev/null +++ b/packages/web/components/common/MyBox/IconButton.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { Flex, FlexProps } from '@chakra-ui/react'; +import MyIcon from '../Icon'; + +type Props = FlexProps & { + icon: string; + onClick?: () => void; + hoverColor?: string; +}; + +const IconButton = ({ icon, onClick, hoverColor = 'primary.600', ...props }: Props) => { + return ( + + + + ); +}; + +export default IconButton; diff --git a/packages/web/components/common/MyMenu/index.tsx b/packages/web/components/common/MyMenu/index.tsx index c051283562aa..5a72fa655868 100644 --- a/packages/web/components/common/MyMenu/index.tsx +++ b/packages/web/components/common/MyMenu/index.tsx @@ -7,22 +7,26 @@ import { useOutsideClick, MenuButton, MenuItemProps, - PlacementWithLogical + PlacementWithLogical, + AvatarProps, + BoxProps, + DividerProps } from '@chakra-ui/react'; import MyDivider from '../MyDivider'; import type { IconNameType } from '../Icon/type'; import { useSystem } from '../../../hooks/useSystem'; import Avatar from '../Avatar'; -export type MenuItemType = 'primary' | 'danger'; +export type MenuItemType = 'primary' | 'danger' | 'gray' | 'grayBg'; + +export type MenuSizeType = 'sm' | 'md' | 'xs' | 'mini'; export type Props = { width?: number | string; offset?: [number, number]; Button: React.ReactNode; trigger?: 'hover' | 'click'; - iconSize?: string; - iconRadius?: string; + size?: MenuSizeType; placement?: PlacementWithLogical; menuList: { @@ -42,14 +46,13 @@ export type Props = { const MyMenu = ({ width = 'auto', trigger = 'hover', + size = 'sm', offset, - iconSize = '1rem', Button, menuList, - iconRadius, placement = 'bottom-start' }: Props) => { - const typeMapStyle: Record = { + const typeMapStyle: Record = { primary: { _hover: { backgroundColor: 'primary.50', @@ -62,7 +65,38 @@ const MyMenu = ({ _active: { backgroundColor: 'primary.50', color: 'primary.600' - } + }, + iconColor: 'myGray.600' + }, + gray: { + _hover: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + _focus: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + _active: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + iconColor: 'myGray.400' + }, + grayBg: { + _hover: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + _focus: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + _active: { + backgroundColor: 'myGray.05', + color: 'primary.600' + }, + iconColor: 'myGray.600' }, danger: { color: 'red.600', @@ -74,6 +108,84 @@ const MyMenu = ({ }, _active: { background: 'red.1' + }, + iconColor: 'red.600' + } + }; + const sizeMapStyle: Record< + MenuSizeType, + { + iconStyle: AvatarProps; + labelStyle: BoxProps; + dividerStyle: DividerProps; + menuItemStyle: MenuItemProps; + } + > = { + mini: { + iconStyle: { + w: '14px' + }, + labelStyle: { + fontSize: 'mini' + }, + dividerStyle: { + my: 0.5 + }, + menuItemStyle: { + py: 1.5, + px: 2 + } + }, + xs: { + iconStyle: { + w: '14px' + }, + labelStyle: { + fontSize: 'sm' + }, + dividerStyle: { + my: 0.5 + }, + menuItemStyle: { + py: 1.5, + px: 2 + } + }, + sm: { + iconStyle: { + w: '1rem' + }, + labelStyle: { + fontSize: 'sm' + }, + dividerStyle: { + my: 1 + }, + menuItemStyle: { + py: 2, + px: 3, + _notLast: { + mb: 0.5 + } + } + }, + md: { + iconStyle: { + w: '2rem', + borderRadius: '6px' + }, + labelStyle: { + fontSize: 'sm' + }, + dividerStyle: { + my: 1 + }, + menuItemStyle: { + py: 2, + px: 3, + _notLast: { + mb: 0.5 + } } } }; @@ -165,7 +277,7 @@ const MyMenu = ({ return ( {item.label && {item.label}} - {i !== 0 && } + {i !== 0 && } {item.children.map((child, index) => ( {!!child.icon && ( )} {child.label} diff --git a/packages/web/components/common/Tabs/FillRowTabs.tsx b/packages/web/components/common/Tabs/FillRowTabs.tsx index b788e4271294..7388af742820 100644 --- a/packages/web/components/common/Tabs/FillRowTabs.tsx +++ b/packages/web/components/common/Tabs/FillRowTabs.tsx @@ -18,12 +18,13 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props display={'inline-flex'} px={'3px'} py={'3px'} - borderRadius={'md'} + borderRadius={'sm'} borderWidth={'1px'} - borderColor={'borderColor.base'} + borderColor={'myGray.200'} bg={'myGray.50'} gap={'4px'} fontSize={'sm'} + fontWeight={'medium'} {...props} > {list.map((item) => ( @@ -33,7 +34,7 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props alignItems={'center'} justifyContent={'center'} cursor={'pointer'} - borderRadius={'md'} + borderRadius={'xs'} px={px} py={py} userSelect={'none'} @@ -45,10 +46,14 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props color: 'primary.600' } : { + color: 'myGray.500', + _hover: { + color: 'primary.600' + }, onClick: () => onChange(item.value) })} > - {item.icon && } + {item.icon && } {item.label} ))} diff --git a/packages/web/components/common/Textarea/JsonEditor/index.tsx b/packages/web/components/common/Textarea/JsonEditor/index.tsx index feea41284080..8a8e3f298317 100644 --- a/packages/web/components/common/Textarea/JsonEditor/index.tsx +++ b/packages/web/components/common/Textarea/JsonEditor/index.tsx @@ -224,8 +224,8 @@ const JSONEditor = ({ {resize && ( {placeholder} diff --git a/packages/web/components/common/Textarea/PromptEditor/Editor.tsx b/packages/web/components/common/Textarea/PromptEditor/Editor.tsx index ce85e7d651c9..a76cc136e006 100644 --- a/packages/web/components/common/Textarea/PromptEditor/Editor.tsx +++ b/packages/web/components/common/Textarea/PromptEditor/Editor.tsx @@ -105,8 +105,8 @@ export default function Editor({ left={0} right={0} bottom={0} - py={2} - px={3} + py={3} + px={3.5} pointerEvents={'none'} overflow={'hidden'} > diff --git a/packages/web/components/common/Textarea/PromptEditor/plugins/VariableLabelPlugin/components/VariableLabel.tsx b/packages/web/components/common/Textarea/PromptEditor/plugins/VariableLabelPlugin/components/VariableLabel.tsx index 2190c65e03fe..d8afc2749699 100644 --- a/packages/web/components/common/Textarea/PromptEditor/plugins/VariableLabelPlugin/components/VariableLabel.tsx +++ b/packages/web/components/common/Textarea/PromptEditor/plugins/VariableLabelPlugin/components/VariableLabel.tsx @@ -1,5 +1,5 @@ import { ChevronRightIcon } from '@chakra-ui/icons'; -import { Box } from '@chakra-ui/react'; +import { Box, Flex } from '@chakra-ui/react'; import { useTranslation } from 'next-i18next'; import Avatar from '../../../../../../../components/common/Avatar'; @@ -28,7 +28,7 @@ export default function VariableLabel({ color={parentLabel !== 'undefined' ? 'myGray.900' : 'red.600'} > {parentLabel !== 'undefined' ? ( - + {parentLabel} - + {childLabel} - + ) : ( <> {t('common:invalid_variable')} diff --git a/packages/web/components/core/workflow/NodeInputSelect.tsx b/packages/web/components/core/workflow/NodeInputSelect.tsx index ca170e8f527b..3834dab2a019 100644 --- a/packages/web/components/core/workflow/NodeInputSelect.tsx +++ b/packages/web/components/core/workflow/NodeInputSelect.tsx @@ -1,13 +1,12 @@ import React, { useMemo, useRef } from 'react'; -import MyMenu from '../../common/MyMenu'; +import MyMenu, { MenuItemType } from '../../common/MyMenu'; import { FlowNodeInputMap, FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/constant'; -import { Box, Button, useTheme } from '@chakra-ui/react'; +import { Button, useTheme } from '@chakra-ui/react'; import MyIcon from '../../common/Icon'; import { useTranslation } from 'next-i18next'; -import { useConfirm } from '../../../hooks/useConfirm'; const NodeInputSelect = ({ renderTypeList, @@ -19,9 +18,6 @@ const NodeInputSelect = ({ onChange: (e: string) => void; }) => { const { t } = useTranslation(); - const { openConfirm, ConfirmModal } = useConfirm({ - title: t('common:core.workflow.Change input type tip') - }); const renderType = renderTypeList[renderTypeIndex]; const theme = useTheme(); @@ -136,7 +132,22 @@ const NodeInputSelect = ({ ); const filterMenuList = useMemo( - () => renderList.filter((item) => renderTypeList.includes(item.renderType)), + () => + renderList + .filter((item) => renderTypeList.includes(item.renderType)) + .map((item) => ({ + ...item, + type: 'gray' as MenuItemType, + menuItemStyles: { + fontWeight: 'medium', + minH: 7, + h: 7, + px: 1, + py: 0, + mb: 0, + borderRadius: 'xs' + } + })), [renderTypeList, renderList] ); const renderTypeData = useMemo( @@ -148,24 +159,37 @@ const NodeInputSelect = ({ } - rightIcon={} + rightIcon={ + + } variant={'grayBase'} border={theme.borders.base} borderColor={'myGray.200'} borderRadius={'sm'} - px={'10px'} - py={'6px'} + px={'8px'} fontSize={'mini'} color={'myGray.600'} - h={'28px'} bg={'myGray.100'} + minH={'28px'} + h={'28px'} > - {renderTypeData.title} + {renderTypeData.title} } menuList={[{ children: filterMenuList }]} diff --git a/packages/web/i18n/en/app.json b/packages/web/i18n/en/app.json index 97f25f822321..713eedccbe59 100644 --- a/packages/web/i18n/en/app.json +++ b/packages/web/i18n/en/app.json @@ -1,5 +1,5 @@ { - "Role_setting": "Role setting", + "Role_setting": "Permission", "Run": "Execute", "Team Tags Set": "Team tags", "Team_Tags": "Team tags", @@ -38,10 +38,10 @@ "document_quote_tip": "Usually used to accept user-uploaded document content (requires document parsing), and can also be used to reference other string data.", "document_upload": "Document Upload", "edit_app": "Edit Application", - "edit_info": "Edit Information", + "edit_info": "Edit", "execute_time": "Execution Time", "export_config_successful": "Configuration copied, some sensitive information automatically filtered. Please check for any remaining sensitive data.", - "export_configs": "Export Configurations", + "export_configs": "Export", "feedback_count": "User Feedback", "file_quote_link": "Files", "file_recover": "File will overwrite current content", @@ -52,7 +52,7 @@ "go_to_run": "Go to Execution", "image_upload": "Image Upload", "image_upload_tip": "How to activate model image recognition capabilities", - "import_configs": "Import Configurations", + "import_configs": "Import", "import_configs_failed": "Import configuration failed, please ensure the configuration is correct!", "import_configs_success": "Import Successful", "initial_form": "initial state", diff --git a/packages/web/i18n/en/common.json b/packages/web/i18n/en/common.json index f4b5bc51ea7b..c594859a43b0 100644 --- a/packages/web/i18n/en/common.json +++ b/packages/web/i18n/en/common.json @@ -734,11 +734,11 @@ "core.module.template.AI function": "AI Capability", "core.module.template.AI response switch tip": "If you want the current node not to output content, you can turn off this switch. The content output by AI will not be displayed to the user, and you can manually use 'AI Response Content' for special processing.", "core.module.template.AI support tool tip": "Models that support function calls can better use tool calls.", - "core.module.template.Basic Node": "Basic Function", + "core.module.template.Basic Node": "Basic", "core.module.template.Query extension": "Question Optimization", - "core.module.template.System Plugin": "System Plugin", + "core.module.template.System Plugin": "System", "core.module.template.System input module": "System Input", - "core.module.template.Team app": "Team App", + "core.module.template.Team app": "Team", "core.module.template.Tool module": "Tool", "core.module.template.UnKnow Module": "Unknown Module", "core.module.template.ai_chat": "AI conversation", diff --git a/packages/web/styles/theme.ts b/packages/web/styles/theme.ts index 0e6258c02697..c8bf06d7b091 100644 --- a/packages/web/styles/theme.ts +++ b/packages/web/styles/theme.ts @@ -221,7 +221,6 @@ const Button = defineStyleConfig({ boxShadow: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)', _hover: { color: 'red.600', - background: 'red.1', borderColor: 'red.300' }, _active: { @@ -251,6 +250,16 @@ const Button = defineStyleConfig({ color: 'red.600' } }, + grayGhost: { + color: 'myGray.500', + fontWeight: '500', + p: 0, + bg: 'transparent', + transition: 'background 0.1s', + _hover: { + bg: 'myGray.05' + } + }, transparentBase: { color: 'myGray.800', fontWeight: '500', @@ -570,6 +579,43 @@ const Table = tableMultiStyle({ } }) }, + variants: { + workflow: { + table: { + bg: 'white' + }, + thead: { + tr: { + th: { + p: '0', + px: 4, + bg: 'myGray.50', + borderRadius: 'none !important', + borderBottom: 'none', + height: '32px', + fontSize: 'mini', + fontWeight: 'medium' + } + } + }, + tbody: { + tr: { + td: { + p: '0', + px: 4, + fontSize: 'xs', + borderBottom: 'base', + height: '40px' + }, + '&:last-child': { + td: { + borderBottom: 'none' + } + } + } + } + } + }, defaultProps: { size: 'md' } diff --git a/projects/app/src/components/Layout/navbar.tsx b/projects/app/src/components/Layout/navbar.tsx index e6290bb4a7d6..86c35589507e 100644 --- a/projects/app/src/components/Layout/navbar.tsx +++ b/projects/app/src/components/Layout/navbar.tsx @@ -84,6 +84,7 @@ const Navbar = ({ unread }: { unread: number }) => { h={'100%'} w={'100%'} userSelect={'none'} + pb={2} > {/* logo */} { href={`/account?currentTab=inform`} mb={0} color={'myGray.500'} + height={'48px'} > @@ -171,6 +173,7 @@ const Navbar = ({ unread }: { unread: number }) => { target="_blank" mb={0} color={'myGray.500'} + height={'48px'} > @@ -186,6 +189,7 @@ const Navbar = ({ unread }: { unread: number }) => { {...hoverStyle} mt={0} color={'myGray.500'} + height={'48px'} > diff --git a/projects/app/src/components/core/app/VariableEdit.tsx b/projects/app/src/components/core/app/VariableEdit.tsx index 95c00be119f0..792f34311b94 100644 --- a/projects/app/src/components/core/app/VariableEdit.tsx +++ b/projects/app/src/components/core/app/VariableEdit.tsx @@ -31,6 +31,7 @@ import ChatFunctionTip from './Tip'; import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel'; import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip'; import InputTypeConfig from '@/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig'; +import IconButton from '@fastgpt/web/components/common/MyBox/IconButton'; export const defaultVariable: VariableItemType = { id: nanoid(), @@ -190,92 +191,59 @@ const VariableEdit = ({ {/* Form render */} {formatVariables.length > 0 && ( - - - - - - - - + +
- {t('workflow:Variable_name')} - - {t('common:common.Require Input')} - - {t('common:common.Operation')} -
+ + + + + + + + + {formatVariables.map((item, index) => ( + + + + - - - {formatVariables.map((item) => ( - - - - - - ))} - -
{t('workflow:Variable_name')}{t('common:common.Require Input')}{t('common:common.Operation')}
+ + + {item.key} + + + + {item.required ? ( + + ) : ( + '' + )} + + + + { + const formattedItem = { + ...item, + list: item.enums || [] + }; + reset(formattedItem); + }} + /> + + onChange(variables.filter((variable) => variable.id !== item.id)) + } + /> + +
- - - {item.key} - - - - {item.required ? ( - - ) : ( - '' - )} - - - - { - const formattedItem = { - ...item, - list: item.enums || [] - }; - reset(formattedItem); - }} - /> - - onChange(variables.filter((variable) => variable.id !== item.id)) - } - /> - -
- - + ))} + + + )} {/* Edit modal */} diff --git a/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx index ef09e5536d3a..8d3e1a2a4bd9 100644 --- a/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx +++ b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx @@ -37,13 +37,7 @@ export const VariableInputItem = ({ > {item.label} {item.required && ( - + * )} diff --git a/projects/app/src/components/core/dataset/SearchParamsTip.tsx b/projects/app/src/components/core/dataset/SearchParamsTip.tsx index 389772bd87ed..2965a541f8a6 100644 --- a/projects/app/src/components/core/dataset/SearchParamsTip.tsx +++ b/projects/app/src/components/core/dataset/SearchParamsTip.tsx @@ -45,6 +45,18 @@ const SearchParamsTip = ({ borderRadius={'lg'} borderWidth={'1px'} borderColor={'primary.1'} + sx={{ + '&::-webkit-scrollbar': { + height: '6px', + borderRadius: '4px' + }, + '&::-webkit-scrollbar-thumb': { + backgroundColor: 'myGray.250 !important', + '&:hover': { + backgroundColor: 'myGray.300 !important' + } + } + }} > diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/AppCard.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/AppCard.tsx index 3c86ff4df117..daf92a9eccc2 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/AppCard.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/AppCard.tsx @@ -147,7 +147,6 @@ const AppCard = ({ appDetail.name, appDetail.permission.hasWritePer, appDetail.permission.isOwner, - currentTab, feConfigs?.show_team_chat, onDelApp, onOpenImport, @@ -252,10 +251,6 @@ function ExportPopover({ trigger={'hover'} w={'8.6rem'} Trigger={ - // - // - // {t('app:export_configs')} - // {t('app:export_configs')} diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/NodeTemplatesModal.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/NodeTemplatesModal.tsx index a818068fa248..737eefa737e8 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/NodeTemplatesModal.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/NodeTemplatesModal.tsx @@ -240,7 +240,7 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => { position={'absolute'} top={'10px'} left={0} - pt={'20px'} + pt={5} pb={4} h={isOpen ? 'calc(100% - 20px)' : '0'} w={isOpen ? ['100%', `${sliderWidth}px`] : '0'} @@ -254,7 +254,7 @@ const NodeTemplatesModal = ({ isOpen, onClose }: ModuleTemplateListProps) => { {/* Header */} {/* Tabs */} - + { {/* close icon */} } - borderColor={'myGray.300'} + icon={} + bg={'myGray.100'} + _hover={{ + bg: 'myGray.200', + '& svg': { + color: 'primary.600' + } + }} variant={'grayBase'} aria-label={''} onClick={onClose} diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/ButtonEdge.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/ButtonEdge.tsx index faaefe645ae6..7fe2b65fd549 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/ButtonEdge.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/ButtonEdge.tsx @@ -177,20 +177,15 @@ const ButtonEdge = (props: EdgeProps) => { position={'absolute'} transform={arrowTransform} pointerEvents={'all'} - w={highlightEdge ? '14px' : '10px'} - h={highlightEdge ? '14px' : '10px'} + w={highlightEdge ? '12px' : '10px'} + h={highlightEdge ? '12px' : '10px'} zIndex={highlightEdge ? defaultZIndex + 1000 : defaultZIndex} > + /> )} @@ -223,7 +218,7 @@ const ButtonEdge = (props: EdgeProps) => { ...style, ...(highlightEdge ? { - strokeWidth: 5 + strokeWidth: 4 } : { strokeWidth: 3, zIndex: 2 }) }; diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/hooks/useDebug.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/hooks/useDebug.tsx index ac07af24071b..874b06be8248 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/hooks/useDebug.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/hooks/useDebug.tsx @@ -333,7 +333,7 @@ export const useDebug = () => { {required && ( - + * )} diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeCode.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeCode.tsx index 7a298e9c2ca5..3a58f36658cd 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeCode.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeCode.tsx @@ -36,8 +36,8 @@ const NodeCode = ({ data, selected }: NodeProps) => { return { [NodeInputKeyEnum.code]: (item: FlowNodeInputItemType) => { return ( - - + + {'Javascript ' + workflowT('Code')} ) => { )} - + ) => { const { inputs, outputs, nodeId } = data; @@ -53,14 +54,15 @@ const NodeExtract = ({ data }: NodeProps) => { }: Omit & { value?: ContextExtractAgentItemType[]; }) => ( - + - + {t('common:core.module.extract.Target field')} - - -
- - - - - - - - - - {extractKeys.map((item, index) => ( - - - - - + + ))} + +
{t('common:item_name')}{t('common:item_description')}{t('common:required')}
{item.key}{item.desc}{item.required ? '✔' : ''} - + + + + + + + + + + + {extractKeys.map((item, index) => ( + + + + + - - ))} - -
{t('common:item_name')}{t('common:item_description')}{t('common:required')}
+ + + {item.key} + + {item.desc} + {item.required ? ( + + + + ) : ( + '' + )} + + + { setEditExtractField(item); }} /> - { onChangeNode({ nodeId, @@ -128,13 +129,13 @@ const NodeExtract = ({ data }: NodeProps) => { }); }} /> -
- - + +
+ ) }), diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeFormInput/index.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeFormInput/index.tsx index 3700ddbea127..6557bda0a60b 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeFormInput/index.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeFormInput/index.tsx @@ -13,7 +13,6 @@ import { Box, Button, Flex, - FormLabel, HStack, Table, TableContainer, @@ -37,6 +36,8 @@ import { useContextSelector } from 'use-context-selector'; import { WorkflowContext } from '../../../context'; import InputFormEditModal, { defaultFormInput } from './InputFormEditModal'; import RenderOutput from '../render/RenderOutput'; +import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel'; +import IconButton from '@fastgpt/web/components/common/MyBox/IconButton'; const NodeFormInput = ({ data, selected }: NodeProps) => { const { nodeId, inputs, outputs } = data; @@ -120,10 +121,14 @@ const NodeFormInput = ({ data, selected }: NodeProps) => { return ( - {t('workflow:user_form_input_config')} + + {t('workflow:user_form_input_config')} + {hasNewVersion && ( @@ -248,7 +247,7 @@ const NodeCard = (props: Props) => { onClick={onOpenConfirmSync(onClickSyncVersion)} > {t('app:app.modules.has new version')} - + )} @@ -263,34 +262,25 @@ const NodeCard = (props: Props) => { /> } > - + )} {!!nodeTemplate?.diagram && node?.courseUrl && ( - + )} {node?.courseUrl && !hasNewVersion && ( - window.open(getDocPath(node.courseUrl || ''), '_blank')} - /> + )} @@ -378,7 +368,7 @@ const NodeCard = (props: Props) => { > {Header} - + {!isFolded ? children : } {RenderHandle} @@ -521,7 +511,7 @@ const MenuRender = React.memo(function MenuRender({ className="nodrag controller-menu" display={'none'} flexDirection={'column'} - gap={3} + gap={2} position={'absolute'} top={'-20px'} right={0} @@ -532,16 +522,18 @@ const MenuRender = React.memo(function MenuRender({ pt={'20px'} > {menuList.map((item) => ( - - - + ))} @@ -592,31 +584,32 @@ const NodeIntro = React.memo(function NodeIntro({ {t(intro as any)} - { - if (!NodeIsTool) return; - onOpenIntroModal({ - defaultVal: intro, - onSuccess(e) { - onChangeNode({ - nodeId, - type: 'attr', - key: 'intro', - value: e - }); - } - }); - }} - > - - + {NodeIsTool && ( + { + onOpenIntroModal({ + defaultVal: intro, + onSuccess(e) { + onChangeNode({ + nodeId, + type: 'attr', + key: 'intro', + value: e + }); + } + }); + }} + > + + + )} diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/DynamicInputs/index.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/DynamicInputs/index.tsx index 87f81610365c..36ab6454d684 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/DynamicInputs/index.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/DynamicInputs/index.tsx @@ -115,7 +115,6 @@ function Reference({ content: workflowT('confirm_delete_field_tip') }); const onChangeNode = useContextSelector(WorkflowContext, (v) => v.onChangeNode); - const nodeList = useContextSelector(WorkflowContext, (v) => v.nodeList); const keys = useMemo(() => { return inputs.map((input) => input.key); @@ -199,7 +198,7 @@ function Reference({ /> w={'100%'} >