WebBuild/wwwroot/platform/analytics/components/cardviewer/cardviewer.js

var Unibase;
(function (Unibase) {
    let Platform;
    (function (Platform) {
        let Analytics;
        (function (Analytics) {
            let Viewers;
            (function (Viewers) {
                class CardViewer extends Platform.Core.BaseComponent {
                    constructor() {
                        super();
                        this.reportManager = Analytics.Managers.ReportManager.Instance();
                        this.viewerManager = Analytics.Managers.ViewerManager.Instance();
                        this._reportBuilder = Analytics.Reports.ReportBuilder.Instance();
                        this._reportViewer = Analytics.Components.ReportViewer.Instance();
                        this.ViewerSettings = new Analytics.Providers.ViewerSettings();
                    }
                    loadmore(boardname, page, reportid, CardViewId, cardvalues, appliedcolumn, assignedcolumn, TemplateText) {
                        var instance = this;
                        var data = [];
                        let rv_ins = Unibase.Platform.Analytics.Components.ReportViewer.Instance().getReportViewerInstance(instance.containerId);
                        let { fromDate, toDate } = rv_ins.checkForReportDatePicker(reportid, this.containerId);
                        var footerElement = $("[data-id='" + boardname + "']").find('footer').find('button');
                        if (footerElement.length) {
                            var element = footerElement[0].className.split(/\s+/);
                            page = element[element.length - 1].match(/\d+/g).map(Number)[0];
                            let postdata = {
                                ReportId: reportid,
                                page: page,
                                ViewerTypeId: 5,
                                pageSize: 5,
                                ViewerId: CardViewId,
                                BoardName: boardname.toString(),
                                IsJson: true,
                                DisplayModeTypeId: this._reportViewer.getDisplayModeTypeId(),
                                DateFilter: rv_ins.dateFilters,
                                Filter: rv_ins.dynamicFilters,
                                InputParameters: rv_ins.inputParameters,
                                FromDate: fromDate,
                                ToDate: toDate,
                            };
                            instance.reportManager.getReportViewerData(postdata).then(function (tableresponse) {
                                if (tableresponse.status == Unibase.Data.Status.Success) {
                                    Unibase.Platform.Helpers.NavigationHelper.Instance().hideLoading();
                                    let response = JSON.parse(tableresponse.result);
                                    if (response.Data && response.Data.length) {
                                        let tablevalues = JSON.parse(response.Data);
                                        if (tablevalues && tablevalues.length) {
                                            let prevData = rv_ins.reportData;
                                            let currentData = JSON.parse(response.Data);
                                            rv_ins.reportData = $.merge(prevData, currentData);
                                            rv_ins.reportDatalength = rv_ins.reportData.length;
                                            if (rv_ins && rv_ins.reportResponse && rv_ins.reportResponse.result && rv_ins.reportResponse.result.ReportJsonData && rv_ins.reportResponse.result.ReportJsonData.Result && rv_ins.reportResponse.result.ReportJsonData.Result.Data) {
                                                var data = JSON.parse(rv_ins.reportResponse.result.ReportJsonData.Result.Data);
                                                data = data.concat(tablevalues);
                                                rv_ins.reportResponse.result.ReportJsonData.Result.Data = JSON.stringify(data);
                                                if (rv_ins.isEnableCount) {
                                                    $("#Viewer_pagintion" + instance.containerId).html(data.length + ' ' + 'of' + ' ' + rv_ins.totalRecords).removeClass('hidden');
                                                }
                                            }
                                        }
                                        var pageno = page + 1;
                                        footerElement.addClass("lenght_" + pageno).removeClass("lenght_" + page);
                                        for (let i = 0; i < tablevalues.length; i++) {
                                            if (TemplateText) {
                                                var context;
                                                TemplateText = TemplateText.trim();
                                                var templateScript = Handlebars.compile(TemplateText);
                                                var script = templateScript(tablevalues[i]);
                                                instance._reportBuilder.kanban_board.addElement(boardname, { title: tablevalues[i][assignedcolumn] });
                                            }
                                            else {
                                            }
                                        }
                                        var result = cardvalues.filter(function (o) { return o[appliedcolumn] === boardname; });
                                        if (result.length > 0) {
                                            var TrimmedBoardName = boardname.replace(" ", "");
                                            $("#spn_" + TrimmedBoardName + "").text(instance._reportBuilder.kanban_board.getBoardElements(boardname).length);
                                            if (result[0].groupbycount == instance._reportBuilder.kanban_board.getBoardElements(boardname).length) {
                                                $($("div").find("[data-id='" + boardname + "']")).find('button').addClass('hidden');
                                            }
                                        }
                                    }
                                }
                                else
                                    return MessageHelper.Instance().showError(tableresponse.message, "div_ErrorMessage");
                            });
                        }
                    }
                    loadView(reportresponse, reportid, CardViewId, page, pageSize, containerid, ViewerSettings, callback, reportwidgetdata) {
                        var instance = this;
                        instance.containerId = containerid;
                        let rv_ins = Unibase.Platform.Analytics.Components.ReportViewer.Instance().getReportViewerInstance(containerid);
                        instance.fileCacheHelper.loadCssFiles(["libs/kanban/jkanban.min.css"], () => {
                            instance.fileCacheHelper.loadJsFiles(["libs/kanban/jkanban.min.js", "platform/analytics/components/reportbuilder/reportbuilderhiddenfields.js"], () => {
                                $("#Table_View_" + containerid).removeClass("hidden");
                                instance.viewerManager.getCardView(CardViewId).then(function (res) {
                                    Unibase.Platform.Helpers.NavigationHelper.Instance().hideLoading();
                                    if (res != null) {
                                        instance.res = res;
                                        let tablevalues = [];
                                        let reportViewerDataResult = reportresponse.result.ReportJsonData.Result;
                                        if (reportViewerDataResult.Data) {
                                            tablevalues = JSON.parse(reportViewerDataResult.Data).sort((a, b) => (a.stageindex > b.stageindex) ? 1 : (a.stageindex < b.stageindex) ? -1 : 0);
                                            var data = [];
                                            var uniqueidarray = [];
                                            var item = [];
                                            var morearray = [];
                                            let values = [...new Set(tablevalues.map(item => item[instance.res.AppliedColumn.trim()]))];
                                            for (let i = 0; i < values.length; i++) {
                                                var result = tablevalues.filter(function (o) { return o[instance.res.AppliedColumn.trim()] === values[i]; });
                                                if (result.length > 0) {
                                                    if (result[0].groupbycount <= result.length) {
                                                        uniqueidarray.push(values[i]);
                                                    }
                                                    else {
                                                        morearray.push(values[i]);
                                                    }
                                                }
                                                for (let i = 0; i < result.length; i++) {
                                                    if (instance.res.TemplateText) {
                                                        var context;
                                                        var templateScript = Handlebars.compile(instance.res.TemplateText);
                                                        var script = templateScript(result[i]);
                                                        item.push({
                                                            title: script,
                                                        });
                                                    }
                                                }
                                                data.push({ id: values[i], title: values[i], "item": item, });
                                                item = [];
                                            }
                                            var data1 = data;
                                            var dataids = data.map(function (el) {
                                                return `${el.id}`;
                                            });
                                            data1.forEach(function (e, i) {
                                                data1[i]['dragTo'] = dataids;
                                            });
                                            var kanbandata = data;
                                            instance._reportBuilder.cardviewerpage = 2;
                                            let viewerEl = $(`#Viewer_${containerid}`);
                                            viewerEl.empty().css("overflow-x", "scroll");
                                            ;
                                            viewerEl.find(".Templateheader").addClass("hidden");
                                            let isDragging = false;
                                            let mousemoveTagHeader = false;
                                            let currentDraggingEle = null;
                                            $(`#filters-list${containerid}`).find('.filter-item').each(function (i, el) {
                                                $(el).mouseover(function (e) {
                                                    if (isDragging) {
                                                        mousemoveTagHeader = true;
                                                        $(el).addClass('kanban-item-hover');
                                                    }
                                                });
                                                $(el).mouseout(function (e) {
                                                    if (mousemoveTagHeader) {
                                                        mousemoveTagHeader = false;
                                                        let idtag = $(el).attr('data-filtername');
                                                        viewerEl.find(`[data-id="${idtag}"]`).find('.kanban-drag').append(currentDraggingEle);
                                                        $(el).removeClass("kanban-item-hover");
                                                    }
                                                });
                                            });
                                            eval(`Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().kanban_board = new jKanban({
                                                element: '#Viewer_${containerid}',
                                                layout: { horizontal: true },
                                                responsive: '700',
                                                responsivePercentage: false,
                                                widthBoard: '370px',
                                                dragItems: true,
                                                dropEl: function (el, target, source, sibling) { },
                                                boards: data1,
                                                dragBoards: false,
                                                addItemButton: true,
                                                dragEl: function (el, source) {
                                                    $(el).css({ opacity: '0.6', 'pointer-events': 'none' });
                                                    isDragging = true;
                                                    currentDraggingEle = el;
                                                    $('body').mousemove(function (e) {
                                                        if (isDragging) {
                                                            let closestCardBoard = $(el).closest('.kanban-drag')[0];
                                                            let closestCardBoardContainer =
                                                                viewerEl.find('.kanban-container').closest('.card-body')[0];
                                                            let dragRect = closestCardBoard.getBoundingClientRect();
                                                            let dragRectContainer =
                                                                closestCardBoardContainer.getBoundingClientRect();
                                                            let dragRectContainerLeft = dragRectContainer.x;
                                                            let top = dragRect.y;
                                                            let y = e.clientY;
                                                            let x = e.clientX;
                                                            if (y < top + 20) {
                                                                closestCardBoard.scrollBy(0, -20);
                                                            } else if (y < top + 60) {
                                                                closestCardBoard.scrollBy(0, -10);
                                                            } else if (y > top + dragRect.height - 20) {
                                                                closestCardBoard.scrollBy(0, 20);
                                                            } else if (y > top + dragRect.height - 60) {
                                                                closestCardBoard.scrollBy(0, 10);
                                                            }
                                                            if (x < dragRectContainerLeft + 20) {
                                                                closestCardBoardContainer.scrollBy(-20, 0);
                                                            } else if (x < dragRectContainerLeft + 60) {
                                                                closestCardBoardContainer.scrollBy(-10, 0);
                                                            } else if (x > dragRectContainerLeft + dragRectContainer.width - 20) {
                                                                closestCardBoardContainer.scrollBy(20, 0);
                                                            } else if (x > dragRectContainerLeft + dragRectContainer.width - 60) {
                                                                closestCardBoardContainer.scrollBy(10, 0);
                                                            }
                                                        }
                                                    });
                                                },
                                                dragendEl: function (el) {
                                                        $('body').off('mousemove');
                                                        $(el).css({ opacity: '1', 'pointer-events': 'auto' });
                                                        isDragging = false;
                                                        if(!isDragging){
                                                            if($(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').length>0){
                                                                let id, stageId,recordId, installedAppId;
                                                                    $('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('data-click2event','false');
                                                                    $(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('data-click2event','active');
                                                                    recordId = Number($(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('data-record2id'));
                                                                    installedAppId = Number($(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('data-installed2appid'));
                                                                    stageId = Number($(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('data-oldstageid'));
                                                                    id = $(el).find('[data-kanban2view="stagechange"][data-stagechange="true"]').attr('id');
                                                                Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFiles(["platform/apps/managers/stagemanager.js","platform/apps/components/stages/stagereason.js"], function () {
                               Unibase.Themes.Compact.Components.Details.Instance().change(stageId, installedAppId, id);
                                                                });
                                                            }
                                                        }
                                                    },
                                                buttonClick: function (el, boardId) {
                                                    var page = Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().cardviewerpage;
                                                    Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().cardviewerpage = Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().cardviewerpage + 1;
                                                    instance.loadmore(boardId,page,reportid,CardViewId,tablevalues,instance.res.AppliedColumn.trim(),instance.res.AssignColumn.trim(),instance.res.TemplateText);
                                                    var formItem = document.createElement('form');
                                                    formItem.setAttribute('class', 'itemform');
                                                    //KanbanTest.addForm(boardId, formItem);
                                                    //document.getElementById('CancelBtn').onclick = function () {
                                                    //    formItem.parentNode.removeChild(formItem);
                                                    //};
                                                },
                                             }); if($('[data-isconclusive="true"]').length !=0){
                                                let stageNameConclusive = $('[data-isconclusive="true"]').parents('.kanban-board').attr('data-id');
                                                $('[data-id="'+stageNameConclusive+'"]').addClass('position-absolute').css('margin-top', '440px');}`);
                                            viewerEl.find(".kanban-title-board").addClass('text-truncate');
                                            viewerEl.find('.kanban-container').addClass('d-flex align-items-start');
                                            for (let i = 0; i < uniqueidarray.length; i++) {
                                                var uniqueresult = tablevalues.filter(function (o) { return o[instance.res.AppliedColumn.trim()] === uniqueidarray[i]; });
                                                viewerEl.find(`[data-id='${uniqueidarray[i]}'] .kanban-title-button`).addClass('d-none');
                                                var TrimmedBoardName = uniqueidarray[i];
                                                viewerEl.find(`[data-id='${uniqueidarray[i]}'] .kanban-board-header`).append('<span class="kanban-header-badge badge badge-primary badge-outline font-14 font-weight-600 flex-shrink-0"><span id=spn_' + TrimmedBoardName + '>' + uniqueresult.length + '</span> of ' + uniqueresult[0].groupbycount + '</span>');
                                            }
                                            if (morearray.length > 0) {
                                                for (let i = 0; i < morearray.length; i++) {
                                                    var moreeresult = tablevalues.filter(function (o) { return o[instance.res.AppliedColumn.trim()] === morearray[i]; });
                                                    var TrimmedBoardName = morearray[i].toString().replace(" ", "");
                                                    viewerEl.find(`[data-id='${morearray[i]}'] .kanban-board-header`).append('<span class="kanban-header-badge badge badge-primary badge-outline font-14 font-weight-600 flex-shrink-0"><span id=spn_' + TrimmedBoardName + '>' + moreeresult.length + '</span> of ' + moreeresult[0].groupbycount + '</span>');
                                                }
                                            }
                                            viewerEl.find(".kanban-drag").css({ "min-height": "max-content", "max-height": "500px", "min-width": "250px" }).addClass('biz-custom-scrollbar');
                                            viewerEl.find("main.kanban-drag").css('height', 'fit-content');
                                            uniqueidarray = [];
                                            viewerEl.find(".btnfritem").parent().addClass('w-100 d-flex justify-content-center mt-1 align-items-center mb-2').attr('style', '');
                                            viewerEl.find(".btnfritem").addClass("lenght_2");
                                            viewerEl.find(".btnfritem").html("More");
                                            $(".btnfritem").css({ "background-color": "white", "padding": "4px 12px", "font-weight": "bold" });
                                        }
                                        else {
                                            $(`#${containerid} .kanban-container`).html(`<div class="alert alert-primary text-center mb-0 border-0 rounded-0 w-100 font-14 font-weight-500">No data available</div>`).css("width", "100%");
                                        }
                                        if (rv_ins.isEnableCount) {
                                            $("#Viewer_pagintion" + instance.containerId).html(tablevalues.length + ' ' + 'of' + ' ' + rv_ins.totalRecords);
                                        }
                                    }
                                    else
                                        return MessageHelper.Instance().showError("Something went wrong", "div_ErrorMessage");
                                });
                            });
                        });
                    }
                    static Instance() {
                        return new Unibase.Platform.Analytics.Viewers.CardViewer();
                    }
                }
                Viewers.CardViewer = CardViewer;
            })(Viewers = Analytics.Viewers || (Analytics.Viewers = {}));
        })(Analytics = Platform.Analytics || (Platform.Analytics = {}));
    })(Platform = Unibase.Platform || (Unibase.Platform = {}));
})(Unibase || (Unibase = {}));