<?php include 'controller/pageCode.php' ?>
<!DOCTYPE html>
<html lang="en">
 <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<head>
    <meta charset="utf-8">
    <title>Approvals</title>
    <?php include 'inc/meta_inc.php'; ?>
    <!-- base css -->
    <?php include 'inc/styles_inc.php'; ?>
    <link rel="stylesheet" media="screen, print" href="assets/css/markdown.css">
    <link rel="stylesheet" media="screen, print" href="assets/css/datagrid/datatables/datatables.bundle.css">
</head>
    <body class="mod-bg-1 ">
        <!-- DOC: script to save and load page settings -->
        <?php include 'inc/theme_script_inc.php'; ?>
        <!-- BEGIN Page Wrapper -->
        <div class="page-wrapper" id="app">
            <div class="page-inner">
                <!-- BEGIN Left Aside -->
        <?php include 'inc/aside_inc.php'; ?>
<!-- END Left Aside -->
                <div class="page-content-wrapper">
                    <!-- BEGIN Page Header -->
        <?php include 'inc/header_inc.php'; ?>
<!-- END Page Header -->
                    <!-- BEGIN Page Content -->
                    <!-- the #js-page-content id is needed for some plugins to initialize -->
                    <main id="js-page-content" role="main" class="page-content">
                        <ol class="breadcrumb page-breadcrumb">
                            <li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
                        </ol>
                        <div class="row">
                        <div class="col-xl-12">
                                <div id="panel-1" class="panel">
                                    <div class="panel-hdr">
                                        <h2>
                                            Approval Request <span class="fw-300"><i></i></span>
                                        </h2>
                                        <div class="panel-toolbar"></div>
                                    </div>
                                    <div class="panel-container show">
                                        <div class="panel-content">
                                            <ul class="notification">
                                                <?php if($system_request_notification):?>
                                                    <?php foreach($system_request_notification as $srn):?>
                                                        <?php if($srn['type']=="Request"):?>
                                                        <li class="unread">
                                                            <div class="d-flex align-items-center show-child-on-hover">
                                                                <span class="d-flex flex-column flex-1">
                                                                    <span class="name d-flex align-items-center"><?php echo $srn['notification_title'] ?> <span class="badge badge-success fw-n ml-1">New Request</span></span>
                                                                    <span class="msg-a fs-sm">
                                                                        <?php echo $srn['notification_message'] ?>
                                                                    </span>
                                                                    <span class="fs-nano text-muted mt-1"><?php echo time_elapsed_string($srn['notification_created_at'],false) ?></span>
                                                                </span>
                                                                <div class="show-on-hover-parent position-absolute pos-right pos-bottom p-3" id="requests_btn_section-<?php echo $srn['notification_id'] ?>">
                                                                <a href="#" class="btn btn-xs btn-info" title="View" data-toggle="modal" id="main-view_orders-<?php echo $srn['notification_id'] ?>" data-target="#main-modal-view_item_request-<?php echo $srn['notification_id'] ?>"><i class="fal fa-eye"></i> View</a>
                                                                </div>
                                                                <div class="show-on-hover-parent position-absolute pos-right d-none pos-bottom p-3" id="requests_info_section-<?php echo $srn['notification_id'] ?>"></div>
                                                            </div>
                                                        </li>
                                                        <?php endif?>
                                                <script>
                                                    

                                                    $(document).on('click','#main-view_orders-<?php echo $srn['notification_id'] ?>',function(){
                                                        $('.order_content').html('');
                                                        var item_request_id = "<?php echo $srn['type_id'] ?>";
                                                        var serverData = {
                                                            item_request_id:item_request_id,
                                                            get_request_details:''
                                                        }
                                                        console.log(serverData)
                                                        $.post('controller/requestCode.php',serverData,function(serverResponse){
                                                            var order_details_template = '';
                                                            if(serverResponse){
                                                                var response = JSON.parse(serverResponse);
                                                                var summary = '';
                                                                if(response.data != "empty"){
                                                                    
                                                                    $.each(response.data, function(key,value) {
                                                                        var order_details_template = `
                                                                        <li>
                                                                            <span style="font-weight:bolder;">${value.item_name}</span> -> <span style="font-weight:bolder;">Qty:${value.qty}</span> -> 
                                                                            <span style="font-weight:bolder;">Px:₵${value.px}</span> <br>
                                                                            <span style="font-weight:bolder;">Cateogry</span>: <span>${value.item_category_name}</span> | <span style="font-weight:bolder;">Level</span>: <span>${value.item_level_name}</span>
                                                                            <span style="font-weight:bolder;">Type</span>: <span>${value.item_type_name}</span>
                                                                            </li>
                                                                        <hr>
                                                                        `;
                                                                        var summary = `
                                                                        <span style="font-weight:bolder;">Discount:${value.discount}%</span> <span style="font-weight:bolder;">Commission:${value.commission}%</span> <span style="font-weight:bolder;">Tax:${value.tax}%</span></br>
                                                                        <span style="font-weight:bolder;">Amount Due:₵${value.item_request_amount}</span><hr>
                                                                        `;
                                                                        $('#order_content-<?php echo $srn['notification_id'] ?>').append(order_details_template);
                                                                        $('#summary-<?php echo $srn['notification_id'] ?>').html(summary);
                                                                        var decline_button = `<button name="<?php echo $srn['type_id'] ?>" class="btn btn-xs btn-danger mr-1" id="decline_button-<?php echo $srn['notification_id'] ?>">Decline</button>`;
                                                                        var approval_button = `<button name="<?php echo $srn['type_id'] ?>" class="btn btn-xs btn-success mr-1" id="approval_button-<?php echo $srn['notification_id'] ?>">Approve</button>`;
                                                                        $('#summary-<?php echo $srn['notification_id'] ?>').append(decline_button);
                                                                        $('#summary-<?php echo $srn['notification_id'] ?>').append(approval_button);
                                                                    }); 
                                                                    
                                                                }
                                                            }
                                                        });

                                                        let main_r_btn_template = `
                                                    <div class="process">
                                                        <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
                                                        <span class="sr-only"> ...</span>
                                                    </div> `;
                                                    $(document).on('click','#approval_button-<?php echo $srn['notification_id'] ?>',function(){
                                                        $('#approval_button-<?php echo $srn['notification_id'] ?>').html(main_r_btn_template);
                                                        var item_request_id = $(this).attr('name');
                                                        var serverData = {
                                                            approve_item_request:'',
                                                            item_request_id:item_request_id
                                                        }
                                                        $.post('controller/requestCode.php',serverData,function(serverResponse){
                                                            console.log(serverResponse)
                                                            if(serverResponse){
                                                                var response = JSON.parse(serverResponse);
                                                                if(response.data=="success"){
                                                                    // $('#view_item_request2').modal('hide');
                                                                    $('#approval_button-<?php echo $srn['notification_id'] ?>').html('Approve');
                                                                    $('#approval_button-<?php echo $srn['notification_id'] ?>').prop('disabled', true);
                                                                    $('#decline_button-<?php echo $srn['notification_id'] ?>').prop('disabled', true);
                                                                    $('#requests_info_section-<?php echo $srn['notification_id'] ?>').removeClass('d-none');
                                                                    $('#requests_info_section-<?php echo $srn['notification_id'] ?>').html('<span style="color:teal;">Approved</span>');
                                                                    $('#requests_btn_section-<?php echo $srn['notification_id'] ?>').addClass('d-none');
                                                                    toastr.success('Request Accepted Successfully.', 'Admin');
                                                                    toastr.clear()
                                                                }else if(response.data=="fail"){
                                                                    $('.approval_button-<?php echo $srn['notification_id'] ?>').html('Approve');
                                                                    toastr.warning('Action Failed!', 'Admin');
                                                                    toastr.clear()
                                                                }else{
                                                                    $('.approval_button-<?php echo $srn['notification_id'] ?>').html('Approve');
                                                                    toastr.error('Internal Error!', 'Admin');
                                                                    toastr.clear()
                                                                }
                                                            }
                                                        });
                                                    });
                                                    
                                                    $(document).on('click','#decline_button-<?php echo $srn['notification_id'] ?>',function(){
                                                        $('#decline_button-<?php echo $srn['notification_id'] ?>').html(main_r_btn_template);
                                                        var item_request_id = $(this).attr('name');
                                                        var serverData = {
                                                            decline_item_request:'',
                                                            item_request_id:item_request_id
                                                        }
                                                        $.post('controller/requestCode.php',serverData,function(serverResponse){
                                                            // console.log(serverResponse)
                                                            if(serverResponse){
                                                                var response = JSON.parse(serverResponse);
                                                                if(response.data=="success"){
                                                                    $('#decline_button-<?php echo $srn['notification_id'] ?>').html('Decline');
                                                                    $('#approval_button-<?php echo $srn['notification_id'] ?>').prop('disabled', true);
                                                                    $('#decline_button-<?php echo $srn['notification_id'] ?>').prop('disabled', true);
                                                                    $('#requests_info_section-<?php echo $srn['notification_id'] ?>').removeClass('d-none');
                                                                    $('#requests_info_section-<?php echo $srn['notification_id'] ?>').html('<span style="color:darkred;">Declined</span>');
                                                                    $('#requests_btn_section-<?php echo $srn['notification_id'] ?>').addClass('d-none');
                                                                    toastr.success('Request Decline Successfully.', 'Admin');
                                                                    toastr.clear()
                                                                }else if(response.data=="fail"){
                                                                    $('#decline_button-<?php echo $srn['notification_id'] ?>').html('Decline');
                                                                    toastr.warning('Action Failed!', 'Admin');
                                                                    toastr.clear()
                                                                }else{
                                                                    $('#decline_button-<?php echo $srn['notification_id'] ?>').html('Decline');
                                                                    toastr.error('Internal Error!', 'Admin');
                                                                    toastr.clear()
                                                                }
                                                            }
                                                        });
                                                    });


                                                    });
                                                </script>
                                                <!-- Modal center Small -->
                                                <div class="modal fade" id="main-modal-view_item_request-<?php echo $srn['notification_id'] ?>" tabindex="-1" role="dialog" aria-hidden="true">
                                                    <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                                                        <div class="modal-content">
                                                            <div class="modal-header">
                                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                    <span aria-hidden="true"><i class="fal fa-times"></i></span>
                                                                </button>
                                                            </div>
                                                            <div class="modal-body" style="">
                                                                <center><h5 class="modal-title" style="font-weight:bolder">Item Request Details</h5></center>
                                                                <hr>
                                                                        <div class="row">
                                                                            <div class="col-md-2" style=""></div>
                                                                            <div class="col-md-8" style="">
                                                                            <ol id="order_content-<?php echo $srn['notification_id'] ?>"></ol><hr>
                                                                            <center>
                                                                            <div id="summary-<?php echo $srn['notification_id'] ?>">
                                                                            
                                                                            </div>
                                                                            </center>
                                                                            </div>
                                                                            <div class="col-md-2" style=""></div>
                                                                        </div>
                                                            </div>
                                                            <!-- <div class="modal-footer">
                                                                
                                                            </div> -->
                                                        </div>
                                                    </div>
                                                </div>
                                                    <?php endforeach ?>
                                                <?php endif ?>
                                                <script>
                                                    
                                                </script>
                                            </ul>
                                            
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl-12">
                                <div id="panel-1" class="panel">
                                    <div class="panel-hdr">
                                        <h2>
                                            All Approvals <span class="fw-300"><i></i></span>
                                        </h2>
                                        <div class="panel-toolbar"></div>
                                    </div>
                                    <div class="panel-container show">
                                        <div class="panel-content">
                                            <!-- <div class="panel-tag">
                                              
                                            </div> -->
                                            <!-- datatable start -->
                                            <table id="dt-basic-example" class="table table-bordered table-hover table-striped w-100"></table>
                                            <!-- datatable end -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </main>
                    <!-- END Page Content -->
                    <!-- this overlay is activated only when mobile menu is triggered -->
<div class="page-content-overlay" data-action="toggle" data-class="mobile-nav-on"></div>
<!-- BEGIN Page Footer -->
<?php include 'inc/footer_inc.php' ?>
<!-- END Page Footer -->
<!-- BEGIN Shortcuts -->
<!-- modal shortcut -->
<?php //include 'inc/header_menu.php'; ?>
 <!-- END Shortcuts -->
                </div>
            </div>
        </div>
        <!-- END Page Wrapper -->
        <!-- BEGIN Quick Menu -->
<!-- to add more items, please make sure to change the variable '$menu-items: number;' in your _page-components-shortcut.scss -->
<nav class="shortcut-menu d-none d-sm-block">
    <input type="checkbox" class="menu-open" name="menu-open" id="menu_open" />
    <label for="menu_open" class="menu-open-button ">
        <span class="app-shortcut-icon d-block"></span>
    </label>
    <a href="#" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Scroll Top">
        <i class="fal fa-arrow-up"></i>
    </a>
    <a href="login/logout.php" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Logout">
        <i class="fal fa-sign-out"></i>
    </a>
    <a href="#" class="menu-item btn" data-action="app-fullscreen" data-toggle="tooltip" data-placement="left" title="Full Screen">
        <i class="fal fa-expand"></i>
    </a>
    <a href="#" class="menu-item btn" data-action="app-print" data-toggle="tooltip" data-placement="left" title="Print page">
        <i class="fal fa-print"></i>
    </a>
</nav>
<!-- END Quick Menu -->
<!-- BEGIN Page Settings -->
 <!-- END Page Settings -->
<?php include 'inc/script_inc.php' ?>
        <script src="assets/js/datagrid/datatables/datatables.bundle.js"></script>
        <script>
            $(document).ready(function()
            {
                // Event Lot
                var events = $("#app-eventlog");

                // Column Definitions
                var columnSet = [
                {
                    title: "RowId",
                    id: "item_request_id",
                    data: "item_request_id",
                    placeholderMsg: "Server Generated ID",
                    "visible": false,
                    "searchable": false,
                    type: "readonly"
                },
                {
                    title: "Company",
                    id: "customer_company",
                    data: "customer_company",
                    type: "text",
                    placeholderMsg: "Company",
                    unique: false,
                    required: true
                },
                {
                    title: "Received By",
                    id: "customer_name",
                    data: "customer_name",
                    type: "text",
                    placeholderMsg: "Received By",
                    unique: false,
                    required: true
                },
                {
                    title: "Approved By",
                    id: "employee_name",
                    data: "employee_name",
                    type: "text",
                    placeholderMsg: "Approved By",
                    unique: false,
                    required: true
                },
                {
                    title: "Quantity",
                    id: "item_request_quantity",
                    data: "item_request_quantity",
                    type: "text",
                    placeholderMsg: "Quantity",
                    unique: false,
                    required: true
                },
                {
                    title: "Amount to Pay ₵",
                    id: "item_request_amount",
                    data: "item_request_amount",
                    type: "text",
                    placeholderMsg: "Apount to Pay",
                    unique: false,
                    required: true
                },
                {
                    title: "Amount Paid ₵",
                    id: "amount_paid",
                    data: "amount_payed",
                    type: "text",
                    placeholderMsg: "Apount to Pay",
                    unique: false,
                    required: true
                },
                {
                    title: "Commission%",
                    id: "commission",
                    data: "commission",
                    type: "text",
                    placeholderMsg: "Commission",
                    unique: false,
                    required: true
                },
                {
                    title: "Commission₵",
                    id: "commission_value",
                    data: "commission_value",
                    type: "readonly",
                    placeholderMsg: "Commission Value",
                    unique: false,
                    required: true
                },
                {
                    title: "Discount%",
                    id: "discount",
                    data: "discount",
                    type: "text",
                    placeholderMsg: "Discount",
                    unique: false,
                    required: true
                },
                {
                    title: "Tax%",
                    id: "tax",
                    data: "tax",
                    type: "text",
                    placeholderMsg: "Tax%",
                    unique: false,
                    required: true
                },
                {
                    title: "Requested On",
                    id: "item_request_datetime",
                    data: "item_request_datetime",
                    type: "text",
                    placeholderMsg: "Requested On",
                    unique: false,
                    required: true
                },
                {
                    title: "Completed",
                    id: "completed",
                    data: "completed",
                    type: "readonly"
                },
                {
                    title: "Return Qty ",
                    id: "items_returned",
                    data: "items_returned",
                    type: "readonly"
                },
                {
                    title: "Return Worth ₵",
                    id: "refund",
                    data: "refund",
                    type: "readonly"
                },
                {
                    title: "Action",
                    id: "item_request_id",
                    data: "item_request_id",
                    type: "text",
                    unique: false,
                    required: true
                },
                
            ]
                /* start data table */
                var myTable = $('#dt-basic-example').dataTable(
                {
                    /* check datatable buttons page for more info on how this DOM structure works */
                    dom: "<'row mb-3'<'col-sm-12 col-md-6 d-flex align-items-center justify-content-start'f><'col-sm-12 col-md-6 d-flex align-items-center justify-content-end'B>>" +
                        "<'row'<'col-sm-12'tr>>" +
                        "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
                    ajax: "controller/requestCode.php?all_approved_requests",
                    columns: columnSet,
                    /* selecting multiple rows will not work */
                    select: 'single',
                    /* altEditor at work */
                    altEditor: true,
                    responsive: true,
                    pageLength: 15,
                    order: [
                        [8, 'desc']
                    ],
                    /* buttons uses classes from bootstrap, see buttons page for more details */
                    buttons: [
                    {
                        extend: 'colvis',
                        text: 'Column Visibility',
                        titleAttr: 'Col visibility',
                        className: 'btn-xs btn-outline-default'
                    },
                    {
                        text: '<i class="fal fa-sync mr-1"></i> Refresh',
                        name: 'refresh',
                        className: 'btn-xs btn-primary btn-sm'
                    }],
                    columnDefs: [
                        {
                            targets: 5,
                            render: function(data, type, full, meta)
                            {
                                
                                return '<span class="badge badge-xs badge-primary">'+data+'</span>';
                            }
                            
                        },
                        {
                            targets: 6,
                            render: function(data, type, full, meta)
                            {
                                
                                return '<span class="badge badge-xs badge-warning">'+data+'</span>';
                            }
                            
                        },
                        {
                            targets: 12,
                            render: function(data, type, full, meta)
                            {
                                
                                if(data=="Yes"){
                                    return '<span class="badge badge-xs badge-success">'+data+'</span>';
                                }else if(data=="No"){
                                    return '<span class="badge badge-xs badge-warning">'+data+'</span>';
                                }
                            }
                            
                        },
                        {
                            targets: 15,
                            render: function(data, type, full, meta)
                            {
                                
                                return '<a href="invoice.php?view_invoice=&&id='+data+'" class="btn btn-xs btn-secondary">Invoice</a>';
                            }
                            
                        }
                    ],

                    /* default callback for insertion: mock webservice, always success */
                    onAddRow: function(dt, rowdata, success, error)
                    {
                        let process = `Please Wait
                            <div class="spinner-grow spinner-grow-sm text-light">
                            <span class="sr-only"> ...</span>
                        </div>
                        `;
                        $('#addRowBtn').html(process);
                        rowdata['add_role'] = '';
                        //success(rowdata);
                        $.post('controller/roleCode.php',rowdata,function(serverResponse){
                            console.log(serverResponse)
                            if(serverResponse){
                                let response = JSON.parse(serverResponse);
                                if(response.data=="success"){
                                    $('#addRowBtn').html("Add");
                                    $('#dt-basic-example').DataTable().ajax.reload();
                                    $('.modal').modal('hide');
                                    Swal.fire(
                                    {
                                        type: "success",
                                        title: "Role Created",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else if(response.data=="fail"){
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Action Failed",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else{
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Internal Error!",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }
                            }
                        });
                        // demo only below:
                        events.prepend('<p class="text-success fw-500">' + JSON.stringify(rowdata, null, 4) + '</p>');
                    },
                    onEditRow: function(dt, rowdata, success, error)
                    {
                        
                        success(rowdata);
                        rowdata['update_role'] = '';
                        //success(rowdata);
                        $.post('controller/roleCode.php',rowdata,function(serverResponse){
                            console.log(serverResponse)
                            if(serverResponse){
                                let response = JSON.parse(serverResponse);
                                if(response.data=="success"){
                                    Swal.fire(
                                    {
                                        type: "success",
                                        title: "Role Updated",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else if(response.data=="fail"){
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Action Failed",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else{
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Internal Error!",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }
                            }
                        });
                        // demo only below:
                        events.prepend('<p class="text-info fw-500">' + JSON.stringify(rowdata, null, 4) + '</p>');
                    },
                    onDeleteRow: function(dt, rowdata, success, error)
                    {
                        
                        success(rowdata);
                        rowdata['remove_role'] = '';
                        //success(rowdata);
                        $.post('controller/roleCode.php',rowdata,function(serverResponse){
                            console.log(serverResponse)
                            if(serverResponse){
                                let response = JSON.parse(serverResponse);
                                if(response.data=="success"){
                                    Swal.fire(
                                    {
                                        type: "success",
                                        title: "Role Removed",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else if(response.data=="fail"){
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Action Failed",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }else{
                                    Swal.fire(
                                    {
                                        type: "error",
                                        title: "Internal Error!",
                                        showConfirmButton: false,
                                        timer: 2500
                                    });
                                }
                            }
                        });

                        // demo only below:
                        events.prepend('<p class="text-danger fw-500">' + JSON.stringify(rowdata, null, 4) + '</p>');
                    },
                });
            });
            
        </script>
<!-- Modal Large -->
    </body>

</html>
