Dashboard Oluşturma ve Düzenleme

Erişim

Gerekli Yetki: navigateDashboards + createDashboard | Roller: Yönetici, Sistem Yöneticisi

Modül Nedir?

Bu sayfa, sıfırdan yeni bir dashboard oluşturma, layout düzenleme, widget ekleme ve konfigüre etme ile Andon cihazına atama süreçlerini adım adım açıklamaktadır. Dashboard sistemi hakkında genel kavramsal bilgi için önce Dashboard Nedir? sayfasını inceleyiniz.

Dashboard düzenleyici, React Grid Layout tabanlı bir sürükle-bırak sistemi üzerine kuruludur. Widget'lar ızgara hücrelerine yerleştirilir; köşelerinden tutularak boyutlandırılır; sürüklenerek yeniden konumlandırılır. Arka plana fabrika planı veya SVG gibi bir görsel yüklenebilir; bu görsel üzerine widget'lar konumlandırılarak gerçek fabrika zemine uyumlu bir izleme panosu oluşturulabilir.

Yetenekler

• Yeni dashboard oluşturma: ad, açıklama ve menü görünürlük seçeneği
• React Grid Layout tabanlı sürükle-bırak, boyutlandırma düzenleyici
• Widget ekleme: Widget tipi seç → Kaynak konfigüre et → Konumlandır
• Arka plan görsel ekleme: fabrika planı, SVG, PNG, JPEG
• Birden fazla ekran (screen) yönetimi
• Kullanıcı ve rol bazlı erişim izni (Okuma / Düzenleme)
• Dashboard'u Andon cihazına atama
• JSON formatında dashboard dışa/içe aktarma (import/export)
• Varsayılan dashboard belirleme

Erişim & Roller

Rol	İzin Düzeyi
Yönetici	Yeni dashboard oluşturma, tüm dashboard'ları düzenleme ve silme
Sistem Yöneticisi	Yeni dashboard oluşturma, tüm dashboard'ları düzenleme ve silme
Diğer roller	Dashboard başına verilen Düzenleme iznine göre

Ekran Açıklaması

Ekran Görüntüsü

Ekran görüntüsü yakında eklenecektir.

Dashboard Oluşturma Formu

Alan	Tip	Zorunlu	Açıklama
Ad	Metin	Evet	Dashboard'un listede ve başlık çubuğunda görünecek adı
Açıklama	Metin alanı	Hayır	Dashboard'un amacını açıklayan kısa metin
Menüde Göster	Anahtar (toggle)	Evet	Aktifse dashboard sol menüde kısayol olarak listelenir

İzin Sekmeleri

Sekme	Açıklama
İzinli Kullanıcılar	Bireysel kullanıcılara Okuma veya Düzenleme izni verilir
İzinli Roller	Rollere Okuma veya Düzenleme izni verilir

ipucu

Kullanıcı ve Rol alanları boş bırakılırsa dashboard, navigateDashboards yetkisine sahip tüm kullanıcılara görünür hale gelir. Gizli bir dashboard için mutlaka en az bir kullanıcı veya rol ekleyin.

Düzenleme Modu Araç Çubuğu

Öğe	Açıklama
+ Widget Ekle	Widget tipi seçim modalını açar
Ayarlar	Arka plan ve ekran (screen) yönetimi panelini açar
Kaydet	Mevcut düzeni ve widget konfigürasyonunu kaydeder
Düzenlemeyi İptal	Kaydedilmemiş değişiklikleri geri alır

Widget Konfigürasyon Paneli

Widget üzerine gelindiğinde görünen Düzenle (kalem) ikonu tıklandığında açılan panel üç bölümden oluşur:

Bölüm	Açıklama
Veri Kaynakları	Widget'ı besleyecek API endpoint veya WebSocket kaynaklarının seçildiği bölüm
Tasarım Parametreleri	Renk, yazı boyutu, min/max değer, sembol, kenarlık gibi görsel ayarlar
Koşullu Değerler	Belirli eşiklere göre otomatik renk veya değer değişimi kuralları

Adım Adım Kullanım

1. Boş Dashboard Oluşturma

1. Sol menüden Dashboard seçeneğini tıklayın.
2. Sağ üstteki Oluştur butonuna tıklayın.
3. Ad alanına dashboard adını girin (örn. "Montaj Hattı OEE Takibi").
4. İsteğe bağlı Açıklama ekleyin.
5. Menüde Göster anahtarını gereksinime göre açın veya kapatın.
6. İzinli Kullanıcılar sekmesinde kullanıcıları ekleyin; her birine Okuma veya Düzenleme izni verin.
7. İzinli Roller sekmesinde rolleri ekleyin ve izin düzeylerini belirleyin.
8. Kaydet butonuna tıklayın. Dashboard oluşturulur ve boş görüntüleme ekranına yönlendirilirsiniz.

---

2. Arka Plan ve Ekran Ayarları

Dashboard görüntüleme ekranında sağ üstteki Ayarlar ikonuna tıklayın.

Arka Plan Ayarları

Ayar	Açıklama
Arka Plan Rengi	Dashboard zemininin rengi (renk paleti ile seçilir)
Arka Plan Görseli	Fabrika planı, makine şeması, SVG veya PNG görsel yüklenebilir
Görseli Kaldır	Yüklü arka plan görselini siler

Ekran (Screen) Yönetimi

Bir dashboard birden fazla ekran sayfasına sahip olabilir:

1. Ayarlar panelinde Ekran Ekle butonuna tıklayın.
2. Yeni ekrana bir ad verin (örn. "Üretim Hattı", "Kalite Metrikleri").
3. Üst çubukta ekranlar arasında sekme olarak geçiş yapılır.
4. İstenmeyen ekranı kaldırmak için ekran adının yanındaki Sil ikonunu kullanın.

---

3. Widget Ekleme

1. Dashboard görüntüleme ekranında Düzenle modunu açın (üst çubuk, kalem ikonu).
2. + Widget Ekle butonuna tıklayın; Widget Tipi Seçme modalı açılır.
3. Sol panelde sekiz gruptan birini seçin: Specials, Gauges, Cards, Tables, Charts, Links, Electrical, Buttons.
4. İstediğiniz widget tipine tıklayın.
5. Seç butonuna tıklayarak modalı kapatın.
6. Widget ızgaraya eklenir; sürükleyerek konumlandırın, köşelerinden tutarak boyutlandırın.

Widget tipleri ve her birinin açıklaması için bkz. Widget Tipleri.

---

4. Widget Konfigürasyonu

Eklenen bir widget'ı yapılandırmak için widget üzerine gelin ve Düzenle (kalem) ikonuna tıklayın.

4a. Veri Kaynakları Bağlama

1. Widget düzenleme panelinde Veri Kaynakları bölümüne geçin.
2. Widget'ın desteklediği kaynak türleri listelenir (OEE değerleri, istasyon durumu, etiket değeri vb.).
3. Ekle butonuyla istediğiniz kaynağı seçin.
4. Kaynak parametrelerini doldurun: istasyon kimliği, etiket kimliği, sorgu aralığı.
5. Gerçek zamanlı güncelleme için Canlı Bağlantı (Socket) seçeneğini etkinleştirin.

4b. Tasarım Parametreleri

Her widget tipinin kendine özgü tasarım parametreleri bulunur. Genel parametreler:

Parametre	Açıklama
Başlık / Metin	Widget üst etiketi veya başlık metni
Renk	Ön plan, arka plan veya değer rengi
Yazı Boyutu	Başlık ve değer metni için yazı boyutu (px)
Min / Max Değer	Gösterge ve çubuk widget'larının ölçek aralığı
Sembol	Değerin yanında gösterilecek birim (%, °C, m/dk vb.)
Kenar Yarıçapı / Gölge	Kartın köşe yuvarlama ve gölge efekti
Arka Plan	Widget iç arka plan rengi

4c. Koşullu Değerler

Tasarım parametreleri belirli koşullara göre otomatik değiştirilebilir (örn. OEE %80'in altındaysa kırmızı, üzerindeyse yeşil):

1. İlgili parametrenin yanındaki Koşul Ekle ikonuna tıklayın.
2. Kaynak, operatör (<, >, = vb.) ve eşik değerini belirleyin.
3. Koşul sağlandığında uygulanacak değeri (renk, metin vb.) girin.
4. Birden fazla koşul eklenebilir; kurallar yukarıdan aşağıya öncelik sırasıyla değerlendirilir.

---

5. Dashboard'u Andon Cihazına Atama

1. Dashboard listesi ekranında ilgili dashboard'un Düzenle ikonuna tıklayın.
2. Açılan form ekranında Andon Cihazı alanından hedef Andon v2 cihazını seçin.
3. Güncelle butonuyla kaydedin. Andon cihazı bir sonraki yenileme döngüsünde bu dashboard'ı tam ekran gösterir.

---

6. Dashboard İçe/Dışa Aktarma

Dışa Aktarma (Export)

1. Dashboard listesi ekranında üst çubukdan İçe/Dışa Aktar menüsünü açın.
2. Dışa Aktar (Seçilen) seçeneğini tıklayın; liste seçim moduna geçer.
3. İhraç edilecek dashboard'ları işaretleyin.
4. Seçilen Dashboard'ları Dışa Aktar butonuna tıklayın; .json dosyası indirilir.

İçe Aktarma (Import)

1. Aynı menüden İçe Aktar seçeneğini tıklayın.
2. Dosya seçici iletişim kutusundan daha önce dışa aktarılan .json dosyasını seçin.
3. Sistem dosyayı okuyarak dashboard'u oluşturur.

---

7. Varsayılan Dashboard Belirleme

Liste ekranında bir dashboard satırının Varsayılan Yap (yıldız) ikonuna tıklayın. Artık bu kullanıcı için oturum açıldığında otomatik olarak bu dashboard açılır.

Use Case Senaryoları

Senaryo 1 — 3 İstasyonlu Hat için OEE Dashboard'u

Üretim mühendisi, üç istasyonlu bir montaj hattının OEE değerlerini tek dashboard'da izlemek istemektedir.

1. Dashboard Oluşturma: Ad "Hat OEE Takip", Menüde Göster: Aktif, "Üretim" rolüne Okuma izni.
2. Arka Plan: Fabrika zemini planı yüklenir.
3. Widget Ekleme: Her istasyon için bir adet basicGauge widget eklenir (toplam 3 adet).
4. Veri Kaynağı Bağlama: Her basicGauge widget'ının Veri Kaynağı bölümünde ilgili istasyonun OEE socket kaynağı seçilir.
5. Tasarım: Min: 0, Max: 100, Sembol: %, koşullu renk: < 65 → kırmızı, 65–85 → sarı, > 85 → yeşil.
6. Önizleme: Düzenleme modu kapatılarak canlı görünüm kontrol edilir.
7. Kaydet ve Andon cihazına ata.

Senaryo 2 — Kalite Yöneticisi Kişisel Dashboard'u

Kalite yöneticisi, yalnızca kendisinin görebileceği, fire adeti ve kalite kontrolü sonuçlarını listeleyen bir dashboard oluşturur.

1. Dashboard oluşturulur; İzinli Kullanıcılar bölümüne yalnızca kendi kullanıcı hesabı Okuma izniyle eklenir.
2. Bir twoValueCard widget'ı ile günlük fire ve hurda adedi gösterilir.
3. Bir dynamicTable widget'ı ile son kalite emirleri listelenir; veri kaynağı kalite emirleri API'sine bağlanır.
4. Varsayılan Dashboard olarak belirlenir; oturum açtığında doğrudan bu dashboard karşısına çıkar.

Modüller Arası Bağlantılar

İlişki	Modül	Açıklama
Dashboard genel	Dashboard Nedir?	Sistem mimarisi ve kavramsal açıklama
Widget kataloğu	Widget Tipleri	Her widget tipinin tam açıklaması ve parametreleri
Kullanıcı izinleri	../sistem-yonetimi/kullanicilar	İzin verilecek kullanıcı listesi
Rol izinleri	../sistem-yonetimi/roller	İzin verilecek rol listesi
Andon atama	../andon/andon-nedir	Dashboard'u Andon v2 cihazına atama