| HTML |
|---|
<link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
<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 300px; max-width:400px; padding:10px 15px; border:none; background:#f3f3f3; border-radius:30px; font-size:14px; outline:none; text-align:right; font-family:Vazir, Tahoma; min-width:150px;">
<select id="filter-mahvar" style="flex:0 1 150px; 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>
<select id="filter-zirmohvar" style="flex:0 1 150px; 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>
<!-- فیلتر جدید نوع سند با گزینههای ثابت -->
<select id="filter-noe-sanad" name="noe_sanad" required style="flex:0 1 150px; padding:10px 15px; border-radius:25px; border:1px solid #ccc; font-family:Vazir, Tahoma; font-size:14px; background:#fff; cursor:pointer;">
<option value="">انتخاب selected نوعdisabled>انتخاب سند<کنید…</option>
</select>
</div>
<div id="sections-container" style="padding:0 40px 60px; direction:rtl;"></div>
<div id="no-<option value="دستورالعمل">دستورالعمل</option>
<option value="خطمشی و روش">خطمشی و روش</option>
<option value="روش اجرایی">روش اجرایی</option>
<option value="فلوچارت">فلوچارت</option>
<option value="آییننامه">آییننامه</option>
<option value="راهنما">راهنما</option>
<option value="پروتکل">پروتکل</option>
<option value="کتابچه">کتابچه</option>
<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: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; }
.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; }
/* استایل دکمه مشاهده بیشتر - چپ چین */
.show-more-btn {
display: block;
margin: 20px 0 0 auto 0;; /* تغییر برای چپ چین شدن */
padding: 8px 25px;
background: transparent;
color: #00A9C3;
border: 2px solid #00A9C3;
border-radius: 25px;
font-family: Vazir, Tahoma;
font-size: 14px;
cursor: pointer;
transition: all 0.3s ease;
}
.show-more-btn:hover {
background: #00A9C3;
color: #fff;
}
@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["سند"];
}
// تبدیل base64 (DataURL) به Blob PDF
function base64ToPdfBlob(base64){
const cleaned = base64.replace(/^data:.*;base64,/, "").replace(/\s/g,'');
const binary = atob(cleaned);
const len = binary.length;
const buffer = new ArrayBuffer(len);
const view = new Uint8Array(buffer);
for (let i=0; i<len; i++) view[i] = binary.charCodeAt(i);
return new Blob([view], { type:"application/pdf" });
}
// باز کردن در تب جدید
function openPdfFromRecord(base64){
if (!base64){
alert("فایل در JSON موجود نیست");
return;
}
const blob = base64ToPdfBlob(base64);
const url = URL.createObjectURL(blob);
window.open(url,"_blank");
setTimeout(() => URL.revokeObjectURL(url), 60000);
}
// دریافت JSON از attachment
async function loadJSON(){
const res = await fetch(`/rest/api/content/${pageId}/child/attachment?filename=${encodeURIComponent(fileName)}`,{
credentials:"include",
headers:{Accept:"application/json"}
});}
// دریافت JSON از attachment
async function loadJSON(){
const datares = 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());
docs = JSON.parse(txt) || [];
populateMahvarFilter();
populateNoeSanadFilter(); // پر کردن فیلتر نوع سند
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);
}fetch(`/rest/api/content/${pageId}/child/attachment?filename=${encodeURIComponent(fileName)}`,{
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());
docs = JSON.parse(txt) || [];
populateMahvarFilter();
// populateNoeSanadFilter(); حذف شد چون گزینهها ثابت هستند
renderSections();
}
// فیلتر زیرمحورمحور
function updateZirmohvarFilterpopulateMahvarFilter(){
const mahvar = document.getElementById("filter-mahvar").value;
const sel = document.getElementById("filter-zirmohvar");
sel.innerHTML = '<option value="">انتخاب زیرمحور</option>'= document.getElementById("filter-mahvar");
(zirmohvarOptions[mahvar]||[])sections.forEach(zs=>{
const o=document.createElement("option");
o.value=zs.value;
o.textContent=zs.title;
sel.appendChild(o);
});
}
// فیلتر نوع سند (جدید)زیرمحور
function populateNoeSanadFilterupdateZirmohvarFilter(){
const selmahvar = document.getElementById("filter-noe-sanadmahvar");
// استخراج انواع یکتای سند از لیست docs.value;
const typessel = [...new Set(docs.map(d => d.noe_sanad).filter(t => t))].sort();
types.forEach(tdocument.getElementById("filter-zirmohvar");
sel.innerHTML = '<option value="">انتخاب زیرمحور</option>';
(zirmohvarOptions[mahvar]||[]).forEach(z=>{
const o=document.createElement("option");
o.value=tz;
o.textContent=tz;
sel.appendChild(o);
});
}
// کارت
function createCard(doc){
const card=document.createElement("div");
card.className="card";
const iconUrl = detectSanadIcon(doc.noe_sanad);
const hasFile = !!doc.file_base64;
card.innerHTML = `
<div class="card-content">
<h3><b>${doc.document_name || ""}</b></h3>
<ul>
<li>زیرمحور: ${doc.zirmohvar || "-"}</li>
<li>نوع سند: ${doc.noe_sanad || "-"}</li>
<li>شماره استاندارد: ${doc.standard_no || "-"}</li>
<li>تاریخ آخرین بازنگری: ${doc.date || "-"}</li>
</ul>
${
hasFile
? `<button class="open-btn" onclick="openPdfFromRecord('${doc.file_base64}')">مشاهده</button>`
: `<span class="open-btn" style="background:#ccc;cursor:not-allowed">فایل ندارد</span>`
}
</div>
<div class="card-icon">
<img src="${iconUrl}" alt="سند">
</div>
`;
return card;
}
// تابع نمایش بیشتر برای هر محور
function toggleSection(sectionValue, btn) {
const hiddenCards = document.querySelectorAll(`.card[data-section="${sectionValue}"].hidden-card`);
const isShowingMore = btn.textContent.includes("بستن");
if (isShowingMore) {
// مخفی کردن دوباره
hiddenCards.forEach(card => card.style.display = "none");
btn.textContent = "مشاهده بیشتر";
} else {
// نمایش همه
hiddenCards.forEach(card => card.style.display = "flex");
btn.textContent = "بستن";
}
}
// رندر بخشها
function renderSections(){
const searchText = document.getElementById("search").value.toLowerCase();
const m = document.getElementById("filter-mahvar").value;
const z = document.getElementById("filter-zirmohvar").value;
const n = document.getElementById("filter-noe-sanad").value; // مقدار فیلتر نوع سند
const container = document.getElementById("sections-container");
container.innerHTML="";
let found=false;
sections.forEach(sec=>{
const list = docs.filter(d =>
d.mahvar===sec.value &&
(!searchText || (d.document_name||"").toLowerCase().includes(searchText)) &&
(!m || d.mahvar===m) &&
(!z || d.zirmohvar===z) &&
(!n || d.noe_sanad===n) // اعمال فیلتر نوع سند
);
if (!list.length) return;
found=true;
const grid=document.createElement("div");
grid.className="section-grid";
grid.style.display="grid";
grid.style.gridTemplateColumns="repeat(2,1fr)";
grid.style.gap="20px";
// معکوس کردن لیست برای نمایش جدیدترینها اول
const reversedList = [...list].reverse();
reversedList.forEach((d, index) => {
const card = createCard(d);
// اضافه کردن دیتا اتریبیوت برای شناسایی محور
card.setAttribute("data-section", sec.value);
// اگر ایندکس بزرگتر یا مساوی ۴ بود، کلاس مخفی بده
if (index >= 4) {
card.classList.add("hidden-card");
card.style.display = "none";
}
grid.appendChild(card);
});
const h2=document.createElement("h2");
h2.style.textAlign="center";
h2.textContent=sec.title;
const hr=document.createElement("hr");
hr.style.border="3px solid #00A9C3";
hr.style.width="80px";
hr.style.margin="0 auto 20px";
container.append(h2,hr,grid);
// اگر تعداد اسناد بیشتر از ۴ تا بود، دکمه مشاهده بیشتر اضافه کن
if (reversedList.length > 4) {
const btn = document.createElement("button");
btn.className = "show-more-btn";
btn.textContent = "مشاهده بیشتر";
// ارسال مقدار محور و خود دکمه به تابع
btn.onclick = function() { toggleSection(sec.value, this); };
container.appendChild(btn);
}
});
document.getElementById("no-result").style.display = found ? "none" : "block";
}
// رویدادها
document.getElementById("search").addEventListener("input", renderSections);
document.getElementById("filter-mahvar").addEventListener("change",()=>{
updateZirmohvarFilter();
renderSections();
});
document.getElementById("filter-zirmohvar").addEventListener("change",renderSections);
document.getElementById("filter-noe-sanad").addEventListener("change",renderSections); // رویداد فیلتر نوع سند
// شروع
loadJSON();
</script> |
...