Compare commits
No commits in common. "9f8c76cabd5686f2e7527aec0076e0c8c2477256" and "90438ea937139215d0a902dfd65cc46110085385" have entirely different histories.
9f8c76cabd
...
90438ea937
|
|
@ -1851,130 +1851,3 @@ tr[data-vaid]:hover {
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
margin-left: 0.5rem;
|
margin-left: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.payment-option {
|
|
||||||
border: 1px solid #e5e7eb;
|
|
||||||
border-radius: 8px;
|
|
||||||
padding: 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-option.selected {
|
|
||||||
border-color: var(--border-color);
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
background: var(--bg-card);
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-option:hover {
|
|
||||||
border-color: var(--accent-light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-option.selected {
|
|
||||||
border-color: var(--accent-color);
|
|
||||||
background-color: rgba(99, 102, 241, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-theme="dark"] .payment-option.selected {
|
|
||||||
background-color: rgba(99, 102, 241, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-option h4 {
|
|
||||||
margin-bottom: 8px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: var(--text-primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-option p {
|
|
||||||
font-size: 14px;
|
|
||||||
color: var(--text-secondary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-details {
|
|
||||||
display: none;
|
|
||||||
margin: 4px 0 16px;
|
|
||||||
padding: 16px;
|
|
||||||
border: 1px solid var(--border-color);
|
|
||||||
border-radius: 8px;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.payment-details.active {
|
|
||||||
display: block;
|
|
||||||
animation: slideDown 0.3s ease-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
margin-bottom: 16px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-container {
|
|
||||||
position: relative;
|
|
||||||
background-color: var(--bg-secondary);
|
|
||||||
border-radius: 6px;
|
|
||||||
overflow: hidden;
|
|
||||||
padding: 2px 0;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-container:focus-within {
|
|
||||||
border-color: var(--accent-light);
|
|
||||||
box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-label {
|
|
||||||
position: absolute;
|
|
||||||
left: 12px;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
font-size: 14px;
|
|
||||||
color: var(--text-secondary);
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-field, .select-field {
|
|
||||||
width: 100%;
|
|
||||||
padding: 18px 12px 14px;
|
|
||||||
border: none;
|
|
||||||
background: transparent;
|
|
||||||
outline: none;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 6px;
|
|
||||||
color: var(--text-primary);
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-theme="dark"] .input-field, [data-theme="dark"] .select-field {
|
|
||||||
background-color: #ffffff1a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-field::placeholder {
|
|
||||||
color: var(--text-muted);
|
|
||||||
}
|
|
||||||
|
|
||||||
.select-field {
|
|
||||||
appearance: none;
|
|
||||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: right 12px center;
|
|
||||||
background-size: 16px;
|
|
||||||
border-radius: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-theme="dark"] .select-field {
|
|
||||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d1d5db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-field:focus + .input-label,
|
|
||||||
.input-field:not(:placeholder-shown) + .input-label,
|
|
||||||
.select-field:focus + .input-label,
|
|
||||||
.select-field:valid + .input-label {
|
|
||||||
top: 2px;
|
|
||||||
font-size: 12px;
|
|
||||||
transform: none;
|
|
||||||
color: var(--accent-light);
|
|
||||||
}
|
|
||||||
|
|
@ -491,11 +491,10 @@ async function validateStep(step) {
|
||||||
}
|
}
|
||||||
} else if (step === 1) {
|
} else if (step === 1) {
|
||||||
const email = document.getElementById('email').value;
|
const email = document.getElementById('email').value;
|
||||||
const firstName = document.getElementById('first-name').value;
|
const companyName = document.getElementById('company-name').value;
|
||||||
const lastName = document.getElementById('last-name').value;
|
|
||||||
const password = document.getElementById('password').value;
|
const password = document.getElementById('password').value;
|
||||||
const confirmPassword = document.getElementById('confirmPassword').value;
|
const confirmPassword = document.getElementById('confirmPassword').value;
|
||||||
if (!validateEmail(email) && !firstName && !lastName && !password && !confirmPassword) {
|
if (!validateEmail(email) && !companyName && !password && !confirmPassword) {
|
||||||
isValid = false;
|
isValid = false;
|
||||||
showError('Fields are Required', null, step);
|
showError('Fields are Required', null, step);
|
||||||
let requiredFields1 = form.querySelectorAll('[required]');
|
let requiredFields1 = form.querySelectorAll('[required]');
|
||||||
|
|
@ -519,14 +518,9 @@ async function validateStep(step) {
|
||||||
isValid = false;
|
isValid = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (!firstName) {
|
if (!companyName) {
|
||||||
isValid = false;
|
isValid = false;
|
||||||
showError('First Name is Required', null, step);
|
showError('Company / Client Name is Required', null, step);
|
||||||
return isValid;
|
|
||||||
}
|
|
||||||
if (!lastName) {
|
|
||||||
isValid = false;
|
|
||||||
showError('Last Name is Required', null, step);
|
|
||||||
return isValid;
|
return isValid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -633,8 +627,7 @@ function getFormId(step) {
|
||||||
function saveStepData(step) {
|
function saveStepData(step) {
|
||||||
switch(step) {
|
switch(step) {
|
||||||
case 1:
|
case 1:
|
||||||
formData.userDetails.firstName = document.getElementById('first-name').value;
|
formData.userDetails.name = document.getElementById('company-name').value;
|
||||||
formData.userDetails.lastName = document.getElementById('last-name').value;
|
|
||||||
formData.userDetails.email = document.getElementById('email').value;
|
formData.userDetails.email = document.getElementById('email').value;
|
||||||
formData.userDetails.password = document.getElementById('password').value;
|
formData.userDetails.password = document.getElementById('password').value;
|
||||||
break;
|
break;
|
||||||
|
|
@ -1092,7 +1085,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||||
// Handle use business address checkbox
|
// Handle use business address checkbox
|
||||||
document.getElementById('use-business-address').addEventListener('change', function() {
|
document.getElementById('use-business-address').addEventListener('change', function() {
|
||||||
if (this.checked) {
|
if (this.checked) {
|
||||||
document.getElementById('billing-name').value = formData.userDetails.firstName || '';
|
document.getElementById('billing-name').value = formData.userDetails.name || '';
|
||||||
document.getElementById('billing-address').value = formData.userDetails.address || '';
|
document.getElementById('billing-address').value = formData.userDetails.address || '';
|
||||||
document.getElementById('billing-city').value = formData.userDetails.city || '';
|
document.getElementById('billing-city').value = formData.userDetails.city || '';
|
||||||
document.getElementById('billing-state').value = formData.userDetails.state || '';
|
document.getElementById('billing-state').value = formData.userDetails.state || '';
|
||||||
|
|
@ -1265,13 +1258,13 @@ function preventNumbers(event) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Function to validate first name
|
// Function to validate company/client name
|
||||||
function validateFirstName(input) {
|
function validateCompanyName(input) {
|
||||||
const errorElement = document.getElementById('first-name-error');
|
const errorElement = document.getElementById('company-name-error');
|
||||||
const value = input.value;
|
const value = input.value;
|
||||||
|
|
||||||
// Check various invalid patterns
|
// Check various invalid patterns
|
||||||
const validationResult = validateFirstNameContent(value);
|
const validationResult = validateCompanyNameContent(value);
|
||||||
|
|
||||||
if (!validationResult.isValid && value.trim().length > 0) {
|
if (!validationResult.isValid && value.trim().length > 0) {
|
||||||
errorElement.textContent = validationResult.message;
|
errorElement.textContent = validationResult.message;
|
||||||
|
|
@ -1285,16 +1278,16 @@ function validateFirstName(input) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function validateFirstNameContent(firstName) {
|
function validateCompanyNameContent(companyName) {
|
||||||
const trimmed = firstName.trim();
|
const trimmed = companyName.trim();
|
||||||
|
|
||||||
if (trimmed.length === 0) {
|
if (trimmed.length === 0) {
|
||||||
return { isValid: false, message: 'First name is required' };
|
return { isValid: false, message: 'Company name is required' };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Check minimum length
|
// Check minimum length
|
||||||
if (trimmed.length < 2) {
|
if (trimmed.length < 2) {
|
||||||
return { isValid: false, message: 'First name must be at least 2 characters' };
|
return { isValid: false, message: 'Company name must be at least 2 characters' };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Remove whitespace for content analysis
|
// Remove whitespace for content analysis
|
||||||
|
|
@ -1302,112 +1295,25 @@ function validateFirstNameContent(firstName) {
|
||||||
|
|
||||||
// Check if contains only special characters
|
// Check if contains only special characters
|
||||||
if (/^[^a-zA-Z0-9]+$/.test(content)) {
|
if (/^[^a-zA-Z0-9]+$/.test(content)) {
|
||||||
return { isValid: false, message: 'First name cannot be only special characters' };
|
return { isValid: false, message: 'Company name cannot be only special characters' };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Check if contains at least some valid content (letters or numbers)
|
// Check if contains at least some valid content (letters or numbers)
|
||||||
if (!/[a-zA-Z0-9]/.test(content)) {
|
if (!/[a-zA-Z0-9]/.test(content)) {
|
||||||
return { isValid: false, message: 'First name must contain letters or numbers' };
|
return { isValid: false, message: 'Company name must contain letters or numbers' };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Optional: Check for excessive special characters (more than 50%)
|
// Optional: Check for excessive special characters (more than 50%)
|
||||||
const specialCharCount = (content.match(/[^a-zA-Z0-9]/g) || []).length;
|
const specialCharCount = (content.match(/[^a-zA-Z0-9]/g) || []).length;
|
||||||
if (specialCharCount > content.length / 2) {
|
if (specialCharCount > content.length / 2) {
|
||||||
return { isValid: false, message: 'First name contains too many special characters' };
|
return { isValid: false, message: 'Company name contains too many special characters' };
|
||||||
}
|
}
|
||||||
|
|
||||||
return { isValid: true, message: '' };
|
return { isValid: true, message: '' };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Function to prevent invalid character input in real-time
|
// Function to prevent invalid character input in real-time
|
||||||
function preventInvalidFirstNameChars(event) {
|
function preventInvalidCompanyChars(event) {
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
const key = event.key;
|
|
||||||
|
|
||||||
// Allow: letters, numbers, spaces, hyphens, apostrophes, ampersands, periods, commas
|
|
||||||
// Also allow common editing keys
|
|
||||||
if ((charCode >= 65 && charCode <= 90) || // A-Z
|
|
||||||
(charCode >= 97 && charCode <= 122) || // a-z
|
|
||||||
(charCode >= 48 && charCode <= 57) || // 0-9
|
|
||||||
charCode === 32 || // space
|
|
||||||
charCode === 45 || // hyphen
|
|
||||||
charCode === 39 || // apostrophe
|
|
||||||
charCode === 38 || // ampersand (&)
|
|
||||||
charCode === 46 || // period (.)
|
|
||||||
charCode === 44 || // comma (,)
|
|
||||||
charCode === 8 || // backspace
|
|
||||||
charCode === 9 || // tab
|
|
||||||
charCode === 37 || // left arrow
|
|
||||||
charCode === 39 || // right arrow
|
|
||||||
charCode === 16 || // shift
|
|
||||||
charCode === 17 || // ctrl
|
|
||||||
charCode === 18 || // alt
|
|
||||||
charCode === 91 || // cmd (Mac)
|
|
||||||
/^[a-zA-Z0-9\s\-'&.,]$/.test(key)) { // allowed characters
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Prevent invalid characters
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to validate last name
|
|
||||||
function validateLastName(input) {
|
|
||||||
const errorElement = document.getElementById('last-name-error');
|
|
||||||
const value = input.value;
|
|
||||||
|
|
||||||
// Check various invalid patterns
|
|
||||||
const validationResult = validateLastNameContent(value);
|
|
||||||
|
|
||||||
if (!validationResult.isValid && value.trim().length > 0) {
|
|
||||||
errorElement.textContent = validationResult.message;
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function validateLastNameContent(lastName) {
|
|
||||||
const trimmed = lastName.trim();
|
|
||||||
|
|
||||||
if (trimmed.length === 0) {
|
|
||||||
return { isValid: false, message: 'Last name is required' };
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check minimum length
|
|
||||||
if (trimmed.length < 2) {
|
|
||||||
return { isValid: false, message: 'Last name must be at least 2 characters' };
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remove whitespace for content analysis
|
|
||||||
const content = trimmed.replace(/\s/g, '');
|
|
||||||
|
|
||||||
// Check if contains only special characters
|
|
||||||
if (/^[^a-zA-Z0-9]+$/.test(content)) {
|
|
||||||
return { isValid: false, message: 'Last name cannot be only special characters' };
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check if contains at least some valid content (letters or numbers)
|
|
||||||
if (!/[a-zA-Z0-9]/.test(content)) {
|
|
||||||
return { isValid: false, message: 'Last name must contain letters or numbers' };
|
|
||||||
}
|
|
||||||
|
|
||||||
// Optional: Check for excessive special characters (more than 50%)
|
|
||||||
const specialCharCount = (content.match(/[^a-zA-Z0-9]/g) || []).length;
|
|
||||||
if (specialCharCount > content.length / 2) {
|
|
||||||
return { isValid: false, message: 'Last name contains too many special characters' };
|
|
||||||
}
|
|
||||||
|
|
||||||
return { isValid: true, message: '' };
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to prevent invalid character input in real-time
|
|
||||||
function preventInvalidLastNameChars(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
const charCode = event.which ? event.which : event.keyCode;
|
||||||
const key = event.key;
|
const key = event.key;
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -25,10 +25,10 @@ async function va_register_client(req, res) {
|
||||||
try {
|
try {
|
||||||
const payload = req.body || {};
|
const payload = req.body || {};
|
||||||
const { userDetails } = payload;
|
const { userDetails } = payload;
|
||||||
if (!userDetails || !userDetails.email || !userDetails.firstName || !userDetails.lastName || !userDetails.password) {
|
if (!userDetails || !userDetails.email || !userDetails.name || !userDetails.password) {
|
||||||
return res.status(400).json({
|
return res.status(400).json({
|
||||||
success: false,
|
success: false,
|
||||||
message: "Missing required fields: firstName, lastName, email, and password are required"
|
message: "Missing required fields: name, email, and password are required"
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,3 @@
|
||||||
import authFetch from "../../../utils/authFetch.js";
|
|
||||||
|
|
||||||
async function va_payroll_schedule_function(req, res) {
|
async function va_payroll_schedule_function(req, res) {
|
||||||
try {
|
try {
|
||||||
const salesforceUrl = `${process.env.SF_DOCTRACKER_API_URL}services/apexrest/docva/api/payroll-schedule`;
|
const salesforceUrl = `${process.env.SF_DOCTRACKER_API_URL}services/apexrest/docva/api/payroll-schedule`;
|
||||||
|
|
|
||||||
|
|
@ -136,12 +136,6 @@ const clientDetailsSchema = new Schema({
|
||||||
name: {
|
name: {
|
||||||
type: String,
|
type: String,
|
||||||
},
|
},
|
||||||
firstName: {
|
|
||||||
type: String,
|
|
||||||
},
|
|
||||||
lastName: {
|
|
||||||
type: String,
|
|
||||||
},
|
|
||||||
email: {
|
email: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true,
|
required: true,
|
||||||
|
|
|
||||||
|
|
@ -516,11 +516,6 @@ app.get("/health", (req, res) => {
|
||||||
return res.status(200).json({ "success": true, "message": "Server is Healthy" })
|
return res.status(200).json({ "success": true, "message": "Server is Healthy" })
|
||||||
})
|
})
|
||||||
|
|
||||||
app.post("/post-test", (req, res) => {
|
|
||||||
console.log("✅ POST request received at /post-test:", req.body);
|
|
||||||
return res.status(200).json({ "success": true, "message": "POST request received", "data": req.body })
|
|
||||||
});
|
|
||||||
|
|
||||||
app.use((req, res) => {
|
app.use((req, res) => {
|
||||||
res.status(404).render("not_found", {
|
res.status(404).render("not_found", {
|
||||||
title: "404 - Page Not Found"
|
title: "404 - Page Not Found"
|
||||||
|
|
|
||||||
|
|
@ -1,24 +1,24 @@
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import logger from "../config/logger.js";
|
import logger from "../config/logger.js";
|
||||||
import authFetch from "../utils/authFetch.js";
|
|
||||||
|
|
||||||
class SalesforceService {
|
class SalesforceService {
|
||||||
|
|
||||||
async registerClientInSalesforce(clientData, _id) {
|
async registerClientInSalesforce(clientData, _id) {
|
||||||
try {
|
try {
|
||||||
const url = `${process.env.SF_DOCTRACKER_API_URL}/services/apexrest/docva/api/client`;
|
const url = `${process.env.SF_DOCTRACKER_API_URL}/services/apexrest/docva/api/client`;
|
||||||
|
|
||||||
// Extract only the required data for Salesforce
|
// Extract only the required data for Salesforce
|
||||||
const salesforcePayload = this.prepareSalesforcePayload(clientData, _id);
|
const salesforcePayload = this.prepareSalesforcePayload(clientData, _id);
|
||||||
|
|
||||||
logger.info(`SalesforceService - Sending client data to Salesforce: ${clientData.userDetails.email}`);
|
logger.info(`SalesforceService - Sending client data to Salesforce: ${clientData.userDetails.email}`);
|
||||||
|
|
||||||
const response = await authFetch(url, {
|
const response = await axios.post(url, salesforcePayload, {
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/json',
|
'Content-Type': 'application/json',
|
||||||
},
|
},
|
||||||
body: JSON.stringify(salesforcePayload),
|
|
||||||
timeout: 30000, // 30 seconds timeout
|
timeout: 30000, // 30 seconds timeout
|
||||||
});
|
});
|
||||||
|
|
||||||
logger.info(`SalesforceService - Client registered successfully in Salesforce: ${clientData.userDetails.email}`);
|
logger.info(`SalesforceService - Client registered successfully in Salesforce: ${clientData.userDetails.email}`);
|
||||||
return response.data;
|
return response.data;
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|
@ -45,8 +45,7 @@ class SalesforceService {
|
||||||
return {
|
return {
|
||||||
userDetails: {
|
userDetails: {
|
||||||
_id: _id,
|
_id: _id,
|
||||||
firstName: userDetails.firstName,
|
name: userDetails.name,
|
||||||
lastName: userDetails.lastName,
|
|
||||||
email: userDetails.email.toLowerCase(),
|
email: userDetails.email.toLowerCase(),
|
||||||
address: userDetails.address || null,
|
address: userDetails.address || null,
|
||||||
city: userDetails.city || null,
|
city: userDetails.city || null,
|
||||||
|
|
|
||||||
|
|
@ -75,7 +75,7 @@ class VaClientService {
|
||||||
|
|
||||||
// Define allowed fields for update (excluding password)
|
// Define allowed fields for update (excluding password)
|
||||||
const allowedFields = [
|
const allowedFields = [
|
||||||
"firstName", "lastName", "address", "city", "state", "zip",
|
"name", "address", "city", "state", "zip",
|
||||||
"billingName", "billingEmail", "billingAddress", "billingCity",
|
"billingName", "billingEmail", "billingAddress", "billingCity",
|
||||||
"billingState", "billingZip", "position", "signatoryName",
|
"billingState", "billingZip", "position", "signatoryName",
|
||||||
"signatoryEmail", "paymentMethod", "bankName", "accountNumber",
|
"signatoryEmail", "paymentMethod", "bankName", "accountNumber",
|
||||||
|
|
@ -271,9 +271,7 @@ class VaClientService {
|
||||||
|
|
||||||
return {
|
return {
|
||||||
userDetails: {
|
userDetails: {
|
||||||
firstName: userDetails.firstName,
|
name: userDetails.name,
|
||||||
lastName: userDetails.lastName,
|
|
||||||
name: `${userDetails.firstName} ${userDetails.lastName}`,
|
|
||||||
email: userDetails.email.toLowerCase(),
|
email: userDetails.email.toLowerCase(),
|
||||||
password: hashedPassword,
|
password: hashedPassword,
|
||||||
address: userDetails.address || null,
|
address: userDetails.address || null,
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
function getDayNumber(date = new Date()) {
|
function getDayNumber(date = new Date()) {
|
||||||
const today = new Date(date);
|
const today = new Date(date);
|
||||||
return today.getUTCDay(); // getDay() already returns 0-6 for Sunday-Saturday
|
return today.getDay(); // getDay() already returns 0-6 for Sunday-Saturday
|
||||||
}
|
}
|
||||||
|
|
||||||
export default getDayNumber;
|
export default getDayNumber;
|
||||||
|
|
@ -385,7 +385,7 @@
|
||||||
const activeProject = va?.lastProject?.name ? va.lastProject.name : '-';
|
const activeProject = va?.lastProject?.name ? va.lastProject.name : '-';
|
||||||
const workedTime = formatTime(va.currentSessionDuration);
|
const workedTime = formatTime(va.currentSessionDuration);
|
||||||
const projectsAssigned = va.projectsAssigned || 0;
|
const projectsAssigned = va.projectsAssigned || 0;
|
||||||
const viewLink = va.isCurrentlyActive ? `<a href="/live/${va.lastProjectId}/${va.id}" class="view-link" data-va-id="${va.id}" target="_blank">Live</a>` : '';
|
const viewLink = va.isCurrentlyActive ? `<a href="/live/${va.lastProjectId}/${va.id}" class="view-link" data-va-id="${va.id}" target="_blank">Live Tracking</a>` : '';
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<tr class="va-row" data-va-id="${va.id}">
|
<tr class="va-row" data-va-id="${va.id}">
|
||||||
|
|
|
||||||
|
|
@ -136,13 +136,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Password Change Section -->
|
||||||
<div class="profile-section">
|
<div class="profile-section">
|
||||||
<div class="password-section">
|
<div class="password-section">
|
||||||
<button class="change-password-btn" id="updateBankDetailsBtn">
|
|
||||||
<i class="fas fa-credit-card"></i>
|
|
||||||
Update Bank Details
|
|
||||||
</button>
|
|
||||||
<button class="change-password-btn" id="changePasswordBtn">
|
<button class="change-password-btn" id="changePasswordBtn">
|
||||||
<i class="fas fa-lock"></i>
|
<i class="fas fa-lock"></i>
|
||||||
Change Password
|
Change Password
|
||||||
|
|
@ -190,113 +186,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Bank Details Modal -->
|
|
||||||
<div id="bankDetailsModal" class="modal-overlay">
|
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">
|
|
||||||
<h2 class="modal-title">Update Bank Details</h2>
|
|
||||||
<button class="modal-close" onclick="closeBankDetailsModal()">
|
|
||||||
<i class="fas fa-times"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<form id="payment-form" class="modal-form">
|
|
||||||
<div class="payment-option" onclick="selectPaymentOption('card')">
|
|
||||||
<h4>Credit or Debit Card</h4>
|
|
||||||
<p>Pay securely with your card</p>
|
|
||||||
</div>
|
|
||||||
<div id="card-details" class="payment-details">
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="card-number" class="input-field" placeholder=" " required>
|
|
||||||
<label for="card-number" class="input-label">Card Number *</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="expiry-date" class="input-field" placeholder=" " required>
|
|
||||||
<label for="expiry-date" class="input-label">Expiry Date (MM/YY) *</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="security-code" class="input-field" placeholder=" " oninput="validateCVVVV(this)" onkeypress="return preventInvalidCVVChars(event)" maxlength="4" required>
|
|
||||||
<label for="security-code" class="input-label">Security Code *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="security-code-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
Please enter a valid security code
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="card-zip" class="input-field" placeholder=" " oninput="validateZipCode(this)" onkeypress="return preventNonNumericZip(event)" maxlength="10" required>
|
|
||||||
<label for="card-zip" class="input-label">ZIP Code *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="card-zip-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
ZIP code should contain only numbers
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="payment-option" onclick="selectPaymentOption('bank')">
|
|
||||||
<h4>Bank Account (ACH)</h4>
|
|
||||||
<p>Direct bank transfer</p>
|
|
||||||
</div>
|
|
||||||
<div id="bank-details" class="payment-details">
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="bank-name" class="input-field" placeholder=" " oninput="validateBankName(this)" onkeypress="return preventInvalidBankNameChars(event)" required>
|
|
||||||
<label for="bank-name" class="input-label">Bank Name *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="bank-name-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
Bank name should contain letters and cannot be only numbers or special characters
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="account-number" class="input-field" placeholder=" " oninput="validateAccountNumber(this)" onkeypress="return preventInvalidAccountNumberChars(event)" required>
|
|
||||||
<label for="account-number" class="input-label">Account Number *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="account-number-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
Please enter a valid account number
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="routing-number" class="input-field" placeholder=" " required>
|
|
||||||
<label for="routing-number" class="input-label">Routing Number *</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<select id="account-type" class="select-field" required>
|
|
||||||
<option value="" disable selected style="display: none"></option>
|
|
||||||
<option value="checking">Checking</option>
|
|
||||||
<option value="savings">Savings</option>
|
|
||||||
</select>
|
|
||||||
<label for="account-type" class="input-label">Account Type *</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="account-holder-name" class="input-field" placeholder=" " oninput="validateAccountHolderName(this)" onkeypress="return preventInvalidAccountHolderChars(event)" required>
|
|
||||||
<label for="account-holder-name" class="input-label">Account Holder Name *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="account-holder-name-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
Account holder name should only contain letters and spaces
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="modal-actions">
|
|
||||||
<button type="button" class="cancel-btn" onclick="closeBankDetailsModal()">Cancel</button>
|
|
||||||
<button type="submit" class="save-btn" id="saveBankDetailsBtn">Update Bank Details</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="logoutModal" class="modal-overlay">
|
<div id="logoutModal" class="modal-overlay">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
|
|
@ -446,47 +335,6 @@
|
||||||
clearErrorMessages();
|
clearErrorMessages();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Bank Details Modal Functions
|
|
||||||
function openBankDetailsModal() {
|
|
||||||
const modal = document.getElementById('bankDetailsModal');
|
|
||||||
modal.style.display = 'flex';
|
|
||||||
document.body.style.overflow = 'hidden';
|
|
||||||
|
|
||||||
// Clear form and errors
|
|
||||||
document.getElementById('payment-form').reset();
|
|
||||||
document.querySelectorAll('.payment-option').forEach(option => {
|
|
||||||
option.classList.remove('selected');
|
|
||||||
});
|
|
||||||
|
|
||||||
document.querySelectorAll('.payment-details').forEach(details => {
|
|
||||||
details.classList.remove('active');
|
|
||||||
// Remove required attributes from all payment fields
|
|
||||||
details.querySelectorAll('[required]').forEach(field => {
|
|
||||||
field.removeAttribute('required');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeBankDetailsModal() {
|
|
||||||
const modal = document.getElementById('bankDetailsModal');
|
|
||||||
modal.style.display = 'none';
|
|
||||||
document.body.style.overflow = 'auto';
|
|
||||||
|
|
||||||
// Clear form and errors
|
|
||||||
document.getElementById('payment-form').reset();
|
|
||||||
document.querySelectorAll('.payment-option').forEach(option => {
|
|
||||||
option.classList.remove('selected');
|
|
||||||
});
|
|
||||||
|
|
||||||
document.querySelectorAll('.payment-details').forEach(details => {
|
|
||||||
details.classList.remove('active');
|
|
||||||
// Remove required attributes from all payment fields
|
|
||||||
details.querySelectorAll('[required]').forEach(field => {
|
|
||||||
field.removeAttribute('required');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function clearErrorMessages() {
|
function clearErrorMessages() {
|
||||||
document.getElementById('currentPasswordError').textContent = '';
|
document.getElementById('currentPasswordError').textContent = '';
|
||||||
document.getElementById('newPasswordError').textContent = '';
|
document.getElementById('newPasswordError').textContent = '';
|
||||||
|
|
@ -588,8 +436,6 @@
|
||||||
// Change password button
|
// Change password button
|
||||||
document.getElementById('changePasswordBtn').addEventListener('click', openPasswordModal);
|
document.getElementById('changePasswordBtn').addEventListener('click', openPasswordModal);
|
||||||
|
|
||||||
document.getElementById('updateBankDetailsBtn').addEventListener('click', openBankDetailsModal);
|
|
||||||
|
|
||||||
// Password form submission
|
// Password form submission
|
||||||
document.getElementById('passwordForm').addEventListener('submit', changePassword);
|
document.getElementById('passwordForm').addEventListener('submit', changePassword);
|
||||||
|
|
||||||
|
|
@ -600,18 +446,11 @@
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
document.getElementById('bankDetailsModal').addEventListener('click', function(e) {
|
|
||||||
if (e.target === this) {
|
|
||||||
closeBankDetailsModal();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Close modal with escape key
|
// Close modal with escape key
|
||||||
document.addEventListener('keydown', function(e) {
|
document.addEventListener('keydown', function(e) {
|
||||||
if (e.key === 'Escape') {
|
if (e.key === 'Escape') {
|
||||||
closePasswordModal();
|
closePasswordModal();
|
||||||
closeLogoutModal();
|
closeLogoutModal();
|
||||||
closeBankDetailsModal();
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -634,625 +473,6 @@
|
||||||
sidebar.classList.toggle('active');
|
sidebar.classList.toggle('active');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// Function to select payment option
|
|
||||||
function selectPaymentOption(type) {
|
|
||||||
// Remove selected class from all options
|
|
||||||
document.querySelectorAll('.payment-option').forEach(option => {
|
|
||||||
option.classList.remove('selected');
|
|
||||||
});
|
|
||||||
|
|
||||||
document.querySelectorAll('.payment-details').forEach(details => {
|
|
||||||
details.classList.remove('active');
|
|
||||||
// Remove required attributes from all payment fields
|
|
||||||
details.querySelectorAll('[required]').forEach(field => {
|
|
||||||
field.removeAttribute('required');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Add selected class to clicked option
|
|
||||||
event.currentTarget.classList.add('selected');
|
|
||||||
|
|
||||||
if (type === 'card') {
|
|
||||||
document.getElementById('card-details').classList.add('active');
|
|
||||||
// Add required attributes only to card fields
|
|
||||||
document.getElementById('card-number').setAttribute('required', 'true');
|
|
||||||
document.getElementById('expiry-date').setAttribute('required', 'true');
|
|
||||||
document.getElementById('security-code').setAttribute('required', 'true');
|
|
||||||
document.getElementById('card-zip').setAttribute('required', 'true');
|
|
||||||
|
|
||||||
} else if (type === 'bank') {
|
|
||||||
document.getElementById('bank-details').classList.add('active');
|
|
||||||
// Add required attributes only to bank fields
|
|
||||||
document.getElementById('bank-name').setAttribute('required', 'true');
|
|
||||||
document.getElementById('account-number').setAttribute('required', 'true');
|
|
||||||
document.getElementById('routing-number').setAttribute('required', 'true');
|
|
||||||
document.getElementById('account-type').setAttribute('required', 'true');
|
|
||||||
document.getElementById('account-holder-name').setAttribute('required', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Bank Name validation
|
|
||||||
function validateBankName(input) {
|
|
||||||
const errorElement = document.getElementById('bank-name-error');
|
|
||||||
const value = input.value;
|
|
||||||
|
|
||||||
// Remove numbers and invalid special characters
|
|
||||||
const cleanValue = value.replace(/[^a-zA-Z\s\-'&.,()]/g, '');
|
|
||||||
|
|
||||||
if (value !== cleanValue) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check content
|
|
||||||
const contentCheck = value.replace(/[\s\-'&.,()]/g, '');
|
|
||||||
const hasOnlyNumbers = /^[0-9]+$/.test(contentCheck) && contentCheck.length > 0;
|
|
||||||
const hasOnlySpecialChars = /^[^a-zA-Z0-9]+$/.test(contentCheck) && contentCheck.length > 0;
|
|
||||||
const hasLetters = /[a-zA-Z]/.test(value);
|
|
||||||
|
|
||||||
if (value !== cleanValue && value.length > 0) {
|
|
||||||
errorElement.textContent = 'Bank name can only contain letters, spaces, and common punctuation';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (hasOnlyNumbers) {
|
|
||||||
errorElement.textContent = 'Bank name cannot be only numbers';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (hasOnlySpecialChars) {
|
|
||||||
errorElement.textContent = 'Bank name cannot be only special characters';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (!hasLetters && value.trim().length > 0) {
|
|
||||||
errorElement.textContent = 'Bank name must include letters';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function preventInvalidBankNameChars(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
const key = event.key;
|
|
||||||
|
|
||||||
if ((charCode >= 65 && charCode <= 90) ||
|
|
||||||
(charCode >= 97 && charCode <= 122) ||
|
|
||||||
charCode === 32 || charCode === 45 || charCode === 39 ||
|
|
||||||
charCode === 38 || charCode === 46 || charCode === 44 ||
|
|
||||||
charCode === 40 || charCode === 41 ||
|
|
||||||
charCode === 8 || charCode === 9 || charCode === 37 ||
|
|
||||||
charCode === 39 || charCode === 46 || charCode === 16 ||
|
|
||||||
charCode === 17 || charCode === 18 || charCode === 91 ||
|
|
||||||
/^[a-zA-Z\s\-'&.,()]$/.test(key)) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Enhanced Account Number validation
|
|
||||||
function validateAccountNumber(input) {
|
|
||||||
const errorElement = document.getElementById('account-number-error');
|
|
||||||
const value = input.value.replace(/\s/g, '');
|
|
||||||
|
|
||||||
// Remove any non-digit characters
|
|
||||||
const cleanValue = value.replace(/\D/g, '');
|
|
||||||
|
|
||||||
if (value !== cleanValue) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Validate account number
|
|
||||||
const isValid = validateAccountNumberStrict(cleanValue);
|
|
||||||
|
|
||||||
if (!isValid && cleanValue.length > 0) {
|
|
||||||
errorElement.textContent = getAccountNumberErrorMessage(cleanValue);
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function preventInvalidAccountNumberChars(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
|
|
||||||
if ((charCode >= 48 && charCode <= 57) ||
|
|
||||||
charCode === 8 || charCode === 9 || charCode === 37 ||
|
|
||||||
charCode === 39 || charCode === 46 || charCode === 16 ||
|
|
||||||
charCode === 17 || charCode === 18 || charCode === 91) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function validateAccountNumberStrict(accountNumber) {
|
|
||||||
if (!accountNumber || !/^\d+$/.test(accountNumber)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check length
|
|
||||||
if (accountNumber.length < 8 || accountNumber.length > 17) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check for invalid patterns
|
|
||||||
if (isInvalidAccountNumberPattern(accountNumber)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Simple checksum validation (basic example)
|
|
||||||
if (!isValidAccountNumberChecksum(accountNumber)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
function isInvalidAccountNumberPattern(accountNumber) {
|
|
||||||
const invalidPatterns = [
|
|
||||||
/^0+$/, // All zeros
|
|
||||||
/^1+$/, // All ones
|
|
||||||
/^2+$/, // All twos
|
|
||||||
/^3+$/, // All threes
|
|
||||||
/^4+$/, // All fours
|
|
||||||
/^5+$/, // All fives
|
|
||||||
/^6+$/, // All sixes
|
|
||||||
/^7+$/, // All sevens
|
|
||||||
/^8+$/, // All eights
|
|
||||||
/^9+$/, // All nines
|
|
||||||
/^12345678/, // Sequential
|
|
||||||
/^87654321/, // Reverse sequential
|
|
||||||
];
|
|
||||||
|
|
||||||
return invalidPatterns.some(pattern => pattern.test(accountNumber));
|
|
||||||
}
|
|
||||||
|
|
||||||
function isValidAccountNumberChecksum(accountNumber) {
|
|
||||||
// Basic checksum validation - you might want to implement
|
|
||||||
// a more specific algorithm based on bank requirements
|
|
||||||
let sum = 0;
|
|
||||||
for (let i = 0; i < accountNumber.length; i++) {
|
|
||||||
sum += parseInt(accountNumber.charAt(i));
|
|
||||||
}
|
|
||||||
|
|
||||||
// Simple check: sum shouldn't be too low (e.g., all zeros)
|
|
||||||
return sum > 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
function getAccountNumberErrorMessage(accountNumber) {
|
|
||||||
if (!accountNumber) {
|
|
||||||
return 'Account number is required';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!/^\d+$/.test(accountNumber)) {
|
|
||||||
return 'Account number must contain only numbers';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (accountNumber.length < 8) {
|
|
||||||
return 'Account number must be at least 8 digits';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (accountNumber.length > 17) {
|
|
||||||
return 'Account number cannot exceed 17 digits';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isInvalidAccountNumberPattern(accountNumber)) {
|
|
||||||
return 'Please enter a valid account number';
|
|
||||||
}
|
|
||||||
|
|
||||||
return 'Please enter a valid account number';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Account Holder Name validation
|
|
||||||
function validateAccountHolderName(input) {
|
|
||||||
const errorElement = document.getElementById('account-holder-name-error');
|
|
||||||
const value = input.value;
|
|
||||||
|
|
||||||
// Remove numbers and special characters (keep only letters and spaces)
|
|
||||||
const cleanValue = value.replace(/[^a-zA-Z\s]/g, '');
|
|
||||||
|
|
||||||
if (value !== cleanValue) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check content
|
|
||||||
const hasOnlyNumbers = /^[0-9]+$/.test(value.replace(/\s/g, ''));
|
|
||||||
const hasOnlySpecialChars = /^[^a-zA-Z0-9]+$/.test(value.replace(/\s/g, ''));
|
|
||||||
const hasLetters = /[a-zA-Z]/.test(value);
|
|
||||||
|
|
||||||
if (value !== cleanValue && value.length > 0) {
|
|
||||||
errorElement.textContent = 'Account holder name can only contain letters and spaces';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (hasOnlyNumbers) {
|
|
||||||
errorElement.textContent = 'Account holder name cannot contain only numbers';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (hasOnlySpecialChars) {
|
|
||||||
errorElement.textContent = 'Account holder name cannot contain only special characters';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else if (!hasLetters && value.trim().length > 0) {
|
|
||||||
errorElement.textContent = 'Account holder name must include letters';
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function preventInvalidAccountHolderChars(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
const key = event.key;
|
|
||||||
|
|
||||||
if ((charCode >= 65 && charCode <= 90) ||
|
|
||||||
(charCode >= 97 && charCode <= 122) ||
|
|
||||||
charCode === 32 ||
|
|
||||||
charCode === 8 || charCode === 9 || charCode === 37 ||
|
|
||||||
charCode === 39 || charCode === 46 || charCode === 16 ||
|
|
||||||
charCode === 17 || charCode === 18 || charCode === 91 ||
|
|
||||||
/^[a-zA-Z\s]$/.test(key)) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function preventNonNumericZip(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
const key = event.key;
|
|
||||||
const currentValue = event.target.value;
|
|
||||||
|
|
||||||
// Allow: numbers, hyphens (only in specific positions), and editing keys
|
|
||||||
if ((charCode >= 48 && charCode <= 57) || // 0-9
|
|
||||||
(charCode === 45 && currentValue.length === 5 && !currentValue.includes('-')) || // hyphen only after 5 digits
|
|
||||||
charCode === 8 || // backspace
|
|
||||||
charCode === 9 || // tab
|
|
||||||
charCode === 37 || // left arrow
|
|
||||||
charCode === 39 || // right arrow
|
|
||||||
charCode === 46 || // delete
|
|
||||||
charCode === 16 || // shift
|
|
||||||
charCode === 17 || // ctrl
|
|
||||||
charCode === 18 || // alt
|
|
||||||
charCode === 91) { // cmd (Mac)
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Prevent all other characters including letters and special characters
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to validate ZIP code in real-time
|
|
||||||
function validateZipCode(input) {
|
|
||||||
let errorElement;
|
|
||||||
|
|
||||||
// Determine which error element to use based on input ID
|
|
||||||
if (input.id === 'billing-zip') {
|
|
||||||
errorElement = document.getElementById('billing-zip-error');
|
|
||||||
} else if (input.id === 'card-zip') {
|
|
||||||
errorElement = document.getElementById('card-zip-error');
|
|
||||||
} else {
|
|
||||||
errorElement = document.getElementById('zip-error');
|
|
||||||
}
|
|
||||||
|
|
||||||
const value = input.value;
|
|
||||||
|
|
||||||
// Remove any non-numeric characters except hyphens
|
|
||||||
const cleanValue = value.replace(/[^0-9\-]/g, '');
|
|
||||||
|
|
||||||
// If invalid characters were removed, update the input value
|
|
||||||
if (value !== cleanValue) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Format ZIP code as user types (add hyphen after 5 digits)
|
|
||||||
if (cleanValue.length === 5 && !cleanValue.includes('-')) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
} else if (cleanValue.length > 5 && !cleanValue.includes('-')) {
|
|
||||||
input.value = cleanValue.substring(0, 5) + '' + cleanValue.substring(5, 9);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
if (input.value.length < 4) {
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Function to validate CVV in real-time
|
|
||||||
function validateCVVVV(input) {
|
|
||||||
const errorElement = document.getElementById('security-code-error');
|
|
||||||
const value = input.value;
|
|
||||||
|
|
||||||
// Remove any non-digit characters
|
|
||||||
const cleanValue = value.replace(/\D/g, '');
|
|
||||||
|
|
||||||
// If non-digits were removed, update the input value
|
|
||||||
if (value !== cleanValue) {
|
|
||||||
input.value = cleanValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Get card type to determine expected CVV length
|
|
||||||
const cardNumber = document.getElementById('card-number').value;
|
|
||||||
const cardType = detectCardType(cardNumber);
|
|
||||||
|
|
||||||
// Validate CVV format and content
|
|
||||||
const isValid = validateCVVStrict(cleanValue, cardType);
|
|
||||||
|
|
||||||
if (!isValid && cleanValue.length > 0) {
|
|
||||||
errorElement.textContent = getCVVErrorMessage(cleanValue, cardType);
|
|
||||||
errorElement.style.display = 'block';
|
|
||||||
input.classList.add('field-error');
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
errorElement.style.display = 'none';
|
|
||||||
input.classList.remove('field-error');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Card type detection
|
|
||||||
function detectCardType(cardNumber) {
|
|
||||||
// Remove spaces and dashes
|
|
||||||
const cleanNumber = cardNumber.replace(/[\s-]/g, '');
|
|
||||||
|
|
||||||
const cardPatterns = {
|
|
||||||
visa: /^4[0-9]{12}(?:[0-9]{3})?$/,
|
|
||||||
mastercard: /^5[1-5][0-9]{14}$/,
|
|
||||||
amex: /^3[47][0-9]{13}$/,
|
|
||||||
discover: /^6(?:011|5[0-9]{2})[0-9]{12}$/,
|
|
||||||
diners: /^3(?:0[0-5]|[68][0-9])[0-9]{11}$/,
|
|
||||||
jcb: /^(?:2131|1800|35\d{3})\d{11}$/
|
|
||||||
};
|
|
||||||
|
|
||||||
for (const [type, pattern] of Object.entries(cardPatterns)) {
|
|
||||||
if (pattern.test(cleanNumber)) {
|
|
||||||
return type;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return 'unknown';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to prevent invalid character input in CVV field
|
|
||||||
function preventInvalidCVVChars(event) {
|
|
||||||
const charCode = event.which ? event.which : event.keyCode;
|
|
||||||
const key = event.key;
|
|
||||||
|
|
||||||
// Allow only digits and common editing keys
|
|
||||||
if ((charCode >= 48 && charCode <= 57) || // 0-9
|
|
||||||
charCode === 8 || // backspace
|
|
||||||
charCode === 9 || // tab
|
|
||||||
charCode === 37 || // left arrow
|
|
||||||
charCode === 39 || // right arrow
|
|
||||||
charCode === 46 || // delete
|
|
||||||
charCode === 16 || // shift
|
|
||||||
charCode === 17 || // ctrl
|
|
||||||
charCode === 18 || // alt
|
|
||||||
charCode === 91) { // cmd (Mac)
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Prevent all non-digit characters
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Enhanced CVV validation function
|
|
||||||
function validateCVVStrict(cvv, cardType) {
|
|
||||||
if (!cvv || !/^\d+$/.test(cvv)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check for invalid patterns
|
|
||||||
if (isInvalidCVVPattern(cvv)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
const cvvLengths = {
|
|
||||||
visa: 3,
|
|
||||||
mastercard: 3,
|
|
||||||
amex: 4,
|
|
||||||
discover: 3,
|
|
||||||
diners: 3,
|
|
||||||
jcb: 3
|
|
||||||
};
|
|
||||||
|
|
||||||
const expectedLength = cvvLengths[cardType] || 3;
|
|
||||||
|
|
||||||
// Check length
|
|
||||||
if (cvv.length !== expectedLength) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to check for invalid CVV patterns
|
|
||||||
function isInvalidCVVPattern(cvv) {
|
|
||||||
const invalidPatterns = [
|
|
||||||
/^0+$/, // All zeros: 000, 0000
|
|
||||||
/^1+$/, // All ones: 111, 1111
|
|
||||||
/^2+$/, // All twos: 222, 2222
|
|
||||||
/^3+$/, // All threes: 333, 3333
|
|
||||||
/^4+$/, // All fours: 444, 4444
|
|
||||||
/^5+$/, // All fives: 555, 5555
|
|
||||||
/^6+$/, // All sixes: 666, 6666
|
|
||||||
/^7+$/, // All sevens: 777, 7777
|
|
||||||
/^8+$/, // All eights: 888, 8888
|
|
||||||
/^9+$/, // All nines: 999, 9999
|
|
||||||
];
|
|
||||||
|
|
||||||
return invalidPatterns.some(pattern => pattern.test(cvv));
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to get appropriate CVV error message
|
|
||||||
function getCVVErrorMessage(cvv, cardType) {
|
|
||||||
if (!cvv) {
|
|
||||||
return 'Security code is required';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!/^\d+$/.test(cvv)) {
|
|
||||||
return 'Security code must contain only numbers';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isInvalidCVVPattern(cvv)) {
|
|
||||||
return 'Please enter a valid security code';
|
|
||||||
}
|
|
||||||
|
|
||||||
const cvvLengths = {
|
|
||||||
visa: 3,
|
|
||||||
mastercard: 3,
|
|
||||||
amex: 4,
|
|
||||||
discover: 3,
|
|
||||||
diners: 3,
|
|
||||||
jcb: 3
|
|
||||||
};
|
|
||||||
|
|
||||||
const expectedLength = cvvLengths[cardType] || 3;
|
|
||||||
|
|
||||||
if (cvv.length !== expectedLength) {
|
|
||||||
if (cardType === 'amex') {
|
|
||||||
return 'American Express cards require a 4-digit security code';
|
|
||||||
} else {
|
|
||||||
return `Security code must be ${expectedLength} digits`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return 'Please enter a valid security code';
|
|
||||||
}
|
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// Real-time card number formatting and validation
|
|
||||||
const cardNumberInput = document.getElementById('card-number');
|
|
||||||
if (cardNumberInput) {
|
|
||||||
cardNumberInput.addEventListener('input', function(e) {
|
|
||||||
const cursorPosition = e.target.selectionStart;
|
|
||||||
const originalLength = e.target.value.length;
|
|
||||||
// Format card number with spaces
|
|
||||||
let value = e.target.value.replace(/\s/g, '');
|
|
||||||
let formattedValue = '';
|
|
||||||
|
|
||||||
for (let i = 0; i < value.length; i++) {
|
|
||||||
if (i > 0 && i % 4 === 0) {
|
|
||||||
formattedValue += ' ';
|
|
||||||
}
|
|
||||||
formattedValue += value[i];
|
|
||||||
}
|
|
||||||
|
|
||||||
e.target.value = formattedValue;
|
|
||||||
|
|
||||||
let newCursorPosition = cursorPosition;
|
|
||||||
|
|
||||||
if (formattedValue.length > originalLength) {
|
|
||||||
const addedChars = formattedValue.length - originalLength;
|
|
||||||
|
|
||||||
// Count how many spaces were added before the cursor position
|
|
||||||
let spacesAddedBeforeCursor = 0;
|
|
||||||
for (let i = 0; i < cursorPosition && i < formattedValue.length; i++) {
|
|
||||||
if (formattedValue[i] === ' ' && (i < cursorPosition ||
|
|
||||||
(i === cursorPosition && formattedValue[i] === ' '))) {
|
|
||||||
spacesAddedBeforeCursor++;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
newCursorPosition = cursorPosition + spacesAddedBeforeCursor;
|
|
||||||
} else if (formattedValue.length < originalLength) {
|
|
||||||
const removedChars = originalLength - formattedValue.length;
|
|
||||||
|
|
||||||
// Count how many spaces were removed before the cursor position
|
|
||||||
let spacesRemovedBeforeCursor = 0;
|
|
||||||
const oldValue = e.target.getAttribute('data-old-value') || '';
|
|
||||||
for (let i = 0; i < cursorPosition && i < oldValue.length; i++) {
|
|
||||||
if (oldValue[i] === ' ' && i < cursorPosition) {
|
|
||||||
spacesRemovedBeforeCursor++;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
newCursorPosition = Math.max(0, cursorPosition - spacesRemovedBeforeCursor);
|
|
||||||
}
|
|
||||||
|
|
||||||
e.target.setAttribute('data-old-value', formattedValue);
|
|
||||||
e.target.setSelectionRange(newCursorPosition, newCursorPosition);
|
|
||||||
|
|
||||||
// Real-time card type detection
|
|
||||||
const cardType = detectCardType(value);
|
|
||||||
if (cardType !== 'unknown') {
|
|
||||||
// You can add visual feedback for card type here
|
|
||||||
console.log('Card type:', cardType);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
cardNumberInput.addEventListener('keydown', function(e) {
|
|
||||||
// Allow: backspace, delete, tab, escape, enter, arrows, home, end
|
|
||||||
if ([8, 9, 13, 27, 37, 38, 39, 40, 46].includes(e.keyCode) ||
|
|
||||||
// Allow: Ctrl+A, Ctrl+C, Ctrl+V, Ctrl+X
|
|
||||||
(e.keyCode === 65 && e.ctrlKey === true) ||
|
|
||||||
(e.keyCode === 67 && e.ctrlKey === true) ||
|
|
||||||
(e.keyCode === 86 && e.ctrlKey === true) ||
|
|
||||||
(e.keyCode === 88 && e.ctrlKey === true) ||
|
|
||||||
// Allow: numbers and numpad numbers
|
|
||||||
(e.keyCode >= 48 && e.keyCode <= 57) ||
|
|
||||||
(e.keyCode >= 96 && e.keyCode <= 105)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Prevent all other keys
|
|
||||||
e.preventDefault();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Real-time expiry date formatting
|
|
||||||
const expiryInput = document.getElementById('expiry-date');
|
|
||||||
if (expiryInput) {
|
|
||||||
expiryInput.addEventListener('input', function(e) {
|
|
||||||
let value = e.target.value.replace(/\D/g, '');
|
|
||||||
if (value.length >= 2) {
|
|
||||||
value = value.substring(0, 2) + '/' + value.substring(2, 4);
|
|
||||||
}
|
|
||||||
e.target.value = value;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Real-time CVV validation
|
|
||||||
const cvvInput = document.getElementById('security-code');
|
|
||||||
if (cvvInput) {
|
|
||||||
cvvInput.addEventListener('input', function(e) {
|
|
||||||
e.target.value = e.target.value.replace(/\D/g, '').substring(0, 4);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -448,7 +448,7 @@
|
||||||
const activeProject = va?.lastProject?.name ? va.lastProject.name : '-';
|
const activeProject = va?.lastProject?.name ? va.lastProject.name : '-';
|
||||||
const workedTime = formatTime(va.currentSessionDuration);
|
const workedTime = formatTime(va.currentSessionDuration);
|
||||||
const projectsAssigned = va.projectsAssigned || 0;
|
const projectsAssigned = va.projectsAssigned || 0;
|
||||||
const viewLink = va.isCurrentlyActive ? `<a href="/live/${va.lastProjectId}/${va.id}" class="view-link va-action" data-va-id="${va.id}" target="_blank">Live</a>` : `<a class="va-logs va-action" data-va-id="${va.id}" target="_blank" href="/client/virtual-assistants/view-logs?va=${va.id}">Logs</a>`;
|
const viewLink = va.isCurrentlyActive ? `<a href="/live/${va.lastProjectId}/${va.id}" class="view-link va-action" data-va-id="${va.id}" target="_blank">Live Tracking</a>` : `<a class="va-logs va-action" data-va-id="${va.id}" target="_blank" href="/client/virtual-assistants/view-logs?va=${va.id}">Logs</a>`;
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<tr class="va-row" data-va-id="${va.id}">
|
<tr class="va-row" data-va-id="${va.id}">
|
||||||
|
|
|
||||||
|
|
@ -98,20 +98,11 @@
|
||||||
<form id="account-form">
|
<form id="account-form">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<div class="input-container">
|
<div class="input-container">
|
||||||
<input type="text" id="first-name" class="input-field" placeholder=" " oninput="validateFirstName(this)" required>
|
<input type="text" id="company-name" class="input-field" placeholder=" " oninput="validateCompanyName(this)" required>
|
||||||
<label for="first-name" class="input-label">First Name *</label>
|
<label for="company-name" class="input-label">Company / Client Name *</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="invalid-feedback" id="first-name-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
<div class="invalid-feedback" id="company-name-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
||||||
First name should only contain letters, numbers, spaces, hyphens, apostrophes, ampersands, and periods
|
Company name should only contain letters, numbers, spaces, hyphens, apostrophes, ampersands, and periods
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-container">
|
|
||||||
<input type="text" id="last-name" class="input-field" placeholder=" " oninput="validateLastName(this)" required>
|
|
||||||
<label for="last-name" class="input-label">Last Name *</label>
|
|
||||||
</div>
|
|
||||||
<div class="invalid-feedback" id="last-name-error" style="display: none; color: #dc3545; font-size: 12px; margin-top: 5px;">
|
|
||||||
Last name should only contain letters, numbers, spaces, hyphens, apostrophes, ampersands, and periods
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue