@extends('adminlte::page')
@section('css')
<style>
    .modal-info input {
        width: 100%;
        border: none
    }

    .modal-info input::before {
        content: ":" !important;
    }
    table head th,table head{
        position: sticky !important;
    }
</style>
@stop
@section('content')
<?php Fun::lang() ?>
<div class="title-add">
    <div class="page-bar">
        <ul class="page-breadcrumb">
            <li> <a class="ng-binding" href="#"><i class="fa fa-dashboard"></i> Dashboard</a> </li>
            <li><a href="#">Setting</a></li>
            <li><a href="#">Payment Policy Detail</a></li>
        </ul>
    </div>
</div>
<div class="page">
    <div class="top-content">
        <div class="row">
            <div class="col-sm-12 col-xs-12">
                <div class="title-add">
                    <div class="pull-left">
                        <h3>Payment Policy List Detail</h3>
                    </div>
                </div>
                <div class="pull-right">
                    <a class="button_sm button_primary" href="{{ route('payment-policy-detail.create') }}" data-toggle="modal"><span class="fa fa-plus"></span>  Create New</a>
                </div>
            </div>
        </div>
    </div>
    <div class="box-body table-responsive">  
        <table id="datatable_report_booking" class="table table-striped table-bordered table-hover nowrap" width="100%">
            <thead>
                <tr width="100%">
                    <th>NO</th>
                    <th>Policy Name</th>
                    <th>Policy Detail Name</th>
                    <th>Item Category</th>
                    <th>Item Sub Category</th>
                    <th>Description</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                {!!$data!!}
            </tbody>
        </table>
    </div>
</div>
@endsection
@section('js')
    <script type="text/javascript">
            function edit(obj)
            {
                var id = $(obj).data("id");
                var name = $(obj).data("name");
                var description = $(obj).data("description");
                var policy_id = $(obj).data("policy_id");

                    $("#edit-payment-policy").modal("show");
                    $("#name").val(name);
                    $('.policy_id option[value="'+policy_id+'"]').attr('selected',true);
                    $('.policy_id').select2();
                    $("#description").val(description);
                    $("#id").val(id);
                
            }
            $(document).ready(function() {
                $('.main-spinner').show();
                $('#datatable_report_booking').DataTable(
                {"scrollY":"500px",
                    "scrollCollapse": true,
                });
            });
            function delete_promotion_detail(obj)
            {
                var id = $(obj).data("id");
                $.confirm({
                    title:'Are you sure ?',
                    content:'',
                    theme:'modern',
                    buttons:{
                        cancel:{
                            btnClass:'btn btn-primary',
                            text:'Cancel',
                            action:function () {

                            }
                        },
                        submit:{
                            btnClass:'btn btn-danger',
                            text:"Delete",
                            action:function () {
                                    window.location.replace('{{route("payment-policy-detail.delete")}}?id='+id);
                            }
                        },
                    },
                });
            }
    </script>
@endsection