<title>تقييم الخدمة - Taqyeemy</title>
<style>
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f4f7f6; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; }
.card { background: white; padding: 40px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); text-align: center; max-width: 400px; width: 90%; }
h2 { color: #333; margin-bottom: 5px; }
p { color: #777; margin-bottom: 25px; }
.stars { display: flex; justify-content: center; gap: 15px; direction: ltr; margin-bottom: 25px; cursor: pointer; }
.star { font-size: 45px; transition: 0.2s; }
.star:hover { transform: scale(1.3); }
#complaint-box { display: none; margin-top: 20px; }
textarea { width: 100%; padding: 10px; border-radius: 10px; border: 1px solid #ddd; resize: vertical; }
button { background: #4CAF50; color: white; border: none; padding: 12px 30px; border-radius: 30px; font-size: 18px; cursor: pointer; margin-top: 15px; width: 100%; }
button:hover { background: #45a049; }
.hidden { display: none; }
#thank-you { display: none; color: green; font-weight: bold; margin-top: 20px; }
</style>
ما رأيك في خدمتنا؟
تقييمك يهمنا ويساعدنا على التحسن دائماً
<div class="stars" id="stars-container">
<span class="star" data-value="1">⭐</span>
<span class="star" data-value="2">⭐</span>
<span class="star" data-value="3">⭐</span>
<span class="star" data-value="4">⭐</span>
<span class="star" data-value="5">⭐</span>
</div>
<div id="complaint-box">
<p style="color: #d32f2f; font-weight: bold;">نعتذر بشدة عن أي إزعاج!</p>
<p>مديرنا يريد التواصل معك شخصياً لحل المشكلة فوراً. من فضلك اترك تعليقك وسنتصل بك.</p>
<textarea id="complaint-text" rows="3" placeholder="اكتب شكواك هنا..."></textarea>
<button onclick="submitComplaint()">إرسال الشكوى للمدير</button>
</div>
<div id="thank-you">
<p>شكراً جزيلاً لتقييمك الرائع! 🎉</p>
<p>سنسعد جداً لو شاركت تجربتك على جوجل أيضاً.</p>
<button onclick="goToGoogleReview()">تقييمنا على جوجل</button>
</div>
<script>
const businessName = "مطعم القصر"; // هذا يتغير حسب العميل
const googleReviewLink = "https://g.page/r/XXXXX/review"; // هذا رابط تقييم جوجل الخاص بالعميل
document.querySelectorAll('.star').forEach(star => {
star.addEventListener('click', function() {
let rating = this.getAttribute('data-value');
handleRating(rating);
});
});
function handleRating(rating) {
if (rating >= 4) {
// تقييم إيجابي -> إظهار الشكر وتوجيهه لجوجل
document.getElementById('thank-you').style.display = 'block';
document.getElementById('complaint-box').style.display = 'none';
document.getElementById('stars-container').style.display = 'none';
// هنا في الخلفية نسجل التقييم الإيجابي في قاعدة البيانات
console.log('تقييم إيجابي: ' + rating + ' نجوم');
} else {
// تقييم سلبي -> إظهار صندوق الشكوى وحجبه عن جوجل
document.getElementById('complaint-box').style.display = 'block';
document.getElementById('stars-container').style.display = 'none';
document.getElementById('thank-you').style.display = 'none';
}
}
function submitComplaint() {
let complaint = document.getElementById('complaint-text').value;
if (complaint.trim() === '') {
alert('من فضلك اكتب شكواك.');
return;
}
// هنا في الخلفية نرسل الشكوى لصاحب النشاط
console.log('شكوى واردة: ' + complaint);
document.getElementById('complaint-box').innerHTML = '
تم إرسال شكواك بنجاح. سيتصل بك المدير قريباً جداً. شكراً لصبرك!
';
}
function goToGoogleReview() {
window.open(googleReviewLink, '_blank');
}
</script>
ما رأيك في خدمتنا؟
تقييمك يهمنا ويساعدنا على التحسن دائماً
تم إرسال شكواك بنجاح. سيتصل بك المدير قريباً جداً. شكراً لصبرك!
'; } function goToGoogleReview() { window.open(googleReviewLink, '_blank'); } </script>