gitea/FastGPT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: pay page perf (#2535)

Browse Source 
* style: pay page perf

* perf: package status logic && add pay text
This commit is contained in:
papapatrick
2024-08-27 18:56:08 +08:00
committed by GitHub
parent d057ad3a45
commit 454a479fd8
15 changed files with 518 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
projects/app/src/pages/price/components/ExtraPlan.tsx
View File

@@ -119,15 +119,15 @@ const ExtraPlan = () => {
return (
<Flex
mt={['40px', '90px']}
mt={['40px', '200px']}
flexDirection={'column'}
alignItems={'center'}
position={'relative'}
>
<Box id={'extra-plan'} fontWeight={'bold'} fontSize={['24px', '36px']}>
<Box id={'extra-plan'} fontWeight={'bold'} fontSize={['24px', '36px']} color={'myGray.900'}>
{t('common:support.wallet.subscription.Extra plan')}
</Box>
<Box mt={8} mb={10} color={'myGray.500'} fontSize={'md'}>
<Box mt={2} mb={8} color={'myGray.600'} fontSize={'md'}>
{t('common: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={'lg'} color={'primary.600'}>
<Box fontSize={'lg'} color={'primary.700'}>
{t('common:support.wallet.subscription.Extra dataset size')}
</Box>
<Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
<Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'} color={'black'}>
{`￥${extraDatasetPrice}/1000` + t('common:core.dataset.data.group')}
<Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
<Box ml={1} as={'span'} fontSize={'md'} color={'myGray.500'} fontWeight={'normal'}>
/{t('common:common.month')}
</Box>
</Box>
@@ -162,12 +162,12 @@ const ExtraPlan = () => {
/>
</Flex>
<Box h={'120px'} w={'100%'}>
<Flex mt={4}>
<Flex mt={4} color={'myGray.900'}>
<MyIcon mr={2} name={'support/bill/shoppingCart'} w={'16px'} color={'primary.600'} />
{t('common:support.wallet.buy_resource')}
</Flex>
<Flex mt={4} alignItems={'center'}>
<Box flex={['0 0 100px', '1 0 0']}>
<Box flex={['0 0 100px', '1 0 0']} color={'myGray.600'}>
{t('common:support.wallet.subscription.Month amount')}
</Box>
<Flex alignItems={'center'} mt={1} w={'180px'} position={'relative'}>
@@ -186,13 +186,13 @@ const ExtraPlan = () => {
<NumberDecrementStepper />
</NumberInputStepper>
</NumberInput>
<Box position={'absolute'} right={'20px'} color={'myGray.500'} fontSize={'xs'}>
<Box position={'absolute'} right={'20px'} color={'myGray.600'} fontSize={'xs'}>
{t('common:common.month')}
</Box>
</Flex>
</Flex>
<Flex mt={4} alignItems={'center'}>
<Box flex={['0 0 100px', '1 0 0']}>
<Box flex={['0 0 100px', '1 0 0']} color={'myGray.600'}>
{t('common:support.wallet.subscription.Update extra dataset size')}
</Box>
<Flex alignItems={'center'} mt={1} w={'180px'} position={'relative'}>
@@ -219,7 +219,7 @@ const ExtraPlan = () => {
<NumberDecrementStepper />
</NumberInputStepper>
</NumberInput>
<Box position={'absolute'} right={'20px'} color={'myGray.500'} fontSize={'xs'}>
<Box position={'absolute'} right={'20px'} color={'myGray.600'} fontSize={'xs'}>
000{t('common:core.dataset.data.unit')}
</Box>
</Flex>
@@ -231,6 +231,7 @@ const ExtraPlan = () => {
variant={'primaryGhost'}
isLoading={loading}
onClick={handleSubmitDatasetSize(onclickBuyDatasetSize)}
color={'primary.700'}
>
{t('common:support.wallet.Buy')}
</Button>
@@ -248,12 +249,12 @@ const ExtraPlan = () => {
>
<Flex borderBottomWidth={'1px'} borderBottomColor={'myGray.200'}>
<Box flex={'1 0 0'}>
<Box fontSize={'lg'} color={'primary.600'}>
<Box fontSize={'lg'} color={'primary.700'}>
{t('common:support.wallet.subscription.Extra ai points')}
</Box>
<Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'}>
<Box mt={3} fontSize={['28px', '32px']} fontWeight={'bold'} color={'black'}>
{`￥${extraPointsPrice}/1000` + t('common:support.wallet.subscription.point')}
<Box ml={1} as={'span'} fontSize={'md'} color={'myGray.600'} fontWeight={'normal'}>
<Box ml={1} as={'span'} fontSize={'md'} color={'myGray.500'} fontWeight={'normal'}>
/{t('common:common.month')}
</Box>
</Box>
@@ -267,7 +268,7 @@ const ExtraPlan = () => {
/>
</Flex>
<Box h={'120px'} w={'100%'}>
<Flex mt={4}>
<Flex mt={4} color={'myGray.900'}>
<MyIcon mr={2} name={'support/bill/shoppingCart'} w={'16px'} color={'primary.600'} />
{t('common:support.wallet.buy_resource')}
</Flex>
@@ -297,10 +298,16 @@ const ExtraPlan = () => {
</Flex>
</Flex> */}
<Flex mt={4} alignItems={'center'}>
<Box flex={['0 0 100px', '1 0 0']}>
<Box flex={['0 0 100px', '1 0 0']} color={'myGray.600'}>
{t('common:support.wallet.subscription.Update extra ai points')}
</Box>
<Flex alignItems={'center'} mt={1} w={'180px'} position={'relative'}>
<Flex
alignItems={'center'}
mt={1}
w={'180px'}
position={'relative'}
color={'myGray.500'}
>
<NumberInput
size={'sm'}
flex={1}
@@ -336,6 +343,7 @@ const ExtraPlan = () => {
variant={'primaryGhost'}
isLoading={loading}
onClick={handleSubmitExtraPoints(onclickBuyExtraPoints)}
color={'primary.700'}
>
{t('common:support.wallet.Buy')}
</Button>