@מתעמק @קו-המוסיקה מצורף קוד HTML בסיסי לחישוב
<!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>
body { font-family: Arial, sans-serif; background: #f0f2f5; margin: 0; padding: 20px; color: #333; }
.container { max-width: 1200px; margin: auto; background: #fff; padding: 25px; border-radius: 15px; box-shadow: 0 8px 30px rgba(0,0,0,0.1); }
h1 { margin-top: 0; color: #1a4388; text-align: center; border-bottom: 2px solid #eee; padding-bottom: 15px; }
.setup-panel { background: #f8fafc; padding: 20px; border-radius: 12px; border: 1px solid #e2e8f0; margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 15px; align-items: flex-end; }
.input-group { display: flex; flex-direction: column; gap: 5px; }
label { font-weight: bold; font-size: 14px; }
input, select { padding: 10px; border: 1px solid #cbd5e1; border-radius: 8px; font-size: 14px; }
.filter-panel { margin-bottom: 15px; display: flex; gap: 10px; }
#filterInput { flex: 1; padding: 12px; border: 2px solid #1a4388; border-radius: 8px; font-size: 16px; }
button { border: none; background: #1a4388; color: #fff; padding: 10px 20px; border-radius: 8px; cursor: pointer; font-weight: bold; transition: background 0.2s; }
button:hover { background: #133266; }
button.secondary { background: #10b981; }
button.secondary:hover { background: #059669; }
.summary-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin-bottom: 20px; }
.card { background: #fff; padding: 15px; border-radius: 10px; border: 1px solid #e2e8f0; box-shadow: 0 2px 4px rgba(0,0,0,0.02); text-align: center; }
.card .val { font-size: 20px; font-weight: bold; color: #1a4388; display: block; }
.card .lbl { font-size: 13px; color: #64748b; }
.table-container { overflow-x: auto; max-height: 500px; border: 1px solid #e2e8f0; border-radius: 10px; }
table { width: 100%; border-collapse: collapse; background: white; }
th { position: sticky; top: 0; background: #1a4388; color: white; padding: 12px; text-align: right; }
td { padding: 12px; border-bottom: 1px solid #f1f5f9; }
tr:hover { background: #f8fafc; }
.error { color: #991b1b; background: #fef2f2; padding: 12px; border-radius: 8px; border: 1px solid #fee2e2; margin: 10px 0; }
.success { color: #065f46; background: #ecfdf5; padding: 12px; border-radius: 8px; border: 1px solid #d1fae5; margin: 10px 0; }
#textSummary { display: none; margin-top: 20px; padding: 15px; background: #1e293b; color: #f8fafc; border-radius: 10px; font-family: monospace; font-size: 12px; white-space: pre-wrap; }
</style>
</head>
<body>
<div class="container">
<h1>ניהול נתוני שיחות - ימות המשיח</h1>
<div class="setup-panel">
<div class="input-group">
<label>טוקן API:</label>
<input type="password" id="token" placeholder="הכנס טוקן..." />
</div>
<div class="input-group">
<label>שנה:</label>
<input type="number" id="year" value="2025" style="width: 100px;" />
</div>
<div class="input-group">
<label>חודש:</label>
<select id="month">
<option value="01">ינואר (01)</option><option value="02">פברואר (02)</option>
<option value="03">מרץ (03)</option><option value="04">אפריל (04)</option>
<option value="05">מאי (05)</option><option value="06">יוני (06)</option>
<option value="07">יולי (07)</option><option value="08">אוגוסט (08)</option>
<option value="09">ספטמבר (09)</option><option value="10">אוקטובר (10)</option>
<option value="11" selected>נובמבר (11)</option><option value="12">דצמבר (12)</option>
</select>
</div>
<button onclick="fetchData()">משוך נתונים</button>
<button class="secondary" onclick="copyToClipboard()">העתק סיכום</button>
</div>
<div id="statusMessage"></div>
<div id="summaryCards" class="summary-cards" style="display:none;">
<div class="card"><span class="val" id="totalExt">0</span><span class="lbl">שלוחות</span></div>
<div class="card"><span class="val" id="totalCalls">0</span><span class="lbl">סה"כ שיחות</span></div>
<div class="card"><span class="val" id="totalTime">0:00</span><span class="lbl">זמן מצטבר</span></div>
<div class="card"><span class="val" id="totalMin">0</span><span class="lbl">דקות סה"כ</span></div>
</div>
<div class="filter-panel">
<input type="text" id="filterInput" placeholder="חיפוש מהיר לפי מספר שלוחה או שם..." onkeyup="applyFilter()">
</div>
<div class="table-container">
<table id="resultsTable">
<thead>
<tr>
<th>שלוחה</th>
<th>כותרת/שם</th>
<th>כמות שיחות</th>
<th>זמן כולל</th>
<th>דקות</th>
</tr>
</thead>
<tbody id="tableBody">
<tr><td colspan="5" style="text-align:center;">הזן טוקן ולחץ על משוך נתונים</td></tr>
</tbody>
</table>
</div>
<pre id="textSummary"></pre>
</div>
<script>
let allProcessedData = []; // מחזיק את כל הנתונים המעובדים
function showMsg(text, type) {
const el = document.getElementById("statusMessage");
el.innerHTML = `<div class="${type}">${text}</div>`;
}
async function fetchData() {
const token = document.getElementById("token").value;
const year = document.getElementById("year").value;
const month = document.getElementById("month").value;
if (!token) { showMsg("אנא הזן טוקן תקני", "error"); return; }
const path = `ivr2:Log/LogFolderEnterExit-${year}-${month}.ymgr`;
// שימוש ב-wath כפי שנדרש ב-API
const url = `https://private.call2all.co.il/ym/api/RenderYMGRFile?token=${token}&wath=${path}&convertType=json¬LoadLang=1`;
showMsg("מתחבר לשרת ימות המשיח...", "success");
try {
const response = await fetch(url);
const result = await response.json();
if (result.responseStatus !== "OK") {
showMsg("שגיאה מהשרת: " + (result.message || "קובץ לא נמצא"), "error");
return;
}
processData(result.data);
} catch (err) {
showMsg("שגיאת תקשורת: וודא שאין חסימת CORS (נסה להריץ כתוסף או משרת תואם)", "error");
}
}
function processData(rawData) {
if (!rawData || rawData.length === 0) {
showMsg("הקובץ ריק מנתונים", "error");
return;
}
const grouped = {};
let gCalls = 0;
let gSeconds = 0;
rawData.forEach(row => {
const ext = row["Folder"];
const seconds = parseFloat(row["TimeTotal"]) || 0;
const title = row["PathTitle"] || row["ValName"] || "";
if (!ext) return;
if (!grouped[ext]) {
grouped[ext] = { extension: ext, title: title, calls: 0, seconds: 0 };
}
grouped[ext].calls++;
grouped[ext].seconds += seconds;
gCalls++;
gSeconds += seconds;
});
allProcessedData = Object.values(grouped).sort((a, b) => b.seconds - a.seconds);
// עדכון כרטיסים
document.getElementById("summaryCards").style.display = "grid";
document.getElementById("totalExt").innerText = allProcessedData.length;
document.getElementById("totalCalls").innerText = gCalls;
document.getElementById("totalTime").innerText = formatHMS(gSeconds);
document.getElementById("totalMin").innerText = (gSeconds / 60).toFixed(1);
renderTable(allProcessedData);
showMsg("הנתונים עובדו בהצלחה!", "success");
}
function renderTable(data) {
const tbody = document.getElementById("tableBody");
const textSummary = document.getElementById("textSummary");
tbody.innerHTML = "";
let textPlain = "שלוחה | שם | שיחות | זמן\n---------------------------\n";
data.forEach(item => {
const hms = formatHMS(item.seconds);
const mins = (item.seconds / 60).toFixed(2);
const row = `<tr>
<td><strong>${item.extension}</strong></td>
<td>${item.title}</td>
<td>${item.calls}</td>
<td>${hms}</td>
<td>${mins}</td>
</tr>`;
tbody.innerHTML += row;
textPlain += `${item.extension} | ${item.title} | ${item.calls} | ${hms}\n`;
});
textSummary.textContent = textPlain;
}
function applyFilter() {
const query = document.getElementById("filterInput").value.toLowerCase();
const filtered = allProcessedData.filter(item =>
item.extension.toLowerCase().includes(query) ||
item.title.toLowerCase().includes(query)
);
renderTable(filtered);
}
function formatHMS(s) {
const h = Math.floor(s / 3600);
const m = Math.floor((s % 3600) / 60);
const sec = Math.floor(s % 60);
return h > 0 ? `${h}:${String(m).padStart(2,'0')}:${String(sec).padStart(2,'0')}` : `${m}:${String(sec).padStart(2,'0')}`;
}
function copyToClipboard() {
const text = document.getElementById("textSummary").textContent;
navigator.clipboard.writeText(text).then(() => alert("הסיכום הועתק!"));
}
</script>
</body>
</html>