@הדיבל-המעופף מישהו יכול לפתח את הקוד הבא שזה יראה לי את השלוחות מסודר כמו איזה עץ לא יודע איך אבל לא מבולבל כמו שזה כעת
Spoiler
<!DOCTYPE html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>מנהל שלוחות ימות המשיח Pro</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@300;400;600;700&display=swap');
body { font-family: 'Assistant', sans-serif; background-color: #f0f2f5; }
.depth-line { border-right: 2px solid #e5e7eb; margin-right: 8px; padding-right: 8px; }
@media print { .no-print { display: none; } body { background: white; } }
</style>
</head>
<body class="p-4 md:p-8">
<div class="max-w-5xl mx-auto bg-white shadow-xl rounded-3xl overflow-hidden border border-gray-100">
<div class="bg-gradient-to-r from-blue-700 to-indigo-800 p-8 text-white no-print">
<h1 class="text-4xl font-black mb-2">מנהל שלוחות GetIVR2Dir</h1>
<p class="opacity-90">סריקה, מיפוי וייצוא של מבנה המערכת הטלפונית</p>
</div>
<div id="statsBar" class="grid grid-cols-2 md:grid-cols-4 gap-4 p-6 bg-gray-50 border-b no-print">
<div class="bg-white p-4 rounded-xl shadow-sm border border-gray-200">
<div class="text-gray-500 text-sm">שלוחות שנסרקו</div>
<div id="countStat" class="text-2xl font-bold text-blue-600">0</div>
</div>
<div class="bg-white p-4 rounded-xl shadow-sm border border-gray-200">
<div class="text-gray-500 text-sm">זמן ריצה</div>
<div id="timerStat" class="text-2xl font-bold text-gray-700">00:00</div>
</div>
<div class="bg-white p-4 rounded-xl shadow-sm border border-gray-200 col-span-2">
<div class="text-gray-500 text-sm">סטטוס נוכחי</div>
<div id="status" class="text-md font-medium text-green-600 truncate">מוכן להתחלה</div>
</div>
</div>
<div class="p-8 space-y-6 no-print">
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<label class="block text-sm font-bold text-gray-700 mb-2">מפתח גישה (Token):</label>
<input type="password" id="token" placeholder="הכנס טוקן כאן..."
class="w-full p-4 bg-gray-50 border border-gray-300 rounded-xl focus:ring-4 focus:ring-blue-100 outline-none transition-all">
</div>
<div>
<label class="block text-sm font-bold text-gray-700 mb-2">
עומק סריקה מקסימלי:
<span class="font-normal text-gray-400 mr-2">(99 = סריקה מלאה)</span>
</label>
<input type="number" id="maxDepth" value="99"
class="w-full p-4 bg-gray-50 border border-gray-300 rounded-xl focus:ring-4 focus:ring-blue-100 outline-none transition-all">
<p class="text-xs text-gray-400 mt-2">
💡 <b>מה זה עומק?</b> רמה 1 היא השלוחה הראשית. רמה 2 היא תת-שלוחה (למשל שלוחה 1/5). ככל שהמספר גבוה יותר, הסורק ייכנס עמוק יותר לתוך התיקיות.
</p>
</div>
</div>
<div class="flex flex-wrap gap-4 pt-4">
<button id="startBtn" onclick="startScan()" class="bg-blue-600 hover:bg-blue-700 text-white px-10 py-4 rounded-2xl font-bold text-lg shadow-lg shadow-blue-200 transition-all active:scale-95">התחל סריקה עכשיו</button>
<button id="stopBtn" onclick="stopScan()" disabled class="bg-gray-200 text-gray-500 px-10 py-4 rounded-2xl font-bold text-lg transition-all cursor-not-allowed">עצור</button>
<div id="downloadButtons" class="hidden flex gap-2">
<button onclick="downloadCSV()" class="bg-green-50 text-green-700 border border-green-200 px-4 py-4 rounded-2xl font-bold hover:bg-green-100 transition">אקסל (CSV)</button>
<button onclick="downloadTXT()" class="bg-gray-50 text-gray-700 border border-gray-200 px-4 py-4 rounded-2xl font-bold hover:bg-gray-100 transition">קובץ טקסט</button>
<button onclick="window.print()" class="bg-red-50 text-red-700 border border-red-200 px-4 py-4 rounded-2xl font-bold hover:bg-red-100 transition">שמור כ-PDF</button>
</div>
</div>
</div>
<div class="px-8 pb-8">
<div class="overflow-hidden border border-gray-200 rounded-2xl">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-4 text-right text-xs font-bold text-gray-500 uppercase">נתיב</th>
<th class="px-6 py-4 text-right text-xs font-bold text-gray-500 uppercase">שם השלוחה (עץ מבנה)</th>
<th class="px-6 py-4 text-right text-xs font-bold text-gray-500 uppercase">סוג</th>
</tr>
</thead>
<tbody id="resultsBody" class="bg-white divide-y divide-gray-200">
</tbody>
</table>
</div>
</div>
</div>
<script>
let isScanning = false;
let scanResults = [];
let startTime;
let timerInterval;
const apiBase = "https://www.call2all.co.il/ym/api/GetIVR2Dir";
function updateTimer() {
const now = new Date();
const diff = Math.floor((now - startTime) / 1000);
const mins = Math.floor(diff / 60).toString().padStart(2, '0');
const secs = (diff % 60).toString().padStart(2, '0');
document.getElementById('timerStat').innerText = `${mins}:${secs}`;
}
async function startScan() {
const token = document.getElementById('token').value;
const maxDepth = parseInt(document.getElementById('maxDepth').value);
if (!token) return alert("חובה להזין טוקן!");
// UI Reset
isScanning = true;
scanResults = [];
document.getElementById('resultsBody').innerHTML = '';
document.getElementById('countStat').innerText = '0';
document.getElementById('downloadButtons').classList.add('hidden');
document.getElementById('startBtn').disabled = true;
document.getElementById('stopBtn').disabled = false;
document.getElementById('stopBtn').classList.remove('bg-gray-200','text-gray-500','cursor-not-allowed');
document.getElementById('stopBtn').classList.add('bg-red-600','text-white');
startTime = new Date();
timerInterval = setInterval(updateTimer, 1000);
try {
await fetchDirectory('/', 1, maxDepth, token);
document.getElementById('status').innerText = "סיום סריקה: המבנה מוכן לייצוא.";
} catch (err) {
document.getElementById('status').innerText = "שגיאה בחיבור לימות המשיח.";
}
finishScan();
}
async function fetchDirectory(path, currentDepth, maxDepth, token) {
if (!isScanning || currentDepth > maxDepth) return;
document.getElementById('status').innerText = `סורק כעת: ${path}`;
try {
const response = await fetch(`${apiBase}?token=${token}&path=${path}`);
const data = await response.json();
if (data.responseStatus !== "OK") return;
if (data.dirs && data.dirs.length > 0) {
for (const dir of data.dirs) {
if (!isScanning) break;
const item = {
path: dir.what,
name: dir.extTitle || dir.name || "ללא שם",
type: dir.extType || "תיקייה",
depth: currentDepth
};
scanResults.push(item);
addRowToTable(item);
document.getElementById('countStat').innerText = scanResults.length;
// רקורסיה לשלוחות פנימיות
await fetchDirectory(dir.what + '/', currentDepth + 1, maxDepth, token);
}
}
} catch (e) { console.error(e); }
}
function addRowToTable(item) {
const row = document.createElement('tr');
let indent = '';
for(let i=1; i<item.depth; i++) {
indent += '<span class="depth-line"></span>';
}
row.innerHTML = `
<td class="px-6 py-4 text-sm font-mono text-gray-400">${item.path}</td>
<td class="px-6 py-4 text-sm font-semibold text-gray-800 flex items-center">${indent}${item.name}</td>
<td class="px-6 py-4 text-xs font-bold text-indigo-600 italic uppercase">${item.type}</td>
`;
document.getElementById('resultsBody').appendChild(row);
}
function stopScan() {
isScanning = false;
document.getElementById('status').innerText = "הסריקה הופסקה.";
}
function finishScan() {
isScanning = false;
clearInterval(timerInterval);
document.getElementById('startBtn').disabled = false;
document.getElementById('stopBtn').disabled = true;
document.getElementById('downloadButtons').classList.remove('hidden');
}
function downloadCSV() {
let csvContent = "\uFEFFנתיב,שם שלוחה,סוג\n";
scanResults.forEach(r => {
csvContent += `"${r.path}","${r.name}","${r.type}"\n`;
});
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
saveAs(blob, "ivr_menu.csv");
}
function downloadTXT() {
let txtContent = "=== תפריט שלוחות ימות המשיח ===\n\n";
scanResults.forEach(r => {
const spaces = " ".repeat(r.depth - 1);
txtContent += `${spaces}${r.depth}. ${r.name} [שלוחה: ${r.path}] (${r.type})\n`;
});
const blob = new Blob([txtContent], { type: 'text/plain;charset=utf-8;' });
saveAs(blob, "ivr_menu.txt");
}
function saveAs(blob, filename) {
const link = document.createElement("a");
const url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
</script>
</body>
</html>