Tampilkan
@@ -186,21 +202,19 @@
const tbody = document.getElementById('tableDataUmum');
const paginationEl = document.getElementById('paginationControls');
const summaryEl = document.getElementById('tableSummary');
+ const legendEl = document.getElementById('tableLegend');
const pageSizeSelect = document.getElementById('tablePageSize');
const unitSelect = document.getElementById('tableUnit');
const kategoriSelect = document.getElementById('tableKategori');
const kategoriHeaderMenu = document.getElementById('tableKategoriHeaderMenu');
- const kategoriTypeOptions = [
- { id: 'akreditasi', label: 'Kategori Akreditasi' },
- { id: 'hukum', label: 'Kategori Hukum' },
- { id: 'lainnya', label: 'Kategori Lainnya' }
- ];
const searchInput = document.getElementById('tableSearch');
const searchBtn = document.getElementById('btnTableSearch');
const downloadBtn = document.getElementById('btnDownloadMultiple');
const selectedCountEl = document.getElementById('selectedCount');
const checkAllEl = document.getElementById('checkAllRows');
const selectedIds = new Set();
+ const colorCache = {};
+ const colorPalette = ['#e8f4ff', '#fff6e5', '#e9f7ef', '#f3e8ff', '#ffe6ea', '#e6f5f3'];
document.addEventListener('change', function(e){
if(!e.target.classList.contains('toggle-expired')) return;
@@ -266,9 +280,11 @@
});
$('#tableKategori').on('change', function () {
const val = $(this).val() || '';
+ console.log(val);
+
tableState.kategoriType = val ? [val] : [];
tableState.page = 1;
- renderTable();
+ fetchData();
});
}
}
@@ -283,7 +299,8 @@
const single = selected.length === 1 ? selected[0] : '';
$('#tableKategori').val(single).trigger('change');
}
- renderTable();
+ tableState.page = 1;
+ fetchData();
});
}
@@ -302,6 +319,47 @@
return val === '1' || val === 'true' || val === 'iya' || val === 'yes';
}
+ function resolveKategoriFlag(item){
+ if(Number(item.is_akre) === 1 || item.is_akre === true || String(item.is_akre).toLowerCase() === 'true'){
+ return { key: 'akre', label: 'Kategori Akreditasi' };
+ }
+ if(item.kategori_hukum){
+ return { key: 'hukum', label: 'Kategori Hukum' };
+ }
+ const label = (item.nama_kategori || item.nama_kategori_directory || item.kategori || '').trim() || 'Kategori Lainnya';
+ const key = String(item.master_kategori_directory_id || label || 'lainnya');
+ return { key, label };
+ }
+
+ function pickColor(key, label){
+ if(colorCache[key]) return colorCache[key];
+ const index = Object.keys(colorCache).length % colorPalette.length;
+ colorCache[key] = colorPalette[index];
+ return colorCache[key];
+ }
+
+ function renderLegend(items){
+ if(!legendEl) return;
+ const map = new Map();
+ (items || []).forEach(item => {
+ const flag = resolveKategoriFlag(item);
+ const color = pickColor(flag.key, flag.label);
+ if(!map.has(flag.key)){
+ map.set(flag.key, { label: flag.label, color });
+ }
+ });
+ if(map.size === 0){
+ legendEl.textContent = '';
+ return;
+ }
+ legendEl.innerHTML = Array.from(map.values()).map(entry => `
+
+
+ ${entry.label}
+
+ `).join('');
+ }
+
function getExpiryStatus(dateStr){
if (!dateStr) return false;
const d = new Date(dateStr);
@@ -335,12 +393,15 @@
statusClass = 'bg-secondary';
}
const checked = selectedIds.has(String(item.file_directory_id)) ? 'checked' : '';
- const rowClass = expiryStatus === 'expired' ? 'table-danger' : (expiryStatus === 'soon' ? 'table-warning' : '');
+ const kategoriFlag = resolveKategoriFlag(item);
+
+ const rowColor = pickColor(kategoriFlag.key, kategoriFlag.label);
+ const rowClass = expiryStatus === 'expired' ? 'table-danger' : (expiryStatus === 'soon' ? 'table-warning' : 'row-shade');
const expiryBadge = expiryStatus === 'expired'
? `
Expired`
: (expiryStatus === 'soon' ? `
Akan Expired` : '');
return `
-
+
|
|
- ${kategoriName}
+ ${item.nama_kategori || '-'}
|
- ${unitName}
+ ${item.unit?.name || '-'}
|
${formatTanggal(item.entry_at)} |
@@ -485,6 +546,7 @@
renderPagination(tableState.lastPage || 1);
syncCheckAllState();
updateSelectedCount();
+ renderLegend(pageData);
}
function applyTableSearch(){
@@ -497,22 +559,36 @@
fetchData();
}
+ function getKategoriLabel(item){
+ const parts = String(item?.file || '').split('/');
+ return (parts[2] || item?.nama_kategori_directory || item?.kategori || '').trim();
+ }
+
+ function getKategoriId(item){
+ const label = getKategoriLabel(item);
+ return String(item?.master_kategori_directory_id || label);
+ }
+
+ function getKategoriOptionsFromData(){
+ const seen = new Map();
+ (tableState.data || []).forEach(item => {
+ const label = getKategoriLabel(item);
+ if(!label) return;
+ const id = getKategoriId(item);
+ if(!seen.has(id)){
+ seen.set(id, { id, label });
+ }
+ });
+ return Array.from(seen.values()).sort((a,b) => a.label.localeCompare(b.label));
+ }
+
function filterByKategoriType(items){
- const types = tableState.kategoriType || [];
+ const types = (tableState.kategoriType || []).map(v => String(v));
if (!types.length) return items;
return items.filter(item => {
- return types.some(type => {
- if (type === 'akreditasi') {
- return item.is_akre === true || item.is_akre === 1 || item.is_akre === '1';
- }
- if (type === 'hukum') {
- return !!item.kategori_hukum;
- }
- if (type === 'lainnya') {
- return !!item.master_kategori_directory_id;
- }
- return false;
- });
+ const catId = getKategoriId(item);
+ const catLabel = getKategoriLabel(item);
+ return types.includes(catId) || types.includes(catLabel);
});
}
@@ -520,8 +596,13 @@
if (!kategoriHeaderMenu) return;
const list = kategoriHeaderMenu.querySelector('.kategori-header-list');
if (!list) return;
+ const options = getKategoriOptionsFromData();
const selected = (tableState.kategoriType || []).map(v => String(v));
- list.innerHTML = kategoriTypeOptions.map(opt => {
+ if(options.length === 0){
+ list.innerHTML = '
Tidak ada kategori
';
+ return;
+ }
+ list.innerHTML = options.map(opt => {
const checked = selected.includes(opt.id) ? 'checked' : '';
return `