From a430284aa21e3ae1f0d5654e55b2ad2852519cc2 Mon Sep 17 00:00:00 2001 From: wwf <yearningwang@iqtogether.com> Date: 星期三, 04 六月 2025 15:17:49 +0800 Subject: [PATCH] 初始化 --- app/components/tools/workflow-tool/index.tsx | 58 +++++++++++++++++++++++++++++----------------------------- 1 files changed, 29 insertions(+), 29 deletions(-) diff --git a/app/components/tools/workflow-tool/index.tsx b/app/components/tools/workflow-tool/index.tsx index 30afc1a..c4d7424 100644 --- a/app/components/tools/workflow-tool/index.tsx +++ b/app/components/tools/workflow-tool/index.tsx @@ -39,7 +39,7 @@ }) => { const { t } = useTranslation() - const [showEmojiPicker, setShowEmojiPicker] = useState<boolean>(false) + const [showEmojiPicker, setShowEmojiPicker] = useState<Boolean>(false) const [emoji, setEmoji] = useState<Emoji>(payload.icon) const [label, setLabel] = useState<string>(payload.label) const [name, setName] = useState(payload.name) @@ -66,7 +66,7 @@ if (name === '') return true - return /^\w+$/.test(name) + return /^[a-zA-Z0-9_]+$/.test(name) } const onConfirm = () => { @@ -124,17 +124,17 @@ panelClassName='mt-2 !w-[640px]' maxWidthClassName='!max-w-[640px]' height='calc(100vh - 16px)' - headerClassName='!border-b-divider' + headerClassName='!border-b-black/5' body={ - <div className='flex h-full flex-col'> - <div className='h-0 grow space-y-4 overflow-y-auto px-6 py-3'> + <div className='flex flex-col h-full'> + <div className='grow h-0 overflow-y-auto px-6 py-3 space-y-4'> {/* name & icon */} <div> - <div className='system-sm-medium py-2 text-text-primary'>{t('tools.createTool.name')} <span className='ml-1 text-red-500'>*</span></div> + <div className='py-2 leading-5 text-sm font-medium text-gray-900'>{t('tools.createTool.name')} <span className='ml-1 text-red-500'>*</span></div> <div className='flex items-center justify-between gap-3'> <AppIcon size='large' onClick={() => { setShowEmojiPicker(true) }} className='cursor-pointer' iconType='emoji' icon={emoji.content} background={emoji.background} /> <Input - className='h-10 grow' + className='grow h-10' placeholder={t('tools.createTool.toolNamePlaceHolder')!} value={label} onChange={e => setLabel(e.target.value)} @@ -143,7 +143,7 @@ </div> {/* name for tool call */} <div> - <div className='system-sm-medium flex items-center py-2 text-text-primary'> + <div className='flex items-center py-2 leading-5 text-sm font-medium text-gray-900'> {t('tools.createTool.nameForToolCall')} <span className='ml-1 text-red-500'>*</span> <Tooltip popupContent={ @@ -165,7 +165,7 @@ </div> {/* description */} <div> - <div className='system-sm-medium py-2 text-text-primary'>{t('tools.createTool.description')}</div> + <div className='py-2 leading-5 text-sm font-medium text-gray-900'>{t('tools.createTool.description')}</div> <Textarea placeholder={t('tools.createTool.descriptionPlaceholder') || ''} value={description} @@ -174,34 +174,34 @@ </div> {/* Tool Input */} <div> - <div className='system-sm-medium py-2 text-text-primary'>{t('tools.createTool.toolInput.title')}</div> - <div className='w-full overflow-x-auto rounded-lg border border-divider-regular'> - <table className='w-full text-xs font-normal leading-[18px] text-text-secondary'> - <thead className='uppercase text-text-tertiary'> - <tr className='border-b border-divider-regular'> - <th className="w-[156px] p-2 pl-3 font-medium">{t('tools.createTool.toolInput.name')}</th> - <th className="w-[102px] p-2 pl-3 font-medium">{t('tools.createTool.toolInput.method')}</th> + <div className='py-2 leading-5 text-sm font-medium text-gray-900'>{t('tools.createTool.toolInput.title')}</div> + <div className='rounded-lg border border-gray-200 w-full overflow-x-auto'> + <table className='w-full leading-[18px] text-xs text-gray-700 font-normal'> + <thead className='text-gray-500 uppercase'> + <tr className='border-b border-gray-200'> + <th className="p-2 pl-3 font-medium w-[156px]">{t('tools.createTool.toolInput.name')}</th> + <th className="p-2 pl-3 font-medium w-[102px]">{t('tools.createTool.toolInput.method')}</th> <th className="p-2 pl-3 font-medium">{t('tools.createTool.toolInput.description')}</th> </tr> </thead> <tbody> {parameters.map((item, index) => ( - <tr key={index} className='border-b border-divider-regular last:border-0'> - <td className="max-w-[156px] p-2 pl-3"> + <tr key={index} className='border-b last:border-0 border-gray-200'> + <td className="p-2 pl-3 max-w-[156px]"> <div className='text-[13px] leading-[18px]'> <div title={item.name} className='flex'> - <span className='truncate font-medium text-text-primary'>{item.name}</span> - <span className='shrink-0 pl-1 text-xs leading-[18px] text-[#ec4a0a]'>{item.required ? t('tools.createTool.toolInput.required') : ''}</span> + <span className='font-medium text-gray-900 truncate'>{item.name}</span> + <span className='shrink-0 pl-1 text-[#ec4a0a] text-xs leading-[18px]'>{item.required ? t('tools.createTool.toolInput.required') : ''}</span> </div> - <div className='text-text-tertiary'>{item.type}</div> + <div className='text-gray-500'>{item.type}</div> </div> </td> <td> {item.name === '__image' && ( <div className={cn( - 'flex h-9 min-h-[56px] cursor-default items-center gap-1 bg-transparent px-3 py-2', + 'flex items-center gap-1 min-h-[56px] px-3 py-2 h-9 bg-white cursor-default', )}> - <div className={cn('grow truncate text-[13px] leading-[18px] text-text-secondary')}> + <div className={cn('grow text-[13px] leading-[18px] text-gray-700 truncate')}> {t('tools.createTool.toolInput.methodParameter')} </div> </div> @@ -210,10 +210,10 @@ <MethodSelector value={item.form} onChange={value => handleParameterChange('form', value, index)} /> )} </td> - <td className="w-[236px] p-2 pl-3 text-text-tertiary"> + <td className="p-2 pl-3 text-gray-500 w-[236px]"> <input type='text' - className='w-full appearance-none bg-transparent text-[13px] font-normal leading-[18px] text-text-secondary caret-primary-600 outline-none placeholder:text-text-quaternary' + className='grow text-gray-700 text-[13px] leading-[18px] font-normal bg-white outline-none appearance-none caret-primary-600 placeholder:text-gray-300' placeholder={t('tools.createTool.toolInput.descriptionPlaceholder')!} value={item.description} onChange={e => handleParameterChange('description', e.target.value, index)} @@ -227,12 +227,12 @@ </div> {/* Tags */} <div> - <div className='system-sm-medium py-2 text-text-primary'>{t('tools.createTool.toolInput.label')}</div> + <div className='py-2 leading-5 text-sm font-medium text-gray-900'>{t('tools.createTool.toolInput.label')}</div> <LabelSelector value={labels} onChange={handleLabelSelect} /> </div> {/* Privacy Policy */} <div> - <div className='system-sm-medium py-2 text-text-primary'>{t('tools.createTool.privacyPolicy')}</div> + <div className='py-2 leading-5 text-sm font-medium text-gray-900'>{t('tools.createTool.privacyPolicy')}</div> <Input className='h-10' value={privacyPolicy} @@ -240,9 +240,9 @@ placeholder={t('tools.createTool.privacyPolicyPlaceholder') || ''} /> </div> </div> - <div className={cn((!isAdd && onRemove) ? 'justify-between' : 'justify-end', 'mt-2 flex shrink-0 rounded-b-[10px] border-t border-divider-regular bg-background-section-burn px-6 py-4')} > + <div className={cn((!isAdd && onRemove) ? 'justify-between' : 'justify-end', 'mt-2 shrink-0 flex py-4 px-6 rounded-b-[10px] bg-gray-50 border-t border-black/5')} > {!isAdd && onRemove && ( - <Button variant='warning' onClick={onRemove}>{t('common.operation.delete')}</Button> + <Button onClick={onRemove} className='text-red-500 border-red-50 hover:border-red-500'>{t('common.operation.delete')}</Button> )} <div className='flex space-x-2 '> <Button onClick={onHide}>{t('common.operation.cancel')}</Button> -- Gitblit v1.8.0