https://flores.pe.gov.br/site/wp-content/themes/idata-gov/js/sessions/noticias-grid-5.js?ver=2.9

1// Renderizar grid de notícias em destaque com widgets laterais
2(function() {
3    // Função para formatar data
4    function formatDate(dateString) {
5        if (!dateString) return '';
6        const date = new Date(dateString);
7        const months = ['janeiro', 'fevereiro', 'março', 'abril', 'maio', 'junho',
8                       'julho', 'agosto', 'setembro', 'outubro', 'novembro', 'dezembro'];
9        return `${date.getDate().toString().padStart(2, '0')} de ${months[date.getMonth()]} de ${date.getFullYear()}`;
10    }
11
12    // 1. Renderizar notícias principais (até 6)
13    const mainNewsGrid = document.getElementById('main-news-grid');
14    if (mainNewsGrid && typeof news !== 'undefined' && news && news.length > 0) {
15        const mainNewsLimit = Math.min(news.length, 6);
16
17        for (let i = 0; i < mainNewsLimit; i++) {
18            const noticia = news[i];
19
20            const article = document.createElement('article');
21            article.className = 'main-news-card';
22
23            article.innerHTML = `
24                <div class="news-image-container">
25                    <img loading="lazy"
26                         class="news-image"
27                         src="${noticia.img || ''}"
28                         alt="${noticia.title || 'Notícia'}">
29                    ${noticia.cat ? `<div class="news-category-badge">${noticia.cat}</div>` : ''}
30                    <div class="news-overlay"></div>
31                </div>
32                <div class="news-content">
33                    <h3 class="news-title">
34                        <a class="news-link" href="${noticia.url || '#'}">
35                            ${noticia.title || 'Sem título'}
36                        </a>
37                    </h3>
38                    ${noticia.summary ? `<p class="news-summary">${noticia.summary}</p>` : ''}
39                    <div class="news-meta">
40                        <span class="read-more-btn">
41                            <i class="pi pi-arrow-right"></i>
42                            Ler mais
43                        </span>
44                    </div>
45                </div>
46                <div class="card-hover-overlay"></div>
47            `;
48
49            mainNewsGrid.appendChild(article);
50        }
51
52        // Remover notícias já exibidas
53        news.splice(0, mainNewsLimit);
54    }
55
56    // 2. Renderizar postagens populares
57    const popularPostsWidget = document.getElementById('popular-posts-widget');
58    if (popularPostsWidget) {
59        if (typeof popularPosts !== 'undefined' && popularPosts.length > 0) {
60            const popularLimit = Math.min(popularPosts.length, 4);
61
62            for (let i = 0; i < popularLimit; i++) {
63                const post = popularPosts[i];
64
65                const article = document.createElement('article');
66                article.className = 'popular-post-item';
67
68                article.innerHTML = `
69                <div class="post-image-container">
70                    <img loading="lazy"
71                         class="post-image"
72                         src="${post.img || themeUrl + '/assets/img/default-post.png'}"
73                         alt="${post.title || 'Notícia'}">
74                </div>
75                <div class="post-content">
76                    <span class="post-date">${formatDate(post.date)}</span>
77                    <h4 class="post-title">
78                        <a class="post-link" href="${post.url || '#'}">
79                            ${post.title || 'Sem título'}
80                        </a>
81                    </h4>
82                    ${post.views > 0 ? `<span class="post-views"><i class="pi pi-eye"></i> ${post.views} visualizações</span>` : ''}
83                </div>
84            `;
85
86                popularPostsWidget.appendChild(article);
87            }
88        } else {
89            // Exibir mensagem quando não houver posts populares
90            const emptyMessage = document.createElement('div');
91            emptyMessage.className = 'empty-message';
92            emptyMessage.innerHTML = `
93                <div class="empty-icon">
94                    <i class="pi pi-info-circle"></i>
95                </div>
96                <p class="empty-text">Nenhuma postagem popular no momento.</p>
97            `;
98            popularPostsWidget.appendChild(emptyMessage);
99        }
100    }
101
102    // 3. Renderizar Atos Normativos
103    const atosWidget = document.getElementById('atos-widget');
104    if (atosWidget) {
105        if (typeof atosNormativos !== 'undefined' && atosNormativos.length > 0) {
106            const atosLimit = Math.min(atosNormativos.length, 8);
107
108            for (let i = 0; i < atosLimit; i++) {
109                const ato = atosNormativos[i];
110
111                const article = document.createElement('article');
112                article.className = 'ato-item';
113
114                article.innerHTML = `
115                <div class="ato-icon">
116                    <img src="${themeUrl}/assets/img/atos.png"
117                         alt="Ato Normativo"
118                         class="ato-image">
119                </div>
120                <div class="ato-content">
121                    <h4 class="ato-title">
122                        <a target="_blank"
123                           rel="noopener noreferrer"
124                           class="ato-link"
125                           href="${ato.url || '#'}">
126                            ${ato.title || 'Sem título'}
127                        </a>
128                    </h4>

129                    <span class="ato-date">${ato.date || ''}</span>
130                </div>
131            `;
132
133                atosWidget.appendChild(article);
134            }
135        } else {
136            // Exibir mensagem quando não houver atos normativos
137            const emptyMessage = document.createElement('div');
138            emptyMessage.className = 'empty-message';
139            emptyMessage.innerHTML = `
140                <div class="empty-icon">
141                    <i class="pi pi-info-circle"></i>
142                </div>
143                <p class="empty-text">Nenhum ato normativo disponível no momento.</p>
144            `;
145            atosWidget.appendChild(emptyMessage);
146        }
147    }
148
149    // 4. Renderizar Informes (se houver dados globais)
150    const informesWidget = document.getElementById('informes-widget');
151    if (informesWidget) {
152        console.log('=== DEBUG INFORMES JS ===');
153        console.log('Informes disponíveis:', informes);
154        console.log('Quantidade:', informes ? informes.length : 0);
155
156        if (typeof informes !== 'undefined' && informes.length > 0) {
157            const informesLimit = Math.min(informes.length, 5);
158
159            console.log('Renderizando', informesLimit, 'informes');
160
161            for (let i = 0; i < informesLimit; i++) {
162                const informe = informes[i];
163
164                console.log('Renderizando informe:', informe);
165
166                const article = document.createElement('article');
167                article.className = 'informe-item';
168
169                // Construir o link - usar link_informe se existir, senão usar URL padrão
170                const informeLink = informe.link || '#';
171
172                article.innerHTML = `
173                <a href="${informeLink}"
174                   target="_blank"
175                   rel="noopener noreferrer"
176                   class="informe-link-wrapper">
177                    <div class="informe-image-container">
178                        <img loading="lazy"
179                             class="informe-image"
180                             src="${informe.img || themeUrl + '/assets/img/default-informe.png'}"
181                             alt="${informe.title || 'Informe'}">
182                        ${informe.categoria ? `<div class="informe-badge">${informe.categoria}</div>` : ''}
183                    </div>
184                </a>
185            `;
186
187                informesWidget.appendChild(article);
188            }
189        } else {
190            // Exibir mensagem quando não houver informes
191            const emptyMessage = document.createElement('div');
192            emptyMessage.className = 'empty-message';
193            emptyMessage.innerHTML = `
194                <div class="empty-icon">
195                    <i class="pi pi-info-circle"></i>
196                </div>
197                <p class="empty-text">Não há informes disponíveis no momento.</p>
198            `;
199            informesWidget.appendChild(emptyMessage);
200        }
201    }
202})();