@extends('layouts.app')

@section('page-title', 'Add Gym')

@section('content')
<div class="row">
    <div class="col-xl-12">
        <div class="card">
            <div class="card-header border-0 pb-0">
                <h4 class="card-title mb-0">Add New Gym</h4>
            </div>
            <div class="card-body">
                <form action="{{ route('gyms.store') }}" method="POST">
                    @csrf
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label required">Gym Name</label>
                            <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="Enter Gym Name" value="{{ old('name') }}" required>
                            @error('name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Address</label>
                            <input type="text" name="address" class="form-control @error('address') is-invalid @enderror" placeholder="Enter Full Address" value="{{ old('address') }}">
                            @error('address')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">City</label>
                            <input type="text" name="city" class="form-control @error('city') is-invalid @enderror" placeholder="Enter City" value="{{ old('city') }}">
                            @error('city')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Opening Time</label>
                            <input type="time" name="opening_time" class="form-control @error('opening_time') is-invalid @enderror" value="{{ old('opening_time') }}">
                            @error('opening_time')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Closing Time</label>
                            <input type="time" name="closing_time" class="form-control @error('closing_time') is-invalid @enderror" value="{{ old('closing_time') }}">
                            @error('closing_time')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label required">Payment Type</label>
                            <select name="payment_type" id="payment_type" class="form-select @error('payment_type') is-invalid @enderror" required>
                                <option value="">Select Payment Type</option>
                                <option value="bought" {{ old('payment_type') == 'bought' ? 'selected' : '' }}>Bought</option>
                                <option value="rent" {{ old('payment_type') == 'rent' ? 'selected' : '' }}>Rent</option>
                            </select>
                            @error('payment_type')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3" id="rent_amount_field" style="display: none;">
                            <label class="form-label">Rent Amount</label>
                            <input type="number" name="rent_amount" class="form-control @error('rent_amount') is-invalid @enderror" placeholder="Enter Rent Amount" value="{{ old('rent_amount') }}" step="0.01" min="0">
                            @error('rent_amount')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Phone Number</label>
                            <input type="text" name="phone" class="form-control @error('phone') is-invalid @enderror" placeholder="Enter Phone Number" value="{{ old('phone') }}">
                            @error('phone')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Additional Phone Number</label>
                            <input type="text" name="additional_phone" class="form-control @error('additional_phone') is-invalid @enderror" placeholder="Enter Additional Phone Number" value="{{ old('additional_phone') }}">
                            @error('additional_phone')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label required">Email (Login Email)</label>
                            <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="Enter Email" value="{{ old('email') }}" required>
                            <small class="form-text text-muted">This email will be used for gym owner login</small>
                            @error('email')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Password</label>
                            <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="Leave blank to auto-generate" minlength="8">
                            <small class="form-text text-muted">Leave blank to auto-generate a secure password</small>
                            @error('password')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Status</label>
                            <select name="is_active" class="form-select @error('is_active') is-invalid @enderror">
                                <option value="1" {{ old('is_active', 1) == 1 ? 'selected' : '' }}>Active</option>
                                <option value="0" {{ old('is_active') == 0 ? 'selected' : '' }}>Inactive</option>
                            </select>
                            @error('is_active')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-12 mb-3">
                            <div class="form-check">
                                <input type="hidden" name="attendance_enabled" value="0">
                                <input class="form-check-input @error('attendance_enabled') is-invalid @enderror" type="checkbox" name="attendance_enabled" id="attendance_enabled" value="1" {{ old('attendance_enabled') ? 'checked' : '' }}>
                                <label class="form-check-label" for="attendance_enabled">
                                    <strong>Enable Attendance Module</strong>
                                </label>
                                <small class="form-text text-muted d-block">Check this box to enable the attendance module for this gym. The attendance menu will appear in the sidebar for gym owner and receptionist.</small>
                                @error('attendance_enabled')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-12">
                            <hr class="my-4">
                            <h5 class="mb-3">Payment Information (Optional)</h5>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Bank Account Number</label>
                            <input type="text" name="bank_account_number" class="form-control @error('bank_account_number') is-invalid @enderror" placeholder="Enter Bank Account Number" value="{{ old('bank_account_number') }}">
                            @error('bank_account_number')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Bank Account Name</label>
                            <input type="text" name="bank_account_name" class="form-control @error('bank_account_name') is-invalid @enderror" placeholder="Enter Bank Account Name" value="{{ old('bank_account_name') }}">
                            @error('bank_account_name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Easypaisa Number</label>
                            <input type="text" name="easypaisa_number" class="form-control @error('easypaisa_number') is-invalid @enderror" placeholder="Enter Easypaisa Number" value="{{ old('easypaisa_number') }}">
                            @error('easypaisa_number')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Easypaisa Name</label>
                            <input type="text" name="easypaisa_name" class="form-control @error('easypaisa_name') is-invalid @enderror" placeholder="Enter Easypaisa Account Name" value="{{ old('easypaisa_name') }}">
                            @error('easypaisa_name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">JazzCash Number</label>
                            <input type="text" name="jazzcash_number" class="form-control @error('jazzcash_number') is-invalid @enderror" placeholder="Enter JazzCash Number" value="{{ old('jazzcash_number') }}">
                            @error('jazzcash_number')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">JazzCash Name</label>
                            <input type="text" name="jazzcash_name" class="form-control @error('jazzcash_name') is-invalid @enderror" placeholder="Enter JazzCash Account Name" value="{{ old('jazzcash_name') }}">
                            @error('jazzcash_name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="card-footer justify-content-end">
                        <a href="{{ route('gyms.index') }}" class="btn btn-danger light">Cancel</a>
                        <button type="submit" class="btn btn-primary">Create Gym</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const paymentType = document.getElementById('payment_type');
        const rentAmountField = document.getElementById('rent_amount_field');
        
        function toggleRentAmount() {
            if (paymentType.value === 'rent') {
                rentAmountField.style.display = 'block';
                rentAmountField.querySelector('input').setAttribute('required', 'required');
            } else {
                rentAmountField.style.display = 'none';
                rentAmountField.querySelector('input').removeAttribute('required');
                rentAmountField.querySelector('input').value = '';
            }
        }
        
        paymentType.addEventListener('change', toggleRentAmount);
        
        // Check on page load if there's an old value
        if (paymentType.value === 'rent') {
            toggleRentAmount();
        }
    });
</script>
@endpush