@extends('admin.layout.master')
@section('title',  ucfirst($routeGroup).' List')
@section('content')
    <style> 
        .table th,
        .table td {
            padding: 0rem;
            padding-left: 0.35rem; 
        } 
        .custom-td {
            white-space:pre-wrap;
            word-wrap:break-word;
        }
    </style>
    <div class="card sina-card">
        <div class="card-header card-header-s d-flex flex-wrap align-items-center">
            <h4 class="col-6 pl-0">{{ ucfirst($routeGroup) }} List</h4>
            <div class="col-6 d-flex justify-content-end">
                @if(checkAuthPermission($type==2?'customer.create':'vendor.create'))
                <a href="{{ route($type==2?'customer.create':'vendor.create') }}" class="btn-sina-title-add d-flex align-items-center"
                    type="button" name="button">
                    <div class="col pl-0 pr-2">
                        <i class="fas fa-plus-circle"></i>
                    </div>
                    <div>Add New</div>
                </a>
                @endif
            </div>
        </div>
        <div class="card-body">
            <div class="row mb-4">  
                <div class="col-md-3 col-6">
                    <label>Group</label>
                    <select name="group_id" class="form-control select_2" id="group_id">
                        <option value=""></option>
                        @foreach ($groups as $group)
                            <option value="{{ $group->id }}">{{ $group->name_eng }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-4 col-6">
                    <label>Name</label>
                    <select name="party_id" id="party_id" style="width: 100%" class="form-control party_live"> 
                    </select>
                </div>
                <div class="col-md-3 col-6">
                    <label for="status">Status</label>
                    <select name="status" class="form-control select_2" id="status"> 
                        <option value=""></option>
                        <option value="1">Active</option>
                        <option value="2">Inactive</option>
                    </select>
                </div>
                <div class="col-md-2 col-6"> <br>
                    <button class="btn btn-danger btn-sm" onclick="filter({{$type}})"><i class="fas fa-search"></i></button> 
                </div>  
            </div>

            <div class="row">
                <div class="col-md-12" id="div_tbl"> 
                        <table class="table table-hover table-bordered" id="div_tbl" style="width:100%">
                            <thead class="thead-dark">
                                <tr>
                                    <th>#</th>
                                    <th>Code</th>
                                    <th>Name</th>
                                    <th>Ledger</th>
                                    <th>Email</th>
                                    <th>Mobile</th>
                                    <th>C Type</th> 
                                    <th>Comm(%)</th> 
                                    <th>Limit Apply</th>
                                    <th>Limit</th>
                                    <th>Status</th> 
                                    <th>Action</th>

                                </tr>
                            </thead>
                            <tbody id="DataSet">
                                {{-- @php($i = 1)
                                @foreach ($customers as $customer)
                                    <tr>
                                        <td>{{ $i++ }}</td>
                                        <td>
                                            @if ($customer->code)
                                                {{ $customer->code }}
                                            @else
                                                <p style="color: rgb(212, 205, 205)">Not Found</p>
                                            @endif
                                        </td>
                                        <td>
                                            @if ($customer->user_name)
                                                {{ $customer->user_name }} 
                                            @else
                                                <p style="color:red">Not Found</p>
                                            @endif
                                        </td>
                                        <td>
                                            @if ($customer->name_eng)
                                                {{ $customer->name_eng }} 
                                            @else
                                                <p style="color:red">Not Found</p>
                                            @endif
                                        </td>
                                        <td>
                                            @if ($customer->mobile)
                                                {{ $customer->mobile }} 
                                            @else
                                                <p style="color: red">Not Found</p>
                                            @endif
                                        </td> 
                                        <td class="text-left">
                                            <a href="{{ route('customer.edit', ['id' => $customer->id]) }}"
                                                class="btn btn-success btn-sm">Edit</a>
                                            <button type="button" class="btn btn-sm btn-info"
                                                onclick="showDetails({{ $customer }})">Show</button>
                                            @if (count($customer->shops) > 0)
                                                <button type="button" class="btn btn-sm btn-warning"
                                                    onclick="showShopsToAsign()">Area</button>
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach --}}
                            </tbody>
                        </table>
                        {{-- <div class="d-flex justify-content-center">
                            {!! $customers->links() !!}
                        </div> --}}

                        {{-- </div> --}}
                    </div>
                </div>
            </div>
        </div>

        @include('inventory.forms.customer_info')
        
        {{-- <script type="text/javascript" src="{{ asset('admin/custom/api.js') }}"></script> --}}
    @endsection
    @section('script') 
    <script>
        const store_setting = @json(store_info());
    </script>
    <script type="text/javascript" src="{{ asset('inventory/blade_js/common.js') }}"></script>
    <script type="text/javascript" src="{{ asset('inventory/custom/customer.js') }}"></script>
    <script>
        $(document).ready(function() {
            select2('select_2');
            partySearch('party_live', {{$type}})
        }); 

        // function setArea(pivot_id, customer_id) {
        //     if (confirm('are you sure?')) {
        //         $.ajax({
        //             type: "GET",
        //             url: "/add-customer",
        //             data: {
        //                 customer_id: customer_id,
        //                 id: pivot_id,
        //                 type: 4
        //             },
        //             success: function(data) {
        //                 location.reload();
        //             },
        //             error: function(response) {},
        //         });
        //     }
        // }

        // function showDetails(data) {
        //     // let data = ShowArray[id];
        //     $("#edit_modal").modal("hide");
        //     var str = `<tr><th>Code</th><td>` + data.code + `</td></tr><tr>
        //             <th>User Name</th><td>` + data.user_name + `</td></tr><tr>
        //             <th>Name</th><td>` + data.name_eng + `</td></tr><tr>
        //             <th>Mobile</th><td>` + data.mobile + `</td></tr><tr>
        //             <th>Address</th><td>` + data.address + `</td></tr><tr>
        //             <th>Bank Name</th><td>` + data.bank_name + `</td></tr><tr>
        //             <th>Account Number</th><td>` + data.acc_number + `</td></tr><tr>
        //             <th>Commission</th><td>` + data.commission + `</td></tr><tr>
        //             <th>Commission Type</th><td>` + data.commission_type + `</td></tr><tr>
        //             <th>Credit Limit Amount</th><td>` + data.credit_limit_amount + `</td></tr><tr>
        //             <th>Credit Limit Day</th><td>` + data.credit_limit_day + `</td></tr>`
        //     if (data.shops.length) {
        //         str += `<tr><th colspan="2" class="text-center">AREA LIST</th><tr>`;
        //         for (let index = 0; index < data.shops.length; index++) {
        //             str += `<tr onclick="setArea('` + data.shops[index].pivot.id + `','` + data.id +
        //                 `')"><th colspan="2">` + data.shops[index].name;
        //             if (data.shops[index].pivot.active == 1) {
        //                 str += ` <span class="text-right badge badge-success">Active</span>`;
        //             } else {
        //                 str += ` <span class="text-right badge badge-danger">Active pls</span>`;
        //             }
        //             str += `</th><tr>`;
        //         }

        //     }
        //     $('#customer_info').html(str);

        //     $("#edit_modal").modal("show");
        // }
    </script>
@endsection