מצורפת דוגמא למערכת ניהול תחרויות בין שגרירות
<!DOCTYPE html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>🏆 מערכת ניהול תחרויות משפיעניות</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
padding: 20px;
}
.contests-container {
max-width: 1400px;
margin: 0 auto;
background: white;
border-radius: 20px;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
/* Header */
.contests-header {
background: linear-gradient(135deg, #8B4513 0%, #DAA520 50%, #FFD700 100%);
color: white;
padding: 30px;
text-align: center;
}
.contests-header h1 {
font-size: 2.5rem;
margin-bottom: 10px;
}
/* Navigation Tabs */
.contest-nav {
display: flex;
background: #f8fafc;
border-bottom: 2px solid #e2e8f0;
flex-wrap: wrap;
}
.contest-tab {
padding: 15px 25px;
background: #f1f5f9;
border: none;
cursor: pointer;
font-size: 1rem;
font-weight: 600;
color: #64748b;
transition: all 0.3s ease;
flex: 1;
min-width: 150px;
}
.contest-tab:hover {
background: #e2e8f0;
color: #1e293b;
}
.contest-tab.active {
background: linear-gradient(135deg, #8B4513, #DAA520);
color: white;
}
/* Content Area */
.contest-content {
padding: 30px;
min-height: 600px;
}
.tab-content {
display: none;
animation: fadeIn 0.5s ease;
}
.tab-content.active {
display: block;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
/* Active Contest Section */
.active-contest {
background: linear-gradient(135deg, #1e293b, #334155);
color: white;
padding: 25px;
border-radius: 15px;
margin-bottom: 30px;
position: relative;
overflow: hidden;
}
.active-contest::before {
content: ";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #FFD700, #DAA520, #FFD700);
}
.contest-info-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
margin-bottom: 20px;
}
.contest-stat {
text-align: center;
padding: 15px;
background: rgba(255, 255, 255, 0.1);
border-radius: 10px;
border: 1px solid rgba(255, 215, 0, 0.3);
}
.contest-stat h3 {
font-size: 1.8rem;
margin-bottom: 5px;
color: #FFD700;
}
.contest-stat p {
opacity: 0.9;
font-size: 0.9rem;
}
/* Participants Leaderboard */
.leaderboard {
background: white;
border-radius: 15px;
padding: 25px;
margin: 20px 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.leaderboard h3 {
color: #8B4513;
margin-bottom: 20px;
font-size: 1.5rem;
display: flex;
align-items: center;
gap: 10px;
}
.participant-card {
display: grid;
grid-template-columns: 50px 1fr auto 120px;
align-items: center;
padding: 15px;
margin: 10px 0;
background: #f8fafc;
border-radius: 12px;
border-right: 4px solid #e2e8f0;
transition: all 0.3s ease;
}
.participant-card:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}
.participant-card.rank-1 {
border-right-color: #FFD700;
background: linear-gradient(90deg, #fffbeb, #f8fafc);
}
.participant-card.rank-2 {
border-right-color: #C0C0C0;
background: linear-gradient(90deg, #f1f5f9, #f8fafc);
}
.participant-card.rank-3 {
border-right-color: #CD7F32;
background: linear-gradient(90deg, #fef7f0, #f8fafc);
}
.rank-badge {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
font-size: 1.2rem;
}
.rank-1 .rank-badge {
background: #FFD700;
color: #8B4513;
}
.rank-2 .rank-badge {
background: #C0C0C0;
color: #4a5568;
}
.rank-3 .rank-badge {
background: #CD7F32;
color: white;
}
.rank-badge.other {
background: #e2e8f0;
color: #64748b;
}
.participant-info h4 {
font-size: 1.1rem;
margin-bottom: 5px;
color: #1e293b;
}
.participant-info p {
font-size: 0.9rem;
color: #64748b;
}
.participant-progress {
text-align: center;
}
.progress-number {
font-size: 1.4rem;
font-weight: bold;
color: #059669;
}
.progress-label {
font-size: 0.8rem;
color: #64748b;
}
.participant-actions {
display: flex;
gap: 8px;
flex-wrap: wrap;
}
.action-btn {
padding: 6px 12px;
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 0.8rem;
transition: all 0.3s ease;
}
.btn-view {
background: #3b82f6;
color: white;
}
.btn-edit {
background: #f59e0b;
color: white;
}
.btn-message {
background: #10b981;
color: white;
}
/* Activity Tracking */
.activity-tracker {
background: white;
border-radius: 15px;
padding: 25px;
margin: 20px 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.activity-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.activity-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 20px;
}
.influencer-activities {
background: #f8fafc;
padding: 20px;
border-radius: 12px;
border: 1px solid #e2e8f0;
}
.influencer-header {
display: flex;
align-items: center;
gap: 15px;
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid #e2e8f0;
}
.influencer-avatar {
width: 50px;
height: 50px;
border-radius: 50%;
background: linear-gradient(135deg, #8B4513, #DAA520);
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
font-size: 1.2rem;
}
.influencer-details h4 {
color: #1e293b;
margin-bottom: 5px;
}
.influencer-details p {
color: #64748b;
font-size: 0.9rem;
}
.activities-list {
margin: 15px 0;
}
.activity-item {
display: flex;
align-items: center;
gap: 12px;
padding: 12px;
margin: 8px 0;
background: white;
border-radius: 8px;
border: 1px solid #e2e8f0;
transition: all 0.3s ease;
}
.activity-item:hover {
border-color: #DAA520;
box-shadow: 0 2px 8px rgba(218, 165, 32, 0.2);
}
.activity-checkbox {
width: 20px;
height: 20px;
border: 2px solid #e2e8f0;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
}
.activity-checkbox.checked {
background: #10b981;
border-color: #10b981;
}
.activity-checkbox.checked::after {
content: '✓';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-weight: bold;
font-size: 12px;
}
.activity-details {
flex: 1;
}
.activity-title {
font-weight: 600;
color: #1e293b;
margin-bottom: 4px;
}
.activity-description {
font-size: 0.85rem;
color: #64748b;
}
.activity-points {
background: #fef3c7;
color: #d97706;
padding: 4px 8px;
border-radius: 4px;
font-size: 0.8rem;
font-weight: 600;
}
/* Contest Creation Form */
.contest-form {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.form-section {
margin-bottom: 30px;
padding: 20px;
border: 1px solid #e2e8f0;
border-radius: 12px;
}
.form-section h3 {
color: #8B4513;
margin-bottom: 15px;
font-size: 1.3rem;
display: flex;
align-items: center;
gap: 10px;
}
.form-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;
margin: 15px 0;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: 600;
color: #374151;
}
.form-input {
width: 100%;
padding: 12px;
border: 2px solid #e2e8f0;
border-radius: 8px;
font-size: 1rem;
transition: border-color 0.3s ease;
}
.form-input:focus {
border-color: #DAA520;
outline: none;
}
.form-textarea {
min-height: 100px;
resize: vertical;
}
.checkbox-group {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 10px;
margin: 15px 0;
}
.checkbox-item {
display: flex;
align-items: center;
gap: 8px;
padding: 10px;
background: #f8fafc;
border-radius: 6px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.checkbox-item:hover {
background: #e2e8f0;
}
.checkbox-item input[type="checkbox"] {
width: 18px;
height: 18px;
}
/* Action Buttons */
.action-buttons {
display: flex;
gap: 15px;
justify-content: flex-end;
margin-top: 30px;
flex-wrap: wrap;
}
.btn {
padding: 12px 25px;
border: none;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
font-size: 1rem;
}
.btn-primary {
background: linear-gradient(135deg, #8B4513, #DAA520);
color: white;
}
.btn-primary:hover {
background: linear-gradient(135deg, #7a3a0e, #b8860b);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(139, 69, 19, 0.3);
}
.btn-secondary {
background: #6b7280;
color: white;
}
.btn-secondary:hover {
background: #4b5563;
}
/* Responsive */
@media (max-width: 768px) {
.contest-nav {
flex-direction: column;
}
.contest-content {
padding: 15px;
}
.contest-info-grid {
grid-template-columns: 1fr;
}
.participant-card {
grid-template-columns: 1fr;
gap: 10px;
text-align: center;
}
.form-row {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<div class="contests-container">
<!– Header –>
<div class="contests-header">
<h1>🏆 ניהול תחרויות משפיעניות</h1>
<p>מערכת מקיפה לניהול ומעקב תחרויות משפיעניות ברשתות חברתיות</p>
</div>
<!– Navigation Tabs –>
<div class="contest-nav">
<button class="contest-tab active" onclick="showTab('active-contests')">🏃♀️ תחרויות פעילות</button>
<button class="contest-tab" onclick="showTab('create-contest')">🆕 תחרות חדשה</button>
<button class="contest-tab" onclick="showTab('track-activities')">📊 מעקב פעילויות</button>
<button class="contest-tab" onclick="showTab('analytics')">📈 אנליטיקה</button>
<button class="contest-tab" onclick="showTab('archive')">🗂️ ארכיון</button>
</div>
<!– Content Area –>
<div class="contest-content">
<!– Active Contests Tab –>
<div id="active-contests" class="tab-content active">
<div class="active-contest">
<div class="contest-info-grid">
<div class="contest-stat">
<h3>HUGS חורף 2025</h3>
<p>תחרות פעילה</p>
</div>
<div class="contest-stat">
<h3>12</h3>
<p>ימים נותרו</p>
</div>
<div class="contest-stat">
<h3>23</h3>
<p>משתתפות</p>
</div>
<div class="contest-stat">
<h3>₪1,200</h3>
<p>סך פרסים</p>
</div>
<div class="contest-stat">
<h3>78%</h3>
<p>הגיעו ליעד</p>
</div>
</div>
</div>
<div class="leaderboard">
<h3>🏆 לוח המובילות</h3>
<div class="participant-card rank-1">
<div class="rank-badge">1</div>
<div class="participant-info">
<h4>@sapir_avisror</h4>
<p>125K עוקבים • אופנה</p>
</div>
<div class="participant-progress">
<div class="progress-number">+287</div>
<div class="progress-label">עוקבים חדשים</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view" onclick="viewParticipant('sapir')">👁️ צפה</button>
<button class="action-btn btn-message" onclick="sendMessage('sapir')">💬 הודעה</button>
</div>
</div>
<div class="participant-card rank-2">
<div class="rank-badge">2</div>
<div class="participant-info">
<h4>@fashion_queen_il</h4>
<p>89K עוקבים • יופי</p>
</div>
<div class="participant-progress">
<div class="progress-number">+234</div>
<div class="progress-label">עוקבים חדשים</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view" onclick="viewParticipant('fashion_queen')">👁️ צפה</button>
<button class="action-btn btn-message" onclick="sendMessage('fashion_queen')">💬 הודעה</button>
</div>
</div>
<div class="participant-card rank-3">
<div class="rank-badge">3</div>
<div class="participant-info">
<h4>@style_guru_tlv</h4>
<p>67K עוקבים • סטייל</p>
</div>
<div class="participant-progress">
<div class="progress-number">+189</div>
<div class="progress-label">עוקבים חדשים</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view" onclick="viewParticipant('style_guru')">👁️ צפה</button>
<button class="action-btn btn-message" onclick="sendMessage('style_guru')">💬 הודעה</button>
</div>
</div>
<div class="participant-card">
<div class="rank-badge other">4</div>
<div class="participant-info">
<h4>@beauty_blogger_22</h4>
<p>45K עוקבים • קוסמטיקה</p>
</div>
<div class="participant-progress">
<div class="progress-number">+156</div>
<div class="progress-label">עוקבים חדשים</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view" onclick="viewParticipant('beauty_blogger')">👁️ צפה</button>
<button class="action-btn btn-message" onclick="sendMessage('beauty_blogger')">💬 הודעה</button>
</div>
</div>
</div>
</div>
<!– Track Activities Tab –>
<div id="track-activities" class="tab-content">
<div class="activity-tracker">
<div class="activity-header">
<h3>📊 מעקב פעילויות יומי</h3>
<div class="action-buttons">
<button class="btn btn-primary" onclick="updateAllActivities()">🔄 עדכן הכל</button>
<button class="btn btn-secondary" onclick="exportActivities()">📥 ייצא</button>
</div>
</div>
<div class="activity-grid">
<!– Sapir Activities –>
<div class="influencer-activities">
<div class="influencer-header">
<div class="influencer-avatar">S</div>
<div class="influencer-details">
<h4>@sapir_avisror</h4>
<p>מקום 1 • +287 עוקבים</p>
</div>
</div>
<div class="activities-list">
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">פוסט הכרזה על התחרות</div>
<div class="activity-description">פרסמה פוסט עם #HUGS_contest</div>
</div>
<div class="activity-points">+50 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">3 סטוריז עם המוצרים</div>
<div class="activity-description">סטוריז איכותיות</div>
</div>
<div class="activity-points">+60 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">הזמינה 8+ עוקבות חדשות</div>
<div class="activity-description">הפנייה אישית</div>
</div>
<div class="activity-points">+80 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">ביקורת מוצר מפורטת</div>
<div class="activity-description">פוסט עם טקסט ותמונות</div>
</div>
<div class="activity-points">+70 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">שיתוף בקבוצות רלוונטיות</div>
<div class="activity-description">שיתוף ב-2+ קבוצות</div>
</div>
<div class="activity-points">+40 נק'</div>
</div>
</div>
<div style="text-align: center; margin-top: 15px;">
<strong>סה"כ נקודות: 110/360</strong>
</div>
</div>
</div>
</div>
</div>
<!– Create Contest Tab –>
<div id="create-contest" class="tab-content">
<div class="contest-form">
<h2 style="color: #8B4513; margin-bottom: 25px;">🆕 יצירת תחרות חדשה</h2>
<div class="form-section">
<h3>📋 פרטי התחרות</h3>
<div class="form-row">
<div class="form-group">
<label for="contest-name">שם התחרות</label>
<input type="text" id="contest-name" class="form-input" placeholder="למשל: HUGS אביב 2025">
</div>
<div class="form-group">
<label for="contest-hashtag">האשטג רשמי</label>
<input type="text" id="contest-hashtag" class="form-input" placeholder="#HUGS_spring_2025">
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="start-date">תאריך התחלה</label>
<input type="date" id="start-date" class="form-input">
</div>
<div class="form-group">
<label for="end-date">תאריך סיום</label>
<input type="date" id="end-date" class="form-input">
</div>
</div>
<div class="form-group">
<label for="contest-description">תיאור התחרות</label>
<textarea id="contest-description" class="form-input form-textarea" placeholder="תארי את מטרות התחרות, הכללים הבסיסיים…"></textarea>
</div>
</div>
<div class="form-section">
<h3>🎯 סוגי פעילויות נדרשות</h3>
<div class="checkbox-group">
<div class="checkbox-item">
<input type="checkbox" id="activity-announcement" checked>
<label for="activity-announcement">פוסט הכרזה על התחרות (50 נק')</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-stories" checked>
<label for="activity-stories">סטוריז עם המוצרים (20 נק' לסטורי)</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-followers" checked>
<label for="activity-followers">הזמנת עוקבות חדשות (10 נק' לעוקבת)</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-review" checked>
<label for="activity-review">ביקורת מוצר מפורטת (70 נק')</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-groups">
<label for="activity-groups">שיתוף בקבוצות פייסבוק (20 נק' לקבוצה)</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-engagement">
<label for="activity-engagement">אינטראקציה עם העוקבות (30 נק')</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-creativity">
<label for="activity-creativity">תוכן יצירתי מקורי (100 נק')</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="activity-sales">
<label for="activity-sales">הפניית מכירות (50 נק' למכירה)</label>
</div>
</div>
</div>
<div class="form-section">
<h3>🎁 מבנה פרסים</h3>
<div class="form-row">
<div class="form-group">
<label for="first-prize">פרס ראשון (₪)</label>
<input type="number" id="first-prize" class="form-input" placeholder="500" value="500">
</div>
<div class="form-group">
<label for="second-prize">פרס שני (₪)</label>
<input type="number" id="second-prize" class="form-input" placeholder="300" value="300">
</div>
<div class="form-group">
<label for="third-prize">פרס שלישי (₪)</label>
<input type="number" id="third-prize" class="form-input" placeholder="200" value="200">
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="participation-prize">פרס השתתפות</label>
<input type="text" id="participation-prize" class="form-input" placeholder="מוצר מתנה לכל המשתתפות">
</div>
<div class="form-group">
<label for="total-budget">תקציב כולל (₪)</label>
<input type="number" id="total-budget" class="form-input" placeholder="1200" value="1200">
</div>
</div>
</div>
<div class="form-section">
<h3>👥 רשימת משתתפות</h3>
<div class="form-group">
<label>
<input type="radio" name="participant-selection" value="all" checked>
הזמן את כל המשפיעניות במערכת
</label>
</div>
<div class="form-group">
<label>
<input type="radio" name="participant-selection" value="selected">
בחר משפיעניות ספציפיות
</label>
</div>
<div class="form-group">
<label>
<input type="radio" name="participant-selection" value="open">
הרשמה פתוחה עם אישור
</label>
</div>
<div class="form-row">
<div class="form-group">
<label for="max-participants">מספר משתתפות מקסימלי</label>
<input type="number" id="max-participants" class="form-input" placeholder="25" value="25">
</div>
<div class="form-group">
<label for="min-followers">מינימום עוקבים נדרש</label>
<input type="number" id="min-followers" class="form-input" placeholder="10000" value="10000">
</div>
</div>
</div>
<div class="action-buttons">
<button class="btn btn-primary" onclick="createContest()">🚀 צור תחרות</button>
<button class="btn btn-secondary" onclick="previewContest()">👁️ תצוגה מקדימה</button>
<button class="btn btn-secondary" onclick="saveDraft()">💾 שמור כטיוטה</button>
</div>
</div>
</div>
<!– Analytics Tab –>
<div id="analytics" class="tab-content">
<div class="activity-tracker">
<h3>📈 אנליטיקה ודוחות</h3>
<div class="contest-info-grid">
<div class="contest-stat">
<h3>4,230</h3>
<p>עוקבים חדשים בסה"כ</p>
</div>
<div class="contest-stat">
<h3>₪15,000</h3>
<p>מכירות נוספות</p>
</div>
<div class="contest-stat">
<h3>380%</h3>
<p>ROI התחרות</p>
</div>
<div class="contest-stat">
<h3>9.2/10</h3>
<p>שביעות רצון</p>
</div>
</div>
<div style="background: #f8fafc; padding: 20px; border-radius: 12px; margin: 20px 0;">
<h4>📊 הישגי התחרות:</h4>
<ul style="margin-top: 10px; padding-right: 20px;">
<li>✅ 23 משתתפות, 18 פעילות (78% שיעור השתתפות)</li>
<li>✅ 78% מהמשתתפות הגיעו ליעד המינימלי</li>
<li>✅ ממוצע 184 עוקבים חדשים למשתתפת</li>
<li>✅ 156 פוסטים ו-342 סטוריז פורסמו</li>
<li>✅ 28 מכירות ישירות זוכו לתחרות</li>
<li>✅ עלייה של 45% באינטראקציה עם הדף</li>
</ul>
</div>
<div style="text-align: center; margin: 30px 0;">
<button class="btn btn-primary" onclick="exportFullReport()">📥 ייצא דוח מלא</button>
<button class="btn btn-secondary" onclick="createSimilarContest()">🔄 צור תחרות דומה</button>
</div>
</div>
</div>
<!– Archive Tab –>
<div id="archive" class="tab-content">
<div class="activity-tracker">
<h3>🗂️ ארכיון תחרויות</h3>
<div class="leaderboard">
<div class="participant-card" style="cursor: pointer;" onclick="viewArchivedContest('hugs-winter-2024')">
<div class="rank-badge other">🏁</div>
<div class="participant-info">
<h4>HUGS חורף 2024</h4>
<p>דצמבר 2024 • 20 משתתפות</p>
</div>
<div class="participant-progress">
<div class="progress-number">₪18.5K</div>
<div class="progress-label">סה"כ מכירות</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view">📊 דוח</button>
<button class="action-btn btn-edit">🔄 שכפל</button>
</div>
</div>
<div class="participant-card" style="cursor: pointer;" onclick="viewArchivedContest('summer-vibes-2024')">
<div class="rank-badge other">🏁</div>
<div class="participant-info">
<h4>Summer Vibes 2024</h4>
<p>יולי 2024 • 15 משתתפות</p>
</div>
<div class="participant-progress">
<div class="progress-number">₪12.3K</div>
<div class="progress-label">סה"כ מכירות</div>
</div>
<div class="participant-actions">
<button class="action-btn btn-view">📊 דוח</button>
<button class="action-btn btn-edit">🔄 שכפל</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
// Tab Navigation
function showTab(tabName) {
// Hide all tabs
const tabs = document.querySelectorAll('.tab-content');
tabs.forEach(tab => tab.classList.remove('active'));
// Remove active class from nav buttons
const navButtons = document.querySelectorAll('.contest-tab');
navButtons.forEach(btn => btn.classList.remove('active'));
// Show selected tab
document.getElementById(tabName).classList.add('active');
// Add active class to clicked button
event.target.classList.add('active');
}
// Activity Tracking Functions
function toggleActivity(checkbox) {
checkbox.classList.toggle('checked');
updateParticipantScore();
// Save to Forminator
const activityData = {
participant: getParticipantName(checkbox),
activity: getActivityName(checkbox),
completed: checkbox.classList.contains('checked'),
timestamp: new Date().toISOString(),
points: getActivityPoints(checkbox)
};
saveActivityToForminator(activityData);
showNotification(`פעילות עודכנה: ${activityData.activity}`, 'success');
}
function updateParticipantScore() {
// Calculate total score for each participant
const participants = document.querySelectorAll('.influencer-activities');
participants.forEach(participant => {
const checkedActivities = participant.querySelectorAll('.activity-checkbox.checked');
let totalScore = 0;
checkedActivities.forEach(activity => {
const pointsElement = activity.parentNode.querySelector('.activity-points');
const points = parseInt(pointsElement.textContent.match(/\d+/)[0]);
totalScore += points;
});
const scoreElement = participant.querySelector('strong');
const maxScore = 360; // Total possible points
scoreElement.textContent = `סה"כ נקודות: ${totalScore}/${maxScore}`;
// Update progress in leaderboard if needed
updateLeaderboard();
});
}
function updateLeaderboard() {
// This would update the leaderboard based on current scores
// Could involve sorting participants and updating positions
console.log('Updating leaderboard…');
}
// Contest Management Functions
function viewParticipant(participantId) {
showNotification(`פותח פרופיל של ${participantId}…`, 'info');
// Open detailed view of participant's activities and progress
}
function sendMessage(participantId) {
showNotification(`פותח הודעה ל-${participantId}…`, 'info');
// Open messaging interface
}
function createContest() {
// Collect form data
const contestData = {
name: document.getElementById('contest-name').value,
hashtag: document.getElementById('contest-hashtag').value,
startDate: document.getElementById('start-date').value,
endDate: document.getElementById('end-date').value,
description: document.getElementById('contest-description').value,
firstPrize: document.getElementById('first-prize').value,
secondPrize: document.getElementById('second-prize').value,
thirdPrize: document.getElementById('third-prize').value,
totalBudget: document.getElementById('total-budget').value,
maxParticipants: document.getElementById('max-participants').value,
minFollowers: document.getElementById('min-followers').value
};
// Validate form
if (!contestData.name || !contestData.startDate || !contestData.endDate) {
showNotification('יש למלא את כל השדות הנדרשים', 'error');
return;
}
// Save to Forminator
saveContestToForminator(contestData);
showNotification('תחרות נוצרה בהצלחה! 🎉', 'success');
// Switch to active contests tab
showTab('active-contests');
}
function previewContest() {
showNotification('פותח תצוגה מקדימה…', 'info');
// Show preview of how the contest will look
}
function saveDraft() {
showNotification('טיוטה נשמרה', 'success');
// Save current form state as draft
}
function updateAllActivities() {
showNotification('מעדכן את כל הפעילויות…', 'info');
// Refresh all participant activities from social media APIs
}
function exportActivities() {
showNotification('מייצא נתוני פעילויות…', 'info');
// Export activities to Excel/PDF
}
function exportFullReport() {
showNotification('מייצא דוח מלא…', 'info');
// Export comprehensive contest report
}
// Forminator Integration Functions
function saveActivityToForminator(data) {
// This would be the actual Forminator integration
console.log('Saving activity to Forminator:', data);
/* Example AJAX call:
jQuery.ajax({
url: '/wp-admin/admin-ajax.php',
method: 'POST',
data: {
action: 'forminator_submit_form_custom_form_901',
'input_1': data.participant,
'input_2': data.activity,
'input_3': data.completed ? 'כן' : 'לא',
'input_4': data.points,
'input_5': data.timestamp
},
success: function(response) {
console.log('Activity saved:', response);
}
});
*/
}
function saveContestToForminator(data) {
// This would save the new contest to Forminator
console.log('Saving contest to Forminator:', data);
/* Example AJAX call:
jQuery.ajax({
url: '/wp-admin/admin-ajax.php',
method: 'POST',
data: {
action: 'forminator_submit_form_custom_form_902',
'input_1': data.name,
'input_2': data.hashtag,
'input_3': data.startDate,
'input_4': data.endDate,
'input_5': data.description,
'input_6': data.totalBudget
// … more fields
},
success: function(response) {
console.log('Contest saved:', response);
}
});
*/
}
// Helper Functions
function getParticipantName(element) {
return element.closest('.influencer-activities').querySelector('h4').textContent;
}
function getActivityName(element) {
return element.parentNode.querySelector('.activity-title').textContent;
}
function getActivityPoints(element) {
const pointsText = element.parentNode.querySelector('.activity-points').textContent;
return parseInt(pointsText.match(/\d+/)[0]);
}
// Notification System
function showNotification(message, type = 'info', duration = 4000) {
const notification = document.createElement('div');
notification.style.cssText = `
position: fixed;
top: 20px;
left: 20px;
z-index: 10000;
background: ${type === 'success' ? '#10b981' : type === 'error' ? '#ef4444' : '#3b82f6'};
color: white;
padding: 15px 20px;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
font-weight: 600;
max-width: 400px;
animation: slideInLeft 0.3s ease;
`;
notification.textContent = message;
document.body.appendChild(notification);
setTimeout(() => {
notification.style.animation = 'slideInLeft 0.3s ease reverse';
setTimeout(() => {
if (notification.parentNode) {
notification.parentNode.removeChild(notification);
}
}, 300);
}, duration);
}
// Add CSS animation
const style = document.createElement('style');
style.textContent = `
@keyframes slideInLeft {
from { transform: translateX(-100%); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
`;
document.head.appendChild(style);
// Initialize
document.addEventListener('DOMContentLoaded', function() {
console.log('🏆 מערכת ניהול תחרויות מוכנה!');
console.log('💡 פונקציות זמינות:');
console.log('• toggleActivity() – עדכון פעילות');
console.log('• createContest() – יצירת תחרות');
console.log('• updateAllActivities() – עדכון כל הפעילויות');
});
</script>
</body>
</html>
<div class="activity-points">+50 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">4 סטוריז עם המוצרים</div>
<div class="activity-description">סטוריז מעוצבות עם תיוג</div>
</div>
<div class="activity-points">+80 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">הזמינה 10+ עוקבות חדשות</div>
<div class="activity-description">הפנייה אישית לעוקבות</div>
</div>
<div class="activity-points">+100 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">ביקורת מוצר מפורטת</div>
<div class="activity-description">פוסט/סטורי עם ביקורת</div>
</div>
<div class="activity-points">+70 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">שיתוף בקבוצות רלוונטיות</div>
<div class="activity-description">שיתוף ב-3+ קבוצות פייסבוק</div>
</div>
<div class="activity-points">+60 נק'</div>
</div>
</div>
<div style="text-align: center; margin-top: 15px;">
<strong>סה"כ נקודות: 230/360</strong>
</div>
</div>
<!– Fashion Queen Activities –>
<div class="influencer-activities">
<div class="influencer-header">
<div class="influencer-avatar">F</div>
<div class="influencer-details">
<h4>@fashion_queen_il</h4>
<p>מקום 2 • +234 עוקבים</p>
</div>
</div>
<div class="activities-list">
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">פוסט הכרזה על התחרות</div>
<div class="activity-description">פרסמה פוסט עם #HUGS_contest</div>
</div>
<div class="activity-points">+50 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">2 סטוריז עם המוצרים</div>
<div class="activity-description">סטוריז בסיסיות</div>
</div>
<div class="activity-points">+40 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">הזמינה 5+ עוקבות חדשות</div>
<div class="activity-description">הפנייה בסטוריז</div>
</div>
<div class="activity-points">+50 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">ביקורת מוצר קצרה</div>
<div class="activity-description">סטורי עם חוות דעת</div>
</div>
<div class="activity-points">+40 נק'</div>
</div>
<div class="activity-item">
<div class="activity-checkbox" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">שיתוף בקבוצות רלוונטיות</div>
<div class="activity-description">שיתוף ב-3+ קבוצות פייסבוק</div>
</div>
<div class="activity-points">+60 נק'</div>
</div>
</div>
<div style="text-align: center; margin-top: 15px;">
<strong>סה"כ נקודות: 180/360</strong>
</div>
</div>
<!– Style Guru Activities –>
<div class="influencer-activities">
<div class="influencer-header">
<div class="influencer-avatar">G</div>
<div class="influencer-details">
<h4>@style_guru_tlv</h4>
<p>מקום 3 • +189 עוקבים</p>
</div>
</div>
<div class="activities-list">
<div class="activity-item">
<div class="activity-checkbox checked" onclick="toggleActivity(this)"></div>
<div class="activity-details">
<div class="activity-title">פוסט הכרזה על התחרות</div>
<div class="activity-description">פרסמה פוסט עם #HUGS_contest</div>
</div>