Kuika’nın Date Time elementi, kullanıcıların hem tarih hem de saat bilgisini tek bir alanda seçmesini sağlar. Bu özellik, randevu planlamaları, teslim tarihleri, toplantı zamanlamaları ve zaman bazlı raporlamalar için idealdir.

Date Time elementi, web ve mobil uygulamalarda desteklenir.

Kullanım Alanları

• Toplantı veya randevu planlama ekranları,
• Teslim tarihi ve saati belirleme,
• Rapor filtreleme (örneğin, “24.04.2025 / 15:30”),
• Rezervasyon başlangıç ve bitiş zamanları vb.

Randevu Planlama

1. Statik Kullanım Senaryosu – Etkinlik Zamanı

Bir etkinlik planlama uygulamasında kullanıcıların etkinlik başlangıç zamanını seçmesi gerekir. Ancak sistemde sabit bir tarih-saat atanabilir.

Özelliklerin Kullanımı

• Value → 2023-10-28 13:09:14
• Placeholder → “Etkinlik Tarih ve Saatini Seçin”
• AllowClear → Kullanıcı isterse sıfırlayabilir
• Format → DD/MM/YYYY HH:mm (örn. 28/10/2023 13:09)
• DisableBeforeDate → Bugünden önceki tarih-saatler kapatılır
• DisabledDays → Özel günler kapatılabilir

Senaryo Adımı Tamamlandığında

• Kullanıcı sabit atanmış tarih-saat bilgisini görür.
• Tarih ve saat formatlı şekilde ekrana yansır.
• Sistem, bu tarih-saat değerini işlem adımlarında kullanır.

2. Dinamik Kullanım Senaryosu – Sipariş Teslimat Tarihi ve Saati

Bir e-ticaret uygulamasında siparişlerin teslimat tarih ve saati yönetilir. Kullanıcı yeni sipariş oluştururken teslimat tarih ve saatini seçer, sistem bu değeri tabloya kaydeder.

Veri Kaynağı Bağlama 

• Datasources modülüne gidin. 
• Ardından Tables başlığı yanındaki + ikonuna tıklayın ve tabloya “Orders” ismini verin. 
• Aşağıdaki tabloyu oluşturun. 

• Ardından SQL Actions’a tıklayın ve aksiyona “Orders” ismini verin. C# ile de oluşturabilirsiniz.
• Aşağıdaki SQL komutunu girin. 

SELECT     CustomerName,    DeliveryDate,    StatusFROM OrdersWHERE DeliveryDate >= GETDATE()ORDER BY DeliveryDate ASC;

UI Design Modülü işlemleri

• Uygulama ekranında sağ kenarda bulunan Add Action butonuna tıklayın. 
• Ardından Custom > Orders’ı seçin. 

Özelliklerin Kullanımı

• Value → Orders.DeliveryDate (Symbol Picker üzerinden bağlanır)
• Placeholder → “Teslimat Tarih ve Saatini Seçin”
• AllowClear → Kullanıcı seçimi sıfırlayabilir
• Format → DD/MM/YYYY HH:mm
• DisableBeforeDate → Geçmiş tarih-saat seçilemez
• DisabledDays → Tatil günleri kapatılabilir

Senaryo Adımı Tamamlandığında

• Kullanıcı yalnızca ileri tarih-saat kombinasyonlarını seçebilir.
• Seçilen değer Orders.DeliveryDate alanına kaydedilir.
• Doğru formatta ekranda görünür.
• İş akışında (örn. teslimat planlama) otomatik kullanılır.

Kısıtlamalar

• Disable Before/After Time yalnızca web uygulamalarda çalışır.
• Mobilde cihazın native tarih-saat seçici ekranı açılır.

İpuçları ve Best Practices

• Randevu planlama gibi senaryolarda geçmiş tarihleri devre dışı bırakın.
• Kullanıcı deneyimi için placeholder metinleri mutlaka ekleyin.
• Uzun vadeli seçimler için (örn. yıllar) performans sorunlarını önlemek amacıyla dinamik kısıtlamalar kullanın.