@extends('backend.layouts.app')
@section('backend_title', 'Admin Brand Create')

@section('backend_content')

    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12 col-lg-offset-5">
            <div class="card">
                <div class="card-body">
                    <form action="{{ Route('transaction_Store') }}" method="POST">
                        @csrf
                        <h5 class="font-weight-bolder">Cash Transaction</h5>
                        <div class="row">

                            <div class="d-flex mb-3">
                                {{-- <div class="form-check">
                                    <input class="form-check-input" name="forSingleOne" type="radio" id="flexCheckDefault">
                                    <label class="form-check-label" for="flexCheckDefault">Supplyer Payment</label>
                                </div>

                                  <div class="form-check ms-5">
                                    <input class="form-check-input" name="forSingleOne" type="radio" id="payment_receive">
                                    <label class="form-check-label" for="payment_receive">Payment Receive</label>
                                  </div> --}}


                                  <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" id="flexCheckDefault">
                                    <label class="form-check-label" for="flexCheckDefault">Supplyer Payment</label>
                                  </div>
                                  <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="checkbox" id="payment_receive">
                                    <label class="form-check-label" for="payment_receive">Payment Receive</label>
                                  </div>
                            </div>


                            <div class="col-lg-1 col-md-2 col-sm-2 col-12 mb-2">
                                <label>Date</label>
                                <input class="form-control" readonly type="text" name="tr_Date" placeholder=""
                                    value="{{ \carbon\Carbon::now()->format('Y-m-d') }}" />
                                @error('Date')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-2 col-md-2 col-sm-2 col-12 mb-2" id="list" style="display: none;">
                                <label>Supplyer Name</label>
                                <select name="supplier_id" class="form-control">
                                    <option value="" selected>Select any one</option>
                                        @isset($supplierList)
                                            @foreach ($supplierList as $item)
                                                <option value="{{ $item->id}}">{{ $item->company_name}}</option>
                                            @endforeach
                                        @endisset
                                </select>
                                @error('supplier_id')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>


                            <div class="col-lg-2 col-md-3 col-sm-2 col-12 mb-2">
                                <label>Transaction Type</label>
                                <select name="tr_type" class="form-control" id="tr_type">
                                    <option value="" selected>Select any one</option>
                                    <option value="cash_out">Payment</option>
                                    <option value="cash_in">Receive</option>
                                </select>
                                @error('tr_type')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-2 col-md-3 col-sm-2 col-12 mb-2 payment_received" style="display: none;">
                                <label>Customer Name</label>
                                <select name="customer_id" class="form-control">
                                    <option value="" selected>Select any one</option>
                                        @isset($customerList)
                                            @foreach ($customerList as $item)
                                                <option value="{{ $item->id}}">{{ $item->name}}</option>
                                            @endforeach
                                        @endisset
                                </select>
                                @error('customer_id')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-2 col-md-3 col-sm-2 col-12 mb-2 payment_received" style="display: none;">
                                <label>Receiver Name</label>
                                <select name="employee_id" class="form-control">
                                    <option value="" selected>Select any one</option>
                                        @isset($employeeList)
                                            @foreach ($employeeList as $item)
                                                <option value="{{ $item->id}}">{{ $item->name}} ({{$item->employee_id}})</option>
                                            @endforeach
                                        @endisset
                                </select>
                                @error('employee_id')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-2 col-md-3 col-sm-2 col-12 mb-2">
                                <label>Transaction Head</label>
                                <select name="tr_id" class="form-control" id="tr_id">
                                    <option value="" selected>Select any one</option>
                                </select>

                                @error('tr_id')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-1 col-md-2 col-sm-3 col-12 mb-2">
                                <label>Amount</label>
                                <input class="form-control" type="text" name="amount" placeholder="0.00"
                                    value="" />
                                @error('cash_in_amount')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-lg-4 col-md-6 col-sm-4 col-12 mb-2">
                                <label>Note</label>
                                <textarea name="description" cols="48" rows="1" class="form-control">{{ old('description') }}</textarea>
                                @error('description')
                                    <div class="form-text text-danger">{{ $message }}</div>
                                @enderror
                            </div>

                        </div>
                        <div class="mt-2">
                            <button type="submit" class="btn btn-primary">Save</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="my-4 row">
        <div class="col-12">
            <div class="card">
                <!-- Card header -->
                <div class="pb-0 card-header">
                    <div class="d-lg-flex">
                        <div>
                            <h5 class="mb-0">Transaction List</h5>
                            <p class="mb-0 text-sm">
                            </p>
                        </div>
                    </div>
                </div>
                <div class="px-0 pb-0 card-body">
                    <div class="table-responsive">
                        <table class="table table-flush" id="products-list">
                            <thead class="thead-light">
                                <tr>
                                    <th class="fs-6" style="color: black">Sl No.</th>
                                    <th class="fs-6" style="color: black">Tr. Date</th>
                                    <th class="fs-6" style="color: black">Tr. Number</th>
                                    <th class="fs-6" style="color: black">Tr. Type</th>
                                    <th class="fs-6" style="color: black">Tr. Head</th>
                                    <th class="fs-6" style="color: black">Amount In</th>
                                    <th class="fs-6" style="color: black">Amount Out</th>
                                    {{-- <th class="fs-6" style="color: black">Note</th> --}}
                                    <th class="fs-6" style="color: black">Action</th>
                                </tr>
                            </thead>
                            <tbody>

                                @isset($trList)
                                    @forelse ($trList as $index=> $item)
                                        <tr>
                                            <td>
                                                {{ $index + 1 }}
                                            </td>

                                            <td>
                                                <p class="my-auto">{{ $item->tr_date }}</p>
                                            </td>

                                            <td>
                                                <p class="my-auto">{{ $item->tr_number }}</p>
                                            </td>

                                            <td>
                                                <p class="my-auto">{{ $item->tr_type == 'cash_out' ? 'Payment' : 'Received' }}
                                                </p>
                                            </td>

                                            <td>
                                                <p class="my-auto">
                                                    {{ $item->expenses && $item->expenses?->id == $item->expense_id
                                                        ? $item->expenses?->head_of_expense
                                                        : ($item->incomes && $item->incomes?->id == $item->income_id
                                                            ? $item->incomes?->head_of_income
                                                            : '') }}
                                                </p>
                                            </td>
                                            <td>
                                                <p class="my-auto">{{ number_format($item->amount_in, 2, '.', ',') }}</p>
                                            </td>

                                            <td>
                                                <p class="my-auto">{{ number_format($item->amount_out, 2, '.', ',') }}</p>

                                            </td>

                                            {{-- <td>
                                                <div class="d-flex">
                                                    <textarea name="description" readonly cols="25" rows="1" class="form-control">{{ $item->note }}</textarea>
                                                </div>
                                            </td> --}}

                                            <td class="text-sm">
                                                <a href="{{ Route('transaction_Show', $item->id) }}" data-bs-toggle="tooltip"
                                                    data-bs-original-title="Preview product">
                                                    <i class="fa-regular fa-eye fs-5"></i>
                                                </a>

                                                @can('edit division')
                                                    <a href="{{ Route('transaction_Edit', $item->id) }}" class="mx-3"
                                                        data-bs-toggle="tooltip" data-bs-original-title="Edit product">
                                                        <i class="fa-solid fa-pen-to-square fs-5"></i>
                                                    </a>
                                                @endcan
                                                @can('delete division')
                                                    <a onclick="return confirm('Are you sure Delete?')"
                                                        href="{{ Route('transaction_Delete', $item->id) }}"
                                                        data-bs-toggle="tooltip" data-bs-original-title="Delete product">
                                                        <i class="fa-solid fa-trash-can fs-5"></i> </a>
                                                @endcan
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td class="text-sm" colspan="3">Data Not Found!!</td>
                                        </tr>
                                    @endforelse
                                @endisset

                            </tbody>
                            <tfoot>
                                <tr>
                                    <th class="fs-6">Name</th>
                                    <th class="fs-6">Status</th>
                                    <th class="fs-6">Action</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <script>
        document.getElementById('flexCheckDefault').addEventListener('change', function() {
            var listDiv = document.getElementById('list');
            if (this.checked) {
                listDiv.style.display = 'block';
            } else {
                listDiv.style.display = 'none';
            }
        });

        document.getElementById('payment_receive').addEventListener('change', function() {
            var listDivs = document.querySelectorAll('.payment_received');
            listDivs.forEach(function(div) {
                if (this.checked) {
                    div.style.display = 'block';
                } else {
                    div.style.display = 'none';
                }
            }.bind(this));
        });


        document.getElementById('tr_type').addEventListener('change', function() {
            var trType = this.value;
            var trIdSelect = document.getElementById('tr_id');
            var expenseList = @json($expenseList);
            var incomeList = @json($incomeList);
    
            // Clear the existing options in Transaction Head dropdown
            trIdSelect.innerHTML = '<option value="" selected>Select any one</option>';
    
            if (trType === 'cash_out') {
                // Populate with expense list
                expenseList.forEach(function(expense) {
                    var option = document.createElement('option');
                    option.value = 'expense_' + expense.id;
                    option.text = expense.head_of_expense;
                    trIdSelect.appendChild(option);
                });
            } else if (trType === 'cash_in') {
                // Populate with income list
                incomeList.forEach(function(income) {
                    var option = document.createElement('option');
                    option.value = 'income_' + income.id;
                    option.text = income.head_of_income;
                    trIdSelect.appendChild(option);
                });
            }
        });
    </script>
@endsection

@section('beackend_scripts')

@endsection