feat: Implement upsell functionality with repository and service layers

This commit is contained in:
2026-05-02 23:30:23 +03:30
parent 4928901a08
commit 5930c1ad6f
26 changed files with 3130 additions and 126 deletions

175
admin/js/dashboard.js Normal file
View File

@@ -0,0 +1,175 @@
document.addEventListener('DOMContentLoaded', function () {
const dataEl = document.getElementById('sodino-dashboard-data');
if (!dataEl) {
return;
}
let dashboardData;
try {
dashboardData = JSON.parse(dataEl.textContent || '{}');
} catch (e) {
return;
}
if (typeof Chart === 'undefined') {
return;
}
const salesChartContext = document.getElementById('sodinoSalesChart');
const discountChartContext = document.getElementById('sodinoDiscountChart');
const ruleChartContext = document.getElementById('sodinoRuleChart');
if (salesChartContext && dashboardData.salesChart) {
new Chart(salesChartContext.getContext('2d'), {
type: 'line',
data: {
labels: dashboardData.salesChart.labels,
datasets: [
{
label: dashboardData.translations.afterApplying,
data: dashboardData.salesChart.after,
borderColor: '#0ea5e9',
backgroundColor: 'rgba(14, 165, 233, 0.15)',
fill: true,
tension: 0.35,
pointRadius: 3,
},
{
label: dashboardData.translations.beforeApplying,
data: dashboardData.salesChart.before,
borderColor: '#ef4444',
backgroundColor: 'rgba(239, 68, 68, 0.15)',
fill: true,
tension: 0.35,
pointRadius: 3,
},
],
},
options: {
responsive: true,
plugins: {
legend: {
labels: {
color: '#334155',
},
},
},
scales: {
x: {
ticks: {
color: '#475569',
},
grid: {
color: 'rgba(148, 163, 184, 0.15)',
},
},
y: {
ticks: {
color: '#475569',
},
grid: {
color: 'rgba(148, 163, 184, 0.15)',
},
},
},
},
});
}
if (discountChartContext && dashboardData.summary) {
new Chart(discountChartContext.getContext('2d'), {
type: 'bar',
data: {
labels: [dashboardData.translations.totalDiscount, dashboardData.translations.totalRevenue],
datasets: [
{
label: dashboardData.translations.discountEffect,
data: [dashboardData.summary.total_discount, dashboardData.summary.total_revenue],
backgroundColor: ['#fbbf24', '#0ea5e9'],
borderRadius: 999,
borderSkipped: false,
},
],
},
options: {
responsive: true,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
color: '#475569',
},
grid: {
display: false,
},
},
y: {
ticks: {
color: '#475569',
},
grid: {
color: 'rgba(148, 163, 184, 0.15)',
},
},
},
},
});
}
if (ruleChartContext && dashboardData.rulePerformance) {
new Chart(ruleChartContext.getContext('2d'), {
type: 'bar',
data: {
labels: dashboardData.rulePerformance.names,
datasets: [
{
label: dashboardData.translations.ruleRevenue,
data: dashboardData.rulePerformance.revenue,
backgroundColor: '#0ea5e9',
borderRadius: 999,
},
{
label: dashboardData.translations.ruleDiscount,
data: dashboardData.rulePerformance.discount,
backgroundColor: '#f59e0b',
borderRadius: 999,
},
],
},
options: {
indexAxis: 'y',
responsive: true,
plugins: {
legend: {
position: 'bottom',
labels: {
color: '#475569',
},
},
},
scales: {
x: {
ticks: {
color: '#475569',
},
grid: {
color: 'rgba(148, 163, 184, 0.15)',
},
},
y: {
ticks: {
color: '#475569',
},
grid: {
display: false,
},
},
},
},
});
}
});

106
admin/js/upsell-admin.js Normal file
View File

@@ -0,0 +1,106 @@
(function () {
const triggerTypeInputs = document.querySelectorAll('.trigger-type');
const triggerProductWrapper = document.getElementById('trigger-product-wrapper');
const triggerCategoryWrapper = document.getElementById('trigger-category-wrapper');
const triggerAmountWrapper = document.getElementById('trigger-amount-wrapper');
const triggerValueInput = document.getElementById('trigger_value');
const triggerProductSearch = document.getElementById('trigger_product_search');
const triggerProductResults = document.getElementById('trigger_product_results');
const targetProductSearch = document.getElementById('target_product_search');
const targetProductResults = document.getElementById('target_product_results');
const targetProductIdInput = document.getElementById('target_product_id');
function setTriggerVisibility() {
const selected = document.querySelector('input[name="trigger_type"]:checked');
const value = selected ? selected.value : 'product';
triggerProductWrapper.classList.toggle('hidden', value !== 'product');
triggerCategoryWrapper.classList.toggle('hidden', value !== 'category');
triggerAmountWrapper.classList.toggle('hidden', value !== 'cart_total');
if (value !== 'product' && triggerProductSearch) {
triggerValueInput.value = '';
}
}
function searchProducts(inputElement, resultsContainer, targetInput) {
const term = inputElement.value.trim();
if (!term) {
resultsContainer.classList.add('hidden');
resultsContainer.innerHTML = '';
return;
}
const formData = new URLSearchParams();
formData.append('action', 'sodino_search_products');
formData.append('security', sodinoUpsellAdmin.nonce);
formData.append('term', term);
fetch(ajaxurl, {
method: 'POST',
credentials: 'same-origin',
body: formData,
})
.then(response => response.json())
.then(data => {
if (!Array.isArray(data)) {
resultsContainer.classList.add('hidden');
return;
}
const items = data.map(product => {
const button = document.createElement('button');
button.type = 'button';
button.className = 'w-full text-right px-4 py-3 hover:bg-blue-50 focus:bg-blue-50';
button.textContent = product.label;
button.addEventListener('click', function () {
if (targetInput) {
targetInput.value = product.id;
inputElement.value = product.label;
} else {
triggerValueInput.value = product.id;
inputElement.value = product.label;
}
resultsContainer.classList.add('hidden');
});
return button;
});
resultsContainer.innerHTML = '';
items.forEach(item => resultsContainer.appendChild(item));
resultsContainer.classList.toggle('hidden', items.length === 0);
})
.catch(() => {
resultsContainer.classList.add('hidden');
});
}
if (triggerTypeInputs.length) {
triggerTypeInputs.forEach(input => {
input.addEventListener('change', setTriggerVisibility);
});
setTriggerVisibility();
}
if (triggerProductSearch) {
triggerProductSearch.addEventListener('input', function () {
searchProducts(triggerProductSearch, triggerProductResults, null);
});
}
if (targetProductSearch) {
targetProductSearch.addEventListener('input', function () {
searchProducts(targetProductSearch, targetProductResults, targetProductIdInput);
});
}
document.addEventListener('click', function (event) {
if (triggerProductResults && !triggerProductResults.contains(event.target) && event.target !== triggerProductSearch) {
triggerProductResults.classList.add('hidden');
}
if (targetProductResults && !targetProductResults.contains(event.target) && event.target !== targetProductSearch) {
targetProductResults.classList.add('hidden');
}
});
})();