From 73210a869048d6468b55717660d0ca558d0c2aab Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期一, 24 十一月 2025 09:49:43 +0800
Subject: [PATCH] 优化
---
app/components/app/create-app-modal/index.tsx | 90 +++++++++++++++++++--------------------------
1 files changed, 38 insertions(+), 52 deletions(-)
diff --git a/app/components/app/create-app-modal/index.tsx b/app/components/app/create-app-modal/index.tsx
index eb78258..7386fc2 100644
--- a/app/components/app/create-app-modal/index.tsx
+++ b/app/components/app/create-app-modal/index.tsx
@@ -5,10 +5,10 @@
import { useRouter } from 'next/navigation'
import { useContext, useContextSelector } from 'use-context-selector'
-import { RiArrowRightLine, RiCommandLine, RiCornerDownLeftLine, RiExchange2Fill } from '@remixicon/react'
-import Link from 'next/link'
+import { RiCommandLine, RiCornerDownLeftLine, RiExchange2Fill } from '@remixicon/react'
import { useDebounceFn, useKeyPress } from 'ahooks'
import Image from 'next/image'
+import AppIcon from '../../base/app-icon'
import AppIconPicker from '../../base/app-icon-picker'
import type { AppIconSelection } from '../../base/app-icon-picker'
import Button from '@/app/components/base/button'
@@ -21,9 +21,8 @@
import { createApp } from '@/service/apps'
import Input from '@/app/components/base/input'
import Textarea from '@/app/components/base/textarea'
-import AppIcon from '@/app/components/base/app-icon'
import AppsFull from '@/app/components/billing/apps-full-in-dialog'
-import { BubbleTextMod, ChatBot, ListSparkle, Logic } from '@/app/components/base/icons/src/vender/solid/communication'
+import { Logic } from '@/app/components/base/icons/src/vender/solid/communication'
import { NEED_REFRESH_APP_LIST_KEY } from '@/config'
import { getRedirection } from '@/utils/app-redirection'
import FullScreenModal from '@/app/components/base/fullscreen-modal'
@@ -32,9 +31,10 @@
onSuccess: () => void
onClose: () => void
onCreateFromTemplate?: () => void
+ isWorkFlow?: boolean
}
-function CreateApp({ onClose, onSuccess, onCreateFromTemplate }: CreateAppProps) {
+function CreateApp({ onClose, onSuccess, onCreateFromTemplate, isWorkFlow }: CreateAppProps) {
const { t } = useTranslation()
const { push } = useRouter()
const { notify } = useContext(ToastContext)
@@ -71,7 +71,7 @@
icon_type: appIcon.type,
icon: appIcon.type === 'emoji' ? appIcon.icon : appIcon.fileId,
icon_background: appIcon.type === 'emoji' ? appIcon.background : undefined,
- mode: appMode,
+ mode: isWorkFlow ? 'workflow' : 'agent-chat',
})
notify({ type: 'success', message: t('app.newApp.appCreated') })
onSuccess()
@@ -94,22 +94,22 @@
})
return <>
<div className='flex justify-center h-full overflow-y-auto overflow-x-hidden'>
- <div className='flex-1 shrink-0 flex justify-end'>
+ <div className='flex-1 shrink-0 flex justify-center'>
<div className='px-10'>
- <div className='w-full h-6 2xl:h-[139px]' />
+ <div className='w-full h-6 2xl:h-[20px]' />
<div className='pt-1 pb-6'>
- <span className='title-2xl-semi-bold text-text-primary'>{t('app.newApp.startFromBlank')}</span>
+ <span className='title-2xl-semi-bold text-text-primary'>{ isWorkFlow ? '鍒涘缓宸ヤ綔娴�' : '鍒涘缓鏅鸿兘浣�' }</span>
</div>
- <div className='leading-6 mb-2'>
+ {!isWorkFlow && <div className='leading-6 mb-2'>
<span className='system-sm-semibold text-text-secondary'>{t('app.newApp.chooseAppType')}</span>
- </div>
+ </div>}
<div className='flex flex-col w-[660px] gap-4'>
- <div>
- <div className='mb-2'>
+ {!isWorkFlow && <div>
+ {/* <div className='mb-2'>
<span className='system-2xs-medium-uppercase text-text-tertiary'>{t('app.newApp.forBeginners')}</span>
- </div>
+ </div> */}
<div className='flex flex-row gap-2'>
- <AppTypeCard
+ {/* <AppTypeCard
active={appMode === 'chat'}
title={t('app.types.chatbot')}
description={t('app.newApp.chatbotShortDescription')}
@@ -118,7 +118,7 @@
</div>}
onClick={() => {
setAppMode('chat')
- }} />
+ }} /> */}
<AppTypeCard
active={appMode === 'agent-chat'}
title={t('app.types.agent')}
@@ -129,7 +129,7 @@
onClick={() => {
setAppMode('agent-chat')
}} />
- <AppTypeCard
+ {/* <AppTypeCard
active={appMode === 'completion'}
title={t('app.newApp.completeApp')}
description={t('app.newApp.completionShortDescription')}
@@ -138,15 +138,15 @@
</div>}
onClick={() => {
setAppMode('completion')
- }} />
+ }} /> */}
</div>
- </div>
+ </div>}
<div>
- <div className='mb-2'>
+ {/* <div className='mb-2'>
<span className='system-2xs-medium-uppercase text-text-tertiary'>{t('app.newApp.forAdvanced')}</span>
- </div>
+ </div> */}
<div className='flex flex-row gap-2'>
- <AppTypeCard
+ {/* <AppTypeCard
beta
active={appMode === 'advanced-chat'}
title={t('app.types.advanced')}
@@ -156,8 +156,8 @@
</div>}
onClick={() => {
setAppMode('advanced-chat')
- }} />
- <AppTypeCard
+ }} /> */}
+ {/* <AppTypeCard
beta
active={appMode === 'workflow'}
title={t('app.types.workflow')}
@@ -167,14 +167,14 @@
</div>}
onClick={() => {
setAppMode('workflow')
- }} />
+ }} /> */}
</div>
</div>
<Divider style={{ margin: 0 }} />
<div className='flex space-x-3 items-center'>
<div className='flex-1'>
<div className='h-6 flex items-center mb-1'>
- <label className='system-sm-semibold text-text-secondary'>{t('app.newApp.captionName')}</label>
+ <label className='system-sm-semibold text-text-secondary'>搴旂敤鍚嶇О</label>
</div>
<Input
value={name}
@@ -182,14 +182,14 @@
placeholder={t('app.newApp.appNamePlaceholder') || ''}
/>
</div>
- <AppIcon
+ {/* <AppIcon
iconType={appIcon.type}
icon={appIcon.type === 'emoji' ? appIcon.icon : appIcon.fileId}
background={appIcon.type === 'emoji' ? appIcon.background : undefined}
imageUrl={appIcon.type === 'image' ? appIcon.url : undefined}
size='xxl' className='cursor-pointer rounded-2xl'
onClick={() => { setShowAppIconPicker(true) }}
- />
+ /> */}
{showAppIconPicker && <AppIconPicker
onSelect={(payload) => {
setAppIcon(payload)
@@ -214,12 +214,12 @@
</div>
</div>
<div className='pt-5 pb-10 flex justify-between items-center'>
- <div className='flex gap-1 items-center system-xs-regular text-text-tertiary cursor-pointer' onClick={onCreateFromTemplate}>
+ {/* <div className='flex gap-1 items-center system-xs-regular text-text-tertiary cursor-pointer' onClick={onCreateFromTemplate}>
<span>{t('app.newApp.noIdeaTip')}</span>
<div className='p-[1px]'>
<RiArrowRightLine className='w-3.5 h-3.5' />
</div>
- </div>
+ </div> */}
<div className='flex gap-2'>
<Button onClick={onClose}>{t('app.newApp.Cancel')}</Button>
<Button disabled={isAppsFull || !name} className='gap-1' variant="primary" onClick={handleCreateApp}>
@@ -231,22 +231,6 @@
</Button>
</div>
</div>
- </div>
- </div>
- <div className='flex-1 shrink h-full flex justify-start relative overflow-hidden'>
- <div className='h-6 2xl:h-[139px] absolute left-0 top-0 right-0 border-b border-b-divider-subtle'></div>
- <div className='max-w-[760px] border-x border-x-divider-subtle'>
- <div className='h-6 2xl:h-[139px]' />
- <AppPreview mode={appMode} />
- <div className='absolute left-0 right-0 border-b border-b-divider-subtle'></div>
- <div className='w-[664px] h-[448px] flex items-center justify-center' style={{ background: 'repeating-linear-gradient(135deg, transparent, transparent 2px, rgba(16,24,40,0.04) 4px,transparent 3px, transparent 6px)' }}>
- <AppScreenShot show={appMode === 'chat'} mode='chat' />
- <AppScreenShot show={appMode === 'advanced-chat'} mode='advanced-chat' />
- <AppScreenShot show={appMode === 'agent-chat'} mode='agent-chat' />
- <AppScreenShot show={appMode === 'completion'} mode='completion' />
- <AppScreenShot show={appMode === 'workflow'} mode='workflow' />
- </div>
- <div className='absolute left-0 right-0 border-b border-b-divider-subtle'></div>
</div>
</div>
</div>
@@ -262,7 +246,7 @@
type CreateAppDialogProps = CreateAppProps & {
show: boolean
}
-const CreateAppModal = ({ show, onClose, onSuccess, onCreateFromTemplate }: CreateAppDialogProps) => {
+const CreateAppModal = ({ show, onClose, onSuccess, onCreateFromTemplate, isWorkFlow }: CreateAppDialogProps) => {
return (
<FullScreenModal
overflowVisible
@@ -270,7 +254,7 @@
open={show}
onClose={onClose}
>
- <CreateApp onClose={onClose} onSuccess={onSuccess} onCreateFromTemplate={onCreateFromTemplate} />
+ <CreateApp isWorkFlow={isWorkFlow} onClose={onClose} onSuccess={onSuccess} onCreateFromTemplate={onCreateFromTemplate} />
</FullScreenModal>
)
}
@@ -300,7 +284,9 @@
{beta && <div className='px-[5px] py-[3px]
rounded-[5px] min-w-[18px] absolute top-3 right-3
border border-divider-deep system-2xs-medium-uppercase text-text-tertiary'>{t('common.menus.status')}</div>}
- {icon}
+ <AppIcon
+ imageUrl='/avatar/agent.png'
+ />
<div className='system-sm-semibold text-text-secondary mt-2 mb-0.5'>{title}</div>
<div className='system-xs-regular text-text-tertiary'>{description}</div>
</div>
@@ -335,13 +321,13 @@
link: 'https://docs.dify.ai/guides/workflow',
},
}
- const previewInfo = modeToPreviewInfoMap[mode]
+ // const previewInfo = modeToPreviewInfoMap[mode]
return <div className='px-8 py-4'>
- <h4 className='system-sm-semibold-uppercase text-text-secondary'>{previewInfo.title}</h4>
+ {/* <h4 className='system-sm-semibold-uppercase text-text-secondary'>{previewInfo.title}</h4>
<div className='mt-1 system-xs-regular text-text-tertiary max-w-96 min-h-8'>
<span>{previewInfo.description}</span>
{previewInfo.link && <Link target='_blank' href={previewInfo.link} className='text-text-accent ml-1'>{t('app.newApp.learnMore')}</Link>}
- </div>
+ </div> */}
</div>
}
--
Gitblit v1.8.0