@extends('admin.layouts.layout')

@section('content')


    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>

    <div class="container-fluid">
        <div class="row clearfix">
            <div class="col-lg-12" style="padding-right: 0px;">
                <div class="card">
                    <div class="header">
                        <div class="row">

                            <div class="col-md-6">
                                <h4 class="alltabletopheadingdesign">Client Payment List</h4>
                            </div>

                            <div class="col-md-6 text-right">

                            </div>

                        </div>
                    </div>
                    <div class="body">

                        <style>
                            .filteroption {
                                padding: 15px;
                                display:none;
                            }
                            .filteroption a {
                                color: black;
                                font-size: 10px;
                                font-weight: 600;
                                border: 1px solid black;
                                padding: 5px;
                                line-height: 40px;
                                cursor: pointer;
                            }
                        </style>


                        <div class="row">
                            <div class="col-md-12"><h6 class="text-center">Client Details</h6></div>
                        </div>

                        <br>
                        <br>

                        <div class="table-responsive check-all-parent">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th>Client Id</th>
                                    <th>Client Name</th>
                                    <th>Last Loin Date</th>
                                </tr>
                                </thead>
                                <tbody>

                                   <tr>
                                       <td>{{ $displayclientdetail->client_user_id }}<input type="hidden" value="{{ $displayclientdetail->user_id }}" id="displayclientprofileuserid"></td>
                                       <td>{{ $displayclientdetail->name }}</td>
                                       <td>{{ $displaydatetime }}</td>
                                   </tr>

                                </tbody>
                            </table>
                        </div>

                        <br>
                        <br>

                        <div class="row">
                            <div class="col-md-6"><h6 class="text-left">Client Payment Details</h6></div>
                            <div class="col-md-6"><h6 class="text-right" data-toggle="modal" data-target="#advertiserpaymentdetails"><button type="button" class="btn btn-primary text-right">Create Client Payment</button></h6></div>
                        </div>


                        <br>
                        <br>

                        <div class="table-responsive check-all-parent">
                            <table class="table" id="clientpaymentdetailslist">
                                <thead>
                                <tr>
                                    <th>S.no</th>
                                    <th>Payment Id</th>
                                    <th>Advertisement Id</th>
                                    <th>Message</th>
                                    <th>Amount</th>
                                    <th>Tax</th>
                                    <th>Total</th>
                                    <th>Payment Status</th>
                                    <th>Payment Duration</th>
                                </tr>
                                </thead>
                                <tbody>


                                </tbody>
                            </table>
                        </div>




                    </div>
                </div>

            </div>
        </div>
    </div>


    <link rel="stylesheet" href="https://cdn.datatables.net/2.0.7/css/dataTables.dataTables.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>



@include('admin.engagement.engagement_js');
@include('admin.engagement.engagement_modal');



    <div class="modal" id="advertiserpaymentdetails">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content">

                <form method="POST" id="clientpaymentdetailsform">

                    @csrf

                    <!-- Modal Header -->
                    <div class="modal-header">
                        <h5 class="modal-title">Create Client Payment</h5>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>

                    <!-- Modal body -->
                    <div class="modal-body">


                        <div class="row">

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Payment ID</label>
                                    <input type="hidden" name="advertiser_id" class="form-control"  value="{{ $displayclientdetail->user_id }}"  readonly>
                                    <input type="text" name="payment_id" id="displayadvertisementpayment_id" class="form-control"  placeholder="Payment Id"  readonly>
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Select Advertisement ID</label>
                                    <div class="multiselect_div">
                                        <select id="advertisementselectionid" name="advertisementdetail_id" style="width:100%" class="select2 form-control @error('advertisement_id') is-invalid @enderror">
                                            <option value="">Select Advertisement</option>
                                            @if($advertisementdetails_without_paymentids)
                                                @foreach($advertisementdetails_without_paymentids as $advertisementdetails_without_paymentid)
                                                    <option value="{{ $advertisementdetails_without_paymentid->id }}">{{ $advertisementdetails_without_paymentid->advertisement_id }}</option>
                                                @endforeach
                                            @endif
                                        </select>
                                        @error('class_id')
                                        <span class="error invalid-feedback">{{$message}}</span>
                                        @enderror
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Display Advertisement Position</label>
                                    <input type="text" name="displayadvertisementposition" id="displayadvertisementposition" class="form-control"  placeholder="Display Advertisement Position"  readonly>
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Message *</label>
                                    <textarea  id="paymentsummernote1" class="summernote form-control @error('message') is-invalid @enderror"  rows="5" cols="30" name="message"></textarea>
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Amount *</label>
                                    <input type="number" name="withouttaxamount" id="displaywithouttaxamount" class="form-control changeadvertiserrpaymentdetail"  placeholder="Amount">
                                </div>
                            </div>


                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Tax *</label>
                                    <input type="number" name="tax" id="displaytax" class="form-control changeadvertiserrpaymentdetail"  placeholder="Tax">
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Display Total</label>
                                    <input type="number" name="total" id="displaytotal" class="form-control"  placeholder="Display total" readonly>
                                </div>
                            </div>


                        </div>

                    </div>

                    <!-- Modal footer -->
                    <div class="modal-footer">
                        <button type="submit"  class="btn btn-primary text-right" id="clientcreatepaymentsavebutton">Save</button> &nbsp;
                        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    </div>


                </form>

            </div>
        </div>
    </div>

@endsection