updated checkout flow

This commit is contained in:
franknstayn
2021-11-03 21:30:42 +08:00
parent 148df27117
commit 08c274f5bd
18 changed files with 254594 additions and 26526 deletions

View File

@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -18,7 +19,7 @@
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="{{asset('public/assets/css/style.css')}}" rel="stylesheet">
<!-- <link href="{{asset('public/assets/login/css/style.css')}}" rel="stylesheet">
<link href="{{asset('public/assets/login/css/form-elements.css')}}" rel="stylesheet"> -->
@@ -27,12 +28,16 @@
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-136108155-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-136108155-1');
</script>
</head>
<body>
<!-- <nav class="navbar navbar-default">
<div class="container">
@@ -70,14 +75,14 @@
@include('layout.navbar')
@yield('content')
<!-- Footer -->
<!-- Scripts -->
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script>
$(document).ready(function(){
$('.reveal-password').click(function(e){
$(document).ready(function() {
$('.reveal-password').click(function(e) {
var $pwd = $(".pwd");
if ($pwd.attr('type') === 'password') {
$pwd.attr('type', 'text');
@@ -88,7 +93,7 @@
}
});
if($('.data-errors').length > 0){
if ($('.data-errors').length > 0) {
$('#team-store-login').modal('show')
return false;
}
@@ -109,7 +114,7 @@
var placement = $(element).data('error');
if (placement) {
$(placement).append(error);
}else {
} else {
error.insertAfter(element);
}
},
@@ -118,12 +123,15 @@
$("#frm-register").validate({
rules: {
name: {
required : true
firstname: {
required: true
},
username: {
required : true
lastname: {
required: true
},
// username: {
// required: true
// },
email: {
required: true,
email: true
@@ -131,6 +139,24 @@
password: {
required: true
//minlength: 6 // <-- removed underscore
},
mobilenumber: {
required: true
},
address: {
required: true
},
state: {
required: true
},
city: {
required: true
},
zipcode: {
required: true
},
countryCode: {
required: true
}
},
messages: {},
@@ -138,14 +164,14 @@
var placement = $(element).data('error');
if (placement) {
$(placement).append(error);
}else {
} else {
error.insertAfter(element);
}
},
submitHandler: submitRegisterForm
});
$('.password-protected').click(function(){
$('.password-protected').click(function() {
$('#_teamstore_id').val($(this).data('store-id'))
// console.log($(this).data('store-id'))
@@ -158,32 +184,173 @@
event.preventDefault();
$('#frm_search_store').submit();
});
}); // end document ready
function submitLoginForm (){
function getSelectedCountry() {
var selectedState = $('#select_country').data('selected');
if (selectedState) {
// console.log(selectedState)
$("#select_country").val(selectedState).change();
// selectCountry()
}
}
function selectCountry(item) {
const country = item.options[item.selectedIndex].text;
const countryCode = item.options[item.selectedIndex].value
console.log(countryCode)
if (countryCode === "US") {
fetchUSA()
}
if (countryCode === "CA") {
fetchCanada()
}
}
function fetchCanada() {
$.getJSON("{{ asset('/public/api/canada.json') }}", function(items) {
var states = [];
Object.keys(items).forEach(function(state) {
states.push(state)
});
var uniqueStates = Array.from(new Set(states));
var selectedState = $('#lst-states').data('selected');
$('.dynamic-state').remove();
$('.dynamic-city').remove();
uniqueStates.sort().forEach(function(key) {
if (selectedState == key) {
$('#lst-states').append('<option value="' + key + '" selected class="dynamic-state">' + key + '</option>');
var cities = [];
cities = items[selectedState];
var uniqueCities = Array.from(new Set(cities));
var selectedCity = $('#lst-cities').data('selected');
$('.dynamic-city').remove();
uniqueCities.sort().forEach(function(key) {
if (selectedCity == key) {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city" selected>' + key + '</option>');
} else {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city">' + key + '</option>');
}
});
} else {
$('#lst-states').append('<option value="' + key + '" class="dynamic-state">' + key + '</option>');
}
});
$(document).on('select change', '#lst-states', function() {
var cities = [];
var selectedState = $(this).val()
cities = items[selectedState];
var uniqueCities = Array.from(new Set(cities));
$('.dynamic-city').remove();
uniqueCities.sort().forEach(function(key) {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city">' + key + '</option>');
});
});
});
}
function fetchUSA() {
$.getJSON("{{ asset('/public/api/usaCities.json') }}", function(data) {
var states = [];
for (i = 0; i < data.length; i++) {
states.push(data[i]['state']);
}
var uniqueStates = Array.from(new Set(states));
var selectedState = $('#lst-states').data('selected');
$('.dynamic-state').remove();
$('.dynamic-city').remove();
uniqueStates.sort().forEach(function(key) {
if (selectedState == key) {
$('#lst-states').append('<option value="' + key + '" selected class="dynamic-state">' + key + '</option>');
//
var cities = [];
for (i = 0; i < data.length; i++) {
console.log(data[i])
cities.push(data[i]);
}
var city = getCities(cities, key);
var uniqueCities = Array.from(new Set(city));
var selectedCity = $('#lst-cities').data('selected');
$('.dynamic-city').remove();
uniqueCities.sort().forEach(function(key) {
if (selectedCity == key) {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city" selected>' + key + '</option>');
} else {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city">' + key + '</option>');
}
});
} else {
$('#lst-states').append('<option value="' + key + '" class="dynamic-state">' + key + '</option>');
}
});
$(document).on('select change', '#lst-states', function() {
var cities = [];
for (i = 0; i < data.length; i++) {
cities.push(data[i]);
}
var city = getCities(cities, $(this).val());
var uniqueCities = Array.from(new Set(city));
$('.dynamic-city').remove();
uniqueCities.sort().forEach(function(key) {
$('#lst-cities').append('<option value="' + key + '" class="dynamic-city">' + key + '</option>');
});
});
});
}
function getCities(arr, q) {
var sd = [];
arr.find(function(element) {
if (element['state'] == q) {
sd.push(element['city']);
}
});
return sd;
}
function submitLoginForm() {
// method="POST" action="{{ url('/auth/login') }}"
var data = $("#frm-login").serialize();
// console.log(data)
$.ajax({
type : 'POST',
url : "{{ url('/custom/auth') }}",
data : data,
dataType : 'json',
beforeSend: function() {
type: 'POST',
url: "{{ url('/custom/auth') }}",
data: data,
dataType: 'json',
beforeSend: function() {
$("#login-response-msg").fadeOut();
$("#btn-login").html('Signing in &nbsp; <i class="fa fa-spinner fa-spin"></i>');
},
success : function(response){
success: function(response) {
$("#login-response-msg").html("");
$("#login-response-msg").fadeIn(1000, function(){
if(response.success){
$("#login-response-msg").fadeIn(1000, function() {
if (response.success) {
// $("#login-response-msg").html(response);
// console.log();
location.reload();
}else{
} else {
$("#login-response-msg").html(response.message);
}
//
@@ -194,27 +361,35 @@
}
});
return false;
}/* login submit */
} /* login submit */
function submitRegisterForm (){
var data = $("#frm-register").serialize();
function submitRegisterForm() {
var data = $("#frm-register").serializeArray();
data.push({
name: "country",
value: $("#select_country option:selected").text()
});
$.ajax({
type : 'POST',
url : "{{ url('/custom/register') }}",
data : data,
dataType : 'json',
beforeSend: function() {
type: 'POST',
url: "{{ url('/custom/register') }}",
data: data,
dataType: 'json',
beforeSend: function() {
$("#register-response-msg").fadeOut();
$("#btn-register").html('Please wait &nbsp; <i class="fa fa-spinner fa-spin"></i>');
},
success : function(response){
success: function(response) {
$("#register-response-msg").html("");
$("#register-response-msg").fadeIn(1000, function(){
if(response.success){
location.reload();
}else{
$("#register-response-msg").fadeIn(1000, function() {
if (response.success) {
if (response.redirect != "") {
window.location = response.redirect;
} else {
location.reload();
}
} else {
$("#register-response-msg").html(response.message);
}
$("#btn-register").html('Register');
@@ -226,8 +401,7 @@
return false;
}
</script>
</body>
</html>
</html>