<style>
    .user_reg_form{
        margin: auto;
        /* display: flex; */
        /* text-align: center; */
    }
</style>
<h1>Регистрация пользователя</h1>
<form action="#" class="user_reg_form">
    <div style="display: flex;justify-content: space-between;">
        <input type="password" id="pass" name="pass" value="" placeholder="Пароль" class="btn_white" style="text-align: center;">
        <input type="text" id="login" name="login" value="" placeholder="Логин" class="btn_white" style="text-align: center; padding-inline: 5vw;">
        <input type="submit" onclick='reg();' value="Зарегистрировать" class="btn_blue">
        <div>
            <label for="admin_check" style="margin: auto;">Админ. привелегии</label>
            <input type="checkbox" name="admin" value='false' id="admin_check" onchange="admin_ch()">
        </div>
    </div>
    <div id="right_checks" style="display: none;justify-content: space-evenly;">
        <div>
            <input type="checkbox" name="admin" value='false' id="admin_user_check" onchange="right_calc()">
            <label for="admin_user_check">Право на изменение обьектов</label>
        </div>
        <div>
            <input type="checkbox" name="admin" value='false' id="admin_obj_check" onchange="right_calc()">
            <label for="admin_obj_check">Право на изменение пользователей</label>
        </div>
    </div>
    <div id="reg_response"></div>
</form>

<script>
    let rights = 0;

    clear_checks();
    function clear_checks(){
        let check = document.getElementById("admin_check");
        let obj_right = document.getElementById("admin_obj_check");
        let user_right = document.getElementById("admin_user_check");
        let checks = [check,obj_right,user_right];
        checks.forEach(ch => {
            ch.checked = false;
            rights = 0;
        });
    }

        function admin_ch(){
            let check = document.getElementById("admin_check").checked;
            let right_checks = document.getElementById("right_checks");
            let obj_right = document.getElementById("admin_obj_check");
            let user_right = document.getElementById("admin_user_check");
            if (check){
                right_checks.style.display = "flex";
            }
            else{
                right_checks.style.display = "none";
                clear_checks();
            }
        }

        function right_calc(){
            let obj_right = document.getElementById("admin_obj_check").checked;
            let user_right = document.getElementById("admin_user_check").checked;
            if(obj_right & user_right){
                rights = 3;
            }
            else if(obj_right){
                rights = 1;
            }
            else if(user_right){
                rights = 2;
            }
        }

        function reg(){
            console.log("reg");
            let login = document.getElementById("login").value;
            let pass = document.getElementById("pass").value;
            let admin = document.getElementById("admin_check").checked;
            // console.log(login,pass,admin);
            // console.log("cl reg");
            if(login != ""&&pass!=""){
                $.post( "/admin/users/new", { login:login,pass:pass,admin:admin,rights:rights })
                .done(function( res ) {
                    // console.log("serv reg");
                    if(res["out"] == "good"){
                        // console.log(res["body"]);
                        msg(`Пользователь ${login} успешно добавлен`)
                        load_users_data(users_from);

                    }
                    else if (res["out"] == "bad"){
                        msg(`Пользователь с логином ${login} уже существует`)
                    }
                });
            }
        }
</script>