Files
MemoryBear/web/src/views/Index/components/GuideCard.tsx
yujiangping f31341151f feat(index): add homepage with dashboard cards and knowledge graph support
- Add new Index view with dashboard layout and quick action cards
- Create TopCardList component to display core data management options
- Add GuideCard and VersionCard components for user guidance
- Add QuickActions component for common operations
- Create KnowledgeGraph and KnowledgeGraphCard components for knowledge base visualization
- Add comprehensive SVG assets for index page (apps, arrows, management icons)
- Add common API module for shared request utilities
- Extend knowledgeBase API with knowledge graph endpoints (getKnowledgeGraph, getKnowledgeGraphEntityTypes)
- Update i18n translations for English and Chinese with new index page strings
- Update routing configuration to include new Index route
- Update menu configuration to reflect new navigation structure
- Update KnowledgeBase CreateModal and Private view components
- Add TypeScript types for Index page components
- Improve overall UI/UX with new dashboard-style homepage
2026-01-05 10:37:08 +08:00

32 lines
1.4 KiB
TypeScript

import React from 'react';
import { useTranslation } from 'react-i18next';
import guideBgImg from '@/assets/images/index/guide_bg@2x.png'
import { Button } from 'antd';
import { ArrowRightOutlined } from '@ant-design/icons'
import arrowRight from '@/assets/images/index/arrow_right_blue.svg'
const GuideCard: React.FC = () => {
const { t } = useTranslation();
return (
<div className='rb:w-full rb:h-[204px] rb:p-4' style={{ backgroundImage: `url(${guideBgImg})`, backgroundSize: '100% 100%' }}>
<div className='rb:flex rb:justify-start rb:text-white rb:text-base rb:font-semibold'>
{ t('index.getStarted')}
</div>
<div className='rb:flex rb:text-xs rb:text-white rb:leading-[18px] rb:mt-3'>
{ t('index.startedDesc')}
</div>
<div className='rb:flex rb:w-full rb:items-center rb:justify-between rb:gap-3 rb:mt-4'>
<Button className='rb:gap-2 rb:flex rb:items-center rb:text-[#155EEF] '>
<span className='rb:text-xs'>{ t('index.viewGuide')}</span>
<img src={arrowRight} className='rb:size-4' />
</Button>
<Button className='rb:gap-2 rb:flex rb:items-center rb:text-[#155EEF]'>
<span className='rb:text-xs'>{ t('index.watchVideo')}</span>
<img src={arrowRight} className='rb:size-4' />
</Button>
</div>
</div>
);
};
export default GuideCard;