@extends('adminlte::page')

@section('title', 'Edit Member')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">Edit Member Information</h3>
                    <div class="card-tools">
                        <a href="{{ route('memberships.show', $membership) }}" class="btn btn-info btn-sm">
                            <i class="fas fa-eye"></i> View
                        </a>
                        <a href="{{ route('memberships.index') }}" class="btn btn-secondary btn-sm">
                            <i class="fas fa-arrow-left"></i> Back to Members
                        </a>
                    </div>
                </div>
                <form action="{{ route('memberships.update', $membership) }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @method('PUT')
                    <div class="card-body">
                        <h5 class="mb-3">Personal Information</h5>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="first_name">First Name</label>
                                    <input type="text" name="first_name" id="first_name"
                                           class="form-control @error('first_name') is-invalid @enderror"
                                           value="{{ old('first_name', $membership->user->first_name) }}" required>
                                    @error('first_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="second_name">Second Name</label>
                                    <input type="text" name="second_name" id="second_name"
                                           class="form-control @error('second_name') is-invalid @enderror"
                                           value="{{ old('second_name', $membership->user->second_name) }}" required>
                                    @error('second_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="gender">Gender</label>
                                    <select name="gender" id="gender" class="form-control @error('gender') is-invalid @enderror" required>
                                        <option value="">Select Gender</option>
                                        <option value="male" {{ old('gender', $membership->gender) == 'male' ? 'selected' : '' }}>Male</option>
                                        <option value="female" {{ old('gender', $membership->gender) == 'female' ? 'selected' : '' }}>Female</option>
                                    </select>
                                    @error('gender')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="occupation">Occupation</label>
                                    <select name="occupation" id="occupation" class="form-control @error('occupation') is-invalid @enderror">
                                        <option value="">Select Occupation</option>
                                        @php
                                            $occupations = \App\Models\Occupation::active()->ordered()->get();
                                            $currentOccupation = old('occupation', $membership->occupation);
                                            $isCustom = !empty($currentOccupation) && !$occupations->contains('name', $currentOccupation);
                                        @endphp
                                        @foreach($occupations as $occupationOption)
                                            <option value="{{ $occupationOption->name }}" {{ $currentOccupation == $occupationOption->name ? 'selected' : '' }}>
                                                {{ $occupationOption->name }}
                                            </option>
                                        @endforeach
                                        <option value="other" {{ $isCustom ? 'selected' : '' }}>Other (Specify)</option>
                                    </select>
                                    @error('occupation')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="id_number">ID Number</label>
                                    <input type="text" name="id_number" id="id_number"
                                           class="form-control @error('id_number') is-invalid @enderror"
                                           value="{{ old('id_number', $membership->user->id_number) }}" required>
                                    @error('id_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Custom Occupation Input (shown when "Other" is selected or when editing custom occupation) -->
                        <div class="row" id="custom_occupation_row" style="display: {{ $isCustom ? 'block' : 'none' }};">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="custom_occupation">Specify Occupation</label>
                                    <input type="text" name="custom_occupation" id="custom_occupation"
                                           class="form-control @error('custom_occupation') is-invalid @enderror"
                                           value="{{ old('custom_occupation', $isCustom ? $currentOccupation : '') }}"
                                           placeholder="Enter your occupation">
                                    @error('custom_occupation')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="phone_number">Phone Number</label>
                                    <input type="tel" name="phone_number" id="phone_number"
                                           class="form-control @error('phone_number') is-invalid @enderror"
                                           value="{{ old('phone_number', $membership->user->phone_number) }}" required>
                                    @error('phone_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="email">Email Address</label>
                                    <input type="email" name="email" id="email"
                                           class="form-control @error('email') is-invalid @enderror"
                                           value="{{ old('email', $membership->user->email) }}" required>
                                    @error('email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="password">Login Password</label>
                                    <input type="password" name="password" id="password"
                                           class="form-control @error('password') is-invalid @enderror"
                                           placeholder="Leave empty to keep current password">
                                    @error('password')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    <small class="form-text text-muted">Leave empty to keep current password</small>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="role">User Role</label>
                                    <select name="role" id="role" class="form-control @error('role') is-invalid @enderror" required>
                                        <option value="member" {{ old('role', $membership->user->role) == 'member' ? 'selected' : '' }}>Member</option>
                                        <option value="admin" {{ old('role', $membership->user->role) == 'admin' ? 'selected' : '' }}>Admin</option>
                                        <option value="manager" {{ old('role', $membership->user->role) == 'manager' ? 'selected' : '' }}>Manager</option>
                                    </select>
                                    @error('role')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="branch_id">Branch</label>
                                    <select name="branch_id" id="branch_id" class="form-control @error('branch_id') is-invalid @enderror" required>
                                        <option value="">Select Branch</option>
                                        @foreach($branches as $branch)
                                        <option value="{{ $branch->id }}" {{ old('branch_id', $membership->user->branch_id) == $branch->id ? 'selected' : '' }}>
                                            {{ $branch->name }} - {{ $branch->location }}
                                        </option>
                                        @endforeach
                                    </select>
                                    @error('branch_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="membership_number">Membership Number</label>
                                    <input type="text" name="membership_number" id="membership_number"
                                           class="form-control @error('membership_number') is-invalid @enderror"
                                           value="{{ old('membership_number', $membership->membership_number) }}" required>
                                    @error('membership_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="joining_date">Joining Date</label>
                                    <input type="date" name="joining_date" id="joining_date"
                                           class="form-control @error('joining_date') is-invalid @enderror"
                                           value="{{ old('joining_date', $membership->joining_date->format('Y-m-d')) }}" required>
                                    @error('joining_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="status">Status</label>
                                    <select name="status" id="status" class="form-control @error('status') is-invalid @enderror" required>
                                        <option value="active" {{ old('status', $membership->status) == 'active' ? 'selected' : '' }}>Active</option>
                                        <option value="inactive" {{ old('status', $membership->status) == 'inactive' ? 'selected' : '' }}>Inactive</option>
                                        <option value="suspended" {{ old('status', $membership->status) == 'suspended' ? 'selected' : '' }}>Suspended</option>
                                    </select>
                                    @error('status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="share_capital">Share Capital (KSh)</label>
                                    <input type="number" name="share_capital" id="share_capital" step="0.01" min="0"
                                           class="form-control @error('share_capital') is-invalid @enderror"
                                           value="{{ old('share_capital', $membership->share_capital) }}" required>
                                    @error('share_capital')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="savings_balance">Savings Balance (KSh)</label>
                                    <input type="number" name="savings_balance" id="savings_balance" step="0.01" min="0"
                                           class="form-control @error('savings_balance') is-invalid @enderror"
                                           value="{{ old('savings_balance', $membership->savings_balance) }}" required>
                                    @error('savings_balance')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="registration_fee">Registration Fee (KSh)</label>
                                    <input type="number" name="registration_fee" id="registration_fee" step="0.01" min="0"
                                           class="form-control @error('registration_fee') is-invalid @enderror"
                                           value="{{ old('registration_fee', $membership->registration_fee) }}" required>
                                    @error('registration_fee')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="registration_fee_status">Registration Fee Status</label>
                                    <select name="registration_fee_status" id="registration_fee_status" class="form-control @error('registration_fee_status') is-invalid @enderror" required>
                                        <option value="pending" {{ old('registration_fee_status', $membership->registration_fee_status) == 'pending' ? 'selected' : '' }}>Pending Payment</option>
                                        <option value="paid" {{ old('registration_fee_status', $membership->registration_fee_status) == 'paid' ? 'selected' : '' }}>Paid</option>
                                        <option value="waived" {{ old('registration_fee_status', $membership->registration_fee_status) == 'waived' ? 'selected' : '' }}>Waived</option>
                                    </select>
                                    @error('registration_fee_status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="passport_photo">Passport Photo</label>
                            @if($membership->passport_photo)
                                <div class="mb-2">
                                    <img src="{{ asset('storage/memberships/' . $membership->passport_photo) }}"
                                         alt="Current Photo" class="img-thumbnail" style="max-height: 100px;">
                                    <small class="text-muted d-block">Current photo - upload a new one to replace</small>
                                </div>
                            @endif
                            <div class="input-group">
                                <div class="custom-file">
                                    <input type="file" name="passport_photo" id="passport_photo"
                                           class="custom-file-input @error('passport_photo') is-invalid @enderror"
                                           accept="image/*">
                                    <label class="custom-file-label" for="passport_photo">Choose new passport photo...</label>
                                </div>
                            </div>
                            <small class="form-text text-muted">Upload a clear passport-sized photo (JPEG, PNG, JPG - Max 2MB) - Leave empty to keep current photo</small>
                            @error('passport_photo')
                                <div class="invalid-feedback d-block">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="form-group">
                            <label for="notes">Notes (Optional)</label>
                            <textarea name="notes" id="notes" class="form-control @error('notes') is-invalid @enderror"
                                      rows="3" placeholder="Any additional notes about this member...">{{ old('notes', $membership->notes) }}</textarea>
                            @error('notes')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="card-footer">
                        <button type="submit" class="btn btn-primary">
                            <i class="fas fa-save"></i> Update Member
                        </button>
                        <a href="{{ route('memberships.show', $membership) }}" class="btn btn-secondary">
                            <i class="fas fa-times"></i> Cancel
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Handle occupation dropdown change
    const occupationSelect = document.getElementById('occupation');
    const customOccupationRow = document.getElementById('custom_occupation_row');
    const customOccupationInput = document.getElementById('custom_occupation');

    occupationSelect.addEventListener('change', function() {
        if (this.value === 'other') {
            customOccupationRow.style.display = 'block';
            customOccupationInput.required = true;
            customOccupationInput.focus();
        } else {
            customOccupationRow.style.display = 'none';
            customOccupationInput.required = false;
            customOccupationInput.value = '';
        }
    });

    // Handle form submission for custom occupation
    const form = document.querySelector('form');
    form.addEventListener('submit', function(e) {
        if (occupationSelect.value === 'other' && customOccupationInput.value.trim()) {
            // Set a hidden field to indicate this is a custom occupation
            let customOccupationHidden = document.getElementById('custom_occupation_value');
            if (!customOccupationHidden) {
                customOccupationHidden = document.createElement('input');
                customOccupationHidden.type = 'hidden';
                customOccupationHidden.name = 'custom_occupation_value';
                customOccupationHidden.id = 'custom_occupation_value';
                form.appendChild(customOccupationHidden);
            }
            customOccupationHidden.value = customOccupationInput.value.trim();
        }
    });
});
</script>

@stop