# Layout V2 - Sidebar Navigation

## Tổng quan

Layout V2 là bố cục mới với sidebar navigation thay vì top menu như layout v1. Layout này được thiết kế để dễ dàng chuyển đổi sang làm layout mặc định trong tương lai.

## Cấu trúc

- `app.blade.php` - Layout chính
- `sidebar-navigation.blade.php` - Sidebar với menu dọc
- `breadcrumb.blade.php` - Breadcrumb navigation
- `footer.blade.php` - Footer

## Cách sử dụng

### 1. Sử dụng layout v2 cho view mới

```blade
@extends('layouts-v2.app')

@section('content')
    <!-- Nội dung của bạn -->
@endsection
```

### 2. Truy cập qua route prefix v2

Tất cả routes dưới prefix `/v2` sẽ tự động sử dụng layout v2:

```php
Route::prefix('v2')->middleware(['auth', 'verified'])->name('v2.')->group(function () {
    Route::get('/dashboard', function () {
        return view('dashboard-v2');
    })->name('dashboard');
});
```

### 3. Chuyển view hiện tại sang v2

Đơn giản thay đổi:
```blade
@extends('layouts.app')
```
thành:
```blade
@extends('layouts-v2.app')
```

## Tính năng

- ✅ Sidebar navigation với menu dọc
- ✅ User info section với avatar
- ✅ Tenant switch dropdown (nếu có)
- ✅ Responsive design (mobile-friendly)
- ✅ Menu tự động expand nếu route hiện tại nằm trong submenu
- ✅ Active state cho menu item hiện tại
- ✅ Tương thích với menu structure hiện tại

## CSS & JavaScript

- CSS: `public/css/layout-v2.css`
- JavaScript: `public/js/layout-v2.js`

## Tương thích

- Tương thích với menu structure từ `AppServiceProvider`
- Sử dụng cùng menu data với layout v1
- Hỗ trợ cả dynamic menu (khóa học) và regular menu

## Chuyển đổi sang layout mặc định

Khi muốn chuyển layout v2 thành layout mặc định:

1. Đổi tên `layouts-v2` thành `layouts` (backup `layouts` cũ trước)
2. Update tất cả views từ `layouts.app` sang `layouts-v2.app` (sẽ thành `layouts.app`)
3. Update routes nếu cần
4. Test kỹ lưỡng

## Notes

- Layout v2 giữ nguyên các popup và loading overlay từ layout v1
- Footer và breadcrumb có thể customize riêng
- Sidebar có thể collapse trên mobile (tính năng sắp tới)