perf: del loading

This commit is contained in:
archer
2023-06-12 22:12:29 +08:00
parent 98e3c0a41f
commit 5a534aa630

View File

@@ -29,6 +29,7 @@ import Papa from 'papaparse';
import dynamic from 'next/dynamic'; import dynamic from 'next/dynamic';
import InputModal, { FormData as InputDataType } from './InputDataModal'; import InputModal, { FormData as InputDataType } from './InputDataModal';
import { debounce } from 'lodash'; import { debounce } from 'lodash';
import { getErrText } from '@/utils/tools';
const SelectFileModal = dynamic(() => import('./SelectFileModal')); const SelectFileModal = dynamic(() => import('./SelectFileModal'));
const SelectCsvModal = dynamic(() => import('./SelectCsvModal')); const SelectCsvModal = dynamic(() => import('./SelectCsvModal'));
@@ -37,6 +38,7 @@ const DataCard = ({ kbId }: { kbId: string }) => {
const lastSearch = useRef(''); const lastSearch = useRef('');
const [searchText, setSearchText] = useState(''); const [searchText, setSearchText] = useState('');
const { toast } = useToast(); const { toast } = useToast();
const [isDeleting, setIsDeleting] = useState(false);
const { const {
data: kbDataList, data: kbDataList,
@@ -219,7 +221,7 @@ const DataCard = ({ kbId }: { kbId: string }) => {
pt={3} pt={3}
userSelect={'none'} userSelect={'none'}
boxShadow={'none'} boxShadow={'none'}
_hover={{ boxShadow: 'lg', '& .delete': { display: 'block' } }} _hover={{ boxShadow: 'lg', '& .delete': { display: 'flex' } }}
border={'1px solid '} border={'1px solid '}
borderColor={'myGray.200'} borderColor={'myGray.200'}
onClick={() => onClick={() =>
@@ -249,19 +251,28 @@ const DataCard = ({ kbId }: { kbId: string }) => {
</Box> </Box>
<IconButton <IconButton
className="delete" className="delete"
display={['block', 'none']} display={['flex', 'none']}
icon={<DeleteIcon />} icon={<DeleteIcon />}
variant={'base'} variant={'base'}
colorScheme={'gray'} colorScheme={'gray'}
aria-label={'delete'} aria-label={'delete'}
size={'xs'} size={'xs'}
borderRadius={'md'} borderRadius={'md'}
lineHeight={1}
_hover={{ color: 'red.600' }} _hover={{ color: 'red.600' }}
isLoading={isDeleting}
onClick={async (e) => { onClick={async (e) => {
e.stopPropagation(); e.stopPropagation();
try {
setIsDeleting(true);
await delOneKbDataByDataId(item.id); await delOneKbDataByDataId(item.id);
refetchData(pageNum); refetchData(pageNum);
} catch (error) {
toast({
title: getErrText(error),
status: 'error'
});
}
setIsDeleting(false);
}} }}
/> />
</Flex> </Flex>