Download support-ui.js from Althnayi/fc: direct link, hf CLI and curl.
- Browser
- Download file 41.4 kB
-
https://huggingface.co/spaces/Althnayi/fc/resolve/main/support-ui.js
- Command line
-
hf download hf://spaces/Althnayi/fc/support-ui.js
-
curl -L -o support-ui.js https://huggingface.co/spaces/Althnayi/fc/resolve/main/support-ui.js
41.4 kB
| /** | |
| * @fileoverview Support Helpdesk, Currency Exchange Calculator & Payment Gateways UI Engine | |
| * @module ui/support-ui | |
| * @description واجهة مركز الدعم المباشر، حاسبة تحويل العملات المباشرة، بوابات الدفع والتحويل البنكي، وتوليد تذاكر الشحن الموثقة. | |
| */ | |
| (global => { | |
| 'use strict'; | |
| const SUPPORT_SALT = global.FritreeAppConstants?.SECURITY_SALTS?.SUPPORT_SALT || | |
| "FritreeSupportHelpdeskSymmetricValidationMatrix_2026_StrictSecure"; | |
| /** | |
| * حساب التوقيع الرقمي لسلامة بيانات الدعم الفني | |
| * @param {string} accountId | |
| * @returns {Promise<string>} | |
| */ | |
| async function calculateSupportSignature(accountId) { | |
| const payloadText = `SUPPORT_HELP:${accountId}:${SUPPORT_SALT}`; | |
| if (global.FritreeCrypto && typeof global.FritreeCrypto.sha256 === 'function') { | |
| return await global.FritreeCrypto.sha256(payloadText); | |
| } | |
| let hash = 0; | |
| for (let i = 0; i < payloadText.length; i++) { | |
| const char = payloadText.charCodeAt(i); | |
| hash = ((hash << 5) - hash) + char; | |
| hash |= 0; | |
| } | |
| return "support_sig_fallback_" + Math.abs(hash).toString(16); | |
| } | |
| /** | |
| * بناء الهيكل البصري لقسم الدعم الفني وحاسبة العملات وبوابات الدفع بالـ DOM | |
| */ | |
| const buildSupportLayout = () => { | |
| const contentArea = document.getElementById('s7ihkirolg'); | |
| if (!contentArea) return; | |
| const sidebar = document.getElementById('bmh59axx92'); | |
| if (sidebar && !sidebar.querySelector('[data-target="xrsxtjzo87"]')) { | |
| const navItem = document.createElement('div'); | |
| navItem.className = 'f2rj8bz2yt'; | |
| navItem.setAttribute('data-target', 'xrsxtjzo87'); | |
| navItem.innerHTML = '<i class="fa-solid fa-headset"></i> <span>الدعم والشحن المالي</span>'; | |
| sidebar.appendChild(navItem); | |
| navItem.addEventListener('click', () => { | |
| window.location.hash = 'xrsxtjzo87'; | |
| }); | |
| } | |
| const host = document.getElementById('fritree-dynamic-panes-host') || contentArea; | |
| let pane = document.getElementById('xrsxtjzo87'); | |
| if (!pane) { | |
| pane = document.createElement('section'); | |
| pane.className = 'rjiai07g77'; | |
| pane.id = 'xrsxtjzo87'; | |
| host.appendChild(pane); | |
| } else if (pane.parentElement !== host) { | |
| host.appendChild(pane); | |
| } | |
| let grid = pane.querySelector('#ovnw7b9lmg'); | |
| if (!grid) { | |
| grid = document.createElement('div'); | |
| grid.id = 'ovnw7b9lmg'; | |
| grid.className = 'xd506q5mar'; | |
| grid.style.cssText = 'display: grid; grid-template-columns: repeat(auto-fit, minmax(clamp(280px, 35vw, 1fr), 1fr)); gap: 14px; margin-bottom: 16px; direction: rtl; width: 100%; box-sizing: border-box;'; | |
| pane.appendChild(grid); | |
| } | |
| // 1. العمود الأول: مركز الدعم الفني وشات الواتساب | |
| let supportCol = grid.querySelector('#chtnqegnou'); | |
| if (!supportCol) { | |
| supportCol = document.createElement('div'); | |
| supportCol.className = 'd5tp7way8h'; | |
| supportCol.id = 'chtnqegnou'; | |
| supportCol.style.cssText = 'padding: clamp(14px, 1.8vw, 22px); display: flex; flex-direction: column; height: 100%; direction: rtl; text-align: right; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-xs); box-sizing: border-box;'; | |
| supportCol.innerHTML = ` | |
| <div class="cm41ch7urz" style="border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; direction: rtl; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-size: 14.5px; font-weight: 900; display: flex; align-items: center; gap: 8px; color: var(--text-main);"> | |
| <i class="fa-solid fa-headset" style="color: #d97706;"></i> | |
| <span>مركز الدعم الفني والشحن الفوري</span> | |
| </span> | |
| <span style="font-size: 9.5px; font-weight: 800; padding: 2px 8px; border-radius: var(--radius-pill); border: 1px solid var(--success-border); background: var(--success-light); color: var(--success-hover); display: inline-flex; align-items: center; gap: 4px;"> | |
| <i class="fa-solid fa-clock-rotate-left"></i> <span>خدمة 24/7 متواصلة</span> | |
| </span> | |
| </div> | |
| <p style="font-size: 11.5px; color: var(--text-muted); margin-bottom: 14px; line-height: 1.5; text-align: right; font-weight: 600;"> | |
| <i class="fa-solid fa-comment-sms" style="color: var(--primary); margin-left: 4px;"></i> | |
| <span>فريق الدعم المخصص متاح على مدار الساعة للإجابة على استفساراتك وتأكيد شحن أرصدة المحفظة ونقاط النشر والبث فورياً.</span> | |
| </p> | |
| <div style="display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px;"> | |
| <div> | |
| <label style="font-size: 11px; font-weight: 700; margin-bottom: 4px; display: block; color: var(--text-secondary);"><i class="fa-brands fa-whatsapp" style="color: var(--wa-brand);"></i> <span>رقم الواتساب المباشر للدعم والشحن:</span></label> | |
| <div style="font-size: 14px; font-weight: 700; border: 1px solid var(--border); padding: 10px 14px; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: space-between; gap: 8px; direction: ltr; background: var(--bg-subtle);"> | |
| <span style="display: flex; align-items: center; gap: 8px; font-family: var(--font-code); color: var(--text-main);"> | |
| <i class="fa-brands fa-whatsapp fa-lg" style="color: var(--wa-brand);"></i> <span>+201096896689</span> | |
| </span> | |
| <span style="font-size: 9.5px; font-weight: 800; padding: 2px 8px; border-radius: var(--radius-pill); border: 1px solid var(--success-border); background: var(--success-light); color: var(--success-hover); display: inline-flex; align-items: center; gap: 4px; direction: rtl;"> | |
| <span style="display: inline-block; width: 6px; height: 6px; background: var(--success); border-radius: 50%;"></span> | |
| <span>متصل الآن</span> | |
| </span> | |
| </div> | |
| </div> | |
| <div> | |
| <label style="font-size: 11px; font-weight: 700; margin-bottom: 4px; display: block; color: var(--text-secondary);"><i class="fa-solid fa-id-card" style="color: var(--primary);"></i> <span>كود جهازك الموثق (128 حرف):</span></label> | |
| <div style="display: flex; gap: 6px; align-items: center; direction: ltr;"> | |
| <input type="text" id="an7xl5rgcc" readonly style="flex: 1; padding: 8px 10px; font-size: 9.5px; font-weight: 700; font-family: var(--font-code); border: 1px solid var(--border); border-radius: var(--radius-md); text-align: left; background: var(--bg-subtle);" value="جاري جلب كود الجهاز الرقمي..."> | |
| <button id="zayjah9bha" class="ipxi2jz4g0" style="padding: 8px 12px; min-height: 36px; border-radius: var(--radius-md);" title="نسخ كود الجهاز"><i class="fa-solid fa-copy" style="margin:0;"></i> </button> | |
| </div> | |
| </div> | |
| </div> | |
| <button id="t7zdv53427" class="itdnt14mss" style="width: 100%; margin-top: auto; padding: 12px; font-size: 12.5px; font-weight: 800; display: flex; justify-content: center; align-items: center; gap: 6px; border-radius: var(--radius-md); background: var(--wa-brand); border-color: var(--wa-brand);"> | |
| <i class="fa-brands fa-whatsapp" style="font-size: 16px;"></i> | |
| <span>بدء محادثة واتساب مباشرة مع الدعم والشحن</span> | |
| </button> | |
| `; | |
| grid.appendChild(supportCol); | |
| } | |
| // 2. العمود الثاني: حاسبة تحويل العملات وتوليد تذاكر الشحن الموثقة | |
| let calcCol = grid.querySelector('#p266i7uuqq'); | |
| if (!calcCol) { | |
| calcCol = document.createElement('div'); | |
| calcCol.className = 'd5tp7way8h'; | |
| calcCol.id = 'p266i7uuqq'; | |
| calcCol.style.cssText = 'padding: clamp(14px, 1.8vw, 22px); display: flex; flex-direction: column; height: 100%; direction: rtl; text-align: right; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-xs); box-sizing: border-box;'; | |
| calcCol.innerHTML = ` | |
| <div class="cm41ch7urz" style="border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; direction: rtl; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-size: 14.5px; font-weight: 900; display: flex; align-items: center; gap: 8px; color: var(--text-main);"> | |
| <i class="fa-solid fa-calculator" style="color: var(--primary);"></i> | |
| <span>حاسبة العملات وتوليد تذاكر الشحن</span> | |
| </span> | |
| <button type="button" id="btn-refresh-live-rates" class="ipxi2jz4g0" style="font-size: 10px; padding: 4px 8px; border-radius: var(--radius-sm); font-weight: 700; min-height: 28px;" title="تحديث أسعار الصرف الحية"> | |
| <i class="fa-solid fa-rotate" id="fl89095b2h" style="margin-left: 3px;"></i> <span>تحديث الأسعار</span> | |
| </button> | |
| </div> | |
| <div id="nz4u9dnl2a" style="font-size: 10px; font-weight: 700; background: var(--bg-subtle); padding: 6px 10px; border-radius: var(--radius-md); border: 1px solid var(--border); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; color: var(--text-secondary);"> | |
| <i class="fa-solid fa-circle-check" style="color: var(--success);"></i> <span>جاري جلب أحدث أسعار الصرف العالمية الحية...</span> | |
| </div> | |
| <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin-bottom: 10px;"> | |
| <div class="d0uttwsjz2" style="margin: 0;"> | |
| <label style="font-weight: 700; font-size: 11px;"><i class="fa-solid fa-money-bill-transfer"></i> <span>العملة المحولة:</span></label> | |
| <select id="nakt4bs0fk" class="xy26ymifmf" style="padding: 7px 10px; font-weight: 700;"> | |
| <option value="EGP" selected>جنيه مصري (EGP)</option> | |
| <option value="USD">دولار أمريكي (USD)</option> | |
| <option value="SAR">ريال سعودي (SAR)</option> | |
| <option value="AED">درهم إماراتي (AED)</option> | |
| <option value="QAR">ريال قطري (QAR)</option> | |
| <option value="EUR">يورو (EUR)</option> | |
| <option value="GBP">جنيه إسترليني (GBP)</option> | |
| <option value="KWD">دينار كويتي (KWD)</option> | |
| <option value="CAD">دولار كندي (CAD)</option> | |
| <option value="AUD">دولار أسترالي (AUD)</option> | |
| <option value="CHF">فرنك سويسري (CHF)</option> | |
| </select> | |
| </div> | |
| <div class="d0uttwsjz2" style="margin: 0;"> | |
| <label style="font-weight: 700; font-size: 11px;"><i class="fa-solid fa-coins"></i> <span>المبلغ المحلي:</span></label> | |
| <input type="number" id="rjr8i1f9f3" value="5000" min="1" step="10" class="xy26ymifmf" style="padding: 7px 10px; text-align: center; font-weight: 900; font-size: 14px; font-family: var(--font-code);"> | |
| </div> | |
| </div> | |
| <!-- سعر الصرف الحي --> | |
| <div style="background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 8px 12px; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center; font-size: 10.5px; font-weight: 700; color: var(--text-secondary);"> | |
| <span><i class="fa-solid fa-chart-line" style="color: var(--primary);"></i> <span>سعر الصرف المباشر:</span></span> | |
| <span id="gw1x4qf392" style="direction: ltr; font-family: var(--font-code); color: var(--text-main);">1 USD = 50.00 EGP</span> | |
| </div> | |
| <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin-bottom: 14px;"> | |
| <div class="d0uttwsjz2" style="margin: 0;"> | |
| <label style="font-weight: 700; font-size: 11px;"><i class="fa-solid fa-wallet"></i> <span>المستلم بالمحفظة:</span></label> | |
| <select id="d0iuamglk9" class="xy26ymifmf" style="padding: 7px 10px; font-weight: 700;"> | |
| <option value="USD" selected>دولار أمريكي (USD)</option> | |
| <option value="EGP">جنيه مصري (EGP)</option> | |
| <option value="SAR">ريال سعودي (SAR)</option> | |
| <option value="AED">درهم إماراتي (AED)</option> | |
| <option value="EUR">يورو (EUR)</option> | |
| </select> | |
| </div> | |
| <div class="d0uttwsjz2" style="margin: 0;"> | |
| <label style="font-weight: 700; font-size: 11px;"><i class="fa-solid fa-hand-holding-dollar"></i> <span>صافي الرصيد ($):</span></label> | |
| <input type="number" id="ln7azkypv1" value="100.00" min="1" step="1" class="xy26ymifmf" style="padding: 7px 10px; text-align: center; font-weight: 900; font-size: 14px; font-family: var(--font-code); color: var(--success);"> | |
| </div> | |
| </div> | |
| <button type="button" id="btn-generate-purchase-ticket" class="itdnt14mss" style="width: 100%; margin-top: auto; padding: 12px; font-size: 12px; font-weight: 800; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; gap: 6px;"> | |
| <i class="fa-solid fa-file-invoice-dollar"></i> | |
| <span>توليد تذكرة شحن وتأكيد رصيد موثقة على الواتساب</span> | |
| </button> | |
| `; | |
| grid.appendChild(calcCol); | |
| } | |
| buildGatewaysLayout(pane); | |
| }; | |
| /** | |
| * بناء قسم بوابات الدفع البنكية والمحافظ الإلكترونية | |
| */ | |
| const buildGatewaysLayout = (pane) => { | |
| let gatewaysCard = pane.querySelector('#j85twrlin1'); | |
| if (gatewaysCard) return; | |
| gatewaysCard = document.createElement('div'); | |
| gatewaysCard.className = 'd5tp7way8h'; | |
| gatewaysCard.id = 'j85twrlin1'; | |
| gatewaysCard.style.cssText = 'padding: clamp(14px, 1.8vw, 24px); margin-top: 14px; direction: rtl; text-align: right; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-xs); box-sizing: border-box;'; | |
| gatewaysCard.innerHTML = ` | |
| <div class="cm41ch7urz" style="border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 14px; display: flex; justify-content: space-between; align-items: center; width: 100%; direction: rtl; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-size: 14.5px; font-weight: 900; display: flex; align-items: center; gap: 8px; color: var(--text-main);"> | |
| <i class="fa-solid fa-building-columns" style="color: var(--primary);"></i> | |
| <span>طرق الدفع والتحويل المعتمدة لشحن المحفظة</span> | |
| </span> | |
| <span style="font-size: 10.5px; font-weight: 700; color: var(--success); display: flex; align-items: center; gap: 4px;"> | |
| <i class="fa-solid fa-shield-halved"></i> | |
| <span>حساب معتمد وموثق</span> | |
| </span> | |
| </div> | |
| <!-- تبويبات طرق الدفع --> | |
| <div class="pfe6btieb6" style="margin-bottom: 14px;"> | |
| <div class="n9cqm6ze7d vn5qn7dmpk" id="bnm76w554q" style="flex: 1; text-align: center;" data-wallet-sub="p7clpd6ekl"> | |
| <i class="fa-solid fa-building-columns"></i> <span>التحويل البنكي</span> | |
| </div> | |
| <div class="n9cqm6ze7d" id="s0savkddt1" style="flex: 1; text-align: center;" data-wallet-sub="de5zx14cj5"> | |
| <i class="fa-solid fa-mobile-screen-button"></i> <span>إنستاباي</span> | |
| </div> | |
| <div class="n9cqm6ze7d" id="e6s5hu1kwh" style="flex: 1; text-align: center;" data-wallet-sub="io4or4ksqt"> | |
| <i class="fa-solid fa-wallet"></i> <span>محفظة رقمية</span> | |
| </div> | |
| </div> | |
| <!-- 1. التحويل البنكي CIB --> | |
| <div id="p7clpd6ekl" class="gitkevh3xv" style="display: block; direction: rtl; text-align: right;"> | |
| <p style="font-size: 11.5px; color: var(--text-muted); margin-bottom: 12px; font-weight: 600;"> | |
| <i class="fa-solid fa-circle-info" style="color: var(--primary); margin-left: 4px;"></i> | |
| <span>تحويل بنكي مباشر لحسابنا في البنك التجاري الدولي (CIB). اختر عملة التحويل بالأسفل لنسخ رقم الحساب المخصص.</span> | |
| </p> | |
| <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(clamp(200px, 25vw, 1fr), 1fr)); gap: 12px; align-items: center; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px; background: var(--bg-subtle);"> | |
| <div class="d0uttwsjz2" style="margin: 0;"> | |
| <label style="font-weight: 700; font-size: 11px; margin-bottom: 4px;"><i class="fa-solid fa-coins"></i> <span>عملة التحويل البنكي:</span></label> | |
| <select id="guxwjyecsq" class="xy26ymifmf" style="padding: 8px 10px; font-weight: 700;"> | |
| <option value="AUD">دولار أسترالي (AUD)</option> | |
| <option value="CAD">دولار كندي (CAD)</option> | |
| <option value="EGP" selected>جنيه مصري (EGP)</option> | |
| <option value="EUR">يورو (EUR)</option> | |
| <option value="GBP">جنيه إسترليني (GBP)</option> | |
| <option value="QAR">ريال قطري (QAR)</option> | |
| <option value="SAR">ريال سعودي (SAR)</option> | |
| <option value="CHF">فرنك سويسري (CHF)</option> | |
| <option value="AED">درهم إماراتي (AED)</option> | |
| <option value="USD">دولار أمريكي (USD)</option> | |
| </select> | |
| <div id="mwgyafhyi4" style="margin-top: 6px; font-size: 9.5px; font-weight: 700; padding: 4px 8px; border-radius: var(--radius-sm); border: 1px solid var(--success-border); background: var(--success-light); color: var(--success-hover); display: flex; align-items: center; gap: 4px;"> | |
| <i class="fa-solid fa-circle-check"></i> | |
| <span id="g4zn4yhcp4">تحويل مباشر بسعر الصرف الرسمي وبدون أي عمولة</span> | |
| </div> | |
| </div> | |
| <div style="display: flex; flex-direction: column; gap: 6px; border-right: 1px dashed var(--border); padding-right: 14px;" id="p78oq51sn0"> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 4px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-building"></i> <span>البنك المستلم:</span></span> | |
| <strong style="font-size: 11.5px; color: var(--text-main);">البنك التجاري الدولي (CIB - Egypt)</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 4px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-user"></i> <span>اسم صاحب الحساب:</span></span> | |
| <strong style="font-size: 10.5px; font-family: var(--font-sans); color: var(--text-main);" id="xrlai2qd42">Mohamed Ahmed Mohamed Farouk</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 2px; font-size: 11px; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-hashtag"></i> <span>رقم الحساب للنسخ:</span></span> | |
| <div style="display: flex; gap: 6px; align-items: center; direction: ltr;"> | |
| <input type="text" id="jfjeb63r79" readonly style="padding: 4px 8px; font-size: 12px; font-weight: 900; font-family: var(--font-code); background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-sm); width: 140px; text-align: center;" value="100054187089"> | |
| <button id="ucfq23zy85" class="ipxi2jz4g0" style="padding: 4px 8px; min-height: 28px; border-radius: var(--radius-sm);" title="نسخ رقم الحساب البنكي"><i class="fa-solid fa-copy" style="margin: 0;"></i> </button> | |
| </div> | |
| </div> | |
| <div style="margin-top: 4px; text-align: left; direction: ltr;"> | |
| <button type="button" id="cs0slpgdna" class="ipxi2jz4g0" style="font-size: 9.5px; padding: 3px 8px; min-height: 26px; height: auto; font-weight: 700; border-radius: var(--radius-sm); display: inline-flex; align-items: center; gap: 4px;"> | |
| <i class="fa-solid fa-calculator" style="color: var(--primary);"></i> <span>مزامنة مع حاسبة الصرف</span> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 2. تحويل إنستاباي --> | |
| <div id="de5zx14cj5" class="gitkevh3xv" style="display: none; direction: rtl; text-align: right;"> | |
| <p style="font-size: 11.5px; color: var(--text-muted); margin-bottom: 12px; font-weight: 600;"> | |
| <i class="fa-solid fa-circle-info" style="color: var(--primary); margin-left: 4px;"></i> | |
| <span>تحويل مالي فوري وبدون عمولات لعنوان حسابنا على تطبيق إنستاباي أو رقم الموبايل المخصص.</span> | |
| </p> | |
| <div style="display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px; background: var(--bg-subtle);"> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 6px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-bolt" style="color: #8b5cf6;"></i> <span>شبكة التحويل:</span></span> | |
| <strong style="font-size: 11.5px; color: var(--text-main);">إنستاباي مصر (Instapay Egypt)</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 6px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-user"></i> <span>اسم المستلم:</span></span> | |
| <strong style="font-size: 11px; font-family: var(--font-sans); color: var(--text-main);">Mohamed Ahmed Mohamed Farouk</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; font-size: 11px; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-phone"></i> <span>عنوان إنستاباي / الموبايل:</span></span> | |
| <div style="display: flex; gap: 6px; align-items: center; direction: ltr;"> | |
| <input type="text" id="ng4bw51trj" readonly style="padding: 4px 8px; font-size: 12px; font-weight: 900; font-family: var(--font-code); background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-sm); width: 140px; text-align: center;" value="01096896689"> | |
| <button id="teay3xy449" class="ipxi2jz4g0" style="padding: 4px 8px; min-height: 28px; border-radius: var(--radius-sm);" title="نسخ عنوان إنستاباي"><i class="fa-solid fa-copy" style="margin: 0;"></i> </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 3. المحافظ الإلكترونية --> | |
| <div id="io4or4ksqt" class="gitkevh3xv" style="display: none; direction: rtl; text-align: right;"> | |
| <p style="font-size: 11.5px; color: var(--text-muted); margin-bottom: 12px; font-weight: 600;"> | |
| <i class="fa-solid fa-circle-info" style="color: var(--primary); margin-left: 4px;"></i> | |
| <span>تحويل كاش فوري ومباشر من أي محفظة إلكترونية (فودافون كاش، أورنج كاش، اتصالات كاش، وي باي، الخ...).</span> | |
| </p> | |
| <div style="display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px; background: var(--bg-subtle);"> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 6px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-mobile-screen" style="color: var(--danger);"></i> <span>المحفظة المستلمة:</span></span> | |
| <strong style="font-size: 11.5px; color: var(--text-main);">فودافون كاش (Vodafone Cash)</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed var(--border); padding-bottom: 6px; font-size: 11px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-user"></i> <span>اسم صاحب المحفظة:</span></span> | |
| <strong style="font-size: 11px; font-family: var(--font-sans); color: var(--text-main);">Mohamed Ahmed Mohamed Farouk</strong> | |
| </div> | |
| <div style="display: flex; justify-content: space-between; align-items: center; font-size: 11px; flex-wrap: wrap; gap: 6px;"> | |
| <span style="font-weight: 700; color: var(--text-muted);"><i class="fa-solid fa-phone"></i> <span>رقم تحويل الكاش:</span></span> | |
| <div style="display: flex; gap: 6px; align-items: center; direction: ltr;"> | |
| <input type="text" id="ta0fqz0p8e" readonly style="padding: 4px 8px; font-size: 12px; font-weight: 900; font-family: var(--font-code); background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-sm); width: 140px; text-align: center;" value="01096896689"> | |
| <button id="bsx15xd744" class="ipxi2jz4g0" style="padding: 4px 8px; min-height: 28px; border-radius: var(--radius-sm);" title="نسخ رقم المحفظة"><i class="fa-solid fa-copy" style="margin: 0;"></i> </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| `; | |
| pane.appendChild(gatewaysCard); | |
| }; | |
| /** | |
| * تحديث كود الجهاز في حقل العرض | |
| */ | |
| const updateWorkspaceIDDisplay = async () => { | |
| const idDisplay = document.getElementById('an7xl5rgcc'); | |
| if (idDisplay && global.FritreeCrypto && typeof global.FritreeCrypto.getOrGenerateAccountId === 'function') { | |
| const currentId = await global.FritreeCrypto.getOrGenerateAccountId(); | |
| idDisplay.value = currentId; | |
| const computedSignature = await calculateSupportSignature(currentId); | |
| if (global.FritreeStorage) { | |
| await global.FritreeStorage.set('support_security_checksum', computedSignature); | |
| } | |
| } | |
| }; | |
| /** | |
| * إطلاق محادثة الدعم والشحن المباشرة عبر واتساب | |
| */ | |
| const triggerSupportWhatsAppChat = async () => { | |
| if (!global.FritreeCrypto) return; | |
| const currentAccountId = await global.FritreeCrypto.getOrGenerateAccountId(); | |
| const supportNumber = global.FritreeBankingConfig?.RECEIVERS?.SUPPORT_WHATSAPP_CLEAN || "201096896689"; | |
| const messageText = `أهلاً يا فريق دعم فريتري، كود جهازي الموثق هو:\n\n${currentAccountId}\n\nأحتاج للاستفسار وتأكيد شحن أرصدة المحفظة ونقاط النشر التلقائي لحسابي. شكراً لكم!`; | |
| const waUrl = `https://wa.me/${supportNumber}?text=${encodeURIComponent(messageText)}`; | |
| window.open(waUrl, '_blank'); | |
| if (typeof window.addLog === 'function') { | |
| window.addLog("الدعم الفني: تم فتح محادثة الواتساب المباشرة مع خدمة العملاء بنجاح.", 'success'); | |
| } | |
| }; | |
| /** | |
| * ربط أحداث القنوات الفرعية والنسخ وحاسبة العملات | |
| */ | |
| const bindSupportEventListeners = () => { | |
| const chatBtn = document.getElementById('t7zdv53427'); | |
| const idDisplayField = document.getElementById('an7xl5rgcc'); | |
| const copyIdBtn = document.getElementById('zayjah9bha'); | |
| if (chatBtn) chatBtn.onclick = triggerSupportWhatsAppChat; | |
| const handleCopy = () => { | |
| if (!idDisplayField) return; | |
| navigator.clipboard.writeText(idDisplayField.value).then(() => { | |
| if (typeof window.addLog === 'function') { | |
| window.addLog("نسخ آمن: تم نسخ كود الجهاز بنجاح.", 'success'); | |
| } | |
| const originalBg = idDisplayField.style.background; | |
| idDisplayField.style.background = 'var(--success-light)'; | |
| setTimeout(() => { idDisplayField.style.background = originalBg; }, 1500); | |
| if (copyIdBtn) { | |
| const originalHtml = copyIdBtn.innerHTML; | |
| copyIdBtn.innerHTML = '<i class="fa-solid fa-check" style="color:var(--success-hover);"></i> '; | |
| setTimeout(() => { copyIdBtn.innerHTML = originalHtml; }, 1500); | |
| } | |
| }); | |
| }; | |
| if (idDisplayField) idDisplayField.onclick = handleCopy; | |
| if (copyIdBtn) copyIdBtn.onclick = handleCopy; | |
| // 1. ربط حاسبة تحويل العملات | |
| const payCurrencySelect = document.getElementById('nakt4bs0fk'); | |
| const receiveCurrencySelect = document.getElementById('d0iuamglk9'); | |
| const payAmountInput = document.getElementById('rjr8i1f9f3'); | |
| const receiveAmountInput = document.getElementById('ln7azkypv1'); | |
| const refreshRatesBtn = document.getElementById('btn-refresh-live-rates'); | |
| const generateTicketBtn = document.getElementById('btn-generate-purchase-ticket'); | |
| if (payCurrencySelect) { | |
| payCurrencySelect.onchange = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('payment'); | |
| } | |
| }; | |
| } | |
| if (receiveCurrencySelect) { | |
| receiveCurrencySelect.onchange = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('payment'); | |
| } | |
| }; | |
| } | |
| if (payAmountInput) { | |
| payAmountInput.oninput = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('payment'); | |
| } | |
| }; | |
| } | |
| if (receiveAmountInput) { | |
| receiveAmountInput.oninput = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('receive'); | |
| } | |
| }; | |
| } | |
| if (refreshRatesBtn) { | |
| refreshRatesBtn.onclick = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.syncRates(); | |
| } | |
| }; | |
| } | |
| if (generateTicketBtn) { | |
| generateTicketBtn.onclick = () => { | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.generateTicket(); | |
| } | |
| }; | |
| } | |
| // 2. تبديل تبويبات قنوات الدفع | |
| const tabs = document.querySelectorAll('.pfe6btieb6 .n9cqm6ze7d[data-wallet-sub]'); | |
| const validGatewayPaneIds = ['p7clpd6ekl', 'de5zx14cj5', 'io4or4ksqt']; | |
| tabs.forEach(tab => { | |
| tab.addEventListener('click', () => { | |
| const targetPaneId = tab.getAttribute('data-wallet-sub'); | |
| if (!validGatewayPaneIds.includes(targetPaneId)) return; | |
| const siblingTabs = tab.parentNode.querySelectorAll('.n9cqm6ze7d[data-wallet-sub]'); | |
| siblingTabs.forEach(t => t.classList.remove('vn5qn7dmpk')); | |
| tab.classList.add('vn5qn7dmpk'); | |
| const parentGatewaysCard = document.getElementById('j85twrlin1'); | |
| if (parentGatewaysCard) { | |
| const panes = parentGatewaysCard.querySelectorAll('.gitkevh3xv'); | |
| panes.forEach(p => { | |
| if (validGatewayPaneIds.includes(p.id)) { | |
| p.style.display = (p.id === targetPaneId) ? 'block' : 'none'; | |
| } | |
| }); | |
| } | |
| }); | |
| }); | |
| // 3. ربط تبديل العملات في التحويل البنكي | |
| const currencySelect = document.getElementById('guxwjyecsq'); | |
| const bankAccountInput = document.getElementById('jfjeb63r79'); | |
| const syncToCalcBtn = document.getElementById('cs0slpgdna'); | |
| if (currencySelect && bankAccountInput) { | |
| currencySelect.onchange = async (e) => { | |
| const selected = e.target.value; | |
| const accounts = global.FritreeBankingConfig?.BANK_ACCOUNTS || {}; | |
| if (accounts[selected]) { | |
| bankAccountInput.value = accounts[selected]; | |
| if (payCurrencySelect) { | |
| payCurrencySelect.value = selected; | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('payment'); | |
| } | |
| } | |
| } | |
| }; | |
| } | |
| if (syncToCalcBtn && currencySelect) { | |
| syncToCalcBtn.onclick = () => { | |
| const selectedCurr = currencySelect.value; | |
| if (payCurrencySelect) { | |
| payCurrencySelect.value = selectedCurr; | |
| if (global.FritreeExchangeRatesService) { | |
| global.FritreeExchangeRatesService.calculateCurrencies('payment'); | |
| } | |
| } | |
| const calcCard = document.getElementById('p266i7uuqq'); | |
| if (calcCard) { | |
| calcCard.scrollIntoView({ behavior: 'smooth', block: 'center' }); | |
| calcCard.style.outline = '2px solid var(--primary)'; | |
| setTimeout(() => { calcCard.style.outline = 'none'; }, 2000); | |
| } | |
| }; | |
| } | |
| // 4. أزرار نسخ معلومات الدفع | |
| const bindCopyBtn = (btnId, inputId, labelNameAr) => { | |
| const btn = document.getElementById(btnId); | |
| const input = document.getElementById(inputId); | |
| if (btn && input) { | |
| btn.onclick = () => { | |
| navigator.clipboard.writeText(input.value).then(() => { | |
| const originalHtml = btn.innerHTML; | |
| btn.innerHTML = '<i class="fa-solid fa-check" style="color:var(--success-hover);"></i> '; | |
| if (typeof window.addLog === 'function') { | |
| window.addLog(`نسخ آمن: تم نسخ معلومات التحويل الخاصة بـ [${labelNameAr}] بنجاح.`, "success"); | |
| } | |
| setTimeout(() => { btn.innerHTML = originalHtml; }, 2000); | |
| }); | |
| }; | |
| } | |
| }; | |
| bindCopyBtn('ucfq23zy85', 'jfjeb63r79', "البنك التجاري الدولي CIB"); | |
| bindCopyBtn('teay3xy449', 'ng4bw51trj', "عنوان إنستاباي"); | |
| bindCopyBtn('bsx15xd744', 'ta0fqz0p8e', "محفظة فودافون كاش"); | |
| }; | |
| /** | |
| * تهيئة وحدة الدعم الفني والحاسبة | |
| */ | |
| const initSupport = async () => { | |
| const sidebar = document.getElementById('bmh59axx92'); | |
| const mainContentArea = document.getElementById('s7ihkirolg'); | |
| if (!sidebar || !mainContentArea) return false; | |
| buildSupportLayout(); | |
| await updateWorkspaceIDDisplay(); | |
| bindSupportEventListeners(); | |
| if (global.FritreeExchangeRatesService && typeof global.FritreeExchangeRatesService.syncRates === 'function') { | |
| global.FritreeExchangeRatesService.syncRates(); | |
| } | |
| return true; | |
| }; | |
| /** | |
| * تصدير وحدة واجهة الدعم الفني | |
| */ | |
| global.FritreeSupportUI = { | |
| init: initSupport, | |
| triggerSupportChat: triggerSupportWhatsAppChat, | |
| updateIDDisplay: updateWorkspaceIDDisplay, | |
| calculateSignature: calculateSupportSignature | |
| }; | |
| global.FritreeHelpdesk = global.FritreeSupportUI; | |
| global.FritreePaymentGateways = global.FritreeSupportUI; | |
| if (typeof document !== 'undefined') { | |
| if (!initSupport()) { | |
| document.addEventListener('DOMContentLoaded', initSupport); | |
| window.addEventListener('load', initSupport); | |
| } | |
| } | |
| })(typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : this); |