https://static.trdizin.gov.tr/js/notification.js

1
2function getLanguage() {
3    return document.cookie
4        .split("; ")
5        .find(row => row.startsWith("pll_language="))
6        ?.split("=")[1];
7}
8let language=getLanguage()
9
10     // (function () {
11    let getBaseUrl = function () {
12        return "https://yonetim.trdizin.gov.tr/api/v1";
13    }
14
15    let notificationIcon = `
16        <a id="notificationIconATag" class="text-white me-3 pointer fsize-40" onclick="showNotificationModal()"
17            style="position: relative;color: white;float: right;margin-top: 5px;margin-right: 5px;cursor: pointer;">
18              <i class="fas fa-solid fa-bell"></i>
19              <span id="notifiction-badge" style="z-index: 99999;position: absolute; border-radius: 50%;right: -.3em;height:0.75em;width: 0.7em">              </span>
20              </a>
21                          `;
22
23    let contentIcon = `
24    <i  class="fas fa-search fsize-1" style="cursor: pointer;"></i>`;
25
26let readIcon = ``;
27
28    if(language=="en"){
29        readIcon = `  <button type="button" 
30        style="background-color:#359753; color:white; padding:8px !important;">
31                Mark as Read
32              </button>`;
33    }else{
34        readIcon = `  <button type="button" 
35        style="background-color:#359753; color:white; padding:8px !important;">
36                Okudum
37              </button>`;
38    }
39
40
41
42    let notificationTitleText = ``;
43    let notificationInfoText = ``;
44    if(language=="en"){
45        notificationInfoText = `Your notifications will be considered read when you click the "Mark as Read" button and will not be shown again.`;
46        notificationTitleText = `Notifications`;
47    }else{
48        notificationInfoText = `Bildirimleriniz "Okudum" butonuna basıldığında okunmuş kabul edilir ve bir daha gösterilmez.`;
49        notificationTitleText = `Bildirimler`;
50    }
51
52
53
54    let notificationTableHeader = ``;
55    if(language=="en"){
56        notificationTableHeader= `
57    <thead>
58        <th style="width: 5%;background-color: #d8d9d9 !important; text-align: left" scope="col">Order</th>
59        <th style="width: 55%;background-color: #d8d9d9 !important; text-align: left" scope="col">Subject</th>
60        <th style="width: 5%;background-color: #d8d9d9 !important; text-align: left" scope="col">Content</th>
61        <th style="width: 15%;background-color: #d8d9d9 !important; text-align: center" scope="col">Mark as Read</th>
62        <th style="width: 20%;background-color: #d8d9d9 !important; text-align: center" scope="col">Send Date</th>
63    </thead>
64    `;
65    }else{
66        notificationTableHeader= `
67    <thead>
68        <th style="width: 5%;background-color: #d8d9d9 !important; text-align: left" scope="col">Sıra</th>
69        <th style="width: 55%;background-color: #d8d9d9 !important; text-align: left" scope="col">Konu</th>
70        <th style="width: 5%;background-color: #d8d9d9 !important; text-align: left" scope="col">İçerik</th>
71        <th style="width: 15%;background-color: #d8d9d9 !important; text-align: center" scope="col">Okudum</th>
72        <th style="width: 20%;background-color: #d8d9d9 !important; text-align: center" scope="col">Gönderilme Tarihi</th>
73    </thead>
74    `;
75    }
76
77
78    let iconArea = document.querySelector("#Action_bar .column.one");
79
80
81    let notificationModalDiv = document.createElement("div");
82    let popupNotificationModalDiv = document.createElement("div");
83    let popupNotificationModalBodyDiv = document.createElement("div");
84    let notificationModalBodyDiv = document.createElement("div");
85    notificationModalDiv.className = "modal "
86    notificationModalDiv.setAttribute("data-bs-backdrop", "static");
87    notificationModalDiv.setAttribute("tabindex", "-1");
88    notificationModalDiv.style.zIndex = '210';
89    notificationModalDiv.setAttribute("aria-labelledby", "notificationModal");
90    notificationModalDiv.setAttribute("aria-hidden", "true");
91    notificationModalDiv.setAttribute("data-bs-keyboard", "false");
92    notificationModalDiv.id = "notificationModalDiv";
93    popupNotificationModalDiv.className = "modal "
94    popupNotificationModalDiv.setAttribute("data-bs-backdrop", "static");
95    popupNotificationModalDiv.setAttribute("tabindex", "-1");
96    popupNotificationModalDiv.style.zIndex = '210';
97    popupNotificationModalDiv.setAttribute("aria-labelledby", "notificationModal");
98    popupNotificationModalDiv.setAttribute("aria-hidden", "true");
99    popupNotificationModalDiv.setAttribute("data-bs-keyboard", "false");
100    popupNotificationModalDiv.id = "popupNotificationModalDiv";
101
102    let notificationModal = `
103 <div style="overflow-y: initial !important;" id="dialogModalForNotfication" class="modal-dialog modal-xl modal-dialog-centered">
104        <div  class="modal-content" style="max-height: 92vh; width: 100%; max-width: 1140px; min-height: 442px;overflow: auto;">
105            <div class="modal-header" style="background-image: linear-gradient(to right, #6cc3ca, #13859a, #2e6984, #384e66, #343646) !important;
106    background-color: #343646;
107    padding: 0.6rem;">

108                <span class="modal-title" id="notificationTitle" style="font-size:18px;color: antiquewhite;font-weight:bold;
109                margin-bottom: 0;line-height: 1.5;font-family: 'Open Sans', sans-serif;"></span>
110                 <br>
111                <span  style="--bs-text-opacity:1;color:antiquewhite!important;font-size:.875em;font-style:italic!important" id="notificationTitleInfo">
112                </span>
113                <a id="closeNotificationModal" type="button" onclick="closeNotificationModal()" class="close" style="color: white;background-color: transparent !important;">&times</a>
114            </div>
115            <br>
116            <div style="overflow-y: auto;padding: 1em" class="modal-body">
117                <div id="modalBodyForNotification">
118
119                </div>
120            </div>
121
122        </div>
123    </div>
124`;
125    let popupNotificationModal = `
126  <div id="dialogModalForNotficationPopup" data-bs-backdrop="static" aria-hidden="true" data-bs-keyboard="false" class="modal-dialog modal-xl modal-dialog-centered">
127    <div class="modal-content" style="max-height: 92vh; width: 100%; max-width: 1140px; min-height: 442px;overflow: auto;">    
128      <div class="modal-header" style="background-image: linear-gradient(to right, #6cc3ca, #13859a, #2e6984, #384e66, #343646) !important;
129    background-color: #343646;
130    padding: 0.6rem;">
131          <span class="modal-title" id="popupnotificationTitle" style="font-size:18px;color: antiquewhite;font-weight:bold;"></span>
132            <br>
133            <span  style="--bs-text-opacity:1;color:antiquewhite!important;font-size:.875em;font-style:italic!important" id="popupnotificationTitleInfo">
134            </span>
135         <a  style="color: white;background-color: transparent !important;" id="closeNotificationModalForPopupNotification"
136          type="button" onclick="closePopupNotificationModal()" class="close"
137                data-bs-dismiss="modal">&times</a>
138          </div>
139        <div style="overflow-y: auto;    padding: 1em;
140" class="modal-body">
141            <div id="popupNotificationModalBody"  class="card card-body">
142              
143        </div>
144      </div>
145   
146    </div>
147   </div>
148`;
149
150let clearNotificationDetailAreas = () => {
151    let notificationDetailArea = document.getElementById("notificationContentArea");
152    let popupNotificationDetailArea = document.getElementById("popupNotificationContentArea");
153    let notificationListTable = document.getElementById("notificationListTable");
154    let popupNotificationListTable = document.getElementById("popupNotificationListTable");
155
156    if (notificationDetailArea) {
157        notificationDetailArea.remove();
158    }
159
160    if (popupNotificationDetailArea) {
161        popupNotificationDetailArea.remove();
162    }
163
164    if (notificationListTable) {
165        notificationListTable.style.display = "";
166    }
167
168    if (popupNotificationListTable) {
169        popupNotificationListTable.style.display = "";
170    }
171}
172
173let setDefaultCloseHandlers = () => {

174    let closeButtonModal = document.getElementById("closeNotificationModal");
175    let closePopupButtonModal = document.getElementById("closeNotificationModalForPopupNotification");
176
177    if (closeButtonModal) {
178        closeButtonModal.removeAttribute("data-bs-dismiss");
179        closeButtonModal.onclick = function (event) {
180            event.preventDefault();
181            closeNotificationModal();
182        };
183    }
184
185    if (closePopupButtonModal) {
186        closePopupButtonModal.setAttribute("data-bs-dismiss", "modal");
187        closePopupButtonModal.onclick = function (event) {
188            event.preventDefault();
189            closePopupNotificationModal();
190        };
191    }
192}
193
194let closeNotificationDetailView = () => {
195    clearNotificationDetailAreas();
196    setDefaultCloseHandlers();
197}
198
199let setDetailCloseHandlers = (isPopup) => {
200    let closeButtonModal = document.getElementById("closeNotificationModal");
201    let closePopupButtonModal = document.getElementById("closeNotificationModalForPopupNotification");
202
203    if (closeButtonModal) {
204        if (isPopup) {
205            closeButtonModal.removeAttribute("data-bs-dismiss");
206            closeButtonModal.onclick = function (event) {
207                event.preventDefault();
208                closeNotificationModal();
209            };
210        } else {
211            closeButtonModal.removeAttribute("data-bs-dismiss");
212            closeButtonModal.onclick = function (event) {
213                event.preventDefault();
214                closeNotificationDetailView();
215            };
216        }
217    }
218
219    if (closePopupButtonModal) {
220        if (isPopup) {
221            closePopupButtonModal.removeAttribute("data-bs-dismiss");
222            closePopupButtonModal.onclick = function (event) {
223                event.preventDefault();
224                closeNotificationDetailView();
225            };
226        } else {
227            closePopupButtonModal.setAttribute("data-bs-dismiss", "modal");
228            closePopupButtonModal.onclick = function (event) {
229                event.preventDefault();
230                closePopupNotificationModal();
231            };
232        }
233    }
234}
235
236let closePopupNotificationModal = ()=>{
237    clearNotificationDetailAreas();
238    document.getElementById('popupNotificationModalDiv').setAttribute("data-bs-dismiss", "modal");
239    document.getElementById('popupNotificationModalDiv').style.display = 'none';
240    setDefaultCloseHandlers();
241}
242
243    notificationModalDiv.innerHTML = notificationModal;
244    popupNotificationModalDiv.innerHTML = popupNotificationModal;
245    document.querySelector('body').appendChild(notificationModalDiv)
246
247function showNotificationModal() {
248        clearNotificationDetailAreas();
249        setDefaultCloseHandlers();
250        document.getElementById('notificationModalDiv').style.display = 'block';
251    }
252
253    let closeNotificationModal = () => {
254        clearNotificationDetailAreas();
255        document.getElementById('notificationModalDiv').style.display = 'none';
256        setDefaultCloseHandlers();
257    }
258
259    setDefaultCloseHandlers();
260
261    var xhr = new XMLHttpRequest();
262    let getBearerToken = () => {
263        let cookies = document.cookie.split(";");
264        for (var i = 0; i < cookies.length; i++) {
265            var cookie = cookies[i].split("=");
266            if (cookie[0].trim() === 'TRDIZIN_TOKEN') {
267                return cookie[1].trim();
268            }
269        }
270    }
271
272    let hasPermissionAuthorizationForNotificationView = () => {
273        xhr.open("GET", `${getBaseUrl()}/account`, true)
274        xhr.setRequestHeader("Authorization", "Bearer " + getBearerToken());
275        xhr.onload = () => {
276            if (xhr.status === 200) {
277                let parser = new DOMParser();
278                let notiIcon = parser.parseFromString(notificationIcon,"text/html");
279                account = JSON.parse(xhr.responseText)
280                if (account["authorizationList"] && account["authorizationList"].length>0){
281                    for (let index = 0; index < account["authorizationList"].length; index++) {
282                        if (account.authorizationList[index].trim() === "VIEW_NOTIFICATIONS") {
283                            if (!document.getElementById("notificationIconATag")) {
284                                iconArea.appendChild(notiIcon.body);
285                            }
286                            getAllNotificationByUserId();
287
288                        }
289
290                    }
291                }
292
293            }
294        }
295        xhr.send();
296    }
297
298
299    let getAllNotificationByUserId = function () {
300        document.querySelector("body").appendChild(notificationModalDiv);

301        document.querySelector("body").appendChild(popupNotificationModalDiv);
302        let params = "sort_field=SEND_DATE&sort_order=DESC&page=1&size=100";
303        xhr.open("GET",
304            `${getBaseUrl()}/notification/filter?${params}`,
305            true);
306        xhr.setRequestHeader("Authorization", "Bearer " + getBearerToken());
307        xhr.onload = notificationTransferComplete;
308        xhr.send();
309    }
310
311    let clearNotificationList = () => {
312        if (document.getElementById("notificationListTable")) {
313            document.getElementById("notificationListTable").remove();
314        }
315        if (document.getElementById("popupNotificationListTable")) {
316            document.getElementById("popupNotificationListTable").remove();
317        }
318    }
319
320    let openNotificationDetailArea = function (_notifcation, targetBodyId, detailAreaId, isPopup) {
321        clearNotificationDetailAreas();
322        setDetailCloseHandlers(isPopup);
323
324        let targetBody = document.getElementById(targetBodyId);
325        if (!targetBody) {
326            return;
327        }
328
329        let listTable = document.getElementById(isPopup ? "popupNotificationListTable" : "notificationListTable");
330        if (listTable) {
331            listTable.style.display = "none";
332        }
333
334        let contentDiv = document.createElement("div");
335        let blank = document.createElement("br");
336        let header = document.createElement("h5");
337        header.style.textAlign = 'center';
338        contentDiv.setAttribute("content-type", "detail");
339        contentDiv.setAttribute("id", detailAreaId);
340        contentDiv.style.padding = '1rem';
341        contentDiv.style.border = '1px solid rgba(0,0,0,.125)';
342
343        if (isPopup) {
344            document.getElementById("popupnotificationTitle").innerHTML = notificationTitleText;
345            document.getElementById("popupnotificationTitleInfo").innerHTML = notificationInfoText;
346        } else {
347            document.getElementById("notificationTitle").innerHTML = notificationTitleText;
348            document.getElementById("notificationTitleInfo").innerHTML = notificationInfoText;
349        }
350
351        header.innerHTML = _notifcation.notification_subject;
352
353        let contentBodyDiv = document.createElement("div");
354        contentBodyDiv.innerHTML = _notifcation.notification_body;
355        contentBodyDiv.style.textAlign = 'left';
356        contentBodyDiv.style.padding = '1rem';
357
358        let dateText = document.createElement("span");
359        dateText.style.float = 'right';
360        dateText.style.marginTop = '2em'
361        let date = moment.parseZone(_notifcation.send_date, 'YYYY-MM-DDTHH:mm:SS').toDate()
362        dateText.innerHTML = moment(date).format('DD.MM.YYYY HH:mm:SS');
363
364        contentDiv.appendChild(blank);
365        contentDiv.appendChild(dateText);
366        contentDiv.appendChild(header);
367        contentDiv.appendChild(contentBodyDiv);
368        contentDiv.appendChild(dateText);
369
370        let _br = document.createElement("br");
371        let readWrapper = document.createElement("div");
372        readWrapper.innerHTML="<br> "+readIcon;
373        readWrapper.style.float = 'right';
374        readWrapper.style.width = '100%';
375        readWrapper.style.textAlign = 'end';
376        contentDiv.appendChild(_br);
377
378
379        readWrapper.setAttribute("related-id", _notifcation.id);
380        readWrapper.addEventListener("click", function () {
381            markAsReadNotification(this);
382        });
383        contentDiv.appendChild(readWrapper);
384
385        targetBody.appendChild(contentDiv);
386    }
387
388    let notificationBodyModalFunc = function (_notifcation) {
389        if (_notifcation.notification_type != 'Pop-up') {
390            openNotificationDetailArea(_notifcation, "modalBodyForNotification", "notificationContentArea", false);
391        } else {
392            openNotificationDetailArea(_notifcation, "popupNotificationModalBody", "popupNotificationContentArea", true);
393        }
394    }
395
396    let notificationTransferComplete = (evt) => {
397        if (evt.currentTarget.readyState == 4 && evt.currentTarget.status === 200) {
398            clearNotificationDetailAreas();
399            setDefaultCloseHandlers();
400            let closePopupButton = document.getElementById('closeNotificationModalForPopupNotification');

401            if (closePopupButton) {
402                closePopupButton.style.pointerEvents = 'auto';
403            }
404            clearNotificationList();
405            document.getElementById("notificationTitle").innerHTML = notificationTitleText;
406            document.getElementById("popupnotificationTitle").innerHTML = notificationTitleText;
407            document.getElementById("notificationTitleInfo").innerHTML = notificationInfoText;
408            document.getElementById("popupnotificationTitleInfo").innerHTML = notificationInfoText;
409
410            let _contents = Array.from(JSON.parse(evt.currentTarget.responseText).data);
411            let table = document.createElement("table");
412            let popupTable = document.createElement("table");
413            table.className = "table";
414            table.innerHTML += notificationTableHeader;
415            popupTable.className = "table";
416            popupTable.innerHTML += notificationTableHeader;
417            popupTable.id = "popupNotificationListTable";
418            table.id = "notificationListTable";
419            let tbody = document.createElement("tbody");
420            let popupTbody = document.createElement("tbody");
421            popupTbody.id = "popupNotificationModalTableBody";
422            // border-top: none
423            tbody.style.borderTop = 'none';
424            tbody.style.verticalAlign = 'inherit';
425            if (_contents?.length > 0) {
426                for (var index = 0; index < _contents.length; index++) {
427                    let notBadge = document.getElementById("notifiction-badge");
428                    notBadge.style.backgroundColor = 'red';
429                    let row = document.createElement("tr");
430                    let order = document.createElement("td");
431                    order.style.textAlign = 'left';
432                    let subject = document.createElement("td");
433                    subject.style.textAlign = 'left';
434                    let contentWrapper = document.createElement("span");
435                    let content = document.createElement("td");
436                    content.style.textAlign = 'left';
437                    let iHaveRead = document.createElement("td");
438                    iHaveRead.style.textAlign = 'left';
439                    let iHaveReadWrapper = document.createElement("span");
440                    let sendDate = document.createElement("td");
441                    sendDate.style.textAlign = 'left';
442                    let date = moment.parseZone(_contents[index].send_date, 'YYYY-MM-DDTHH:mm:SS').toDate()
443                    sendDate.innerHTML = moment(date).format('DD.MM.YYYY HH:mm:SS');
444                    iHaveReadWrapper.style.cursor = 'grap';
445                    contentWrapper.style.cursor = 'grap';
446
447                    iHaveReadWrapper.value = _contents[index].id;
448                    order.innerHTML = String(index + 1);
449                    subject.innerHTML = _contents[index].notification_subject;
450                    contentWrapper.id = 'notificationdetail' + index;
451                    let _notification = _contents[index];
452                    contentWrapper.addEventListener("click", function () {
453                        notificationBodyModalFunc(_notification);
454                    });
455
456                    contentWrapper.innerHTML = contentIcon;
457                    content.appendChild(contentWrapper);
458                    iHaveReadWrapper.setAttribute("related-id", _contents[index].id);
459                    iHaveReadWrapper.addEventListener("click", function () {
460                        markAsReadNotification(this);
461                    });
462                    iHaveReadWrapper.setAttribute("id", _contents[index].id);
463                    iHaveReadWrapper.innerHTML = readIcon;
464                    iHaveRead.appendChild(iHaveReadWrapper);
465                    row.append(order, subject, content, iHaveRead, sendDate);
466                    tbody.appendChild(row);
467                }
468
469                table.appendChild(tbody);
470                document.getElementById("modalBodyForNotification").appendChild(table);
471
472            }
473            let popupList = []
474            if (document.getElementById('closeNotificationModalForPopupNotification')) {
475                document.getElementById('closeNotificationModalForPopupNotification').style.pointerEvents = 'grab';
476            }
477            popupList = _contents.filter(n => n.notification_type == 'Pop-up')
478            if (popupList.length > 0) {
479                if (document.getElementById('notificationModalDiv')) {
480                    closeNotificationModal();
481                }
482                // document.getElementById('closeNotificationModalForPopupNotification').style.pointerEvents = 'none';
483                for (var index = 0; index < popupList.length; index++) {
484                    let popupRow = document.createElement("tr");
485                    let popupOrder = document.createElement("td");
486                    let popupSubject = document.createElement("td");
487                    let popupContentWrapper = document.createElement("span");
488                    let popupContent = document.createElement("td");
489                    let popupIHaveRead = document.createElement("td");
490                    let popupSendDate = document.createElement("td");
491                    let popupDate = moment.parseZone(popupList[index].send_date, 'YYYY-MM-DDTHH:mm:SS').toDate()
492                    popupSendDate.innerHTML = moment(popupDate).format('DD.MM.YYYY HH:mm:SS');
493                    let popupIHaveReadWrapper = document.createElement("span");
494                    popupIHaveReadWrapper.style.cursor = "grab";
495                    popupContentWrapper.style.cursor = "grab";
496                    popupIHaveReadWrapper.value = popupList[index].id;
497                    popupOrder.innerHTML = String(index + 1);
498                    popupSubject.innerHTML = popupList[index].notification_subject;
499                    popupContentWrapper.id = 'popupNotificationDetail' + index;
500                    let _notification = popupList[index];
501                    popupContentWrapper.addEventListener("click", function () {
502                        notificationBodyModalFunc(_notification);
503                    });
504                    popupContentWrapper.innerHTML = contentIcon;

505                    popupContent.appendChild(popupContentWrapper);
506                    popupIHaveReadWrapper.setAttribute("related-id", popupList[index].id);
507                    popupIHaveReadWrapper.addEventListener("click", function () {
508                        markAsReadNotification(this);
509                    });
510                    popupIHaveReadWrapper.setAttribute("id", popupList[index].id);
511                    popupIHaveReadWrapper.innerHTML = readIcon;
512                    popupIHaveRead.appendChild(popupIHaveReadWrapper);
513                    popupRow.append(popupOrder, popupSubject, popupContent, popupIHaveRead, popupSendDate);
514                    popupTbody.appendChild(popupRow);
515                }
516                popupTable.appendChild(popupTbody);
517                document.getElementById('popupNotificationModalBody').appendChild(popupTable);
518                document.getElementById('popupNotificationModalDiv').style.display = 'block';
519            }
520
521
522        }
523    }
524
525
526    let markAsReadNotification = function (element) {
527        let _notificationId = element.getAttribute("related-id")
528        xhr.open("GET",
529            `${getBaseUrl()}/notification/mark-read/${_notificationId}`,
530            true);
531        xhr.setRequestHeader("Authorization", "Bearer " + getBearerToken());
532        xhr.onload = () => {
533            hasPermissionAuthorizationForNotificationView();
534        }
535        xhr.send();
536    }
537
538    hasPermissionAuthorizationForNotificationView();
539// })();
540