@extends('layouts.app')

@section('title', 'Create Collector Collection & Deposit')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title">Create New Collector Collection & Deposit</h3>
                    <a href="{{ route('collector-deposits.index') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left"></i> Back to List
                    </a>
                </div>

                <div class="card-body">
                    <form action="{{ route('collector-deposits.store') }}" method="POST">
                        @csrf
                        
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="collector_id" class="form-label">Collector <span class="text-danger">*</span></label>
                                    @if($currentUser->role === 'collector')
                                        <!-- Auto-selected for collectors -->
                                        <div class="form-control-plaintext bg-light p-3 rounded border">
                                            <div class="d-flex align-items-center">
                                                <i class="fas fa-user-check text-success mr-2"></i>
                                                <div>
                                                    <strong>{{ $currentUser->name }}</strong>
                                                    <small class="text-muted d-block">({{ $currentUser->employeeRecord->employee_id ?? 'N/A' }}) - {{ $currentUser->role }}</small>
                                                </div>
                                            </div>
                                        </div>
                                        <input type="hidden" name="collector_id" value="{{ $currentUser->id }}">
                                    @else
                                        <!-- Dropdown for managers/admins -->
                                        <select name="collector_id" id="collector_id" class="form-select @error('collector_id') is-invalid @enderror" required>
                                            <option value="">Select Collector</option>
                                            @foreach($collectors as $collector)
                                                <option value="{{ $collector->id }}" 
                                                    {{ old('collector_id') == $collector->id ? 'selected' : '' }}>
                                                    {{ $collector->name }} ({{ $collector->employeeRecord->employee_id ?? 'N/A' }})
                                                </option>
                                            @endforeach
                                        </select>
                                    @endif
                                    @error('collector_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="amount" class="form-label">Amount (৳) <span class="text-danger">*</span></label>
                                    <input type="number" name="amount" id="amount" 
                                           class="form-control @error('amount') is-invalid @enderror" 
                                           value="{{ old('amount') }}" step="0.01" min="0.01" required>
                                    @error('amount')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="deposit_date" class="form-label">Deposit Date <span class="text-danger">*</span></label>
                                    <input type="date" name="deposit_date" id="deposit_date" 
                                           class="form-control @error('deposit_date') is-invalid @enderror" 
                                           value="{{ old('deposit_date', date('Y-m-d')) }}" required>
                                    @error('deposit_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="method" class="form-label">Payment Method</label>
                                    <select name="method" id="method" class="form-select @error('method') is-invalid @enderror">
                                        <option value="">Select Method</option>
                                        <option value="cash" {{ old('method') == 'cash' ? 'selected' : '' }}>Cash</option>
                                        <option value="bkash" {{ old('method') == 'bkash' ? 'selected' : '' }}>bKash</option>
                                        <option value="nagad" {{ old('method') == 'nagad' ? 'selected' : '' }}>Nagad</option>
                                        <option value="rocket" {{ old('method') == 'rocket' ? 'selected' : '' }}>Rocket</option>
                                        <option value="bank_transfer" {{ old('method') == 'bank_transfer' ? 'selected' : '' }}>Bank Transfer</option>
                                        <option value="check" {{ old('method') == 'check' ? 'selected' : '' }}>Check</option>
                                        <option value="other" {{ old('method') == 'other' ? 'selected' : '' }}>Other</option>
                                    </select>
                                    @error('method')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="received_by" class="form-label">Received By</label>
                                    @if($currentUser->role === 'collector')
                                        <!-- For collectors, show null/empty -->
                                        <div class="form-control-plaintext bg-light p-3 rounded border">
                                            <div class="d-flex align-items-center">
                                                <i class="fas fa-question-circle text-muted mr-2"></i>
                                                <div>
                                                    <span class="text-muted">Not specified</span>
                                                    <small class="text-muted d-block">Will be set by manager/admin</small>
                                                </div>
                                            </div>
                                        </div>
                                        <input type="hidden" name="received_by" value="">
                                    @else
                                        <!-- For managers/admins, show current user -->
                                        <div class="form-control-plaintext bg-light p-3 rounded border">
                                            <div class="d-flex align-items-center">
                                                <i class="fas fa-user-check text-primary mr-2"></i>
                                                <div>
                                                    <strong>{{ $currentUser->name }}</strong>
                                                    <small class="text-muted d-block">({{ $currentUser->employeeRecord->employee_id ?? 'N/A' }}) - {{ $currentUser->role }}</small>
                                                </div>
                                            </div>
                                        </div>
                                        <input type="hidden" name="received_by" value="{{ $currentUser->id }}">
                                    @endif
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="reference_note" class="form-label">Reference Note</label>
                                    <textarea name="reference_note" id="reference_note" rows="3" 
                                              class="form-control @error('reference_note') is-invalid @enderror" 
                                              placeholder="Any additional notes or reference information">{{ old('reference_note') }}</textarea>
                                    @error('reference_note')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-12">
                                <div class="d-flex justify-content-end gap-2">
                                    <a href="{{ route('collector-deposits.index') }}" class="btn btn-secondary">
                                        <i class="fas fa-times"></i> Cancel
                                    </a>
                                    <button type="submit" class="btn btn-primary">
                                        <i class="fas fa-save"></i> Create Deposit
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Set today's date as default
    const today = new Date().toISOString().split('T')[0];
    document.getElementById('deposit_date').value = today;
});
</script>
@endpush