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

var Unibase;
(function (Unibase) {
    let Platform;
    (function (Platform) {
        let Analytics;
        (function (Analytics) {
            let Components;
            (function (Components) {
                class CardViewerSettings extends Platform.Core.BaseComponent {
                    constructor() {
                        super();
                        this.reportManager = Analytics.Managers.ReportManager.Instance();
                        this.viewerManager = Analytics.Managers.ViewerManager.Instance();
                        this.ReportId = 0;
                    }
                    jsFiles() {
                        return ["platform/analytics/components/cardviewer/cardviewer.js", "platform/analytics/providers/iviewersettings.js"];
                    }
                    cssFiles() {
                        return [];
                    }
                    html(id, containerid) {
                        var html = `<div class="b-b bg-white modal-header"><strong class="text-dark">Card</strong>
                    </div>
                    <div class="modal-body" id="CardViewer_modal">
                      <div id="divCard_ErrorMessage"></div>
                      <div class="card"> <div class="card-body" style="">
                        <div class="row" id="div_Kanban">
                    <div class="col-sm-6"> <div id="div_CardName" class="floating-label-form-group">
                                <label for="cardname" id="lbl_CardName">Card Name</label>
                                <input type="text" class="form-control value-control floating-label-control" placeholder="Card Name" data-placeholder="Card Name" data-label="Card Name" id="txt_CardName">
                        </div></div>
                        <div class="col-sm-4">
                                <div id="div_DisplayName" class="floating-label-form-group floating-label-form-group-with-value">
                                    <label for="displayname" id="lbl_DisplayName">Display Name</label>
                                    <input type="text" id="Txt_Display_Name" class="form-control value-control floating-label-control" placeholder="Display Name" data-placeholder="Display Name" data-label="Display Name">
                                </div>
                            </div>
                        <div class="col-sm-6"> <div id="div_KanbanColumn" class="floating-label-form-group floating-label-form-group-with-value">
                            <label for="kanbancolumn">Applied Column</label>
                            <select id="cardapplied_AutoComplete" class="form-control text-control required"><option value="0" selected="">Select Kanban Column</option></select>
                        </div></div>
      
                    <div class="col-sm-6"> <div id="div_AssignColumn" class="floating-label-form-group floating-label-form-group-with-value">
                            <label for="AssignColumn">Assign Column</label>
                            <select id="AssignColumn_AutoComplete" class="form-control text-control required"><option value="0" selected="">Select Assign Column</option></select>
                        </div></div>
                    <div class="col-sm-6"> <div id="div_dividebygroup" class="mt-40 hidden">
                            <input type="checkbox" id="dividebygroup" name="dividebygroup" value=" ">
                            <label for="dividebygroup" class="ml-5">Divide By Group</label>
                        </div></div>
                        </div>
                    </div></div><div class="TemplateText_Section card"> 
                            <div class="card-header"> Template Text </div> 
                            <div class="card-body">                                
                                <div id="div_TemplateText" class="">            
                                    <textarea class="" placeholder="Template Text" rows="3" cols="112" id="txt_TemplateText"></textarea>                    
                                </div>
                         </div></div></div>
                    <div class="bg-white modal-footer">
                        <a class="btn btn-light btn-sm btn-center mr-auto" id="btnClose">Close</a>
                        <a class="btn btn-primary btn-center btn-sm text-white" id="btnSave">Save</a>
                    </div>`;
                        return html;
                    }
                    load(id, containerid, callback) {
                        var instance = this;
                        var reportid = instance.ReportId;
                        $("#CardViewer_modal").css("height", $(window).outerHeight() - (Number($(".modal-header").outerHeight()) + Number($(".modal-footer").outerHeight())) + 'px');
                        $("#btnClose").click(function () {
                            $('#' + containerid).modal('hide');
                            $('#' + containerid).remove();
                        });
                        var data = [];
                        this.reportManager.getColumns(reportid).then(function (response) {
                            var res = response.result;
                            for (let i = 0; i < res.length; i++) {
                                data.push({ id: res[i].ReportColumnName, text: res[i].ReportColumnName });
                            }
                            $("#cardapplied_AutoComplete").select2({
                                placeholder: 'Select From Date Column',
                                data: data,
                            });
                            $("#AssignColumn_AutoComplete").select2({
                                placeholder: 'Select From Date Column',
                                data: data,
                            });
                            if (id != 0) {
                                instance.getCardById(id);
                            }
                        });
                        jQuery("#btnSave").click(function () {
                            instance.save(id, reportid, containerid);
                        });
                    }
                    save(id, reportid, containerid) {
                        var instance = this;
                        var PostData = {
                            CardViewId: Number(id),
                            CardName: $("#txt_CardName").val(),
                            AppliedColumn: $("#cardapplied_AutoComplete").val(),
                            AssignColumn: $("#AssignColumn_AutoComplete").val(),
                            IsDivideGroup: $("#dividebygroup").is(":checked"),
                            TemplateText: $("#txt_TemplateText").val(),
                            ReportId: instance.ReportId,
                            DisplayModeTypeId: 1,
                            ViewAll: instance.response && instance.response.ViewAll || true,
                            DisplayName: $("#Txt_Display_Name").val().toString().trim(),
                            IsFromUI: Number(id) == 0 ? true : false,
                        };
                        instance.fileCacheHelper.loadJsFile("platform/analytics/managers/reportmanager.js", function () {
                            instance.viewerManager.saveCardView(PostData).then(function (response) {
                                if (response.status == Unibase.Data.Status.Error) {
                                    MessageHelper.Instance().showError(response.message, 'divCard_ErrorMessage');
                                }
                                else {
                                    MessageHelper.Instance().showSuccess(response.message, '');
                                    $('#' + containerid).modal('hide');
                                    $('#' + containerid).remove();
                                }
                            });
                        });
                    }
                    getCardById(id) {
                        var instance = this;
                        instance.viewerManager.getCardView(id).then(function (response) {
                            instance.response = response;
                            $("#Txt_Display_Name").val(response.DisplayName ? response.DisplayName.trim() : instance.response.CardName.trim());
                            $("#txt_CardName").val(instance.response.CardName.trim()).attr("readonly", 'true').css("cursor", "not-allowed");
                            $("#cardapplied_AutoComplete").val(instance.response.AppliedColumn.trim()).trigger("change");
                            $("#AssignColumn_AutoComplete").val(instance.response.AssignColumn.trim()).trigger("change");
                            $("#txt_TemplateText").val(instance.response.TemplateText.trim());
                        });
                    }
                    static Instance() {
                        if (this._instance === undefined)
                            this._instance = new CardViewerSettings();
                        return this._instance;
                    }
                }
                Components.CardViewerSettings = CardViewerSettings;
            })(Components = Analytics.Components || (Analytics.Components = {}));
        })(Analytics = Platform.Analytics || (Platform.Analytics = {}));
    })(Platform = Unibase.Platform || (Unibase.Platform = {}));
})(Unibase || (Unibase = {}));