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ığı
- 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.
- Dinamik Açılır Menü Yönetimi:
anchorElvepopoverTypedurumları 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.
- Küçük Ekran Desteği:
- Küçük ekranlarda popover yerine
Drawerbileşeni kullanılır.
- Küçük ekranlarda popover yerine
Aldığı Propslar
ITablePopoversProps 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ı. |
tableVisibility | ITableVisibilityProps | Tablonun görünürlük ayarlarını yapılandırır. |
Yönetilen Olaylar
- Kolon Görünürlüğü:
- Kullanıcı
ColumnsPopoverüzerinden hangi sütunların görüneceğini seçebilir. Se çimlercolumn.toggleVisibilityile işlenir.
- Kullanıcı
- Filtreleme:
FiltersPopoverbileşeni, kullanıcıların filtre ekleyip kaldırmasına olanak tanır.
- Yoğunluk Ayarları:
DensityPopoverile satır yüksekliği değiştirilir.
- Dışa Aktarma:
ExportPopover, tabloyu CSV veya PDF formatında dışa aktarmak için kullanılır.
- 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:
popoverTypeveanchorElile açılır menülerin görünürlüğü kontrol edilir. - Kolon Görünürlüğü:
ColumnsPopoverile 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:
ExportPopoverile 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}
/>
);
}