248 lines
6.6 KiB
HTML
248 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Check and Upgrade Your Plan</title>
|
|
<style>
|
|
body {
|
|
font-family: "Inter", "Segoe UI", Arial, sans-serif;
|
|
background-color: #f4f5f7;
|
|
color: #333;
|
|
margin: 0;
|
|
padding: 40px;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.summary-container {
|
|
background: #fff;
|
|
border-radius: 12px;
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.06);
|
|
padding: 40px;
|
|
max-width: 720px;
|
|
width: 100%;
|
|
}
|
|
|
|
h2 {
|
|
text-align: center;
|
|
color: #262626;
|
|
margin-bottom: 8px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.subtitle {
|
|
text-align: center;
|
|
font-size: 0.9em;
|
|
color: #777;
|
|
margin-bottom: 30px;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 20px;
|
|
}
|
|
|
|
.grid-item {
|
|
background: #fafafa;
|
|
border: 1px solid #e2e2e2;
|
|
border-radius: 8px;
|
|
padding: 15px 20px;
|
|
}
|
|
|
|
.grid-item.full {
|
|
grid-column: 1 / -1;
|
|
}
|
|
|
|
.label {
|
|
font-weight: 600;
|
|
font-size: 0.9em;
|
|
color: #555;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.value {
|
|
font-size: 1.1em;
|
|
color: #222;
|
|
}
|
|
|
|
.footer {
|
|
text-align: center;
|
|
font-size: 0.9em;
|
|
color: #888;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
/* Button styling */
|
|
.actions {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin-top: 40px;
|
|
gap: 15px;
|
|
}
|
|
|
|
.action-row {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 20px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.action-btn {
|
|
background-color: #875A7B; /* Odoo purple */
|
|
color: white;
|
|
border: none;
|
|
border-radius: 8px;
|
|
padding: 10px 22px;
|
|
font-size: 15px;
|
|
cursor: pointer;
|
|
transition: background-color 0.2s ease, transform 0.1s ease;
|
|
min-width: 180px;
|
|
}
|
|
|
|
.action-btn:hover {
|
|
background-color: #744e6a;
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.action-btn.secondary {
|
|
background-color: #6c757d;
|
|
}
|
|
|
|
.action-btn.secondary:hover {
|
|
background-color: #5a636a;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="summary-container">
|
|
<h2>Check and Upgrade Your Plan</h2>
|
|
<div class="subtitle">
|
|
Review your current Odoo configuration and choose an upgrade option below.
|
|
</div>
|
|
|
|
<div class="grid">
|
|
<div class="grid-item">
|
|
<div class="label">GIT</div>
|
|
<div class="value" id="gitValue">Loading...</div>
|
|
</div>
|
|
|
|
<div class="grid-item">
|
|
<div class="label">Domains</div>
|
|
<div class="value" id="domainsValue">Loading...</div>
|
|
</div>
|
|
|
|
<div class="grid-item">
|
|
<div class="label">Backup Slots</div>
|
|
<div class="value" id="backupValue">Loading...</div>
|
|
</div>
|
|
|
|
<div class="grid-item">
|
|
<div class="label">Workers</div>
|
|
<div class="value" id="workersValue">Loading...</div>
|
|
</div>
|
|
|
|
<div class="grid-item full">
|
|
<div class="label">HDD (MB)</div>
|
|
<div class="value" id="hddValue">Loading...</div>
|
|
</div>
|
|
|
|
<div class="grid-item full">
|
|
<div class="label">Expires</div>
|
|
<div class="value" id="expiresValue">Loading...</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Buttons -->
|
|
<div class="actions">
|
|
<div class="action-row">
|
|
<button class="action-btn" id="upgradeRiseBtn">Upgrade to "On the Rise"</button>
|
|
<button class="action-btn" id="upgradePowerhouseBtn">Upgrade to "Powerhouse"</button>
|
|
</div>
|
|
<div class="action-row">
|
|
<button class="action-btn secondary" id="addDomainBtn">Add a Domain</button>
|
|
<button class="action-btn secondary" id="addBackupsBtn">Add 5 Backup Slots</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer" id="uuidDisplay">
|
|
UUID: <span id="uuidText">Loading...</span>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Configuration
|
|
const webhookUrl = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/0c8536be-d175-4740-8e78-123159193b23";
|
|
const webhook_buy = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/buy"; // <-- easy to configure
|
|
|
|
const params = new URLSearchParams(window.location.search);
|
|
const uuid = params.get("uuid");
|
|
|
|
async function loadData() {
|
|
if (!uuid) {
|
|
alert("Missing uuid parameter in URL");
|
|
return;
|
|
}
|
|
|
|
document.getElementById("uuidText").textContent = uuid;
|
|
|
|
try {
|
|
const res = await fetch(webhookUrl, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ uuid })
|
|
});
|
|
|
|
if (!res.ok) throw new Error("Failed to fetch data");
|
|
const data = await res.json();
|
|
|
|
document.getElementById("gitValue").textContent = data.git ? "Enabled" : "Disabled";
|
|
document.getElementById("domainsValue").textContent = data.domains || "-";
|
|
document.getElementById("backupValue").textContent = data.backupSlots || "-";
|
|
document.getElementById("workersValue").textContent = data.workers || "-";
|
|
document.getElementById("hddValue").textContent = data.hdd ? `${data.hdd} MB` : "-";
|
|
document.getElementById("expiresValue").textContent = data.expires || "-";
|
|
|
|
} catch (err) {
|
|
console.error(err);
|
|
alert("Error loading data.");
|
|
}
|
|
}
|
|
|
|
async function buyProduct(product_id) {
|
|
if (!uuid) return;
|
|
try {
|
|
const res = await fetch(webhook_buy, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ uuid, product_id })
|
|
});
|
|
|
|
if (!res.ok) throw new Error("Failed to send purchase request");
|
|
|
|
document.body.innerHTML = `
|
|
<div style="text-align:center;padding:80px;background:#fff;border-radius:12px;max-width:700px;margin:auto;box-shadow:0 4px 12px rgba(0,0,0,0.1);">
|
|
<h2>✅ Your request has been sent</h2>
|
|
<p>Please check your email for confirmation.</p>
|
|
</div>
|
|
`;
|
|
} catch (err) {
|
|
console.error(err);
|
|
alert("Error sending request.");
|
|
}
|
|
}
|
|
|
|
// Button event listeners with product_id mapping
|
|
document.getElementById("upgradeRiseBtn").addEventListener("click", () => buyProduct(4));
|
|
document.getElementById("upgradePowerhouseBtn").addEventListener("click", () => buyProduct(5));
|
|
document.getElementById("addDomainBtn").addEventListener("click", () => buyProduct(100));
|
|
document.getElementById("addBackupsBtn").addEventListener("click", () => buyProduct(101));
|
|
|
|
loadData();
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|