Ana içeriğe geç
Version: 1.0.1

Ops Table Popovers

Ops Table Popovers, Ops Table bileşeninde çeşitli ayarları yapmak için açılır menüler (popovers) sunar. Bu menüler, kullanıcıların tablo görünürlüğünü, filtreleri, yoğunluk ayarlarını ve dışa aktarma işlemlerini yönetmesine olanak tanır.

Ne İşe Yarar?

Ops Table Popovers:

  • Kolon Görünürlüğü: Sütunların görünürlük durumlarını ayarlar.
  • Filtreleme: Tablo filtrelerini yönetmek için bir arayüz sunar.
  • Yoğunluk Ayarları: Tablo satırlarının yüksekliğini değiştirme seçeneği sağlar.
  • Dışa Aktarma: Tabloyu CSV veya PDF formatında dışa aktarma işlevi sunar.

İş Mantığı

  1. Menü Türleri:
    • ColumnsPopover: Kullanıcıların hangi sütunların görüneceğini seçmesine olanak tanır.
    • FiltersPopover: Mevcut tablo filtrelerini yönetmek için bir arayüz sağlar.
    • DensityPopover: Tablo satır yoğunluğu (Compact, Standard, Comfortable) arasında geçiş yapar.
    • ExportPopover: Tabloyu CSV veya PDF olarak dışa aktarma seçenekleri sunar.
    • AggregationPopover: Toplama işlemlerini yapılandırmak için kullanılır.
  2. Dinamik Açılır Menü Yönetimi:
    • anchorEl ve popoverType durumları ile açılır menülerin gösterimi kontrol edilir.
    • Kullanıcı bir menü seçeneğine tıkladığında ilgili bileşen (renderPopoverContent) gösterilir.
  3. Küçük Ekran Desteği:
    • Küçük ekranlarda popover yerine Drawer bileşeni kullanılır.

Aldığı Propslar

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

PropTipiAçıklama
tableTable<unknown>Tablonun genel durumunu ve modellerini içerir.
opsServiceIOpsTableService<any>Tablonun veri işlemlerini yöneten servis sınıfı.
tableVisibilityITableVisibilityPropsTablonun görünürlük ayarlarını yapılandırır.

Yönetilen Olaylar

  1. Kolon Görünürlüğü:
    • Kullanıcı ColumnsPopover üzerinden hangi sütunların görüneceğini seçebilir. Seçimler column.toggleVisibility ile işlenir.
  2. Filtreleme:
    • FiltersPopover bileşeni, kullanıcıların filtre ekleyip kaldırmasına olanak tanır.
  3. Yoğunluk Ayarları:
    • DensityPopover ile satır yüksekliği değiştirilir.
  4. Dışa Aktarma:
    • ExportPopover, tabloyu CSV veya PDF formatında dışa aktarmak için kullanılır.
  5. Toplama İşlemleri:
    • AggregationPopover, kullanıcıların belirli sütunlarda toplama işlemleri yapılandırmasını sağlar.

İlgili Bileşenler

  • OpsTableToolbar: Araç çubuğu, bu popover bileşenlerini tetikler.
  • ColumnsPopover: Kolon görünürlüğünü yönetir.
  • FiltersPopover: Filtreleme seçeneklerini sunar.
  • DensityPopover: Tablo yoğunluk ayarlarını değiştirir.
  • ExportPopover: Veriyi dışa aktarma seçeneklerini yönetir.
  • AggregationPopover: Toplama işlemleri ayarlarını sağlar.

Burada Yapılan Ana İşlemler

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

  • Dinamik Menü Yönetimi: popoverType ve anchorEl ile açılır menülerin görünürlüğü kontrol edilir.
  • Kolon Görünürlüğü: ColumnsPopover ile kullanıcıların kolonları dinamik olarak yönetmesi sağlanır.
  • Yoğunluk Değişiklikleri: DensityPopover üzerinden tablo yoğunluğu değiştirilir.
  • Veri Dışa Aktarma: ExportPopover ile tablo verileri CSV veya PDF olarak dışa aktarılır.
  • Toplama İşlemleri: AggregationPopover, sütun bazlı toplama işlemlerini yönetir.

Örnek Kullanım

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

export default function ExamplePopovers({
table,
opsService,
tableVisibility,
}) {
return (
<OpsTablePopovers
table={table}
opsService={opsService}
tableVisibility={tableVisibility}
/>
);
}