<?php include($_SERVER['DOCUMENT_ROOT'] . "/COMPONENTS/root/path.php"); ?>
<div class="p-3">
    <div class="text-center">
    <a href="<?php echo $website_name; ?>"> <img src="<?php echo $website_name; ?>/assets/images/<?php echo $image;?>" width="350px" alt="wrapkit"></a>
    </div>
    <h2 class="mt-3 text-center">Sign Up</h2>
    <p class="text-center">Enter you signu details</p>
    <form method='POST' action='' id='form_signup' autocomplete='off' validate>
        <div class="row">
            <div class="col-lg-12">
                <div class="form-group">
                    <select class="form-control" name="role" id="role">
                        <option value="Super Admin">Super Admin</option>
                        <!-- <option value="Admin">Admin</option>
                        <option value="Agent">Agent</option>
                        <option value="Employer">Employer</option> -->
                    </select>
                </div>
            </div>
            <div class="col-lg-12">
                <div class="form-group">
                    <input class="form-control" id="first_name" name="first_name" type="text" placeholder="enter your first name">
                </div>
            </div>
            <div class="col-lg-12">
                <div class="form-group">
                    <input class="form-control" id="last_name" name="last_name" placeholder="enter your last name">
                </div>
            </div>

            <div class="col-lg-12">
                <div class="form-group">
                    <input class="form-control" id="email" name="email" type="email" placeholder="enter your email">
                </div>
            </div>

            <div class="col-lg-12">
                <div class="form-group">
                    <input class="form-control" id="phone" name="phone" type="text" placeholder="enter your mobile phone number">
                </div>
            </div>

            <div class="col-lg-12">
                <div class="form-group">
                    <input class="form-control" id="password" name="password" type="password" placeholder="enter your preferred password">
                </div>
            </div>
            <div class="col-lg-12 text-center">
                <button type="submit" id="submit_signup" class="btn btn-block btn-dark">Sign Up</button>
            </div>
            <div class="col-lg-12 text-center mt-5">
                Already have an account? <a href="#" class="text-danger get-inn" data-url="signin/form.php">Sign In</a>
            </div>
        </div>
    </form>
</div>

<script>
  
   
    $("#submit_signup").off().on("click", function() {
        $("#form_signup").submit(function(e) {
            $.ajax({
                url: domain_apii + "/auth/signup",
                type: "POST",
                data: $(this).serialize(),
                beforeSend: function() {
                    $("#signup").attr("disabled", "disabled");
                },
                success: function(data) {
                    alert(data.text);
                    $("#signin").attr("disabled", false);
                },
                error: function(request, error) {
                    alert(error);
                    $("#signin").attr("disabled", false);
                },
            });
            e.preventDefault();
        });

    });

    $(".get-inn").off().on("click", function() {
        var url = $(this).attr("data-url");
        $(".signin-signup-form").load(domain + "/COMPONENTS/" + url, function() {})
    });

</script>