The console was a flat form: every control on the root window, 48 operations as undifferentiated rows, a giant output textarea, privilege as a buried sentence. It now has a shell: a fixed header band (product, target, device state, privilege) plus a page body, and in detailed mode a sidebar with five operation categories and an Activity page. What changed (presentation layer only; _execute, gates, run_plan, audit and redaction untouched): - simple mode is an Overview: four state cards (target/device/privilege/ inventory) plus Install/Status/Exit, instead of the raw form; - the target is one segmented control (Device/Wave/Entire fleet) with a single scope source of truth; the dealer text can no longer silently override the wave, and the scope stays visible across pages; - operations are browsed, not dumped: icon + name + explanation + scope/risk badges, with a detail panel (meta grid, warnings, options form, backend-built command preview on demand); - destructive confirmations are dedicated dialogs showing OPERATION/TARGET/ SCOPE/EFFECT with a fleet/production strip and focus on Cancel; the token dialog is styled; secrets never enter either; - the output textarea is an execution drawer (IDLE/RUNNING with mm:ss / DONE-FAILED with duration and exit code) streaming the same backend output; - write operations stay visible but disabled with their reason when unprivileged, in both entry points; - new module bfos/ui_widgets.py (~490 lines, stdlib + tkinter only, no colour literals): canvas line icons, segmented control, collapsible panel, meta grid, timer, the two safety dialogs. Tests: test_bfos_gui_static.py 95 OK, test_bfos.py 155 OK, run-all.sh 12/12. The colour-literal test now also scans ui_widgets.py (proven by mutation: a #ff0000 probe goes red, green after removal). Live QA: zero geometry errors over 712 widgets, all 48 operations listed, 13 write ops disabled with reasons without root, TUI and --list smoke-tested. Known limits: no dark theme (tokens ready); the detail page's target line does not refresh when the target changes mid-form (the confirmation dialog always shows the current one); visual QA was geometry + OCR, not a human eye.
182 lines
8.5 KiB
Markdown
182 lines
8.5 KiB
Markdown
# 34 — Konsol Görsel Konsepti (Uygulanan Tasarım)
|
||
|
||
## 1. Amaç
|
||
|
||
Operatör konsolunun (`bfos/ui_gui.py` + `bfos/ui_widgets.py`) görsel
|
||
dünyasını tek belgede sabitlemek: uygulama kabuğu, Genel Bakış, hedef
|
||
seçici, işlem tarayıcı, ayrıntı paneli, yürütme çekmecesi ve güvenlik
|
||
pencereleri. Kavram `docs/33-OPERATOR-CONSOLE.md` §9.2'nin uygulanan
|
||
hâlini anlatır; davranış sözleşmesini değiştirmez.
|
||
|
||
## 2. Kapsam
|
||
|
||
Yalnızca sunum katmanı: koyu başlık bandı, hedef paneli, kenar çubuğu,
|
||
sayfalar, rozetler, diyaloglar. Renk/boşluk/yazı değerleri
|
||
`bfos/ui_theme.py` üzerinden `web/static/tokens.css` aynasından gelir;
|
||
bu belgede renk kodu yoktur. Backend kuralları (`bfos/operations.py`,
|
||
`bfos/runner.py`), kapılar ve denetim kaydı kapsam dışıdır — aynen korunur.
|
||
|
||
## 3. Kararlar
|
||
|
||
1. **Uygulama kabuğu:** başlık bandı + hedef paneli her modda sabittir;
|
||
detaylı modda solda 220px kenar çubuğu (5 kategori + Etkinlik), sağda
|
||
sayfa alanı, altta yürütme çekmecesi ve eylem çubuğu.
|
||
2. **Genel Bakış ilk ekrandır:** 4 durum kartı (Hedef / Cihaz durumu /
|
||
Yetki / Envanter) + 3 hızlı işlem (Kur / Durum / Çıkış). Form yok.
|
||
3. **Hedef seçici parçalıdır:** `[Cihaz | Dalga | Tüm filo]`; görünür
|
||
kapsam tektir, girdiler bağlama duyarlıdır, tüm filo yüksek etkili
|
||
uyarı şeridi açar.
|
||
4. **İşlem tarayıcı satırlıdır:** ikon + ad + tek satır açıklama +
|
||
tür rozeti + durum rozeti + ok. Engelli işlem listede kalır, solar,
|
||
nedenini yazar.
|
||
5. **Ayrıntı paneli:** başlık, açıklama, HEDEF/KAPSAM/YETKİ/TÜR ızgarası,
|
||
koşullu uyarılar, seçenek formu, istek üzerine gerçek backend ile
|
||
üretilen komut önizlemesi, birincil eylem.
|
||
6. **Onay penceresi özeldir:** İŞLEM/HEDEF/KAPSAM/ETKİ bloğu + monospace
|
||
komut + `[Vazgeç]` / işlem adlı düğme. Yıkıcıda odak Vazgeç'tedir.
|
||
7. **Yürütme çekmecesi:** durum rozeti + `işlem · hedef · süre`; log
|
||
kuyusu salt-okunur kanıttır. Bitiş TAMAM/HATA + süre + çıkış kodudur.
|
||
8. **Etkinlik sayfası:** yalnız bu oturumun biten çalışmaları (zaman,
|
||
işlem, hedef, sonuç). Sır gösterilmez.
|
||
|
||
## 4. Neden Bu Karar?
|
||
|
||
Operatör 3 saniyede altı soruya yanıt almalıdır: hedef ne, durumu ne,
|
||
yetkim ne, ne yapabilirim, sorun var mı, bir şey çalışıyor mu? Eski
|
||
sekme+tablo düzeni bu soruları form kalabalığına gömüyordu. Kabuk her
|
||
soruya sabit bir yer verir; güvenlik bilgisi (kapsam, yetki, yıkıcılık)
|
||
her ekranda aynı görsel dilde yinelenir.
|
||
|
||
## 5. Alternatifler
|
||
|
||
- **Sekmeler yerinde kalsın:** reddedildi — 5 sekme + tablo, 48 işlemi
|
||
ayırt edilemez kılar ve Genel Bakış'a yer bırakmaz.
|
||
- **Web/Electron kabuğu:** reddedildi — çevrimdışı kurulum, `sudo bf`
|
||
ile başlatma ve `python3-tk` bağımlılığı korunmalıdır.
|
||
- **Koyu tema:** ertelendi — atölye ışığında açık zemin okunur; token
|
||
yapısı koyu temaya hazırdır ama öncelik açık temadır.
|
||
|
||
## 6. Avantajlar
|
||
|
||
- Kapsam her ekranda görünür (başlık + hedef paneli + onay penceresi).
|
||
- Yazma işlemleri gizlenmez, kapatılır ve nedeni yazılır (yetki öğretir).
|
||
- Tehlike stili yalnız tehlikeli eylemdedir; panel kırmızıya boyanmaz.
|
||
- Tüm simgeler Tk canvas çizimidir: çevrimdışı, lisanssız, varlıksız.
|
||
- Klavye: sekme sırası görsel sırayı izler, satırlar odaklanabilir,
|
||
`Enter` çalıştırır, `Esc` diyalogu kapatır (yıkıcıda asla onaylamaz).
|
||
|
||
## 7. Dezavantajlar
|
||
|
||
- Özel satır bileşeni `ttk.Treeview` yerleşik sıralamasından vazgeçer:
|
||
sütun sıralaması yoktur (arama + kategori yeterlidir).
|
||
- Ayrıntıdaki hedef satırı, seçenekli işlemlerde hedef değişince otomatik
|
||
tazelenmez (girdi korunur); güncel hedef çalışma anı penceresinde
|
||
gösterilir.
|
||
|
||
## 8. Riskler
|
||
|
||
- **Kapsam yanılgısı:** parçalı denetim + başlık aynası + onaydaki kapsam
|
||
şeridi üç katmanlı savunmadır; `current_target()` görünür kapsama göre
|
||
hedef üretir (bayi metni dalgayı ezemez).
|
||
- **Eski alışkanlık:** sekmeleri arayan operatör için §9.2 haritası ve
|
||
Genel Bakış'taki yönlendirme metni geçişi anlatır.
|
||
|
||
## 9. Uygulama Planı
|
||
|
||
### 9.1 Kabuk iskeleti
|
||
|
||
```text
|
||
+---------------------------------------------------------------+
|
||
| koyu bant: ürün | hedef | cihaz durumu | yetki |
|
||
+---------------------------------------------------------------+
|
||
| şerit (salt-okunur / deneme kipi; etkinse) |
|
||
+---------------------------------------------------------------+
|
||
| HEDEF: [Cihaz|Dalga|Tüm filo] + bağlamsal girdi |
|
||
+----------------+----------------------------------------------+
|
||
| kenar çubuğu | sayfa (tarayıcı + ayrıntı / etkinlik) |
|
||
| +----------------------------------------------+
|
||
| | yürütme çekmecesi (başlık + log kuyusu) |
|
||
+---------------------------------------------------------------+
|
||
| eylem çubuğu: [birincil] neden ... durum / araçlar |
|
||
+---------------------------------------------------------------+
|
||
```
|
||
|
||
### 9.2 Yedi ekran
|
||
|
||
1. **Genel Bakış** (basit mod): 4 kart + Kur/Durum/Çıkış. Yetkisizde Kur
|
||
kapalı, nedeni düğmede.
|
||
2. **Hedef seçimi:** Cihaz → 8 hane doğrulamalı giriş; Dalga → salt-okunur
|
||
liste (`production` seçilince jeton notu); Tüm filo → tehlike şeridi.
|
||
3. **İşlem tarayıcı:** arama + satırlar (ikon, ad, açıklama, `YIKICI` /
|
||
`salt-okunur`, `açık` / `kapalı — sudo bf`, ok). Seçili satır aksan
|
||
dolgulu.
|
||
4. **Ayrıntı:** meta ızgara + uyarılar + seçenekler + katlanır komut
|
||
önizlemesi + birincil düğme (yıkıcıda kırmızı, engellide kapalı).
|
||
5. **Çalışma:** `ÇALIŞIYOR` rozeti + ad + hedef + `mm:ss` + iptal; bitiş
|
||
`TAMAM`/`HATA` + süre + çıkış kodu; kayıt Etkinlik'e düşer.
|
||
6. **Yıkıcı onay:** İŞLEM/HEDEF/KAPSAM/ETKİ + filo/üretim şeridi +
|
||
açık önizleme + `[Vazgeç]` (odak) / işlem adlı kırmızı düğme.
|
||
7. **Salt-okunur:** başlık rozeti + turuncu şerit; tüm yazma düğmeleri
|
||
kapalı + gerekçeli; `_start_run` kapıyı yeniden denetler.
|
||
|
||
### 9.3 Token ve yazı
|
||
|
||
Zemin `--bg-app`, paneller beyaz, tek koyu bant; vurgu mavisi yalnız
|
||
birincil eylem + seçili satır. Başlık 22, bölüm 18, gövde 15, ikincil 13,
|
||
üstveri 12, veri monospace 13. Ritim 4/8/12/16/24/32/48. Kenar çubuğu
|
||
220px, satır 44px, denetim 36px. Durum söz + renk + rozet (renk yalnız
|
||
asla).
|
||
|
||
## 10. Test Planı
|
||
|
||
- `tests/test_bfos.py` (155) ve `tests/test_bfos_gui_static.py` (95):
|
||
pencere açmaz; katalog, kapılar, önizleme, renk aynası sözleşmeleri.
|
||
- Canlı QA (`DISPLAY=:0`): `/tmp/bf-qa.py` geometri taraması (0 hatalı
|
||
öğe), 6 sayfa × tarayıcı/ayrıntı, hedef akışları, `import -window`
|
||
yakalamaları + Tesseract OCR metin denetimi.
|
||
- Mutasyon kanıtı: `ui_widgets.py` içine renk sayesi → renk testi
|
||
kırmızıya döner; geri alınır.
|
||
- `bash tests/run-all.sh` 12/12; `python3 -m bfos --tui` duman testi.
|
||
|
||
## 11. Rollback
|
||
|
||
Sunum katmanıdır: `bfos/ui_gui.py`, `bfos/ui_widgets.py`,
|
||
`docs/33`, `docs/34` ve bir test iddiası değişir. Geri alma = bu dosyaları
|
||
önceki sürüme döndürmek; backend, envanter ve denetim kaydı etkilenmez.
|
||
Commitlenmeden çalışılır; değişiklikler çalışma ağacında durur.
|
||
|
||
## 12. Kontrol Listesi
|
||
|
||
- [x] Kabuk + Genel Bakış + hedef seçici + tarayıcı + ayrıntı + çekmece
|
||
- [x] Onay/jeton pencereleri (odak ve varsayılan güvenli)
|
||
- [x] Salt-okunur sunumu (gizleme yok, gerekçe her yerde)
|
||
- [x] Etkinlik sayfası (oturum içi, sırsız)
|
||
- [x] Token/sözdizimi aynası (`tokens.css` ↔ `ui_theme.py`) korunur
|
||
- [x] Türkçe metin taraması (teknik adlar dışında İngilizce yok)
|
||
- [x] Ekran görüntüleri (`/tmp/bf-shots/r2-*`, `r3-*`, `r4-*`)
|
||
- [ ] Vision servisiyle görsel inceleme (servis 500 veriyor; OCR ile
|
||
doğrulandı, insan gözüyle bakılmadı)
|
||
|
||
## 13. Açık Sorular
|
||
|
||
- Koyu tema gerekli mi? (Token yapısı hazır; talep yok.)
|
||
- Etkinlik sayfası denetim günlüğünden güvenli özet okumalı mı?
|
||
(Bugün yalnız oturum içi; güvenlik garantisi değişmeden olmaz.)
|
||
|
||
## Ek: Kabuk durum akışı
|
||
|
||
```mermaid
|
||
flowchart TD
|
||
A[Genel Bakış] -->|Detaylı mod| B[Kenar çubuğu: 5 kategori + Etkinlik]
|
||
B --> C[İşlem tarayıcı]
|
||
C --> D[İşlem ayrıntısı]
|
||
D --> E[Komut önizlemesi]
|
||
E --> F{Onay penceresi}
|
||
F -->|Vazgeç| D
|
||
F -->|Onayla| G[Kapı jetonları]
|
||
G -->|iptal| D
|
||
G -->|tamam| H[Kesin komut onayı]
|
||
H -->|Vazgeç| D
|
||
H -->|Onayla| I[Yürütme çekmecesi: ÇALIŞIYOR]
|
||
I --> J[TAMAM / HATA + Etkinlik kaydı]
|
||
```
|