Images Compressed Login page modifications

2023-04-24 18:25:18 +05:30
parent bace314f10
commit edd3113258
@@ -54,18 +54,13 @@
    <!-- end-navbar -->
    <!-- main-body -->
    <main class="main-body home-main-container">
-      <section class="services h-100 pt-5 bg-gradient-anwi">
-        <div class="container pt-md-5 pt-4">
-            <div class="text-center text-white  pt-md-5 pb-md-5 pb-4">
-                <h3 class="text-center mb-md-2 mb-3 pt-md-5">
-                    <span class="satoshi_font font-weight-600 pb-1">Contact Us </span>
-                </h3>
-                <h5 class="font-weight-lighter">Thank you for showing interest in our services.</h5>
-                <h5 class="font-weight-lighter">Please fill the details so that our experts will get back to you.</h5>
+      <section class="services h-100 pt-3  bg-gradient-anwi">
+        <div class="container pt-5 ">
+            <div class="text-center text-white ">
            </div>
        </div>
    </section>
-        <section class="contact-section py-md-5 py-3 bg-gradient-violet">
+        <section class="contact-section py-md-5 py-3 " style="background: url(dist/assets/imgs/bg-blur.png);">
            <div class="container pt-md-5 pt-3">
              <div class="row bg-white rounded-3 shadow mx-0">
                <div class="col-lg-6 col-12 mb-30 bg-gradient-anwi text-white p-md-5 p-4">
@@ -60,6 +60,7 @@ function initLogin() {
  });

  $("#Login_btn").click(function () {
+    $('.error_msg').hide();
    // loginForm.find(".loader-btn").show();
    let userEmail = loginForm.find("#User_Email").val();
    let userPassword = loginForm.find("#User_password").val();
@@ -103,8 +104,20 @@ function initLogin() {
    };
    let response = await axios(config);
    if (response.data.result == null) {
-      toasterOpts();
-      Command: toastr["error"]("Please enter Valid email / password");
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html(`User doesn't exists with the email,  <a href="#" class="alert-link register_sectionbtn" id="register_sectionbtn">Sign Up </a>`);
+      $(".register_sectionbtn").click(function(){
+        $(".login_section").css("display","none");
+        $(".register_section").css("display","block");
+        $(".login_section").find("#User_Email").removeClass("is-invalid");
+        $(".login_section").find(".form-floating").removeClass("is-invalid");
+        $(".login_section").find("#User_password").removeClass("is-invalid");
+        $(".login_section").find(".form-floating").removeClass("is-invalid");
+        $('.error_msg').hide();
+      });
+      // toasterOpts();
+      
+      // Command: toastr["error"]("Please enter Valid email / password");
    } else {
      let userEmail = $("#User_Email").val();
      let userPassword = $("#User_password").val();
@@ -148,8 +161,16 @@ function initLogin() {

        window.location.href = `./index.html`;
      } else {
-        toasterOpts();
-      Command: toastr["error"](res.data.message)
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html(res.data.message + ' <a class="validate_mail text-danger"><b>Validate Email</b></a>');
+      //   toasterOpts();
+      // Command: toastr["error"]()
+        /*Email validation*/
+  $('.validate_mail').click(function(){
+    $(".login_section").hide();
+    $(".email-validate-div").show();
+    $('.error_msg').hide();
+  })
      }
    }
  }
@@ -194,8 +215,10 @@ function initLogin() {
    $(".loader-btn").hide();
    $('#register_btn').show()
    if (res.data.code == "404" ) {
-      toasterOpts();
-      Command: toastr["error"](res.data.message)
+      // toasterOpts();
+      // Command: toastr["error"](res.data.message)
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html(res.data.message);
      return;
    }
     else {
@@ -254,12 +277,16 @@ function initLogin() {
          window.localStorage.setItem("isaccountCreated", true);
          window.location.href = `./index.html`;
        } else {
-          toasterOpts();
-        Command: toastr["error"](res.data.message)
+        //   toasterOpts();
+        // Command: toastr["error"](res.data.message)
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html(res.data.message);
        }       
      } else {
-        toasterOpts();
-        Command: toastr["error"]("Please enter Valid OTP");
+        // toasterOpts();
+        // Command: toastr["error"]("Please enter Valid OTP");
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html("Please enter Valid OTP");
      }
    });
  }
@@ -327,7 +354,7 @@ function initLogin() {

  // function to validate user entered password
  function validatepassword(userPassword) {
-    var pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{11,}$/;
+    var pattern =  /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9])(?!.*\s).{8,15}$/;
    // return $.trim(userPassword).test(pattern) ? true : false;
    return pattern.test(userPassword) ? true : false;
  }
@@ -338,6 +365,7 @@ function initLogin() {

  // this will be triggered on clicking continue in signup form
  $("#register_btn").click(function () {
+    $('.error_msg').hide();
    registerForm.find(".loader-btn").show();
    $(this).hide();
    let userEmail = registerForm.find("#User_Email").val();
@@ -373,9 +401,9 @@ function initLogin() {
        registerForm.find(".loader-btn").hide();
        $(this).show();
      }else if(Pwd_valid === false){
-        emailInput.find("#User_password").addClass("is-invalid");
-        emailInput.find(".form-floating").addClass("is-invalid");
-        emailInput.find(".invalid-feedback").text("Please check the password!");
+        passwordInput.find("#User_password").addClass("is-invalid");
+        passwordInput.find(".form-floating").addClass("is-invalid");
+        passwordInput.find(".invalid-feedback").text("Please check the password!");
        registerForm.find(".loader-btn").hide();
        $(this).show();
      }
@@ -531,8 +559,10 @@ return
            $(".login-forgot-password-details-div").show();
        $(".otp-validation .otp-input-group").hide();
          } else {
-      toasterOpts()
-            Command: toastr["error"]("Please enter Valid OTP");
+            // toasterOpts()
+            // Command: toastr["error"]("Please enter Valid OTP");
+            $('.error_msg').show();
+            $('.error_msg .error_msg_res').html("Please enter Valid OTP");
          }
      });
      $("#forgot_password_details_submit").click(async function () {
@@ -612,5 +642,131 @@ return
    }
  }
 }
+ $("#email_validate_submit").click(async function () {
+  let vaidate_otp;
+    let validate_email = $("#email_validation_input").val();
+    if(validate_email == ''){
+$('#email_validation_input').addClass('is-invalid')
+$('#email_validation_input').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+return
+    }
+    else{
+    debugger;
+  let port = "https://beta.bizgaze.app";
+   // let port = "http://localhost:3088";
+    let url = `${port}/account/getuserbyphoneormail/${validate_email}/${validate_email}`;
+    const config = {
+      url,
+      method: "get",
+    };
+    $(".loader-btn").show();
+    $('#email_validate_submit').hide()
+    let response = await axios(config);
+    debugger;
+    console.log(response);
+    $(".loader-btn").hide();
+    $('#email_validate_submit').show()
+    if (response.data.result != null) {
+      debugger;
+      console.log(response.data);
+      const forgotpassPayload = {
+        firstname: "",
+        lastname: "",
+        contactnumber: "",
+        email: "",
+        tenantname: "",
+        contactoremail: response.data.result.email,
+        IsSignup: false,
+        IsRegisterUser: false,
+        IsForgotPswd: true,
+        UnibaseId: response.data.result.userName,
+        OtpId: 0,
+        UserOtp: "",
+      };
+      $('#email_validate_submit').hide()
+      $(".loader-btn").show();
+      const validate_email_res = await postAPIService(
+        `account/sendotp`,
+        forgotpassPayload
+      );
+      $(".loader-btn").hide();
+      vaidate_otp = validate_email_res.data;
+      console.log(validate_email_res);
+      $(".email-validation").hide();
+      $('.user_email').html(validate_email)
+      $(".otp-validation .otp-input-group").show();
+      $(".otp-validation .otp-input-group").on("paste", function (p) {
+        let data = p.originalEvent.clipboardData.getData("text");
+        let dataLength = data.length;
+        for (let i = 0; i < dataLength; i++) {
+          let input = $(
+            '.otp-validation .otp-input-group input[tabindex="' + (i + 1) + '"]'
+          );
+          input.val(data.charAt(i));
+          if (input.val().length >= input.attr("maxlength")) {
+            let nextInput = $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+                (i + 2) +
+                '"]'
+            );
+            if (nextInput) {
+              nextInput.focus();
+            }
+          }
+        }
+        p.preventDefault();
+      });
+     
+    } 
+    else{
+      $('#email_validation_input').addClass('is-invalid');
+      $('#email_validation_input').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+   
+    }
+  }
+  $("#email_validate_proceed").click(async function () {
+    debugger;
+    let userotp='';
+    let validate_email = $("#email_validation_input").val();
+    $(".email-validate-div .otp-validation .otp-input-group input").each(function () {
+      let presVal = $(this).val();
+      userotp += presVal;
+    });
+  
+     if(userotp.length == 6){
+      const validateForgotpass = {
+        email: validate_email,
+         otpid: vaidate_otp,
+         userotp: userotp,
+       };
+       $('#email_validate_proceed').hide()
+       $(".loader-btn").show();
+       const validate_email_resopt = await postAPIService(
+         `hyperfusion/validateotp`,
+         validateForgotpass
+      );
+      
+      $(".loader-btn").hide();
+      $('#email_validate_proceed').show()
+       const Resotp = validate_email_resopt.data.result;
+       if (Resotp == "Otp verified successfully") {
+       $(".login_section").show();
+       $(".otp-validation .otp-input-group").hide();
+       $("#email_validate_back").hide();
+       $('.error_msg').hide();
+       } else {
+         // toasterOpts()
+         // Command: toastr["error"]("Please enter Valid OTP");
+         $('.error_msg').show();
+         $('.error_msg .error_msg_res').html("Please enter Valid OTP");
+       }
+     }
+     else{
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html("Please enter OTP");
+     }
+  });
+  });
+

 initLogin();
@@ -82,9 +82,9 @@ function ramProductsInit(){
        
            <!--desktop--->
            <div class="col-sm-4 p-3">
-                <div class="product_card_3 shadow ram_card">
+                <div class="product_card_1 shadow ram_card">
                    <div class="card-item-header">
-                        <div class="card-header-sub-3"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
+                        <div class="card-header-sub-1"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
                        <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" class="w-100 h-100"></a>
                        </div>
                    </div>
@@ -406,11 +406,11 @@ function initSelectDevlivery() {
    function getItemProductHTML(item) {
        const { img, name, price, quantity, sku, id } = item;

-        return ` <div class="align-items-center item-product-add d-flex justify-content-between" data-id="${id}" data-sku="${sku}">
+        return ` <div class="align-items-center item-product-add d-flex w-100" data-id="${id}" data-sku="${sku}">
        <div style="max-width: 100px;" class="">
            <img class="w-100" src="${img}" alt="">
        </div>
-       <div>
+       <div class="" style="margin-left:10px">
        <div>
            <div style="font-size:12px">${name}</div>
        </div>
@@ -574,6 +574,7 @@ debugger;
        }
        $('.orderlistcart').html(productsHTML);
        // $('.orderslist').html(productsHTML);
+        $('.orderslist').addClass("p-3")
        $('.orderslist').html(` <label for="online">
        Online
        <input checked data-op="online" name="payment" type="radio" class="paymentbtn   " id="online">
@@ -630,6 +631,7 @@ debugger;
        $('.detailsAddressBg').removeClass('detailsAddressBg');
        $('.selectAddress').addClass('detailsAddressBg');
        $('.orderslist').html('');
+        $('.orderslist').removeClass("p-3");
        orderBtnAction.removeOrdernowBtn();

       // $('.detailsAddressBtn').addClass('d-none');
@@ -134,8 +134,8 @@ function shoppingCartInit() {

    function getQuantityHTML(value, id) {
        return `<div data-id="${id}" class="mainselectcontainer w-100">
-        <div class="w-100">
-        <label>Qty</label>
+        <div class="w-50">
+       
        <select class="quantitySelect form-select ${value >= 5 ? 'd-none' : ''}" value="${value}">
                <option ${value == 1 ? 'selected="selected"' : null} value="1">
                    1
@@ -166,42 +166,40 @@ function shoppingCartInit() {
    function shoppingCartDesktopHTML({ id, img, name, price, description, quantity, total }) {
        const [currencySymbol,amt] = getCurrencySymbol(price);
        return `
-        <div class="row bg-white mt-3 rounded py-3 d-flex  ">
+        <div class="row bg-white  border-bottom py-4 d-flex justify-content-center align-items-center">
        <div class="col-md-2 text-center"><img src="${img}" alt="${name}" class="img-fluid"></div>
-        <div class="col-md-4 d-flex justify-content-center align-items-center">
+        <div class="col-md-4 ">
          
-            <a class="text-decoration-none text-dark cursor-pointer" href="/productdetails.html?productId=${id}">${name}</a>
+            <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="/productdetails.html?productId=${id}">${name}</a>
            <small>${description||''}</small>
            <span class="badge d-none text-bg-warning">8 Offers ></span>   
        </div>
-        <div class="col-md-2 d-flex justify-content-center align-items-center">
-            <p class="text-right"><span>${currencySymbol}</span> ${amt}</p>
+        <div class="col-md-2">
+            <p class="text-right m-0"><span>${currencySymbol}</span> ${amt}</p>
        </div>
-        <div class="col-md-2 d-flex justify-content-center align-items-center">
+        <div class="col-md-2 ">
   
            ${getQuantityHTML(quantity, id)}
        </div>
-        <div class="col-md-2 d-flex justify-content-center align-items-center">
+        <div class="col-md-2 ">
            <div class="d-flex justify-content-between w-100">
-                <p class="fw-bold"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-currency-rupee" viewBox="0 0 16 16">
+                <p class="fw-bold m-0"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-currency-rupee" viewBox="0 0 16 16">
                    <path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"/>
                  </svg>${total}</p>
-                <span class="btndeletecart cursor-pointer" data-cartid="${id}">x</span>
+                <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}">x</span>
            </div>
        </div>
        <div class="warrenty-sec px-3 sec-space-4 d-none">
-            <div class="row align-items-center border
-                            py-2 mx-4">
+            <div class="row align-items-center border  py-2 mx-4">
                <div class="col-md-8">
-                    <p class="mb-0"> <img src="./dist/assets/imgs/Home/Anwi-cart-logo.png" alt="shopping-cart-item-img"> Anwi Extended Warranty 2 Year: Protect your Laptop for another 2 years Learn more </p>
+                    <p class="mb-0 "> <img src="./dist/assets/imgs/Home/Anwi-cart-logo.png" alt="shopping-cart-item-img"> Anwi Extended Warranty 2 Year: Protect your Laptop for another 2 years Learn more </p>
                </div>
                <div class="col-md-3">
                    <p class="text-end mb-0"> ₹3,200 (2 year)
                    </p>
                </div>
            </div>
-            <div class="row align-items-center border
-                            py-2 mx-4 mt-3">
+            <div class="row align-items-center border  py-2 mx-4 mt-3">
                <div class="col-md-8">
                    <p class="mb-0"> <img src="./dist/assets/imgs/Home/Anwi-cart-logo-2.png" alt="shopping-cart-item-img"> Anwi Extended Warranty 2 Year: Protect your Laptop for another 2 years Learn more </p>
                </div>
--- a/Mostra Altro
+++ b/Mostra Altro