حاسبة الأسعار
اختر خدماتك واحصل على عرض سعر فوري عبر واتساب
النظافة
0 خدمة
مرّر للأسفل لمراجعة الطلب وإرساله
<!--
حاسبة أسعار شركة التنفيذ - Native HTML/CSS/JS
انسخ هذا الكود بالكامل والصقه في كتلة "HTML مخصص" في WordPress
-->
<style>
.anfz-calc * { box-sizing: border-box; }
.anfz-calc {
width: 100vw; position: relative; left: 50%; right: 50%;
margin-left: -50vw; margin-right: -50vw; max-width: 100vw;
background: #f8fafc; padding: 24px 0; direction: rtl;
font-family: "Cairo", "Tajawal", system-ui, -apple-system, "Segoe UI", sans-serif;
color: #1a2238; line-height: 1.5; -webkit-font-smoothing: antialiased;
}
.anfz-inner { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.anfz-header { text-align: center; margin-bottom: 20px; }
.anfz-header h1 { font-size: 24px; font-weight: 800; color: #1e3a8a; margin: 0 0 6px; }
.anfz-header p { font-size: 13px; color: #64748b; margin: 0; }
.anfz-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 20px; }
.anfz-tab {
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 6px; padding: 10px 6px; border: 2px solid #e2e8f0; background: #fff; color: #1a2238;
border-radius: 16px; cursor: pointer; text-align: center; transition: all .2s ease; font-family: inherit;
}
.anfz-tab:hover { border-color: rgba(30,58,138,.4); background: rgba(30,58,138,.04); }
.anfz-tab.active { border-color: #1e3a8a; background: #1e3a8a; color: #fff; box-shadow: 0 10px 28px -8px rgba(30,58,138,.5); }
.anfz-tab-icon {
width: 36px; height: 36px; border-radius: 50%;
display: flex; align-items: center; justify-content: center;
background: rgba(30,58,138,.1); color: #1e3a8a;
}
.anfz-tab.active .anfz-tab-icon { background: rgba(255,255,255,.2); color: #fff; }
.anfz-tab-icon svg { width: 18px; height: 18px; }
.anfz-tab-name { font-size: 11px; font-weight: 700; line-height: 1.2; }
.anfz-main { display: grid; gap: 16px; grid-template-columns: 1fr; }
.anfz-cart-wrap { order: 2; min-width: 0; }
.anfz-card {
background: #fff; border: 1px solid #e2e8f0; border-radius: 16px;
box-shadow: 0 6px 24px -8px rgba(30,58,138,.18); overflow: hidden;
}
.anfz-cart-head {
width: 100%; display: flex; align-items: center; justify-content: space-between;
gap: 8px; padding: 14px 16px; color: #fff; cursor: pointer; border: 0;
background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%); font-family: inherit;
}
.anfz-cart-head-right { display: flex; align-items: center; gap: 8px; }
.anfz-cart-head-title { font-size: 15px; font-weight: 800; color: #fff; }
.anfz-cart-head-sub { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.9); }
.anfz-chev-box {
width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,.2);
display: flex; align-items: center; justify-content: center;
}
.anfz-chev-box svg { width: 16px; height: 16px; color: #fff; transition: transform .2s; }
.anfz-cart-wrap.collapsed .anfz-chev-box svg { transform: rotate(180deg); }
.anfz-cart-body { max-height: 280px; overflow-y: auto; padding: 12px; }
.anfz-cart-wrap.collapsed .anfz-cart-body { display: none; }
.anfz-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 24px 8px; text-align: center; }
.anfz-empty-icon {
width: 48px; height: 48px; border-radius: 50%; background: #f1f5f9;
display: flex; align-items: center; justify-content: center; color: #64748b;
}
.anfz-empty p { font-size: 12px; color: #64748b; margin: 0; }
.anfz-cart-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.anfz-cart-item { border: 2px solid #e2e8f0; background: #fff; padding: 10px; border-radius: 12px; }
.anfz-cart-item-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.anfz-cart-item-name { font-size: 14px; font-weight: 600; color: #1a2238; }
.anfz-btn-del {
width: 24px; height: 24px; flex-shrink: 0; border: 0; cursor: pointer;
border-radius: 6px; background: rgba(220,38,38,.1); color: #dc2626;
display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.anfz-btn-del:hover { background: #dc2626; color: #fff; }
.anfz-btn-del svg { width: 14px; height: 14px; }
.anfz-cart-item-bot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.anfz-cart-item-total { font-size: 12px; font-weight: 700; color: #1e3a8a; }
.anfz-cart-item-unit { font-size: 12px; color: #64748b; }
.anfz-qty { display: flex; align-items: center; gap: 6px; }
.anfz-qty-btn {
width: 24px; height: 24px; border: 0; cursor: pointer; border-radius: 6px;
display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.anfz-qty-btn.minus { background: #f1f5f9; color: #1a2238; }
.anfz-qty-btn.minus:hover { background: #e2e8f0; }
.anfz-qty-btn.plus { background: rgba(30,58,138,.15); color: #1e3a8a; }
.anfz-qty-btn.plus:hover { background: #1e3a8a; color: #fff; }
.anfz-qty-btn svg { width: 12px; height: 12px; }
.anfz-qty-btn:disabled { opacity: .4; cursor: not-allowed; }
.anfz-qty-val { width: 24px; text-align: center; font-size: 14px; font-weight: 700; }
.anfz-totals {
background: #fff; border: 1px solid #e2e8f0; border-radius: 16px;
box-shadow: 0 6px 24px -8px rgba(30,58,138,.18); padding: 16px; margin-top: 12px;
}
.anfz-row { display: flex; align-items: center; justify-content: space-between; }
.anfz-totals-top { padding-bottom: 12px; border-bottom: 1px dashed #e2e8f0; display: flex; flex-direction: column; gap: 8px; }
.anfz-subtotal { font-size: 18px; font-weight: 700; color: #1e3a8a; }
.anfz-label { font-size: 14px; font-weight: 600; color: #1a2238; }
.anfz-vat { font-size: 14px; font-weight: 600; color: #64748b; }
.anfz-vat-label { font-size: 14px; color: #64748b; }
.anfz-grand { padding-top: 12px; }
.anfz-grand-val { font-size: 26px; font-weight: 800; color: #1e3a8a; }
.anfz-grand-label { font-size: 14px; font-weight: 700; color: #1e3a8a; max-width: 55%; text-align: right; }
.anfz-warn {
margin-top: 12px; display: flex; align-items: flex-start; gap: 8px;
background: rgba(234,179,8,.1); padding: 10px; border-radius: 8px;
}
.anfz-warn svg { width: 16px; height: 16px; color: #ca8a04; flex-shrink: 0; margin-top: 2px; }
.anfz-warn p { font-size: 11px; color: rgba(26,34,56,.8); margin: 0; line-height: 1.6; }
.anfz-btn {
margin-top: 12px; width: 100%; height: 48px; border: 0; cursor: pointer;
border-radius: 12px; font-family: inherit; font-size: 15px; font-weight: 700;
display: flex; align-items: center; justify-content: center; gap: 6px; transition: opacity .15s;
}
.anfz-btn:disabled { opacity: .5; cursor: not-allowed; }
.anfz-btn:not(:disabled):hover { opacity: .92; }
.anfz-btn svg { width: 16px; height: 16px; }
.anfz-btn-wa {
background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
color: #fff; box-shadow: 0 10px 28px -8px rgba(37,211,102,.5);
}
.anfz-btn-copy {
margin-top: 8px; height: 44px; font-size: 14px;
background: #eef2ff; color: #1e3a8a; border: 2px solid rgba(30,58,138,.3);
}
.anfz-btn-copy:not(:disabled):hover { background: rgba(30,58,138,.1); }
.anfz-services-wrap { order: 1; min-width: 0; }
.anfz-services {
background: #fff; border: 1px solid #e2e8f0; border-radius: 16px;
box-shadow: 0 6px 24px -8px rgba(30,58,138,.18); padding: 14px;
}
.anfz-services-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.anfz-services-head h2 { font-size: 17px; font-weight: 700; color: #1e3a8a; margin: 0; }
.anfz-services-count { font-size: 12px; color: #64748b; }
.anfz-services-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
.anfz-svc { border: 2px solid #e2e8f0; background: #f8fafc; border-radius: 12px; padding: 12px; transition: all .2s; }
.anfz-svc.active { border-color: #1e3a8a; background: #eef2ff; }
.anfz-svc:not(.active):hover { border-color: rgba(30,58,138,.4); }
.anfz-svc-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.anfz-svc-name { font-size: 14px; font-weight: 700; color: #1a2238; }
.anfz-svc-unit { font-size: 11px; color: #64748b; margin-top: 2px; }
.anfz-svc-bot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.anfz-svc-qty { display: flex; align-items: center; gap: 6px; }
.anfz-svc-qty-btn {
width: 32px; height: 32px; border: 0; cursor: pointer; border-radius: 8px;
display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.anfz-svc-qty-btn.minus { background: #f1f5f9; color: #1a2238; }
.anfz-svc-qty-btn.minus:hover:not(:disabled) { background: #e2e8f0; }
.anfz-svc-qty-btn.minus:disabled { opacity: .4; cursor: not-allowed; }
.anfz-svc-qty-btn.plus { background: #1e3a8a; color: #fff; }
.anfz-svc-qty-btn.plus:hover { background: #1e40af; }
.anfz-svc-qty-btn svg { width: 14px; height: 14px; }
.anfz-svc-qty-val { width: 32px; text-align: center; font-size: 14px; font-weight: 700; }
.anfz-svc-price { font-size: 17px; font-weight: 800; color: #1e3a8a; }
.anfz-svc-curr { font-size: 12px; color: #64748b; margin-right: 4px; }
.anfz-svc-line {
margin-top: 8px; padding-top: 8px;
border-top: 1px dashed rgba(30,58,138,.3);
display: flex; align-items: center; justify-content: space-between;
}
.anfz-svc-line-val { font-size: 14px; font-weight: 700; color: #1e3a8a; }
.anfz-svc-line-lbl { font-size: 11px; color: #64748b; }
.anfz-mobile-hint {
margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 4px;
font-size: 11px; color: #64748b;
}
.anfz-mobile-hint svg { width: 12px; height: 12px; }
@media (min-width: 640px) {
.anfz-tabs { grid-template-columns: repeat(5, 1fr); gap: 10px; }
.anfz-tab { padding: 12px 8px; }
.anfz-tab-icon { width: 40px; height: 40px; }
.anfz-tab-icon svg { width: 20px; height: 20px; }
.anfz-services-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.anfz-header h1 { font-size: 28px; }
}
@media (min-width: 768px) {
.anfz-tabs { grid-template-columns: repeat(9, 1fr); }
.anfz-main { grid-template-columns: 320px 1fr; }
.anfz-cart-wrap { order: 1; }
.anfz-services-wrap { order: 2; }
.anfz-cart-sticky { position: sticky; top: 16px; }
.anfz-mobile-hint { display: none; }
}
@media (max-width: 640px) {
.anfz-calc { padding: 12px 0; }
.anfz-inner { padding: 0 10px; }
}
</style>
<section class="anfz-calc" aria-label="حاسبة أسعار خدمات شركة التنفيذ">
<div class="anfz-inner">
<header class="anfz-header">
<h1>حاسبة الأسعار</h1>
<p>اختر خدماتك واحصل على عرض سعر فوري عبر واتساب</p>
</header>
<nav class="anfz-tabs" id="anfzTabs" role="tablist" aria-label="فئات الخدمات"></nav>
<div class="anfz-main">
<aside class="anfz-cart-wrap" id="anfzCartWrap" aria-label="ملخص الطلب">
<div class="anfz-cart-sticky">
<div class="anfz-card">
<button class="anfz-cart-head" id="anfzCartToggle" type="button" aria-expanded="true">
<span class="anfz-chev-box"><i data-lucide="chevron-up"></i></span>
<span class="anfz-cart-head-right">
<span>
<span class="anfz-cart-head-title">قائمة الخدمات المختارة</span>
<span class="anfz-cart-head-sub" id="anfzCount">0 خدمة</span>
</span>
<i data-lucide="clipboard-list" style="width:20px;height:20px;color:#fff"></i>
</span>
</button>
<div class="anfz-cart-body" id="anfzCartBody">
<div class="anfz-empty" id="anfzEmpty">
<div class="anfz-empty-icon"><i data-lucide="shopping-bag"></i></div>
<p>اختر خدمة من قائمة الخدمات</p>
</div>
<ul class="anfz-cart-list" id="anfzCartList" hidden></ul>
</div>
</div>
<div class="anfz-totals" aria-live="polite">
<div class="anfz-totals-top">
<div class="anfz-row">
<span class="anfz-subtotal" id="anfzSub">0 ر.س</span>
<span class="anfz-label">المجموع</span>
</div>
<div class="anfz-row">
<span class="anfz-vat" id="anfzVat">0 ر.س</span>
<span class="anfz-vat-label">إجمالي الضريبة (15%)</span>
</div>
</div>
<div class="anfz-row anfz-grand">
<span class="anfz-grand-val" id="anfzTotal">0 ر.س</span>
<span class="anfz-grand-label">إجمالي السعر بعد الضريبة</span>
</div>
<div class="anfz-warn" role="note">
<i data-lucide="alert-triangle"></i>
<p>هذه الأسعار تقريبية وقد تختلف عند الزيارة الميدانية</p>
</div>
<button class="anfz-btn anfz-btn-wa" id="anfzWaBtn" type="button" disabled>
<i data-lucide="send"></i>
<span>إرسال الطلب عبر واتساب</span>
</button>
<button class="anfz-btn anfz-btn-copy" id="anfzCopyBtn" type="button" disabled>
<i data-lucide="copy"></i>
<span id="anfzCopyLabel">نسخ ملخص الطلب</span>
</button>
</div>
</div>
</aside>
<section class="anfz-services-wrap" aria-label="الخدمات المتاحة">
<div class="anfz-services">
<div class="anfz-services-head">
<h2 id="anfzCatName">النظافة</h2>
<span class="anfz-services-count" id="anfzCatCount">0 خدمة</span>
</div>
<div class="anfz-services-grid" id="anfzServices"></div>
</div>
<div class="anfz-mobile-hint">
<i data-lucide="chevron-down"></i>
<span>مرّر للأسفل لمراجعة الطلب وإرساله</span>
</div>
</section>
</div>
</div>
</section>
<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
<script>
(function(){
'use strict';
var WA = '966509674920';
var VAT = 0.15;
var CATEGORIES = [
{ id:'cleaning', name:'النظافة', icon:'sparkles', services:[
{ id:'c1', name:'تنظيف فيلا', unit:'يبدأ من', price:900, startsFrom:true },
{ id:'c2', name:'تنظيف شقة', unit:'يبدأ من', price:450, startsFrom:true },
{ id:'c3', name:'تنظيف مكتب', unit:'يبدأ من', price:350, startsFrom:true },
{ id:'c4', name:'تنظيف مجالس', unit:'المجلس', price:300 },
{ id:'c5', name:'تنظيف مطبخ', unit:'يبدأ من', price:250, startsFrom:true },
{ id:'c6', name:'تنظيف بعد التشطيب', unit:'يبدأ من', price:800, startsFrom:true }
]},
{ id:'tanks', name:'الخزانات', icon:'droplets', services:[
{ id:'t1', name:'تنظيف خزان أرضي', unit:'يبدأ من', price:350, startsFrom:true },
{ id:'t2', name:'تنظيف خزان علوي', unit:'يبدأ من', price:250, startsFrom:true },
{ id:'t3', name:'عزل خزانات', unit:'يبدأ من', price:600, startsFrom:true },
{ id:'t4', name:'تعقيم خزانات', unit:'الخزان', price:200 }
]},
{ id:'insulation', name:'العزل والترميم', icon:'layers', services:[
{ id:'i1', name:'عزل أسطح', unit:'م²', price:35 },
{ id:'i2', name:'عزل فوم', unit:'م²', price:28 },
{ id:'i3', name:'عزل مواسير', unit:'م', price:40 },
{ id:'i4', name:'ترميم منازل', unit:'يبدأ من', price:1500, startsFrom:true },
{ id:'i5', name:'كشف تسربات', unit:'الفحص', price:350 },
{ id:'i6', name:'تبليط سيراميك', unit:'م²', price:45 }
]},
{ id:'pest', name:'مكافحة الحشرات', icon:'bug', services:[
{ id:'p1', name:'مكافحة شقة', unit:'يبدأ من', price:250, startsFrom:true },
{ id:'p2', name:'مكافحة فيلا', unit:'يبدأ من', price:500, startsFrom:true },
{ id:'p3', name:'مكافحة محل تجاري', unit:'يبدأ من', price:400, startsFrom:true },
{ id:'p4', name:'عقد 4 زيارات - شقة', unit:'العقد', price:825 },
{ id:'p5', name:'عقد 4 زيارات - فيلا', unit:'العقد', price:1650 },
{ id:'p6', name:'رش مبيدات', unit:'يبدأ من', price:200, startsFrom:true }
]},
{ id:'ac', name:'تنظيف المكيفات', icon:'wrench', services:[
{ id:'ac1', name:'تنظيف مكيف سبليت', unit:'الوحدة', price:120 },
{ id:'ac2', name:'تنظيف مكيف شباك', unit:'الوحدة', price:100 },
{ id:'ac3', name:'تنظيف مكيف مركزي', unit:'يبدأ من', price:350, startsFrom:true },
{ id:'ac4', name:'صيانة عدم تبريد', unit:'الفحص', price:150 }
]},
{ id:'furniture', name:'الأثاث والكنب', icon:'sofa', services:[
{ id:'f1', name:'كنب فردي', unit:'الوحدة', price:57 },
{ id:'f2', name:'طقم كنب 7 أشخاص', unit:'الطقم', price:350 },
{ id:'f3', name:'جلسة عربية', unit:'متر طولي', price:35 },
{ id:'f4', name:'مسندة ظهر', unit:'متر طولي', price:25 },
{ id:'f5', name:'تنظيف مرتبة', unit:'الوحدة', price:80 },
{ id:'f6', name:'ستائر', unit:'متر طولي', price:40 }
]},
{ id:'carpets', name:'السجاد', icon:'layers', services:[
{ id:'cp1', name:'سجاد عادي', unit:'م²', price:12 },
{ id:'cp2', name:'موكيت', unit:'م²', price:10 },
{ id:'cp3', name:'سجاد فاخر', unit:'م²', price:18 },
{ id:'cp4', name:'أرضيات', unit:'م²', price:8 }
]},
{ id:'moving', name:'نقل الأثاث', icon:'truck', services:[
{ id:'m1', name:'نقل داخل المدينة', unit:'يبدأ من', price:800, startsFrom:true },
{ id:'m2', name:'نقل بين المدن', unit:'يبدأ من', price:1500, startsFrom:true },
{ id:'m3', name:'فك وتركيب', unit:'يبدأ من', price:400, startsFrom:true },
{ id:'m4', name:'تغليف', unit:'يبدأ من', price:300, startsFrom:true }
]},
{ id:'pools', name:'المسابح', icon:'home', services:[
{ id:'pl1', name:'إنشاء مسابح', unit:'يبدأ من', price:15000, startsFrom:true },
{ id:'pl2', name:'تنظيف مسابح', unit:'يبدأ من', price:500, startsFrom:true },
{ id:'pl3', name:'صيانة مسابح', unit:'يبدأ من', price:350, startsFrom:true }
]}
];
var state = { activeCat: CATEGORIES[0].id, cart: {}, cartOpen: true };
function renderTabs(){
var wrap = document.getElementById('anfzTabs');
wrap.innerHTML = '';
CATEGORIES.forEach(function(cat){
var btn = document.createElement('button');
btn.type = 'button';
btn.className = 'anfz-tab' + (cat.id === state.activeCat ? ' active' : '');
btn.setAttribute('role','tab');
btn.setAttribute('aria-selected', cat.id === state.activeCat ? 'true' : 'false');
btn.innerHTML = '<span class="anfz-tab-icon"><i data-lucide="'+cat.icon+'"></i></span><span class="anfz-tab-name">'+cat.name+'</span>';
btn.addEventListener('click', function(){ state.activeCat = cat.id; renderTabs(); renderServices(); });
wrap.appendChild(btn);
});
if (window.lucide) window.lucide.createIcons();
}
function renderServices(){
var cat = CATEGORIES.find(function(c){ return c.id === state.activeCat; });
document.getElementById('anfzCatName').textContent = cat.name;
document.getElementById('anfzCatCount').textContent = cat.services.length + ' خدمة';
var grid = document.getElementById('anfzServices');
grid.innerHTML = '';
cat.services.forEach(function(svc){
var item = state.cart[svc.id];
var qty = item ? item.qty : 0;
var active = qty > 0;
var card = document.createElement('article');
card.className = 'anfz-svc' + (active ? ' active' : '');
card.innerHTML =
'<div class="anfz-svc-top"><div><div class="anfz-svc-name">'+svc.name+'</div><div class="anfz-svc-unit">'+(svc.startsFrom ? 'يبدأ من' : svc.unit)+'</div></div></div>'+
'<div class="anfz-svc-bot"><div class="anfz-svc-qty">'+
'<button type="button" class="anfz-svc-qty-btn minus" data-act="dec" '+(qty===0?'disabled':'')+' aria-label="إنقاص"><i data-lucide="minus"></i></button>'+
'<span class="anfz-svc-qty-val">'+qty+'</span>'+
'<button type="button" class="anfz-svc-qty-btn plus" data-act="inc" aria-label="زيادة"><i data-lucide="plus"></i></button>'+
'</div><div><span class="anfz-svc-price">'+svc.price+'</span><span class="anfz-svc-curr">ر.س</span></div></div>'+
(active ? '<div class="anfz-svc-line"><span class="anfz-svc-line-val">'+(svc.price*qty)+' ر.س</span><span class="anfz-svc-line-lbl">المجموع</span></div>' : '');
card.querySelector('[data-act="inc"]').addEventListener('click', function(){ updateQty(svc, cat.name, 1); });
card.querySelector('[data-act="dec"]').addEventListener('click', function(){ updateQty(svc, cat.name, -1); });
grid.appendChild(card);
});
if (window.lucide) window.lucide.createIcons();
}
function renderCart(){
var items = Object.keys(state.cart).map(function(k){ return state.cart[k]; });
document.getElementById('anfzCount').textContent = items.length + ' خدمة';
var empty = document.getElementById('anfzEmpty');
var list = document.getElementById('anfzCartList');
if (items.length === 0){
empty.hidden = false; list.hidden = true; list.innerHTML = '';
} else {
empty.hidden = true; list.hidden = false; list.innerHTML = '';
items.forEach(function(it){
var li = document.createElement('li');
li.className = 'anfz-cart-item';
li.innerHTML =
'<div class="anfz-cart-item-top"><span class="anfz-cart-item-name">'+it.service.name+'</span>'+
'<button type="button" class="anfz-btn-del" aria-label="حذف"><i data-lucide="trash-2"></i></button></div>'+
'<div class="anfz-cart-item-bot"><span class="anfz-cart-item-total">'+(it.service.price*it.qty)+' ر.س</span>'+
'<div class="anfz-qty">'+
'<button type="button" class="anfz-qty-btn minus" data-act="dec" aria-label="إنقاص"><i data-lucide="minus"></i></button>'+
'<span class="anfz-qty-val">'+it.qty+'</span>'+
'<button type="button" class="anfz-qty-btn plus" data-act="inc" aria-label="زيادة"><i data-lucide="plus"></i></button>'+
'</div><span class="anfz-cart-item-unit">'+it.service.price+' ر.س</span></div>';
li.querySelector('.anfz-btn-del').addEventListener('click', function(){
delete state.cart[it.service.id]; renderCart(); renderServices(); renderTotals();
});
li.querySelector('[data-act="inc"]').addEventListener('click', function(){ updateQty(it.service, it.category, 1); });
li.querySelector('[data-act="dec"]').addEventListener('click', function(){ updateQty(it.service, it.category, -1); });
list.appendChild(li);
});
}
if (window.lucide) window.lucide.createIcons();
}
function renderTotals(){
var items = Object.keys(state.cart).map(function(k){ return state.cart[k]; });
var sub = items.reduce(function(s,i){ return s + i.service.price * i.qty; }, 0);
var vat = Math.round(sub * VAT);
var total = sub + vat;
document.getElementById('anfzSub').textContent = sub + ' ر.س';
document.getElementById('anfzVat').textContent = vat + ' ر.س';
document.getElementById('anfzTotal').textContent = total + ' ر.س';
var disabled = items.length === 0;
document.getElementById('anfzWaBtn').disabled = disabled;
document.getElementById('anfzCopyBtn').disabled = disabled;
}
function updateQty(service, categoryName, delta){
var existing = state.cart[service.id];
var newQty = (existing ? existing.qty : 0) + delta;
if (newQty <= 0) { delete state.cart[service.id]; }
else { state.cart[service.id] = { service: service, category: categoryName, qty: newQty }; }
renderCart(); renderServices(); renderTotals();
}
function buildMessage(){
var items = Object.keys(state.cart).map(function(k){ return state.cart[k]; });
var sub = items.reduce(function(s,i){ return s + i.service.price * i.qty; }, 0);
var vat = Math.round(sub * VAT);
var total = sub + vat;
var lines = ['*طلب خدمة جديد — شركة التنفيذ*','','*الخدمات المطلوبة:*'];
items.forEach(function(i, idx){
lines.push((idx+1)+'. '+i.service.name+' — الكمية: '+i.qty+' × '+i.service.price+' ر.س = '+(i.service.price*i.qty)+' ر.س');
});
lines.push('');
lines.push('*المجموع:* '+sub+' ر.س');
lines.push('*الضريبة (15%):* '+vat+' ر.س');
lines.push('*الإجمالي بعد الضريبة:* '+total+' ر.س');
lines.push('');
lines.push('ملاحظة: الأسعار تقريبية وقد تختلف عند الزيارة الميدانية.');
return lines.join('\n');
}
document.getElementById('anfzCartToggle').addEventListener('click', function(){
state.cartOpen = !state.cartOpen;
var wrap = document.getElementById('anfzCartWrap');
if (state.cartOpen) wrap.classList.remove('collapsed'); else wrap.classList.add('collapsed');
this.setAttribute('aria-expanded', state.cartOpen ? 'true' : 'false');
});
document.getElementById('anfzWaBtn').addEventListener('click', function(){
if (this.disabled) return;
var msg = encodeURIComponent(buildMessage());
window.open('https://wa.me/'+WA+'?text='+msg, '_blank');
});
document.getElementById('anfzCopyBtn').addEventListener('click', function(){
if (this.disabled) return;
var label = document.getElementById('anfzCopyLabel');
var text = buildMessage();
var done = function(){
label.textContent = 'تم النسخ بنجاح';
setTimeout(function(){ label.textContent = 'نسخ ملخص الطلب'; }, 2000);
};
if (navigator.clipboard && navigator.clipboard.writeText){
navigator.clipboard.writeText(text).then(done).catch(fallback);
} else { fallback(); }
function fallback(){
var ta = document.createElement('textarea');
ta.value = text; document.body.appendChild(ta);
ta.select(); try { document.execCommand('copy'); } catch(e){}
document.body.removeChild(ta); done();
}
});
renderTabs(); renderServices(); renderCart(); renderTotals();
})();
</script>