WebBuild/wwwroot/apps/tm/targets/components/w_targetvsachievedashboard.js

var Bizgaze;
(function (Bizgaze) {
    let Apps;
    (function (Apps) {
        let TM;
        (function (TM) {
            let Targets;
            (function (Targets) {
                let Components;
                (function (Components) {
                    class TargetVSAchieve extends Unibase.Platform.Core.BaseComponent {
                        cssFiles() {
                            return ['libs/tabulator-tables/css/bootstrap/tabulator_bootstrap4.min.css'];
                        }
                        jsFiles() {
                            return ['libs/tabulator/js/tabulator.min.js'];
                        }
                        html() {
                            return "<div><button>save</button></div>";
                        }
                        loadCustHtml(containerid) {
                            const html = `<div id="CustomerTargetAchiveWidget" class="mt-40"><div class="card"><div class="card-header border-0 py-1 d-flex align-items-center"><span class="biz-highlight-bg-color text-truncate w-25">Customer Target VS Achive</span>
                            <div class="card-search-bar target-search-wrap">
                                <div class="search-wrapper d-flex w-100">
                                <input class="form-control txt_global_search target-search-input" placeholder="Search Customer" oninput="Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().targetTabulatorSearch('${containerid}')">
                                <i class="fa fa-search search-left-icon"></i>
                                <div class="biz-highlight-bg-color main-search-loader search-clear-icon d-none"></div>
                                <a href="javascript:;" class="search-clear-icon target-search-clear biz-highlight-bg-color d-none" onclick="Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().clearTargetSearch('${containerid}')"><i class="zmdi zmdi-close"></i></a>
                                </div>
                             </div>
                            </div><div class="card-body pa-0"><div id="Customer_Table" class="target-widget-table templateviewer-tableview"></div></div></div></div>`;
                            $(".dashboard_targetwidget:first").html(html);
                        }
                        loadEmpHtml(containerid) {
                            const html = `<div id="EmployeeTargetAchiveWidget" class="mt-40"><div class="card"><div class="card-header border-0 py-1 d-flex align-items-center"><span class="biz-highlight-bg-color text-truncate w-25">Employee Target VS Achive</span>
                            <div class="card-search-bar target-search-wrap">
                                <div class="search-wrapper d-flex w-100">
                                <input class="form-control txt_global_search target-search-input" placeholder="Search Employee" oninput="Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().targetTabulatorSearch('${containerid}')">
                                <i class="fa fa-search search-left-icon"></i>
                                <div class="biz-highlight-bg-color main-search-loader search-clear-icon d-none"></div>
                                <a href="javascript:;" class="search-clear-icon target-search-clear biz-highlight-bg-color d-none" onclick="Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().clearTargetSearch('${containerid}')"><i class="zmdi zmdi-close"></i></a>
                                </div>
                             </div>
                            </div><div class="card-body pa-0"><div id="Employee_Table" class="target-widget-table templateviewer-tableview"></div></div></div></div>`;
                            $(".dashboard_targetwidget").html(html);
                        }
                        loadAutoHtml(containerid) {
                            const html = `<div class="card-body">
                                             <div class="col-md-3 floating-label-form-group-with-value" id="IncludedTags">
                                             <label for="txt_targetdefinition">Target Definitions</label>
                                             <input type="hidden" class="hf_targetdefinition" value="" />
                                             <select style="width:100%" id="txt_targetdefinition" value="" class="no-border form-control select2_targetdefinition  txttargetdefinition" IsTagSelect="false">
                                               <option value="0">Select</option>
                                             </select>
                                           </div>
                                           <div class="dashboard_targetwidget"></div>
                                           </div>`;
                            $("." + containerid).html(html);
                            var url = _appsettings.server_url() + '/apis/v4/bizgaze/tm/targets/gettargetdefinitionsautocomplete';
                            AutoCompleteHelper.getHelper().Create($("#txt_targetdefinition"), ".hf_targetdefinition", url, function (response) {
                            });
                        }
                        load() {
                        }
                        init(Containerid) {
                            Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().loadAutoHtml(Containerid);
                            var instance = this;
                            $("#txt_targetdefinition").change(function () {
                                instance.targetDefinitionId = $("#txt_targetdefinition").val();
                                instance.fileCacheHelper.loadJsFile('apps/tm/targets/managers/targetmanager.js', function () {
                                    Bizgaze.Apps.TM.Targets.Managers.TargetManager.Instance().getTargetDefinitionDetails(instance.targetDefinitionId).then(function (response) {
                                        if (response != null) {
                                            var allowothercontacts = response.result.AllowOtherContacts;
                                            instance.fileCacheHelper.loadCssFile('libs/tabulator-tables/css/bootstrap/tabulator_bootstrap4.min.css', null);
                                            instance.fileCacheHelper.loadJsFiles(["libs/tabulator/js/tabulator.min.js"], function () {
                                                if (allowothercontacts == 1) {
                                                    Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().loadEmpHtml(Containerid);
                                                    instance.employeewisetargetvsachive(instance.targetDefinitionId);
                                                }
                                                else {
                                                    Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().loadCustHtml(Containerid);
                                                    instance.loadCustTabulator("");
                                                    instance.customerwisetargetvsachive(instance.targetDefinitionId);
                                                }
                                            });
                                        }
                                    });
                                });
                            });
                        }
                        customerwisetargetvsachive(targetdefinitionid) {
                            var userinfo = Unibase.Platform.Membership.Infos.Identity.getCurrentUser();
                            var instance = this;
                            instance.fileCacheHelper.loadJsFile('apps/tm/targets/managers/targetmanager.js', function () {
                                Bizgaze.Apps.TM.Targets.Managers.TargetManager.Instance().loadCustomerTargetvsAchive(userinfo.sessionId, targetdefinitionid).then(function (response) {
                                    if (response != null) {
                                        var result = response.result;
                                        instance.customerData.setData(result);
                                    }
                                });
                            });
                        }
                        employeewisetargetvsachive(targetdefinitionid) {
                            var userinfo = Unibase.Platform.Membership.Infos.Identity.getCurrentUser();
                            var instance = this;
                            instance.fileCacheHelper.loadJsFile('apps/tm/targets/managers/targetmanager.js', function () {
                                Bizgaze.Apps.TM.Targets.Managers.TargetManager.Instance().loadEmployeeTargetvsAchive(userinfo.sessionId, targetdefinitionid).then(function (response) {
                                    var dataarry = [];
                                    var result = response.result;
                                    instance.employeetotaldata = response.result;
                                    instance.totalEmployeeResponse = jQuery.extend(true, [], response.result);
                                    var datatree = false;
                                    var userparentinformation = response.result.filter(function (o) { return o.EmployeeId === userinfo.userId + "p"; });
                                    if (userparentinformation.length > 0) {
                                        datatree = true;
                                        userparentinformation[0]["_children"] = [];
                                    }
                                    dataarry.push(userparentinformation[0]);
                                    Bizgaze.Apps.TM.Targets.Components.TargetVSAchieve.Instance().loadTabulator(dataarry, datatree, response);
                                });
                            });
                        }
                        loadTabulator(response, datatree, response1) {
                            var instance = this;
                            var autoNumFormatter = function (cell) {
                                var row = cell.getRow();
                                var rowIndex = row.getPosition(false);
                                return (rowIndex + 1);
                            };
                            var editIcon = function (cell, formatterParams) {
                                return "<i class='fa fa-pencil'></i>";
                            };
                            instance.initialEmployeeData = response;
                            instance.employeeData = new Tabulator("#Employee_Table", {
                                placeholder: "<div class='alert alert-primary text-center mb-0 border-0 w-100 font-14 rounded-0'>No data available</div>",
                                data: response,
                                layout: "fitDataFill",
                                columns: [
                                    { title: "EmployeeId", field: "EmployeeId", visible: false },
                                    { title: "Employee Name", field: "EmployeeName" },
                                    { title: "Target Value", field: "TargetValue" },
                                    {
                                        title: "Achived Value", field: "AchievedTarget", cellClick: function (e, cell) {
                                            instance.currentRow = cell.getRow();
                                            instance.fileCacheHelper.loadJsFile('apps/tm/targets/components/w_tagwisetarget.js', function () {
                                                if (!instance.currentRow._row.data.EmployeeId.includes("p")) {
                                                    Bizgaze.Apps.TM.Targets.Components.TagWiseTarget.Instance().loadForm(instance.targetDefinitionId, cell.getRow().getData().EmployeeId, 0, null, 0);
                                                }
                                            });
                                        }, formatter: function (cell) {
                                            instance.currentRow = cell.getRow();
                                            var achive = cell.getValue();
                                            if (!instance.currentRow._row.data.EmployeeId.includes("p")) {
                                                return "<span class='text-primary' font-weight:bold;'>" + achive + "</span>";
                                            }
                                            else {
                                                return achive;
                                            }
                                        }
                                    },
                                    { title: "Percentage", field: "Percentage" },
                                ],
                                dataTree: datatree,
                                dataTreeSelectPropagate: true,
                                dataTreeChildIndent: 15,
                                dataTreeRowExpanded: function (row, level) {
                                    var currentemployeeid = row.getData().EmployeeId;
                                    if (currentemployeeid.includes("p"))
                                        currentemployeeid = currentemployeeid.replace("p", "");
                                    var empdatta = instance.employeetotaldata.filter(function (o) { return o.ParentId === Number(currentemployeeid); });
                                    for (var i = 0; i < empdatta.length; i++) {
                                        var userparentinformation = instance.employeetotaldata.filter(function (o) { return o.EmployeeId === empdatta[i].EmployeeId; });
                                        ;
                                        if (userparentinformation[0].EmployeeId.includes("p")) {
                                            if (userparentinformation.length > 0) {
                                                datatree = true;
                                                empdatta[i]["_children"] = [];
                                            }
                                        }
                                    }
                                    row.getData()._children = empdatta;
                                    row.getData().isExpanded = true;
                                    row.update(row.getData());
                                    instance.employeeData.redraw(true);
                                    instance.initialEmployeeData = instance.employeeData.getData();
                                },
                                dataTreeRowCollapsed: function (row, level) {
                                    row.getData().isExpanded = false;
                                },
                                dataTreeStartExpanded: function (row, level) {
                                    return row.getData().isExpanded;
                                },
                            });
                        }
                        loadCustTabulator(response) {
                            var instance = this;
                            var tabledata = [];
                            var autoNumFormatter = function (cell) {
                                var row = cell.getRow();
                                var rowIndex = row.getPosition(false);
                                return (rowIndex + 1);
                            };
                            var editIcon = function (cell, formatterParams) {
                                return "<i class='fa fa-pencil'></i>";
                            };
                            instance.customerData = new Tabulator("#Customer_Table", {
                                placeholder: "<div class='alert alert-primary text-center mb-0 border-0 w-100 font-14 rounded-0'>No data available</div>",
                                data: tabledata,
                                layout: "fitDataFill",
                                columns: [
                                    { title: "EmployeeId", field: "EmployeeId", visible: false, },
                                    { title: "Customer Name", field: "EmployeeName" },
                                    { title: "ParentId", field: "ParentId", visible: false },
                                    { title: "Target Value", field: "TargetValue" },
                                    {
                                        title: "Achived Value", field: "AchievedTarget", cellClick: function (e, cell) {
                                            instance.currentRow = cell.getRow();
                                            instance.fileCacheHelper.loadJsFile('apps/tm/targets/components/w_tagwisetarget.js', function () {
                                                Bizgaze.Apps.TM.Targets.Components.TagWiseTarget.Instance().loadForm(instance.targetDefinitionId, cell.getRow().getData().EmployeeId, 0, null, 0);
                                            });
                                        }, formatter: function (cell) {
                                            instance.currentRow = cell.getRow();
                                            var achive = cell.getValue();
                                            return "<span class='text-primary' font-weight:bold;'>" + achive + "</span>";
                                        }
                                    },
                                    { title: "Percentage", field: "Percentage" },
                                ],
                                pagination: "local",
                                paginationSize: 15,
                                dataTree: false,
                                dataTreeSelectPropagate: true,
                            });
                        }
                        targetTabulatorSearch(containerId) {
                            const instance = this;
                            const containerEl = $(`#${containerId}`);
                            const searchEl = containerEl.find('.target-search-input');
                            const loaderEl = containerEl.find('.main-search-loader');
                            const clearEl = containerEl.find('.target-search-clear');
                            let tableEl = instance.employeeData;
                            let totalResponse = instance.totalEmployeeResponse;
                            let initialTableData = instance.initialEmployeeData;
                            clearTimeout(instance.searchTimer);
                            loaderEl.removeClass('d-none');
                            clearEl.addClass('d-none');
                            instance.searchTimer = setTimeout(function () {
                                let searchVal = searchEl.val();
                                searchVal = searchVal.trim().toLowerCase();
                                if (searchVal) {
                                    if (containerEl.find('#CustomerTargetAchiveWidget').length > 0) {
                                        instance.customerData.setFilter("EmployeeName", "like", searchVal);
                                    }
                                    else {
                                        const searchedData = totalResponse.filter(employee => {
                                            return employee.EmployeeName.toLowerCase().includes(searchVal) && !employee.EmployeeId.includes('p');
                                        });
                                        tableEl.replaceData(searchedData);
                                        tableEl.redraw(true);
                                    }
                                    clearEl.removeClass('d-none');
                                }
                                else {
                                    if (containerEl.find('#CustomerTargetAchiveWidget').length === 0) {
                                        tableEl.replaceData(initialTableData);
                                        tableEl.redraw(true);
                                    }
                                    clearEl.addClass('d-none');
                                }
                                loaderEl.addClass('d-none');
                            }, 1000);
                        }
                        clearTargetSearch(containerId) {
                            const instance = this;
                            const containerEl = $(`#${containerId}`);
                            let initialTableData = instance.initialEmployeeData;
                            containerEl.find('.target-search-input').val('');
                            containerEl.find('.target-search-clear,.main-search-loader').addClass('d-none');
                            if (containerEl.find('#CustomerTargetAchiveWidget').length > 0) {
                                instance.customerData.setFilter("EmployeeName", "like", "");
                                return;
                            }
                            instance.employeeData.replaceData(initialTableData);
                            instance.employeeData.redraw(true);
                        }
                        static Instance() {
                            if (this.instance === undefined) {
                                this.instance = new TargetVSAchieve();
                            }
                            return this.instance;
                        }
                    }
                    Components.TargetVSAchieve = TargetVSAchieve;
                })(Components = Targets.Components || (Targets.Components = {}));
            })(Targets = TM.Targets || (TM.Targets = {}));
        })(TM = Apps.TM || (Apps.TM = {}));
    })(Apps = Bizgaze.Apps || (Bizgaze.Apps = {}));
})(Bizgaze || (Bizgaze = {}));