Javascript, HTML, CSS Code
<html> <head> <script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Pension Fee Calculator - ASN Partners UK Fee Estimate</title> <meta name="description" content="Calculate your pension and service fees with ASN Partners UK using a straightforward fee calculator."> <meta name="keywords" content="pension, fees, calculator, employee, ASN Partners UK, ATED"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css" crossorigin="anonymous"> <script type="text/javascript"> try { document.addEventListener("DOMContentLoaded", function() { const state = { clientType: "Limited Company", turnover: 0, accounts: false, vat: false, payroll: { active: false, count: 0, frequency: 'monthly', fee: 0 }, pension: { active: false, fee: 0 }, properties: { active: false, count: 0, fee: 0, vehicles: 0, vehicleFee: 0 }, ated: { active: false, count: 0, fee: 0 }, selfAssessment: { active: false, count: 0, fee: 0 }, paymentsPerMonth: 0, additionalServices: { description: '', fee: 0 }, discount: 0, bacsFee: 0, annualFee: 0 }; const serviceRates = { accounts: (turnover, clientType) => { if (clientType === 'Sole Trader' || clientType === 'Partnership') { if (turnover <= 90000) return 700; else if (turnover <= 99000) return 850; else if (turnover <= 149000) return 900; else if (turnover <= 249000) return 1000; else if (turnover <= 349000) return 1300; else if (turnover <= 499000) return 1400; else if (turnover <= 749000) return 1600; else if (turnover <= 999000) return 1800; else return "Negotiable for all services"; } else { if (turnover <= 90000) return 875; else if (turnover <= 99000) return 975; else if (turnover <= 149000) return 1100; else if (turnover <= 249000) return 1250; else if (turnover <= 349000) return 1500; else if (turnover <= 499000) return 1600; else if (turnover <= 749000) return 1800; else if (turnover <= 999000) return 2000; else return "Negotiable for all services"; } }, vat: (turnover) => { if (turnover <= 99000) return 550; else if (turnover <= 149000) return 750; else if (turnover <= 249000) return 850; else if (turnover <= 349000) return 950; else if (turnover <= 499000) return 1150; else if (turnover <= 749000) return 1600; else if (turnover <= 999000) return 1900; else if (turnover <= 1240000) return 2300; else if (turnover <= 1740000) return 2500; else if (turnover <= 2240000) return 2700; else if (turnover <= 2990000) return 2900; else if (turnover <= 3490000) return 3100; else if (turnover <= 3990000) return 3300; else if (turnover <= 4990000) return 3700; else if (turnover <= 5990000) return 4100; else if (turnover <= 6990000) return 4500; else return "Negotiable for all services"; }, payroll: (count, frequency) => { if (count > 100) return "Negotiable"; const payrollFees = { "weekly": [520, 580, 675, 820, 1085, 1350, 1640, 1880, 2220], "monthly": [350, 400, 450, 550, 665, 780, 920, 1010, 1200], "weekly+monthly": [750, 850, 975, 1150, 1450, 1700, 2000, 2125, 2700], "fortnightly": [420, 490, 575, 700, 950, 1100, 1325, 1562, 2000] }; return payrollFees[frequency][count - 1] || 0; }, pension: 195, properties: (count) => { if (count === 1) return 150; else if (count === 2) return 250; else if (count === 3) return 360; else if (count === 4) return 460; else if (count === 5) return 550; else if (count > 5) return 550 + (count - 5) * 75; return 0; }, ated: (count) => { if (count === 1) return 150; else if (count === 2) return 275; else if (count === 3) return 400; else return "Please email us to get the best quote"; }, vehicleFee: 175, selfAssessment: (income) => { if (income <= 79000) return 175; else if (income <= 124000) return 200; else return 250; } }; const updateFees = () => { let feesSubtotal = state.additionalServices.fee; if (state.accounts) { feesSubtotal += serviceRates.accounts(state.turnover, state.clientType); } if (state.vat) { feesSubtotal += serviceRates.vat(state.turnover); } if (state.payroll.active) { state.payroll.fee = serviceRates.payroll(state.payroll.count, state.payroll.frequency); feesSubtotal += state.payroll.fee; } if (state.pension.active) { state.pension.fee = state.paymentsPerMonth <= 35 ? 30 * 12 : state.paymentsPerMonth <= 50 ? 35 * 12 : state.paymentsPerMonth <= 75 ? 40 * 12 : state.paymentsPerMonth <= 100 ? 45 * 12 : state.paymentsPerMonth <= 150 ? 55 * 12 : state.paymentsPerMonth <= 200 ? 65 * 12 : state.paymentsPerMonth <= 250 ? 75 * 12 : "To Be Agreed"; feesSubtotal += (state.pension.fee); } if (state.properties.active) { state.properties.fee = serviceRates.properties(state.properties.count); const vehicleFeeTotal = state.properties.vehicles * serviceRates.vehicleFee; state.properties.vehicleFee = vehicleFeeTotal; feesSubtotal += state.properties.fee + state.properties.vehicleFee; } if (state.ated.active) { state.ated.fee = serviceRates.ated(state.ated.count); feesSubtotal += (typeof state.ated.fee === 'number') ? state.ated.fee : 0; // Add ATED fee } if (state.selfAssessment.active) { state.selfAssessment.fee += serviceRates.selfAssessment(state.selfAssessment.count); feesSubtotal += (typeof state.selfAssessment.fee === 'number') ? state.selfAssessment.fee : 0; // Add self-assessment fee } // BACS fee if (state.paymentsPerMonth > 0) { feesSubtotal += state.bacsFee !== "To Be Agreed" ? state.bacsFee : 0; } const discountAmount = feesSubtotal * (state.discount / 100); const feesTotal = feesSubtotal - discountAmount; const vatAmount = feesTotal * 0.2; const grandTotal = feesTotal + vatAmount; const monthlyFee = grandTotal / 12; document.getElementById('subtotal').innerText = `£${feesSubtotal.toFixed(2)}`; document.getElementById('discount').innerText = `£${discountAmount.toFixed(2)}`; document.getElementById('vat').innerText = `£${vatAmount.toFixed(2)}`; document.getElementById('total').innerText = `£${grandTotal.toFixed(2)}`; document.getElementById('monthly').innerText = `£${monthlyFee.toFixed(2)}`; }; const resetInputs = () => { state.clientType = "Limited Company"; state.turnover = 0; state.accounts = false; state.vat = false; state.payroll = { active: false, count: 0, frequency: 'monthly', fee: 0 }; state.pension = { active: false, fee: 0 }; state.properties = { active: false, count: 0, fee: 0, vehicles: 0, vehicleFee: 0 }; state.ated = { active: false, count: 0, fee: 0 }; state.selfAssessment = { active: false, count: 0, fee: 0 }; state.paymentsPerMonth = 0; state.additionalServices = { description: '', fee: 0 }; state.discount = 0; document.querySelectorAll("input[type='checkbox']").forEach(el => el.checked = false); document.getElementById('turnoverDropdown').value = '0'; document.getElementById('employeeCountDropdown').value = '0'; document.getElementById('frequencyDropdown').value = 'monthly'; document.getElementById('propertyCountDropdown').value = '0'; document.getElementById('vehicleCountDropdown').value = '0'; document.getElementById('discountInput').value = ''; document.getElementById('bacsPaymentsInput').value = ''; document.getElementById('additionalServicesInput').value = ''; document.getElementById('feeInput').value = ''; document.getElementById('contactName').value = 'Contact Person/Company Name'; document.getElementById('contactNumber').value = ''; document.getElementById('note').innerText = ''; updateFees(); }; // Event listeners const payrollToggle = document.getElementById('payrollToggle'); if (payrollToggle) { payrollToggle.addEventListener('change', (el) => { state.payroll.active = el.target.checked; document.querySelectorAll('.number-options').forEach(option => option.style.display = el.target.checked ? 'block' : 'none'); updateFees(); }); } const accountsCheck = document.getElementById('accounts'); if (accountsCheck) { accountsCheck.addEventListener('change', (el) => { state.accounts = el.target.checked; updateFees(); }); } const vatCheck = document.getElementById('vat'); if (vatCheck) { vatCheck.addEventListener('change', (el) => { state.vat = el.target.checked; updateFees(); }); } const propertiesToggle = document.getElementById('propertiesToggle'); if (propertiesToggle) { propertiesToggle.addEventListener('change', (el) => { state.properties.active = el.target.checked; const propertyCountDropdownContainer = document.getElementById('propertyCountDropdownContainer'); const vehicleCountContainer = document.getElementById('vehicleCountContainer'); if (propertyCountDropdownContainer && vehicleCountContainer) { propertyCountDropdownContainer.style.display = el.target.checked ? 'block' : 'none'; vehicleCountContainer.style.display = el.target.checked ? 'block' : 'none'; } if (!el.target.checked) { state.properties.count = 0; document.getElementById('propertyCountDropdown').value = '0'; document.getElementById('vehicleCountDropdown').value = '0'; } updateFees(); }); } const atedToggle = document.getElementById('atedToggle'); if (atedToggle) { atedToggle.addEventListener('change', (el) => { state.ated.active = el.target.checked; const propertyCountDropdownContainerForAted = document.getElementById('propertyCountDropdownContainerForAted'); if (propertyCountDropdownContainerForAted) { propertyCountDropdownContainerForAted.style.display = el.target.checked ? 'block' : 'none'; } if (!el.target.checked) { state.ated.count = 0; document.getElementById('atedPropertyCountDropdown').value = '0'; } updateFees(); }); } const selfAssessmentCheck = document.getElementById('selfAssessment'); if (selfAssessmentCheck) { selfAssessmentCheck.addEventListener('change', (el) => { state.selfAssessment.active = el.target.checked; updateFees(); }); } const p11dCheck = document.getElementById('p11d'); if (p11dCheck) { p11dCheck.addEventListener('change', (el) => { state.p11d = el.target.checked; updateFees(); }); } document.querySelectorAll("input[type='checkbox']").forEach(el => { el.addEventListener('change', () => { state[el.id] = el.checked; if (el.id === 'pension') { const employeeCountDropdownContainer = document.getElementById('employeeCountDropdownContainer'); if (employeeCountDropdownContainer) { employeeCountDropdownContainer.style.display = el.checked ? 'block' : 'none'; if (!el.checked) { state.pension.count = 0; document.getElementById('employeeCountDropdown').value = '0'; } } } updateFees(); }); }); document.getElementById('turnoverDropdown').addEventListener('change', (e) => { state.turnover = parseInt(e.target.value) || 0; updateFees(); }); document.getElementById('employeeCountDropdown').addEventListener('change', (e) => { state.payroll.count = parseInt(e.target.value) || 0; updateFees(); }); document.getElementById('propertyCountDropdown').addEventListener('change', (e) => { state.properties.count = parseInt(e.target.value) || 0; updateFees(); }); document.getElementById('vehicleCountDropdown').addEventListener('change', (e) => { state.properties.vehicles = parseInt(e.target.value) || 0; updateFees(); }); document.getElementById('atedPropertyCountDropdown').addEventListener('change', (e) => { state.ated.count = parseInt(e.target.value) || 0; updateFees(); }); document.getElementById('frequencyDropdown').addEventListener('change', (e) => { state.payroll.frequency = e.target.value || 'monthly'; updateFees(); }); document.getElementById('discountInput').addEventListener('input', (e) => { state.discount = parseFloat(e.target.value) || 0; updateFees(); }); // Additional Services input handling document.getElementById('additionalServicesInput').addEventListener('input', (e) => { state.additionalServices.description = e.target.value; }); document.getElementById('feeInput').addEventListener('input', (e) => { state.additionalServices.fee = parseFloat(e.target.value) || 0; updateFees(); }); document.getElementById('resetButton').addEventListener('click', resetInputs); updateFees(); }); } catch (error) { throw error; } </script> <style> body { background-color: #f8f9fa; color: #495057; font-family: 'Roboto', sans-serif; } #main-container { background-color: #800000; border-radius: 8px; padding: 20px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); margin-top: 20px; } h1 { color: white; text-align: center; } label { color: white; } .fee-total { font-size: 1.5em; margin-top: 20px; color: #81c784; } .reset-button, .action-button { background-color: #dc3545; color: white; border: none; border-radius: 5px; padding: 10px 15px; margin-top: 10px; cursor: pointer; transition: background-color 0.3s; } .reset-button:hover, .action-button:hover { background-color: #c82333; } .number-options { display: none; } .grey-input { color: grey; } </style> <link rel="canonical" href="https://calculator.tools/prompt/10002/"> <meta charset="utf-8"> </head> <body> <div id="main-container" class="container"> <h1>ASN Partners UK Fee Estimate</h1> <form> <div class="mb-3"> <label for="contactName" class="form-label">Name:</label> <input type="text" class="form-control grey-input" id="contactName" value="Contact Person/Company Name" onfocus="this.value=''"/> </div> <div class="mb-3"> <label for="contactNumber" class="form-label">Contact No:</label> <input type="text" class="form-control" id="contactNumber" placeholder="Enter contact number" /> </div> <div class="mb-3"> <label for="clientType" class="form-label">Client Type:</label> <select class="form-select" id="clientType"> <option value="Limited Company">Limited Company</option> <option value="Sole Trader">Sole Trader</option> <option value="Partnership">Partnership</option> <option value="Individual">Individual</option> </select> </div> <div class="mb-3"> <label for="turnoverDropdown" class="form-label">Annual Turnover (£):</label> <select class="form-select" id="turnoverDropdown"> <option value="0">£0k – £99k</option> <option value="100">£100k – £149k</option> <option value="150">£150k – £249k</option> <option value="250">£250k – £349k</option> <option value="350">£350k – £499k</option> <option value="500">£500k – £749k</option> <option value="750">£750k – £999k</option> <option value="1000">£1m – £1.24m</option> <option value="1250">£1.25m – £1.74m</option> <option value="1750">£1.75m – £2.24m</option> <option value="2250">£2.25m – £2.99m</option> <option value="3000">£3m – £3.49m</option> <option value="3500">£3.5m – £3.99m</option> <option value="4000">£4m – £4.99m</option> <option value="5000">£5m – £5.99m</option> <option value="6000">£6m – £6.99m</option> <option value="7000">£7m+</option> </select> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="accounts" /> <label class="form-check-label" for="accounts">Accounts</label> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="vat" /> <label class="form-check-label" for="vat">VAT</label> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="payrollToggle" /> <label class="form-check-label" for="payrollToggle">Payroll</label> <div class="mt-3 number-options"> <label for="frequencyDropdown">Frequency:</label> <select class="form-select" id="frequencyDropdown"> <option value="monthly">Monthly</option> <option value="weekly">Weekly</option> <option value="fortnightly">Fortnight</option> <option value="weekly+monthly">Weekly + Monthly</option> </select> </div> <div class="mt-3 number-options"> <label>Number of Employees:</label> <select class="form-select" id="employeeCountDropdown"> <option value="0">Select</option> <option value="1">01–05</option> <option value="2">06–10</option> <option value="3">11–15</option> <option value="4">16–20</option> <option value="5">21–30</option> <option value="6">31–40</option> <option value="7">41–50</option> <option value="8">51–75</option> <option value="9">76–100</option> <option value="10">100+</option> </select> </div> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="pension" /> <label class="form-check-label" for="pension">Pension</label> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="propertiesToggle" /> <label class="form-check-label" for="propertiesToggle">Properties</label> <div class="mt-3 number-options" id="propertyCountDropdownContainer"> <label for="propertyCountDropdown" class="form-label">Number of Properties:</label> <select class="form-select" id="propertyCountDropdown"> <option value="0">Select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6+</option> </select> </div> <div class="mt-3 number-options" id="vehicleCountContainer" style="display:none;"> <label for="vehicleCountDropdown" class="form-label">Number of Vehicles:</label> <select class="form-select" id="vehicleCountDropdown"> <option value="0">Select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6+</option> </select> </div> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="atedToggle" /> <label class="form-check-label" for="atedToggle">ATED</label> <div class="mt-3 number-options" id="propertyCountDropdownContainerForAted"> <label for="atedPropertyCountDropdown" class="form-label">Number of Properties (ATED):</label> <select class="form-select" id="atedPropertyCountDropdown"> <option value="0">Select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4+</option> </select> </div> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="selfAssessment" /> <label class="form-check-label" for="selfAssessment">Self Assessment</label> </div> <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="p11d" /> <label class="form-check-label" for="p11d">P11D Service</label> </div> <div class="row mb-3"> <div class="col"> <label for="additionalServicesInput" class="form-label">Additional Services:</label> <textarea class="form-control" id="additionalServicesInput" placeholder="Enter any additional services required." rows="3"></textarea> </div> <div class="col"> <label for="feeInput" class="form-label">Fee:</label> <input type="number" class="form-control" id="feeInput" placeholder="Enter fee" /> </div> </div> <div class="mb-3"> <label for="discountInput" class="form-label">Discount (%):</label> <input type="number" class="form-control" id="discountInput" placeholder="Enter discount" /> </div> <button type="button" id="resetButton" class="reset-button">Reset All Inputs</button> <button type="button" id="printButton" class="action-button">Print</button> <button type="button" id="emailButton" class="action-button">Email</button> <button type="button" id="mobileButton" class="action-button">Mobile</button> </form> <div id="note"></div> <div class="fee-total"> <div>Subtotal: <span id="subtotal">£0.00</span></div> <div>Discount: <span id="discount">£0.00</span></div> <div>VAT: <span id="vat">£0.00</span></div> <div>Total Annual Fee: <span id="total">£0.00</span></div> <div>Total Monthly Fee: <span id="monthly">£0.00</span></div> <div>ATED Fee: <span id="atedFee">£0.00</span></div> </div> </div> <script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script> <script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script> </body> </html>
Pension Fee Calculator - ASN Partners UK Fee Estimate
Calculator Tools