Updae theme and fix some bug (#1711)

projects/app/src/pages/account/components/BillTable.tsx

@@ -32,6 +32,7 @@ import { standardSubLevelMap, subModeMap } from '@fastgpt/global/support/wallet/
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const BillTable = () => {
   const { t } = useTranslation();
@@ -187,58 +188,68 @@ function BillDetailModal({ bill, onClose }: { bill: BillSchemaType; onClose: ()
     >
       <ModalBody>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Number')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Number')}:</FormLabel>
           <Box>{bill.orderId}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.usage.Time')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.usage.Time')}:</FormLabel>
           <Box>{dayjs(bill.createTime).format('YYYY/MM/DD HH:mm:ss')}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Status')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Status')}:</FormLabel>
           <Box>{t(billStatusMap[bill.status]?.label)}</Box>
         </Flex>
         {!!bill.metadata?.payWay && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.bill.payWay.Way')}:</Box>
+            <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.payWay.Way')}:</FormLabel>
             <Box>{t(billPayWayMap[bill.metadata.payWay]?.label)}</Box>
           </Flex>
         )}
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.Amount')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.Amount')}:</FormLabel>
           <Box>{formatStorePrice2Read(bill.price)}元</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 120px'}>{t('support.wallet.bill.Type')}:</Box>
+          <FormLabel flex={'0 0 120px'}>{t('support.wallet.bill.Type')}:</FormLabel>
           <Box>{t(billTypeMap[bill.type]?.label)}</Box>
         </Flex>
         {!!bill.metadata?.subMode && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.mode.Period')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.mode.Period')}:
+            </FormLabel>
             <Box>{t(subModeMap[bill.metadata.subMode]?.label)}</Box>
           </Flex>
         )}
         {!!bill.metadata?.standSubLevel && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Stand plan level')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Stand plan level')}:
+            </FormLabel>
             <Box>{t(standardSubLevelMap[bill.metadata.standSubLevel]?.label)}</Box>
           </Flex>
         )}
         {bill.metadata?.month !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Month amount')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Month amount')}:
+            </FormLabel>
             <Box>{bill.metadata?.month}</Box>
           </Flex>
         )}
         {bill.metadata?.datasetSize !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Extra dataset size')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Extra dataset size')}:
+            </FormLabel>
             <Box>{bill.metadata?.datasetSize}</Box>
           </Flex>
         )}
         {bill.metadata?.extraPoints !== undefined && (
           <Flex alignItems={'center'} pb={4}>
-            <Box flex={'0 0 120px'}>{t('support.wallet.subscription.Extra ai points')}:</Box>
+            <FormLabel flex={'0 0 120px'}>
+              {t('support.wallet.subscription.Extra ai points')}:
+            </FormLabel>
             <Box>{bill.metadata.extraPoints}</Box>
           </Flex>
         )}

projects/app/src/pages/account/components/Individuation.tsx

@@ -38,12 +38,12 @@ const Individuation = () => {
 
   return (
     <Box py={[3, '28px']} px={['5vw', '64px']}>
-      <Flex alignItems={'center'} fontSize={'xl'} h={'30px'}>
+      <Flex alignItems={'center'} fontSize={'lg'} h={'30px'}>
         <MyIcon mr={2} name={'support/user/individuation'} w={'20px'} />
         {t('support.account.Individuation')}
       </Flex>
 
-      <Card mt={6} px={[3, 10]} py={[3, 7]}>
+      <Card mt={6} px={[3, 10]} py={[3, 7]} fontSize={'sm'}>
         <Flex alignItems={'center'} w={['85%', '350px']}>
           <Box flex={'0 0 80px'}>{t('user.Language')}:&nbsp;</Box>
           <Box flex={'1 0 0'}>

projects/app/src/pages/account/components/Info.tsx

@@ -9,7 +9,8 @@ import {
   Link,
   Progress,
   Grid,
-  Image
+  Image,
+  BoxProps
 } from '@chakra-ui/react';
 import { useForm } from 'react-hook-form';
 import { UserUpdateParams } from '@/types/user';
@@ -17,7 +18,6 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import type { UserType } from '@fastgpt/global/support/user/type.d';
 import { useQuery } from '@tanstack/react-query';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import dynamic from 'next/dynamic';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
@@ -25,7 +25,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useTranslation } from 'next-i18next';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useRouter } from 'next/router';
 import { formatStorePrice2Read } from '@fastgpt/global/support/wallet/usage/tools';
 import { putUpdateMemberName } from '@/web/support/user/team/api';
@@ -43,6 +43,7 @@ import {
 
 import StandardPlanContentList from '@/components/support/wallet/StandardPlanContentList';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const StandDetailModal = dynamic(() => import('./standardDetailModal'));
 const TeamMenu = dynamic(() => import('@/components/support/user/team/TeamMenu'));
@@ -158,20 +159,26 @@ const MyInfo = () => {
     [onclickSave, t, toast, userInfo]
   );
 
+  const labelStyles: BoxProps = {
+    flex: '0 0 80px',
+    fontSize: 'sm',
+    color: 'myGray.900'
+  };
+
   return (
     <Box>
       {/* user info */}
       {isPc && (
-        <Flex alignItems={'center'} fontSize={'xl'} h={'30px'}>
-          <MyIcon mr={2} name={'support/user/userLight'} w={'20px'} />
+        <Flex alignItems={'center'} fontSize={'md'} h={'30px'}>
+          <MyIcon mr={2} name={'support/user/userLight'} w={'1.25rem'} />
           {t('support.user.User self info')}
         </Flex>
       )}
 
-      <Box mt={[0, 6]}>
+      <Box mt={[0, 6]} fontSize={'sm'}>
         {isPc ? (
           <Flex alignItems={'center'} cursor={'pointer'}>
-            <Box flex={'0 0 80px'}>{t('support.user.Avatar')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('support.user.Avatar')}:&nbsp;</Box>
 
             <MyTooltip label={t('common.avatar.Select Avatar')}>
               <Box
@@ -219,7 +226,7 @@ const MyInfo = () => {
         )}
         {feConfigs.isPlus && (
           <Flex mt={[0, 4]} alignItems={'center'}>
-            <Box flex={'0 0 80px'}>{t('user.Member Name')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('user.Member Name')}:&nbsp;</Box>
             <Input
               flex={'1 0 0'}
               defaultValue={userInfo?.team?.memberName || 'Member'}
@@ -238,12 +245,12 @@ const MyInfo = () => {
           </Flex>
         )}
         <Flex alignItems={'center'} mt={6}>
-          <Box flex={'0 0 80px'}>{t('user.Account')}:&nbsp;</Box>
+          <Box {...labelStyles}>{t('user.Account')}:&nbsp;</Box>
           <Box flex={1}>{userInfo?.username}</Box>
         </Flex>
         {feConfigs.isPlus && (
           <Flex mt={6} alignItems={'center'}>
-            <Box flex={'0 0 80px'}>{t('user.Password')}:&nbsp;</Box>
+            <Box {...labelStyles}>{t('user.Password')}:&nbsp;</Box>
             <Box flex={1}>*****</Box>
             <Button size={'sm'} variant={'whitePrimary'} onClick={onOpenUpdatePsw}>
               {t('user.Change')}
@@ -251,7 +258,7 @@ const MyInfo = () => {
           </Flex>
         )}
         <Flex mt={6} alignItems={'center'}>
-          <Box flex={'0 0 80px'}>{t('user.Team')}:&nbsp;</Box>
+          <Box {...labelStyles}>{t('user.Team')}:&nbsp;</Box>
           <Box flex={1}>
             <TeamMenu />
           </Box>
@@ -259,9 +266,7 @@ const MyInfo = () => {
         {feConfigs.isPlus && (
           <Box mt={6} whiteSpace={'nowrap'}>
             <Flex alignItems={'center'}>
-              <Box flex={'0 0 80px'} fontSize={'md'}>
-                {t('user.team.Balance')}:&nbsp;
-              </Box>
+              <Box {...labelStyles}>{t('user.team.Balance')}:&nbsp;</Box>
               <Box flex={1}>
                 <strong>{formatStorePrice2Read(userInfo?.team?.balance).toFixed(3)}</strong> 元
               </Box>
@@ -373,7 +378,7 @@ const PlanUsage = () => {
 
   return standardPlan ? (
     <Box mt={[6, 0]}>
-      <Flex fontSize={'xl'} h={'30px'}>
+      <Flex fontSize={'lg'} h={'30px'}>
         <Flex alignItems={'center'}>
           <MyIcon mr={2} name={'support/account/plans'} w={'20px'} />
           {t('support.wallet.subscription.Team plan and usage')}
@@ -392,12 +397,12 @@ const PlanUsage = () => {
         borderColor={'borderColor.low'}
         borderRadius={'md'}
       >
-        <Flex px={[5, 10]} py={[3, 6]}>
+        <Flex px={[5, 7]} py={[3, 6]}>
           <Box flex={'1 0 0'}>
             <Box color={'myGray.600'} fontSize="sm">
               {t('support.wallet.subscription.Current plan')}
             </Box>
-            <Box fontWeight={'bold'} fontSize="xl">
+            <Box fontWeight={'bold'} fontSize="lg">
               {t(planName)}
             </Box>
 
@@ -412,18 +417,18 @@ const PlanUsage = () => {
                 </Box>
               </>
             ) : (
-              <Flex mt="2" color={'#485264'} fontSize="sm">
+              <Flex mt="2" color={'#485264'} fontSize="xs">
                 <Box>{t('support.wallet.Plan expired time')}:</Box>
                 <Box ml={2}>{formatTime2YMD(standardPlan?.expiredTime)}</Box>
               </Flex>
             )}
           </Box>
-          <Button onClick={() => router.push('/price')}>
+          <Button onClick={() => router.push('/price')} w={'8rem'} size="sm">
             {t('support.wallet.subscription.Upgrade plan')}
           </Button>
         </Flex>
         <Box py={3} borderTopWidth={'1px'} borderTopColor={'borderColor.base'}>
-          <Box py={[0, 3]} px={[5, 10]} overflow={'auto'}>
+          <Box py={[0, 3]} px={[5, 7]} overflow={'auto'}>
             <StandardPlanContentList
               level={standardPlan?.currentSubLevel}
               mode={standardPlan.currentMode}
@@ -443,8 +448,8 @@ const PlanUsage = () => {
       >
         <Flex>
           <Flex flex={'1 0 0'} alignItems={'flex-end'}>
-            <Box fontSize={'xl'}>资源用量</Box>
-            <Box fontSize={'sm'} color={'myGray.500'}>
+            <Box fontSize={'md'}>资源用量</Box>
+            <Box fontSize={'xs'} color={'myGray.500'}>
               (包含标准套餐与额外资源包)
             </Box>
           </Flex>
@@ -455,15 +460,18 @@ const PlanUsage = () => {
             alignItems={'center'}
             color={'primary.600'}
             cursor={'pointer'}
+            fontSize={'sm'}
           >
             购买额外套餐
             <MyIcon ml={1} name={'common/rightArrowLight'} w={'12px'} />
           </Link>
         </Flex>
-        <Box width={'100%'} mt={5}>
+        <Box width={'100%'} mt={5} fontSize={'sm'}>
           <Flex alignItems={'center'}>
             <Flex alignItems={'center'}>
-              <Box fontWeight={'bold'}>{t('support.user.team.Dataset usage')}</Box>
+              <Box fontWeight={'bold'} color={'myGray.900'}>
+                {t('support.user.team.Dataset usage')}
+              </Box>
               <Box color={'myGray.600'} ml={2}>
                 {datasetUsageMap.usedSize}/{datasetUsageMap.maxSize}
               </Box>
@@ -482,13 +490,16 @@ const PlanUsage = () => {
             />
           </Box>
         </Box>
-        <Box mt="9" width={'100%'}>
+        <Box mt="9" width={'100%'} fontSize={'sm'}>
           <Flex alignItems={'center'}>
             <Flex alignItems={'center'}>
-              <Box fontWeight={'bold'}>{t('support.wallet.subscription.AI points usage')}</Box>
-              <MyTooltip label={t('support.wallet.subscription.AI points usage tip')}>
-                <QuestionOutlineIcon ml={'2px'} />
-              </MyTooltip>
+              <Box fontWeight={'bold'} color={'myGray.900'}>
+                {t('support.wallet.subscription.AI points usage')}
+              </Box>
+              <QuestionTip
+                ml={1}
+                label={t('support.wallet.subscription.AI points usage tip')}
+              ></QuestionTip>
               <Box color={'myGray.600'} ml={2}>
                 {aiPointsUsageMap.used}/{aiPointsUsageMap.max}
               </Box>
@@ -557,6 +568,7 @@ const Other = () => {
             alignItems={'center'}
             userSelect={'none'}
             textDecoration={'none !important'}
+            fontSize={'sm'}
           >
             <MyIcon name={'common/courseLight'} w={'18px'} color={'myGray.600'} />
             <Box ml={2} flex={1}>
@@ -578,6 +590,7 @@ const Other = () => {
             alignItems={'center'}
             userSelect={'none'}
             textDecoration={'none !important'}
+            fontSize={'sm'}
           >
             <MyIcon name={'core/app/aiLight'} w={'18px'} />
             <Box ml={2} flex={1}>
@@ -589,7 +602,7 @@ const Other = () => {
         {feConfigs?.lafEnv && userInfo?.team.role === TeamMemberRoleEnum.owner && (
           <Flex
             bg={'white'}
-            py={4}
+            py={3}
             px={6}
             border={theme.borders.sm}
             borderWidth={'1.5px'}
@@ -598,6 +611,7 @@ const Other = () => {
             cursor={'pointer'}
             userSelect={'none'}
             onClick={onOpenLaf}
+            fontSize={'sm'}
           >
             <Image src="/imgs/workflow/laf.png" w={'18px'} alt="laf" />
             <Box ml={2} flex={1}>
@@ -615,7 +629,7 @@ const Other = () => {
         {feConfigs?.show_openai_account && (
           <Flex
             bg={'white'}
-            py={4}
+            py={3}
             px={6}
             border={theme.borders.sm}
             borderWidth={'1.5px'}
@@ -624,6 +638,7 @@ const Other = () => {
             cursor={'pointer'}
             userSelect={'none'}
             onClick={onOpenOpenai}
+            fontSize={'sm'}
           >
             <MyIcon name={'common/openai'} w={'18px'} color={'myGray.600'} />
             <Box ml={2} flex={1}>
@@ -644,6 +659,7 @@ const Other = () => {
             leftIcon={<MyIcon name={'modal/concat'} w={'18px'} color={'myGray.600'} />}
             onClick={onOpenConcat}
             h={'48px'}
+            fontSize={'sm'}
           >
             联系我们
           </Button>

projects/app/src/pages/account/components/InformTable.tsx

@@ -8,6 +8,7 @@ import MyIcon from '@fastgpt/web/components/common/Icon';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useTranslation } from 'next-i18next';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const InformTable = () => {
   const { t } = useTranslation();
@@ -78,14 +79,7 @@ const InformTable = () => {
             )}
           </Box>
         ))}
-        {!isLoading && informs.length === 0 && (
-          <Flex flex={'1 0 0'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-            <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-            <Box mt={2} color={'myGray.500'}>
-              暂无通知~
-            </Box>
-          </Flex>
-        )}
+        {!isLoading && informs.length === 0 && <EmptyTip text={'暂无通知~'}></EmptyTip>}
       </Box>
 
       {total > pageSize && (

projects/app/src/pages/account/components/Promotion.tsx

@@ -19,14 +19,15 @@ import { useQuery } from '@tanstack/react-query';
 import { getPromotionInitData, getPromotionRecords } from '@/web/support/activity/promotion/api';
 import { useUserStore } from '@/web/support/user/useUserStore';
 
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
 import type { PromotionRecordType } from '@/global/support/api/userRes.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import dayjs from 'dayjs';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const Promotion = () => {
   const { t } = useTranslation();
@@ -55,7 +56,7 @@ const Promotion = () => {
     p: [4, 5],
     border: theme.borders.base,
     textAlign: 'center',
-    fontSize: ['md', 'xl'],
+    fontSize: ['md', 'lg'],
     borderRadius: 'md'
   };
   const titleStyles: BoxProps = {
@@ -78,18 +79,14 @@ const Promotion = () => {
         <Box {...statisticsStyles}>
           <Flex alignItems={'center'} justifyContent={'center'}>
             <Box>{t('user.Promotion Rate')}</Box>
-            <MyTooltip label={t('user.Promotion rate tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('user.Promotion rate tip')}></QuestionTip>
           </Flex>
           <Box {...titleStyles}>{userInfo?.promotionRate || 15}%</Box>
         </Box>
         <Box {...statisticsStyles}>
           <Flex alignItems={'center'} justifyContent={'center'}>
             <Box>{t('user.Invite Url')}</Box>
-            <MyTooltip label={t('user.Invite url tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('user.Invite url tip')}></QuestionTip>
           </Flex>
           <Button
             mt={4}
@@ -127,14 +124,7 @@ const Promotion = () => {
           </Table>
         </TableContainer>
 
-        {!isLoading && promotionRecords.length === 0 && (
-          <Flex mt={'10vh'} flexDirection={'column'} alignItems={'center'}>
-            <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-            <Box mt={2} color={'myGray.500'}>
-              无邀请记录~
-            </Box>
-          </Flex>
-        )}
+        {!isLoading && promotionRecords.length === 0 && <EmptyTip text="无邀请记录~"></EmptyTip>}
         {total > pageSize && (
           <Flex mt={4} justifyContent={'flex-end'}>
             <Pagination />

projects/app/src/pages/account/components/UsageDetail.tsx

@@ -17,6 +17,7 @@ import { UsageSourceMap } from '@fastgpt/global/support/wallet/usage/constants';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { formatNumber } from '@fastgpt/global/common/math/tools';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const UsageDetail = ({ usage, onClose }: { usage: UsageItemType; onClose: () => void }) => {
   const { t } = useTranslation();
@@ -67,30 +68,30 @@ const UsageDetail = ({ usage, onClose }: { usage: UsageItemType; onClose: () =>
     >
       <ModalBody>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.bill.Number')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.bill.Number')}:</FormLabel>
           <Box>{usage.id}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Time')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Time')}:</FormLabel>
           <Box>{dayjs(usage.time).format('YYYY/MM/DD HH:mm:ss')}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.App name')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.App name')}:</FormLabel>
           <Box>{t(usage.appName) || '-'}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Source')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Source')}:</FormLabel>
           <Box>{t(UsageSourceMap[usage.source]?.label)}</Box>
         </Flex>
         <Flex alignItems={'center'} pb={4}>
-          <Box flex={'0 0 80px'}>{t('support.wallet.usage.Total points')}:</Box>
+          <FormLabel flex={'0 0 80px'}>{t('support.wallet.usage.Total points')}:</FormLabel>
           <Box fontWeight={'bold'}>{formatNumber(usage.totalPoints)}</Box>
         </Flex>
         <Box pb={4}>
-          <Box flex={'0 0 80px'} mb={1}>
+          <FormLabel flex={'0 0 80px'} mb={1}>
             {t('support.wallet.usage.Bill Module')}
-          </Box>
-          <TableContainer>
+          </FormLabel>
+          <TableContainer fontSize={'sm'}>
             <Table>
               <Thead>
                 <Tr>

projects/app/src/pages/account/components/UsageTable.tsx

@@ -31,6 +31,7 @@ import { getTeamMembers } from '@/web/support/user/team/api';
 import Avatar from '@/components/Avatar';
 import MySelect from '@fastgpt/web/components/common/MySelect';
 import { formatNumber } from '@fastgpt/global/common/math/tools';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 const UsageDetail = dynamic(() => import('./UsageDetail'));
 
 const UsageTable = () => {
@@ -130,7 +131,14 @@ const UsageTable = () => {
           <Pagination />
         </Flex>
       </Flex>
-      <TableContainer px={[3, 8]} position={'relative'} flex={'1 0 0'} h={0} overflowY={'auto'}>
+      <TableContainer
+        mt={2}
+        px={[3, 8]}
+        position={'relative'}
+        flex={'1 0 0'}
+        h={0}
+        overflowY={'auto'}
+      >
         <Table>
           <Thead>
             <Tr>
@@ -171,14 +179,7 @@ const UsageTable = () => {
         </Table>
       </TableContainer>
 
-      {!isLoading && usages.length === 0 && (
-        <Flex flex={'1 0 0'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            无使用记录~
-          </Box>
-        </Flex>
-      )}
+      {!isLoading && usages.length === 0 && <EmptyTip text="无使用记录~"></EmptyTip>}
 
       <Loading loading={isLoading} fixed={false} />
       {!!usageDetail && (

projects/app/src/pages/account/components/standardDetailModal.tsx

@@ -45,7 +45,6 @@ const StandDetailModal = ({ onClose }: { onClose: () => void }) => {
                 <Th>{t('support.standard.AI Bonus Points')}</Th>
                 <Th>{t('support.standard.Start Time')}</Th>
                 <Th>{t('support.standard.Expired Time')}</Th>
-                <Th />
               </Tr>
             </Thead>
             <Tbody fontSize={'sm'}>

projects/app/src/pages/api/common/file/previewContent.ts

@@ -39,12 +39,10 @@ async function handler(req: ApiRequestProps<PreviewContextProps>, res: NextApiRe
     selector
   });
 
-  jsonRes(res, {
-    data: {
-      previewContent: rawText.slice(0, 3000),
-      totalLength: rawText.length
-    }
-  });
+  return {
+    previewContent: rawText.slice(0, 3000),
+    totalLength: rawText.length
+  };
 }
 
 export default NextAPI(handler);

projects/app/src/pages/app/detail/components/FlowEdit/Header.tsx

@@ -224,13 +224,13 @@ const RenderHeaderContainer = React.memo(function RenderHeaderContainer({
             onClick={saveAndBack}
           />
           <Box ml={[2, 4]}>
-            <Box fontSize={['md', 'lg']} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               {appDetail.name}
             </Box>
             {!isShowVersionHistories && isV2Workflow && (
               <MyTooltip label={t('core.app.Onclick to save')}>
                 <Box
-                  fontSize={'sm'}
+                  fontSize={'xs'}
                   mt={1}
                   display={'inline-block'}
                   borderRadius={'xs'}
@@ -260,14 +260,18 @@ const RenderHeaderContainer = React.memo(function RenderHeaderContainer({
                 }
                 menuList={[
                   {
-                    label: appT('Import Configs'),
-                    icon: 'common/importLight',
-                    onClick: onOpenImport
-                  },
-                  {
-                    label: appT('Export Configs'),
-                    icon: 'export',
-                    onClick: onExportWorkflow
+                    children: [
+                      {
+                        label: appT('Import Configs'),
+                        icon: 'common/importLight',
+                        onClick: onOpenImport
+                      },
+                      {
+                        label: appT('Export Configs'),
+                        icon: 'export',
+                        onClick: onExportWorkflow
+                      }
+                    ]
                   }
                 ]}
               />

projects/app/src/pages/app/detail/components/InfoModal.tsx

@@ -145,7 +145,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
       title={t('core.app.setting')}
     >
       <ModalBody>
-        <Box>{t('core.app.Name and avatar')}</Box>
+        <Box fontSize={'sm'}>{t('core.app.Name and avatar')}</Box>
         <Flex mt={2} alignItems={'center'}>
           <Avatar
             src={avatar}
@@ -167,7 +167,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
             ></Input>
           </FormControl>
         </Flex>
-        <Box mt={4} mb={1}>
+        <Box mt={4} mb={1} fontSize={'sm'}>
           {t('core.app.App intro')}
         </Box>
         <Textarea
@@ -183,7 +183,7 @@ const InfoModal = ({ onClose }: { onClose: () => void }) => {
           <>
             {' '}
             <Box mt="4">
-              <Box>{t('permission.Default permission')}</Box>
+              <Box fontSize={'sm'}>{t('permission.Default permission')}</Box>
               <DefaultPermissionList
                 mt="2"
                 per={defaultPermission}

projects/app/src/pages/app/detail/components/Logs.tsx

@@ -25,7 +25,7 @@ import ChatBox from '@/components/ChatBox';
 import type { ComponentRef } from '@/components/ChatBox/type.d';
 import { useQuery } from '@tanstack/react-query';
 import { getInitChatInfo } from '@/web/core/chat/api';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { addDays } from 'date-fns';
 import MyBox from '@fastgpt/web/components/common/MyBox';
@@ -34,6 +34,7 @@ import DateRangePicker, { DateRangeType } from '@fastgpt/web/components/common/D
 import { formatChatValue2InputType } from '@/components/ChatBox/utils';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
 import { useI18n } from '@/web/context/I18n';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const Logs = ({ appId }: { appId: string }) => {
   const { t } = useTranslation();
@@ -75,7 +76,7 @@ const Logs = ({ appId }: { appId: string }) => {
       <Box px={[4, 8]}>
         {isPc && (
           <>
-            <Box fontWeight={'bold'} fontSize={['md', 'xl']} mb={2}>
+            <Box fontWeight={'bold'} fontSize={['md', 'lg']} mb={2}>
               {appT('Chat logs')}
             </Box>
             <Box color={'myGray.500'} fontSize={'sm'}>
@@ -175,14 +176,7 @@ const Logs = ({ appId }: { appId: string }) => {
           </Tbody>
         </Table>
       </TableContainer>
-      {logs.length === 0 && !isLoading && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {appT('Logs Empty')}
-          </Box>
-        </Flex>
-      )}
+      {logs.length === 0 && !isLoading && <EmptyTip text={appT('Logs Empty')}></EmptyTip>}
       <Flex w={'100%'} p={4} alignItems={'center'} justifyContent={'flex-end'}>
         <DateRangePicker
           defaultDate={dateRange}
@@ -292,15 +286,15 @@ const DetailLogsModal = ({
               <Box mr={3} color={'myGray.1000'}>
                 {title}
               </Box>
-              <Tag>
+              <MyTag colorSchema="blue">
                 <MyIcon name={'history'} w={'14px'} />
                 <Box ml={1}>{`${history.length}条记录`}</Box>
-              </Tag>
+              </MyTag>
               {!!chatModels && chatModels.length > 0 && (
-                <Tag ml={2} colorSchema={'green'}>
+                <MyTag ml={2} colorSchema={'green'}>
                   <MyIcon name={'core/chat/chatModelTag'} w={'14px'} />
                   <Box ml={1}>{chatModels.join(',')}</Box>
-                </Tag>
+                </MyTag>
               )}
               <Box flex={1} />
             </>

projects/app/src/pages/app/detail/components/Publish/FeiShu/FeiShuEditModal.tsx

@@ -1,8 +1,7 @@
 import React, { useMemo } from 'react';
 import { Flex, Box, Button, ModalFooter, ModalBody, Input } from '@chakra-ui/react';
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { PublishChannelEnum } from '@fastgpt/global/support/outLink/constant';
 import type { FeishuType, OutLinkEditType } from '@fastgpt/global/support/outLink/type';
 import { useTranslation } from 'next-i18next';
@@ -11,6 +10,7 @@ import { useRequest } from '@/web/common/hooks/useRequest';
 import dayjs from 'dayjs';
 import { createShareChat, updateShareChat } from '@/web/support/outLink/api';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const FeiShuEditModal = ({
   appId,
@@ -76,9 +76,7 @@ const FeiShuEditModal = ({
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
             QPM
-            <MyTooltip label={publishT('QPM Tips' || '')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={publishT('QPM Tips' || '')}></QuestionTip>
           </Flex>
           <Input
             max={1000}
@@ -93,9 +91,7 @@ const FeiShuEditModal = ({
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
             {t('support.outlink.Max usage points')}
-            <MyTooltip label={t('support.outlink.Max usage points tip')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <QuestionTip ml={1} label={t('support.outlink.Max usage points tip')}></QuestionTip>
           </Flex>
           <Input
             {...register('limit.maxUsagePoints', {

projects/app/src/pages/app/detail/components/Publish/FeiShu/index.tsx

@@ -26,6 +26,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import dayjs from 'dayjs';
 import dynamic from 'next/dynamic';
 import MyMenu from '@fastgpt/web/components/common/MyMenu';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const FeiShuEditModal = dynamic(() => import('./FeiShuEditModal'));
 
@@ -47,7 +48,7 @@ const FeiShu = ({ appId }: { appId: string }) => {
   return (
     <Box position={'relative'} pt={3} px={5} minH={'50vh'}>
       <Flex justifyContent={'space-between'}>
-        <Box fontWeight={'bold'} fontSize={['md', 'xl']}>
+        <Box fontWeight={'bold'} fontSize={['md', 'lg']}>
           {t('core.app.publish.Fei shu bot publish')}
         </Box>
         <Button
@@ -122,32 +123,36 @@ const FeiShu = ({ appId }: { appId: string }) => {
                     }
                     menuList={[
                       {
-                        label: t('common.Edit'),
-                        icon: 'edit',
-                        onClick: () =>
-                          setEditFeiShuLinkData({
-                            _id: item._id,
-                            name: item.name,
-                            limit: item.limit,
-                            app: item.app,
-                            responseDetail: item.responseDetail,
-                            defaultResponse: item.defaultResponse,
-                            immediateResponse: item.immediateResponse
-                          })
-                      },
-                      {
-                        label: t('common.Delete'),
-                        icon: 'delete',
-                        onClick: async () => {
-                          setIsLoading(true);
-                          try {
-                            await delShareChatById(item._id);
-                            refetchShareChatList();
-                          } catch (error) {
-                            console.log(error);
+                        children: [
+                          {
+                            label: t('common.Edit'),
+                            icon: 'edit',
+                            onClick: () =>
+                              setEditFeiShuLinkData({
+                                _id: item._id,
+                                name: item.name,
+                                limit: item.limit,
+                                app: item.app,
+                                responseDetail: item.responseDetail,
+                                defaultResponse: item.defaultResponse,
+                                immediateResponse: item.immediateResponse
+                              })
+                          },
+                          {
+                            label: t('common.Delete'),
+                            icon: 'delete',
+                            onClick: async () => {
+                              setIsLoading(true);
+                              try {
+                                await delShareChatById(item._id);
+                                refetchShareChatList();
+                              } catch (error) {
+                                console.log(error);
+                              }
+                              setIsLoading(false);
+                            }
                           }
-                          setIsLoading(false);
-                        }
+                        ]
                       }
                     ]}
                   />
@@ -178,12 +183,7 @@ const FeiShu = ({ appId }: { appId: string }) => {
         />
       )}
       {shareChatList.length === 0 && !isFetching && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.app.share.Not share link')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.app.share.Not share link')}></EmptyTip>
       )}
       <Loading loading={isFetching} fixed={false} />
     </Box>

projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx

@@ -139,7 +139,12 @@ console.log("Chat box loaded")
         />
 
         {/* config */}
-        <Grid gridTemplateColumns={['repeat(2,1fr)', 'repeat(3,1fr)']} gridGap={4} my={5}>
+        <Grid
+          gridTemplateColumns={['repeat(2,1fr)', 'repeat(3,1fr)']}
+          gridGap={4}
+          my={5}
+          fontSize={'sm'}
+        >
           <Flex {...gridItemStyle}>
             <Box flex={1}>{t('core.app.outLink.Show History')}</Box>
             <Switch {...register('showHistory')} />
@@ -181,7 +186,7 @@ console.log("Chat box loaded")
         </Grid>
 
         {/* code */}
-        <Box borderRadius={'md'} bg={'myGray.100'} overflow={'hidden'}>
+        <Box borderRadius={'md'} bg={'myGray.100'} overflow={'hidden'} fontSize={'sm'}>
           <Flex
             p={3}
             bg={'myWhite.500'}

projects/app/src/pages/app/detail/components/Publish/Link/index.tsx

@@ -15,9 +15,9 @@ import {
   Input,
   Switch,
   Link,
-  IconButton
+  IconButton,
+  HStack
 } from '@chakra-ui/react';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useLoading } from '@fastgpt/web/hooks/useLoading';
 import { useQuery } from '@tanstack/react-query';
@@ -37,7 +37,6 @@ import { PublishChannelEnum } from '@fastgpt/global/support/outLink/constant';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
-import MyTooltip from '@/components/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import dayjs from 'dayjs';
 import { getDocPath } from '@/web/common/system/doc';
@@ -45,6 +44,9 @@ import dynamic from 'next/dynamic';
 import MyMenu from '@fastgpt/web/components/common/MyMenu';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const SelectUsingWayModal = dynamic(() => import('./SelectUsingWayModal'));
 
@@ -72,12 +74,12 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
   return (
     <Box position={'relative'} pt={3} px={5} minH={'50vh'}>
       <Flex justifyContent={'space-between'}>
-        <Box fontWeight={'bold'} fontSize={['md', 'xl']}>
-          {t('core.app.Share link')}
-          <MyTooltip forceShow label={t('core.app.Share link desc detail')}>
-            <QuestionOutlineIcon ml={1} />
-          </MyTooltip>
-        </Box>
+        <HStack>
+          <Box color={'myGray.900'} fontSize={'lg'}>
+            {t('core.app.Share link')}
+          </Box>
+          <QuestionTip label={t('core.app.Share link desc detail')} />
+        </HStack>
         <Button
           variant={'whitePrimary'}
           colorScheme={'blue'}
@@ -168,31 +170,35 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
                     }
                     menuList={[
                       {
-                        label: t('common.Edit'),
-                        icon: 'edit',
-                        onClick: () =>
-                          setEditLinkData({
-                            _id: item._id,
-                            name: item.name,
-                            responseDetail: item.responseDetail,
-                            limit: item.limit
-                          })
-                      },
-                      {
-                        label: t('common.Delete'),
-                        icon: 'delete',
-                        type: 'danger',
-                        onClick: () =>
-                          openConfirm(async () => {
-                            setIsLoading(true);
-                            try {
-                              await delShareChatById(item._id);
-                              refetchShareChatList();
-                            } catch (error) {
-                              console.log(error);
-                            }
-                            setIsLoading(false);
-                          })()
+                        children: [
+                          {
+                            label: t('common.Edit'),
+                            icon: 'edit',
+                            onClick: () =>
+                              setEditLinkData({
+                                _id: item._id,
+                                name: item.name,
+                                responseDetail: item.responseDetail,
+                                limit: item.limit
+                              })
+                          },
+                          {
+                            label: t('common.Delete'),
+                            icon: 'delete',
+                            type: 'danger',
+                            onClick: () =>
+                              openConfirm(async () => {
+                                setIsLoading(true);
+                                try {
+                                  await delShareChatById(item._id);
+                                  refetchShareChatList();
+                                } catch (error) {
+                                  console.log(error);
+                                }
+                                setIsLoading(false);
+                              })()
+                          }
+                        ]
                       }
                     ]}
                   />
@@ -204,12 +210,7 @@ const Share = ({ appId }: { appId: string; type: PublishChannelEnum }) => {
       </TableContainer>
 
       {shareChatList.length === 0 && !isFetching && (
-        <Flex h={'100%'} flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.app.share.Not share link')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.app.share.Not share link')} />
       )}
       {!!editLinkData && (
         <EditLinkModal
@@ -300,7 +301,7 @@ function EditLinkModal({
     >
       <ModalBody>
         <Flex alignItems={'center'}>
-          <Box flex={'0 0 90px'}>{t('Name')}</Box>
+          <FormLabel flex={'0 0 90px'}>{t('Name')}</FormLabel>
           <Input
             placeholder={publishT('Link Name')}
             maxLength={20}
@@ -312,9 +313,9 @@ function EditLinkModal({
         {feConfigs?.isPlus && (
           <>
             <Flex alignItems={'center'} mt={4}>
-              <Flex flex={'0 0 90px'} alignItems={'center'}>
+              <FormLabel flex={'0 0 90px'} alignItems={'center'}>
                 {t('common.Expired Time')}
-              </Flex>
+              </FormLabel>
               <Input
                 type="datetime-local"
                 defaultValue={
@@ -329,10 +330,8 @@ function EditLinkModal({
             </Flex>
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                QPM
-                <MyTooltip label={publishT('QPM Tips' || '')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>QPM</FormLabel>
+                <QuestionTip ml={1} label={publishT('QPM Tips' || '')}></QuestionTip>
               </Flex>
               <Input
                 max={1000}
@@ -346,10 +345,8 @@ function EditLinkModal({
             </Flex>
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {t('support.outlink.Max usage points')}
-                <MyTooltip label={t('support.outlink.Max usage points tip')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>{t('support.outlink.Max usage points')}</FormLabel>
+                <QuestionTip ml={1} label={t('support.outlink.Max usage points tip')}></QuestionTip>
               </Flex>
               <Input
                 {...register('limit.maxUsagePoints', {
@@ -363,10 +360,8 @@ function EditLinkModal({
 
             <Flex alignItems={'center'} mt={4}>
               <Flex flex={'0 0 90px'} alignItems={'center'}>
-                {publishT('token auth')}
-                <MyTooltip label={publishT('token auth Tips') || ''}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel>{publishT('token auth')}</FormLabel>
+                <QuestionTip ml={1} label={publishT('token auth Tips') || ''}></QuestionTip>
               </Flex>
               <Input
                 placeholder={publishT('token auth Tips') || ''}
@@ -377,7 +372,7 @@ function EditLinkModal({
             <Link
               href={getDocPath('/docs/development/openapi/share')}
               target={'_blank'}
-              fontSize={'sm'}
+              fontSize={'xs'}
               color={'myGray.500'}
             >
               {publishT('token auth use cases')}
@@ -387,12 +382,13 @@ function EditLinkModal({
 
         <Flex alignItems={'center'} mt={4}>
           <Flex flex={'0 0 90px'} alignItems={'center'}>
-            {t('support.outlink.share.Response Quote')}
-            <MyTooltip label={t('support.outlink.share.Response Quote tips' || '')}>
-              <QuestionOutlineIcon ml={1} />
-            </MyTooltip>
+            <FormLabel>{t('support.outlink.share.Response Quote')}</FormLabel>
+            <QuestionTip
+              ml={1}
+              label={t('support.outlink.share.Response Quote tips' || '')}
+            ></QuestionTip>
           </Flex>
-          <Switch {...register('responseDetail')} size={'lg'} />
+          <Switch {...register('responseDetail')} />
         </Flex>
       </ModalBody>
 

projects/app/src/pages/app/detail/components/Publish/index.tsx

@@ -39,12 +39,12 @@ const OutLink = ({ appId }: { appId: string }) => {
 
   return (
     <Box pt={[1, 5]}>
-      <Box fontWeight={'bold'} fontSize={['md', 'xl']} mb={2} px={[4, 8]}>
+      <Box color={'myGray.900'} fontSize={'lg'} mb={2} px={[4, 8]}>
         {t('core.app.navbar.Publish app')}
       </Box>
       <Box pb={[5, 7]} px={[4, 8]} borderBottom={theme.borders.base}>
         <MyRadio
-          gridTemplateColumns={['repeat(1,1fr)', 'repeat(auto-fill, minmax(0, 300px))']}
+          gridTemplateColumns={['repeat(1,1fr)', 'repeat(auto-fill, minmax(0, 400px))']}
           iconSize={'20px'}
           list={publishList.current}
           value={linkType}

projects/app/src/pages/app/detail/components/SimpleEdit/AppCard.tsx

@@ -63,10 +63,10 @@ const AppCard = () => {
     <>
       <Box px={4}>
         <Flex alignItems={'center'} justifyContent={'space-between'}>
-          <Box fontSize={['md', 'xl']} fontWeight={'bold'}>
-            <PermissionIconText defaultPermission={appDetail.defaultPermission} />
+          <Box fontWeight={'bold'}>
+            <PermissionIconText defaultPermission={appDetail.defaultPermission} fontSize={'md'} />
           </Box>
-          <Box color={'myGray.500'} fontSize={'sm'}>
+          <Box color={'myGray.500'} fontSize={'xs'}>
             AppId:{' '}
             <Box as={'span'} userSelect={'all'}>
               {appId}
@@ -84,9 +84,9 @@ const AppCard = () => {
           bg={'primary.50'}
           position={'relative'}
         >
-          <Flex alignItems={'center'} py={2}>
+          <Flex alignItems={'center'}>
             <Avatar src={appDetail.avatar} borderRadius={'md'} w={'28px'} />
-            <Box ml={3} fontWeight={'bold'} fontSize={'lg'}>
+            <Box ml={3} fontWeight={'bold'} fontSize={'md'}>
               {appDetail.name}
             </Box>
             {appDetail.permission.isOwner && (
@@ -107,10 +107,12 @@ const AppCard = () => {
           </Flex>
           <Box
             flex={1}
-            my={2}
+            mt={3}
+            mb={4}
             className={'textEllipsis3'}
             wordBreak={'break-all'}
             color={'myGray.600'}
+            fontSize={'xs'}
           >
             {appDetail.intro || t('core.app.tip.Add a intro to app')}
           </Box>

projects/app/src/pages/app/detail/components/SimpleEdit/ChatTest.tsx

@@ -5,9 +5,8 @@ import React, { useCallback, useEffect, useRef } from 'react';
 import ChatBox from '@/components/ChatBox';
 import type { ComponentRef, StartChatFnProps } from '@/components/ChatBox/type.d';
 import { streamFetch } from '@/web/common/api/fetch';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import { getGuideModule } from '@fastgpt/global/core/workflow/utils';
 import { checkChatSupportSelectFileByModules } from '@/web/core/chat/utils';
 import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
 import {
@@ -104,7 +103,7 @@ const ChatTest = ({
       bg={'white'}
     >
       <Flex px={[2, 5]}>
-        <Box fontSize={['md', 'xl']} fontWeight={'bold'} flex={1}>
+        <Box fontSize={['md', 'lg']} fontWeight={'bold'} flex={1}>
           {appT('Chat Debug')}
         </Box>
         <MyTooltip label={t('core.chat.Restart')}>
@@ -151,7 +150,7 @@ const ChatTest = ({
           whiteSpace={'pre-wrap'}
           textAlign={'center'}
         >
-          <Box>{appT('Advance App TestTip')}</Box>
+          <Box fontSize={'md'}>{appT('Advance App TestTip')}</Box>
         </Flex>
       )}
     </Flex>

projects/app/src/pages/app/detail/components/SimpleEdit/EditForm.tsx

@@ -1,6 +1,15 @@
 import React, { useEffect, useMemo, useTransition } from 'react';
-import { Box, Flex, Grid, BoxProps, useTheme, useDisclosure, Button } from '@chakra-ui/react';
-import { AddIcon, QuestionOutlineIcon, SmallAddIcon } from '@chakra-ui/icons';
+import {
+  Box,
+  Flex,
+  Grid,
+  BoxProps,
+  useTheme,
+  useDisclosure,
+  Button,
+  HStack
+} from '@chakra-ui/react';
+import { AddIcon, SmallAddIcon } from '@chakra-ui/icons';
 import { useFieldArray, UseFormReturn } from 'react-hook-form';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import type { AppSimpleEditFormType } from '@fastgpt/global/core/app/type.d';
@@ -13,7 +22,7 @@ import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import { form2AppWorkflow } from '@/web/core/app/utils';
 
 import dynamic from 'next/dynamic';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import Avatar from '@/components/Avatar';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import VariableEdit from '@/components/core/app/VariableEdit';
@@ -30,6 +39,8 @@ import { useUpdate } from 'ahooks';
 import { useI18n } from '@/web/context/I18n';
 import { useContextSelector } from 'use-context-selector';
 import { AppContext } from '@/web/core/app/context/appContext';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const DatasetSelectModal = dynamic(() => import('@/components/core/app/DatasetSelectModal'));
 const DatasetParamsModal = dynamic(() => import('@/components/core/app/DatasetParamsModal'));
@@ -52,7 +63,7 @@ const BoxStyles: BoxProps = {
 const LabelStyles: BoxProps = {
   w: ['60px', '100px'],
   flexShrink: 0,
-  fontSize: ['sm', 'md']
+  fontSize: 'xs'
 };
 
 const EditForm = ({
@@ -172,14 +183,10 @@ const EditForm = ({
           boxShadow: '0 2px 10px rgba(0,0,0,0.12)'
         })}
       >
-        <Flex alignItems={'center'}>
-          <Box fontSize={['md', 'xl']} color={'myGray.800'}>
-            {t('core.app.App params config')}
-          </Box>
-          <MyTooltip label={t('core.app.Simple Config Tip')} forceShow>
-            <MyIcon name={'common/questionLight'} color={'myGray.500'} ml={2} />
-          </MyTooltip>
-        </Flex>
+        <HStack>
+          <Box color={'myGray.900'}>{t('core.app.App params config')}</Box>
+          <QuestionTip label={t('core.app.Simple Config Tip')} />
+        </HStack>
         <Button
           isLoading={isSaving}
           size={['sm', 'md']}
@@ -209,9 +216,9 @@ const EditForm = ({
           <Box {...BoxStyles}>
             <Flex alignItems={'center'}>
               <MyIcon name={'core/app/simpleMode/ai'} w={'20px'} />
-              <Box ml={2} flex={1}>
+              <FormLabel ml={2} flex={1}>
                 {appT('AI Settings')}
-              </Box>
+              </FormLabel>
             </Flex>
             <Flex alignItems={'center'} mt={5}>
               <Box {...LabelStyles}>{t('core.ai.Model')}</Box>
@@ -235,12 +242,10 @@ const EditForm = ({
             </Flex>
 
             <Box mt={3}>
-              <Box {...LabelStyles}>
-                {t('core.ai.Prompt')}
-                <MyTooltip label={t('core.app.tip.chatNodeSystemPromptTip')} forceShow>
-                  <QuestionOutlineIcon display={['none', 'inline']} ml={1} />
-                </MyTooltip>
-              </Box>
+              <HStack {...LabelStyles}>
+                <Box>{t('core.ai.Prompt')}</Box>
+                <QuestionTip label={t('core.app.tip.chatNodeSystemPromptTip')} />
+              </HStack>
               <Box mt={1}>
                 <PromptEditor
                   value={aiSystemPrompt}
@@ -262,14 +267,14 @@ const EditForm = ({
             <Flex alignItems={'center'}>
               <Flex alignItems={'center'} flex={1}>
                 <MyIcon name={'core/app/simpleMode/dataset'} w={'20px'} />
-                <Box ml={2}>{t('core.dataset.Choose Dataset')}</Box>
+                <FormLabel ml={2}>{t('core.dataset.Choose Dataset')}</FormLabel>
               </Flex>
               <Button
                 variant={'transparentBase'}
-                leftIcon={<AddIcon fontSize={'xs'} />}
+                leftIcon={<SmallAddIcon />}
                 iconSpacing={1}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenKbSelect}
               >
                 {t('common.Choose')}
@@ -279,7 +284,7 @@ const EditForm = ({
                 leftIcon={<MyIcon name={'edit'} w={'14px'} />}
                 iconSpacing={1}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenDatasetParams}
               >
                 {t('common.Params')}
@@ -335,10 +340,8 @@ const EditForm = ({
             <Flex alignItems={'center'}>
               <Flex alignItems={'center'} flex={1}>
                 <MyIcon name={'core/app/toolCall'} w={'20px'} />
-                <Box ml={2}>{t('core.app.Tool call')}(实验功能)</Box>
-                <MyTooltip label={t('core.app.Tool call tip')}>
-                  <QuestionOutlineIcon ml={1} />
-                </MyTooltip>
+                <FormLabel ml={2}>{t('core.app.Tool call')}(实验功能)</FormLabel>
+                <QuestionTip ml={1} label={t('core.app.Tool call tip')} />
               </Flex>
               <Button
                 variant={'transparentBase'}
@@ -346,7 +349,7 @@ const EditForm = ({
                 iconSpacing={1}
                 mr={'-5px'}
                 size={'sm'}
-                fontSize={'md'}
+                fontSize={'sm'}
                 onClick={onOpenToolsSelect}
               >
                 {t('common.Choose')}
@@ -434,7 +437,6 @@ const EditForm = ({
           <Box {...BoxStyles}>
             <QGSwitch
               isChecked={postQuestionGuide}
-              size={'lg'}
               onChange={(e) => {
                 setValue('chatConfig.questionGuide', e.target.checked);
               }}

projects/app/src/pages/app/detail/components/SimpleEdit/ToolSelectModal.tsx

@@ -341,7 +341,7 @@ const RenderList = React.memo(function RenderList({
                         );
                       }
                       if (input.valueType === WorkflowIOValueTypeEnum.boolean) {
-                        return <Switch size={'lg'} {...register(input.key, { required })} />;
+                        return <Switch {...register(input.key, { required })} />;
                       }
                       return (
                         <JsonEditor

projects/app/src/pages/app/detail/index.tsx

@@ -100,7 +100,7 @@ const AppDetail = ({ appId, currentTab }: { appId: string; currentTab: TabEnum }
             >
               <Flex mb={4} alignItems={'center'}>
                 <Avatar src={appDetail.avatar} w={'34px'} borderRadius={'md'} />
-                <Box ml={2} fontWeight={'bold'}>
+                <Box ml={2} fontSize={'sm'} fontWeight={'bold'}>
                   {appDetail.name}
                 </Box>
               </Flex>
@@ -142,7 +142,7 @@ const AppDetail = ({ appId, currentTab }: { appId: string; currentTab: TabEnum }
             </Box>
             {/* phone tab */}
             <Box display={['block', 'none']} textAlign={'center'} py={3}>
-              <Box className="textlg" fontSize={'xl'} fontWeight={'bold'}>
+              <Box className="textlg" fontSize={'lg'} fontWeight={'bold'}>
                 {appDetail.name}
               </Box>
               <Tabs

projects/app/src/pages/app/list/component/CreateModal.tsx

@@ -21,7 +21,7 @@ import { appTemplates } from '@/web/core/app/templates';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
@@ -110,7 +110,7 @@ const CreateModal = ({ onClose, onSuccess }: { onClose: () => void; onSuccess: (
         <Box color={'myGray.800'} fontWeight={'bold'}>
           {t('common.Set Name')}
         </Box>
-        <Flex mt={3} alignItems={'center'}>
+        <Flex mt={2} alignItems={'center'}>
           <MyTooltip label={t('common.Set Avatar')}>
             <Avatar
               flexShrink={0}
@@ -164,11 +164,11 @@ const CreateModal = ({ onClose, onSuccess }: { onClose: () => void; onSuccess: (
             >
               <Flex alignItems={'center'}>
                 <Avatar src={item.avatar} borderRadius={'md'} w={'20px'} />
-                <Box ml={3} fontWeight={'bold'}>
+                <Box ml={3} color={'myGray.900'}>
                   {t(item.name)}
                 </Box>
               </Flex>
-              <Box fontSize={'sm'} mt={4}>
+              <Box fontSize={'xs'} mt={2} color={'myGray.600'}>
                 {t(item.intro)}
               </Box>
             </Card>

projects/app/src/pages/app/list/index.tsx

@@ -10,13 +10,14 @@ import { serviceSideProps } from '@/web/common/utils/i18n';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import PageContainer from '@/components/PageContainer';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import CreateModal from './component/CreateModal';
 import { useAppStore } from '@/web/core/app/store/useAppStore';
 import PermissionIconText from '@/components/support/permission/IconText';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { useI18n } from '@/web/context/I18n';
 import { useTranslation } from 'next-i18next';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const MyApps = () => {
   const { t } = useTranslation();
@@ -141,7 +142,7 @@ const MyApps = () => {
                 className={'textEllipsis3'}
                 py={2}
                 wordBreak={'break-all'}
-                fontSize={'sm'}
+                fontSize={'xs'}
                 color={'myGray.600'}
               >
                 {app.intro || '这个应用还没写介绍~'}
@@ -177,14 +178,7 @@ const MyApps = () => {
         ))}
       </Grid>
 
-      {myApps.length === 0 && (
-        <Flex mt={'35vh'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            还没有应用，快去创建一个吧！
-          </Box>
-        </Flex>
-      )}
+      {myApps.length === 0 && <EmptyTip text={'还没有应用，快去创建一个吧！'} pt={'30vh'} />}
       <ConfirmModal />
       {isOpenCreateModal && (
         <CreateModal onClose={onCloseCreateModal} onSuccess={() => loadMyApps()} />

projects/app/src/pages/chat/components/ChatHeader.tsx

@@ -8,7 +8,7 @@ import type { ChatItemType } from '@fastgpt/global/core/chat/type';
 import { useRouter } from 'next/router';
 import { useTranslation } from 'next-i18next';
 import { getChatTitleFromChatMessage } from '@fastgpt/global/core/chat/utils';
-import FillTag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 
 const ChatHeader = ({
   history,
@@ -27,7 +27,6 @@ const ChatHeader = ({
   onRoute2AppDetail?: () => void;
   onOpenSlider: () => void;
 }) => {
-  const router = useRouter();
   const theme = useTheme();
   const { t } = useTranslation();
   const { isPc } = useSystemStore();
@@ -44,25 +43,26 @@ const ChatHeader = ({
       h={['46px', '60px']}
       borderBottom={theme.borders.sm}
       color={'myGray.900'}
+      fontSize={'sm'}
     >
       {isPc ? (
         <>
           <Box mr={3} color={'myGray.1000'}>
             {title}
           </Box>
-          <FillTag>
+          <MyTag>
             <MyIcon name={'history'} w={'14px'} />
             <Box ml={1}>
               {history.length === 0
                 ? t('core.chat.New Chat')
                 : t('core.chat.History Amount', { amount: history.length })}
             </Box>
-          </FillTag>
+          </MyTag>
           {!!chatModels && chatModels.length > 0 && (
-            <FillTag ml={2} colorSchema={'green'}>
+            <MyTag ml={2} colorSchema={'green'}>
               <MyIcon name={'core/chat/chatModelTag'} w={'14px'} />
               <Box ml={1}>{chatModels.join(',')}</Box>
-            </FillTag>
+            </MyTag>
           )}
           <Box flex={1} />
         </>

projects/app/src/pages/chat/components/ChatHistorySlider.tsx

@@ -14,7 +14,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useEditTitle } from '@/web/common/hooks/useEditTitle';
 import { useRouter } from 'next/router';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';
@@ -24,6 +24,7 @@ import { AppListItemType } from '@fastgpt/global/core/app/type';
 import { useQuery } from '@tanstack/react-query';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
 import { useI18n } from '@/web/context/I18n';
+import MyMenu from '@fastgpt/web/components/common/MyMenu';
 
 type HistoryItemType = {
   id: string;
@@ -126,6 +127,7 @@ const ChatHistorySlider = ({
             px={[2, 5]}
             alignItems={'center'}
             cursor={canRouteToDetail ? 'pointer' : 'default'}
+            fontSize={'sm'}
             onClick={() =>
               canRouteToDetail &&
               router.replace({
@@ -193,16 +195,17 @@ const ChatHistorySlider = ({
                 position={'relative'}
                 key={item.id || `${i}`}
                 alignItems={'center'}
-                py={3}
+                py={2.5}
                 px={4}
                 cursor={'pointer'}
                 userSelect={'none'}
                 borderRadius={'md'}
                 mb={2}
+                fontSize={'sm'}
                 _hover={{
-                  bg: 'myGray.100',
+                  bg: 'myGray.50',
                   '& .more': {
-                    display: 'block'
+                    visibility: 'visible'
                   }
                 }}
                 bg={item.top ? '#E6F6F6 !important' : ''}
@@ -225,63 +228,63 @@ const ChatHistorySlider = ({
                   {item.customTitle || item.title}
                 </Box>
                 {!!item.id && (
-                  <Box className="more" display={['block', 'none']}>
-                    <Menu autoSelect={false} isLazy offset={[0, 5]}>
-                      <MenuButton
-                        _hover={{ bg: 'white' }}
-                        cursor={'pointer'}
-                        borderRadius={'md'}
-                        onClick={(e) => {
-                          e.stopPropagation();
-                        }}
-                      >
-                        <MyIcon name={'more'} w={'14px'} p={1} />
-                      </MenuButton>
-                      <MenuList color={'myGray.700'} minW={`90px !important`}>
-                        {onSetHistoryTop && (
-                          <MenuItem
-                            onClick={(e) => {
-                              e.stopPropagation();
-                              onSetHistoryTop({ chatId: item.id, top: !item.top });
-                            }}
-                          >
-                            <MyIcon mr={2} name={'core/chat/setTopLight'} w={'16px'}></MyIcon>
-                            {item.top ? t('core.chat.Unpin') : t('core.chat.Pin')}
-                          </MenuItem>
-                        )}
-                        {onSetCustomTitle && (
-                          <MenuItem
-                            onClick={(e) => {
-                              e.stopPropagation();
-                              onOpenModal({
-                                defaultVal: item.customTitle || item.title,
-                                onSuccess: (e) =>
-                                  onSetCustomTitle({
-                                    chatId: item.id,
-                                    title: e
-                                  })
-                              });
-                            }}
-                          >
-                            <MyIcon mr={2} name={'common/customTitleLight'} w={'16px'}></MyIcon>
-                            {t('common.Custom Title')}
-                          </MenuItem>
-                        )}
-                        <MenuItem
-                          _hover={{ color: 'red.500' }}
-                          onClick={(e) => {
-                            e.stopPropagation();
-                            onDelHistory({ chatId: item.id });
-                            if (item.id === activeChatId) {
-                              onChangeChat();
+                  <Box className="more" visibility={['visible', 'hidden']}>
+                    <MyMenu
+                      Button={
+                        <IconButton
+                          size={'xs'}
+                          variant={'whiteBase'}
+                          icon={<MyIcon name={'more'} w={'14px'} p={1} />}
+                          aria-label={''}
+                        />
+                      }
+                      menuList={[
+                        {
+                          children: [
+                            ...(onSetHistoryTop
+                              ? [
+                                  {
+                                    label: item.top ? t('core.chat.Unpin') : t('core.chat.Pin'),
+                                    icon: 'core/chat/setTopLight',
+                                    onClick: () => {
+                                      onSetHistoryTop({ chatId: item.id, top: !item.top });
+                                    }
+                                  }
+                                ]
+                              : []),
+                            ...(onSetCustomTitle
+                              ? [
+                                  {
+                                    label: t('common.Custom Title'),
+                                    icon: 'common/customTitleLight',
+                                    onClick: () => {
+                                      onOpenModal({
+                                        defaultVal: item.customTitle || item.title,
+                                        onSuccess: (e) =>
+                                          onSetCustomTitle({
+                                            chatId: item.id,
+                                            title: e
+                                          })
+                                      });
+                                    }
+                                  }
+                                ]
+                              : []),
+                            {
+                              label: t('common.Delete'),
+                              icon: 'delete',
+                              onClick: () => {
+                                onDelHistory({ chatId: item.id });
+                                if (item.id === activeChatId) {
+                                  onChangeChat();
+                                }
+                              },
+                              type: 'danger'
                             }
-                          }}
-                        >
-                          <MyIcon mr={2} name={'delete'} w={'16px'}></MyIcon>
-                          {t('common.Delete')}
-                        </MenuItem>
-                      </MenuList>
-                    </Menu>
+                          ]
+                        }
+                      ]}
+                    />
                   </Box>
                 )}
               </Flex>

projects/app/src/pages/chat/components/SliderApps.tsx

@@ -55,6 +55,7 @@ const SliderApps = ({
             cursor={'pointer'}
             borderRadius={'md'}
             alignItems={'center'}
+            fontSize={'sm'}
             {...(item._id === activeAppId
               ? {
                   bg: 'white',

projects/app/src/pages/chat/components/ToolMenu.tsx

@@ -55,7 +55,7 @@ const ToolMenu = ({ history }: { history: ChatItemType[] }) => {
           variant={'whitePrimary'}
         />
       }
-      menuList={menuList}
+      menuList={[{ children: menuList }]}
     />
   ) : (
     <Box w={'28px'} h={'28px'} />

projects/app/src/pages/dataset/detail/components/CollectionCard/Header.tsx

@@ -122,7 +122,7 @@ const Header = ({}: {}) => {
           }))}
           FirstPathDom={
             <>
-              <Box fontWeight={'bold'} fontSize={['sm', 'lg']}>
+              <Box fontWeight={'bold'} fontSize={['sm', 'md']}>
                 {t(DatasetTypeMap[datasetDetail?.type]?.collectionLabel)}({total})
               </Box>
               {datasetDetail?.websiteConfig?.url && (
@@ -219,54 +219,58 @@ const Header = ({}: {}) => {
               }
               menuList={[
                 {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
-                      {t('Folder')}
-                    </Flex>
-                  ),
-                  onClick: () => setEditFolderData({})
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/manualCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Manual collection')}
-                    </Flex>
-                  ),
-                  onClick: () => {
-                    onOpenCreateVirtualFileModal({
-                      defaultVal: '',
-                      onSuccess: (name) => {
-                        onCreateCollection({ name, type: DatasetCollectionTypeEnum.virtual });
+                  children: [
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
+                          {t('Folder')}
+                        </Flex>
+                      ),
+                      onClick: () => setEditFolderData({})
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/manualCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Manual collection')}
+                        </Flex>
+                      ),
+                      onClick: () => {
+                        onOpenCreateVirtualFileModal({
+                          defaultVal: '',
+                          onSuccess: (name) => {
+                            onCreateCollection({ name, type: DatasetCollectionTypeEnum.virtual });
+                          }
+                        });
                       }
-                    });
-                  }
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Text collection')}
-                    </Flex>
-                  ),
-                  onClick: onOpenFileSourceSelector
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/tableCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Table collection')}
-                    </Flex>
-                  ),
-                  onClick: () =>
-                    router.replace({
-                      query: {
-                        ...router.query,
-                        currentTab: TabEnum.import,
-                        source: ImportDataSourceEnum.csvTable
-                      }
-                    })
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Text collection')}
+                        </Flex>
+                      ),
+                      onClick: onOpenFileSourceSelector
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/tableCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Table collection')}
+                        </Flex>
+                      ),
+                      onClick: () =>
+                        router.replace({
+                          query: {
+                            ...router.query,
+                            currentTab: TabEnum.import,
+                            source: ImportDataSourceEnum.csvTable
+                          }
+                        })
+                    }
+                  ]
                 }
               ]}
             />
@@ -334,29 +338,33 @@ const Header = ({}: {}) => {
               }
               menuList={[
                 {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
-                      {t('Folder')}
-                    </Flex>
-                  ),
-                  onClick: () => setEditFolderData({})
-                },
-                {
-                  label: (
-                    <Flex>
-                      <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
-                      {t('core.dataset.Text collection')}
-                    </Flex>
-                  ),
-                  onClick: () =>
-                    router.replace({
-                      query: {
-                        ...router.query,
-                        currentTab: TabEnum.import,
-                        source: ImportDataSourceEnum.externalFile
-                      }
-                    })
+                  children: [
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'common/folderFill'} w={'20px'} mr={2} />
+                          {t('Folder')}
+                        </Flex>
+                      ),
+                      onClick: () => setEditFolderData({})
+                    },
+                    {
+                      label: (
+                        <Flex>
+                          <MyIcon name={'core/dataset/fileCollection'} mr={2} w={'20px'} />
+                          {t('core.dataset.Text collection')}
+                        </Flex>
+                      ),
+                      onClick: () =>
+                        router.replace({
+                          query: {
+                            ...router.query,
+                            currentTab: TabEnum.import,
+                            source: ImportDataSourceEnum.externalFile
+                          }
+                        })
+                    }
+                  ]
                 }
               ]}
             />

projects/app/src/pages/dataset/detail/components/CollectionCard/index.tsx

@@ -36,7 +36,7 @@ import dynamic from 'next/dynamic';
 import { useDrag } from '@/web/common/hooks/useDrag';
 import SelectCollections from '@/web/core/dataset/components/SelectCollections';
 import { useToast } from '@fastgpt/web/hooks/useToast';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useUserStore } from '@/web/support/user/useUserStore';
 import { TeamMemberRoleEnum } from '@fastgpt/global/support/user/team/constant';
 import { DatasetCollectionSyncResultEnum } from '@fastgpt/global/core/dataset/constants';
@@ -186,33 +186,25 @@ const CollectionCard = () => {
           position={'relative'}
           flex={'1 0 0'}
           overflowY={'auto'}
+          fontSize={'sm'}
         >
-          <Table variant={'simple'} fontSize={'sm'} draggable={false}>
+          <Table variant={'simple'} draggable={false}>
             <Thead draggable={false}>
-              <Tr bg={'myGray.100'} mb={2}>
-                <Th borderLeftRadius={'md'} overflow={'hidden'} borderBottom={'none'} py={4}>
-                  #
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('common.Name')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('dataset.collections.Data Amount')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('core.dataset.Sync Time')}
-                </Th>
-                <Th borderBottom={'none'} py={4}>
-                  {t('common.Status')}
-                </Th>
-                <Th borderRightRadius={'md'} overflow={'hidden'} borderBottom={'none'} py={4} />
+              <Tr>
+                <Th py={4}>#</Th>
+                <Th py={4}>{t('common.Name')}</Th>
+                <Th py={4}>{t('dataset.collections.Data Amount')}</Th>
+                <Th py={4}>{t('core.dataset.Sync Time')}</Th>
+                <Th py={4}>{t('common.Status')}</Th>
+                <Th py={4} />
               </Tr>
             </Thead>
             <Tbody>
+              <Tr h={'10px'} />
               {formatCollections.map((collection, index) => (
                 <Tr
                   key={collection._id}
-                  _hover={{ bg: 'myWhite.600' }}
+                  _hover={{ bg: 'myGray.50' }}
                   cursor={'pointer'}
                   data-drag-id={
                     collection.type === DatasetCollectionTypeEnum.folder
@@ -271,13 +263,13 @@ const CollectionCard = () => {
                     <Flex alignItems={'center'}>
                       <MyIcon name={collection.icon as any} w={'16px'} mr={2} />
                       <MyTooltip label={t('common.folder.Drag Tip')} shouldWrapChildren={false}>
-                        <Box fontWeight={'bold'} className="textEllipsis">
+                        <Box color={'myGray.900'} className="textEllipsis">
                           {collection.name}
                         </Box>
                       </MyTooltip>
                     </Flex>
                   </Td>
-                  <Td fontSize={'md'}>{collection.dataAmount || '-'}</Td>
+                  <Td>{collection.dataAmount || '-'}</Td>
                   <Td>{dayjs(collection.updateTime).format('YYYY/MM/DD HH:mm')}</Td>
                   <Td>
                     <Box
@@ -333,72 +325,81 @@ const CollectionCard = () => {
                           </MenuButton>
                         }
                         menuList={[
-                          ...(collection.type === DatasetCollectionTypeEnum.link
-                            ? [
-                                {
-                                  label: (
-                                    <Flex alignItems={'center'}>
-                                      <MyIcon name={'common/refreshLight'} w={'14px'} mr={2} />
-                                      {t('core.dataset.collection.Sync')}
-                                    </Flex>
-                                  ),
-                                  onClick: () =>
-                                    openSyncConfirm(() => {
-                                      onclickStartSync(collection._id);
-                                    })()
-                                }
-                              ]
-                            : []),
                           {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
-                                {t('Move')}
-                              </Flex>
-                            ),
-                            onClick: () => setMoveCollectionData({ collectionId: collection._id })
+                            children: [
+                              ...(collection.type === DatasetCollectionTypeEnum.link
+                                ? [
+                                    {
+                                      label: (
+                                        <Flex alignItems={'center'}>
+                                          <MyIcon name={'common/refreshLight'} w={'14px'} mr={2} />
+                                          {t('core.dataset.collection.Sync')}
+                                        </Flex>
+                                      ),
+                                      onClick: () =>
+                                        openSyncConfirm(() => {
+                                          onclickStartSync(collection._id);
+                                        })()
+                                    }
+                                  ]
+                                : []),
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
+                                    {t('Move')}
+                                  </Flex>
+                                ),
+                                onClick: () =>
+                                  setMoveCollectionData({ collectionId: collection._id })
+                              },
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon name={'edit'} w={'14px'} mr={2} />
+                                    {t('Rename')}
+                                  </Flex>
+                                ),
+                                onClick: () =>
+                                  onOpenEditTitleModal({
+                                    defaultVal: collection.name,
+                                    onSuccess: (newName) => {
+                                      onUpdateCollectionName({
+                                        collectionId: collection._id,
+                                        name: newName
+                                      });
+                                    }
+                                  })
+                              }
+                            ]
                           },
                           {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'edit'} w={'14px'} mr={2} />
-                                {t('Rename')}
-                              </Flex>
-                            ),
-                            onClick: () =>
-                              onOpenEditTitleModal({
-                                defaultVal: collection.name,
-                                onSuccess: (newName) => {
-                                  onUpdateCollectionName({
-                                    collectionId: collection._id,
-                                    name: newName
-                                  });
-                                }
-                              })
-                          },
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon
-                                  mr={1}
-                                  name={'delete'}
-                                  w={'14px'}
-                                  _hover={{ color: 'red.600' }}
-                                />
-                                <Box>{t('common.Delete')}</Box>
-                              </Flex>
-                            ),
-                            type: 'danger',
-                            onClick: () =>
-                              openDeleteConfirm(
-                                () => {
-                                  onDelCollection(collection._id);
-                                },
-                                undefined,
-                                collection.type === DatasetCollectionTypeEnum.folder
-                                  ? t('dataset.collections.Confirm to delete the folder')
-                                  : t('dataset.Confirm to delete the file')
-                              )()
+                            children: [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      mr={1}
+                                      name={'delete'}
+                                      w={'14px'}
+                                      _hover={{ color: 'red.600' }}
+                                    />
+                                    <Box>{t('common.Delete')}</Box>
+                                  </Flex>
+                                ),
+                                type: 'danger',
+                                onClick: () =>
+                                  openDeleteConfirm(
+                                    () => {
+                                      onDelCollection(collection._id);
+                                    },
+                                    undefined,
+                                    collection.type === DatasetCollectionTypeEnum.folder
+                                      ? t('dataset.collections.Confirm to delete the folder')
+                                      : t('dataset.Confirm to delete the file')
+                                  )()
+                              }
+                            ]
                           }
                         ]}
                       />

projects/app/src/pages/dataset/detail/components/DataCard.tsx

@@ -42,10 +42,11 @@ import { DatasetCollectionTypeMap, TrainingTypeMap } from '@fastgpt/global/core/
 import { formatTime2YMDHM } from '@fastgpt/global/common/string/time';
 import { formatFileSize } from '@fastgpt/global/common/file/tools';
 import { getCollectionSourceAndOpen } from '@/web/core/dataset/hooks/readCollectionSource';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { usePagination } from '@fastgpt/web/hooks/usePagination';
 import { getCollectionSourceData } from '@fastgpt/global/core/dataset/collection/utils';
 import { useI18n } from '@/web/context/I18n';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const DataCard = () => {
   const BoxRef = useRef<HTMLDivElement>(null);
@@ -181,7 +182,7 @@ const DataCard = () => {
           : [])
       }
     ];
-  }, [collection, t]);
+  }, [collection, datasetT, t]);
 
   return (
     <Box position={'relative'} py={[1, 5]} h={'100%'}>
@@ -210,7 +211,7 @@ const DataCard = () => {
                 <RawSourceBox
                   collectionId={collection._id}
                   {...getCollectionSourceData(collection)}
-                  fontSize={['md', 'lg']}
+                  fontSize={['sm', 'md']}
                   color={'black'}
                   textDecoration={'none'}
                 />
@@ -252,7 +253,7 @@ const DataCard = () => {
         </Flex>
         <Flex my={3} alignItems={'center'} px={5}>
           <Box>
-            <Box as={'span'} fontSize={['md', 'lg']}>
+            <Box as={'span'} fontSize={['sm', 'md']}>
               {t('core.dataset.data.Total Amount', { total })}
             </Box>
           </Box>
@@ -397,14 +398,7 @@ const DataCard = () => {
               <Pagination />
             </Flex>
           )}
-          {total === 0 && (
-            <Flex flexDirection={'column'} alignItems={'center'} pt={'10vh'}>
-              <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-              <Box mt={2} color={'myGray.500'}>
-                {t('core.dataset.data.Empty Tip')}
-              </Box>
-            </Flex>
-          )}
+          {total === 0 && <EmptyTip text={t('core.dataset.data.Empty Tip')}></EmptyTip>}
         </Box>
       </Flex>
 
@@ -412,11 +406,19 @@ const DataCard = () => {
       <Drawer isOpen={isOpen} placement="right" size={'md'} onClose={onClose}>
         <DrawerOverlay />
         <DrawerContent>
-          <DrawerHeader>{t('core.dataset.collection.metadata.metadata')}</DrawerHeader>
+          <DrawerHeader fontSize={'lg'}>
+            {t('core.dataset.collection.metadata.metadata')}
+          </DrawerHeader>
 
           <DrawerBody>
             {metadataList.map((item) => (
-              <Flex key={item.label} alignItems={'center'} mb={5} wordBreak={'break-all'}>
+              <Flex
+                key={item.label}
+                alignItems={'center'}
+                mb={5}
+                wordBreak={'break-all'}
+                fontSize={'sm'}
+              >
                 <Box color={'myGray.500'} flex={'0 0 100px'}>
                   {item.label}
                 </Box>

projects/app/src/pages/dataset/detail/components/Import/commonProgress/DataProcess.tsx

@@ -19,15 +19,16 @@ import { useTranslation } from 'next-i18next';
 import LeftRadio from '@fastgpt/web/components/common/Radio/LeftRadio';
 import { TrainingModeEnum, TrainingTypeMap } from '@fastgpt/global/core/dataset/constants';
 import { ImportProcessWayEnum } from '@/web/core/dataset/constants';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { Prompt_AgentQA } from '@fastgpt/global/core/ai/prompt/agent';
 import Preview from '../components/Preview';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetImportContext } from '../Context';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean }) {
   const { t } = useTranslation();
@@ -73,17 +74,15 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
   );
 
   return (
-    <Box h={'100%'} display={['block', 'flex']} gap={5}>
+    <Box h={'100%'} display={['block', 'flex']} gap={5} fontSize={'sm'}>
       <Box flex={'1 0 0'} minW={['auto', '540px']} maxW={'600px'}>
         <Flex alignItems={'center'}>
           <MyIcon name={'common/settingLight'} w={'20px'} />
-          <Box fontSize={'lg'}>{t('core.dataset.import.Data process params')}</Box>
+          <Box fontSize={'md'}>{t('core.dataset.import.Data process params')}</Box>
         </Flex>
 
         <Flex mt={4} alignItems={'center'}>
-          <Box color={'myGray.600'} flex={'0 0 100px'}>
-            {t('core.dataset.import.Training mode')}
-          </Box>
+          <FormLabel flex={'0 0 100px'}>{t('core.dataset.import.Training mode')}</FormLabel>
           <LeftRadio
             list={trainingModeList.map(([key, value]) => ({
               title: t(value.label),
@@ -94,15 +93,14 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
             py={2}
             value={mode}
             onChange={onSelectTrainWay}
-            gridTemplateColumns={'repeat(3,1fr)'}
             defaultBg="white"
             activeBg="white"
+            display={'flex'}
+            flexWrap={'wrap'}
           />
         </Flex>
         <Flex mt={5}>
-          <Box color={'myGray.600'} flex={'0 0 100px'}>
-            {t('core.dataset.import.Process way')}
-          </Box>
+          <FormLabel flex={'0 0 100px'}>{t('core.dataset.import.Process way')}</FormLabel>
           <LeftRadio
             list={[
               {
@@ -269,9 +267,9 @@ function DataProcess({ showPreviewChunks = true }: { showPreviewChunks: boolean
         <Flex mt={5} alignItems={'center'} pl={'100px'} gap={3}>
           {feConfigs?.show_pay && (
             <MyTooltip label={priceTip}>
-              <Tag colorSchema={'gray'} py={'6px'} borderRadius={'md'} px={3}>
+              <MyTag colorSchema={'gray'} py={'6px'} borderRadius={'md'} px={3}>
                 {priceTip}
-              </Tag>
+              </MyTag>
             </MyTooltip>
           )}
         </Flex>

projects/app/src/pages/dataset/detail/components/Import/commonProgress/Upload.tsx

@@ -25,7 +25,7 @@ import {
   postCreateDatasetLinkCollection,
   postCreateDatasetTextCollection
 } from '@/web/core/dataset/api';
-import Tag from '@fastgpt/web/components/common/Tag/index';
+import MyTag from '@fastgpt/web/components/common/Tag/index';
 import { useI18n } from '@/web/context/I18n';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContext';
@@ -173,13 +173,13 @@ const Upload = () => {
                 <Td>
                   <Box display={'inline-block'}>
                     {item.createStatus === 'waiting' && (
-                      <Tag colorSchema={'gray'}>{t('common.Waiting')}</Tag>
+                      <MyTag colorSchema={'gray'}>{t('common.Waiting')}</MyTag>
                     )}
                     {item.createStatus === 'creating' && (
-                      <Tag colorSchema={'blue'}>{t('common.Creating')}</Tag>
+                      <MyTag colorSchema={'blue'}>{t('common.Creating')}</MyTag>
                     )}
                     {item.createStatus === 'finish' && (
-                      <Tag colorSchema={'green'}>{t('common.Finish')}</Tag>
+                      <MyTag colorSchema={'green'}>{t('common.Finish')}</MyTag>
                     )}
                   </Box>
                 </Td>

projects/app/src/pages/dataset/detail/components/Import/components/FileSelector.tsx

@@ -150,7 +150,7 @@ const FileSelector = ({
 
       return onSelectFile(filterFiles);
     },
-    [maxCount, maxSize, onSelectFile, selectFiles.length, t, toast]
+    [fileT, maxCount, maxSize, onSelectFile, selectFiles.length, toast]
   );
 
   const handleDragEnter = (e: DragEvent<HTMLDivElement>) => {

projects/app/src/pages/dataset/detail/components/Import/components/Preview.tsx

@@ -22,7 +22,7 @@ const Preview = ({ showPreviewChunks }: { showPreviewChunks: boolean }) => {
     <Box h={'100%'} display={['block', 'flex']} flexDirection={'column'}>
       <Flex alignItems={'center'}>
         <MyIcon name={'core/dataset/fileCollection'} w={'20px'} />
-        <Box fontSize={'lg'}>{t('core.dataset.import.Sources list')}</Box>
+        <Box fontSize={'md'}>{t('core.dataset.import.Sources list')}</Box>
       </Flex>
       <Box mt={3} flex={'1 0 0'} width={'100%'} overflow={'auto'}>
         {sources.map((source) => (
@@ -54,22 +54,26 @@ const Preview = ({ showPreviewChunks }: { showPreviewChunks: boolean }) => {
                   }
                   menuList={[
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'core/dataset/fileCollection'} w={'14px'} mr={2} />
-                          {t('core.dataset.import.Preview raw text')}
-                        </Flex>
-                      ),
-                      onClick: () => setPreviewRawTextSource(source)
-                    },
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'core/dataset/splitLight'} w={'14px'} mr={2} />
-                          {t('core.dataset.import.Preview chunks')}
-                        </Flex>
-                      ),
-                      onClick: () => setPreviewChunkSource(source)
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'core/dataset/fileCollection'} w={'14px'} mr={2} />
+                              {t('core.dataset.import.Preview raw text')}
+                            </Flex>
+                          ),
+                          onClick: () => setPreviewRawTextSource(source)
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'core/dataset/splitLight'} w={'14px'} mr={2} />
+                              {t('core.dataset.import.Preview chunks')}
+                            </Flex>
+                          ),
+                          onClick: () => setPreviewChunkSource(source)
+                        }
+                      ]
                     }
                   ]}
                 />

projects/app/src/pages/dataset/detail/components/Import/components/PreviewChunks.tsx

@@ -82,27 +82,30 @@ const PreviewChunks = ({
       title={previewSource.sourceName}
       isLoading={isLoading}
       maxW={['90vw', '40vw']}
+      px={0}
     >
-      {data.map((item, index) => (
-        <Box
-          key={index}
-          whiteSpace={'pre-wrap'}
-          fontSize={'sm'}
-          p={4}
-          bg={index % 2 === 0 ? 'white' : 'myWhite.600'}
-          mb={3}
-          borderRadius={'md'}
-          borderWidth={'1px'}
-          borderColor={'borderColor.low'}
-          boxShadow={'2'}
-          _notLast={{
-            mb: 2
-          }}
-        >
-          <Box color={'myGray.900'}>{item.q}</Box>
-          <Box color={'myGray.500'}>{item.a}</Box>
-        </Box>
-      ))}
+      <Box overflowY={'auto'} px={5} fontSize={'sm'}>
+        {data.map((item, index) => (
+          <Box
+            key={index}
+            whiteSpace={'pre-wrap'}
+            fontSize={'sm'}
+            p={4}
+            bg={index % 2 === 0 ? 'white' : 'myWhite.600'}
+            mb={3}
+            borderRadius={'md'}
+            borderWidth={'1px'}
+            borderColor={'borderColor.low'}
+            boxShadow={'2'}
+            _notLast={{
+              mb: 2
+            }}
+          >
+            <Box color={'myGray.900'}>{item.q}</Box>
+            <Box color={'myGray.500'}>{item.a}</Box>
+          </Box>
+        ))}
+      </Box>
     </MyRightDrawer>
   );
 };

projects/app/src/pages/dataset/detail/components/Import/components/PreviewRawText.tsx

@@ -63,8 +63,9 @@ const PreviewRawText = ({
       iconSrc={previewSource.icon}
       title={previewSource.sourceName}
       isLoading={isLoading}
+      px={0}
     >
-      <Box whiteSpace={'pre-wrap'} overflowY={'auto'} fontSize={'sm'}>
+      <Box whiteSpace={'pre-wrap'} overflowY={'auto'} px={5} fontSize={'sm'}>
         {rawText}
       </Box>
     </MyRightDrawer>

projects/app/src/pages/dataset/detail/components/Import/components/RenderFiles.tsx

@@ -14,7 +14,7 @@ import {
 import { ImportSourceItemType } from '@/web/core/dataset/type.d';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useTranslation } from 'next-i18next';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import dynamic from 'next/dynamic';
 import { useI18n } from '@/web/context/I18n';
 

projects/app/src/pages/dataset/detail/components/Info.tsx

@@ -9,7 +9,7 @@ import { useForm } from 'react-hook-form';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
 import type { DatasetItemType } from '@fastgpt/global/core/dataset/type.d';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import PermissionRadio from '@/components/support/permission/Radio';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
@@ -24,6 +24,7 @@ import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContex
 import MyDivider from '@fastgpt/web/components/common/MyDivider/index';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
+import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 
 const Info = ({ datasetId }: { datasetId: string }) => {
   const { t } = useTranslation();
@@ -126,15 +127,15 @@ const Info = ({ datasetId }: { datasetId: string }) => {
   return (
     <Box py={5} px={[5, 10]}>
       <Flex mt={5} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Dataset ID')}
-        </Box>
+        </FormLabel>
         <Box flex={1}>{datasetDetail._id}</Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'} flexWrap={'wrap'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.ai.model.Vector Model')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <AIModelSelector
             w={'100%'}
@@ -160,15 +161,15 @@ const Info = ({ datasetId }: { datasetId: string }) => {
         </Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.Max Token')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>{vectorModel.maxToken}</Box>
       </Flex>
       <Flex mt={6} alignItems={'center'} flexWrap={'wrap'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.ai.model.Dataset Agent Model')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <AIModelSelector
             w={'100%'}
@@ -206,9 +207,9 @@ const Info = ({ datasetId }: { datasetId: string }) => {
       )}
 
       <Flex mt={5} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Avatar')}
-        </Box>
+        </FormLabel>
         <Box flex={[1, '0 0 320px']}>
           <MyTooltip label={t('common.avatar.Select Avatar')}>
             <Avatar
@@ -223,22 +224,20 @@ const Info = ({ datasetId }: { datasetId: string }) => {
         </Box>
       </Flex>
       <Flex mt={8} w={'100%'} alignItems={'center'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+        <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
           {t('core.dataset.Name')}
-        </Box>
+        </FormLabel>
         <Input flex={[1, '0 0 320px']} maxLength={30} {...register('name')} />
       </Flex>
       <Flex mt={8} alignItems={'center'} w={'100%'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']}>
-          {t('common.Intro')}
-        </Box>
+        <FormLabel flex={['0 0 90px', '0 0 160px']}>{t('common.Intro')}</FormLabel>
         <Textarea flex={[1, '0 0 320px']} {...register('intro')} placeholder={t('common.Intro')} />
       </Flex>
       {datasetDetail.isOwner && (
         <Flex mt={5} alignItems={'center'} w={'100%'} flexWrap={'wrap'}>
-          <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}>
+          <FormLabel flex={['0 0 90px', '0 0 160px']} w={0}>
             {t('user.Permission')}
-          </Box>
+          </FormLabel>
           <Box>
             <PermissionRadio
               value={permission}
@@ -251,7 +250,7 @@ const Info = ({ datasetId }: { datasetId: string }) => {
       )}
 
       <Flex mt={5} w={'100%'} alignItems={'flex-end'}>
-        <Box fontSize={['sm', 'md']} flex={['0 0 90px', '0 0 160px']} w={0}></Box>
+        <Box flex={['0 0 90px', '0 0 160px']} w={0}></Box>
         <Button
           isLoading={btnLoading}
           mr={4}

projects/app/src/pages/dataset/detail/components/InputDataModal.tsx

@@ -11,7 +11,7 @@ import {
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyModal from '@fastgpt/web/components/common/MyModal';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useQuery } from '@tanstack/react-query';
 import { useTranslation } from 'next-i18next';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
@@ -258,7 +258,7 @@ const InputDataModal = ({
           />
         </Box>
         <Flex flexDirection={'column'} pb={8} flex={1} h={'100%'}>
-          <Box fontSize={'lg'} px={5} py={3} fontWeight={'medium'}>
+          <Box fontSize={'md'} px={5} py={3} fontWeight={'medium'}>
             {currentTab === TabEnum.content && (
               <>{dataId ? t('dataset.data.Update Data') : t('dataset.data.Input Data')}</>
             )}
@@ -311,7 +311,6 @@ const InputDataModal = ({
                     ) : (
                       <Textarea
                         maxLength={maxToken}
-                        fontSize={'sm'}
                         rows={10}
                         borderColor={'transparent'}
                         px={0}

projects/app/src/pages/dataset/detail/components/Slider.tsx

@@ -135,11 +135,12 @@ const Slider = ({ currentTab }: { currentTab: TabEnum }) => {
             px={3}
             borderRadius={'md'}
             _hover={{ bg: 'myGray.100' }}
+            fontSize={'sm'}
             onClick={() => router.replace('/dataset/list')}
           >
             <IconButton
               mr={3}
-              icon={<MyIcon name={'common/backFill'} w={'18px'} color={'primary.500'} />}
+              icon={<MyIcon name={'common/backFill'} w={'1rem'} color={'primary.500'} />}
               bg={'white'}
               boxShadow={'1px 1px 9px rgba(0,0,0,0.15)'}
               size={'smSquare'}

projects/app/src/pages/dataset/detail/components/Test.tsx

@@ -9,8 +9,7 @@ import { formatTimeToChatTime } from '@fastgpt/global/common/string/time';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { customAlphabet } from 'nanoid';
-import MyTooltip from '@/components/MyTooltip';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { SearchTestResponse } from '@/global/core/dataset/api';
 import {
@@ -27,6 +26,8 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import SearchParamsTip from '@/components/core/dataset/SearchParamsTip';
 import { useContextSelector } from 'use-context-selector';
 import { DatasetPageContext } from '@/web/core/dataset/context/datasetPageContext';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 12);
 
@@ -321,7 +322,6 @@ const TestHistories = React.memo(function TestHistories({
   setDatasetTestItem: React.Dispatch<React.SetStateAction<SearchTestStoreItemType | undefined>>;
 }) {
   const { t } = useTranslation();
-  const theme = useTheme();
   const { datasetTestList, delDatasetTestItemById } = useSearchTestStore();
 
   const testHistories = useMemo(
@@ -332,7 +332,7 @@ const TestHistories = React.memo(function TestHistories({
     <>
       <Flex alignItems={'center'} color={'myGray.900'}>
         <MyIcon mr={2} name={'history'} w={'18px'} h={'18px'} color={'myGray.900'} />
-        <Box fontSize={'xl'}>{t('core.dataset.test.test history')}</Box>
+        <Box fontSize={'md'}>{t('core.dataset.test.test history')}</Box>
       </Flex>
       <Box mt={2}>
         {testHistories.map((item) => (
@@ -417,21 +417,10 @@ const TestResults = React.memo(function TestResults({
   return (
     <>
       {!datasetTestItem?.results || datasetTestItem.results.length === 0 ? (
-        <Flex
-          mt={[10, 0]}
-          h={'100%'}
-          flexDirection={'column'}
-          alignItems={'center'}
-          justifyContent={'center'}
-        >
-          <MyIcon name={'empty'} color={'transparent'} w={'54px'} />
-          <Box mt={3} color={'myGray.600'}>
-            {t('core.dataset.test.test result placeholder')}
-          </Box>
-        </Flex>
+        <EmptyTip text={t('core.dataset.test.test result placeholder')} mt={[10, '20vh']} />
       ) : (
         <>
-          <Flex fontSize={'xl'} color={'myGray.900'} alignItems={'center'}>
+          <Flex fontSize={'md'} color={'myGray.900'} alignItems={'center'}>
             <MyIcon name={'common/paramsLight'} w={'18px'} mr={2} />
             {t('core.dataset.test.Test params')}
           </Flex>
@@ -446,14 +435,12 @@ const TestResults = React.memo(function TestResults({
           </Box>
 
           <Flex mt={5} mb={3} alignItems={'center'}>
-            <Flex fontSize={'xl'} color={'myGray.900'} alignItems={'center'}>
+            <Flex fontSize={'md'} color={'myGray.900'} alignItems={'center'}>
               <MyIcon name={'common/resultLight'} w={'18px'} mr={2} />
               {t('core.dataset.test.Test Result')}
             </Flex>
-            <MyTooltip label={t('core.dataset.test.test result tip')} forceShow>
-              <QuestionOutlineIcon mx={2} color={'myGray.600'} cursor={'pointer'} fontSize={'lg'} />
-            </MyTooltip>
-            <Box>({datasetTestItem.duration})</Box>
+            <QuestionTip ml={1} label={t('core.dataset.test.test result tip')} />
+            <Box ml={2}>({datasetTestItem.duration})</Box>
           </Flex>
           <Box mt={1} gap={4}>
             {datasetTestItem?.results.map((item, index) => (

projects/app/src/pages/dataset/list/component/CreateModal.tsx

@@ -9,7 +9,7 @@ import { useRouter } from 'next/router';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { postCreateDataset } from '@/web/core/dataset/api';
 import type { CreateDatasetParams } from '@/global/core/dataset/api.d';
@@ -17,9 +17,9 @@ import { useTranslation } from 'next-i18next';
 import MyRadio from '@/components/common/MyRadio';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
-import { QuestionOutlineIcon } from '@chakra-ui/icons';
 import AIModelSelector from '@/components/Select/AIModelSelector';
 import { useI18n } from '@/web/context/I18n';
+import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 
 const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: string }) => {
   const { t } = useTranslation();
@@ -111,9 +111,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
       isCentered={!isPc}
       w={'450px'}
     >
-      <ModalBody>
+      <ModalBody py={2}>
         <>
-          <Box mb={1} color={'myGray.800'} fontWeight={'bold'}>
+          <Box mb={1} color={'myGray.900'}>
             {t('core.dataset.Dataset Type')}
           </Box>
           <MyRadio
@@ -144,9 +144,7 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
           />
         </>
         <Box mt={5}>
-          <Box color={'myGray.800'} fontWeight={'bold'}>
-            {t('common.Set Name')}
-          </Box>
+          <Box color={'myGray.900'}>{t('common.Set Name')}</Box>
           <Flex mt={1} alignItems={'center'}>
             <MyTooltip label={t('common.avatar.Select Avatar')}>
               <Avatar
@@ -174,11 +172,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
         </Box>
         {filterNotHiddenVectorModelList.length > 1 && (
           <Flex mt={6} alignItems={'center'}>
-            <Flex alignItems={'center'} flex={'0 0 100px'}>
+            <Flex alignItems={'center'} flex={'0 0 100px'} fontSize={'sm'}>
               {t('core.ai.model.Vector Model')}
-              <MyTooltip label={t('core.dataset.embedding model tip')}>
-                <QuestionOutlineIcon ml={1} />
-              </MyTooltip>
+              <QuestionTip label={t('core.dataset.embedding model tip')} />
             </Flex>
             <Box flex={1}>
               <AIModelSelector
@@ -197,7 +193,9 @@ const CreateModal = ({ onClose, parentId }: { onClose: () => void; parentId?: st
         )}
         {datasetModelList.length > 1 && (
           <Flex mt={6} alignItems={'center'}>
-            <Box flex={'0 0 100px'}>{t('core.ai.model.Dataset Agent Model')}</Box>
+            <Box flex={'0 0 100px'} fontSize={'sm'}>
+              {t('core.ai.model.Dataset Agent Model')}
+            </Box>
             <Box flex={1}>
               <AIModelSelector
                 w={'100%'}

projects/app/src/pages/dataset/list/component/MoveModal.tsx

@@ -11,7 +11,7 @@ import {
   Grid
 } from '@chakra-ui/react';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constants';
@@ -19,6 +19,7 @@ import { useTranslation } from 'next-i18next';
 import { useQuery } from '@tanstack/react-query';
 import { getDatasets, putDatasetById, getDatasetPaths } from '@/web/core/dataset/api';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const MoveModal = ({
   onClose,
@@ -70,7 +71,7 @@ const MoveModal = ({
       title={
         <>
           {!!parentId ? (
-            <Flex flex={1} userSelect={'none'} fontSize={['sm', 'lg']} fontWeight={'normal'}>
+            <Flex flex={1} userSelect={'none'} fontSize={['sm', 'md']} fontWeight={'normal'}>
               {paths.map((item, i) => (
                 <Flex key={item.parentId} mr={2} alignItems={'center'}>
                   <Box
@@ -146,7 +147,7 @@ const MoveModal = ({
                           className="textEllipsis"
                           ml={3}
                           fontWeight={'bold'}
-                          fontSize={['md', 'lg', 'xl']}
+                          fontSize={['md', 'md']}
                         >
                           {item.name}
                         </Box>
@@ -167,14 +168,7 @@ const MoveModal = ({
               })()
             )}
           </Grid>
-          {folderList.length === 0 && (
-            <Flex mt={5} flexDirection={'column'} alignItems={'center'}>
-              <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-              <Box mt={2} color={'myGray.500'}>
-                {t('common.folder.No Folder')}
-              </Box>
-            </Flex>
-          )}
+          {folderList.length === 0 && <EmptyTip text={t('common.folder.No Folder')}></EmptyTip>}
         </ModalBody>
 
         <ModalFooter>

projects/app/src/pages/dataset/list/index.tsx

@@ -35,6 +35,7 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import { downloadFetch } from '@/web/common/system/utils';
+import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 
 const CreateModal = dynamic(() => import('./component/CreateModal'), { ssr: false });
 const MoveModal = dynamic(() => import('./component/MoveModal'), { ssr: false });
@@ -182,22 +183,26 @@ const Dataset = () => {
             }
             menuList={[
               {
-                label: (
-                  <Flex>
-                    <MyIcon name={FolderIcon} w={'20px'} mr={1} />
-                    {t('Folder')}
-                  </Flex>
-                ),
-                onClick: () => setEditFolderData({})
-              },
-              {
-                label: (
-                  <Flex>
-                    <Image src={'/imgs/workflow/db.png'} alt={''} w={'20px'} mr={1} />
-                    {t('core.dataset.Dataset')}
-                  </Flex>
-                ),
-                onClick: onOpenCreateModal
+                children: [
+                  {
+                    label: (
+                      <Flex>
+                        <MyIcon name={FolderIcon} w={'20px'} mr={1} />
+                        {t('Folder')}
+                      </Flex>
+                    ),
+                    onClick: () => setEditFolderData({})
+                  },
+                  {
+                    label: (
+                      <Flex>
+                        <Image src={'/imgs/workflow/db.png'} alt={''} w={'20px'} mr={1} />
+                        {t('core.dataset.Dataset')}
+                      </Flex>
+                    ),
+                    onClick: onOpenCreateModal
+                  }
+                ]
               }
             ]}
           />
@@ -310,96 +315,108 @@ const Dataset = () => {
                   }
                   menuList={[
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'edit'} w={'14px'} mr={2} />
-                          {t('Rename')}
-                        </Flex>
-                      ),
-                      onClick: () =>
-                        onOpenTitleModal({
-                          defaultVal: dataset.name,
-                          onSuccess: (val) => {
-                            if (val === dataset.name || !val) return;
-                            putDatasetById({
-                              id: dataset._id,
-                              name: val
-                            });
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'edit'} w={'14px'} mr={2} />
+                              {t('Rename')}
+                            </Flex>
+                          ),
+                          onClick: () =>
+                            onOpenTitleModal({
+                              defaultVal: dataset.name,
+                              onSuccess: (val) => {
+                                if (val === dataset.name || !val) return;
+                                putDatasetById({
+                                  id: dataset._id,
+                                  name: val
+                                });
+                              }
+                            })
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
+                              {t('Move')}
+                            </Flex>
+                          ),
+                          onClick: () => setMoveDataId(dataset._id)
+                        },
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'export'} w={'14px'} mr={2} />
+                              {t('Export')}
+                            </Flex>
+                          ),
+                          onClick: () => {
+                            exportDataset(dataset);
                           }
-                        })
+                        },
+                        ...(dataset.permission === PermissionTypeEnum.private
+                          ? [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      name={'support/permission/publicLight'}
+                                      w={'14px'}
+                                      mr={2}
+                                    />
+                                    {t('permission.Set Public')}
+                                  </Flex>
+                                ),
+                                onClick: () => {
+                                  putDatasetById({
+                                    id: dataset._id,
+                                    permission: PermissionTypeEnum.public
+                                  });
+                                }
+                              }
+                            ]
+                          : [
+                              {
+                                label: (
+                                  <Flex alignItems={'center'}>
+                                    <MyIcon
+                                      name={'support/permission/privateLight'}
+                                      w={'14px'}
+                                      mr={2}
+                                    />
+                                    {t('permission.Set Private')}
+                                  </Flex>
+                                ),
+                                onClick: () => {
+                                  putDatasetById({
+                                    id: dataset._id,
+                                    permission: PermissionTypeEnum.private
+                                  });
+                                }
+                              }
+                            ])
+                      ]
                     },
                     {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'common/file/move'} w={'14px'} mr={2} />
-                          {t('Move')}
-                        </Flex>
-                      ),
-                      onClick: () => setMoveDataId(dataset._id)
-                    },
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'export'} w={'14px'} mr={2} />
-                          {t('Export')}
-                        </Flex>
-                      ),
-                      onClick: () => {
-                        exportDataset(dataset);
-                      }
-                    },
-                    ...(dataset.permission === PermissionTypeEnum.private
-                      ? [
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon name={'support/permission/publicLight'} w={'14px'} mr={2} />
-                                {t('permission.Set Public')}
-                              </Flex>
-                            ),
-                            onClick: () => {
-                              putDatasetById({
-                                id: dataset._id,
-                                permission: PermissionTypeEnum.public
-                              });
-                            }
+                      children: [
+                        {
+                          label: (
+                            <Flex alignItems={'center'}>
+                              <MyIcon name={'delete'} w={'14px'} mr={2} />
+                              {t('common.Delete')}
+                            </Flex>
+                          ),
+                          type: 'danger',
+                          onClick: () => {
+                            openConfirm(
+                              () => onclickDelDataset(dataset._id),
+                              undefined,
+                              DeleteTipsMap.current[dataset.type]
+                            )();
                           }
-                        ]
-                      : [
-                          {
-                            label: (
-                              <Flex alignItems={'center'}>
-                                <MyIcon
-                                  name={'support/permission/privateLight'}
-                                  w={'14px'}
-                                  mr={2}
-                                />
-                                {t('permission.Set Private')}
-                              </Flex>
-                            ),
-                            onClick: () => {
-                              putDatasetById({
-                                id: dataset._id,
-                                permission: PermissionTypeEnum.private
-                              });
-                            }
-                          }
-                        ]),
-                    {
-                      label: (
-                        <Flex alignItems={'center'}>
-                          <MyIcon name={'delete'} w={'14px'} mr={2} />
-                          {t('common.Delete')}
-                        </Flex>
-                      ),
-                      type: 'danger',
-                      onClick: () => {
-                        openConfirm(
-                          () => onclickDelDataset(dataset._id),
-                          undefined,
-                          DeleteTipsMap.current[dataset.type]
-                        )();
-                      }
+                        }
+                      ]
                     }
                   ]}
                 />
@@ -416,7 +433,7 @@ const Dataset = () => {
               className={'textEllipsis3'}
               py={1}
               wordBreak={'break-all'}
-              fontSize={'sm'}
+              fontSize={'xs'}
               color={'myGray.500'}
             >
               {dataset.intro ||
@@ -436,12 +453,7 @@ const Dataset = () => {
         ))}
       </Grid>
       {myDatasets.length === 0 && (
-        <Flex mt={'35vh'} flexDirection={'column'} alignItems={'center'}>
-          <MyIcon name="empty" w={'48px'} h={'48px'} color={'transparent'} />
-          <Box mt={2} color={'myGray.500'}>
-            {t('core.dataset.Empty Dataset Tips')}
-          </Box>
-        </Flex>
+        <EmptyTip pt={'35vh'} text={t('core.dataset.Empty Dataset Tips')}></EmptyTip>
       )}
       <ConfirmModal />
       <EditTitleModal />

projects/app/src/pages/login/components/ForgetPasswordForm.tsx

@@ -166,7 +166,7 @@ const RegisterForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           mt={10}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickFindPassword)}

projects/app/src/pages/login/components/LoginForm/LoginForm.tsx

@@ -132,7 +132,7 @@ const LoginForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           my={6}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickLogin)}

projects/app/src/pages/login/components/RegisterForm.tsx

@@ -181,7 +181,7 @@ const RegisterForm = ({ setPageType, loginSuccess }: Props) => {
           type="submit"
           mt={6}
           w={'100%'}
-          size={['md', 'lg']}
+          size={['md', 'md']}
           colorScheme="blue"
           isLoading={requesting}
           onClick={handleSubmit(onclickRegister)}

projects/app/src/pages/plugin/edit/Header.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from 'next-i18next';
 import { useCopyData } from '@/web/common/hooks/useCopyData';
 import dynamic from 'next/dynamic';
 import MyIcon from '@fastgpt/web/components/common/Icon';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { uiWorkflow2StoreWorkflow } from '@/components/core/workflow/utils';
 import { putUpdatePlugin } from '@/web/core/plugin/api';
 import { useToast } from '@fastgpt/web/hooks/useToast';
@@ -106,7 +106,7 @@ const Header = ({ plugin, onClose }: Props) => {
               }}
             />
           </MyTooltip>
-          <Box ml={[3, 5]} fontSize={['md', '2xl']} flex={1}>
+          <Box ml={[3, 5]} fontSize={['md', 'lg']} flex={1}>
             {plugin.name}
           </Box>
 
@@ -121,11 +121,19 @@ const Header = ({ plugin, onClose }: Props) => {
               />
             }
             menuList={[
-              { label: appT('Import Configs'), icon: 'common/importLight', onClick: onOpenImport },
               {
-                label: appT('Export Configs'),
-                icon: 'export',
-                onClick: onExportWorkflow
+                children: [
+                  {
+                    label: appT('Import Configs'),
+                    icon: 'common/importLight',
+                    onClick: onOpenImport
+                  },
+                  {
+                    label: appT('Export Configs'),
+                    icon: 'export',
+                    onClick: onExportWorkflow
+                  }
+                ]
               }
             ]}
           />

projects/app/src/pages/plugin/list/component/EditModal.tsx

@@ -10,7 +10,7 @@ import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import { delOnePlugin, postCreatePlugin, putUpdatePlugin } from '@/web/core/plugin/api';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { useConfirm } from '@fastgpt/web/hooks/useConfirm';

projects/app/src/pages/plugin/list/component/HttpPluginEditModal.tsx

@@ -22,7 +22,7 @@ import { getErrText } from '@fastgpt/global/common/error/utils';
 import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useRequest } from '@fastgpt/web/hooks/useRequest';
 import Avatar from '@/components/Avatar';
-import MyTooltip from '@/components/MyTooltip';
+import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import { useTranslation } from 'next-i18next';
 import { CreateOnePluginParams } from '@fastgpt/global/core/plugin/controller';
 import { MongoImageTypeEnum } from '@fastgpt/global/common/file/image/constants';
@@ -300,13 +300,23 @@ const HttpPluginEditModal = ({
             <Box color={'myGray.800'} fontWeight={'bold'} mt={3}>
               {t('core.plugin.Custom headers')}
             </Box>
-            <Box mt={1}>
+            <Box
+              mt={1}
+              borderRadius={'md'}
+              overflow={'hidden'}
+              borderWidth={'1px'}
+              borderBottom={'none'}
+            >
               <TableContainer overflowY={'visible'} overflowX={'unset'}>
                 <Table>
                   <Thead>
                     <Tr>
-                      <Th px={2}>{t('core.module.http.Props name')}</Th>
-                      <Th px={2}>{t('core.module.http.Props value')}</Th>
+                      <Th px={2} borderRadius="none !important">
+                        {t('core.module.http.Props name')}
+                      </Th>
+                      <Th px={2} borderRadius="none !important">
+                        {t('core.module.http.Props value')}
+                      </Th>
                     </Tr>
                   </Thead>
                   <Tbody>
@@ -464,7 +474,7 @@ const HttpPluginEditModal = ({
               borderRadius={'md'}
               overflow={'hidden'}
               borderWidth={'1px'}
-              borderBottom="none"
+              borderBottom={'none'}
             >
               <TableContainer maxH={400} overflowY={'auto'}>
                 <Table bg={'white'}>

projects/app/src/pages/plugin/list/index.tsx

@@ -89,22 +89,32 @@ const TeamPlugins = () => {
             }
             menuList={[
               {
-                label: (
-                  <Flex>
-                    <Image src={'/imgs/workflow/plugin.svg'} alt={''} w={'18px'} mr={1} />
-                    {t('plugin.Custom Plugin')}
-                  </Flex>
-                ),
-                onClick: () => setEditModalData(defaultForm)
-              },
-              {
-                label: (
-                  <Flex display={'flex'} alignItems={'center'}>
-                    <Image src={'/imgs/workflow/http.png'} alt={''} w={'18px'} h={'14px'} mr={1} />
-                    {t('plugin.HTTP Plugin')}
-                  </Flex>
-                ),
-                onClick: () => setHttpPluginModalData(defaultHttpPlugin)
+                children: [
+                  {
+                    label: (
+                      <Flex>
+                        <Image src={'/imgs/workflow/plugin.svg'} alt={''} w={'18px'} mr={1} />
+                        {t('plugin.Custom Plugin')}
+                      </Flex>
+                    ),
+                    onClick: () => setEditModalData(defaultForm)
+                  },
+                  {
+                    label: (
+                      <Flex display={'flex'} alignItems={'center'}>
+                        <Image
+                          src={'/imgs/workflow/http.png'}
+                          alt={''}
+                          w={'18px'}
+                          h={'14px'}
+                          mr={1}
+                        />
+                        {t('plugin.HTTP Plugin')}
+                      </Flex>
+                    ),
+                    onClick: () => setHttpPluginModalData(defaultHttpPlugin)
+                  }
+                ]
               }
             ]}
           />

projects/app/src/pages/price/components/ExtraPlan.tsx

@@ -127,7 +127,7 @@ const ExtraPlan = () => {
       <Box id={'extra-plan'} fontWeight={'bold'} fontSize={['24px', '36px']}>
         {t('support.wallet.subscription.Extra plan')}
       </Box>
-      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'lg'}>
+      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'md'}>
         {t('support.wallet.subscription.Extra plan tip')}
       </Box>
       <Grid mt={8} gridTemplateColumns={['1fr', '1fr 1fr']} gap={5} w={['100%', 'auto']}>
@@ -143,12 +143,12 @@ const ExtraPlan = () => {
         >
           <Flex borderBottomWidth={'1px'} borderBottomColor={'myGray.200'}>
             <Box flex={'1 0 0'}>
-              <Box fontSize={'xl'} color={'primary.600'}>
+              <Box fontSize={'lg'} color={'primary.600'}>
                 {t('support.wallet.subscription.Extra dataset size')}
               </Box>
               <Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
                 ￥{extraDatasetPrice}/1000组{' '}
-                <Box ml={1} as={'span'} fontSize={'lg'} color={'myGray.600'} fontWeight={'normal'}>
+                <Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
                   /{t('common.month')}
                 </Box>
               </Box>
@@ -248,12 +248,12 @@ const ExtraPlan = () => {
         >
           <Flex borderBottomWidth={'1px'} borderBottomColor={'myGray.200'}>
             <Box flex={'1 0 0'}>
-              <Box fontSize={'xl'} color={'primary.600'}>
+              <Box fontSize={'lg'} color={'primary.600'}>
                 {t('support.wallet.subscription.Extra ai points')}
               </Box>
               <Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
                 ￥{extraPointsPrice}/1000积分{' '}
-                <Box ml={1} as={'span'} fontSize={'lg'} color={'myGray.600'} fontWeight={'normal'}>
+                <Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
                   /{t('common.month')}
                 </Box>
               </Box>

projects/app/src/pages/price/components/Points.tsx

@@ -36,7 +36,7 @@ const Points = () => {
             borderRightColor={'myGray.150'}
             py={4}
             px={6}
-            fontSize={'lg'}
+            fontSize={'md'}
             fontWeight={'bold'}
           >
             AI语言模型
@@ -59,7 +59,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               索引模型
             </Box>
             <Box fontSize={'sm'} mt={1} color={'myGray.500'}>
@@ -84,7 +84,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               语音播放
             </Box>
           </Box>
@@ -106,7 +106,7 @@ const Points = () => {
           overflow={'hidden'}
         >
           <Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} px={6}>
-            <Box fontSize={'lg'} fontWeight={'bold'}>
+            <Box fontSize={'md'} fontWeight={'bold'}>
               语音输入
             </Box>
           </Box>

projects/app/src/pages/price/components/Standard.tsx

@@ -100,7 +100,7 @@ const Standard = ({
       <Box fontWeight={'bold'} fontSize={['24px', '36px']}>
         {t('support.wallet.subscription.Sub plan')}
       </Box>
-      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'lg'}>
+      <Box mt={8} mb={10} color={'myGray.500'} fontSize={'md'}>
         {t('support.wallet.subscription.Sub plan tip', {
           title: feConfigs?.systemTitle
         })}
@@ -156,7 +156,7 @@ const Standard = ({
                     borderColor: 'myGray.150'
                   })}
             >
-              <Box fontSize={'lg'} fontWeight={'500'}>
+              <Box fontSize={'md'} fontWeight={'500'}>
                 {t(item.label)}
               </Box>
               <Box fontSize={['32px', '42px']} fontWeight={'bold'}>