# Hierarchical Access Assignment Module

## Overview
This module provides a UI for assigning employees to different access levels (State, Zone, or School) for data access control in a hierarchical system.

## Features
- **State Level Access**: Grant access to all data within a selected state
- **Zone Level Access**: Grant access to all data within a selected zone
- **School Level Access**: Grant access to data for a specific school only
- **Hierarchical Logic**: Selecting a higher level automatically enables lower levels
- **Dynamic Dropdowns**: Zones load based on selected state, schools load based on selected zone

## Files Created

### 1. Blade Component
**Location**: `resources/views/partials/hierarchical-access-assignment.blade.php`

This is a reusable Blade component that can be included in any Laravel view.

#### Usage in Blade Templates

```blade
@include('partials.hierarchical-access-assignment', [
    'states' => $states,
    'zones' => $zones,
    'schools' => $schools,
    'employee' => $employee,
    'oldStateId' => old('state_id'),
    'oldZoneId' => old('zone_id'),
    'oldSchoolId' => old('school_id'),
    'assignStateChecked' => old('assign_state') || (isset($employee) && $employee->state_id),
    'assignZoneChecked' => old('assign_zone') || (isset($employee) && $employee->zone_id),
    'assignSchoolChecked' => old('assign_school') || (isset($employee) && $employee->school_id),
])
```

#### Props
- `states` (array): Collection of state objects with id and name
- `zones` (array): Collection of zone objects with id and name
- `schools` (array): Collection of school objects with id and name
- `employee` (object|null): Employee object for edit mode (optional)
- `oldStateId` (int|null): Previously selected state ID
- `oldZoneId` (int|null): Previously selected zone ID
- `oldSchoolId` (int|null): Previously selected school ID
- `assignStateChecked` (bool): Whether state checkbox should be checked
- `assignZoneChecked` (bool): Whether zone checkbox should be checked
- `assignSchoolChecked` (bool): Whether school checkbox should be checked

### 2. Standalone HTML File
**Location**: `public/hierarchical-access-assignment.html`

This is a complete, standalone HTML file that can be used independently of the Laravel application. It includes:
- Tailwind CSS via CDN
- Font Awesome icons via CDN
- Sample data for demonstration
- Full JavaScript functionality

#### Usage
Simply open the HTML file in a web browser:
```
http://localhost/hierarchical-access-assignment.html
```

Or serve it through your web server.

## UI Components

### Header
- Title: "Hierarchical Access Assignment"
- Description: "Assign employee to State, Zone, and/or School for data access control"

### Access Level Guide
A light purple box containing:
- Three bullet points explaining access levels
- An informational note about hierarchical inclusion

### Access Assignment Sections

#### 1. Assign State Access
- Checkbox: "Assign State Access"
- Dropdown: "Select State"
- Color theme: Blue

#### 2. Assign Zone Access
- Checkbox: "Assign Zone Access"
- Dropdown: "Select Zone"
- Color theme: Green

#### 3. Assign School Access
- Checkbox: "Assign School Access"
- Dropdown: "Select School"
- Color theme: Purple

## JavaScript Functionality

### toggleHierarchicalAccess(level)
Handles checkbox toggling and enables/disables dropdowns based on hierarchical logic.

**Parameters:**
- `level`: 'state', 'zone', or 'school'

**Behavior:**
- When State is unchecked: Disables Zone and School options
- When Zone is unchecked: Disables School option
- When a checkbox is checked: Enables corresponding dropdown

### loadZonesByState(stateId)
Loads zones based on selected state (requires API endpoint).

**Parameters:**
- `stateId`: ID of the selected state

**API Endpoint Required:**
```
GET /api/zones/by-state/{stateId}
```

**Response Format:**
```json
{
    "zones": [
        {"id": 1, "name": "Zone A"},
        {"id": 2, "name": "Zone B"}
    ]
}
```

### loadServicesByZone(zoneId)
Loads schools based on selected zone (requires API endpoint).

**Parameters:**
- `zoneId`: ID of the selected zone

**API Endpoint Required:**
```
GET /api/schools/by-zone/{zoneId}
```

**Response Format:**
```json
{
    "schools": [
        {"id": 1, "name": "School A"},
        {"id": 2, "name": "School B"}
    ]
}
```

## Integration with Existing Code

### Controller Example
```php
public function create()
{
    $states = State::where('status', 1)->get();
    $zones = Zone::where('status', 1)->get();
    $schools = Service::where('status', 1)->get();
    
    return view('employees.create', compact('states', 'zones', 'schools'));
}
```

### Route Requirements (for Blade component)
Add these routes to your API routes file (`routes/api.php`):

```php
Route::get('/zones/by-state/{stateId}', [ZoneController::class, 'getByState']);
Route::get('/schools/by-zone/{zoneId}', [ServiceController::class, 'getByZone']);
```

### Controller Methods for API
```php
// ZoneController.php
public function getByState($stateId)
{
    $zones = Zone::where('state_id', $stateId)
                 ->where('status', 1)
                 ->get(['id', 'name']);
    
    return response()->json(['zones' => $zones]);
}

// ServiceController.php
public function getByZone($zoneId)
{
    $schools = Service::where('zone_id', $zoneId)
                      ->where('status', 1)
                      ->get(['id', 'name']);
    
    return response()->json(['schools' => $schools]);
}
```

## Styling

The module uses Tailwind CSS for styling with the following color scheme:
- **State Level**: Blue (`bg-blue-100`, `text-blue-600`)
- **Zone Level**: Green (`bg-green-100`, `text-green-600`)
- **School Level**: Purple (`bg-purple-100`, `text-purple-600`)
- **Guide Box**: Purple (`bg-purple-50`, `border-purple-200`)

## Accessibility
- All form elements have proper labels
- Disabled states are visually indicated
- Color coding is supplemented with icons
- Keyboard navigation is supported

## Browser Compatibility
- Modern browsers (Chrome, Firefox, Safari, Edge)
- Requires JavaScript enabled
- Tailwind CSS 3.x
- Font Awesome 6.x

## Demo Data (Standalone HTML)
The standalone HTML file includes sample data for demonstration:
- 5 States (Maharashtra, Karnataka, Tamil Nadu, Delhi, Gujarat)
- Multiple zones per state
- Multiple schools per zone

## Notes
- The module follows the existing Laravel project structure
- It integrates with the existing hierarchical access implementation
- The Blade component uses Laravel's old() helper for form repopulation
- The standalone HTML version uses simulated data and API calls