|
<!DOCTYPE html> |
|
<html lang="ar" dir="rtl"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>نظام المقارنة والترجمة الخاص بشركة موندو لينجوا</title> |
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel="stylesheet"> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/mammoth/1.6.0/mammoth.browser.min.js"></script> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> |
|
<style> |
|
@keyframes gradient { |
|
0% { background-position: 0% 50%; } |
|
50% { background-position: 100% 50%; } |
|
100% { background-position: 0% 50%; } |
|
} |
|
.animate-gradient { |
|
background-size: 200% 200%; |
|
animation: gradient 15s ease infinite; |
|
} |
|
.transition-all { transition: all 0.3s ease-in-out; } |
|
.animate-scale { transition: transform 0.2s ease-in-out; } |
|
.animate-scale:hover { transform: scale(1.02); } |
|
.file-drop-active { border-color: #3B82F6; background-color: rgba(59,130,246,0.1); } |
|
.text-comparison { line-height: 1.8; white-space: pre-wrap; } |
|
|
|
.highlight-number { |
|
background-color: #FDE68A; |
|
padding: 0 2px; |
|
border-radius: 2px; |
|
} |
|
|
|
.highlight-missing { |
|
background-color: #BFDBFE; |
|
padding: 0 2px; |
|
border-radius: 2px; |
|
} |
|
|
|
.highlight-meaning { |
|
color: #EF4444; |
|
font-weight: bold; |
|
} |
|
|
|
.split-view { |
|
display: grid; |
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); |
|
gap: 1rem; |
|
} |
|
.result-section { |
|
border-top: 3px solid #E0E7FF; |
|
margin-top: 2rem; |
|
padding-top: 2rem; |
|
} |
|
|
|
.line-item { |
|
display: flex; |
|
align-items: flex-start; |
|
margin-bottom: 0.5rem; |
|
} |
|
.line-number { |
|
width: 30px; |
|
font-weight: bold; |
|
color: #4B5563; |
|
flex-shrink: 0; |
|
} |
|
.line-text { |
|
flex: 1; |
|
} |
|
|
|
.card-hover { |
|
transition: all 0.3s ease; |
|
} |
|
.card-hover:hover { |
|
box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1), 0 10px 10px -5px rgba(59, 130, 246, 0.04); |
|
transform: translateY(-2px); |
|
} |
|
.pulse-animation { |
|
animation: pulse 2s infinite; |
|
} |
|
@keyframes pulse { |
|
0% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4); } |
|
70% { box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); } |
|
100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); } |
|
} |
|
</style> |
|
</head> |
|
<body class="bg-gradient-to-br from-gray-50 via-blue-50 to-indigo-50 min-h-screen"> |
|
<div class="min-h-screen pb-12"> |
|
|
|
<header class="bg-gradient-to-r from-blue-600 via-indigo-600 to-purple-600 animate-gradient text-white py-10 mb-10 shadow-xl"> |
|
<div class="max-w-6xl mx-auto px-4"> |
|
<h1 class="text-5xl font-bold text-center mb-4 animate-scale">نظام شركة موندو لينجوا</h1> |
|
<p class="text-center text-xl text-blue-100 opacity-90">مقارنة وتحليل النصوص – المصدر مرجع أساسي</p> |
|
</div> |
|
</header> |
|
|
|
|
|
<main class="max-w-6xl mx-auto px-4"> |
|
|
|
<div class="bg-white rounded-2xl shadow-lg p-8 border border-gray-100 hover:shadow-xl transition-all animate-scale mb-8 card-hover"> |
|
<h2 class="text-2xl font-bold mb-6 text-gray-800 flex items-center border-b pb-3"> |
|
<i class="fas fa-file-upload text-blue-600 ml-2"></i> تحميل الملفات |
|
</h2> |
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
|
<div class="group border-2 border-dashed border-blue-200 rounded-xl p-8 text-center hover:border-blue-500 transition-colors duration-300 bg-blue-50 hover:bg-blue-100"> |
|
<label class="cursor-pointer block"> |
|
<input type="file" id="sourceFile" accept=".docx,.pdf" class="hidden"> |
|
<i class="fas fa-file-upload text-5xl text-blue-500 mb-4"></i> |
|
<span class="text-lg text-blue-600 group-hover:text-blue-700">ملف السورس</span> |
|
</label> |
|
</div> |
|
|
|
<div class="group border-2 border-dashed border-purple-200 rounded-xl p-8 text-center hover:border-purple-500 transition-colors duration-300 bg-purple-50 hover:bg-purple-100"> |
|
<label class="cursor-pointer block"> |
|
<input type="file" id="targetFile" accept=".docx,.pdf" class="hidden"> |
|
<i class="fas fa-file-download text-5xl text-purple-500 mb-4"></i> |
|
<span class="text-lg text-purple-600 group-hover:text-purple-700">ملف التارجت</span> |
|
</label> |
|
</div> |
|
</div> |
|
<div id="processStatus" class="hidden mt-4"> |
|
<div class="flex items-center justify-center space-x-3 bg-blue-100 rounded-xl p-4"> |
|
<div class="animate-spin h-8 w-8 border-4 border-blue-600 rounded-full border-t-transparent"></div> |
|
<span class="text-lg text-blue-700">جارٍ معالجة الملف...</span> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="bg-white rounded-2xl shadow-lg p-8 border border-gray-100 hover:shadow-xl transition-all animate-scale mb-8 card-hover"> |
|
<div class="space-y-6"> |
|
|
|
<div class="group"> |
|
<label class="block text-lg font-bold text-gray-700 mb-3 flex items-center"> |
|
<i class="fas fa-language text-blue-600 ml-2"></i> النص المصدر |
|
</label> |
|
<textarea id="sourceText" dir="rtl" class="w-full px-6 py-4 border-2 border-gray-200 rounded-xl focus:ring-blue-200 focus:border-blue-400 transition-all resize-none text-lg" rows="6" placeholder="اكتب النص المصدر هنا..."></textarea> |
|
</div> |
|
|
|
<div class="group"> |
|
<label class="block text-lg font-bold text-gray-700 mb-3 flex items-center"> |
|
<i class="fas fa-language text-purple-600 ml-2"></i> النص الهدف |
|
</label> |
|
<textarea id="targetText" dir="ltr" class="w-full px-6 py-4 border-2 border-gray-200 rounded-xl focus:ring-purple-200 focus:border-purple-400 transition-all resize-none text-lg" rows="6" placeholder="اكتب النص الهدف هنا..."></textarea> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<button id="submitBtn" class="w-full bg-gradient-to-r from-blue-600 to-purple-600 hover:from-blue-700 hover:to-purple-700 text-white font-bold py-5 px-8 rounded-xl transition-all transform hover:scale-105 focus:ring-blue-200 text-xl shadow-lg hover:shadow-xl mb-8 pulse-animation"> |
|
<div class="flex items-center justify-center"> |
|
<i class="fas fa-sync-alt ml-2"></i> تحليل النصوص |
|
</div> |
|
</button> |
|
|
|
|
|
<div id="resultSection" class="bg-white rounded-2xl shadow-lg p-8 border border-gray-100 hover:shadow-xl transition-all animate-scale mb-8 hidden card-hover"> |
|
<h2 class="text-2xl font-bold mb-6 text-gray-800 border-b pb-3 flex items-center"> |
|
<i class="fas fa-search text-green-600 ml-2"></i> نتائج التحليل والمقارنة |
|
</h2> |
|
|
|
<div id="errorsList" class="space-y-3 mb-6"></div> |
|
<div class="result-section split-view"> |
|
|
|
<div> |
|
<h4 class="text-lg font-bold text-gray-700 mb-3 flex items-center"> |
|
<i class="fas fa-file-alt text-blue-600 ml-2"></i> النص المصدر (مع التعليم) |
|
</h4> |
|
<div id="sourceTextReview" class="bg-blue-50 rounded-xl p-6 min-h-[200px] border-2 border-blue-100 text-comparison"></div> |
|
</div> |
|
|
|
<div> |
|
<h4 class="text-lg font-bold text-gray-700 mb-3 flex items-center"> |
|
<i class="fas fa-file-alt text-purple-600 ml-2"></i> النص الهدف (مع التعليم) |
|
</h4> |
|
<div id="targetTextReview" class="bg-gray-50 rounded-xl p-6 min-h-[200px] border-2 border-gray-200 text-comparison"></div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div id="explanationBox" class="bg-white rounded-2xl shadow-lg p-8 border border-gray-100 hover:shadow-xl transition-all animate-scale mb-8 hidden card-hover"> |
|
<h2 class="text-2xl font-bold mb-6 text-gray-800 border-b pb-3 flex items-center"> |
|
<i class="fas fa-info-circle text-green-600 ml-2"></i> شرح الاختلافات |
|
</h2> |
|
<div id="explanationText" class="text-lg text-gray-700"></div> |
|
</div> |
|
</main> |
|
</div> |
|
|
|
|
|
<script> |
|
|
|
const API_URL = 'https://api.deepseek.com/chat/completions'; |
|
const API_KEY = 'sk-15606736ed9e4aea8b7cc11a195d2b01'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const ANALYSIS_PROMPT = `أنت خبير لغوي متخصص في مراجعة الترجمة التقنية ، مهمتك مقارنة النص المصدر والنص الهدف بدقة ميكروسكوبية، وتحديد فقط الاختلافات التالية باستخدام التنسيقات المحددة. لا تفترض أن النص الهدف صحيح إلا إذا تطابق حرفيًّا مع المصدر. |
|
|
|
أنواع الاختلافات: |
|
اختلافات الأرقام : |
|
قارن جميع الأرقام (عادية، عشرية، نسب مئوية، تواريخ، أرقام مكتوبة بالكلمات). |
|
سجل الاختلافات بين علامتي < و > مع إظهار القيمة في المصدر والهدف مفصولة بسهم (→). |
|
تجاهل اختلافات التنسيق (مثل الفواصل) إلا إذا غيرت القيمة. |
|
النصوص المفقودة : |
|
استخرج أي جزء موجود في المصدر ومخالف أو مفقود في الهدف (جمل، أجزاء جمل، كلمات فنية). |
|
ضع النص المفقود بين شرطتين سفليتين __...__ كما ورد حرفيًّا في المصدر. |
|
اختلافات المعنى : |
|
ركز على الاختلافات التي تؤثر على الدقة الفنية، السياق، أو المنطق. |
|
ضع النصين المختلفين بين علامتي [MEANING]...[/MEANING] مع توضيح النسخة المصدر والهدف. |
|
آلية المراجعة: |
|
مسح الأرقام : |
|
افحص كل رقم في النصين وقارنه زوجيًّا، حتى لو اختلفت صيغة كتابته (مثال: <2023> → <٢٠٢٤>). |
|
التحليل السياقي : |
|
قسم النصين إلى وحدات متناسقة وقارنها جانبًا إلى جانب. |
|
استخدم "الظل السياقي" لتحديد الأجزاء المفقودة أو المضافة. |
|
التحقق الدلالي : |
|
حلل كل كلمة/عبارة في السياق الأوسع: |
|
الدقة الفنية (مثال: "الواجهة الخلفية" vs "الواجهة الأمامية"). |
|
التناقضات المنطقية (مثال: "يُسمح" vs "ممنوع"). |
|
تجاهل المرادفات غير المؤثرة (مثل: "بدأ" vs "انطلق"). |
|
المراجعة التكرارية : |
|
افحص النص 7 مرات بتركيز مختلف في كل مرة: |
|
الأرقام. |
|
النصوص المفقودة. |
|
التغييرات الدلالية. |
|
التناقضات المنطقية. |
|
الأخطاء الإملائية. |
|
التنسيق. |
|
الإضافات غير المرتبطة. |
|
هيكلة النتائج: |
|
🟢 1. ناتج الأرقام : |
|
<القيمة_في_المصدر> → <القيمة_في_الهدف> |
|
|
|
🟢 2. ناتج النصوص : |
|
|
|
النصوص المفقودة : |
|
__"النص_الحرفي_من_المصدر"__ |
|
الاختلافات الدلالية : |
|
[MEANING]الكلمة_في_المصدر[/MEANING] → [MEANING]الكلمة_في_الهدف[/MEANING] |
|
🟢 3. المحتوى المُظَلَّل : |
|
|
|
أظهر الاختلافات في سياق النص الهدف مع الإشارات: |
|
❌: نص مفقود. |
|
↔: اختلاف دلالي. |
|
🔢: اختلاف رقم. |
|
|
|
النص المصدر: |
|
{source} |
|
|
|
النص الهدف: |
|
{target}`; |
|
|
|
|
|
function countWords(text) { |
|
return text.trim().split(/\s+/).filter(word => word !== "").length; |
|
} |
|
|
|
|
|
function escapeRegExp(string) { |
|
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); |
|
} |
|
|
|
|
|
function applyHighlights(originalText, analysisOutput) { |
|
let highlightedText = originalText; |
|
|
|
const numberRegex = /<([^<>]+)>/g; |
|
let match; |
|
while ((match = numberRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const replacement = `<span class="highlight-number">${phrase}</span>`; |
|
const phraseRegex = new RegExp(escapeRegExp(phrase), 'g'); |
|
highlightedText = highlightedText.replace(phraseRegex, replacement); |
|
} |
|
} |
|
|
|
const missingRegex = /__(.*?)__/g; |
|
while ((match = missingRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const replacement = `<span class="highlight-missing">__${phrase}__</span>`; |
|
const phraseRegex = new RegExp(escapeRegExp(phrase), 'g'); |
|
highlightedText = highlightedText.replace(phraseRegex, replacement); |
|
} |
|
} |
|
|
|
const meaningRegex = /\[MEANING\](.*?)\[\/MEANING\]/g; |
|
while ((match = meaningRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const replacement = `<span class="highlight-meaning">${phrase}</span>`; |
|
const phraseRegex = new RegExp(escapeRegExp(phrase), 'g'); |
|
highlightedText = highlightedText.replace(phraseRegex, replacement); |
|
} |
|
} |
|
return highlightedText; |
|
} |
|
|
|
|
|
function splitIntoLines(text) { |
|
const lines = text.split('\n'); |
|
let html = ""; |
|
lines.forEach((line, index) => { |
|
html += `<div class="line-item"><span class="line-number">${index + 1}:</span> <span class="line-text">${line}</span></div>`; |
|
}); |
|
return html; |
|
} |
|
|
|
|
|
function getLineNumber(text, substring) { |
|
const index = text.indexOf(substring); |
|
if (index === -1) return "غير محدد"; |
|
return text.substring(0, index).split("\n").length; |
|
} |
|
|
|
|
|
function generateExplanation(sourceText, analysisOutput) { |
|
let explanation = ""; |
|
|
|
const missingRegex = /__(.*?)__/g; |
|
let match; |
|
while ((match = missingRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const lineNum = getLineNumber(sourceText, phrase); |
|
explanation += `<p>في السطر ${lineNum}: النص "${phrase}" مفقود في النص الهدف.</p>`; |
|
} |
|
} |
|
|
|
const numberRegex = /<([^<>]+)>/g; |
|
while ((match = numberRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const lineNum = getLineNumber(sourceText, phrase); |
|
explanation += `<p>في السطر ${lineNum}: اختلاف في الرقم "${phrase}".</p>`; |
|
} |
|
} |
|
|
|
const meaningRegex = /\[MEANING\](.*?)\[\/MEANING\]/g; |
|
while ((match = meaningRegex.exec(analysisOutput)) !== null) { |
|
const phrase = match[1].trim(); |
|
if (phrase) { |
|
const lineNum = getLineNumber(sourceText, phrase); |
|
explanation += `<p>في السطر ${lineNum}: اختلاف في المعنى: "${phrase}".</p>`; |
|
} |
|
} |
|
if (explanation === "") { |
|
explanation = `<p>[MATCH] النصوص متطابقة تماماً.</p>`; |
|
} |
|
return explanation; |
|
} |
|
|
|
|
|
async function processFile(file) { |
|
let text = ""; |
|
if (file.type === 'application/pdf') { |
|
const form = new FormData(); |
|
form.append('image', file); |
|
const response = await fetch('https://demo.api4ai.cloud/ocr/v1/results', { |
|
method: 'POST', |
|
body: form, |
|
headers: { 'A4A-CLIENT-APP-ID': 'sample' } |
|
}); |
|
const data = await response.json(); |
|
text = data.results[0].entities[0].objects[0].entities[0].text; |
|
} else if (file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') { |
|
const arrayBuffer = await file.arrayBuffer(); |
|
const result = await mammoth.extractRawText({ arrayBuffer }); |
|
text = result.value; |
|
} else { |
|
throw new Error('نوع الملف غير مدعوم'); |
|
} |
|
return text; |
|
} |
|
|
|
|
|
document.getElementById('sourceFile')?.addEventListener('change', async (event) => { |
|
const file = event.target.files[0]; |
|
if (!file) return; |
|
document.getElementById('processStatus').classList.remove('hidden'); |
|
try { |
|
const text = await processFile(file); |
|
document.getElementById('sourceText').value = text; |
|
} catch (error) { |
|
console.error('Error processing source file:', error); |
|
addError('خطأ في معالجة ملف السورس'); |
|
} finally { |
|
document.getElementById('processStatus').classList.add('hidden'); |
|
} |
|
}); |
|
|
|
|
|
document.getElementById('targetFile')?.addEventListener('change', async (event) => { |
|
const file = event.target.files[0]; |
|
if (!file) return; |
|
document.getElementById('processStatus').classList.remove('hidden'); |
|
try { |
|
const text = await processFile(file); |
|
document.getElementById('targetText').value = text; |
|
} catch (error) { |
|
console.error('Error processing target file:', error); |
|
addError('خطأ في معالجة ملف التارجت'); |
|
} finally { |
|
document.getElementById('processStatus').classList.add('hidden'); |
|
} |
|
}); |
|
|
|
|
|
function addError(message, type = 'error') { |
|
const errorsList = document.getElementById('errorsList'); |
|
if (!errorsList) return; |
|
const errorDiv = document.createElement('div'); |
|
errorDiv.className = `p-4 rounded-xl ${type === 'error' ? 'bg-red-50 text-red-700' : 'bg-yellow-50 text-yellow-700'}`; |
|
errorDiv.innerHTML = `<div class="flex items-center"> |
|
<i class="fas fa-${type === 'error' ? 'exclamation-circle' : 'info-circle'} ml-2 text-${type === 'error' ? 'red' : 'yellow'}-500"></i> |
|
<span>${message}</span> |
|
</div>`; |
|
errorsList.appendChild(errorDiv); |
|
} |
|
|
|
|
|
document.getElementById('submitBtn').addEventListener('click', async () => { |
|
const sourceText = document.getElementById('sourceText').value; |
|
const targetText = document.getElementById('targetText').value; |
|
|
|
|
|
document.getElementById('errorsList').innerHTML = ''; |
|
document.getElementById('resultSection').classList.remove('hidden'); |
|
document.getElementById('explanationBox').classList.remove('hidden'); |
|
|
|
if (!sourceText || !targetText) { |
|
addError('يرجى إدخال كلا النصين المصدر والهدف'); |
|
return; |
|
} |
|
|
|
|
|
const sourceWordCount = countWords(sourceText); |
|
const targetWordCount = countWords(targetText); |
|
if (sourceWordCount !== targetWordCount) { |
|
addError(`عدد كلمات النص المصدر (${sourceWordCount}) يختلف عن النص الهدف (${targetWordCount})`, 'warning'); |
|
} |
|
|
|
try { |
|
|
|
const progressDiv = document.createElement('div'); |
|
progressDiv.className = "bg-blue-100 p-4 rounded-xl mb-4"; |
|
progressDiv.innerHTML = `<div class="flex items-center"> |
|
<div class="animate-spin h-6 w-6 border-4 border-blue-600 rounded-full border-t-transparent ml-3"></div> |
|
<span>جارٍ التحليل...</span> |
|
</div>`; |
|
document.getElementById('errorsList').appendChild(progressDiv); |
|
|
|
|
|
const prompt = ANALYSIS_PROMPT |
|
.replace("{source}", sourceText) |
|
.replace("{target}", targetText); |
|
|
|
|
|
const payload = { |
|
model: "deepseek-chat", |
|
messages: [ |
|
{ role: "system", content: "أنت خبير في تحليل النصوص ومقارنتها بدقة عالية." }, |
|
{ role: "user", content: prompt } |
|
], |
|
temperature: 0.3, |
|
max_tokens: 2048, |
|
stream: false |
|
}; |
|
|
|
|
|
const response = await fetch(API_URL, { |
|
method: 'POST', |
|
headers: { |
|
'Authorization': 'Bearer ' + API_KEY, |
|
'Content-Type': 'application/json' |
|
}, |
|
body: JSON.stringify(payload) |
|
}); |
|
|
|
if (!response.ok) { |
|
throw new Error('حدث خطأ بالشبكة: ' + response.statusText); |
|
} |
|
|
|
const data = await response.json(); |
|
const analysisOutput = data.choices[0].message.content.trim(); |
|
|
|
progressDiv.remove(); |
|
|
|
if (analysisOutput.includes('[MATCH]')) { |
|
const checkDiv = document.createElement('div'); |
|
checkDiv.className = "p-4 rounded-xl bg-green-50 text-green-700 flex items-center"; |
|
checkDiv.innerHTML = `<i class="fas fa-check-circle ml-2 text-lg"></i> <span class="text-lg">النصوص متطابقة تماماً</span>`; |
|
document.getElementById('errorsList').appendChild(checkDiv); |
|
document.getElementById('sourceTextReview').innerHTML = splitIntoLines(sourceText); |
|
document.getElementById('targetTextReview').innerHTML = splitIntoLines(targetText); |
|
document.getElementById('explanationText').innerHTML = `<p>[MATCH] لا توجد اختلافات.</p>`; |
|
} else { |
|
const sourceHighlighted = applyHighlights(sourceText, analysisOutput); |
|
const targetHighlighted = applyHighlights(targetText, analysisOutput); |
|
|
|
document.getElementById('sourceTextReview').innerHTML = splitIntoLines(sourceHighlighted); |
|
document.getElementById('targetTextReview').innerHTML = splitIntoLines(targetHighlighted); |
|
|
|
|
|
const explanationHTML = generateExplanation(sourceText, analysisOutput); |
|
document.getElementById('explanationText').innerHTML = explanationHTML; |
|
|
|
|
|
const numDiffCount = (analysisOutput.match(/<([^<>]+)>/g) || []).length; |
|
const missingDiffCount = (analysisOutput.match(/__(.*?)__/g) || []).length; |
|
const meaningDiffCount = (analysisOutput.match(/\[MEANING\](.*?)\[\/MEANING\]/g) || []).length; |
|
if (numDiffCount > 0 || missingDiffCount > 0 || meaningDiffCount > 0) { |
|
const summaryDiv = document.createElement('div'); |
|
summaryDiv.className = "p-4 rounded-xl bg-yellow-50 text-gray-800"; |
|
let summaryText = '<div class="font-bold mb-2">ملخص الاختلافات:</div><ul class="list-disc mr-6 space-y-1">'; |
|
if (numDiffCount > 0) summaryText += `<li>اختلاف في الأرقام: ${numDiffCount}</li>`; |
|
if (missingDiffCount > 0) summaryText += `<li>نصوص مفقودة: ${missingDiffCount}</li>`; |
|
if (meaningDiffCount > 0) summaryText += `<li>اختلاف في المعنى: ${meaningDiffCount}</li>`; |
|
summaryText += '</ul>'; |
|
summaryDiv.innerHTML = summaryText; |
|
document.getElementById('errorsList').appendChild(summaryDiv); |
|
} |
|
} |
|
|
|
} catch (error) { |
|
document.getElementById('errorsList').innerHTML = ''; |
|
addError(`خطأ في التحليل: ${error.message}`); |
|
} |
|
}); |
|
</script> |
|
</body> |
|
</html> |
