229 lines
9.5 KiB
HTML
229 lines
9.5 KiB
HTML
|
|
|
|
|
|
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Signup</title>
|
|
<link rel="stylesheet" href="{% static 'accounts/css/signup.css' %}">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="content">
|
|
<!-- <div class="box-header">
|
|
<img src="{% static '/assets/x-phy-new-logo-white.png' %}" alt="" id="logo" />
|
|
<div>
|
|
<span class="email-details">>. Encryption</span>
|
|
<span class="email-details">>. Support</span>
|
|
</div>
|
|
</div> -->
|
|
|
|
<div class="box-header">
|
|
{% comment %} <h1>X-SYS</h1> {% endcomment %}
|
|
<img src="{% static '/assets/x-phy-new-logo-white.png' %}" alt="" id="logo"/>
|
|
<div>
|
|
<span class="email-details">>. Encryption</span>
|
|
<span class="email-details">>. Support</span>
|
|
</div>
|
|
</div>
|
|
<div class="login-title-box">
|
|
<h2 class="login-text">Get started</h2>
|
|
<p class="login-url">Already have an account? <a href="{% url 'login' %}">Login</a></p>
|
|
</div>
|
|
|
|
<form id="signupForm" method="post">
|
|
{% csrf_token %}
|
|
<div class="user-details">
|
|
<!-- User details inputs -->
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Email</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="email" name="email" maxlength="254" id="id_email" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Password</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="password" name="password" id="id_password" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Phone Number</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="phone_number" maxlength="15" id="id_phone_number" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. OTP Verification</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="otp_code" maxlength="20" id="id_otp_code" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Company Name</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="company_name" maxlength="20" id="id_company_name" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Country</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="country" maxlength="50" id="id_country" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. State</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="state" maxlength="50" id="id_state" required />
|
|
</div>
|
|
<div class="input-box">
|
|
<div>
|
|
<span class="details">>. Postal Code</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input type="text" name="postal_code" maxlength="10" id="id_postal_code" required />
|
|
</div>
|
|
<div class="input-box" style="width: 738px;">
|
|
<div>
|
|
<span class="details">>. Full Address</span>
|
|
<span class="details">...</span>
|
|
</div>
|
|
<input name="full_address" cols="40" rows="10" id="id_full_address" required />
|
|
</div>
|
|
</div>
|
|
<div class="button">
|
|
<input type="button" id="registerButton" value="Register">
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="{% static 'navbar/js/jquery-3.7.0.js' %}"></script>
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
attachValidationHandlers();
|
|
});
|
|
|
|
function attachValidationHandlers() {
|
|
$('#registerButton').click(function() {
|
|
// Clear any previous error classes
|
|
$(".input-box").removeClass("error-class");
|
|
checkValidation();
|
|
|
|
var errorCount = $(".error-class").length;
|
|
if (errorCount === 0) {
|
|
// Proceed to submit the form data
|
|
submitForm();
|
|
}
|
|
});
|
|
}
|
|
|
|
function checkValidation() {
|
|
let id_email = $("#id_email").val();
|
|
let id_password = $("#id_password").val();
|
|
|
|
if (id_email.length <= 0) {
|
|
$("#id_email").parent().addClass("error-class");
|
|
}
|
|
if (id_password.length <= 0) {
|
|
$("#id_password").parent().addClass("error-class");
|
|
}
|
|
}
|
|
|
|
function submitForm() {
|
|
let formData = {
|
|
email: $("#id_email").val(),
|
|
otp_code: $("#id_otp_code").val(),
|
|
password: $("#id_password").val(),
|
|
phone_number: $("#id_phone_number").val(),
|
|
company_name: $("#id_company_name").val(),
|
|
country: $("#id_country").val(),
|
|
state: $("#id_state").val(),
|
|
postal_code: $("#id_postal_code").val(),
|
|
full_address: $("#id_full_address").val(),
|
|
};
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{% url 'verify_otp' %}", // Adjust this path as needed
|
|
data: formData,
|
|
success: function(response) {
|
|
alert("OTP verified successfully!");
|
|
console.log("OTP verification response:", response);
|
|
// Call the registration API after OTP verification
|
|
registerUser(formData);
|
|
},
|
|
error: function(xhr) {
|
|
console.error("OTP verification error:", xhr);
|
|
alert(xhr.responseJSON.error || "An error occurred. Please try again.");
|
|
}
|
|
});
|
|
}
|
|
|
|
function registerUser(formData) {
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{% url 'signup' %}", // Adjust this path to your signup view
|
|
data: formData,
|
|
headers: {
|
|
'X-CSRFToken': '{{ csrf_token }}' // Include CSRF token
|
|
},
|
|
success: function(response) {
|
|
alert("Registration successful!");
|
|
console.log("Registration response:", response);
|
|
|
|
// Call the second OTP generation after registration
|
|
generateSecondOTP(formData.email);
|
|
// generateSecondOTP(formData.email, response.user_id);
|
|
|
|
const redirectUrl = "{% url 'login' %}";
|
|
console.log("Redirecting to:", redirectUrl);
|
|
},
|
|
error: function(xhr) {
|
|
console.error("Registration error:", xhr);
|
|
alert(xhr.responseJSON.error || "An error occurred during registration.");
|
|
}
|
|
});
|
|
}
|
|
|
|
function generateSecondOTP() {
|
|
const email = $("#id_email").val(); // Get the email from the form
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{% url 'generate_second_otp' %}", // Adjust this path to your generate_second_otp API
|
|
data: {
|
|
email: email,
|
|
|
|
csrfmiddlewaretoken: '{{ csrf_token }}' // Ensure CSRF token is included
|
|
},
|
|
success: function(response) {
|
|
alert("Second OTP generated successfully! Verify this OTP on installer Your OTP is: " + response.second_otp);
|
|
console.log("Second OTP response:", response);
|
|
|
|
window.pywebview.api.show_otp_verification_window(email); // This will call the Python function
|
|
|
|
},
|
|
error: function(xhr) {
|
|
console.error("Error generating second OTP:", xhr);
|
|
alert(xhr.responseJSON.error || "An error occurred while generating second OTP.");
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|