pcwvanbeers/assetmgt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance product links and translations; update styles and add registration modal

Browse Source 
- Updated product links in rma.php and rma_manage.php to include icons for better UX.
- Improved German, Spanish, Dutch, Polish, Portuguese, and US translations with new phrases for software licenses and user information prompts.
- Refactored CSS to remove redundant styles and added new styles for a registration modal, enhancing the overall UI.
- Introduced JavaScript variables for user information prompts in softwaretool.php for better localization support.
This commit is contained in:
“VeLiTi”
2026-01-12 15:59:46 +01:00
parent be6f73b19c
commit 884d2a3366
21 changed files with 1332 additions and 355 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
assets/functions.php
View File

@@ -1755,7 +1755,7 @@ function warrantyStatus($input){
if (!empty($input) && $input < $warrantydate){
$warranty_date_due = '<span class="status warranty_outdated">'.$warranty_outdated_text.'</span>';
} else {
$warranty_date_due ='<span class="status warranty">'.$warranty_recent.' ('.date('Y-m-d', strtotime($input. ' + 365 days')).')</span>';
$warranty_date_due ='<span class="">'.$warranty_recent.' ('.date('Y-m-d', strtotime($input. ' + 365 days')).')</span>';
}
return $warranty_date_due;
@@ -1788,7 +1788,7 @@ function serviceStatus($input){
if (!empty($input) && $input < $servicedate){
$service_date_due = '<span class="status service_renewal">'.$service_renewal_text.'</span>';
} else {
$service_date_due ='<span class="status service">'.$service_recent.' ('.date('Y-m-d', strtotime($input. ' + 365 days')).')</span>';
$service_date_due ='<span class="">'.$service_recent.' ('.date('Y-m-d', strtotime($input. ' + 365 days')).')</span>';
}
return $service_date_due;
@@ -1815,7 +1815,7 @@ function availableFirmware($sw_version,$sw_version_latest){
switch ($sw_version_latest) {
case 1:
$message = '<span class="status firmware_recent">'.$firmware_recent_text.'</span>';
$message = '<span class="">'.$firmware_recent_text.'</span>';
break;
case 0:
@@ -1823,7 +1823,7 @@ function availableFirmware($sw_version,$sw_version_latest){
break;
default:
$message ='<span class="status">✓</span>';
$message ='<span class="">✓</span>';
break;
}

210
assets/softwaretool.js
View File

@@ -73,7 +73,7 @@ async function connectDeviceForSoftware() {
readBar.innerHTML = '';
serialResultsDiv.innerHTML = '';
document.getElementById("softwareCheckStatus").style.display = "none";
document.getElementById("softwareOptions").style.display = "none";
document.getElementById("softwareOptionsContainer").style.display = "none";
document.getElementById("noUpdatesMessage").style.display = "none";
document.getElementById("uploadSection").style.display = "none";
@@ -443,12 +443,15 @@ async function fetchSoftwareOptions() {
return;
}
// Display options in table
// Display options in table (blurred initially)
displaySoftwareOptions(options);
document.getElementById("softwareCheckStatus").style.display = "none";
document.getElementById("softwareOptions").style.display = "block";
document.getElementById("softwareOptionsContainer").style.display = "block";
progressBar("100", "Software options loaded", "#04AA6D");
// Show user info modal immediately
showUserInfoModal();
} catch (error) {
await logCommunication(`Software options error: ${error.message}`, 'error');
progressBar("0", "Error loading options: " + error.message, "#ff6666");
@@ -642,18 +645,189 @@ function displaySoftwareOptions(options) {
});
}
function showUserInfoModal() {
// Create modal overlay
const modal = document.createElement("div");
modal.id = "userInfoModal";
modal.style.cssText = `
display: flex;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.7);
z-index: 2000;
align-items: center;
justify-content: center;
`;
// Create modal content
const modalContent = document.createElement("div");
modalContent.style.cssText = `
background: white;
border-radius: 12px;
max-width: 500px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
margin: 20px;
box-shadow: 0 20px 60px rgba(0,0,0,0.4);
`;
modalContent.innerHTML = `
<div style="padding: 30px; border-bottom: 2px solid #e0e0e0;">
<h3 style="margin: 0; color: #333; font-size: 24px;">${typeof TRANS_USER_INFO_REQUIRED !== 'undefined' ? TRANS_USER_INFO_REQUIRED : 'User Information Required'}</h3>
<p style="margin: 10px 0 0 0; color: #666; font-size: 14px;">${typeof TRANS_USER_INFO_DESCRIPTION !== 'undefined' ? TRANS_USER_INFO_DESCRIPTION : 'Please provide your information to continue with software updates'}</p>
</div>
<div style="padding: 30px;">
<form id="userInfoForm" style="display: flex; flex-direction: column; gap: 15px;">
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 600;">${typeof TRANS_NAME !== 'undefined' ? TRANS_NAME : 'Name'} *</label>
<input type="text" name="name" id="userInfoName" required style="width: 100%; padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 600;">${typeof TRANS_EMAIL !== 'undefined' ? TRANS_EMAIL : 'Email'} *</label>
<input type="email" name="email" id="userInfoEmail" required style="width: 100%; padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 600;">${typeof TRANS_ADDRESS !== 'undefined' ? TRANS_ADDRESS : 'Address'} *</label>
<input type="text" name="address" id="userInfoAddress" required placeholder="Street and number" style="width: 100%; padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; margin-bottom: 10px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
<input type="text" name="city" id="userInfoCity" required placeholder="${typeof TRANS_CITY !== 'undefined' ? TRANS_CITY : 'City'}" style="width: 100%; padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; margin-bottom: 10px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
<input type="text" name="postal" id="userInfoPostal" required placeholder="${typeof TRANS_POSTAL !== 'undefined' ? TRANS_POSTAL : 'Postal code'}" style="padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
<input type="text" name="country" id="userInfoCountry" required placeholder="${typeof TRANS_COUNTRY !== 'undefined' ? TRANS_COUNTRY : 'Country'}" style="padding: 12px; border: 2px solid #ddd; border-radius: 6px; font-size: 14px; transition: border 0.3s;" onfocus="this.style.borderColor='#04AA6D'" onblur="this.style.borderColor='#ddd'">
</div>
</div>
<div style="margin-top: 10px; display: flex; gap: 10px;">
<button type="button" onclick="location.reload()" style="padding: 15px 20px; background: #6c757d; color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s;" onmouseover="this.style.background='#5a6268'" onmouseout="this.style.background='#6c757d'">
<i class="fa-solid fa-times"></i>
</button>
<button type="submit" style="flex: 1; padding: 15px; background: linear-gradient(135deg, #04AA6D 0%, #038f5a 100%); color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s;" onmouseover="this.style.transform='translateY(-2px)'; this.style.boxShadow='0 6px 16px rgba(4,170,109,0.3)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='none'">
${typeof TRANS_CONTINUE !== 'undefined' ? TRANS_CONTINUE : 'Continue'}
</button>
</div>
</form>
</div>
`;
modal.appendChild(modalContent);
document.body.appendChild(modal);
// Prefill form with customer data from sessionStorage if available
const savedCustomerData = sessionStorage.getItem('customerData');
if (savedCustomerData) {
try {
const customerData = JSON.parse(savedCustomerData);
if (customerData.name) document.getElementById("userInfoName").value = customerData.name;
if (customerData.email) document.getElementById("userInfoEmail").value = customerData.email;
if (customerData.address) document.getElementById("userInfoAddress").value = customerData.address;
if (customerData.city) document.getElementById("userInfoCity").value = customerData.city;
if (customerData.postal) document.getElementById("userInfoPostal").value = customerData.postal;
if (customerData.country) document.getElementById("userInfoCountry").value = customerData.country;
} catch (e) {
console.warn('Error parsing saved customer data:', e);
}
}
// Handle form submission
document.getElementById("userInfoForm").onsubmit = async (e) => {
e.preventDefault();
const formData = new FormData(e.target);
const customerData = {
name: formData.get("name"),
email: formData.get("email"),
address: formData.get("address"),
city: formData.get("city"),
postal: formData.get("postal"),
country: formData.get("country")
};
// Save customer data to sessionStorage
sessionStorage.setItem('customerData', JSON.stringify(customerData));
// Send to API
await sendUserInfoToAPI(customerData);
// Close modal
document.body.removeChild(modal);
// Reveal software options by removing blur
const softwareOptions = document.getElementById("softwareOptions");
if (softwareOptions) {
softwareOptions.style.filter = "none";
softwareOptions.style.opacity = "1";
softwareOptions.style.pointerEvents = "auto";
}
};
}
async function sendUserInfoToAPI(customerData) {
try {
const serviceToken = document.getElementById("servicetoken")?.innerHTML || '';
const url = link + '/v2/history';
const bearer = 'Bearer ' + serviceToken;
const historyData = {
sn: deviceSerialNumber,
type: 'customer',
sn_service: 'Portal',
payload: customerData
};
await logCommunication(`Sending user info to API: ${JSON.stringify(historyData)}`, 'sent');
const response = await fetch(url, {
method: 'POST',
withCredentials: true,
credentials: 'include',
headers: {
'Authorization': bearer,
'Content-Type': 'application/json'
},
body: JSON.stringify(historyData)
});
if (!response.ok) {
console.warn('Failed to send user info:', response.status);
await logCommunication(`Failed to send user info: ${response.status}`, 'error');
} else {
const result = await response.json();
console.log("User info sent successfully:", result);
await logCommunication(`User info sent successfully: ${JSON.stringify(result)}`, 'received');
}
} catch (error) {
console.warn('Error sending user info:', error);
await logCommunication(`Error sending user info: ${error.message}`, 'error');
}
}
async function selectUpgrade(option) {
const price = parseFloat(option.price || 0);
const isFree = price === 0;
// If paid upgrade, show payment modal first
// If paid upgrade, show payment modal with pre-filled data
if (!isFree) {
showPaymentModal(option);
return;
}
// Free upgrade - show confirmation modal first
showFreeInstallModal(option);
// Free upgrade - proceed directly with saved customer data
const savedCustomerData = sessionStorage.getItem('customerData');
if (savedCustomerData) {
try {
const customerData = JSON.parse(savedCustomerData);
await downloadAndInstallSoftware(option, customerData);
} catch (e) {
console.warn('Error parsing saved customer data:', e);
showFreeInstallModal(option);
}
} else {
showFreeInstallModal(option);
}
}
function showFreeInstallModal(option) {
@@ -699,22 +873,22 @@ function showFreeInstallModal(option) {
<form id="freeInstallForm" style="display: flex; flex-direction: column; gap: 15px;">
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Name *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_NAME !== 'undefined' ? TRANS_NAME : 'Name'} *</label>
<input type="text" name="name" id="freeInstallName" required style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Email *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_EMAIL !== 'undefined' ? TRANS_EMAIL : 'Email'} *</label>
<input type="email" name="email" id="freeInstallEmail" required style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Address *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_ADDRESS !== 'undefined' ? TRANS_ADDRESS : 'Address'} *</label>
<input type="text" name="address" id="freeInstallAddress" required placeholder="Street and number" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<input type="text" name="city" id="freeInstallCity" required placeholder="City" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<input type="text" name="city" id="freeInstallCity" required placeholder="${typeof TRANS_CITY !== 'undefined' ? TRANS_CITY : 'City'}" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
<input type="text" name="postal" id="freeInstallPostal" required placeholder="Postal code" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="country" id="freeInstallCountry" required placeholder="Country" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="postal" id="freeInstallPostal" required placeholder="${typeof TRANS_POSTAL !== 'undefined' ? TRANS_POSTAL : 'Postal code'}" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="country" id="freeInstallCountry" required placeholder="${typeof TRANS_COUNTRY !== 'undefined' ? TRANS_COUNTRY : 'Country'}" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
</div>
@@ -837,22 +1011,22 @@ function showPaymentModal(option) {
<form id="paymentForm" style="display: flex; flex-direction: column; gap: 15px;">
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Name *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_NAME !== 'undefined' ? TRANS_NAME : 'Name'} *</label>
<input type="text" name="name" id="paymentName" required style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Email *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_EMAIL !== 'undefined' ? TRANS_EMAIL : 'Email'} *</label>
<input type="email" name="email" id="paymentEmail" required style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
<div>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">Address *</label>
<label style="display: block; margin-bottom: 5px; color: #333; font-weight: 500;">${typeof TRANS_ADDRESS !== 'undefined' ? TRANS_ADDRESS : 'Address'} *</label>
<input type="text" name="address" id="paymentAddress" required placeholder="Street and number" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<input type="text" name="city" id="paymentCity" required placeholder="City" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<input type="text" name="city" id="paymentCity" required placeholder="${typeof TRANS_CITY !== 'undefined' ? TRANS_CITY : 'City'}" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px;">
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px;">
<input type="text" name="postal" id="paymentPostal" required placeholder="Postal code" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="country" id="paymentCountry" required placeholder="Country" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="postal" id="paymentPostal" required placeholder="${typeof TRANS_POSTAL !== 'undefined' ? TRANS_POSTAL : 'Postal code'}" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
<input type="text" name="country" id="paymentCountry" required placeholder="${typeof TRANS_COUNTRY !== 'undefined' ? TRANS_COUNTRY : 'Country'}" style="padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;">
</div>
</div>