Update: 2026-05-16 01:36:22

public/landing.php

@@ -164,11 +164,23 @@
 <h2>اختر الباقة المناسبة لحجم أعمالك</h2>
 <p>لا رسوم خفية. لا عقود طويلة. ابدأ مجاناً وتدرّج حسب احتياجك.</p>
 </div>
+<div style="display:flex; justify-content:center; margin-bottom:40px;">
+    <div class="cycle-toggle" style="background:rgba(255,255,255,0.05); padding:6px; border-radius:14px; display:inline-flex; border:1px solid rgba(255,255,255,0.1); cursor:pointer;" onclick="this.classList.toggle('monthly'); document.querySelectorAll('.price-monthly').forEach(el=>el.style.display=this.classList.contains('monthly')?'block':'none'); document.querySelectorAll('.price-annual').forEach(el=>el.style.display=this.classList.contains('monthly')?'none':'block');">
+        <span class="toggle-btn annual-btn" style="padding:10px 24px; border-radius:10px; font-size:14px; font-weight:700; color:white; background:var(--green-mid); transition:all 0.3s;">دفع سنوي (توفير ✨)</span>
+        <span class="toggle-btn monthly-btn" style="padding:10px 24px; border-radius:10px; font-size:14px; font-weight:700; color:var(--text-3); transition:all 0.3s;">دفع شهري</span>
+    </div>
+</div>
+
+<style>
+.cycle-toggle.monthly .annual-btn { background:transparent; color:var(--text-3); }
+.cycle-toggle.monthly .monthly-btn { background:var(--green-mid); color:white; }
+</style>
+
 <div class="pricing-grid">
 
 <div class="price-card">
 <div class="price-name">التجربة المجانية</div>
-<div class="price-amount">0 <span>دينار/سنة</span></div>
+<div class="price-amount">0 <span>دينار/شهر</span></div>
 <div class="price-desc">للتجربة الأولية</div>
 <ul class="price-features">
 <li><span class="feature-check">✔</span> شركة واحدة</li>
@@ -182,13 +194,14 @@
 
 <div class="price-card popular">
 <div class="popular-badge">⭐ الأكثر اختياراً</div>
-<div class="price-name">الباقة الأساسية (سنوي)</div>
-<div class="price-amount">120 <span>دينار/سنة</span></div>
+<div class="price-name">الباقة الأساسية</div>
+<div class="price-amount price-annual">120 <span>دينار/سنة</span></div>
+<div class="price-amount price-monthly" style="display:none;">15 <span>دينار/شهر</span></div>
 <div class="price-desc">للمحاسبين والشركات الصغيرة</div>
 <ul class="price-features">
-<li><span class="feature-check">✔</span> شركة واحدة</li>
-<li><span class="feature-check">✔</span> 12,000 فاتورة سنوياً</li>
-<li><span class="feature-check">✔</span> مستخدم واحد</li>
+<li><span class="feature-check">✔</span> حتى 3 شركات</li>
+<li><span class="feature-check">✔</span> 500 فاتورة شهرياً</li>
+<li><span class="feature-check">✔</span> مستخدمين اثنين</li>
 <li><span class="feature-check">✔</span> دعم فني متكامل</li>
 <li><span class="feature-check">✔</span> ربط مباشر مع جوفوترة</li>
 </ul>
@@ -196,12 +209,13 @@
 </div>
 
 <div class="price-card">
-<div class="price-name">الباقة الاحترافية (سنوي)</div>
-<div class="price-amount">250 <span>دينار/سنة</span></div>
+<div class="price-name">الباقة الاحترافية</div>
+<div class="price-amount price-annual">290 <span>دينار/سنة</span></div>
+<div class="price-amount price-monthly" style="display:none;">35 <span>دينار/شهر</span></div>
 <div class="price-desc">للمكاتب الكبيرة والموزعين</div>
 <ul class="price-features">
 <li><span class="feature-check">✔</span> شركات غير محدودة</li>
-<li><span class="feature-check">✔</span> 50,000 فاتورة سنوياً</li>
+<li><span class="feature-check">✔</span> 3,000 فاتورة شهرياً</li>
 <li><span class="feature-check">✔</span> 5 مستخدمين</li>
 <li><span class="feature-check">✔</span> تدقيق ذكي استباقي</li>
 <li><span class="feature-check">✔</span> مدير حساب مخصص</li>

public/shell.php

@@ -1951,6 +1951,22 @@
                         </p>
                     </div>
 
+                    <!-- Cycle Toggle -->
+                    <div style="display:flex; justify-content:center; margin-bottom:36px;">
+                        <div style="background:var(--bg-secondary); padding:5px; border-radius:12px; display:flex; gap:5px; border:1px solid var(--border);">
+                            <button @click="billingCycle = 'monthly'" 
+                                :class="billingCycle === 'monthly' ? 'btn-navy' : 'btn-ghost'"
+                                style="font-size:13px; padding:8px 20px; border-radius:8px; transition:all 0.2s;">
+                                دفع شهري
+                            </button>
+                            <button @click="billingCycle = 'annual'" 
+                                :class="billingCycle === 'annual' ? 'btn-navy' : 'btn-ghost'"
+                                style="font-size:13px; padding:8px 20px; border-radius:8px; transition:all 0.2s;">
+                                دفع سنوي (توفير ✨)
+                            </button>
+                        </div>
+                    </div>
+
                     <div style="display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:24px;">
                         <template x-for="p in plans" :key="p.id">
                             <div class="plan-card" :class="subscription?.plan_id === p.id ? 'active-plan' : ''">
@@ -1969,9 +1985,9 @@
                                     style="text-align:center; padding:18px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border);">
                                     <span class="num-font"
                                         style="font-size:46px; font-weight:800; color:var(--green-mid);"
-                                        x-text="p.price_jod"></span>
+                                        x-text="billingCycle === 'monthly' ? (p.price_monthly_jod || p.price_jod) : (p.price_annual_jod || (p.price_jod * 10))"></span>
                                     <span style="font-size:15px; color:var(--text-3); font-weight:500;"> دينار /
-                                        سنة</span>
+                                        <span x-text="billingCycle === 'monthly' ? 'شهر' : 'سنة'"></span></span>
                                 </div>
 
                                 <ul
@@ -2927,7 +2943,9 @@
                 isUploadingBatch: false, batchProgress: { total: 0, current: 0 },
                 showAddTenantModal: false, showEditTenantModal: false, showTenantStatsModal: false,
                 acknowledgedWarnings: false, isEditingInvoice: false,
-                isBusy: false, globalError: '',
+                isBusy: false,
+                billingCycle: 'annual', // 'monthly' or 'annual'
+                globalError: '',
 
                 newUser: { name: '', email: '', password: '', role: 'accountant', tenant_id: '' },
                 newCompany: { name: '', tax_identification_number: '', commercial_registration_number: '', address: '', tenant_id: '' },
@@ -3399,7 +3417,10 @@
                         const res = await fetch('/index.php?route=v1/payments/create', {
                             method: 'POST',
                             headers: { 'Authorization': 'Bearer ' + this.token(), 'Content-Type': 'application/json' },
-                            body: JSON.stringify({ plan_id: plan.id })
+                            body: JSON.stringify({ 
+                                plan_id: plan.id,
+                                billing_cycle: this.billingCycle
+                            })
                         });
                         const json = await res.json();
                         this.isBusy = false;