WebBuild/wwwroot/apps/pm/components/taskprogress.js

var Bizgaze;
(function (Bizgaze) {
    let Apps;
    (function (Apps) {
        let PM;
        (function (PM) {
            let Components;
            (function (Components) {
                class TaskProgress extends Unibase.Platform.Core.BaseComponent {
                    cssFiles() {
                        return [];
                    }
                    jsFiles() {
                        return ['apps/pm/managers/taskmanager.js'];
                    }
                    html(id, containerid) {
                        let html = `<div class="b-a wrapper"><div id="bizgaze_ErrorMessages" class="clear"></div><div class="card"><div class="card-header card-header-action"><span class="" id="hf-widget-title_Progessbar">Task Progress</span></div><div class="card-body"><div class="row"><div class='col-sm-2 pl-70'><strong class='text-right'/></div></div><div class="row"><div class="col-sm-12 pm_taskList"></div></div></div></div></div>`;
                        $("." + containerid).html(html);
                        return "";
                    }
                    init(containerid) {
                        var instance = this;
                        var id = 0;
                        var InstalledAppId = Unibase.Themes.Providers.DetailHelper.installedAppId;
                        for (let obj of Unibase.Themes.Providers.Detail_Settings.Instance().InputParameters) {
                            if (obj.Key === "hf_" + InstalledAppId + "_recordid") {
                                id = Number(obj.Value);
                            }
                        }
                        instance.load(id, containerid, null);
                    }
                    load(id, containerid, callback) {
                        this.html(id, containerid);
                        var taskid = Number(id);
                        Bizgaze.Apps.PM.Components.TaskProgress.Instance().LoadProgressBar(taskid);
                    }
                    LoadProgressBar(taskid) {
                        var instance = this;
                        instance.fileCacheHelper.loadJsFile("apps/pm/managers/taskmanager.js", function () {
                            Bizgaze.Apps.PM.Managers.TaskManager.Instance().getTasks(taskid).then(function (response) {
                                var data = JSON.parse(response.result)[0];
                                instance.refstatusId = data.refstatusid;
                                instance.percent = data.percentage;
                                var html = "";
                                $(".pm_taskList").html('<ul class="list-group no-radius m-b-md list-group-sm no-border pm-task-list"></ul>');
                                $(".pm-task-list").html('<li class="pm-task-item hidden"></li>');
                                if (response.result != null) {
                                    html += '<li class="pm-task-list-item-' + data.taskid + '">' +
                                        '<div class="">' +
                                        '<div class="row showProgressBar_' + data.taskid + '">' +
                                        '<div class="col-11 m-t-xs pl-2 taskPercentage-' + data.taskid + '" data-taskPercentage="' + data.percentage + '">' +
                                        '<div class="taskProgress taskProgress-' + data.taskid + '" ><div class="progress-label" style="color:#ff0000;position:absolute;left:50%;top:4px;font-weight:bold;">0%</div></div>' +
                                        '</div>' +
                                        '<div class="col-1 m-t-xs pl-0">' +
                                        '<button type="button" id ="ProgressButton" onclick="javascript:Unibase.Apps.PM.Components.TaskProgress.Instance().toggleProgress(' + data.taskid + ')" class="btn btn-sm btn-info btn-block pull-right" style="width:50px;"><i class="fa fa-pencil"></i></button>' +
                                        '</div>' +
                                        '</div>' +
                                        '<div class="row editProgressBar_' + data.taskid + ' hidden">' +
                                        '<div class="col-11 mt-5 pl-2 m-t-xs  taskPercentage-' + data.taskid + '" data-taskPercentage="' + data.percentage + '">' +
                                        '<div class="pmTask_Slider pmTask_Slider-' + data.taskid + '"><div class="slider-label" style="color:#ff0000;position:absolute;left:50%;font-weight:bold;">0%</div><div id="custom-handle-' + data.taskid + '" style="width:2em;height:1.6em;top:50%;margin-top:-.8em;text-align:center;line-height:1.6em;" class="ui-slider-handle"></div><input class="hdnTaskId" type="hidden" data-taskId="' + data.taskid + '" /></div>' +
                                        '</div>' +
                                        '<div class="col-1 pl-0 m-t-xs">' +
                                        '<button type="button" id="ProgressButton" onclick="javascript:Unibase.Apps.PM.Components.TaskProgress.Instance().toggleProgress(' + data.taskid + ')" class="btn btn-info btn-sm btn-block pull-right" style="width:50px;"><i class="fa fa-times"></i></button>' +
                                        '</div>' +
                                        '</div>' +
                                        '</div>' +
                                        '</li>';
                                    $(".pm-task-item:last").before(html);
                                    Bizgaze.Apps.PM.Components.TaskProgress.Instance().loadProgress(data.taskid);
                                }
                                $('.pmTask_Slider').each(function () {
                                    var element = $(this).find('.hdnTaskId');
                                    var taskId = $(element).data('taskid');
                                    var handle = $("#custom-handle-" + taskId + "");
                                    var count = 0;
                                    $(this).slider({
                                        min: 0,
                                        max: 100,
                                        step: 1,
                                        create: function () {
                                            handle.text($(this).slider("value"));
                                        },
                                        slide: function (event, ui) {
                                            handle.text(ui.value);
                                        },
                                        change: function (event, ui) {
                                        }
                                    });
                                });
                            });
                        });
                    }
                    loadProgress(TaskId) {
                        var element = $('.pm_taskList');
                        var ele = element.find(".taskPercentage-" + TaskId + "");
                        var label = ele.find(".progress-label");
                        this.percent = ele.data('taskpercentage');
                        element.find(".taskProgress-" + TaskId + "").progressbar({
                            value: this.percent,
                        });
                        if (this.percent > 50) {
                            $(".progress-label").css({ 'color': 'white' });
                        }
                        label.text(this.percent + '%');
                        var styles = {
                            backgroundColor: "green",
                            height: "50px"
                        };
                        $(".taskProgress-" + TaskId + "").find(".ui-progressbar-value").css(styles);
                        element.find(".pmTask_Slider-" + TaskId + "").slider({
                            min: 0,
                            max: 100,
                            step: 1,
                            value: this.percent,
                            range: "min",
                        });
                        var refstatusid = this.refstatusId;
                        if (refstatusid == 3 || refstatusid == 6)
                            $("#ProgressButton").prop("disabled", false);
                        else
                            $("#ProgressButton").prop("disabled", true);
                    }
                    toggleProgress(TaskId) {
                        $('.showProgressBar_' + TaskId).toggleClass('hidden');
                        $('.editProgressBar_' + TaskId).toggleClass('hidden');
                        $('.inpTaskCompletedDate-' + TaskId).toggleClass('hidden');
                        $('.spnTaskCompletedDate-' + TaskId).toggleClass('hidden');
                        var element = $('.pm_taskList');
                        var ele = element.find(".taskPercentage-" + TaskId + "");
                        var label1 = ele.find(".slider-label");
                        var percentage = this.percent;
                        var sliderstyle = {
                            backgroundColor: "green",
                            cursor: "pointer"
                        };
                        $(".ui-state-default").css(sliderstyle);
                        $(".ui-slider-range").css("background-color", "green");
                        $(".ui-slider").css("height", "22px");
                        if (percentage > 50) {
                            $(".slider-label").css({ 'color': 'white' });
                        }
                        label1.text(percentage + '%');
                        var ele1 = $('.pm_taskList').parent().parent();
                        var element1 = ele1.find('.pmTask_Slider');
                        element1.slider({
                            min: 0,
                            max: 100,
                            step: 1,
                            value: percentage,
                            range: "min",
                            create: function (event, ui) {
                                var tooltip = $('<div class="tooltip" />');
                                $(event.target).find('.ui-slider-handle').append(tooltip);
                            },
                            slide: function (event, ui) {
                                $(ui.handle).find('.tooltip').text(ui.value);
                            },
                            change: function (event, ui) {
                                var currentDate = new Date($.now());
                                var postData = {
                                    taskid: TaskId,
                                    percentage: ui.value,
                                    timerstoppeddate: new Date(),
                                    timer: '',
                                    pausedate: new Date(),
                                    istaskpause: false,
                                    isresumetask: false,
                                    istaskstopped: false,
                                };
                                Bizgaze.Apps.PM.Managers.TaskManager.Instance().updateTaskPercentage(postData).then(function (response) {
                                    Bizgaze.Apps.PM.Components.TaskProgress.Instance().LoadProgressBar(TaskId);
                                });
                            }
                        });
                    }
                    static Instance() {
                        if (this.instance === undefined) {
                            this.instance = new TaskProgress();
                        }
                        return this.instance;
                    }
                }
                Components.TaskProgress = TaskProgress;
            })(Components = PM.Components || (PM.Components = {}));
        })(PM = Apps.PM || (Apps.PM = {}));
    })(Apps = Bizgaze.Apps || (Bizgaze.Apps = {}));
})(Bizgaze || (Bizgaze = {}));