Table Footer Component

Table Footer Component, Ops Table bileşeninin alt kısmını yönetir. Sayfalama işlemlerini ve seçilen satırların sayısını görüntülemek için tasarlanmıştır.

Ne İşe Yarar?

Table Footer Component:

• Kullanıcıların sayfalar arasında geçiş yapmasını sağlar.
• Seçili satırların sayısını görüntüler.
• Sayfa başına gösterilecek satır sayısını değiştirir.

İş Mantığı

1. Sayfalama Yönetimi:
   • handlePageChange ile kullanıcı sayfa numarasını değiştirdiğinde, API isteği güncellenir.
   • Sayfa boyutu onRowsPerPageChange metodu ile dinamik olarak değiştirilebilir.
2. Seçim Durumu:
   • useShowSelectionColumn kullanılarak seçili satır sayısı hesaplanır ve görüntülenir.
3. Redux Entegrasyonu:
   • currentPageNumber ve totalPageCount Redux Store üzerinden alınır.

Aldığı Propslar

ITableFooterProps arayüzünden alınan propslar şunlardır:

Prop	Tipi	Açıklama
table	Table<unknown>	Tablonun genel durumunu ve modellerini içerir.
opsService	IOpsTableService<any>	Tablonun veri işlemlerini yöneten servis sınıfı.

Yönetilen Olaylar

1. Sayfa Geçişi:
   • handlePageChange metodu, kullanıcı sayfa değişimi yaptığında çağrılır ve yeni sayfa verisi API'den çekilir.
2. Satır Sayısı Değişimi:
   • onRowsPerPageChange, kullanıcı sayfa başına gösterilecek satır sayısını değiştirdiğinde tetiklenir ve tablo durumu güncellenir.
3. Seçili Satır Sayısı:
   • showSelectionColumn durumu aktifse, seçilen satırların sayısı dinamik olarak görüntülenir.

İlgili Bileşenler

• OpsTable: Tablonun ana bileşeni.
• OpsTableToolbar: Araç çubuğu bileşeni.

Burada Yapılan Ana İşlemler

Table Footer Component bileşeninde aşağıdaki işlemler anahtar rol oynar ve bu olaylara müdahale etmek için ilgili bölümlere odaklanabilirsiniz:

• Sayfa Geçişi: handlePageChange ile sayfa değişiklikleri yönetilir.
• Satır Sayısı Yönetimi: onRowsPerPageChange metodu ile sayfa başına gösterilecek satır sayısı dinamik olarak güncellenir.
• Seçili Satır Sayısı: useShowSelectionColumn ile seçilen satırların sayısı görüntülenir.

Örnek Kullanım

import React from "react";
import TableFooterComponent from "./TableFooterComponent";

export default function ExampleFooter({ table, opsService }) {
  return <TableFooterComponent table={table} opsService={opsService} />;
}