@include('division.layout.header')

<link href="https://cdn.datatables.net/2.0.8/css/dataTables.dataTables.css" rel="stylesheet">
<link href="https://cdn.datatables.net/fixedheader/4.0.1/css/fixedHeader.dataTables.css" rel="stylesheet">
<style>
    table.fixedHeader-floating.no-footer th {
        font-size: 12px !important;
        padding: 14px 0 !important;
    }

    .dtfh-floatingparent.dtfh-floatingparent-head {
        z-index: 999 !important;
    }

    span.dt-column-order {
        opacity: 0;
    }

    .dtfh-floatingparent.dtfh-floatingparent-head th {
        /* font-size: 12px; */
    }

    table.dataTable>thead>tr>th,
    table.dataTable>thead>tr>td {
        background: #07529B;
        color: #fff;
        text-align: center;
    }
</style>

<div class="container-fluid">
    <!--  Row 1 -->
    <div class="row justify-content-end">

        <div class="col-lg-auto col-md-auto col-sm-auto col-12 my-auto">
            <h2 class="main_title">Contract Update List</h2>
        </div>

        @if (Auth::user()->role == 'Admin')
            <div class="col-lg-2 col-md-3 col-sm-4 ms-auto mb-2">
            </div>
        @endif
        <div class="col-lg-2 col-md-3 mb-2 col-sm-4 col-auto {{ Auth::user()->role == 'Division' ? 'ms-auto' : '' }}">
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-auto mb-2">
        </div>
        <div class="col-lg-auto col-md-auto col-sm-auto col-auto mb-2">
            {{-- <div class="d-flex align-items-center">
                <div id="reportrange" class="daterange">
                    <i class="fa fa-calendar"></i>&nbsp;
                    <span></span> <i class="fa fa-caret-down"></i>
                    <input type="hidden" name="dtFrom" id="dtFrom">
                    <input type="hidden" name="dtTo" id="dtTo">
                </div>
                <a href="#" class="btn btn-primary ms-2" onclick="setFilter()"><i class="fa fa-search"></i></a>
                <a href="#" class="btn btn-danger ms-2" onclick="resetFilter()"><i class="fa fa-times"></i></a>
            </div> --}}
        </div>
        <div class="col-lg-auto  col-md-auto col-sm-auto mb-2">
        </div>
    </div>

    <div class="row mb-3">
    </div>

    <div class="row">
        <div class="col-12">
            <table id="datatable" class="table table-striped data-table-dr" style="width:100%">
                <thead>
                    <tr>
                        <th>Sr No</th>
                        <th>Doctor Center Code</th>
                        <th>Old Data</th>
                        <th>New Data</th>
                        <th>Updated By </th>
                        <th>Date and Time</th>
                    </tr>
                </thead>
                <tbody>
                <tbody>
            </table>
        </div>
    </div>
</div>
</div>

<div class="modal fade" id="contract_letter" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false"
    tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-xl modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title fs-5" id="contractModalTitle">Contract Details</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="contract_detiles" id="contractContent">
                    <div class="table-responsive">
                    <table id="contractDetails" class="table table-striped " style="width:100%">
                        <thead>
                            <tr>
                                <th>Dr Name </th>
                                <th>Dr Mobile No </th>
                                <th>Dr Wp Mobile No </th>
                                <th>Dr Email Id </th>
                                <th>Activation Date </th>
                                <th>Rsm Name </th>
                                <th>Rsm Emp Code </th>
                                <th>Rsm Email Id</th>
                                <th>Rsm Mobile No </th>
                                <th>Me Fs Code </th>
                                <th>Me Emp Code </th>
                                <th>Hq  Name </th>
                                <th>Hq Code </th>
                                <th>Hcp Garnet Code </th>
                                <th>Dr Pan No </th>
                                <th>Dr Reg No</th>
                                <th>Dr Speciality </th>
                                <th>Dr Qualification </th>
                                <th>No of Years of Experience</th>
                                <th>Therapy</th>
                                <th>Address</th>
                                <th>Place</th>
                                <th>Pincode</th>
                                <th>State</th>
                                <th>Hcp Sap Vendor Code</th>
                                <th>Hcp Unique Code</th>
                                <th>Cost Center Code</th>
                                <th>Order No</th>
                                <th>Region</th>
                                <th>Contract Amount</th>
                                <th>Patient Count</th>
                            </tr>
                        </thead>
                        <tbody id="contractDetailsTbody">
                        <tbody>
                    </table>
                    </div>
                </div>
            </div>
            <div class="modal-footer justify-content-center">
                <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>


@include('division.layout.footer')
{{-- @include('division.modals') --}}

<script src="https://cdn.datatables.net/2.0.8/js/dataTables.js"></script>
<script src="https://cdn.datatables.net/fixedheader/4.0.1/js/dataTables.fixedHeader.js"></script>
<script src="https://cdn.datatables.net/fixedheader/4.0.1/js/fixedHeader.dataTables.js"></script>


<script>
    $(document).on('click', '#ContractView', function() {
        let Id = $(this).data('id');
        let Type = $(this).data('type');

        $.ajax({
            type: "POST",
            url: "{{ route('Contract.getcontractUpdateData') }}",
            data: {
                _token: "{{ csrf_token() }}",
                id: Id,
                type:Type
            },
            success: function(response) {
                if (response.status == 1) {
                    // Extract data
                    const data = response.data.jDecodData;

                    // Build table rows
                    const tableRows = `
                        <tr>
                            <td>${data.dr_name}</td>
                            <td>${data.dr_mobile_no}</td>
                            <td>${data.dr_wp_mobile_no}</td>
                            <td>${data.dr_email_id}</td>
                            <td>${data.activation_date}</td>
                            <td>${data.rsm_name}</td>
                            <td>${data.rsm_emp_code}</td>
                            <td>${data.rsm_email_id}</td>
                            <td>${data.rsm_mobile_no}</td>
                            <td>${data.me_fs_code}</td>
                            <td>${data.me_emp_code}</td>
                            <td>${data.hq_name}</td>
                            <td>${data.hq_code}</td>
                            <td>${data.hcp_garnet_code}</td>
                            <td>${data.dr_pan_no}</td>
                            <td>${data.dr_reg_no}</td>
                            <td>${data.dr_speciality}</td>
                            <td>${data.dr_qualification}</td>
                            <td>${data.no_of_years_of_experiance}</td>
                            <td>${data.therapy}</td>
                            <td>${data.address}</td>
                            <td>${data.place}</td>
                            <td>${data.pincode}</td>
                            <td>${data.state}</td>
                            <td>${data.hcp_sap_vendor_code}</td>
                            <td>${data.hcp_unique_code}</td>
                            <td>${data.cost_center_code}</td>
                            <td>${data.order_no}</td>
                            <td>${data.region}</td>
                            <td>${data.doctor_amount || '-'}</td>
                            <td>${data.patient_count || '-'}</td>
                        </tr>
                    `;

                    // Insert rows into the table body
                    $('#contractDetailsTbody').html(tableRows);
                    if(Type=='old_data'){
                        $('#contractModalTitle').text('Previous Contract Details');
                    }else if(Type=='new_data'){
                        $('#contractModalTitle').text('Current Contract Details');
                    }

                    // Show the modal
                    $('#contract_letter').modal('show');
                } else {
                    $.notify('Error loading email content', 'error');
                }
            }
        });
    });
    $(function() {
        var columns = [{
                data: 'DT_RowIndex',
                name: 'DT_RowIndex',
                searchable: false,
                orderable: false
            },
            {
                data: 'doctor_central_code',
                name: 'doctor_central_code',
            },
            {
                data: 'old_data',
                name: 'old_data',
                searchable: false
            },
            {
                data: 'new_data',
                name: 'new_data',
                searchable: false
            },
            {
                data: 'created_by',
                name: 'created_by'
            },
            {
                data: 'created_at',
                searchable: false
            }
        ];
        var columnDefs = [
            // {
            //     'targets': 0,
            //     'checkboxes': {
            //         'selectRow': true,
            //     }
            // }
        ];
        getdatatable("{{ route('Contract.contractUpdatePaginate') }}", columns, columnDefs);
    });

    function getdatatable(url, columns, columnDefs) {

        $('#datatable').DataTable({
            processing: true,
            serverSide: true,
            bDestroy: true,
            order: [],
            "scrollX": true,
            columns: columns,
            columnDefs: columnDefs,
            ajax: {
                method: 'post',
                url: url,
                data: function(d) {
                    d._token = "{{ csrf_token() }}",
                    d.doctor_central_code = "{{ $doctor_central_code }}"
                }
            }
        });
    }
</script>