* Diese Preise sind vorläufige Schätzungen. Die endgültige Preisgestaltung bedarf einer individuellen Prüfung und Absprache mit der AHK Portugal.
${task.name}
${task.hours}h
${task.name}
h
`;
list.appendChild(el);
});
}
function toggleTask(id) {
if (selectedTasks.has(id)) selectedTasks.delete(id);
else selectedTasks.add(id);
renderTasks();
}
function updateSummary() {
let totalH = 0;
selectedTasks.forEach(id => {
const t = tasks.find(x => x.id === id);
if (t) totalH += t.hours;
});
document.getElementById('selectedCount').textContent = selectedTasks.size;
document.getElementById('totalHours').textContent = totalH.toFixed(1);
const cfg = window.elementSdk?.config || defaultConfig;
const sym = cfg.currency_symbol || defaultConfig.currency_symbol;
const price = calculatePrice(totalH);
document.getElementById('totalPrice').textContent = `${sym}${price.toLocaleString()}`;
const bar = document.getElementById('summaryBar');
bar.style.transform = selectedTasks.size > 0 ? 'translateY(0)' : 'translateY(100%)';
}
function updateTaskHours(id, val) {
const t = tasks.find(x => x.id === id);
if (t) { t.hours = parseFloat(val) || 1; renderTasks(); }
}
function updateHourlyRate(val) {
hourlyRate = parseFloat(val) || 95;
renderTasks();
}
function addCustomTask() {
const name = document.getElementById('newTaskName').value.trim();
const hours = parseFloat(document.getElementById('newTaskHours').value) || 2;
if (!name) return;
tasks.push({ id: 'custom-' + (nextId++), name, hours, icon: 'plus-circle', category: 'Custom' });
document.getElementById('newTaskName').value = '';
renderTasks();
renderAdminTasks();
}
function toggleAdmin() {
const panel = document.getElementById('adminPanel');
const isHidden = panel.classList.contains('hidden');
if (isHidden) { renderAdminTasks(); panel.classList.remove('hidden'); }
else panel.classList.add('hidden');
}
function formatPrice(val) {
const cfg = window.elementSdk?.config || defaultConfig;
const sym = cfg.currency_symbol || defaultConfig.currency_symbol;
return sym + val.toLocaleString();
}
function applyConfig(config) {
const c = { ...defaultConfig, ...config };
document.getElementById('mainTitle').textContent = c.calculator_title;
document.getElementById('companyLabel').textContent = c.company_name;
document.getElementById('disclaimerText').textContent = c.disclaimer_text;
const app = document.getElementById('app');
app.style.background = c.background_color;
document.querySelectorAll('.task-card').forEach(el => {
el.style.borderColor = el.classList.contains('selected') ? c.accent_color + '66' : 'rgba(255,255,255,0.06)';
});
const font = c.font_family || defaultConfig.font_family;
document.body.style.fontFamily = `${font}, sans-serif`;
const size = c.font_size || defaultConfig.font_size;
document.getElementById('mainTitle').style.fontSize = `${size * 2.25}px`;
document.getElementById('subtitleText').style.fontSize = `${size}px`;
updateSummary();
}
// Init SDK
window.elementSdk.init({
defaultConfig,
onConfigChange: async (config) => applyConfig(config),
mapToCapabilities: (config) => ({
recolorables: [
{ get: () => config.background_color || defaultConfig.background_color, set: v => { config.background_color = v; window.elementSdk.setConfig({ background_color: v }); } },
{ get: () => config.accent_color || defaultConfig.accent_color, set: v => { config.accent_color = v; window.elementSdk.setConfig({ accent_color: v }); } },
{ get: () => config.text_color || defaultConfig.text_color, set: v => { config.text_color = v; window.elementSdk.setConfig({ text_color: v }); } },
],
borderables: [],
fontEditable: { get: () => config.font_family || defaultConfig.font_family, set: v => { config.font_family = v; window.elementSdk.setConfig({ font_family: v }); } },
fontSizeable: { get: () => config.font_size || defaultConfig.font_size, set: v => { config.font_size = v; window.elementSdk.setConfig({ font_size: v }); } },
}),
mapToEditPanelValues: (config) => new Map([
['calculator_title', config.calculator_title || defaultConfig.calculator_title],
['company_name', config.company_name || defaultConfig.company_name],
['currency_symbol', config.currency_symbol || defaultConfig.currency_symbol],
['disclaimer_text', config.disclaimer_text || defaultConfig.disclaimer_text],
])
});
// Initial render
renderTasks();
lucide.createIcons();