Page History

<!-- فونت وزیرفیلترها -->
<link<label hreffor="filterAxis"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;</label>
<select id="filterAxis" onchange="filterTable()">
  <option value="">همه</option>
</select>

<label for="filterSubAxis">زیر محور:</label>
<select id="filterSubAxis" onchange="filterTable()">
  مستندات اعتباربخشی<option value="">همه</option>
</h2>select>

<!-- فیلترهای زیباجدول -->
<div<table id="search-filtersmyTable" styleborder="
     display:flex; justify-content:center; flex-wrap:wrap; 
     gap:10px; margin:25px 0; direction:rtl;">

  <select id="filterAxis" onchange="updateSubAxis(); filterTable()"1" cellpadding="5" cellspacing="0" style="border-collapse: collapse; width: 100%; margin-top: 10px;">
  <thead style="background-color: #f2f2f2;">
    <tr>
      style="flex:0 1 160px; padding:10px 15px; border-radius:25px; <th>محور</th>
      <th>زیر محور</th>
   border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px; <th>عنوان سند</th>
      <th>نوع  سند</th>
  background:#fff; cursor:pointer;">
    <option value="">انتخاب محور</option><th>تاریخ آخرین بازنگری</th>
    <option value="modiriyat">رهبری و مدیریت</option> <th>تاریخ ویرایش</th>
    <option value="mored">مراقبت و درمان</option> <th>کد ویرایش</th>
    <option value="hemayat">حمایت از گیرنده خدمت</option></tr>
  </select>thead>
  <tbody>
  <select id="filterSubAxis" onchange="filterTable()" <tr>
      <td>محور 1</td>
   style="flex:0 1 160px; padding:10px 15px; border-radius:25px; <td>زیر محور 1</td>
      <td>مثال عنوان 1</td>
  border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px; <td>Word</td>
      <td>2025-11-29</td>
    background:#fff; cursor:pointer;">  <td>2025-11-28</td>
    <option value="">انتخاب زیرمحور<<td>001</option>td>
    </select>
</div>

<table id="archiveTable">
tr>
     <thead><tr>
      <td>محور  <tr>2</td>
      <td>زیر محور     <th>محور</th>2</td>
      <td>مثال عنوان     <th>زیرمحور</th>2</td>
      <td>PDF</td>
      <th>کمیته</th><td>2025-11-28</td>
      <td>2025-11-27</td>
      <th>عنوان سند<<td>002</th>td>
            <th>نوع سند</th></tr>
    <tr>
        <th>تاریخ ثبت اولیه</th><td>محور 3</td>
      <td>زیر      <th>تاریخ آخرین بازنگری</th>محور 3</td>
      <td>مثال      <th>تاریخ ویرایش</th>عنوان 3</td>
      <td>Excel</td>
      <th>کد ویرایش</th><td>2025-11-27</td>
      <td>2025-11-26</td>
      <th>فایل<<td>003</th>td>
        </tr>
    </thead><tr>
     <tbody id="archiveBody"></tbody>
</table>

<!-- CSS جدول زیبا -->
<style>
#archiveTable {
    width: 100%; <td>محور 1</td>
      <td>زیر محور 2</td>
    border-collapse: separate;
 <td>مثال   border-spacing: 0;عنوان 4</td>
    font-family: Vazir, Tahoma;
 <td>Word</td>
     direction: rtl; <td>2025-11-26</td>
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
 <td>2025-11-25</td>
      border-radius: 12px;<td>004</td>
    overflow: hidden;</tr>
    margin-bottom: 30px;
}

#archiveTable thead {
    background: linear-gradient(90deg, #4facfe, #00f2fe);
    color: #fff;
    font-weight: 600;
    text-align: center;
}

#archiveTable thead th</tbody>
</table>

<!-- اسکریپت فیلتر پویا -->
<script>
// پر کردن Dropdownها بر اساس مقادیر جدول
function populateFilters() {
  var table padding: 12px 10px= document.getElementById("myTable");
  var axisSet border-bottom: 1px solid rgba(255,255,255,0.3);
}

#archiveTable tbody td {
    padding: 12px 10px;
    text-align: center;
    border-bottom: 1px solid #f0f0f0;
}

#archiveTable tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

#archiveTable tbody tr:hover {
    background-color: #e0f7ff;
    transition: background-color 0.3s;
}

#archiveTable tbody tr td a = new Set();
  var subAxisSet = new Set();
  
  var tr = table.getElementsByTagName("tr");
  for (var i = 1; i < tr.length; i++) {
    color: #007bff;
    text-decoration: nonevar tds = tr[i].getElementsByTagName("td");
    font-weight: 500;
}

#archiveTable tbody tr td a:hover {
    text-decoration: underline;
}

#search-filters select {
    transition: all 0.3s;
}

#search-filters select:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
</style>

<script>
async function loadArchive() axisSet.add(tds[0].textContent);
    subAxisSet.add(tds[1].textContent);
  }
  
  var axisSelect = document.getElementById("filterAxis");
  axisSet.forEach(function(value){
    constvar pageIdArchiveoption = document.createElement("85045557option");
    const archiveNameoption.value = "archive.json"value;

    constoption.text res = await fetch(`/rest/api/content/${pageIdArchive}/child/attachment?filename=${archiveName}`, {
        credentials: 'include',
        headers: { 'Accept': 'application/json' }
    = value;
    axisSelect.appendChild(option);
  });

  
  constvar datasubAxisSelect = await resdocument.jsongetElementById("filterSubAxis");
    if (!data.results || !data.results.length) return [];
subAxisSet.forEach(function(value){
    constvar txtoption = await fetch(data.results[0]._links.download, {document.createElement("option");
    option.value    credentials: 'include'= value;
    }).then(roption.text => r.text());
 value;
    return JSONsubAxisSelect.parse(txtappendChild(option);
  });
}

async // فیلتر کردن جدول
function populateArchiveTablefilterTable() {
  var axis const tbody = document.getElementById('archiveBody')"filterAxis").value;
  var subAxis tbody.innerHTML = document.getElementById("filterSubAxis").value;

  var  consttable archive = await loadArchive(document.getElementById("myTable");

  var  const axisMaptr = {
        modiriyat: "رهبری و مدیریت",
        mored: "مراقبت و درمان",
        hemayat: "حمایت از گیرنده خدمت"
    };

    archive.forEach(r =>table.getElementsByTagName("tr");
  
  for (var i = 1; i < tr.length; i++) {
    var tds   const= tr = document.createElement[i].getElementsByTagName("trtd");
        const mahvarTitlevar axisText = axisMaptds[r.mahvar] || "-";
0].textContent;
    var subAxisText   tr.innerHTML = `
 = tds[1].textContent;
           <td>${mahvarTitle}</td>
    if        <td>${r.zirmohvar || "-"}</td>
            <td>${r.komiteh || "-"}</td>
            <td>${r.document_name || "-"}</td>
            <td>${r.noe_sanad || "-"}</td>

            <td>${r.date_initial || "-"}</td>((axis === "" || axisText === axis) && (subAxis === "" || subAxisText === subAxis)) {
            <td>${r.date_revision || "-"}</td>tr[i].style.display = "";
    }        <td>${r.date_update || "-"}</td>
else {
            <td>${r.revision_code || "00"}</td>
            <td><a href="${r.file}" target="_blank">دانلود</a></td>
        `;

        tbody.appendChild(tr);
    });
}

document.addEventListener("DOMContentLoaded", populateArchiveTabletr[i].style.display = "none";
    }
  }
}

// اجرا هنگام بارگذاری صفحه
populateFilters();
</script>