WebBuild/wwwroot/platform/widgets/components/_widget.js

var Unibase;
(function (Unibase) {
    let Platform;
    (function (Platform) {
        let Widgets;
        (function (Widgets) {
            let Components;
            (function (Components) {
                class _Widget extends Platform.Core.BaseComponent {
                    constructor() {
                        super(...arguments);
                        this.existingwidgets = [];
                        this.existingwidetsname = [];
                    }
                    cssFiles() {
                        return [];
                    }
                    jsFiles() {
                        return ["platform/widgets/components/widgethiddenfields.js", "tenants/themes/compact/widgets/reportwidgets/default.js", "tenants/themes/compact/widgets/kpiwidgets/default.js", 'tenants/themes/compact/widgets/detailwidgets/default.js', 'tenants/themes/compact/widgets/detailwidgets/singledata.js', 'tenants/themes/compact/widgets/detailwidgets/singlecolumn.js', 'tenants/themes/compact/widgets/detailwidgets/singlecolumn_noborder.js', "tenants/themes/compact/widgets/kpiwidgets/comparision.js", "tenants/themes/compact/widgets/kpiwidgets/icon.js", "tenants/themes/compact/widgets/kpiwidgets/valuewithpercentage.js", "tenants/themes/compact/widgets/kpiwidgets/twovalue.js", "tenants/themes/compact/widgets/reportwidgets/withnoheaderandfooter.js", "platform/widgets/components/widgetpermission.js", "tenants/themes/compact/widgets/kpiwidgets/twovaluebgcolor.js", "tenants/themes/compact/widgets/kpiwidgets/valuewithpercentagebgcolor.js", "tenants/themes/compact/widgets/kpiwidgets/twovaluecenterline.js", "tenants/themes/compact/widgets/kpiwidgets/owlcarouselslider.js", "tenants/themes/compact/widgets/kpiwidgets/valuewithpercentageprogressbar.js", "tenants/themes/compact/widgets/kpiwidgets/kpi_fulfillment.js", "tenants/themes/compact/widgets/kpiwidgets/carouselslider.js", "tenants/themes/compact/widgets/kpiwidgets/carouselsliderbgcolor.js", "platform/analytics/components/reportviewer/widgetreportviewer.js", "platform/analytics/components/reportviewer/reportviewer.js", "platform/analytics/enums/reporttype.js", "platform/analytics/providers/ireportviewer.js", "platform/analytics/components/reportbuilder/reportbuilder.js", "platform/analytics/enums/viewertype.js", "platform/analytics/components/tableviewer/tableviewer.js", "platform/analytics/components/templateviewer/templateviewer.js", "platform/analytics/components/reportviewer/_reportviewer.js", "platform/widgets/managers/widgetmanager.js", "tenants/themes/compact/widgets/detailwidgets/customdesign.js", "platform/core/enums/expressionoperator.js", "platform/analytics/components/commonfilter/_commonfilter.js", "/platform/apps/enums/appconfigurationtypes.js", "tenants/themes/compact/widgets/kpiwidgets/comparisionrightbarcolor.js", "tenants/themes/compact/widgets/kpiwidgets/comparisionbottombarcolor.js", "tenants/themes/compact/widgets/kpiwidgets/singlevalueborder.js", "tenants/themes/compact/widgets/kpiwidgets/twovaluebottombarcolor.js", "tenants/themes/compact/widgets/kpiwidgets/singlevaluepiechart.js", "tenants/themes/compact/widgets/kpiwidgets/iconbgcolor.js", "tenants/themes/compact/widgets/kpiwidgets/iconcolor.js", "tenants/themes/compact/widgets/kpiwidgets/iconleftbarcolor.js"];
                    }
                    html(id, containerid) {
                        let html = '';
                        return html;
                    }
                    load(id, containerid, callback) {
                    }
                    widgetsModal(InstalledAppId, event) {
                        var instance = this;
                        $(".biz-submenu").css({ "z-index": "" });
                        $(".biz-layout-3-left-nav").css({ "z-index": "" });
                        $(".toplayout-structures-panel").css({ "z-index": "1040" });
                        let structureId = $(event).parents('.droppablePlaceCol').attr('id');
                        instance.fileCacheHelper.loadJsFile('platform/widgets/enums/widgetlayout.js', null);
                        instance.fileCacheHelper.loadJsFile('platform/widgets/enums/widgettype.js', null);
                        let html = `<div class="modal fade dashboardWidgetModal px-2" id="dashboardWidgetModal" tabindex="-1" role="dialog" aria-labelledby="dashboardWidgetModal" aria-hidden="true" data-backdrop="static">
  <div class="WidgetModal modal-dialog h-100 my-0 py-25" role="document">
    <div class="modal-content h-100 bg-white p-0">
      <div class="modal-header d-block px-15 pb-0 border-0">
        <ul class="d-flex list-inline justify-content-between align-items-center">
        <li class="w-90 mr-2">
            <div class="nav-header header-wth-search p-0 d-flex justify-content-center">
            <div class="card-search-bar"> <div class="search-wrapper"> <input class="form-control txt_global_search" id="widget-search" type="text" placeholder="Search" autocomplete="off"> <i class="fa fa-search search-left-icon biz-highlight-bg-color"></i> <a href="javascript:;" class="filter-icon biz-highlight-bg-color" id="filter-icon_modal_bizgaze_edit_1633325781"> <i class="las la-filter"></i> </a> <a href="javascript:;" class="search-clear-icon biz-highlight-bg-color d-none" id="search-clear-icon_modal_bizgaze_edit_1633325781"> <i class="zmdi zmdi-close"></i> </a> </div><span class="search-icon-wrapper"> <a href="javascript:;" class="search_close_icon biz-text-dark d-none" id="search_close_icon_modal_bizgaze_edit_1633325781"><i class="fa fa-close"></i> </a> </span></div>
            </div>
        </li>
        <li class="d-none d-xl-block">
            <a class="btn btn-outline-primary mr-auto ml-auto px-2 py-1" href="javascript:;" id="AddWidget_btnCreateWidget"  onclick="Unibase.Platform.Widgets.Components._Widget.Instance().createWidget()">
                Create Widget
            </a>
        </li>
        </ul>
        <ul class="nav nav-tabs d-flex flex-row border-0 gap-10 my-10" id="widgetsModal_popup" role="tablist">
          <li class="nav-item" role="presentation">
            <a class="nav-link active allWidgetsModal" id="all-tab" data-toggle="tab" href="#allWidgetsModal" role="tab" aria-controls="all" aria-selected="true" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(0,-1,${structureId})">
               ALL
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="kpi-tab" data-toggle="tab" href="#kpiWidgetsModal" role="tab" aria-controls="kpi" aria-selected="false" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(0,Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Kpi),${structureId})">
                KPI'S
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="chart-reports-tab" data-toggle="tab" href="#chartReportsModal" role="tab" aria-controls="chart-reports" aria-selected="false" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(0,Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Report),${structureId})">
                Charts & Reports
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="user-design-tab" data-toggle="tab" href="#userDesignedModal" role="tab" aria-controls="userDesignedModal" aria-selected="false"
onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(0,Number(Unibase.Platform.Widgets.Enums.WidgetLayout.UserDesigned),${structureId})">
                User Design
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="details-tab" data-toggle="tab" href="#detailsWidgetModel" role="tab" aria-controls="detailsWidgetModal" aria-selected="false" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(0,Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Detail),${structureId})">
                Details
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="details-tab" data-toggle="tab" href="#commonwidgetsmodal" role="tab" aria-controls="commonwidgetsmodal" aria-selected="false" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getWidgets(Number(Unibase.Platform.Widgets.Enums.WidgetType.CommonWidget),-1,${structureId})">
                Common Widgets
            </a>
          </li>
          <li class="nav-item" role="presentation">
            <a class="nav-link" id="details-tab" data-toggle="tab" href="#addedwidgetsmodal" role="tab" aria-controls="addedwidgetsmodal" aria-selected="false" onclick = "Unibase.Platform.Widgets.Components._Widget.Instance().getAddedWidgets(null,null,${structureId})">
                 Added Widgets
            </a>
          </li>
        </ul>
      </div>
      <div data-simplebar class="simple-scroll-bar modal-body tab-content px-3 py-0 mt-0" id="dashboardWidget-modal-content">
        <div class="tab-pane fade show active" id="allWidgetsModal" role="tabpanel" aria-labelledby="all-tab">
            <ul class="row" id="allWidgetsBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="kpiWidgetsModal" role="tabpanel" aria-labelledby="kpi-tab">
            <ul class="row" id="kpiWidgetsBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="chartReportsModal" role="tabpanel" aria-labelledby="chart-reports-tab">
            <ul class="row" id="reportwidgetsBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="userDesignedModal" role="tabpanel" aria-labelledby="details-tab">
            <ul class="row" id="userDesignedBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="detailsWidgetModel" role="tabpanel" aria-labelledby="details-tab">
            <ul class="row" id="detailsWidgetBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="commonwidgetsmodal" role="tabpanel" aria-labelledby="details-tab">
            <ul class="row" id="commonwidgetsBind">
            </ul>
        </div>
        <div class="tab-pane fade" id="addedwidgetsmodal" role="tabpanel" aria-labelledby="details-tab">
            <ul class="row" id="addedwidgetsBind">
            </ul>
        </div>
      </div>
      <div class="modal-footer border-0 px-15 py-10 d-flex justify-content-between bg-white">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-success" data-dismiss="modal" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().saveWidgets(${structureId})">Proceed</button>
      </div>
    </div>
    </div>
  </div>
</div>`;
                        $('#detailsWidgetModal').remove();
                        if (InstalledAppId != 0) {
                            $('#layout-detail').after(html);
                            $("#dashboardWidgetModal").modal('show').css({ 'padding-left': '' });
                            $('.allWidgetsModal').trigger('click');
                            $('.portletwidget-item').each(function (index, elem) {
                                let widgetid = +$(this).attr('data-widgetid');
                                let widgetName = $(this).attr('data-widgetname');
                                let state = 'exist';
                                if (instance.existingwidgets.indexOf(widgetid) < 0) {
                                    instance.existingwidgets.push(widgetid);
                                    instance.existingwidetsname.push({ "widgetId": widgetid, widgetName, state });
                                }
                            });
                        }
                        if (InstalledAppId == 0) {
                            $("#dashboardwidget-container-outer").after(html);
                            $("#dashboardWidgetModal").modal('show');
                            $('.allWidgetsModal').trigger('click');
                            $('.dashboardwidget-addeditem').each(function (index, elem) {
                                let hf_portletwidgetId = $(this).find('.hf_portletwidgetId').val();
                                let widgetid = +$(this).attr('id');
                                let widgetName = $(this).find('#hf_widgetName_' + hf_portletwidgetId).val();
                                let state = 'exist';
                                if (instance.existingwidgets.indexOf(widgetid) < 0) {
                                    instance.existingwidgets.push(widgetid);
                                    instance.existingwidetsname.push({ "widgetId": widgetid, widgetName, state });
                                }
                            });
                        }
                        $('#dashboardWidgetModal').on('hide.bs.modal', function (event) {
                            instance.existingwidetsname = [];
                            instance.existingwidgets = [];
                            $(this).remove();
                            $("#bizgaze_body").addClass("edit-dashboard-mode");
                            $(".biz-submenu").css({ "z-index": "9999" });
                            $(".biz-layout-3-left-nav").css({ "z-index": "9999" });
                            $(".toplayout-structures-panel").css({ "z-index": "9999" });
                        });
                        $("#widget-search").on("keyup", function () {
                            $('#dashboardWidget-modal-content li').removeClass('hidden');
                            let searchTerm = String($(this).val()).toUpperCase();
                            let id = $('#widgetsModal_popup .nav-item .nav-link.active').attr('href');
                            let ul = $(id + ' ul').attr('id'), widgetName;
                            $('#' + ul + ' li').each(function () {
                                widgetName = $(this).attr('data-widgetname');
                                if (widgetName.toUpperCase().indexOf(searchTerm) > -1) {
                                    $(this).removeClass('hidden');
                                    let checklength = $(this).find(".selected").length;
                                    if (checklength == 1) {
                                        $(this).removeClass("d-none");
                                        $(this).find("a").addClass("opacity-40");
                                        $(this).append('<div class="added_widget_dispalytext mr-25 opacity-95 position-absolute r-0 t-0 text-center text-success" style="margin-top: -1px;">Already Added</div>');
                                    }
                                }
                                else {
                                    $(this).addClass('hidden');
                                }
                            });
                            if ($("#widget-search").val() == "") {
                                $(".widgets_card").each(function () {
                                    let checklength = $(this).find(".selected").length;
                                    if (checklength == 1) {
                                        $(this).addClass("d-none");
                                        $(this).find("a").removeClass("opacity-40");
                                        $(this).find(".added_widget_dispalytext").remove();
                                        $(this).find(".selected").addClass("d-none");
                                    }
                                });
                            }
                        });
                    }
                    loadDetailPageModal(widgets, bindingDiv, installedAppId, portletId, structuredesignId) {
                        let instance = this, widgetData = widgets.result, allhtml = '', kpihtml = '', detailhtml = '', reporthtml = '';
                        for (var a = 0; a < widgetData.length; a++) {
                            allhtml = '<li class="col-md-3 my-2" data-widgetType="' + bindingDiv + '" data-widgetName="' + widgetData[a].WidgetName + '"><a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,' + structuredesignId + ');"><div class="p-3 h-55p bg-grey-light-5 search" data-isselect="false" data-widgetid="' + widgetData[a].WidgetId + '" data-typeWidgets="" data-uniqueWidgetId = "' + widgetData[a].UniqueId + '" data-widgetName="' + widgetData[a].WidgetName + '"><p class="text-dark">' + widgetData[a].WidgetName + '</p></div></a></li>';
                            $('#allWidgetsBind').append(allhtml);
                            $('#commonwidgetsBind').append(allhtml);
                        }
                        if (bindingDiv == 'common-widgets') {
                            let kpi_Widgets = widgetData.filter(x => x.WidgetLayoutName == "KPI");
                            for (var k = 0; k < kpi_Widgets.length; k++) {
                                kpihtml = '<li class="col-md-3 my-2" data-widgetType="' + bindingDiv + '" data-widgetName="' + kpi_Widgets[k].WidgetName + '"><a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,' + structuredesignId + ');"><div class="p-3 h-55p bg-grey-light-5" data-isselect="false" data-widgetid="' + kpi_Widgets[k].WidgetId + '" data-typeWidgets="" data-uniqueWidgetId = "' + kpi_Widgets[k].UniqueId + '" data-widgetName="' + kpi_Widgets[k].WidgetName + '"><p class="text-dark">' + kpi_Widgets[k].WidgetName + '</p></div></a></li>';
                                $('#kpiWidgetsBind').append(kpihtml);
                            }
                            widgetData.filter(x => x.widgetlayoutname == "Detail");
                            var details_Widgets = widgetData.filter(function (o) { return o.WidgetLayoutName === "Detail"; });
                            for (var d = 0; d < details_Widgets.length; d++) {
                                detailhtml = '<li class="col-md-3 my-2" data-widgetType="' + bindingDiv + '" data-widgetName="' + details_Widgets[d].WidgetName + '"><a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,' + structuredesignId + ');"><div class="p-3 h-55p bg-grey-light-5" data-isselect="false" data-widgetid="' + details_Widgets[d].WidgetId + '" data-typeWidgets="" data-uniqueWidgetId = "' + details_Widgets[d].UniqueId + '" data-widgetName="' + details_Widgets[d].WidgetName + '"><p class="text-dark">' + details_Widgets[d].WidgetName + '</p></div></a></li>';
                                $('#detailsWidgetBind').append(detailhtml);
                            }
                            var report_Widgets = widgetData.filter(function (o) { return o.WidgetLayoutName === "Report"; });
                            for (var r = 0; r < report_Widgets.length; r++) {
                                reporthtml = '<li class="col-md-3 my-2" data-widgetType="' + bindingDiv + '" data-widgetName="' + report_Widgets[r].WidgetName + '"><a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,' + structuredesignId + ');"><div class="p-3 h-55p bg-grey-light-5" data-widgetid="' + report_Widgets[r].WidgetId + '" data-isselect="false" data-typeWidgets="" data-uniqueWidgetId = "' + report_Widgets[r].UniqueId + '" data-widgetName="' + report_Widgets[r].WidgetName + '"><p class="text-dark">' + report_Widgets[r].WidgetName + '</p></div></a></li>';
                                $('#reportwidgetsBind').append(reporthtml);
                            }
                        }
                        if (bindingDiv == 'already-added-widgets') {
                            var already_Widgets = widgetData;
                            for (var w = 0; w < already_Widgets.length; r++) {
                                reporthtml = '<li class="col-md-3 my-2" data-widgetType="' + bindingDiv + '" data-widgetName="' + already_Widgets[w].WidgetName + '"><a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,' + structuredesignId + ');"><div class="p-3 h-55p bg-grey-light-5" data-widgetid="' + already_Widgets[w].WidgetId + '" data-isselect="false" data-typeWidgets="" data-uniqueWidgetId = "' + already_Widgets[w].UniqueId + '" data-widgetName="' + already_Widgets[w].WidgetName + '"><p class="text-dark">' + already_Widgets[w].WidgetName + '</p></div></a></li>';
                                $('#addedwidgetsBind').append(already_Widgets);
                            }
                        }
                        for (var i = 0; i < widgetData.length; i++) {
                            var html = '<li class="nav-item widget-item widget-added-item mt-10 list-widget-' + widgetData[i].WidgetId + ' widgetid-' + widgetData[i].WidgetId + '' + bindingDiv + ' dsl-block datagroup" data-toggle="popover-hover" data-img="tenants/themes/default/imgs/imgpopover.png" value=' + widgetData[i].WidgetId + ' id="ListWidgets">' +
                                '<input type="hidden" value=' + widgetData[i].WidgetId + ' id="hf_ListwidgetId" />' +
                                '<input type="hidden" value=' + widgetData[i].WidgetUrl + ' id="widgetUrl-' + widgetData[i].WidgetId + '" />' +
                                '<input type="hidden" value="' + widgetData[i].WidgetName + '" id="widgetName" />' +
                                '<input type="hidden" value=' + widgetData[i].IsFiltarable + ' id="IsFiltarable" />' +
                                '<input type="hidden" value=' + widgetData[i].UniqueId + ' id="hf_WidgetUniqueId" />' +
                                '<input type="hidden" value=' + widgetData[i].Width + ' id="widgetWidth" />' +
                                '<span><i class="las la-braille dragger"></i>' +
                                '<span title="' + widgetData[i].WidgetName + '" class="dsl-block-name" style="color:#2f343a !important" >' + widgetData[i].WidgetName + '</span>' +
                                '</span>' +
                                '</li>';
                            $('.' + bindingDiv + ':last').after(html);
                        }
                        instance.selectedWidget();
                    }
                    selectedWidget() {
                        let selectedHtml = `<div class="selected">
                                               <i class="fa fa-check-circle text-success font-20"></i>
                                            </div>`;
                        let widgetidSelect;
                        $('#dashboardwidget-container').find('.widgetdataHere').each(function () {
                            if ($(this).attr('data-strctwidgetindex') == undefined) {
                                widgetidSelect = $(this).attr('id');
                            }
                            else {
                                let widgetidArr = [];
                                widgetidArr = $(this).attr('id').split('-');
                                widgetidSelect = widgetidArr[1];
                            }
                            $('div[data-widgetid=' + widgetidSelect + ']').closest('li').find('.selected').remove();
                            $('div[data-widgetid=' + widgetidSelect + ']').closest('li').append(selectedHtml);
                        });
                    }
                    selectWidget(e, structuredesignId) {
                        let instance = this;
                        let installedappid = Number(Unibase.Themes.Providers.DetailHelper.installedAppId), portletId;
                        if (installedappid != 0) {
                            portletId = $('#layout-detail-tabs .nav-link.active').find('#hf_PortletId').val();
                        }
                        else {
                            portletId = $('._bizgaze_detail_container').find('#hf_PortletId').val();
                        }
                        let widgetId = $(e).find('div').attr('data-widgetid');
                        let widgetName = $(e).find('p').text();
                        let selectedHtml = `<div class="selected">
                            <i class="fa fa-check-circle text-success font-20"></i>
                                </div>`;
                        if ($(e).find('div.search').attr('data-isselect') == 'true') {
                            $(e).find('div.search').attr('data-isselect', 'false');
                            $(e).find('div.selected').remove();
                            let state = "removed";
                            let findindex = instance.existingwidgets.indexOf(+widgetId);
                            if (findindex > -1) {
                                instance.existingwidetsname[findindex].state = state;
                            }
                            else {
                                instance.existingwidgets.push(+widgetId);
                                instance.existingwidetsname.push({ widgetId: +widgetId, widgetName, state });
                            }
                            if (installedappid != 0) {
                                Unibase.Themes.Compact.Components.Details.Instance().isPortletModified = false;
                            }
                            if (installedappid == 0) {
                                $('#' + structuredesignId).find('#' + widgetId).remove();
                            }
                        }
                        else if ($(e).find('div').attr('data-isselect') == 'false') {
                            $(e).find('div').attr('data-isselect', 'true');
                            $(e).find('div').append(selectedHtml);
                            let state = 'added';
                            let findindex = instance.existingwidgets.indexOf(+widgetId);
                            if (findindex > -1) {
                                instance.existingwidetsname[findindex].state = state;
                            }
                            else {
                                instance.existingwidgets.push(+widgetId);
                                instance.existingwidetsname.push({ widgetId: +widgetId, widgetName, state });
                            }
                            if (installedappid != 0) {
                                Unibase.Themes.Compact.Components.Details.Instance().isPortletModified = true;
                            }
                            if (installedappid == 0) {
                            }
                        }
                    }
                    getAppWidgets(widgettype, widgetlayout, _AppsStructureId) {
                        let instance = this;
                        Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("platform/widgets/managers/widgetmanager.js", function () {
                            var installedAppId = Unibase.Themes.Providers.DetailHelper.installedAppId;
                            Unibase.Platform.Widgets.Managers.WidgetManager.Instance().getAppWidgets_(installedAppId, widgettype, widgetlayout).then(function (response) {
                                var _a, _b, _c;
                                if (response != null) {
                                    var widgetData = response.result;
                                    $('#commonwidgetsBind').html('');
                                    $('#detailsWidgetBind').html('');
                                    $('#userDesignedBind').html('');
                                    $('#reportwidgetsBind').html('');
                                    $('#kpiWidgetsBind').html('');
                                    $('#allWidgetsBind').html('');
                                    for (var i = 0; i < widgetData.length; i++) {
                                        let findexistingwidget = instance.existingwidgets.indexOf(+widgetData[i].WidgetId);
                                        var html = `<li class="col-md-3 my-2 widgets_card" data-widgettype="${widgetData[i].WidgetTypeId}" data-widgetname="${widgetData[i].WidgetName}">
                                                        <div class="card flex-row p-3 bg-grey-light-5 align-items-center justify-content-between">
                                                <a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,${_AppsStructureId});">
                                                <div class="search d-flex justify-content-between align-items-center" data-isselect="${((_a = instance.existingwidetsname[findexistingwidget]) === null || _a === void 0 ? void 0 : _a.state) == 'exist' || ((_b = instance.existingwidetsname[findexistingwidget]) === null || _b === void 0 ? void 0 : _b.state) == 'added' ? true : false}" data-widgetid="${widgetData[i].WidgetId}" data-typewidget="${widgetData[i].WidgetTypeId}" data-uniquewidgetid="${widgetData[i].UniqueId}" data-widgetname="${widgetData[i].WidgetName}">
                                                <p class="text-dark text-truncate w-250p mr-2">${widgetData[i].WidgetName}</p>`;
                                        if (findexistingwidget > -1) {
                                            if (((_c = instance.existingwidetsname[findexistingwidget]) === null || _c === void 0 ? void 0 : _c.state) != 'removed') {
                                                html += `<div class="selected">
                                                   <i class="fa fa-check-circle text-success font-20"></i>
                                                </div>
                                        </div></a><a href="javascript:;" onclick ="Unibase.Platform.Widgets.Components.Widget.Instance().loadWidgetData(${widgetData[i].WidgetId},${installedAppId},true,0,true)"><i class="la-edit las"></i></a></div></li>`;
                                            }
                                        }
                                        else {
                                            html += '</div></a><a href="javascript:;" onclick ="Unibase.Platform.Widgets.Components.Widget.Instance().loadWidgetData(' + widgetData[i].WidgetId + ',' + installedAppId + ',true,0,true)" ><i class="la-edit las"></i></a></div></li >';
                                        }
                                        if (widgettype == 0 && widgetlayout == -1) {
                                            $('#allWidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Kpi)) {
                                            $('#kpiWidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Report)) {
                                            $('#reportwidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.UserDesigned)) {
                                            $('#userDesignedBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Detail)) {
                                            $('#detailsWidgetBind').append(html);
                                        }
                                        else if (widgettype == Number(Unibase.Platform.Widgets.Enums.WidgetType.CommonWidget)) {
                                            $('#commonwidgetsBind').append(html);
                                        }
                                        $(".widgets_card").each(function () {
                                            var checklength = $(this).find(".selected").length;
                                            if (checklength == 1) {
                                                $(this).addClass("d-none");
                                            }
                                        });
                                    }
                                }
                            });
                        });
                    }
                    getAddedWidgets() {
                        let installedappid = Unibase.Themes.Providers.DetailHelper.installedAppId;
                        let instance = this;
                        $('#addedwidgetsBind').html('');
                        $('#commonwidgetsBind').html('');
                        $('#detailsWidgetBind').html('');
                        $('#userDesignedBind').html('');
                        $('#reportwidgetsBind').html('');
                        $('#kpiWidgetsBind').html('');
                        $('#allWidgetsBind').html('');
                        if (installedappid != 0) {
                            $('.portletwidget-item').each(function (index, elem) {
                                let findexistingwidget = instance.existingwidgets.indexOf(+$(this).attr('data-widgetid'));
                                var html = `<li class="col-md-3 my-2 added_widgets" data-widgetid="${$(this).attr('data-widgetid')}" data-widgetname="${$(this).attr('data-widgetname')}">
                                                <a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,undefined);">
                                                <div class="card flex-row justify-content-between align-items-center p-3 h-55p bg-grey-light-5 search" data-isselect="${instance.existingwidetsname[findexistingwidget].state != 'removed' ? true : false}" data-widgetid="${$(this).attr('data-widgetid')}" data-typewidgets="" data-uniquewidgetid="" data-widgetname="${$(this).attr('data-widgetname')}">
                                                <p class="text-dark text-truncate mr-2">${$(this).attr('data-widgetname')}</p>`;
                                if (findexistingwidget > -1) {
                                    if (instance.existingwidetsname[findexistingwidget].state != 'removed') {
                                        html += `<div class="selected">
                                                   <i class="fa fa-check-circle text-success font-20"></i>
                                                </div>
                                        </div></a></li>`;
                                    }
                                }
                                else {
                                    html += '</div></a></li>';
                                }
                                $('#addedwidgetsBind').append(html);
                            });
                        }
                        else if (installedappid == 0) {
                            $('.dashboardwidget-addeditem').each(function (index, elem) {
                                let hf_portletwidgetId = $(this).find('.hf_portletwidgetId').val();
                                let findexistingwidget = instance.existingwidgets.indexOf(+$(this).attr('id'));
                                let widgetId = $(this).attr('id');
                                let widgetItem = $(this).find('#hf_portletwidgetId').val();
                                let widgetName;
                                if ($(this).find('#hf_widgetName_' + widgetItem).val() != undefined) {
                                    widgetName = $(this).find('#hf_widgetName_' + widgetItem).val();
                                }
                                else {
                                    widgetName = $(this).find('#hf_kpi_widgetName_' + widgetId).text();
                                }
                                var html = `<li class="col-md-3 my-2" data-widgetid="${widgetId}" data-widgetname="${widgetName}">
                                                <a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,undefined);">
                                                <div class="card flex-row justify-content-between align-items-center p-3 h-55p bg-grey-light-5 search" data-isselect="${instance.existingwidetsname[findexistingwidget].state != 'removed' ? true : false}" data-widgetid="${$(this).attr('id')}" data-typewidgets="" data-uniquewidgetid="" data-widgetname="${$(this).find('#hf_widgetName_' + hf_portletwidgetId).val()}">
                                                <p class="text-dark text-truncate mr-2">${widgetName}</p>`;
                                if (findexistingwidget > -1) {
                                    if (instance.existingwidetsname[findexistingwidget].state != 'removed') {
                                        html += `<div class="selected">
                                                    <i class="fa fa-check-circle text-success font-20"></i>
                                                 </div>
                                         </div></a></li>`;
                                    }
                                }
                                else {
                                    html += '</div></a></li>';
                                }
                                $('#addedwidgetsBind').append(html);
                            });
                        }
                    }
                    getWidgets(widgettype, widgetlayout, structureId) {
                        let installedappid = Unibase.Themes.Providers.DetailHelper.installedAppId;
                        let instance = this;
                        Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("platform/widgets/managers/widgetmanager.js", function () {
                            if (installedappid == 0) {
                                instance.getDashboardWidgets(widgettype, widgetlayout, structureId.id);
                            }
                            else if (installedappid != 0) {
                                let AppsStructureId;
                                if (structureId != undefined) {
                                    AppsStructureId = $(structureId).attr('id');
                                }
                                instance.getAppWidgets(widgettype, widgetlayout, AppsStructureId);
                            }
                        });
                    }
                    getDashboardWidgets(widgettype, widgetlayout, structureId) {
                        let instance = this;
                        Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile("platform/widgets/managers/widgetmanager.js", function () {
                            var installedAppId = Unibase.Themes.Providers.DetailHelper.installedAppId;
                            Unibase.Platform.Widgets.Managers.WidgetManager.Instance().getDashboardWidgets(widgetlayout, widgettype).then(function (response) {
                                var _a, _b;
                                if (response != null) {
                                    var widgetData = response.result;
                                    $('#commonwidgetsBind').html('');
                                    $('#detailsWidgetBind').html('');
                                    $('#userDesignedBind').html('');
                                    $('#reportwidgetsBind').html('');
                                    $('#kpiWidgetsBind').html('');
                                    $('#allWidgetsBind').html('');
                                    for (var i = 0; i < widgetData.length; i++) {
                                        let findIndex = instance.existingwidgets.indexOf(widgetData[i].WidgetId);
                                        var html = `<li class=" col-md-3 my-2 widgets_card" data-widgettype="${widgetData[i].WidgetTypeId}" data-widgetname="${widgetData[i].WidgetName}">
                                                <a href="javascript:;" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().selectWidget(this,${structureId});">
                                                <div class="card h-100 mb-0 p-3 bg-grey-light-5 search justify-content-between align-items-center flex-row" data-isselect="${((_a = instance.existingwidetsname[findIndex]) === null || _a === void 0 ? void 0 : _a.state) == 'exist' || ((_b = instance.existingwidetsname[findIndex]) === null || _b === void 0 ? void 0 : _b.state) == 'added' ? true : false}" data-widgetid="${widgetData[i].WidgetId}" data-typewidget="${widgetData[i].WidgetTypeId}" data-uniquewidgetid="${widgetData[i].UniqueId}" data-widgetname="${widgetData[i].WidgetName}">
                                                <p class="text-dark text-truncate mr-2">${widgetData[i].WidgetName}</p>`;
                                        if (findIndex > -1) {
                                            if (instance.existingwidetsname[findIndex].state != 'removed') {
                                                html += `<div class="selected">
                                                   <i class="fa fa-check-circle text-success font-20"></i>
                                                </div>
                                        </div></a></li>`;
                                            }
                                        }
                                        else {
                                            html += '</div></a></li>';
                                        }
                                        if (widgettype == 0 && widgetlayout == -1) {
                                            $('#allWidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Kpi)) {
                                            $('#kpiWidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Report)) {
                                            $('#reportwidgetsBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.UserDesigned)) {
                                            $('#userDesignedBind').append(html);
                                        }
                                        else if (widgetlayout == Number(Unibase.Platform.Widgets.Enums.WidgetLayout.Detail)) {
                                            $('#detailsWidgetBind').append(html);
                                        }
                                        else if (widgettype == Number(Unibase.Platform.Widgets.Enums.WidgetType.CommonWidget)) {
                                            $('#commonwidgetsBind').append(html);
                                        }
                                        $(".widgets_card").each(function () {
                                            var checklength = $(this).find(".selected").length;
                                            if (checklength == 1) {
                                                $(this).addClass("d-none");
                                            }
                                        });
                                    }
                                }
                            });
                        });
                    }
                    saveWidgets(structureId) {
                        let instance = this;
                        console.log(instance.existingwidetsname);
                        let installedappid = Unibase.Themes.Providers.DetailHelper.installedAppId;
                        let VisibleContainerId = Unibase.Platform.Helpers.NavigationHelper.ModalContainerIds[Unibase.Platform.Helpers.NavigationHelper.ModalContainerIds.length - 1];
                        instance.existingwidetsname.forEach((elem, index) => {
                            if (elem.state == 'added') {
                                if ($('#' + VisibleContainerId).find('.portletwidget-item.widgetid-' + elem.widgetId).length == 0) {
                                    let installedappid = Number(Unibase.Themes.Providers.DetailHelper.installedAppId), portletId;
                                    if (installedappid != 0) {
                                        portletId = $('#' + VisibleContainerId).find('#layout-detail-tabs .nav-link.active').find('#hf_PortletId').val();
                                    }
                                    else {
                                        portletId = $('#' + VisibleContainerId).find('._bizgaze_detail_container').find('#hf_PortletId').val();
                                    }
                                    let widgetId = elem.widgetId;
                                    let widgetName = elem.widgetName;
                                    let sortable = "";
                                    if (Unibase.Themes.Compact.Components.Index.Instance().isAppStructureEnable) {
                                        sortable = "dashboardwidget-item px-0";
                                    }
                                    if (installedappid != 0) {
                                        let dropInPortlet = `<div class="portletwidget-item ${sortable} dashboarddisplaynone portletwidget-addeditem widgetItem-${widgetId} widgetid-${widgetId} col-sm-12 mb-sm-20 mb-2" id="${widgetId}" data-portletwidgetid="" data-widgetid="${widgetId}" data-portletid="${portletId}" data-widgetname="${widgetName}">
                                            <div class="card"><input type="hidden" value="${widgetId}" id="hf_widgetId"><input type="hidden" value="0" id="hf_widgetId_uniq"><div class="card-header"><div class="dragWidget dargwidget-${widgetId} pull-left" id="dragWidget"><a class="btn btn-icon btn-rounded btn-flush-primary flush-soft-hover"><span class="btn-icon-wrap"><i class="ti-fullscreen"></i></span></a></div><div class="card-action-wrap editwidget editwidget-${widgetId} pull-right m-t-sm m-r-lg" id="editwidget">
                                           <a href="javascript:;" class="inline-block btn btn-icon btn-rounded btn-flush-primary flush-soft-hover" title="Edit Widget" onclick="Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile('platform/widgets/components/widget.js',function () {Unibase.Platform.Widgets.Components.Widget.Instance().loadWidgetData(${widgetId},${installedappid}, true, 0));});"><span class="btn-icon-wrap"><i class="ti-pencil" id="EditWidget-${widgetId}"></i></span></a><a href="javascript:;" class="btn btn-icon btn-rounded btn-flush-primary flush-soft-hover" title="delete widget" onclick="Unibase.Platform.Widgets.Components.Widget.Instance().deletePortletWidgets(0,${widgetId})"><span class="btn-icon-wrap"><i class="ti-trash"></i></span></a></div></div><div class="card-body rounded-4 py-15 bg-white"><span class="biz-highlight-bg-color widget-font widget-title-link">${widgetName}</span></div></div></div>`;
                                        if (Unibase.Themes.Compact.Components.Index.Instance().isAppStructureEnable && structureId != undefined) {
                                            $('#' + VisibleContainerId).find(`#${structureId.id} .widgetplace:first`).append(dropInPortlet);
                                        }
                                        else {
                                            $('#' + VisibleContainerId).find('#tab-container').append(dropInPortlet);
                                        }
                                    }
                                    else if (installedappid == 0) {
                                        let dashboardHtml = `<div class="mt-2 dashboardwidget-item dashboarddisplaynone dashboardwidget-addeditem widgetItem-${widgetId} widgetid-${widgetId} w-100" id="${widgetId}"><div class="card"><input type="hidden" value="${widgetId}" id="hf_widgetId"><input type="hidden" value="0" id="hf_widgetId_uniq">
                                             <div class="card-header"><div class="dragWidget dargwidget-${widgetId} pull-left d-none" id="dragWidget"><a class="btn btn-icon btn-rounded btn-flush-primary flush-soft-hover"><span class="btn-icon-wrap"><i class="ti-fullscreen"></i></span></a></div><div class="card-action-wrap editwidget editwidget-${widgetId} pull-right m-t-sm m-r-lg" id="editwidget"><a href="javascript:;" class="inline-block btn btn-icon btn-rounded btn-flush-primary flush-soft-hover d-none" title="Edit Widget" onclick="Unibase.Platform.Helpers.FileCacheHelper.Instance().loadJsFile('platform/widgets/components/widget.js',function () {Unibase.Platform.Widgets.Components.Widget.Instance().loadWidgetData(${widgetId},${installedappid}, true, 0));});"><span class="btn-icon-wrap"><i class="ti-pencil" id="EditWidget-${widgetId}"></i></span></a><a href="javascript:;" class="btn btn-icon btn-rounded btn-flush-primary flush-soft-hover" title="delete widget" onclick="Unibase.Platform.Widgets.Components.Widget.Instance().deletePortletWidgets(0,${widgetId})"><span class="btn-icon-wrap"><i class="ti-trash"></i></span></a></div></div>
                                            <div class="card-body rounded-4 py-15 bg-white"><span class="biz-highlight-bg-color widget-font widget-title-link" id="hf_kpi_widgetName_${widgetId}">${widgetName}</span></div></div></div>`;
                                        $('#' + structureId.id).find('.widgetplace').first().append(dashboardHtml);
                                    }
                                }
                            }
                            else if (elem.state == 'removed') {
                                if (installedappid != 0) {
                                    $('.portletwidget-item.widgetid-' + elem.widgetId).find('a[title="delete widget"]').click();
                                }
                                else if (installedappid == 0) {
                                    $('.dashboardwidget-addeditem.widgetid-' + elem.widgetId).find('a[title="delete widget"]').click();
                                }
                                instance.existingwidgets = instance.existingwidgets.filter(id => id != +elem.widgetId);
                                instance.existingwidetsname = instance.existingwidetsname.filter(obj => obj.widgetId != elem.widgetId);
                            }
                        });
                    }
                    createWidget() {
                        $('#dashboardWidgetModal').modal('hide');
                        $('.dashboardcreatewidgetbtn').click();
                    }
                    structSetting(e) {
                        let instance = this;
                        let VisibleContainerId = Unibase.Platform.Helpers.NavigationHelper.Instance().getLastContainerId();
                        $('#' + VisibleContainerId).find("#structure_settingModal").remove();
                        let block_len, Blockhtml = '', paramater_id = [], bindMobile = [], bindTab = [], data = [];
                        block_len = $(e).parent().siblings().length;
                        $(e).parent().siblings().each(function (i, e) {
                            Blockhtml += '<li class="d-flex flex-column pt-1 pb-20" id="li_block_' + i + '"> <label for="txt_block_' + i + '" class="font-weight-600">Width - ' + i + ' <span class="text-danger">*</span></label> <input type="text" class="form-control shadow-none txt_block_' + i + '" data-isdynamic="false" placeholder="Width - ' + i + '*" data-placeholder="Enter Width - ' + i + '" data-validatename="Width - ' + i + '" data-label="Width - ' + i + ' *" autocomplete="off"> </li>';
                            let id = $(this).attr('id');
                            paramater_id.push(id);
                            if ($('#' + VisibleContainerId).find("#" + id).attr('data-mobile_settingwidth') != undefined) {
                                bindMobile = $('#' + VisibleContainerId).find("#" + id).attr('data-mobile_settingwidth').split('|');
                            }
                            if ($('#' + VisibleContainerId).find("#" + id).attr('data-tab_settingwidth') != undefined) {
                                bindTab = $('#' + VisibleContainerId).find("#" + id).attr('data-tab_settingwidth').split('|');
                            }
                            data.push({ "Mobile": bindMobile[i], "Tab": bindTab[i], "id": id, "index": i });
                        });
                        let structbindhtml = '<ul class="card border-0"><li class="card-body p-0"><ul class="nav nav-tabs w-100 border-0 d-flex flex-row" id="structures-settings-m-t" role="tablist"><li class="nav-item"><a class="nav-link active border-0 ml-0" id="mobile-setting-t" data-toggle="tab" href="#mobile-tab-setting" role="tab" aria-controls="mobile" aria-selected="true">Mobile</a></li><li class="nav-item"><a class="nav-link border-0" id="tab-setting-t" data-toggle="tab" href="#tab-tab-setting" role="tab" aria-controls="tab" aria-selected="false">Tab</a></li></ul><div class="tab-content"><div class="tab-pane fade show active" id="mobile-tab-setting" role="tabpanel" aria-labelledby="mobile-tab"><ul class="d-flex flex-column">' + Blockhtml + '</ul></div><div class="tab-pane fade" id="tab-tab-setting" role="tabpanel" aria-labelledby="tab-tab"><ul class="d-flex flex-column">' + Blockhtml + '</ul></div></div></li></li>';
                        let pasParameter = paramater_id.join('|');
                        let modalhtml = '<div class="modal fade" id="structure_settingModal" tabindex="-1" role="dialog" data-backdrop="false" data-keyboard="false" aria-labelledby="structureModalLabel" aria-hidden="true" style="background-color: rgba(0,0,0, 0.4);"> <div class="modal-dialog" role="document"> <div class="modal-content"><div class="modal-body structres-setting-modal py-2" id="structres-setting-modal">' + structbindhtml + '</div><div class="modal-footer py-10 d-flex justify-content-between"> <a class="btn btn-secondary" data-dismiss="modal" data-btn_close="closed">Close</a> <a class="btn btn-primary" onclick="Unibase.Platform.Widgets.Components._Widget.Instance().structureSetting(this,`' + pasParameter + '`)">Save</a> </div></div></div></div>';
                        if (Unibase.Themes.Providers.DetailHelper.installedAppId) {
                            $('#' + VisibleContainerId).css('z-index', 1201);
                            $('#' + VisibleContainerId).find(".detail-container-content-outer").append(modalhtml);
                        }
                        else {
                            $('#' + VisibleContainerId).find("#dashboardwidget-container-outer").prepend(modalhtml);
                        }
                        $('#' + VisibleContainerId).find("#structure_settingModal").modal('show');
                        for (var k = 0; k < data.length; k++) {
                            if (data[k].Mobile != undefined && data[k].Mobile != null && data[k].Mobile != '') {
                                $('#' + VisibleContainerId + ' #mobile-tab-setting').find('.txt_block_' + data[k].index).val(data[k].Mobile);
                            }
                            else {
                                $('#' + VisibleContainerId + ' #mobile-tab-setting').find('.txt_block_' + data[k].index).val('');
                            }
                            if (data[k].Tab != undefined && data[k].Tab != null && data[k].Tab != '') {
                                $('#' + VisibleContainerId + ' #tab-tab-setting').find('.txt_block_' + data[k].index).val(data[k].Tab);
                            }
                            else {
                                $('#' + VisibleContainerId + ' #tab-tab-setting').find('.txt_block_' + data[k].index).val('');
                            }
                        }
                        $('[data-btn_close="closed"]').on('click', function () {
                            $('#' + Unibase.Platform.Helpers.NavigationHelper.Instance().getLastContainerId()).css('z-index', 9);
                        });
                    }
                    structureSetting(e, id) {
                        let instance = this, parameter = [], mobileWidth = [], _mobileWidth = '', tabWidth = [], _tabWidth = '', VisibleContainerId = Unibase.Platform.Helpers.NavigationHelper.Instance().getLastContainerId();
                        parameter = id.split('|');
                        $('#' + VisibleContainerId).css('z-index', 9);
                        $('#' + VisibleContainerId + ' #mobile-tab-setting').find('input[type=text]').each(function () {
                            if (($(this).val() != undefined) && ($(this).val() != '') && ($(this).val() != null)) {
                                mobileWidth.push($(this).val());
                            }
                            else {
                                mobileWidth.push(0);
                            }
                        });
                        _mobileWidth = mobileWidth.join('|');
                        $('#' + VisibleContainerId + ' #tab-tab-setting').find('input[type=text]').each(function () {
                            if (($(this).val() != undefined) && ($(this).val() != '') && ($(this).val() != null)) {
                                tabWidth.push($(this).val());
                            }
                            else {
                                tabWidth.push(0);
                            }
                        });
                        _tabWidth = tabWidth.join('|');
                        for (var i = 0; i < parameter.length; i++) {
                            if ((parameter[i] != '') && (parameter[i] != undefined)) {
                                $('#' + VisibleContainerId).find('#' + parameter[i]).attr({
                                    'data-Mobile_SettingWidth': _mobileWidth, 'data-Tab_SettingWidth': _tabWidth
                                });
                            }
                        }
                        $('#' + VisibleContainerId).find("#structres-setting-modal").siblings('.modal-footer').find('[data-dismiss="modal"]').click();
                    }
                    KpiCode() {
                        if ($('#code-preview-slash').length == 0) {
                            $('#option-back').before('<a class="btn btn-flush-theme mr-2 btn-icon flush-soft-hover font-22" id="code-preview-slash" data-icon="iconslash" href="javascript:;"><span class="btn-icon-wrap"><span class="line-icon"><i class="la la-eye-slash"></i></span></span></a>');
                            $('#code-preview-slash').on('click', function () {
                                let isExecute = false;
                                if ($(this).attr('data-icon') == "iconslash" && isExecute == false) {
                                    isExecute = true;
                                    let html = $('.designsPreviewAppendClass textarea').val().toString();
                                    $('.designsPreviewAppendClass').html(html);
                                    Unibase.Platform.Widgets.Components.Widget.Instance().customHtml = html;
                                    $(this).attr('data-icon', 'icon');
                                    $(this).find('.la').removeClass('la-eye-slash').addClass('la-eye');
                                }
                                if ($(this).attr('data-icon') == "icon" && isExecute == false) {
                                    isExecute = true;
                                    let HTML = $('.designsPreviewAppendClass').html();
                                    $('.designsPreviewAppendClass').html('').append('<textarea class="border-dark h-80 w-100 " data-kpidesigns="CustomDesign" rows="9" cols="90" style="box-shadow: none;"></textarea>');
                                    $('.designsPreviewAppendClass textarea').val(HTML);
                                    $(this).attr('data-icon', 'iconslash');
                                    $(this).find('.la').removeClass('la-eye').addClass('la-eye-slash');
                                }
                            });
                        }
                        else {
                            $('#code-preview-slash').attr('data-icon', 'iconslash').find('.la').removeClass('la-eye').addClass('la-eye-slash');
                        }
                    }
                    static Instance() {
                        if (this._instance === undefined)
                            this._instance = new Unibase.Platform.Widgets.Components._Widget();
                        return this._instance;
                    }
                }
                Components._Widget = _Widget;
            })(Components = Widgets.Components || (Widgets.Components = {}));
        })(Widgets = Platform.Widgets || (Platform.Widgets = {}));
    })(Platform = Unibase.Platform || (Unibase.Platform = {}));
})(Unibase || (Unibase = {}));