@extends('layout')
@section('content')
<style>
    .nav-tabs .nav-link {
        padding: 12px 20px;
        font-weight: 500;
    }
    .transaction-table {
        width: 100%;
    }
    .transaction-table th {
        background-color: #f8f9fa;
    }
    .badge-sold {
        background-color: #28a745;
    }
    .badge-purchase {
        background-color: #007bff;
    }
    .badge-return {
        background-color: #dc3545;
    }
    .summary-card {
        border-left: 4px solid;
        border-radius: 0;
    }
    .summary-card.sales {
        border-left-color: #28a745;
    }
    .summary-card.purchase {
        border-left-color: #007bff;
    }
    .summary-card.returns {
        border-left-color: #dc3545;
    }
</style>

<!-- begin::main content -->
<main class="main-content">
    <div class="container">
        <!-- begin::page header -->
        <div class="page-header">
            <h3>Item Transaction Details</h3>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ asset('dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{ asset('account/inventory') }}">Inventory</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Item Details</li>
                </ol>
            </nav>
        </div>
        <!-- end::page header -->

        <div class="row mb-4">
            <div class="col-md-4">
                <div class="card summary-card sales">
                    <div class="card-body">
                        <h6 class="card-title text-uppercase text-muted">Total Sold</h6>
                        <h4 class="mb-0">{{ $sold_item->total() }}</h4>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="card summary-card purchase">
                    <div class="card-body">
                        <h6 class="card-title text-uppercase text-muted">Total Purchased</h6>
                        <h4 class="mb-0">{{ $purchase_item->total() }}</h4>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="card summary-card returns">
                    <div class="card-body">
                        <h6 class="card-title text-uppercase text-muted">Total Returns</h6>
                        <h4 class="mb-0">{{ $credit_note->total() + $debit_notes->total() }}</h4>
                    </div>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-body">
                <ul class="nav nav-tabs" id="itemDetailsTab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="sales-tab" data-toggle="tab" href="#sales" role="tab">
                            <i class="fa fa-shopping-cart mr-2"></i>Sales ({{ $sold_item->total() }})
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="purchases-tab" data-toggle="tab" href="#purchases" role="tab">
                            <i class="fa fa-shopping-basket mr-2"></i>Purchases ({{ $purchase_item->total() }})
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="returns-tab" data-toggle="tab" href="#returns" role="tab">
                            <i class="fa fa-exchange-alt mr-2"></i>Returns ({{ $credit_note->total() + $debit_notes->total() }})
                        </a>
                    </li>
                </ul>

                <div class="tab-content py-3" id="itemDetailsTabContent">
                    <!-- Sales Tab -->
                    <div class="tab-pane fade show active" id="sales" role="tabpanel">
                        <div class="table-responsive">
                            <table class="table table-striped transaction-table">
                                <thead>
                                    <tr>
                                        <th>Date</th>
                                        <th>Invoice No</th>
                                        <th>Customer</th>
                                        <th>Quantity</th>
                                        <th>Unit Price</th>
                                        <th>Discount</th>
                                        <th>CGST</th>
                                        <th>SGST</th>
                                        <th>IGST</th>
                                        
                                        <th>Total</th>
                                        
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($sold_item as $sale)
                                    <tr>
                                        <td>{{ date('d M Y', strtotime($sale->created_at)) }}</td>
                                        <td>
                                            <span class="badge badge-sold text-white">INV-{{ $sale->invoice_id }}</span>
                                        </td>
                                        <td>{{ $sale->customer_name }}</td>
                                        <td>{{ $sale->item_quantity }}</td>
                                        <td>₹ {{ number_format($sale->item_price, 2) }}</td>
                                        <td>{{ number_format($sale->discount_amount, 2) }}</td>
                                        
                                        <td>₹ {{ number_format($sale->item_cgst, 2) }}</td>
                                        <td>₹ {{ number_format($sale->item_sgst, 2) }}</td>
                                        <td>₹ {{ number_format($sale->item_igst, 2) }}</td>
                                        <td>₹ {{ number_format($sale->item_total, 2) }}</td>
                                        
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="8" class="text-center">No sales records found</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                            <div class="mt-3 d-flex justify-content-center">
                                {{ $sold_item->links('pagination::bootstrap-4') }}
                            </div>
                        </div>
                    </div>

                    <!-- Purchases Tab -->
                    <div class="tab-pane fade" id="purchases" role="tabpanel">
                        <div class="table-responsive">
                            <table class="table table-striped transaction-table">
                                <thead>
                                    <tr>
                                        <th>Date</th>
                                        <th>Bill No</th>
                                        <th>Vendor</th>
                                         <th>Quantity</th>
                                        <th>Unit Price</th>
                                        <th>Discount</th>
                                        <th>CGST</th>
                                        <th>SGST</th>
                                        <th>IGST</th>
                                        
                                        <th>Total</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($purchase_item as $purchase)
                                    <tr>
                                        <td>{{ date('d M Y', strtotime($purchase->created_at)) }}</td>
                                        <td>
                                            <span class="badge badge-purchase text-white">INV-{{ $purchase->invoice_id }}</span>
                                        </td>
                                        <td>{{ $purchase->customer_name }}</td>
                                        <td>{{ $purchase->item_quantity }}</td>
                                        <td>₹ {{ number_format($purchase->item_price, 2) }}</td>
                                        <td>{{ number_format($purchase->discount_amount, 2) }}</td>
                                        
                                        <td>₹ {{ number_format($purchase->item_cgst, 2) }}</td>
                                        <td>₹ {{ number_format($purchase->item_sgst, 2) }}</td>
                                        <td>₹ {{ number_format($purchase->item_igst, 2) }}</td>
                                        <td>₹ {{ number_format($purchase->item_total, 2) }}</td>
                                        
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="8" class="text-center">No purchase records found</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                            <div class="mt-3 d-flex justify-content-center">
                                {{ $purchase_item->links('pagination::bootstrap-4') }}
                            </div>
                        </div>
                    </div>

                    <!-- Returns Tab -->
                    <div class="tab-pane fade" id="returns" role="tabpanel">
                        <ul class="nav nav-pills mb-3" id="returns-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="credit-notes-tab" data-toggle="pill" href="#credit-notes" role="tab">
                                    Credit Notes ({{ $credit_note->total() }})
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="debit-notes-tab" data-toggle="pill" href="#debit-notes" role="tab">
                                    Debit Notes ({{ $debit_notes->total() }})
                                </a>
                            </li>
                        </ul>

                        <div class="tab-content" id="returns-tabContent">
                            <!-- Credit Notes -->
                            <div class="tab-pane fade show active" id="credit-notes" role="tabpanel">
                                <div class="table-responsive">
                                    <table class="table table-striped transaction-table">
                                        <thead>
                                            <tr>
                                                <th>Date</th>
                                                <th>Credit Note No</th>
                                                <th>Customer</th>
                                                 <th>Quantity</th>
                                                <th>Unit Price</th>
                                                <th>Discount</th>
                                                <th>CGST</th>
                                                <th>SGST</th>
                                                <th>IGST</th>
                                                
                                                <th>Total</th>
                                                <th>Reason</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @forelse($credit_note as $credit)
                                            <tr>
                                                <td>{{ date('d M Y', strtotime($credit->created_at)) }}</td>
                                                <td>
                                                    <span class="badge badge-credit text-white">INV-{{ $credit->invoice_id }}</span>
                                                </td>
                                                <td>{{ $credit->customer_name }}</td>
                                                <td>{{ $credit->item_quantity }}</td>
                                                <td>₹ {{ number_format($credit->item_price, 2) }}</td>
                                                <td>{{ number_format($credit->discount_amount, 2) }}</td>
                                                
                                                <td>₹ {{ number_format($credit->item_cgst, 2) }}</td>
                                                <td>₹ {{ number_format($credit->item_sgst, 2) }}</td>
                                                <td>₹ {{ number_format($credit->item_igst, 2) }}</td>
                                                <td>₹ {{ number_format($credit->item_total, 2) }}</td>
                                                <td>₹ {{ $credit->reason }}</td>
                                            </tr>
                                            @empty
                                            <tr>
                                                <td colspan="6" class="text-center">No credit note records found</td>
                                            </tr>
                                            @endforelse
                                        </tbody>
                                    </table>
                                    <div class="mt-3 d-flex justify-content-center">
                                        {{ $credit_note->links('pagination::bootstrap-4') }}
                                    </div>
                                </div>
                            </div>

                            <!-- Debit Notes -->
                            <div class="tab-pane fade" id="debit-notes" role="tabpanel">
                                <div class="table-responsive">
                                    <table class="table table-striped transaction-table">
                                        <thead>
                                            <tr>
                                                <th>Date</th>
                                                <th>Debit Note No</th>
                                                <th>Vendor</th>
                                                <th>Quantity</th>
                                                <th>Unit Price</th>
                                                <th>Discount</th>
                                                <th>CGST</th>
                                                <th>SGST</th>
                                                <th>IGST</th>
                                                
                                                <th>Total</th>
                                                <th>Reason</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @forelse($debit_notes as $debit)
                                            <tr>
                                                <td>{{ date('d M Y', strtotime($debit->created_at)) }}</td>
                                                <td>
                                                    <span class="badge badge-debit text-white">INV-{{ $debit->invoice_id }}</span>
                                                </td>
                                                <td>{{ $debit->customer_name }}</td>
                                                <td>{{ $debit->item_quantity }}</td>
                                                <td>₹ {{ number_format($debit->item_price, 2) }}</td>
                                                <td>{{ number_format($debit->discount_amount, 2) }}</td>
                                                
                                                <td>₹ {{ number_format($debit->item_cgst, 2) }}</td>
                                                <td>₹ {{ number_format($debit->item_sgst, 2) }}</td>
                                                <td>₹ {{ number_format($debit->item_igst, 2) }}</td>
                                                <td>₹ {{ number_format($debit->item_total, 2) }}</td>
                                                <td>₹ {{ $debit->reason }}</td>
                                            </tr>
                                            @empty
                                            <tr>
                                                <td colspan="6" class="text-center">No debit note records found</td>
                                            </tr>
                                            @endforelse
                                        </tbody>
                                    </table>
                                    <div class="mt-3 d-flex justify-content-center">
                                        {{ $debit_notes->links('pagination::bootstrap-4') }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<!-- end::main content -->
@endsection

@push('footer-script')
<script>
    $(document).ready(function() {
        // Activate the first tab if hash is empty
        if(window.location.hash) {
            $('.nav-tabs a[href="' + window.location.hash + '"]').tab('show');
        }

        // Change hash for page-reload
        $('.nav-tabs a').on('shown.bs.tab', function (e) {
            window.location.hash = e.target.hash;
        });
    });
</script>
@endpush