<?php

//Template Name: user-list
if (isset($_REQUEST['edit'])):
//    var_dump($_REQUEST);
    $uid = $_REQUEST['id'];
    $action = $_REQUEST['action'];
    $content = $_REQUEST['content'];
    if ($action == "name"):
        $res = update_user_meta($uid,"nickname", $content);
    elseif ($action == "remark"):
        $res = update_user_meta($uid,"remark", $content);
    endif;
    if ($res == false):
        echo(1);
    else:
        echo(0);
    endif;
else:
    $users = get_users(array("orderby"=>"ID"));
    //var_dump($users);
    $roles = $wp_roles->roles;
    $current_user = wp_get_current_user();
    $current_role = $current_user->roles[0];
    $current_uid = $current_user->ID;
    if (!($current_uid > 0)){
        echo("<button class='btn-default'>前往登入</button><br><br>");
    } else {
        echo("<div><h4>當前用戶： ".$current_user->display_name."</h4></div>");
    }
    $can_edit = $current_role == "administrator";
    //var_dump($current_role);
    ?>
    <style>
        body{
            padding:2em;
        }
        #snackbar {
            visibility: hidden;
            min-width: 250px;
            margin-left: -125px;
            background-color: #333;
            color: #fff;
            text-align: center;
            border-radius: 2px;
            padding: 16px;
            position: fixed;
            z-index: 1;
            left: 50%;
            top: 30px;
            font-size: 17px;
        }

        #snackbar.show {
            visibility: visible;
            -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
            animation: fadein 0.5s, fadeout 0.5s 2.5s;
        }

        @-webkit-keyframes fadein {
            from {
                top: 0;
                opacity: 0;
            }
            to {
                top: 30px;
                opacity: 1;
            }
        }

        @keyframes fadein {
            from {
                top: 0;
                opacity: 0;
            }
            to {
                top: 30px;
                opacity: 1;
            }
        }

        @-webkit-keyframes fadeout {
            from {
                top: 30px;
                opacity: 1;
            }
            to {
                top: 0;
                opacity: 0;
            }
        }

        @keyframes fadeout {
            from {
                top: 30px;
                opacity: 1;
            }
            to {
                top: 0;
                opacity: 0;
            }
        }
    </style>
    <link href="<?php echo(get_template_directory_uri())?>/css/bootstrap.min.css" rel="stylesheet" media="screen">
    <script src="<?php echo(get_template_directory_uri())?>/js/jquery.js"></script>
    <div id="snackbar">修改成功</div>
    <table class="table table-striped table-bordered">
        <tr><th>ID</th><th>名稱</th><th>賬戶</th><th>角色</th><th>備註</th></tr>

    <?php
    foreach ($users as $user){
        $role = $user->roles[0];
        $role_name = $roles[$role]['name'];
        $uid = $user->ID;
        $can_edit |= ($uid == $current_uid);
    //    var_dump($role);
        if (!in_array($role, array("company","accountant","director","owners","owners_read",""))){
            continue;
        }
        $name = $user->nickname;
        $account = $user->user_login;
        $remark = get_user_meta($uid, "remark", true);
        if ($can_edit){
            echo("<tr><td>$uid</td><td><input class='form-control' id='name_$uid' value='$name'></td><td>$account</td><td>$role_name</td><td><input class='form-control' id='remark_$uid' value='$remark'></td></tr>");
        } else {
            echo("<tr><td>$uid</td><td>$name</td><td>$account</td><td>$role_name</td><td>$remark</td></tr>");
        }

    }

    ?>
    </table>

    <?php
    if ($can_edit):;?>
        <script>
            let toast_div = $("#snackbar");
            $("input").change(function (e) {
                let target = e.target;
                let id = target.id;
                let action = id.split("_");
                let content = target.value;
                console.log(action);
                $.ajax({
                    url:"<?php echo(home_url()."/user-list?edit=1")?>",
                    data: {
                        action: action[0],
                        id: action[1],
                        content: content
                    }

                }).done(function (res) {
                    console.log(res);
                    if (res === "0"){
                        toast_div.html("修改成功");
                        toast();
                    } else {
                        toast_div.html("修改失敗");
                        toast();
                    }
                });
            });
            let toast = function() {
                let x = document.getElementById("snackbar");
                x.className = "show";
                setTimeout(function() {
                    x.className = x.className.replace("show", "");
                }, 2000);
            };
        </script>
    <?php 
    else:?>
        <script>
            $("button").click(function () {
                let win = window.open('http://keylab.cc/admin','_blank');
                console.log(win);
                setTimeout(function () {
                    alert("登入完成後按此刷新頁面");
                    let refresh = location.reload();
                }, 1000);
            });
        </script>
    <?php 
    endif;
endif;