Card ve CardItem güncellemesi

This commit is contained in:
Sedat Öztürk 2025-11-30 20:15:04 +03:00
parent 16c187489c
commit ee0b8d8421
2 changed files with 52 additions and 10 deletions

View file

@ -120,10 +120,35 @@ const Card = (props: CardProps) => {
setCurrentPage(1) // Reset to first page when sorting
}
const handleSelectAll = (checked: boolean) => {
const handleSelectAll = async (checked: boolean) => {
if (checked) {
const keyField = gridDto?.gridOptions.keyFieldName
if (keyField) {
const selectAllMode = gridDto?.gridOptions?.selectionDto?.selectAllMode?.toLowerCase()
if (!keyField) return
if (selectAllMode === 'allpages') {
// Tüm sayfalardan tüm kayıtları al
if (!gridDataSource) return
setLoading(true)
try {
const loadOptions = {
skip: 0,
take: totalCount, // Tüm kayıtları al
requireTotalCount: false,
}
const res: any = await gridDataSource.load(loadOptions)
const allKeys = new Set(res.data.map((row: any) => row[keyField]))
setSelectedKeys(allKeys)
} catch (err) {
console.error('Select all pages error:', err)
} finally {
setLoading(false)
}
} else {
// Sadece mevcut sayfadaki kayıtları seç (page veya default)
const allKeys = new Set(data.map(row => row[keyField]))
setSelectedKeys(allKeys)
}
@ -410,8 +435,14 @@ const Card = (props: CardProps) => {
useEffect(() => {
if (gridDataSource) {
loadData()
// selectionMode = page ise sayfa değiştiğinde seçimi temizle
const selectAllMode = gridDto?.gridOptions?.selectionDto?.selectAllMode?.toLowerCase()
if (selectAllMode === 'page') {
setSelectedKeys(new Set())
}
}, [gridDataSource, loadData])
}
}, [gridDataSource, loadData, currentPage, gridDto])
useEffect(() => {
if (!gridDto) return
@ -428,10 +459,6 @@ const Card = (props: CardProps) => {
useEffect(() => {
if (data.length > 0) {
window.scrollTo({ top: 0, behavior: 'smooth' })
if (data.length < 6) {
setLayoutCount(data.length)
}
}
}, [data])
@ -453,7 +480,12 @@ const Card = (props: CardProps) => {
{selectionMode === 'multiple' && gridDto?.gridOptions?.selectionDto?.allowSelectAll && (
<div className="flex items-center">
<Checkbox
checked={selectedKeys.size > 0 && selectedKeys.size === data.length}
checked={
selectedKeys.size > 0 &&
(gridDto?.gridOptions?.selectionDto?.selectAllMode?.toLowerCase() === 'allpages'
? selectedKeys.size === totalCount
: selectedKeys.size === data.length)
}
onChange={(checked: boolean) => handleSelectAll(checked)}
className="cursor-pointer"
/>
@ -651,7 +683,12 @@ const Card = (props: CardProps) => {
</p>
</div>
) : (
<div className={`bg-transparent grid grid-cols-1 lg:grid-cols-${layoutCount} gap-4`}>
<div
className="bg-transparent grid gap-4"
style={{
gridTemplateColumns: `repeat(${layoutCount}, minmax(0, 1fr))`
}}
>
{gridDataSource &&
data.map((row, idx) => {
const keyField = gridDto.gridOptions.keyFieldName

View file

@ -190,7 +190,12 @@ const CardItem = forwardRef<HTMLDivElement, CardItemProps>((
>
<div className="flex items-center gap-2">
{selectionMode !== 'none' && onSelectionChange && (
<div onClick={(e) => e.stopPropagation()}>
<div
onClick={(e) => {
e.stopPropagation()
onSelectionChange(!isSelected)
}}
>
<Checkbox
checked={isSelected}
onChange={(checked: boolean) => {