@extends('layouts.main')
@section('title', $data['title'])
@section('content')

    <style>
        label {
            font-weight: 0 !important;
            margin-bottom: 0 !important;
        }

        #extra_stock_div table td,
        #extra_stock_div table th,
        #summery_stock_div table td,
        #summery_stock_div table th,
        #found_stock_div table td,
        #found_stock_div table th,
        #software_stock_div table td,
        #software_stock_div table th {
            border: 0.5px #c1c4c7 solid !important;
        }

        #software_stock_div table,
        #software_stock_div table {
            width: 200% !important;
        }

        @media (max-width: 1024px) {
            #extra_stock_div {
                width: 100% !important;
                max-width: 100% !important;
                max-height: 100% !important;
            }

            #found_stock_div {
                width: 100% !important;
                max-width: 100% !important;
                max-height: 100% !important;
            }

            #software_stock_div {
                width: 100% !important;
                max-width: 100% !important;
                max-height: 100% !important;
            }
        }

        #software_stock_div .card-body {
            min-height: 690px;
            /* Set a fixed minimum height */
        }

        #found_stock_div .card-body,
        #extra_stock_div .card-body {
            min-height: 440px;
            /* Set a fixed minimum height */
        }

        #summery_stock_div .card-body {
            min-height: 170px;
            /* Set a fixed minimum height */
        }

        .table>:not(caption)>*>* {
            padding: .25rem .25rem !important;
            background-color: var(--bs-table-bg);
            border-bottom-width: 1px;
            -webkit-box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
            box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg)
        }
    </style>
    <div class="page-content">
        <div class="container-fluid">
            <div class="row">
                <div class="card-header mb-2">
                    <div class="row align-items-center g-2">
                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="q_stock_date" class="">Stock Date</label>
                            <div class="input-group">
                                <input type="text" class="form-control" placeholder="dd-mm-yyyy"
                                    data-date-format="dd-mm-yyyy" data-provide="datepicker" data-date-autoclose="true"
                                    required name="q_stock_date" id="q_stock_date" autocomplete="off">
                            </div>
                        </div>

                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="token" class="">Token</label>
                            <input type="text" class="form-control" placeholder="Token" name="token" id="token" readonly
                                value="{{ $data['token_no'] }}">
                        </div>

                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="" class=""></label>
                            <button type="button" class="btn btn-primary w-100 text-nowrap" id="createTokenBtn">
                                <i class="bx bx-plus font-size-17 align-middle"></i> Create
                            </button>
                        </div>

                        {{-- <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="" class=""></label>
                            <button class="btn btn-primary w-100 text-nowrap"><i
                                    class="bx bx-search font-size-17 align-middle"></i>
                                Show</button>
                        </div>

                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="" class=""></label>
                            <button class="btn btn-primary w-100 text-nowrap"><i
                                    class="bx bx-printer font-size-17 align-middle"></i>
                                Print</button>
                        </div>

                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="" class=""></label>
                            <button class="btn btn-primary w-100 text-nowrap"><i
                                    class="bx bx-exit font-size-17 align-middle"></i>
                                Exit</button>
                        </div>

                        <div class="col-lg-1 col-md-2 col-sm-3">
                            <label for="" class=""></label>
                            <button class="btn btn-danger w-100 text-nowrap"><i
                                    class="fa fa-database font-size-17 align-middle"></i>
                                Delete</button> --}}
                        </div>
                    </div>

                </div>

                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-12 mb-3" style="width: 100%; max-width: 50%; max-height: 690px;"
                        id="software_stock_div">
                        <div class="card">
                            <div class="card-header">
                                <h5>Software Stock</h5>
                            </div>
                            <div class="card-body" style="overflow-x: auto; overflow-y: auto; max-height: 690px;">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th>Label No</th>
                                            <th>Tag No</th>
                                            <th>Group Name</th>
                                            <th>Category Name</th>
                                            <th>Item Name</th>
                                            <th>Status</th>
                                            <th>Gold Color</th>
                                            <th>Gold Purity</th>
                                            <th>Gross Weight</th>
                                            <th>Net Weight</th>
                                            <th>Gold Amount</th>
                                            <th>Net Amount</th>
                                        </tr>
                                    </thead>
                                    <tbody>

                                        @if (!empty($data['items']) && count($data['items']) > 0)
                                            @foreach ($data['items'] as $index => $item)
                                                <tr>
                                                    <td>{{ $item['label_no'] }}</td>
                                                    <td>{{ $item['tag_no'] }}</td>
                                                    <td>{{ $item['group_name'] }}</td>
                                                    <td>{{ $item['category_name'] }}</td>
                                                    <td>{{ $item['item_name'] }}</td>
                                                    <td>{!! $item['status'] !!}</td>
                                                    <td>{{ $item['gold_color_name'] }}</td>
                                                    <td>{{ $item['gold_purity_name'] }}</td>
                                                    <td>{{ $item['gross_weight'] }}</td>
                                                    <td>{{ $item['net_weight'] }}</td>
                                                    <td>{{ $item['gold_amount'] }}</td>
                                                    <td>{!! $item['net_amount'] !!}</td>
                                                </tr>
                                            @endforeach
                                        @else
                                            <tr>
                                                <td colspan="11" class="text-center text-muted">No data found</td>
                                            </tr>
                                        @endif




                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="row d-flex col-lg-6">
                        <div class="mb-3 col-lg-3 col-md-6 col-sm-12"
                            style="width: 100%; max-width: 40%; max-height: 440px;" id="found_stock_div">
                            <div class="card">
                                <div class="card-header">
                                    <h5>Found Stock</h5>
                                </div>
                                <div class="card-body" style="overflow-x: auto; overflow-y: auto; max-height: 440px;">
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr>
                                                <th>Status</th>
                                                <th>NFC Tag</th>
                                                <th>Lable No</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if (!empty($data['foundStockTally']) && count($data['foundStockTally']) > 0)
                                                @foreach ($data['foundStockTally'] as $index => $foundStock)
                                                    <tr>
                                                        <td>{{ $foundStock['status']}}</td>
                                                        <td>{{ $foundStock['tag_no']}}</td>
                                                        <td>{{ $foundStock['label_no']}}</td>
                                                    </tr>
                                                @endforeach
                                            @else
                                                <tr>
                                                    <td colspan="3" class="text-center text-muted">No data found</td>
                                                </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="mb-3 col-lg-4 col-md-6 col-sm-12"
                            style="width: 100%; max-width: 60%; max-height: 440px;" id="extra_stock_div">
                            <div class="card">
                                <div class="card-header">
                                    <h5>Extra Stock</h5>
                                </div>
                                <div class="card-body" style="overflow-x: auto; overflow-y: auto; max-height: 440px;">
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr>
                                                <th>Status</th>
                                                <th>NFC Tag</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if (!empty($data['extraStockTally']) && count($data['extraStockTally']) > 0)
                                                @foreach ($data['extraStockTally'] as $index => $extraStock)
                                                    <tr>
                                                        <td>{{ $extraStock['status']}}</td>
                                                        <td>{{ $extraStock['tag_no']}}</td>
                                                    </tr>
                                                @endforeach
                                            @else
                                                <tr>
                                                    <td colspan="2" class="text-center text-muted">No data found</td>
                                                </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                        <div class="mb-3 col-lg-4 col-md-6 col-sm-12" style="width: 100%; max-height: 170px;"
                            id="summery_stock_div">
                            <div class="card">
                                <div class="card-header">
                                    <h5>Summery</h5>
                                </div>
                                <div class="card-body" style="overflow-x: auto; overflow-y: auto; max-height: 170px;">
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr>
                                                <th>Company / Branch Name</th>
                                                <th>Total Stock</th>
                                                <th>Scan</th>
                                                <th>Found</th>
                                                <th>Extra</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if (Auth::user()->type == 1)
                                                @if (!empty($data['company']) && count($data['company']) > 0)
                                                    @foreach ($data['company'] as $index => $company)
                                                        <tr>
                                                            <td>{{ $company['name']}}</td>
                                                            <td>{{ $company['stock_count']}}</td>
                                                            <td>{{ $company['all_scan']}}</td>
                                                            <td>{{ $company['found_stock_count']}}</td>
                                                            <td>{{ $company['extra_stock_count']}}</td>
                                                        </tr>
                                                    @endforeach
                                                @else
                                                    <tr>
                                                        <td colspan="2" class="text-center text-muted">No data found</td>
                                                    </tr>
                                                @endif
                                            @endif
                                            @if (!empty($data['branch']) && count($data['branch']) > 0)
                                                @foreach ($data['branch'] as $index => $branch)
                                                    <tr>
                                                        <td>{{ $branch['name']}}</td>
                                                        <td>{{ $branch['stock_count']}}</td>
                                                        <td>{{ $branch['all_scan']}}</td>
                                                        <td>{{ $branch['found_stock_count']}}</td>
                                                        <td>{{ $branch['extra_stock_count']}}</td>
                                                    </tr>
                                                @endforeach
                                            @else
                                                <tr>
                                                    <td colspan="2" class="text-center text-muted">No data found</td>
                                                </tr>
                                            @endif

                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th>Total</th>
                                                <th id="total-stock">0</th>
                                                <th id="total-scan">0</th>
                                                <th id="total-found">0</th>
                                                <th id="total-extra">0</th>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end row -->
        </div>
        <!-- container-fluid -->
    </div>

@endsection('content')
@section('custom-scripts')

    <script src="{{ asset('assets/libs/parsleyjs/parsley.min.js') }}"></script>
    <script src="{{ asset('assets/js/pages/form-validation.init.js') }}"></script>
    <script src="{{ asset('assets/js/pages/jquery.form.js') }}"></script>
    <script src="{{ asset('assets/libs/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}"></script>
    <script src="{{ asset('assets/libs/kendo/kendo.all.min.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.bootstrap5.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.buttons.min.js') }}"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            // On load: store current token in localStorage
            let currentToken = parseInt($('#token').val()) || 1;
            localStorage.setItem('currentToken', currentToken);
            // On button click: generate new token
            $('#createTokenBtn').click(function () {
                let token = localStorage.getItem('currentToken');
                token = token ? parseInt(token) + 1 : 1;
                $('#token').val(token);
                console.log(token);
                localStorage.setItem('currentToken', token);
                $.ajax({
                    url: '{{ route("setToken") }}',
                    method: 'GET',
                    data: { currentToken: token },
                    success: function (response) {
                        console.log(response);
                    },
                    error: function (xhr, status, error) {
                        console.error('Error:', error);
                    }
                });
            });
        });

        $(document).ready(function () {
            function updateTotals() {
                let totalStock = 0;
                let totalScan = 0;
                let totalFound = 0;
                let totalExtra = 0;

                // Loop through the table rows to sum up the values
                $('#summery_stock_div table tbody tr').each(function () {
                    let stockCount = parseInt($(this).find('td').eq(1).text()) || 0;
                    let allScan = parseInt($(this).find('td').eq(2).text()) || 0;
                    let foundStockCount = parseInt($(this).find('td').eq(3).text()) || 0;
                    let extraStockCount = parseInt($(this).find('td').eq(4).text()) || 0;

                    totalStock += stockCount;
                    totalScan += allScan;
                    totalFound += foundStockCount;
                    totalExtra += extraStockCount;
                });

                // Update the footer with the calculated totals
                $('#total-stock').text(totalStock);
                $('#total-scan').text(totalScan);
                $('#total-found').text(totalFound);
                $('#total-extra').text(totalExtra);
            }

            // Call the updateTotals function when the page loads
            updateTotals();
        });

    </script>
@endsection