@extends('admin.layouts.app')

@section('title', 'گزارشات')

@section('content')
<div class="card mb-4">
    <div class="card-header">
        <h5 class="mb-0">تولید گزارش</h5>
    </div>

    <div class="card-body">
        <form method="GET" action="{{ route('admin.reports.generate') }}" id="reportForm">
            <div class="row g-3">
                <!-- Report Type -->
                <div class="col-md-3">
                    <label for="report_type" class="form-label">نوع گزارش</label>
                    <select name="report_type" id="report_type" class="form-select" required>
                        <option value="">انتخاب کنید</option>
                        <option value="loads" {{ request('report_type') === 'loads' ? 'selected' : '' }}>گزارش بارها</option>
                        <option value="revenue" {{ request('report_type') === 'revenue' ? 'selected' : '' }}>گزارش درآمد</option>
                        <option value="drivers" {{ request('report_type') === 'drivers' ? 'selected' : '' }}>گزارش رانندگان</option>
                        <option value="customers" {{ request('report_type') === 'customers' ? 'selected' : '' }}>گزارش مشتریان</option>
                        <option value="performance" {{ request('report_type') === 'performance' ? 'selected' : '' }}>گزارش عملکرد</option>
                        <option value="accounting" {{ request('report_type') === 'accounting' ? 'selected' : '' }}>گزارش حسابداری</option>
                    </select>
                </div>

                <!-- Date Range -->
                <div class="col-md-2">
                    <label for="from_date" class="form-label">از تاریخ</label>
                    <input type="text" name="from_date" id="from_date" class="form-control persian-datepicker" value="{{ request('from_date') }}" required>
                </div>

                <div class="col-md-2">
                    <label for="to_date" class="form-label">تا تاریخ</label>
                    <input type="text" name="to_date" id="to_date" class="form-control persian-datepicker" value="{{ request('to_date') }}" required>
                </div>

                <!-- Group By -->
                <div class="col-md-2">
                    <label for="group_by" class="form-label">گروه‌بندی</label>
                    <select name="group_by" id="group_by" class="form-select">
                        <option value="day" {{ request('group_by') === 'day' ? 'selected' : '' }}>روزانه</option>
                        <option value="week" {{ request('group_by') === 'week' ? 'selected' : '' }}>هفتگی</option>
                        <option value="month" {{ request('group_by') === 'month' ? 'selected' : '' }}>ماهانه</option>
                        <option value="year" {{ request('group_by') === 'year' ? 'selected' : '' }}>سالانه</option>
                    </select>
                </div>

                <!-- Actions -->
                <div class="col-md-3">
                    <label class="form-label d-block">&nbsp;</label>
                    <button type="submit" class="btn btn-primary me-2">
                        <i class="fas fa-chart-bar me-2"></i>
                        تولید گزارش
                    </button>
                    <button type="button" class="btn btn-success" onclick="exportToExcel()">
                        <i class="fas fa-file-excel me-2"></i>
                        Excel
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

@if(isset($reportData))
<!-- Summary Cards -->
<div class="row mb-4">
    <div class="col-md-3">
        <div class="card bg-primary text-white">
            <div class="card-body">
                <h3 class="mb-0">{{ number_format($reportData['total_count'] ?? 0) }}</h3>
                <small>تعداد کل</small>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-success text-white">
            <div class="card-body">
                <h3 class="mb-0">{{ number_format($reportData['total_revenue'] ?? 0) }}</h3>
                <small>کل درآمد (تومان)</small>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-info text-white">
            <div class="card-body">
                <h3 class="mb-0">{{ number_format($reportData['average_value'] ?? 0) }}</h3>
                <small>میانگین</small>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-warning text-white">
            <div class="card-body">
                <h3 class="mb-0">{{ number_format($reportData['growth_rate'] ?? 0, 1) }}%</h3>
                <small>نرخ رشد</small>
            </div>
        </div>
    </div>
</div>

<!-- Chart -->
<div class="card mb-4">
    <div class="card-header">
        <h5 class="mb-0">نمودار تحلیلی</h5>
    </div>
    <div class="card-body">
        <canvas id="reportChart" height="80"></canvas>
    </div>
</div>

<!-- Data Table -->
<div class="card">
    <div class="card-header">
        <h5 class="mb-0">جزئیات گزارش</h5>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover" id="reportTable">
                <thead>
                    <tr>
                        @foreach($reportData['headers'] ?? [] as $header)
                        <th>{{ $header }}</th>
                        @endforeach
                    </tr>
                </thead>
                <tbody>
                    @forelse($reportData['rows'] ?? [] as $row)
                    <tr>
                        @foreach($row as $cell)
                        <td>{{ is_numeric($cell) ? number_format($cell) : $cell }}</td>
                        @endforeach
                    </tr>
                    @empty
                    <tr>
                        <td colspan="{{ count($reportData['headers'] ?? [1]) }}" class="text-center text-muted py-4">
                            داده‌ای برای نمایش وجود ندارد
                        </td>
                    </tr>
                    @endforelse
                </tbody>
                @if(isset($reportData['totals']))
                <tfoot class="table-light">
                    <tr>
                        <th>جمع کل</th>
                        @foreach(array_slice($reportData['totals'], 1) as $total)
                        <th>{{ is_numeric($total) ? number_format($total) : $total }}</th>
                        @endforeach
                    </tr>
                </tfoot>
                @endif
            </table>
        </div>
    </div>
</div>
@endif
@endsection

@push('styles')
<link rel="stylesheet" href="{{ asset('assets/vendor/persian-datepicker/persian-datepicker.min.css') }}">
@endpush

@push('scripts')
<script src="{{ asset('assets/vendor/persian-date/persian-date.min.js') }}"></script>
<script src="{{ asset('assets/vendor/persian-datepicker/persian-datepicker.min.js') }}"></script>
<script src="{{ asset('assets/vendor/xlsx/xlsx.full.min.js') }}"></script>

<script>
    @if(isset($reportData))
    // Initialize chart
    const ctx = document.getElementById('reportChart').getContext('2d');
    const chart = new Chart(ctx, {
        type: '{{ $reportData["chart_type"] ?? "line" }}',
        data: {
            labels: {!! json_encode($reportData['chart_labels'] ?? []) !!},
            datasets: [{
                label: '{{ $reportData["chart_label"] ?? "مقدار" }}',
                data: {!! json_encode($reportData['chart_data'] ?? []) !!},
                borderColor: 'rgb(30, 58, 138)',
                backgroundColor: 'rgba(30, 58, 138, 0.1)',
                tension: 0.4,
                fill: true
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: true,
            plugins: {
                legend: {
                    display: true,
                    position: 'top'
                }
            },
            scales: {
                y: {
                    beginAtZero: true,
                    ticks: {
                        callback: function(value) {
                            return value.toLocaleString('fa-IR');
                        }
                    }
                }
            }
        }
    });
    @endif

    // Export to Excel
    function exportToExcel() {
        const table = document.getElementById('reportTable');
        const wb = XLSX.utils.table_to_book(table, { sheet: "گزارش" });

        const reportType = document.getElementById('report_type').value;
        const fromDate = document.getElementById('from_date').value;
        const toDate = document.getElementById('to_date').value;

        const filename = `report_${reportType}_${fromDate}_${toDate}.xlsx`;

        XLSX.writeFile(wb, filename);
        showToast('فایل Excel با موفقیت دانلود شد', 'success');
    }

    $(document).ready(function() {
        $('#from_date').persianDatepicker({
            format: 'YYYY/MM/DD',
            autoClose: true,
            initialValue: false,
            calendarType: 'persian',
            toolbox: {
                calendarSwitch: { enabled: false }
            }
        });

        $('#to_date').persianDatepicker({
            format: 'YYYY/MM/DD',
            autoClose: true,
            initialValue: false,
            calendarType: 'persian',
            toolbox: {
                calendarSwitch: { enabled: false }
            }
        });

        if (!$('#from_date').val() || !$('#to_date').val()) {
            const today = new persianDate();
            const lastMonth = new persianDate().subtract('days', 30);

            if (!$('#from_date').val()) {
                $('#from_date').val(lastMonth.format('YYYY/MM/DD'));
            }

            if (!$('#to_date').val()) {
                $('#to_date').val(today.format('YYYY/MM/DD'));
            }
        }
    });
</script>
@endpush