@php


    $children = App\Http\Controllers\Pages\UserListPageController::ListChildrenofCurrentUser();
    $child_script = "child_users =  $children;";




@endphp

<script>
    if (typeof child_users === 'undefined') {
        let child_users = false;
    }
    {!! $child_script !!}



</script>

<br><br><br><br>
<div class="card" id="secondary-card" style="display:none;">
    <div class="card-header ui-sortable-handle" style="cursor: move;">
        <h3 class="card-title">Users</h3>
        <div class="card-tools"></div>
    </div>
    <div class="card-body">

        <table id="User_list_table">
            <thead>
                <tr>
                    <th>Number /<br>Nickname</th>
                    <th>Total Balance</th>
                    <th>Type</th>
                    <th>
                        <center>Active</center>
                    </th>
                </tr>
            </thead>
            <tbody id="user-list-table-body">

            </tbody>
        </table>


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




<script>


    window.disableduser_checkbox ||= '<img class="icon-box" style="width:40px;height:40px" src="/assets/checkmark.png">';
    window.enableduser_checkbox ||= '<img class="icon-box" style="width:40px;height:40px" src="/assets/uncheck.png">';




    function GenerateUserRow(Number, Total_Balance, Type, Active, Hashkey) {
        let activecheckbox = '';

        if (Active === '1' || Active === 1) {
            Active = true;
        } else { Active = false; }


        if (Active) {
            activecheckbox = enableduser_checkbox;
        } else {
            activecheckbox = disableduser_checkbox;
        }

        const actionbutton = `<button class="btn btn-warning" onclick="gotoPage('UserModify','${Hashkey}')">View User</button>`;
        let numandnick = Number;
        numandnick = numandnick.replace('----', '<br>');
        numandnick = numandnick.replace('----', '<br>');
        numandnick = `<a href="#" onclick="gotoPage('UserModify','${Hashkey}');return false;">${numandnick}</a>`;
        if (Type == 'user') { Type = 'Player'; }
        if (Type == 'usher') { Type = 'Leader'; }
        if (Type == 'coordinator') { Type = 'Team Leader'; }
        return `<tr>
      <td>${numandnick}</td>
      <td>${Total_Balance}</td>
      <td>${Type}</td>
      <td>${activecheckbox}</td>
        </tr>`;
    }




    async function GenerateUserRows(responsearray) {
        // console.log(responsearray);
        let newhtmltable = '';

        for (let i = 0; i < responsearray.length; i++) {

            newhtmltable += GenerateUserRow(
                responsearray[i]['mobile_number'],
                responsearray[i]['total_balance'],
                responsearray[i]['acct_type'],
                responsearray[i]['active'],
                responsearray[i]['hashkey']
            );
        }

        //$("#User_list_table").find("tbody").replaceWith(newhtmltable);
        // new DataTable('#User_list_table');


        $("#User_list_table").find("tbody").html(newhtmltable);



        let userlist = $("#User_list_table").DataTable({
            "destroy": true,
            order: [[0, 'desc']],
            pageLength: 5,
            lengthMenu: [[5], [5]]
        });



        userlist.on('click', 'tbody tr', function () {
            let data = userlist.row(this).data();
            if (typeof data === 'undefined') { return false; }
            let targettranshash = data[0];
            // console.log(targettranshash);
            $(targettranshash).find('a').trigger('click');


        });

        $('#secondary-card').fadeIn(200);

    }


    function GenerateUserTable() {
        let REQQ = new RequestData(false);
        REQQ.url('/admin/users/list').type('POST').success((response) => {
            GenerateUserRows(response);
        }).go();
        // AjaxDo('?/admin/users/list', null, GenerateUserRows, null, reqtype = 'POST');
    }

    if (child_users) {
        GenerateUserRows(child_users);
    }

    GenerateUserTable();


    changeTopbarTitle('Users');





</script>