# Spool Release Wizard Design Guide / Spool Release Wizard Tasarım Rehberi

## Overview / Genel Bakış
- **EN:** This document describes the architecture of the new Spool Release Wizard. It consolidates Spool List, Weld/Paint information, release triggers, rollback, and area overview features into a single multistep experience.
- **TR:** Bu doküman, tüm Spool Listesi, Weld/Paint bilgileri, release tetikleyicileri, rollback ve alan özetini tek bir çok adımlı sihirbazda toplayan yeni Spool Release Wizard mimarisini anlatır.

## Goals / Hedefler
1. **EN:** Faster batch release & rollback operations with minimal page reloads.  
   **TR:** Sayfa yenilemesine gerek kalmadan daha hızlı toplu release ve rollback işlemleri.
2. **EN:** Step-by-step guidance for SHOP/FIELD users with contextual validation.  
   **TR:** SHOP/FIELD kullanıcıları için bağlamsal doğrulamalarla adım adım yönlendirme.
3. **EN:** Modern UI using cards, steppers, and collapsible panels, still powered by existing DevExtreme grids and helper partials.  
   **TR:** Mevcut DevExtreme grid ve helper parçalarını kullanırken kartlar, stepper ve açılır panellerle modern arayüz.

## File Structure / Dosya Yapısı
```
resources/views/admin/type/
├─ spool-release-wizard.blade.php          # Main wizard shell
└─ spool-release-wizard/                   # Partials per step
   ├─ bootstrap-data.blade.php             # Shared PHP logic (queries, release actions)
   ├─ step-1-select.blade.php              # Spool list + chart selector
   ├─ step-2-inspect.blade.php             # Weld/Paint info form + checklist
   ├─ step-3-release.blade.php             # Release buttons, paint follow-up feedback
   ├─ step-4-rollback.blade.php            # Release list + rollback actions
   ├─ step-5-overview.blade.php            # Spool area overview cards/grid
   └─ wizard-nav.blade.php                 # Stepper navigation + controls
resources/js/spool-release-wizard.js       # (Optional) Future dedicated script
resources/views/guide/spool-release-wizard.md  # This file
```

## Data Flow / Veri Akışı
1. **EN:** `bootstrap-data.blade.php` mirrors the query logic from `spool-release-ndt.blade.php`, preparing `$weldInfos`, `$paintInfos`, `$showReleaseButton`, counters, etc., and executing release or rollback requests before the UI loads.  
   **TR:** `bootstrap-data.blade.php`, `spool-release-ndt.blade.php`deki sorgu mantığını aynen kopyalayarak `$weldInfos`, `$paintInfos`, `$showReleaseButton`, sayaçlar vb. verileri hazırlar ve UI yüklenmeden önce release/rollback isteklerini çalıştırır.
2. **EN:** Steps share selected ISO/SPL state via hidden inputs in the form; DevExtreme grids post data back through classic form submissions to keep compatibility with existing back-end actions.  
   **TR:** Adımlar seçilen ISO/SPL durumunu formdaki gizli alanlar üzerinden paylaşır; DevExtreme gridleri mevcut back-end aksiyonlarıyla uyumlu kalmak için klasik form gönderimi yapar.

## Step Breakdown / Adım Detayları
1. **Select** – Chart + Spool List grid. Multi-select triggers form submission (POST) that fills `iso_number` & `spool_number`.  
   **TR:** Grafik + Spool List grid’i. Çoklu seçim form gönderimiyle `iso_number` ve `spool_number` alanlarını doldurur.
2. **Inspect** – Shows ISO/SPool filters, painting cycles, NDT %, PWHT, spool status chip, checklist upload, SHOP/FIELD toggle.  
   **TR:** ISO/SPL filtreleri, boyama çevrimleri, NDT %, PWHT, statü etiketi, checklist yükleme ve SHOP/FIELD seçimi burada.
3. **Release** – Houses release buttons, modals, summary of generated numbers, and includes `paint-follow-up-updater` feedback area.  
   **TR:** Release butonları, modallar, oluşturulan numara özetleri ve `paint-follow-up-updater` geri bildirim alanı burada.
4. **Rollback** – Displays release history (NDT/Paint lists) with inline rollback triggers, plus log toasts.  
   **TR:** Release geçmişi ve rollback tetikleyicilerini, ayrıca log bildirimlerini gösterir.
5. **Overview** – Compact cards that summarize Waiting/OnGoing/etc. counts plus a button to open the full Spool Area grid modal (`spool-area-release`).  
   **TR:** Waiting/OnGoing vb. sayıları özetleyen kartlar ve tam Spool Area grid modali açan buton içerir.

## UI Patterns / Arayüz Kalıpları
- Bootstrap 5 vertical pills-based stepper (`wizard-nav.blade.php`).
- DevExtreme grids kept intact but wrapped inside cards with contextual toolbars.
- Progress bar & status badges updated when selection changes.
- Responsive two-column layout for large screens, stacked for mobile.

## Future Enhancements / Gelecek Geliştirmeler
- Replace form submissions with Axios-powered API calls for fully async navigation.
- Persist wizard state in localStorage to resume partially completed releases.
- Integrate real-time notifications (Echo) for long-running batch operations.

---

- **EN:** Follow this structure when extending the wizard so all existing release logic stays intact while offering a modern UX.  
- **TR:** Mevcut release mantığını koruyup modern UX sunmak için sihirbazı genişletirken bu yapıya bağlı kalın.
# Spool Release Wizard Specification / Spool Release Sihirbazı Şartnamesi

## 1. Goal / Amaç
- **EN:** Replace the legacy three-column Spool Release screens with a unified, step-by-step wizard that handles selection, validation, release, rollback, and overview actions faster and with a modern UI.
- **TR:** Eski üç sütunlu Spool Release ekranlarını seçim, doğrulama, release, rollback ve özet işlemlerini daha hızlı ve modern bir arayüzle yöneten tekil bir sihirbaz ile değiştirmek.

## 2. File Layout / Dosya Yapısı
- `resources/views/admin/type/spool-release-wizard.blade.php` → Main wrapper (breadcrumb, stepper container, global JS include).
- `resources/views/admin/type/spool-release-wizard/layout/stepper.blade.php` → Step headers + navigation buttons.
- `resources/views/admin/type/spool-release-wizard/steps/*.blade.php` → Individual step content (lazy-loaded via `@includeWhen`).
- `resources/views/admin/type/spool-release-wizard/modals/*.blade.php` → Shared confirmation dialogs (release, rollback, PDF, detail).
- `public/js/spool-release-wizard.js` (or mix asset) → State store, DevExtreme data sources, AJAX POST helpers.

## 3. Wizard Steps / Sihirbaz Adımları
1. **Select Spools / Spool Seçimi**
   - EN: DevExtreme card + pie chart summarizing statuses, grid for filtering ISO/SPL with multi-select (reuses `admin-ajax/spool-list`).
   - TR: Durum özetli grafik + çoklu seçimli grid; seçimler global store’a yazılır.
2. **Review Info / Bilgileri İncele**
   - EN: Weld/Paint info cards, painting cycle badges, PWHT/NDT indicators, checklist upload + SHOP/FIELD toggle.
   - TR: Boya döngüsü, NDT %, PWHT etiketleri ve checklist yükleme alanı gösterilir.
3. **Release Actions / Release İşlemleri**
   - EN: NDT Release & NDT+Paint Release buttons, preview of affected rows, asynchronous execution with progress feedback.
   - TR: Tetikleme sonrası sonuç adetleri toast + activity log’da listelenir.
4. **Rollback & History / Rollback & Geçmiş**
   - EN: Release list datagrid with inline rollback controls, filters by status/date.
   - TR: Toplu rollback için seçilen ISO/SPL state’i kullanılır.
5. **Overview / Genel Bakış**
   - EN: Mini dashboard summarizing Spool Area Release stats; modal can open the full DevExtreme grid for audits.
   - TR: Genel ilerleme kartları ve PDF üretim butonları tek adımda sunulur.

## 4. State Management / Durum Yönetimi
- **EN:** Central `WizardStore` (JavaScript module) keeps `selectedIsos`, `selectedSpools`, `filters`, and `step`.
- **TR:** `WizardStore` seçili ISO/SPL, filtreler ve adım bilgisini saklar; her adım `store.onChange` ile güncellenir.
- **EN:** API calls reuse existing endpoints (`?ajax=spool-list`, `?ajax=spool-area-release`, release querystrings) but triggered via fetch/AJAX POST.
- **TR:** Mevcut endpoint’ler fetch/AJAX ile çağrılır; sayfa yenilenmeden sonuç toplanır.

## 5. Performance Notes / Performans Notları
- Lazy-load heavy grids (Release List, Spool Area) only when their step becomes active.
- Share cached dataset between chart and grid to avoid duplicate requests.
- Use `Promise.all` for parallel data loads (e.g., painting cycles + weld info).
- Debounce filters in selection grid to reduce server load.

## 6. UX Enhancements / UX İyileştirmeleri
- Stepper breadcrumbs with completion ticks.
- Floating action bar for quick release/rollback once prerequisites satisfied.
- Toast + log area showing recent operations (release numbers, rollback summaries).
- Mobile-friendly layout; grids switch to cards under 992px.

## 7. Migration Checklist / Migrasyon Kontrolü
- [ ] Reuse existing helper partials where possible (chart, upload, weld-info) but namespace them under `spool-release-wizard`.
- [ ] Confirm `get_counter` patterns remain unchanged.
- [ ] Ensure rollback + release operations still call `paint-follow-up-updater` inclusions.
- [ ] Verify permissions (`is_stellar()`, `isAuth`) before exposing action buttons.
- [ ] Update menu link to point to wizard once stabilized (separate task).

## 8. Testing / Test
- Selection & navigation across steps.
- Release flow with/without painting cycle.
- Rollback for multiple ISO/SPL.
- Overview stats matching legacy Spool Area Release.
- Responsiveness on tablet/mobile.

---
- **EN:** Once development completes, deprecate legacy pages gradually while keeping endpoints backward-compatible.
- **TR:** Geliştirme tamamlandığında eski ekranlar kademeli olarak devre dışı bırakılır, ancak endpoint’ler geriye dönük uyumluluğu korur.