{"id":5905,"date":"2026-09-28T19:49:25","date_gmt":"2026-09-28T19:49:25","guid":{"rendered":"https:\/\/ppid.trunojoyo.ac.id\/?page_id=5905"},"modified":"2026-09-28T19:57:41","modified_gmt":"2026-09-28T19:57:41","slug":"dokumen-dokumen-berkaitan-program-dan-kegiatan","status":"publish","type":"page","link":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/dokumen-dokumen-berkaitan-program-dan-kegiatan\/","title":{"rendered":"Dokumen &#8211; Dokumen Berkaitan Program dan Kegiatan"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5905\" class=\"elementor elementor-5905\">\n\t\t\t\t<div class=\"elementor-element elementor-element-61c25b2 e-flex e-con-boxed e-con e-parent\" data-id=\"61c25b2\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-04ffe86 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"04ffe86\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ppid-program-widget\">\r\n\r\n  <!-- JUDUL HALAMAN -->\r\n  <div class=\"ppid-page-title\">\r\n    <h2>Dokumen Berkaitan Program dan Kegiatan<\/h2>\r\n  <\/div>\r\n\r\n  <!-- WIDGET TAHUN -->\r\n  <div id=\"tahunWidgetProgram\" class=\"tahun-widget-grid\"><\/div>\r\n\r\n  <!-- DAFTAR DOKUMEN -->\r\n  <div id=\"dokumenTahunProgram\" class=\"dokumen-tahun-container\">\r\n\r\n    <button id=\"btnKembaliProgram\" class=\"btn-kembali\">\r\n      \u2190 Kembali ke Daftar Tahun\r\n    <\/button>\r\n\r\n    <h3 id=\"judulTahunProgram\"><\/h3>\r\n\r\n    <div class=\"tabel-program-wrapper\">\r\n      \n<table id=\"tablepress-80\" class=\"tablepress tablepress-id-80\">\n<thead>\n<tr class=\"row-1 odd\">\n\t<th class=\"column-1\">No<\/th><th class=\"column-2\">Nama Dokumen<\/th><th class=\"column-3\">Tahun<\/th><th class=\"column-4\">Tautan<\/th>\n<\/tr>\n<\/thead>\n<tbody class=\"row-hover\">\n<tr class=\"row-2 even\">\n\t<td class=\"column-1\">1<\/td><td class=\"column-2\">Rencana Kerja Anggaran<\/td><td class=\"column-3\">2026<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/10\/RINCIAN-KERTAS-KERJA-2026.pdf<\/td>\n<\/tr>\n<tr class=\"row-3 odd\">\n\t<td class=\"column-1\">2<\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2025<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/10\/RINCIAN-KERTAS-KERJA-2025.pdf<\/td>\n<\/tr>\n<tr class=\"row-4 even\">\n\t<td class=\"column-1\"><\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2024<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/10\/RINCIAN-KERTAS-KERJA-2024.pdf<\/td>\n<\/tr>\n<tr class=\"row-5 odd\">\n\t<td class=\"column-1\">3<\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2023<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/09\/4.-Rencana-Kerja-Anggaran-Tahun-Anggaran-2023.pdf<\/td>\n<\/tr>\n<tr class=\"row-6 even\">\n\t<td class=\"column-1\">4<\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2022<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/09\/3.-Rencana-Kerja-Anggaran-Tahun-Anggaran-2022.pdf<\/td>\n<\/tr>\n<tr class=\"row-7 odd\">\n\t<td class=\"column-1\">5<\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2021<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/09\/2.-Rencana-Kerja-Anggaran-Tahun-Anggaran-2021.pdf<\/td>\n<\/tr>\n<tr class=\"row-8 even\">\n\t<td class=\"column-1\">6<\/td><td class=\"column-2\">Rencana Kerja Anggaran Satuan Kerja<\/td><td class=\"column-3\">2020<\/td><td class=\"column-4\">https:\/\/ppid.trunojoyo.ac.id\/wp-content\/uploads\/2026\/09\/1.-Rencana-Kerja-Anggaran-Tahun-Anggaran-2020.pdf<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<!-- #tablepress-80 from cache -->\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<style>\r\n\r\n\/* ================================\r\n   DASAR\r\n================================ *\/\r\n.ppid-program-widget {\r\n  width: 100%;\r\n  font-family: \"Segoe UI\", Arial, sans-serif;\r\n  background: transparent;\r\n  box-sizing: border-box;\r\n}\r\n\r\n\r\n\/* ================================\r\n   JUDUL\r\n================================ *\/\r\n.ppid-page-title {\r\n  text-align: center;\r\n  margin-bottom: 25px;\r\n}\r\n\r\n.ppid-page-title h2 {\r\n  margin: 0;\r\n  color: #17365d;\r\n  font-size: 28px;\r\n  font-weight: 700;\r\n}\r\n\r\n\r\n\/* ================================\r\n   WIDGET TAHUN\r\n================================ *\/\r\n.tahun-widget-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 18px;\r\n  width: 100%;\r\n  margin-bottom: 25px;\r\n}\r\n\r\n.tahun-card {\r\n  background: #ffffff;\r\n  border: 1px solid #dce5ef;\r\n  border-radius: 12px;\r\n  padding: 22px 15px;\r\n  text-align: center;\r\n  cursor: pointer;\r\n  transition: all 0.25s ease;\r\n  box-shadow: 0 3px 10px rgba(0,0,0,0.05);\r\n}\r\n\r\n.tahun-card:hover {\r\n  transform: translateY(-3px);\r\n  border-color: #315f8c;\r\n  box-shadow: 0 6px 18px rgba(23,54,93,0.12);\r\n}\r\n\r\n.tahun-card .tahun {\r\n  color: #17365d;\r\n  font-size: 24px;\r\n  font-weight: 700;\r\n}\r\n\r\n\r\n\/* ================================\r\n   CONTAINER DOKUMEN\r\n================================ *\/\r\n.dokumen-tahun-container {\r\n  display: none;\r\n  width: 100%;\r\n}\r\n\r\n.dokumen-tahun-container h3 {\r\n  margin: 15px 0 20px;\r\n  color: #17365d;\r\n  font-size: 22px;\r\n  font-weight: 700;\r\n}\r\n\r\n\r\n\/* ================================\r\n   TOMBOL KEMBALI\r\n================================ *\/\r\n.btn-kembali {\r\n  border: none;\r\n  background: #17365d;\r\n  color: #ffffff;\r\n  padding: 9px 16px;\r\n  border-radius: 7px;\r\n  cursor: pointer;\r\n  font-size: 14px;\r\n  font-family: inherit;\r\n  transition: 0.2s;\r\n}\r\n\r\n.btn-kembali:hover {\r\n  background: #315f8c;\r\n}\r\n\r\n\r\n\/* ================================\r\n   TABEL\r\n================================ *\/\r\n.tabel-program-wrapper {\r\n  width: 100%;\r\n  overflow-x: auto;\r\n}\r\n\r\n.tabel-program-wrapper table {\r\n  width: 100% !important;\r\n  border-collapse: collapse;\r\n  background: #ffffff;\r\n}\r\n\r\n.tabel-program-wrapper table thead th {\r\n  background: #17365d !important;\r\n  color: #ffffff !important;\r\n  padding: 12px 10px;\r\n  text-align: center;\r\n  font-weight: 600;\r\n}\r\n\r\n.tabel-program-wrapper table tbody td {\r\n  padding: 11px 10px;\r\n  border-bottom: 1px solid #e5eaf0;\r\n  vertical-align: middle;\r\n}\r\n\r\n.tabel-program-wrapper table tbody tr:nth-child(even) {\r\n  background: #f8fafc;\r\n}\r\n\r\n\r\n\/* ================================\r\n   KOLOM TAUTAN\r\n================================ *\/\r\n.tabel-program-wrapper table tbody td:last-child {\r\n  text-align: center;\r\n  white-space: nowrap;\r\n}\r\n\r\n\r\n\/* ================================\r\n   TOMBOL LIHAT\r\n================================ *\/\r\n.btn-lihat {\r\n  display: inline-block !important;\r\n  background: #17365d !important;\r\n  color: #ffffff !important;\r\n  text-decoration: none !important;\r\n  padding: 7px 18px !important;\r\n  border-radius: 6px !important;\r\n  font-size: 13px !important;\r\n  font-weight: 600 !important;\r\n  line-height: 1.4 !important;\r\n  border: none !important;\r\n  transition: all 0.2s ease !important;\r\n}\r\n\r\n.btn-lihat:hover {\r\n  background: #315f8c !important;\r\n  color: #ffffff !important;\r\n  text-decoration: none !important;\r\n}\r\n\r\n\r\n\/* ================================\r\n   SEMBUNYIKAN KONTROL TABLEPRESS\r\n================================ *\/\r\n.tabel-program-wrapper .dataTables_wrapper .dataTables_filter,\r\n.tabel-program-wrapper .dataTables_wrapper .dataTables_length,\r\n.tabel-program-wrapper .dataTables_wrapper .dataTables_info,\r\n.tabel-program-wrapper .dataTables_wrapper .dataTables_paginate {\r\n  display: none !important;\r\n}\r\n\r\n\r\n\/* ================================\r\n   RESPONSIVE\r\n================================ *\/\r\n@media (max-width: 900px) {\r\n  .tahun-widget-grid {\r\n    grid-template-columns: repeat(2, 1fr);\r\n  }\r\n}\r\n\r\n@media (max-width: 600px) {\r\n\r\n  .ppid-page-title h2 {\r\n    font-size: 23px;\r\n  }\r\n\r\n  .tahun-widget-grid {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .tahun-card {\r\n    padding: 18px 12px;\r\n  }\r\n\r\n  .tahun-card .tahun {\r\n    font-size: 22px;\r\n  }\r\n\r\n  .tabel-program-wrapper table {\r\n    min-width: 650px;\r\n  }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n\r\n  const tahunWidget = document.getElementById(\"tahunWidgetProgram\");\r\n  const dokumenContainer = document.getElementById(\"dokumenTahunProgram\");\r\n  const judulTahun = document.getElementById(\"judulTahunProgram\");\r\n  const btnKembali = document.getElementById(\"btnKembaliProgram\");\r\n\r\n  const table = dokumenContainer.querySelector(\"table\");\r\n\r\n  if (!table) {\r\n    console.log(\"TablePress 80 tidak ditemukan.\");\r\n    return;\r\n  }\r\n\r\n\r\n  \/* ==========================================\r\n     CARI KOLOM TAHUN DAN TAUTAN\r\n  ========================================== *\/\r\n\r\n  const headers = table.querySelectorAll(\"thead th\");\r\n\r\n  let tahunColumn = -1;\r\n  let tautanColumn = -1;\r\n\r\n  headers.forEach(function (header, index) {\r\n\r\n    const namaKolom = header.textContent\r\n      .trim()\r\n      .toLowerCase();\r\n\r\n    if (namaKolom === \"tahun\") {\r\n      tahunColumn = index;\r\n    }\r\n\r\n    if (namaKolom === \"tautan\") {\r\n      tautanColumn = index;\r\n    }\r\n\r\n  });\r\n\r\n\r\n  if (tahunColumn === -1) {\r\n    console.log(\"Kolom Tahun tidak ditemukan.\");\r\n    return;\r\n  }\r\n\r\n\r\n  \/* ==========================================\r\n     AMBIL SEMUA BARIS\r\n  ========================================== *\/\r\n\r\n  const rows = table.querySelectorAll(\"tbody tr\");\r\n\r\n  let daftarTahun = [];\r\n\r\n\r\n  rows.forEach(function (row) {\r\n\r\n    const cells = row.querySelectorAll(\"td\");\r\n\r\n    if (!cells[tahunColumn]) {\r\n      return;\r\n    }\r\n\r\n    const tahun = cells[tahunColumn]\r\n      .textContent\r\n      .trim();\r\n\r\n    if (\/^\\d{4}$\/.test(tahun)) {\r\n\r\n      if (!daftarTahun.includes(tahun)) {\r\n        daftarTahun.push(tahun);\r\n      }\r\n\r\n    }\r\n\r\n  });\r\n\r\n\r\n  \/* ==========================================\r\n     URUTKAN TAHUN TERBARU\r\n  ========================================== *\/\r\n\r\n  daftarTahun.sort(function (a, b) {\r\n    return parseInt(b) - parseInt(a);\r\n  });\r\n\r\n\r\n  \/* ==========================================\r\n     BUAT WIDGET TAHUN\r\n  ========================================== *\/\r\n\r\n  daftarTahun.forEach(function (tahun) {\r\n\r\n    const card = document.createElement(\"div\");\r\n\r\n    card.className = \"tahun-card\";\r\n\r\n    card.innerHTML =\r\n      '<div class=\"tahun\">' + tahun + '<\/div>';\r\n\r\n    card.addEventListener(\"click\", function () {\r\n\r\n      tahunWidget.style.display = \"none\";\r\n\r\n      dokumenContainer.style.display = \"block\";\r\n\r\n      judulTahun.textContent =\r\n        \"Dokumen Tahun \" + tahun;\r\n\r\n\r\n      \/* ======================================\r\n         FILTER DATA SESUAI TAHUN\r\n      ====================================== *\/\r\n\r\n      rows.forEach(function (row) {\r\n\r\n        const cells = row.querySelectorAll(\"td\");\r\n\r\n        if (!cells[tahunColumn]) {\r\n          return;\r\n        }\r\n\r\n        const tahunBaris = cells[tahunColumn]\r\n          .textContent\r\n          .trim();\r\n\r\n        if (tahunBaris === tahun) {\r\n          row.style.display = \"\";\r\n        } else {\r\n          row.style.display = \"none\";\r\n        }\r\n\r\n      });\r\n\r\n    });\r\n\r\n    tahunWidget.appendChild(card);\r\n\r\n  });\r\n\r\n\r\n  \/* ==========================================\r\n     TOMBOL KEMBALI\r\n  ========================================== *\/\r\n\r\n  btnKembali.addEventListener(\"click\", function () {\r\n\r\n    dokumenContainer.style.display = \"none\";\r\n\r\n    tahunWidget.style.display = \"grid\";\r\n\r\n    rows.forEach(function (row) {\r\n      row.style.display = \"\";\r\n    });\r\n\r\n  });\r\n\r\n\r\n  \/* ==========================================\r\n     UBAH URL MENJADI TOMBOL \"LIHAT\"\r\n  ========================================== *\/\r\n\r\n  if (tautanColumn !== -1) {\r\n\r\n    rows.forEach(function (row) {\r\n\r\n      const cells = row.querySelectorAll(\"td\");\r\n\r\n      const cell = cells[tautanColumn];\r\n\r\n      if (!cell) {\r\n        return;\r\n      }\r\n\r\n\r\n      \/* --------------------------------------\r\n         JIKA SUDAH ADA LINK\r\n      -------------------------------------- *\/\r\n\r\n      const existingLink = cell.querySelector(\"a\");\r\n\r\n      if (existingLink) {\r\n\r\n        existingLink.textContent = \"Lihat\";\r\n\r\n        existingLink.classList.add(\"btn-lihat\");\r\n\r\n        existingLink.setAttribute(\r\n          \"target\",\r\n          \"_blank\"\r\n        );\r\n\r\n        existingLink.setAttribute(\r\n          \"rel\",\r\n          \"noopener noreferrer\"\r\n        );\r\n\r\n        return;\r\n      }\r\n\r\n\r\n      \/* --------------------------------------\r\n         JIKA ISINYA URL MENTAH\r\n      -------------------------------------- *\/\r\n\r\n      const url = cell.textContent.trim();\r\n\r\n      if (!url) {\r\n        return;\r\n      }\r\n\r\n\r\n      try {\r\n\r\n        const parsedUrl = new URL(url);\r\n\r\n        if (\r\n          parsedUrl.protocol !== \"http:\" &&\r\n          parsedUrl.protocol !== \"https:\"\r\n        ) {\r\n          return;\r\n        }\r\n\r\n\r\n        \/* HAPUS URL MENTAH *\/\r\n        cell.innerHTML = \"\";\r\n\r\n\r\n        \/* BUAT TOMBOL *\/\r\n        const tombol = document.createElement(\"a\");\r\n\r\n        tombol.href = parsedUrl.href;\r\n\r\n        tombol.textContent = \"Lihat\";\r\n\r\n        tombol.className = \"btn-lihat\";\r\n\r\n        tombol.target = \"_blank\";\r\n\r\n        tombol.rel = \"noopener noreferrer\";\r\n\r\n\r\n        \/* MASUKKAN TOMBOL *\/\r\n        cell.appendChild(tombol);\r\n\r\n      } catch (error) {\r\n\r\n        console.log(\r\n          \"URL tidak valid:\",\r\n          url\r\n        );\r\n\r\n      }\r\n\r\n    });\r\n\r\n  }\r\n\r\n\r\n});\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Dokumen Berkaitan Program dan Kegiatan \u2190 Kembali ke Daftar Tahun<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-5905","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/5905","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=5905"}],"version-history":[{"count":17,"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/5905\/revisions"}],"predecessor-version":[{"id":5933,"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/5905\/revisions\/5933"}],"wp:attachment":[{"href":"https:\/\/ppid.trunojoyo.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=5905"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}