<!-- فونت وزیر -->
<link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet" type="text/css" />
<h2 style="text-align:center; font-family:Vazir, Tahoma; color:#333; font-weight:600; margin-top:20px;">
مستندات اعتباربخشی
</h2>
<!-- فیلترهای زیبا -->
<div id="search-filters" style="
display:flex; justify-content:center; flex-wrap:wrap;
gap:10px; margin:25px 0; direction:rtl;">
<select id="filterAxis" onchange="updateSubAxis(); filterTable()"
style="flex:0 1 160px; padding:10px 15px; border-radius:25px;
border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px;
background:#fff; cursor:pointer;">
<option value="">انتخاب محور</option>
<option value="modiriyat">رهبری و مدیریت</option>
<option value="mored">مراقبت و درمان</option>
<option value="hemayat">حمایت از گیرنده خدمت</option>
</select>
<select id="filterSubAxis" onchange="filterTable()"
style="flex:0 1 160px; padding:10px 15px; border-radius:25px;
border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px;
background:#fff; cursor:pointer;">
<option value="">انتخاب زیرمحور</option>
</select>
<table id="archiveTable" border="1" style="width:100%; border-collapse:collapse; text-align:center;">
<thead>
<tr>
<th>محور</th>
<th>زیرمحور</th>
<th>کمیته</th>
<th>عنوان سند</th>
<th>نوع سند</th>
<th>تاریخ<<th>تاریخ ثبت اولیه</th>
<th>تاریخ آخرین بازنگری</th>
<th>تاریخ ویرایش</th>
<th>کد ویرایش</th>
<th>فایل</th>
</tr>
</thead>
<tbody id="archiveBody"></tbody>
</table>
<!-- CSS جدول زیبا -->
<style>
#myTable {
border-collapse: separate;
border-spacing: 0;
width: 100%;
font-family: Vazir, Tahoma;
direction: rtl;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
border-radius: 10px;
overflow: hidden;
}
#myTable thead th {
background-color: #f2f2f2;
padding: 10px;
font-weight: 600;
text-align: center;
border-bottom: 1px solid #ddd;
}
#myTable tbody td {
padding: 10px;
text-align: center;
border-bottom: 1px solid #eee;
}
#myTable tbody tr:nth-child(even) {
background-color: #fafafa;
}
#myTable tbody tr:hover {
background-color: #e6f7ff;
transition: background-color 0.3s;
}
#myTable thead tr:first-child th:first-child { border-top-right-radius: 10px; }
#myTable thead tr:first-child th:last-child { border-top-left-radius: 10px; }
#myTable tbody tr:last-child td:first-child { border-bottom-right-radius: 10px; }
#myTable tbody tr:last-child td:last-child { border-bottom-left-radius: 10px; }
#search-filters select { transition: all 0.3s; }
#search-filters select:hover { box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
</style>
<!-- JS داینامیک جدول و فیلتر -->
<script>
async function loadArchive() {
const pageIdArchive = "85045557";
const archiveName = "archive.json";
const res = await fetch(`/rest/api/content/${pageIdArchive}/child/attachment?filename=${archiveName}`, {
credentials: 'include',
headers: { 'Accept': 'application/json' }
});
const data = await res.json();
if (!data.results || !data.results.length) return [];
const txt = await fetch(data.results[0]._links.download, {
credentials: 'include'
}).then(r => r.text());
return JSON.parse(txt);
}
async function populateArchiveTable() {
const tbody = document.getElementById('archiveBody');
tbody.innerHTML = "";
const archive = await loadArchive();
archive.forEach(r => {
const tr = document.createElement("tr");
// تعیین اینکه کدام تاریخ باید نمایش داده شود
let finalDate = "";
if (r.date_last_edit) finalDate = r.date_last_edit;
else if (r.date_revision) finalDate = r.date_revision;
else if (r.date_update) finalDate = r.date_update;
tr.innerHTML = `
<td>${r.mahvar || "-"}</td>
<td>${r.zirmohvar || "-"}</td>
<td>${r.komiteh || "-"}</td>
<td>${r.document_name || "-"}</td>
<td>${r.noe_sanad || "-"}</td>
<td>${r.date_last_edit || "-"}</td>
<td>${r.date_revision <td>${finalDate|| "-"}</td>
<td>${r.date_update || "-"}</td>
<td>${r.revision_code || "00"}</td>
<td><a href="${r.file_data}" download="${r.file_name}">دانلود</a></td>
`;
tbody.appendChild(tr);
});
}
// اجرا بعد از لود شدن صفحه
document.addEventListener("DOMContentLoaded", populateArchiveTable);
</script> |