Aggregation Popover

Aggregation Popover, Ops Table bileşeninde kullanıcıların belirli sütunlarda toplama işlemlerini yapılandırmasını sağlar. Kullanıcılar toplam, ortalama, minimum, maksimum gibi toplama türleri ekleyebilir.

Ne İşe Yarar?

Aggregation Popover:

• Kullanıcıların sütun bazlı toplama işlemleri eklemesine olanak tanır.
• Birden fazla toplama türünü aynı anda uygulamayı destekler.
• Uygulanan toplamaları dinamik olarak tabloda görüntüler.

İş Mantığı

1. Toplama Ekleme:
   • Kullanıcı "Add Aggregation" butonuna tıkladığında varsayılan bir toplama eklenir.
   • aggregations state'i güncellenerek yeni bir toplama işlemi tabloya eklenir.
2. Toplama Değerlerini Güncelleme:
   • Kullanıcı, toplama sütunu veya türünü değiştirdiğinde handleAggregationChange fonksiyonu çağrılır.
   • Yeni değer aggregations state'ine yansıtılır.
3. Toplama Silme:
   • Kullanıcı bir toplamanın yanındaki "delete" ikonuna tıkladığında, ilgili toplama işlemi aggregations state'inden kaldırılır.
4. Toplamaları Uygulama:
   • "Apply" butonuna tıklandığında, opsService.handleAggregation ile toplama işlemleri backend'e iletilir.
5. Varsayılan Toplamalara Dönme:
   • Kullanıcı "Reset" butonuna tıkladığında tüm toplama işlemleri sıfırlanır ve varsayılan duruma döner.

Alt Bileşenler ve Fonksiyonlar

1. handleAggregationChange

• Kullanıcının sütun veya toplama türü seçimlerini yönetir.
• Seçilen sütun ve tür, ilgili toplama işlemine uygulanır ve aggregations state'i güncellenir.

2. handleAddAggregation

• Yeni bir toplama işlemi eklemek için kullanılır.
• Varsayılan bir toplama işlemi (AggeretionsDefaultItem) aggregations listesine eklenir.

3. handleRemoveAggregation

• Kullanıcının bir toplama işlemini kaldırmasına olanak tanır.
• İlgili toplama işlemi aggregations listesinden kaldırılır.

4. handleSubmitAggregations

• Tüm toplama işlemlerini uygulamak için çağrılır.
• opsService.handleAggregation ile toplama işlemleri backend'e gönderilir.

5. handleResetAggregations

• Tüm toplama işlemlerini sıfırlamak için kullanılır.
• aggregations state'i temizlenir ve popover kapatılır.

Aldığı Propslar

IAggregationPopoverProps 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ı.
handlePopoverClose	() => void	Popover kapatma olayını yönetmek için bir callback fonksiyonu.

Yönetilen Olaylar

1. Toplama Ekleme:
   • Kullanıcı "Add Aggregation" butonuna tıkladığında handleAddAggregation çağrılır ve varsayılan bir toplama eklenir.
2. Toplama Değiştirme:
   • Kullanıcı sütun veya toplama türünü değiştirdiğinde, handleAggregationChange ile seçimler güncellenir.
3. Toplama Silme:
   • "Delete" ikonuna tıklandığında handleRemoveAggregation çağrılır ve ilgili toplama kaldırılır.
4. Toplamaları Uygulama:
   • "Apply" butonuna tıklandığında handleSubmitAggregations çalışır ve toplamalar backend'e gönderilir.
5. Toplamaları Sıfırlama:
   • Kullanıcı "Reset" butonuna tıkladığında handleResetAggregations çağrılır ve tüm toplamalar varsayılan duruma döner.

İlgili Bileşenler

• OpsTablePopovers: AggregationPopover bileşenini tetikleyen ana popover.
• OpsTable: Toplama sonuçlarının gösterildiği ana tablo bileşeni.

Burada Yapılan Ana İşlemler

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

• Toplama Ekleme ve Silme: Kullanıcıların yeni toplama işlemleri eklemesi veya mevcutları kaldırması handleAddAggregation ve handleRemoveAggregation ile yönetilir.
• Toplama Türü ve Sütun Yönetimi: Kullanıcı seçimleri handleAggregationChange ile işlenir ve toplama işlemleri güncellenir.
• Uygulama ve Sıfırlama: "Apply" ve "Reset" butonları ile toplamalar backend'e senkronize edilir veya sıfırlanır.

Örnek Kullanım

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

export default function ExampleAggregationPopover({
  table,
  opsService,
  handlePopoverClose,
}) {
  return (
    <AggregationPopover
      table={table}
      opsService={opsService}
      handlePopoverClose={handlePopoverClose}
    />
  );
}