File size: 2,411 Bytes
eb38196 e55650e af3ef26 e55650e af3ef26 eb38196 e441caf eb38196 362ec6c e55650e a9e3dcb e441caf af3ef26 04aba1b a9e3dcb af3ef26 a9e3dcb e441caf a9e3dcb e441caf af3ef26 1903239 af3ef26 1903239 eb38196 e441caf eb38196 af3ef26 04aba1b e55650e e441caf e55650e a9e3dcb 04aba1b 6b8fc2c 362ec6c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 |
import ModalManager from '@/components/modal-manager';
import { useFetchKnowledgeList } from '@/hooks/knowledgeHook';
import { useSelectUserInfo } from '@/hooks/userSettingHook';
import { PlusOutlined } from '@ant-design/icons';
import { Button, Empty, Flex, Space, Spin } from 'antd';
import KnowledgeCard from './knowledge-card';
import KnowledgeCreatingModal from './knowledge-creating-modal';
import { useTranslation } from 'react-i18next';
import styles from './index.less';
const Knowledge = () => {
const { list, loading } = useFetchKnowledgeList();
const userInfo = useSelectUserInfo();
const { t } = useTranslation('translation', { keyPrefix: 'knowledgeList' });
return (
<Flex className={styles.knowledge} vertical flex={1}>
<div className={styles.topWrapper}>
<div>
<span className={styles.title}>
{t('welcome')}, {userInfo.nickname}
</span>
<p className={styles.description}>{t('description')}</p>
</div>
<Space size={'large'}>
{/* <Button icon={<FilterIcon />} className={styles.filterButton}>
Filters
</Button> */}
<ModalManager>
{({ visible, hideModal, showModal }) => (
<>
<Button
type="primary"
icon={<PlusOutlined />}
onClick={() => {
showModal();
}}
className={styles.topButton}
>
{t('createKnowledgeBase')}
</Button>
<KnowledgeCreatingModal
visible={visible}
hideModal={hideModal}
></KnowledgeCreatingModal>
</>
)}
</ModalManager>
</Space>
</div>
<Spin spinning={loading}>
<Flex
gap={'large'}
wrap="wrap"
className={styles.knowledgeCardContainer}
>
{list.length > 0 ? (
list.map((item: any) => {
return (
<KnowledgeCard item={item} key={item.name}></KnowledgeCard>
);
})
) : (
<Empty className={styles.knowledgeEmpty}></Empty>
)}
</Flex>
</Spin>
</Flex>
);
};
export default Knowledge;
|