<!-- resources/views/accounting/budgets/index.blade.php -->
@extends('layouts.accounting')

@section('accounting-title', 'বাজেট ব্যবস্থাপনা')

@section('accounting-buttons')
<div class="btn-group me-2">
    <a href="{{ route('accounting.budgets.create') }}" class="btn btn-sm btn-primary">
        <i class="fas fa-plus"></i> নতুন বাজেট
    </a>
    <button type="button" class="btn btn-sm btn-outline-success" onclick="generateNextYearBudget()">
        <i class="fas fa-forward"></i> পরবর্তী বছর
    </button>
    <button type="button" class="btn btn-sm btn-outline-secondary" onclick="printBudget()">
        <i class="fas fa-print"></i> প্রিন্ট
    </button>
</div>
@endsection

@section('accounting-content')
<!-- Budget Summary Cards -->
<div class="row mb-4">
    <div class="col-md-3">
        <div class="card text-white bg-primary">
            <div class="card-body">
                <h6 class="card-title">এই বছরের বাজেট</h6>
                <h3 class="card-text">৳ {{ number_format($currentYearBudget, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-success">
            <div class="card-body">
                <h6 class="card-title">বাস্তবায়িত</h6>
                <h3 class="card-text">৳ {{ number_format($actualSpending, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-warning">
            <div class="card-body">
                <h6 class="card-title">বাকি বাজেট</h6>
                <h3 class="card-text">৳ {{ number_format($remainingBudget, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card text-white bg-info">
            <div class="card-body">
                <h6 class="card-title">ব্যবহার হার</h6>
                <h3 class="card-text">{{ number_format($utilizationRate, 1) }}%</h3>
            </div>
        </div>
    </div>
</div>

<!-- Budget List -->
<div class="card">
    <div class="card-header">
        <div class="d-flex justify-content-between align-items-center">
            <h5 class="card-title mb-0">বাজেটের তালিকা</h5>
            <div class="btn-group">
                <button class="btn btn-sm btn-outline-primary" data-bs-toggle="collapse" data-bs-target="#filterSection">
                    <i class="fas fa-filter"></i> ফিল্টার
                </button>
            </div>
        </div>
    </div>
    
    <!-- Filter Section -->
    <div class="collapse" id="filterSection">
        <div class="card-body border-bottom">
            <form method="GET" class="row g-3">
                <div class="col-md-3">
                    <label for="fiscal_year" class="form-label">অর্থবছর</label>
                    <select class="form-select" id="fiscal_year" name="fiscal_year">
                        <option value="">সকল বছর</option>
                        @foreach($fiscalYears as $year)
                            <option value="{{ $year }}" {{ request('fiscal_year') == $year ? 'selected' : '' }}>
                                {{ $year }}-{{ $year + 1 }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <label for="department" class="form-label">বিভাগ</label>
                    <select class="form-select" id="department" name="department">
                        <option value="">সকল বিভাগ</option>
                        @foreach($departments as $dept)
                            <option value="{{ $dept }}" {{ request('department') == $dept ? 'selected' : '' }}>
                                {{ $dept }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <label for="status" class="form-label">অবস্থা</label>
                    <select class="form-select" id="status" name="status">
                        <option value="">সকল</option>
                        <option value="draft" {{ request('status') == 'draft' ? 'selected' : '' }}>খসড়া</option>
                        <option value="approved" {{ request('status') == 'approved' ? 'selected' : '' }}>অনুমোদিত</option>
                        <option value="active" {{ request('status') == 'active' ? 'selected' : '' }}>সক্রিয়</option>
                        <option value="completed" {{ request('status') == 'completed' ? 'selected' : '' }}>সম্পন্ন</option>
                    </select>
                </div>
                <div class="col-md-3 d-flex align-items-end">
                    <button type="submit" class="btn btn-primary w-100">
                        <i class="fas fa-search"></i> খুঁজুন
                    </button>
                </div>
            </form>
        </div>
    </div>
    
    <div class="card-body">
        @if($budgets->isEmpty())
            <div class="alert alert-info">
                <i class="fas fa-info-circle"></i> কোনো বাজেট পাওয়া যায়নি।
                <a href="{{ route('accounting.budgets.create') }}" class="alert-link">নতুন বাজেট তৈরি করুন</a>
            </div>
        @else
            <div class="table-responsive">
                <table class="table table-bordered table-hover" id="budgetsTable">
                    <thead class="table-light">
                        <tr>
                            <th width="5%">#</th>
                            <th width="15%">বাজেট কোড</th>
                            <th>বাজেটের নাম</th>
                            <th width="10%">অর্থবছর</th>
                            <th width="15%" class="text-end">বাজেট পরিমাণ</th>
                            <th width="15%" class="text-end">ব্যয়</th>
                            <th width="10%">অবস্থা</th>
                            <th width="15%">অ্যাকশন</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($budgets as $budget)
                            @php
                                $spent = $budget->getSpentAmount();
                                $remaining = $budget->amount - $spent;
                                $percentage = $budget->amount > 0 ? ($spent / $budget->amount) * 100 : 0;
                            @endphp
                            <tr>
                                <td>{{ $loop->iteration }}</td>
                                <td><strong>{{ $budget->budget_code }}</strong></td>
                                <td>
                                    {{ $budget->name }}
                                    @if($budget->description)
                                        <br><small class="text-muted">{{ Str::limit($budget->description, 50) }}</small>
                                    @endif
                                </td>
                                <td>{{ $budget->fiscal_year }}-{{ $budget->fiscal_year + 1 }}</td>
                                <td class="text-end">
                                    <strong>৳ {{ number_format($budget->amount, 2) }}</strong>
                                </td>
                                <td class="text-end">
                                    <div class="d-flex flex-column">
                                        <span class="text-danger">৳ {{ number_format($spent, 2) }}</span>
                                        <div class="progress" style="height: 5px;">
                                            <div class="progress-bar {{ $percentage > 100 ? 'bg-danger' : ($percentage > 80 ? 'bg-warning' : 'bg-success') }}" 
                                                 role="progressbar" style="width: {{ min($percentage, 100) }}%"></div>
                                        </div>
                                        <small class="text-muted">{{ number_format($percentage, 1) }}% ব্যবহৃত</small>
                                    </div>
                                </td>
                                <td>
                                    @if($budget->status == 'draft')
                                        <span class="badge bg-secondary">
                                            <i class="fas fa-pen"></i> খসড়া
                                        </span>
                                    @elseif($budget->status == 'approved')
                                        <span class="badge bg-warning text-dark">
                                            <i class="fas fa-check-circle"></i> অনুমোদিত
                                        </span>
                                    @elseif($budget->status == 'active')
                                        <span class="badge bg-success">
                                            <i class="fas fa-play-circle"></i> সক্রিয়
                                        </span>
                                    @else
                                        <span class="badge bg-info">
                                            <i class="fas fa-flag-checkered"></i> সম্পন্ন
                                        </span>
                                    @endif
                                </td>
                                <td>
                                    <div class="btn-group btn-group-sm" role="group">
                                        <a href="{{ route('accounting.budgets.show', $budget->id) }}" 
                                           class="btn btn-info" title="দেখুন">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                        <a href="{{ route('accounting.budgets.edit', $budget->id) }}" 
                                           class="btn btn-warning {{ $budget->status == 'active' ? 'disabled' : '' }}" 
                                           title="সম্পাদনা">
                                            <i class="fas fa-edit"></i>
                                        </a>
                                        @if($budget->status == 'draft')
                                            <form action="{{ route('accounting.budgets.update', $budget->id) }}" 
                                                  method="POST" style="display: inline;">
                                                @csrf
                                                @method('PUT')
                                                <input type="hidden" name="status" value="approved">
                                                <button type="submit" class="btn btn-success" 
                                                        title="অনুমোদন করুন">
                                                    <i class="fas fa-check"></i>
                                                </button>
                                            </form>
                                        @endif
                                        <form action="{{ route('accounting.budgets.destroy', $budget->id) }}" 
                                              method="POST" style="display: inline;">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-danger" 
                                                    title="মুছে ফেলুন"
                                                    onclick="return confirm('আপনি কি এই বাজেটটি মুছে ফেলতে চান?')">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot class="table-light">
                        <tr>
                            <td colspan="4" class="text-end"><strong>মোট:</strong></td>
                            <td class="text-end">
                                <strong>৳ {{ number_format($budgets->sum('amount'), 2) }}</strong>
                            </td>
                            <td class="text-end">
                                <strong class="text-danger">৳ {{ number_format($totalSpent, 2) }}</strong>
                            </td>
                            <td colspan="2"></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            
            <div class="d-flex justify-content-between align-items-center mt-3">
                <div class="text-muted">
                    মোট বাজেট: {{ $budgets->total() }}
                </div>
                <div>
                    {{ $budgets->links() }}
                </div>
            </div>
        @endif
    </div>
</div>

<!-- Budget vs Actual Chart -->
<div class="card mt-4">
    <div class="card-header">
        <h5 class="card-title mb-0">
            <i class="fas fa-chart-bar"></i> বাজেট বনাম বাস্তব ব্যয়
        </h5>
    </div>
    <div class="card-body">
        <canvas id="budgetChart" height="100"></canvas>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
function printBudget() {
    window.print();
}

function generateNextYearBudget() {
    if (confirm('আপনি কি পরবর্তী অর্থবছরের জন্য বাজেট তৈরি করতে চান?')) {
        // Implement budget generation logic
        alert('পরবর্তী বছরের বাজেট তৈরি করা হচ্ছে...');
    }
}

// Budget vs Actual Chart
document.addEventListener('DOMContentLoaded', function() {
    const ctx = document.getElementById('budgetChart').getContext('2d');
    
    // Sample data - replace with actual data from controller
    const budgetChart = new Chart(ctx, {
        type: 'bar',
        data: {
            labels: ['জানু', 'ফেব্রু', 'মার্চ', 'এপ্রিল', 'মে', 'জুন', 
                     'জুলাই', 'আগস্ট', 'সেপ্ট', 'অক্টো', 'নভে', 'ডিসে'],
            datasets: [{
                label: 'বাজেট',
                data: [50000, 60000, 70000, 80000, 75000, 90000, 
                       85000, 92000, 88000, 95000, 98000, 100000],
                backgroundColor: 'rgba(54, 162, 235, 0.5)',
                borderColor: 'rgba(54, 162, 235, 1)',
                borderWidth: 1
            }, {
                label: 'বাস্তব ব্যয়',
                data: [45000, 55000, 65000, 78000, 72000, 85000, 
                       82000, 90000, 86000, 92000, 95000, 98000],
                backgroundColor: 'rgba(255, 99, 132, 0.5)',
                borderColor: 'rgba(255, 99, 132, 1)',
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            plugins: {
                legend: {
                    position: 'top',
                },
                title: {
                    display: true,
                    text: 'মাসিক বাজেট বনাম বাস্তব ব্যয়'
                }
            },
            scales: {
                y: {
                    beginAtZero: true,
                    ticks: {
                        callback: function(value) {
                            return '৳ ' + value.toLocaleString();
                        }
                    }
                }
            }
        }
    });
});
</script>

<style>
@media print {
    .btn, .modal, .navbar, .progress, canvas {
        display: none !important;
    }
}
</style>
@endsection