Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
HTML
<!-- فونت وزیر -->
<link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet" type="text/css" />

<h1 style="text-align:center; font-family:Vazir, Tahoma; color:#333;font-weight:600;">مستندات>📂 اسناد اعتبارثبت بخشی<شده</h1>

<!-- ردیفنوار جستجو و فیلترها -->
<div id="search-filters" style="display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin:30px 0;">
  <input type="text" id="search" placeholder="جستجو بر اساس عنوان یا محور" 
         style="flex:1 1 300pxwidth:60%; max-width:400px600px; padding:10px12px 15px16px; border:none; background:#f3f3f3; border-radius:30px; font-size:14px16px; outline:none; text-align:right; font-family:Vazir, Tahoma; min-width:150px;">
  
  <select">
</div>

<!-- کانتینر سه بخش -->
<div id="filtersections-mahvarcontainer" style="flexpadding:0 140px 150px60px; paddingdirection:10px 15px; border-radius:25px; border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px; background:#fff; cursor:pointer;">
    <option value="">انتخاب محور</option>
  </select>
  
  <select id="filter-zirmohvar" style="flex:0 1 150px; padding:10px 15px; border-radius:25px; border:1px solid #cccrtl;"></div>

<!-- پیام وقتی چیزی پیدا نشد -->
<div id="no-result" style="display:none; text-align:center; color:#b40074; font-weight:600; font-size:16px; margin-top:20px;">
هیچ سندی پیدا نشد.
</div>

<style>
.card {
  background:#fff; border-radius:18px; box-shadow:0 4px 10px rgba(0,0,0,0.1);
  padding:20px; display:flex; align-items:center; justify-content:space-between; 
  flex-direction:row-reverse; font-family:Vazir, Tahoma; font-size:14px; background:#fff; cursor:pointer;">
    <option value="">انتخاب زیرمحور</option>
  </select>
</div>

<!-- کانتینر سه بخش -->
<div id="sections-container" style="padding:0 40px 60px; direction:rtl;"></div>

<!-- پیام وقتی چیزی پیدا نشد -->
<div id="no-result" style="display:none; text-align:center; color:#00A9C3; font-weight:600; font-size:16px; margin-top:20px;">
هیچ سندی پیدا نشد.
</div>

<style>
.card {
  background:#fff; border-radius:18px; box-shadow:0 4px 10px rgba(0,0,0,0.1);
  padding:20px; display:flex; align-items:center; justify-content:space-between; 
  flex-direction:row-reverse; font-family:Vazir, Tahoma; transition:all 0.3s ease;
}
.card-content { flex:1; text-align:right; padding-right:15pxtransition:all 0.3s ease;
}
.card-content { flex:1; text-align:right; padding-right:15px; }
.card-content h3 { margin:0 0 8px; font-weight:600; font-size:14px; color:#333; }
.card-content ul { margin:0; padding-right:15px; list-style:disc; font-size:13px; color:#555; }
.download-btn { display:inline-block; background:#b40074; color:#fff; border:none; border-radius:25px; padding:4px 18px; font-size:13px; text-decoration:none; margin-top:12px; cursor:pointer; }
.download-btn:hover { background:#d50088; }
.card-icon { background:#f7f7f7; border-radius:16px; padding:12px; display:flex; align-items:center; justify-content:center; }
.card-contenticon h3img { margin:0 0 8pxwidth:2cm; font-weight:600; font-size:14px; color:#333; height:2cm; }
.card-content:hover ul { margin:0; padding-right:15px; list-style:disc; font-size:13px; color:#555; }
.open-btn { display:inline-block; background:#00A9C3; color:#fff; border:none; border-radius:25px; padding:4px 18px; font-size:13px; text-decoration:none; margin-top:12px; cursor:pointer; }
.open-btn:hover { background:#0090a8; }
.card-icon { background:#f7f7f7; border-radius:16px; padding:12px; display:flex; align-items:center; justify-content:center; }
.card-icon img { width:2cm; height:2cm; }
.card:hover { transform:scale(1.03); background:#fdfdfd; }

@media(max-width:900px){ 
  .section-grid{grid-template-columns:1fr;} 
  #search-filters { flex-direction:column; align-items:center; }
  #search-filters input, #search-filters select { flex:1 1 auto; max-width:300px; }
}
</style>

<script>
const pageId = "85045112";
const fileName = "form-data.json";
let docs = [];

const sections = [
  { title: "رهبری و مدیریت", value: "رهبری و مدیریت" },
  { title: "مراقبت و درمان", value: "مراقبت و درمان" },
  { title: "حمایت از گیرنده خدمت", value: "حمایت از گیرنده خدمت" }
];

// زیرمحورها
const zirmohvarOptions = {
  "رهبری و مدیریت": [
    "رهبری و مدیریت کیفیت",
    "مدیریت خطر، حوادث و بلایا",
    "مدیریت منابع انسانی و سلامت حرفه‌ای",
    "مدیریت خدمات پرستاری",
    "فناوری و مدیریت اطلاعات سلامت",
    "بهداشت محیط",
    "مدیریت تجهیزات پزشکی"
  ],
  "مراقبت و درمان": [
    "مراقبت‌های عمومی بالینی",
    "مراقبت‌های حاد و اورژانس",
    "مراقبت‌های جراحی و بیهوشی",
    "مراقبت‌های مادر و نوزاد",
    "پیشگیری و کنترل عفونت",
    "مدیریت دارویی",
    "خدمات تصویربرداری",
    "خدمات آزمایشگاه",
    "طب انتقال خون",
    "خدمات سرپایی"
  ],
  "حمایت از گیرنده خدمت": [
    "تأمین تسهیلات برای گیرنده خدمت",
    "احترام به حقوق گیرنده خدمت"
  ]
};

// آیکن‌ها
const sanadIcons = {
  "آیین نامه": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%A7%DB%8C%DB%8C%D9%86%20%D9%86%D8%A7%D9%85%D9%87.png?api=v2&nonce=1765664452835",
  "پروتکل": "https://kb.h-soft.ir/download/thumbnails/85045112/%D9%BE%D8%B1%D9%88%D8%AA%DA%A9%D9%84.png?api=v2&nonce=1765664452833",
  "خط‌مشی و روش": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%AE%D8%B7%20%D9%85%D8%B4%DB%8C.png?api=v2&nonce=1765664452830",
  "دستورالعمل": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%AF%D8%B3%D8%AA%D9%88%D8%B1%D8%A7%D9%84%D8%B9%D9%85%D9%84.png?api=v2&nonce=1765664452829",
  "راهنما": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%B1%D8%A7%D9%87%D9%86%D9%85%D8%A7.png?api=v2&nonce=1765664452826",
  "روش اجرایی": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%B1%D9%88%D8%B4%20%D8%A7%D8%AC%D8%B1%D8%A7%DB%8C%DB%8C.png?api=v2&nonce=1765664452825",
  "سند": "https://kb.h-soft.ir/download/thumbnails/85045112/%D8%B3%D9%86%D8%AF.png?api=v2&nonce=1765664452823",
  "فلوچارت": "https://kb.h-soft.ir/download/thumbnails/85045112/%D9%81%D9%84%D9%88%DA%86%D8%A7%D8%B1%D8%AA.png?api=v2&nonce=1765664452822",
  "کتابچه": "https://kb.h-soft.ir/download/thumbnails/85045112/%DA%A9%D8%AA%D8%A7%D8%A8%DA%86%D9%87.png?api=v2&nonce=1765664452819"
};

// نرمال‌سازی نوع سند
function normalizeSanadType(type){
  if (!type) return "";
  return type
    .trim()
    .replace(/\u200c/g, " ")   // حذف نیم‌فاصله
    .replace(/\s+/g, " ")     // یکسان‌سازی فاصله‌ها
    .toLowerCase();
}


// تشخیص هوشمند آیکن
function detectSanadIcon(type){
  const t = normalizeSanadType(type);

  if (t.includes("آیین")) return sanadIcons["آیین نامه"];
  if (t.includes("پروتکل")) return sanadIcons["پروتکل"];
  if (t.includes("خط مشی")) return sanadIcons["خط‌مشی و روش"];
  if (t.includes("دستورالعمل")) return sanadIcons["دستورالعمل"];
  if (t.includes("راهنما")) return sanadIcons["راهنما"];
  if (t.includes("روش اجرایی")) return sanadIcons["روش اجرایی"];
  if (t.includes("فلوچارت")) return sanadIcons["فلوچارت"];
  if (t.includes("کتابچه")) return sanadIcons["کتابچه"];

  return sanadIcons["سند"];
}

// دریافت JSON
async function loadJSON(){
  const attRes = await fetch(`/rest/api/content/${pageId}/child/attachment`, { credentials: "include" });
  const attData = await attRes.json();
  const file = attData.results.find(a => a.title === fileName);
  if (!file) return;

  const downloadUrl = new URL(file._links.download, window.location.origin).href;
  const jsonText = await fetch(downloadUrl, { credentials:"include" }).then(r => r.text());
  docs = JSON.parse(jsonText);

  populateMahvarFilter();
  renderSections();
}

// فیلتر محور
function populateMahvarFilter(){
  const sel = document.getElementById("filter-mahvar");
  sections.forEach(s => {
    const o = document.createElement("option");
    o.value = s.value;
    o.textContent = s.title;
    sel.appendChild(o);
  });
}

// فیلتر زیرمحور
function updateZirmohvarFilter(){
  const mahvar = document.getElementById("filter-mahvar").value;
  const sel = document.getElementById("filter-zirmohvar");
  sel.innerHTML = '<option value="">انتخاب زیرمحور</option>';
  (zirmohvarOptions[mahvar] || []).forEach(z => {
    const o = document.createElement("option");
    o.value = z;
    o.textContent = z;
    sel.appendChild(o);
  });
}

// کارت
// تابع دریافت لینک فایل از Confluence
function getAttachmentUrl(doc) {
    if (!doc.download_link) return null;
    return new URL(doc.download_link, window.location.origin).href;
}



// کارت
function createCard(doc){
    const card = document.createElement("div");
    card.className = "card";

    const fileUrl = getAttachmentUrl(doc);

    const iconUrl = detectSanadIcon(doc.noe_sanad);

    card.innerHTML = `
        <div class="card-content">
            <h3><b>${doc.document_name || doc.title || ""}</b></h3>
            <ul>
                <li>زیرمحور: ${doc.zirmohvar || "-"}</li>
                <li>نوع سند: ${doc.noe_sanad || "-"}</li>
                <li>شماره استاندارد: ${doc.standard_no || "-"}</li>
                <li>تاریخ آخرین بازنگری: ${doc.date || "-"}</li>
            </ul>

            ${
                fileUrl
                ? `<button class="open-btn" onclick="downloadBase64File('${fileUrl}', '${doc.document_file_name}')">مشاهده</button>`
                : `<span class="open-btn" style="background:#ccc;cursor:not-allowed">فایل ندارد</span>`
            }
        </div>

        <div class="card-icon">
            <img src="${iconUrl}" alt="سند">
        </div>
    `;

    return card;
}

// تابع دانلود فایل به صورت Base64
function downloadBase64File(url, fileName){
    window.open(url, "_blank");
}



// رندر کل بخش‌ها بدون تغییر
function renderSections(){
    const searchText = document.getElementById("search").value.toLowerCase();
    const m = document.getElementById("filter-mahvar").value;
    const z = document.getElementById("filter-zirmohvar").value;

  transform:scale(1.03); background:#fdfdfd; }
@media(max-width:900px){ .section-grid{grid-template-columns:1fr;} }
</style>

<script>
const pageId = "85045112";
const fileName = "form-data.json";
let docs = [];

// بخش‌ها با عنوان و mahvar مرتبط
const sections = [
  { title: "رهبری و مدیریت", value: "modiriyat" },
  { title: "مراقبت و درمان", value: "mored" },
  { title: "حمایت از گیرنده خدمت", value: "hemayat" }
];

// دریافت JSON
async function loadJSON(){
  try {
      const attRes = await fetch(`/rest/api/content/${pageId}/child/attachment`, { credentials: "include" });
      const attData = await attRes.json();
      const file = attData.results.find(a => a.title === fileName);
      if (!file) { console.warn("JSON file not found."); return; }

      const downloadUrl = new URL(file._links.download, window.location.origin).href;
      const jsonText = await fetch(downloadUrl, { credentials:"include" }).then(r => r.text());
      docs = JSON.parse(jsonText);
      renderSections();
  } catch(err){
      console.error("Error loading JSON:", err);
  }
}

// ساخت کارت و لینک دانلود از Base64
function createCard(doc){
  const card = document.createElement("div");
  card.className="card";

  let downloadLink = "#";
  if(doc.document_file){
    const arr = doc.document_file.split(',');
    const mime = arr[0].match(/:(.*?);/)[1];
    const bstr = atob(arr[1]);
    let n = bstr.length;
    const u8arr = new Uint8Array(n);
    while(n--){ u8arr[n] = bstr.charCodeAt(n); }
    const blob = new Blob([u8arr], { type: mime });
    downloadLink = URL.createObjectURL(blob);
  }

  const title = doc.title ?? "";
  card.innerHTML = `
    <div class="card-content">
      <h3>${title}</h3>
      <ul>
       
        <li>زیرمحور: ${doc.zirmohvar}</li>
        <li>نوع سند: ${doc.noe_sanad}</li>
        <li>شماره استاندارد: ${doc.standard_no}</li>
        <li>تاریخ آخرین ویرایش: ${doc.date}</li>
      </ul>
      <a href="${downloadLink}" download="${doc.document_file_name ?? 'file'}" class="download-btn">دانلود</a>
    </div>
    <div class="card-icon">
      <img src="https://kb.h-soft.ir/download/thumbnails/85045112/13.png?api=v2&nonce=1764175790566" alt="سند">
    </div>
  `;
  return card;
}

// نمایش سه بخش
function renderSections(filter=""){
  const container = document.getElementById("sections-container");
    container.innerHTML = "";
    let foundhasResult = false;

    sections.forEach(secsection => {
        const listsectionDocs = docs.filter(d =>
            d.mahvar === secsection.value && (
      !filter || 
    (!searchText || d.title.toLowerCase((d.document_name).includes(filter) ||
      d.title || "")mahvar.toLowerCase().includes(searchTextfilter)
    )) &&
     ;

    if(sectionDocs.length > 0) hasResult = true;

    const sectionDiv = document.createElement("div");
  (!m || dsectionDiv.style.mahvarmarginBottom === m) && "50px";

    const h2 = document.createElement("h2");
     (!z || d.zirmohvar === z)h2.style.textAlign = "center";
    h2.style.fontFamily =   )"Vazir, Tahoma";

    h2.style.color    if(!list.length) return= "#333";
        found = true;

h2.style.fontWeight = "600";
        const gridh2.style.marginBottom = document.createElement("div8px");
        grid.classNameh2.textContent = "section-grid".title;

    const hr =  grid.style.display = "grid"document.createElement("hr");
        gridhr.style.gridTemplateColumns = "repeat(2,1fr)";
    border = "3px solid #3f8cff";
    gridhr.style.gapwidth = "20px80px";

        [hr...list].reverse().forEach(d => grid.appendChild(createCard(d)));

    style.margin = "0 auto 20px";

    const h2grid = document.createElement("h2div");
        h2.style.textAligngrid.className = "centersection-grid";
        h2.textContentgrid.style.display = sec.title;
"grid";
        const hr = document.createElement("hr")grid.style.gridTemplateColumns = "repeat(2,1fr)";
        hrgrid.style.bordergap = "3px solid #00A9C320px";

        hr.style.width = "80px";
sectionDocs.reverse().forEach(doc => grid.appendChild(createCard(doc)));

        hr.style.margin = "0 auto 20px";

sectionDiv.appendChild(h2);
    sectionDiv.appendChild(hr);
    sectionDiv.appendChild(grid);
    container.append(h2, hr, gridappendChild(sectionDiv);
    });

    document.getElementById("no-result").style.display = foundhasResult ? "none" : "block";
}

// رویدادها
document.getElementById("search").addEventListener("input", renderSections);جستجوی زنده
document.getElementById("filter-mahvarsearch").addEventListener("changeinput", ()e => {
  updateZirmohvarFilterrenderSections(e.target.value.toLowerCase();
  renderSections();
});
document.getElementById("filter-zirmohvar").addEventListener("change", renderSections);



// اجرا
loadJSON();
</script>