@section('title', 'Brand Branches')

<div>
    <div class="row">
         <!-- Branch List -->
         <div class="col-12 mb-4">
             <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h5>Current Branches</h5>
                    <button class="btn btn-primary btn-sm" wire:click="resetForm">{{ $editMode ? 'Cancel Edit' : 'Add New Branch' }}</button>
                </div>
                <div class="card-body">
                    @if (session()->has('message'))
                        <div class="alert alert-success">{{ session('message') }}</div>
                    @endif

                    <div class="table-responsive">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th>Branch Name</th>
                                    <th>Province / Area</th>
                                    <th>Mobile</th>
                                    <th>Address</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($branches as $branch)
                                    <tr>
                                        <td>{{ $branch->branch_name_en }} <br> <small class="text-muted">{{ $branch->branch_name_ar }}</small></td>
                                        <td>{{ $branch->province->province_name_en ?? '-' }} / {{ $branch->area->area_name_en ?? '-' }}</td>
                                        <td>{{ $branch->branch_mobile_1 }}</td>
                                        <td>{{ Str::limit($branch->branch_address_en, 30) }}</td>
                                        <td>
                                            <button class="btn btn-info btn-sm" wire:click="edit({{ $branch->brands_branches_id }})">Edit</button>
                                            <button class="btn btn-danger btn-sm" wire:click="delete({{ $branch->brands_branches_id }})" onclick="return confirm('Delete this branch?')">Delete</button>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                     <div class="mt-3">
                        <a href="{{ route('data-entry.dashboard', $brandId) }}" class="btn btn-secondary">Back to Dashboard</a>
                    </div>
                </div>
            </div>
         </div>

         <!-- Create/Edit Form -->
         <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5>{{ $editMode ? 'Edit Branch' : 'Create New Branch' }}</h5>
                </div>
                <div class="card-body">
                    <form wire:submit.prevent="save">
                        <div class="row">
                            <!-- Name EN -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Branch Name (EN)</label>
                                <input type="text" class="form-control" wire:model.live="branch_name_en">
                                @error('branch_name_en') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                             <!-- Name AR -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Branch Name (AR)</label>
                                <input type="text" class="form-control" wire:model.live="branch_name_ar">
                                @error('branch_name_ar') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                             <!-- Province -->
                             <div class="col-md-6 mb-3">
                                <label class="form-label">Province</label>
                                <select class="form-select" wire:model.live="branch_province_id">
                                    <option value="">Select Province</option>
                                    @foreach($provinces as $prov)
                                        <option value="{{ $prov->provinces_id }}">{{ $prov->province_name_en }}</option>
                                    @endforeach
                                </select>
                                @error('branch_province_id') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                             <!-- Area -->
                             <div class="col-md-6 mb-3">
                                <label class="form-label">Area</label>
                                <select class="form-select" wire:model.live="branch_area_id">
                                    <option value="">Select Area</option>
                                    @foreach($areas as $area)
                                        <option value="{{ $area->areas_id }}">{{ $area->area_name_en }}</option>
                                    @endforeach
                                </select>
                                @error('branch_area_id') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                            <!-- User Name -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Branch Username</label>
                                <input type="text" class="form-control" wire:model.live="branch_user_name">
                                @error('branch_user_name') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                            <!-- Password -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Password {{ $editMode ? '(Leave blank to keep current)' : '' }}</label>
                                <input type="password" class="form-control" wire:model.live="branch_login_password">
                                @error('branch_login_password') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                            <!-- Mobile 1 -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Mobile 1</label>
                                <input type="text" class="form-control" wire:model.live="branch_mobile_1">
                                @error('branch_mobile_1') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                            <!-- Mobile 2 -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Mobile 2</label>
                                <input type="text" class="form-control" wire:model.live="branch_mobile_2">
                                @error('branch_mobile_2') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                            <!-- Address EN -->
                             <div class="col-12 mb-3">
                                <label class="form-label">Address (EN)</label>
                                <textarea class="form-control" rows="2" wire:model.live="branch_address_en"></textarea>
                                @error('branch_address_en') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                             <!-- Address AR -->
                             <div class="col-12 mb-3">
                                <label class="form-label">Address (AR)</label>
                                <textarea class="form-control" rows="2" wire:model.live="branch_address_ar"></textarea>
                                @error('branch_address_ar') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>

                             <!-- Location (Google Maps Link) -->
                             <div class="col-12 mb-3">
                                <label class="form-label">Google Maps Location Link (Optional)</label>
                                <input type="text" class="form-control" wire:model.live="branch_location">
                            </div>
                            
                            <!-- Visibility/Status -->
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Status (Visible)</label>
                                <select class="form-select" wire:model.live="visible">
                                    <option value="1">Active</option>
                                    <option value="0">Hidden</option>
                                </select>
                            </div>
                        </div>

                        <div class="mt-3">
                             <button type="submit" class="btn btn-success">{{ $editMode ? 'Update Function Branch' : 'Create Function Branch' }}</button>
                             <button type="button" class="btn btn-secondary" wire:click="cancel">Cancel</button>
                        </div>
                    </form>
                </div>
            </div>
         </div>
    </div>
</div>