@seniorsistemas/angular-components 16.13.2 → 17.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/seniorsistemas-angular-components.umd.js +1829 -24
- package/bundles/seniorsistemas-angular-components.umd.js.map +1 -1
- package/bundles/seniorsistemas-angular-components.umd.min.js +2 -2
- package/bundles/seniorsistemas-angular-components.umd.min.js.map +1 -1
- package/components/gantt/components/gantt/arrow.d.ts +16 -0
- package/components/gantt/components/gantt/bar.d.ts +43 -0
- package/components/gantt/components/gantt/gantt-options.d.ts +2 -0
- package/components/gantt/components/gantt/gantt.d.ts +66 -0
- package/components/gantt/components/gantt/popup.d.ts +11 -0
- package/components/gantt/components/gantt/utils/date-utils.d.ts +13 -0
- package/components/gantt/components/gantt/utils/svg-utils.d.ts +11 -0
- package/components/gantt/components/side-table/side-table.component.d.ts +7 -0
- package/components/gantt/gantt.component.d.ts +21 -0
- package/components/gantt/gantt.module.d.ts +2 -0
- package/components/gantt/index.d.ts +3 -0
- package/components/gantt/models/index.d.ts +3 -0
- package/components/gantt/models/options.d.ts +21 -0
- package/components/gantt/models/task.d.ts +21 -0
- package/components/gantt/models/view-mode.d.ts +9 -0
- package/components/switch/index.d.ts +2 -0
- package/components/switch/switch.component.d.ts +21 -0
- package/components/switch/switch.module.d.ts +2 -0
- package/esm2015/components/gantt/components/gantt/arrow.js +82 -0
- package/esm2015/components/gantt/components/gantt/bar.js +236 -0
- package/esm2015/components/gantt/components/gantt/gantt-options.js +16 -0
- package/esm2015/components/gantt/components/gantt/gantt.js +767 -0
- package/esm2015/components/gantt/components/gantt/popup.js +68 -0
- package/esm2015/components/gantt/components/gantt/utils/date-utils.js +126 -0
- package/esm2015/components/gantt/components/gantt/utils/svg-utils.js +119 -0
- package/esm2015/components/gantt/components/side-table/side-table.component.js +26 -0
- package/esm2015/components/gantt/gantt.component.js +112 -0
- package/esm2015/components/gantt/gantt.module.js +19 -0
- package/esm2015/components/gantt/index.js +4 -0
- package/esm2015/components/gantt/models/index.js +2 -0
- package/esm2015/components/gantt/models/options.js +1 -0
- package/esm2015/components/gantt/models/task.js +1 -0
- package/esm2015/components/gantt/models/view-mode.js +11 -0
- package/esm2015/components/switch/index.js +3 -0
- package/esm2015/components/switch/switch.component.js +86 -0
- package/esm2015/components/switch/switch.module.js +15 -0
- package/esm2015/public-api.js +3 -1
- package/esm2015/seniorsistemas-angular-components.js +25 -24
- package/esm5/components/gantt/components/gantt/arrow.js +81 -0
- package/esm5/components/gantt/components/gantt/bar.js +271 -0
- package/esm5/components/gantt/components/gantt/gantt-options.js +16 -0
- package/esm5/components/gantt/components/gantt/gantt.js +883 -0
- package/esm5/components/gantt/components/gantt/popup.js +59 -0
- package/esm5/components/gantt/components/gantt/utils/date-utils.js +134 -0
- package/esm5/components/gantt/components/gantt/utils/svg-utils.js +121 -0
- package/esm5/components/gantt/components/side-table/side-table.component.js +27 -0
- package/esm5/components/gantt/gantt.component.js +114 -0
- package/esm5/components/gantt/gantt.module.js +22 -0
- package/esm5/components/gantt/index.js +4 -0
- package/esm5/components/gantt/models/index.js +2 -0
- package/esm5/components/gantt/models/options.js +1 -0
- package/esm5/components/gantt/models/task.js +1 -0
- package/esm5/components/gantt/models/view-mode.js +11 -0
- package/esm5/components/switch/index.js +3 -0
- package/esm5/components/switch/switch.component.js +88 -0
- package/esm5/components/switch/switch.module.js +18 -0
- package/esm5/public-api.js +3 -1
- package/esm5/seniorsistemas-angular-components.js +25 -24
- package/fesm2015/seniorsistemas-angular-components.js +1647 -2
- package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
- package/fesm5/seniorsistemas-angular-components.js +1802 -2
- package/fesm5/seniorsistemas-angular-components.js.map +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +2 -0
- package/seniorsistemas-angular-components.d.ts +24 -23
- package/seniorsistemas-angular-components.metadata.json +1 -1
|
@@ -8751,6 +8751,1710 @@
|
|
|
8751
8751
|
return EditableOverlayModule;
|
|
8752
8752
|
}());
|
|
8753
8753
|
|
|
8754
|
+
var moment$7 = moment_;
|
|
8755
|
+
var YEAR = "year";
|
|
8756
|
+
var MONTH = "month";
|
|
8757
|
+
var DAY = "day";
|
|
8758
|
+
var HOUR = "hour";
|
|
8759
|
+
var MINUTE = "minute";
|
|
8760
|
+
var SECOND = "second";
|
|
8761
|
+
var MILLISECOND = "millisecond";
|
|
8762
|
+
var DateUtils = /** @class */ (function () {
|
|
8763
|
+
function DateUtils() {
|
|
8764
|
+
}
|
|
8765
|
+
DateUtils.parse = function (date) {
|
|
8766
|
+
return moment$7(date).toDate();
|
|
8767
|
+
};
|
|
8768
|
+
DateUtils.toString = function (date, with_time) {
|
|
8769
|
+
if (with_time === void 0) { with_time = false; }
|
|
8770
|
+
var result = with_time ? moment$7(date, "YYYY-MM-DD hh:mm:ss.SSS") : moment$7(date, "YYYY-MM-DD");
|
|
8771
|
+
return result.toString();
|
|
8772
|
+
};
|
|
8773
|
+
DateUtils.format = function (date, formatString, lang) {
|
|
8774
|
+
if (formatString === void 0) { formatString = "YYYY-MM-DD HH:mm:ss.SSS"; }
|
|
8775
|
+
if (lang === void 0) { lang = "en"; }
|
|
8776
|
+
var monthName = moment$7(date)
|
|
8777
|
+
.locale(lang)
|
|
8778
|
+
.startOf("month")
|
|
8779
|
+
.format("MMMM");
|
|
8780
|
+
var monthNameCapitalized = monthName.charAt(0).toUpperCase() + monthName.slice(1);
|
|
8781
|
+
var dateToFormat = moment$7(date);
|
|
8782
|
+
var format_map = {
|
|
8783
|
+
YYYY: dateToFormat.format("YYYY"),
|
|
8784
|
+
MM: dateToFormat.format("MM"),
|
|
8785
|
+
DD: dateToFormat.format("DD"),
|
|
8786
|
+
HH: dateToFormat.format("HH"),
|
|
8787
|
+
mm: dateToFormat.format("mm"),
|
|
8788
|
+
ss: dateToFormat.format("ss"),
|
|
8789
|
+
SSS: dateToFormat.format("SSS"),
|
|
8790
|
+
D: dateToFormat.format("D"),
|
|
8791
|
+
MMMM: monthNameCapitalized,
|
|
8792
|
+
MMM: monthNameCapitalized,
|
|
8793
|
+
};
|
|
8794
|
+
var str = formatString;
|
|
8795
|
+
var formattedValues = [];
|
|
8796
|
+
Object.keys(format_map)
|
|
8797
|
+
.sort(function (a, b) { return b.length - a.length; })
|
|
8798
|
+
.forEach(function (key) {
|
|
8799
|
+
if (str.includes(key)) {
|
|
8800
|
+
str = str.replace(key, "$" + formattedValues.length);
|
|
8801
|
+
formattedValues.push(format_map[key]);
|
|
8802
|
+
}
|
|
8803
|
+
});
|
|
8804
|
+
formattedValues.forEach(function (value, i) {
|
|
8805
|
+
str = str.replace("$" + i, value);
|
|
8806
|
+
});
|
|
8807
|
+
return str;
|
|
8808
|
+
};
|
|
8809
|
+
DateUtils.diff = function (fistDate, secondDate, scale) {
|
|
8810
|
+
var milliseconds = moment$7(fistDate).diff(secondDate, MILLISECOND);
|
|
8811
|
+
var seconds = moment$7(fistDate).diff(secondDate, SECOND);
|
|
8812
|
+
var minutes = moment$7(fistDate).diff(secondDate, MINUTE);
|
|
8813
|
+
var hours = moment$7(fistDate).diff(secondDate, HOUR);
|
|
8814
|
+
var days = moment$7(fistDate).diff(secondDate, DAY);
|
|
8815
|
+
var months = moment$7(fistDate).diff(secondDate, MONTH);
|
|
8816
|
+
var years = moment$7(fistDate).diff(secondDate, YEAR);
|
|
8817
|
+
if (!scale.endsWith("s")) {
|
|
8818
|
+
scale += "s";
|
|
8819
|
+
}
|
|
8820
|
+
return Math.floor({
|
|
8821
|
+
milliseconds: milliseconds,
|
|
8822
|
+
seconds: seconds,
|
|
8823
|
+
minutes: minutes,
|
|
8824
|
+
hours: hours,
|
|
8825
|
+
days: days,
|
|
8826
|
+
months: months,
|
|
8827
|
+
years: years,
|
|
8828
|
+
}[scale]);
|
|
8829
|
+
};
|
|
8830
|
+
DateUtils.today = function () {
|
|
8831
|
+
var dateStr = moment$7().format("YYY-MM-DD");
|
|
8832
|
+
return new Date(dateStr);
|
|
8833
|
+
};
|
|
8834
|
+
DateUtils.now = function () {
|
|
8835
|
+
return moment$7().toDate();
|
|
8836
|
+
};
|
|
8837
|
+
DateUtils.add = function (date, quantity, scale) {
|
|
8838
|
+
return moment$7(date).add(quantity, scale).toDate();
|
|
8839
|
+
};
|
|
8840
|
+
DateUtils.startOf = function (date, scale) {
|
|
8841
|
+
var _a;
|
|
8842
|
+
var scores = (_a = {},
|
|
8843
|
+
_a[YEAR] = 6,
|
|
8844
|
+
_a[MONTH] = 5,
|
|
8845
|
+
_a[DAY] = 4,
|
|
8846
|
+
_a[HOUR] = 3,
|
|
8847
|
+
_a[MINUTE] = 2,
|
|
8848
|
+
_a[SECOND] = 1,
|
|
8849
|
+
_a[MILLISECOND] = 0,
|
|
8850
|
+
_a);
|
|
8851
|
+
function shouldReset(_scale) {
|
|
8852
|
+
var max_score = scores[scale];
|
|
8853
|
+
return scores[_scale] <= max_score;
|
|
8854
|
+
}
|
|
8855
|
+
var vals = [
|
|
8856
|
+
date.getFullYear(),
|
|
8857
|
+
shouldReset(YEAR) ? 0 : date.getMonth(),
|
|
8858
|
+
shouldReset(MONTH) ? 1 : date.getDate(),
|
|
8859
|
+
shouldReset(DAY) ? 0 : date.getHours(),
|
|
8860
|
+
shouldReset(HOUR) ? 0 : date.getMinutes(),
|
|
8861
|
+
shouldReset(MINUTE) ? 0 : date.getSeconds(),
|
|
8862
|
+
shouldReset(SECOND) ? 0 : date.getMilliseconds(),
|
|
8863
|
+
];
|
|
8864
|
+
return new Date(vals[0], vals[1], vals[2], vals[3], vals[4], vals[5], vals[6]);
|
|
8865
|
+
};
|
|
8866
|
+
DateUtils.clone = function (date) {
|
|
8867
|
+
return moment$7(date).toDate();
|
|
8868
|
+
};
|
|
8869
|
+
DateUtils.getDateValues = function (date) {
|
|
8870
|
+
return [
|
|
8871
|
+
date.getFullYear(),
|
|
8872
|
+
date.getMonth(),
|
|
8873
|
+
date.getDate(),
|
|
8874
|
+
date.getHours(),
|
|
8875
|
+
date.getMinutes(),
|
|
8876
|
+
date.getSeconds(),
|
|
8877
|
+
date.getMilliseconds(),
|
|
8878
|
+
];
|
|
8879
|
+
};
|
|
8880
|
+
DateUtils.getDaysInMonth = function (date) {
|
|
8881
|
+
return moment$7(date, "YYYY-MM").daysInMonth();
|
|
8882
|
+
};
|
|
8883
|
+
return DateUtils;
|
|
8884
|
+
}());
|
|
8885
|
+
|
|
8886
|
+
var $ = function (expr, con) {
|
|
8887
|
+
return typeof expr === 'string'
|
|
8888
|
+
? (con || document).querySelector(expr)
|
|
8889
|
+
: expr || null;
|
|
8890
|
+
};
|
|
8891
|
+
var createSVG = function (tag, attrs) {
|
|
8892
|
+
var elem = document.createElementNS("http://www.w3.org/2000/svg", tag);
|
|
8893
|
+
for (var attr in attrs) {
|
|
8894
|
+
if (attr === "append_to") {
|
|
8895
|
+
var parent_1 = attrs.append_to;
|
|
8896
|
+
parent_1.appendChild(elem);
|
|
8897
|
+
}
|
|
8898
|
+
else if (attr === "innerHTML") {
|
|
8899
|
+
elem.innerHTML = attrs.innerHTML;
|
|
8900
|
+
}
|
|
8901
|
+
else {
|
|
8902
|
+
elem.setAttribute(attr, attrs[attr]);
|
|
8903
|
+
}
|
|
8904
|
+
}
|
|
8905
|
+
return elem;
|
|
8906
|
+
};
|
|
8907
|
+
var animateSVG = function (svgElement, attr, from, to) {
|
|
8908
|
+
var animatedSvgElement = getAnimationElement(svgElement, attr, from, to);
|
|
8909
|
+
if (animatedSvgElement === svgElement) {
|
|
8910
|
+
// triggered 2nd time programmatically
|
|
8911
|
+
// trigger artificial click event
|
|
8912
|
+
var event_1 = document.createEvent("HTMLEvents");
|
|
8913
|
+
event_1.initEvent("click", true, true);
|
|
8914
|
+
// event.eventName = 'click'; TODO: Ver porque esta propriedade não existe
|
|
8915
|
+
animatedSvgElement.dispatchEvent(event_1);
|
|
8916
|
+
}
|
|
8917
|
+
};
|
|
8918
|
+
var getAnimationElement = function (svgElement, attr, from, to, dur, begin) {
|
|
8919
|
+
if (dur === void 0) { dur = "0.4s"; }
|
|
8920
|
+
if (begin === void 0) { begin = "0.1s"; }
|
|
8921
|
+
var animEl = svgElement.querySelector("animate");
|
|
8922
|
+
if (animEl) {
|
|
8923
|
+
$.attr(animEl, {
|
|
8924
|
+
attributeName: attr,
|
|
8925
|
+
from: from,
|
|
8926
|
+
to: to,
|
|
8927
|
+
dur: dur,
|
|
8928
|
+
begin: "click + " + begin,
|
|
8929
|
+
}, null);
|
|
8930
|
+
return svgElement;
|
|
8931
|
+
}
|
|
8932
|
+
var animateElement = createSVG("animate", {
|
|
8933
|
+
attributeName: attr,
|
|
8934
|
+
from: from,
|
|
8935
|
+
to: to,
|
|
8936
|
+
dur: dur,
|
|
8937
|
+
begin: begin,
|
|
8938
|
+
calcMode: "spline",
|
|
8939
|
+
values: from + ";" + to,
|
|
8940
|
+
keyTimes: "0; 1",
|
|
8941
|
+
keySplines: cubic_bezier("ease-out"),
|
|
8942
|
+
});
|
|
8943
|
+
svgElement.appendChild(animateElement);
|
|
8944
|
+
return svgElement;
|
|
8945
|
+
};
|
|
8946
|
+
var ɵ0 = getAnimationElement;
|
|
8947
|
+
var cubic_bezier = function (name) {
|
|
8948
|
+
return {
|
|
8949
|
+
ease: ".25 .1 .25 1",
|
|
8950
|
+
linear: "0 0 1 1",
|
|
8951
|
+
"ease-in": ".42 0 1 1",
|
|
8952
|
+
"ease-out": "0 0 .58 1",
|
|
8953
|
+
"ease-in-out": ".42 0 .58 1",
|
|
8954
|
+
}[name];
|
|
8955
|
+
};
|
|
8956
|
+
var ɵ1 = cubic_bezier;
|
|
8957
|
+
$.on = function (element, event, selector, callback) {
|
|
8958
|
+
if (!callback) {
|
|
8959
|
+
callback = selector;
|
|
8960
|
+
$.bind(element, event, callback);
|
|
8961
|
+
}
|
|
8962
|
+
else {
|
|
8963
|
+
$.delegate(element, event, selector, callback);
|
|
8964
|
+
}
|
|
8965
|
+
};
|
|
8966
|
+
$.off = function (element, event, handler) {
|
|
8967
|
+
element.removeEventListener(event, handler);
|
|
8968
|
+
};
|
|
8969
|
+
$.bind = function (element, event, callback) {
|
|
8970
|
+
event.split(/\s+/).forEach(function (event) {
|
|
8971
|
+
element.addEventListener(event, callback);
|
|
8972
|
+
});
|
|
8973
|
+
};
|
|
8974
|
+
$.delegate = function (element, event, selector, callback) {
|
|
8975
|
+
element.addEventListener(event, function (e) {
|
|
8976
|
+
var delegatedTarget = e.target.closest(selector);
|
|
8977
|
+
if (delegatedTarget) {
|
|
8978
|
+
e.delegatedTarget = delegatedTarget;
|
|
8979
|
+
callback.call(this, e, delegatedTarget);
|
|
8980
|
+
}
|
|
8981
|
+
});
|
|
8982
|
+
};
|
|
8983
|
+
$.closest = function (selector, element) {
|
|
8984
|
+
if (!element) {
|
|
8985
|
+
return null;
|
|
8986
|
+
}
|
|
8987
|
+
if (element.matches(selector)) {
|
|
8988
|
+
return element;
|
|
8989
|
+
}
|
|
8990
|
+
// TODO: Corrigir este problema
|
|
8991
|
+
// return $.closest(selector, element.parentNode);
|
|
8992
|
+
};
|
|
8993
|
+
$.attr = function (element, attr, value) {
|
|
8994
|
+
if (!value && typeof attr === "string") {
|
|
8995
|
+
return element.getAttribute(attr);
|
|
8996
|
+
}
|
|
8997
|
+
if (typeof attr === "object") {
|
|
8998
|
+
for (var key in attr) {
|
|
8999
|
+
$.attr(element, key, attr[key]);
|
|
9000
|
+
}
|
|
9001
|
+
return;
|
|
9002
|
+
}
|
|
9003
|
+
element.setAttribute(attr, value);
|
|
9004
|
+
};
|
|
9005
|
+
|
|
9006
|
+
|
|
9007
|
+
(function (ViewMode) {
|
|
9008
|
+
ViewMode["QuarterDay"] = "quarterDay";
|
|
9009
|
+
ViewMode["HalfDay"] = "halfDay";
|
|
9010
|
+
ViewMode["Day"] = "day";
|
|
9011
|
+
ViewMode["Week"] = "week";
|
|
9012
|
+
ViewMode["Month"] = "month";
|
|
9013
|
+
ViewMode["Year"] = "year";
|
|
9014
|
+
ViewMode["Hour"] = "hour";
|
|
9015
|
+
})(exports.ViewMode || (exports.ViewMode = {}));
|
|
9016
|
+
|
|
9017
|
+
var Bar = /** @class */ (function () {
|
|
9018
|
+
function Bar(gantt, task) {
|
|
9019
|
+
this._setDefaults(gantt, task);
|
|
9020
|
+
this._prepare();
|
|
9021
|
+
this._draw();
|
|
9022
|
+
this._bind();
|
|
9023
|
+
}
|
|
9024
|
+
Object.defineProperty(Bar.prototype, "arrows", {
|
|
9025
|
+
get: function () {
|
|
9026
|
+
return this._arrows;
|
|
9027
|
+
},
|
|
9028
|
+
set: function (arrows) {
|
|
9029
|
+
this._arrows = arrows;
|
|
9030
|
+
},
|
|
9031
|
+
enumerable: true,
|
|
9032
|
+
configurable: true
|
|
9033
|
+
});
|
|
9034
|
+
Object.defineProperty(Bar.prototype, "task", {
|
|
9035
|
+
get: function () {
|
|
9036
|
+
return this._task;
|
|
9037
|
+
},
|
|
9038
|
+
enumerable: true,
|
|
9039
|
+
configurable: true
|
|
9040
|
+
});
|
|
9041
|
+
Object.defineProperty(Bar.prototype, "element", {
|
|
9042
|
+
get: function () {
|
|
9043
|
+
return this._element;
|
|
9044
|
+
},
|
|
9045
|
+
enumerable: true,
|
|
9046
|
+
configurable: true
|
|
9047
|
+
});
|
|
9048
|
+
Object.defineProperty(Bar.prototype, "group", {
|
|
9049
|
+
get: function () {
|
|
9050
|
+
return this._group;
|
|
9051
|
+
},
|
|
9052
|
+
enumerable: true,
|
|
9053
|
+
configurable: true
|
|
9054
|
+
});
|
|
9055
|
+
Bar.prototype.updateBarPosition = function (_a) {
|
|
9056
|
+
var _this = this;
|
|
9057
|
+
var x = _a.x, width = _a.width;
|
|
9058
|
+
var bar = this.element;
|
|
9059
|
+
if (x) {
|
|
9060
|
+
// get all x values of parent task
|
|
9061
|
+
var xs = this.task.dependencies.map(function (dep) {
|
|
9062
|
+
return _this._gantt.get_bar(dep).element.getX();
|
|
9063
|
+
});
|
|
9064
|
+
// child task must not go before parent
|
|
9065
|
+
var valid_x = xs.reduce(function (prev, curr) {
|
|
9066
|
+
return x >= curr;
|
|
9067
|
+
}, x);
|
|
9068
|
+
if (!valid_x) {
|
|
9069
|
+
width = null;
|
|
9070
|
+
return;
|
|
9071
|
+
}
|
|
9072
|
+
this._updateAttr(bar, "x", x);
|
|
9073
|
+
}
|
|
9074
|
+
if (width && width >= this._gantt.options.columnWidth) {
|
|
9075
|
+
this._updateAttr(bar, "width", width);
|
|
9076
|
+
}
|
|
9077
|
+
this._updateLabelPosition();
|
|
9078
|
+
this._updateArrowPosition();
|
|
9079
|
+
};
|
|
9080
|
+
Bar.prototype.dateChanged = function () {
|
|
9081
|
+
var changed = false;
|
|
9082
|
+
var _a = this._computeStartEndDate(), newStartDate = _a.newStartDate, newEndDate = _a.newEndDate;
|
|
9083
|
+
if (this.task.start !== newStartDate) {
|
|
9084
|
+
changed = true;
|
|
9085
|
+
this.task.start = newStartDate;
|
|
9086
|
+
}
|
|
9087
|
+
if (this.task.end !== newEndDate) {
|
|
9088
|
+
changed = true;
|
|
9089
|
+
this.task.end = newEndDate;
|
|
9090
|
+
}
|
|
9091
|
+
if (changed) {
|
|
9092
|
+
this._gantt.trigger_event("onDateChange", [
|
|
9093
|
+
this.task,
|
|
9094
|
+
newStartDate,
|
|
9095
|
+
DateUtils.add(newEndDate, -1, "second"),
|
|
9096
|
+
]);
|
|
9097
|
+
}
|
|
9098
|
+
;
|
|
9099
|
+
};
|
|
9100
|
+
Bar.prototype.setActionCompleted = function () {
|
|
9101
|
+
var _this = this;
|
|
9102
|
+
this._actionCompleted = true;
|
|
9103
|
+
setTimeout(function () {
|
|
9104
|
+
_this._actionCompleted = false;
|
|
9105
|
+
}, 1000);
|
|
9106
|
+
};
|
|
9107
|
+
Bar.prototype._setDefaults = function (gantt, task) {
|
|
9108
|
+
this._actionCompleted = false;
|
|
9109
|
+
this._gantt = gantt;
|
|
9110
|
+
this._task = task;
|
|
9111
|
+
};
|
|
9112
|
+
Bar.prototype._prepare = function () {
|
|
9113
|
+
this._prepareValues();
|
|
9114
|
+
this._prepareHelpers();
|
|
9115
|
+
};
|
|
9116
|
+
Bar.prototype._prepareValues = function () {
|
|
9117
|
+
this._invalid = this.task.invalid;
|
|
9118
|
+
this._height = this._gantt.options.barHeight;
|
|
9119
|
+
this._x = this._computeX();
|
|
9120
|
+
this._y = this._computeY();
|
|
9121
|
+
this._cornerRadius = this._gantt.options.barCornerRadius;
|
|
9122
|
+
this._duration = DateUtils.diff(this.task.end, this.task.start, "minute") / this._gantt.options.step / 60.0;
|
|
9123
|
+
this._width = this._gantt.options.columnWidth * this._duration;
|
|
9124
|
+
this._group = createSVG("g", {
|
|
9125
|
+
class: "bar-wrapper " + (this.task.custom_class || ""),
|
|
9126
|
+
"data-id": this.task.id,
|
|
9127
|
+
});
|
|
9128
|
+
this._barGroup = createSVG("g", {
|
|
9129
|
+
class: "bar-group",
|
|
9130
|
+
append_to: this.group,
|
|
9131
|
+
});
|
|
9132
|
+
};
|
|
9133
|
+
Bar.prototype._prepareHelpers = function () {
|
|
9134
|
+
SVGElement.prototype.getX = function () {
|
|
9135
|
+
return +this.getAttribute("x");
|
|
9136
|
+
};
|
|
9137
|
+
SVGElement.prototype.getY = function () {
|
|
9138
|
+
return +this.getAttribute("y");
|
|
9139
|
+
};
|
|
9140
|
+
SVGElement.prototype.getWidth = function () {
|
|
9141
|
+
return +this.getAttribute("width");
|
|
9142
|
+
};
|
|
9143
|
+
SVGElement.prototype.getHeight = function () {
|
|
9144
|
+
return +this.getAttribute("height");
|
|
9145
|
+
};
|
|
9146
|
+
SVGElement.prototype.getEndX = function () {
|
|
9147
|
+
return this.getX() + this.getWidth();
|
|
9148
|
+
};
|
|
9149
|
+
};
|
|
9150
|
+
Bar.prototype._draw = function () {
|
|
9151
|
+
this._drawBar();
|
|
9152
|
+
this._drawLabel();
|
|
9153
|
+
};
|
|
9154
|
+
Bar.prototype._drawBar = function () {
|
|
9155
|
+
this._element = createSVG("rect", {
|
|
9156
|
+
x: this._x,
|
|
9157
|
+
y: this._y,
|
|
9158
|
+
width: this._width,
|
|
9159
|
+
height: this._height,
|
|
9160
|
+
rx: this._cornerRadius,
|
|
9161
|
+
ry: this._cornerRadius,
|
|
9162
|
+
class: "bar",
|
|
9163
|
+
append_to: this._barGroup,
|
|
9164
|
+
fill: this.task.color,
|
|
9165
|
+
});
|
|
9166
|
+
animateSVG(this.element, "width", 0, this._width);
|
|
9167
|
+
if (this._invalid) {
|
|
9168
|
+
this.element.classList.add("bar-invalid");
|
|
9169
|
+
}
|
|
9170
|
+
};
|
|
9171
|
+
Bar.prototype._drawLabel = function () {
|
|
9172
|
+
var _this = this;
|
|
9173
|
+
createSVG("text", {
|
|
9174
|
+
x: this._x + this._width / 2,
|
|
9175
|
+
y: this._y + this._height / 2,
|
|
9176
|
+
innerHTML: this.task.showTaskName ? this.task.name : "",
|
|
9177
|
+
class: "bar-label",
|
|
9178
|
+
append_to: this._barGroup,
|
|
9179
|
+
});
|
|
9180
|
+
// labels get BBox in the next tick
|
|
9181
|
+
requestAnimationFrame(function () { return _this._updateLabelPosition(); });
|
|
9182
|
+
};
|
|
9183
|
+
Bar.prototype._bind = function () {
|
|
9184
|
+
if (!this._invalid) {
|
|
9185
|
+
this._setupClickEvent();
|
|
9186
|
+
}
|
|
9187
|
+
};
|
|
9188
|
+
Bar.prototype._setupClickEvent = function () {
|
|
9189
|
+
var _this = this;
|
|
9190
|
+
$.on(this.group, "focus " + this._gantt.options.popupTrigger, function (e) {
|
|
9191
|
+
// just finished a move action, wait for a few seconds
|
|
9192
|
+
if (!_this._actionCompleted) {
|
|
9193
|
+
_this._showPopup();
|
|
9194
|
+
_this._gantt.unselect_all();
|
|
9195
|
+
_this.group.classList.add("active");
|
|
9196
|
+
}
|
|
9197
|
+
}, null);
|
|
9198
|
+
$.on(this.group, "dblclick", function (e) {
|
|
9199
|
+
// just finished a move action, wait for a few seconds
|
|
9200
|
+
if (!_this._actionCompleted) {
|
|
9201
|
+
_this._gantt.trigger_event("onClick", [_this.task]);
|
|
9202
|
+
}
|
|
9203
|
+
}, null);
|
|
9204
|
+
};
|
|
9205
|
+
Bar.prototype._showPopup = function () {
|
|
9206
|
+
if (this._gantt.bar_being_dragged) {
|
|
9207
|
+
return;
|
|
9208
|
+
}
|
|
9209
|
+
var formatString = this._gantt.view_is(exports.ViewMode.Hour)
|
|
9210
|
+
? "HH:ss"
|
|
9211
|
+
: "MMM D";
|
|
9212
|
+
var start_date = DateUtils.format(this.task.start, formatString, this._gantt.options.language);
|
|
9213
|
+
var end_date = DateUtils.format(DateUtils.add(this.task.end, -1, "second"), formatString, this._gantt.options.language);
|
|
9214
|
+
var subtitle = start_date + " - " + end_date;
|
|
9215
|
+
this._gantt.show_popup({
|
|
9216
|
+
target_element: this.element,
|
|
9217
|
+
title: this.task.name,
|
|
9218
|
+
subtitle: subtitle,
|
|
9219
|
+
task: this.task,
|
|
9220
|
+
});
|
|
9221
|
+
};
|
|
9222
|
+
Bar.prototype._computeStartEndDate = function () {
|
|
9223
|
+
var bar = this.element;
|
|
9224
|
+
var xInUnits = bar.getX() / this._gantt.options.columnWidth;
|
|
9225
|
+
var newStartDate = DateUtils.add(this._gantt.minDate, xInUnits * this._gantt.options.step, "hour");
|
|
9226
|
+
var width_in_units = bar.getWidth() / this._gantt.options.columnWidth;
|
|
9227
|
+
var newEndDate = DateUtils.add(newStartDate, width_in_units * this._gantt.options.step, "hour");
|
|
9228
|
+
return { newStartDate: newStartDate, newEndDate: newEndDate };
|
|
9229
|
+
};
|
|
9230
|
+
Bar.prototype._computeX = function () {
|
|
9231
|
+
var _a = this._gantt.options, step = _a.step, columnWidth = _a.columnWidth;
|
|
9232
|
+
var diff = DateUtils.diff(this.task.start, this._gantt.minDate, "hour");
|
|
9233
|
+
var x = (diff / step) * columnWidth;
|
|
9234
|
+
if (this._gantt.view_is(exports.ViewMode.Month)) {
|
|
9235
|
+
var diff_1 = DateUtils.diff(this.task.start, this._gantt.minDate, "day");
|
|
9236
|
+
x = (diff_1 * columnWidth) / 30;
|
|
9237
|
+
}
|
|
9238
|
+
return x;
|
|
9239
|
+
};
|
|
9240
|
+
Bar.prototype._computeY = function () {
|
|
9241
|
+
return (this._gantt.options.headerHeight +
|
|
9242
|
+
this._gantt.options.padding +
|
|
9243
|
+
this.task._index * (this._height + this._gantt.options.padding));
|
|
9244
|
+
};
|
|
9245
|
+
Bar.prototype._updateAttr = function (element, attr, value) {
|
|
9246
|
+
value = +value;
|
|
9247
|
+
if (!isNaN(value)) {
|
|
9248
|
+
element.setAttribute(attr, value);
|
|
9249
|
+
}
|
|
9250
|
+
return element;
|
|
9251
|
+
};
|
|
9252
|
+
Bar.prototype._updateLabelPosition = function () {
|
|
9253
|
+
var bar = this.element, label = this.group.querySelector(".bar-label");
|
|
9254
|
+
if (label.getBBox().width > bar.getWidth()) {
|
|
9255
|
+
label.classList.add("big");
|
|
9256
|
+
label.setAttribute("x", bar.getX() + bar.getWidth() + 5);
|
|
9257
|
+
}
|
|
9258
|
+
else {
|
|
9259
|
+
label.classList.remove("big");
|
|
9260
|
+
label.setAttribute("x", bar.getX() + bar.getWidth() / 2);
|
|
9261
|
+
}
|
|
9262
|
+
};
|
|
9263
|
+
Bar.prototype._updateArrowPosition = function () {
|
|
9264
|
+
var e_1, _a;
|
|
9265
|
+
this._arrows = this._arrows || [];
|
|
9266
|
+
try {
|
|
9267
|
+
for (var _b = __values(this._arrows), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
9268
|
+
var arrow = _c.value;
|
|
9269
|
+
arrow.update();
|
|
9270
|
+
}
|
|
9271
|
+
}
|
|
9272
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
9273
|
+
finally {
|
|
9274
|
+
try {
|
|
9275
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
9276
|
+
}
|
|
9277
|
+
finally { if (e_1) throw e_1.error; }
|
|
9278
|
+
}
|
|
9279
|
+
};
|
|
9280
|
+
return Bar;
|
|
9281
|
+
}());
|
|
9282
|
+
|
|
9283
|
+
var Popup = /** @class */ (function () {
|
|
9284
|
+
function Popup(parent, customHtml) {
|
|
9285
|
+
this.parent = parent;
|
|
9286
|
+
this.customHtml = customHtml;
|
|
9287
|
+
this.make();
|
|
9288
|
+
}
|
|
9289
|
+
Popup.prototype.show = function (options) {
|
|
9290
|
+
if (!options.target_element) {
|
|
9291
|
+
throw new Error("target_element is required to show popup");
|
|
9292
|
+
}
|
|
9293
|
+
if (!options.position) {
|
|
9294
|
+
options.position = "left";
|
|
9295
|
+
}
|
|
9296
|
+
var target_element = options.target_element;
|
|
9297
|
+
if (this.customHtml) {
|
|
9298
|
+
var html = this.customHtml(options.task);
|
|
9299
|
+
html += '<div class="pointer"></div>';
|
|
9300
|
+
this.parent.innerHTML = html;
|
|
9301
|
+
this.pointer = this.parent.querySelector(".pointer");
|
|
9302
|
+
}
|
|
9303
|
+
else {
|
|
9304
|
+
// set data
|
|
9305
|
+
this.title.innerHTML = options.title;
|
|
9306
|
+
this.subtitle.innerHTML = options.subtitle;
|
|
9307
|
+
this.parent.style.width = this.parent.clientWidth + "px";
|
|
9308
|
+
}
|
|
9309
|
+
// set position
|
|
9310
|
+
var positionMeta;
|
|
9311
|
+
if (target_element instanceof HTMLElement) {
|
|
9312
|
+
positionMeta = target_element.getBoundingClientRect();
|
|
9313
|
+
}
|
|
9314
|
+
else if (target_element instanceof SVGElement) {
|
|
9315
|
+
positionMeta = options.target_element.getBBox();
|
|
9316
|
+
}
|
|
9317
|
+
if (options.position === 'left') {
|
|
9318
|
+
this.parent.style.left = positionMeta.x + (positionMeta.width + 10) + "px";
|
|
9319
|
+
this.parent.style.top = positionMeta.y + "px";
|
|
9320
|
+
this.pointer.style.transform = "rotateZ(90deg)";
|
|
9321
|
+
this.pointer.style.left = "-7px";
|
|
9322
|
+
this.pointer.style.top = "2px";
|
|
9323
|
+
}
|
|
9324
|
+
// show
|
|
9325
|
+
this.parent.style.opacity = 1;
|
|
9326
|
+
};
|
|
9327
|
+
Popup.prototype.make = function () {
|
|
9328
|
+
this.parent.innerHTML = "\n <div class=\"popup\">\n <div class=\"wrp-title\">\n <span class=\"title\"></span>\n </div>\n <div class=\"wrp-subtitle\">\n <span class=\"icon fas fa-calendar-alt\"></span>\n <span class=\"subtitle\"></span>\n </div>\n <div class=\"pointer\"></div>\n </div>\n ";
|
|
9329
|
+
this.hide();
|
|
9330
|
+
this.title = this.parent.querySelector(".title");
|
|
9331
|
+
this.subtitle = this.parent.querySelector(".subtitle");
|
|
9332
|
+
this.pointer = this.parent.querySelector(".pointer");
|
|
9333
|
+
};
|
|
9334
|
+
Popup.prototype.hide = function () {
|
|
9335
|
+
this.parent.style.opacity = 0;
|
|
9336
|
+
this.parent.style.left = 0;
|
|
9337
|
+
};
|
|
9338
|
+
return Popup;
|
|
9339
|
+
}());
|
|
9340
|
+
|
|
9341
|
+
var Arrow = /** @class */ (function () {
|
|
9342
|
+
function Arrow(gantt, fromTask, toTask) {
|
|
9343
|
+
this._gantt = gantt;
|
|
9344
|
+
this._fromTask = fromTask;
|
|
9345
|
+
this._toTask = toTask;
|
|
9346
|
+
this.calculatePath();
|
|
9347
|
+
this.draw();
|
|
9348
|
+
}
|
|
9349
|
+
Object.defineProperty(Arrow.prototype, "fromTask", {
|
|
9350
|
+
get: function () {
|
|
9351
|
+
return this._fromTask;
|
|
9352
|
+
},
|
|
9353
|
+
enumerable: true,
|
|
9354
|
+
configurable: true
|
|
9355
|
+
});
|
|
9356
|
+
Object.defineProperty(Arrow.prototype, "toTask", {
|
|
9357
|
+
get: function () {
|
|
9358
|
+
return this._toTask;
|
|
9359
|
+
},
|
|
9360
|
+
enumerable: true,
|
|
9361
|
+
configurable: true
|
|
9362
|
+
});
|
|
9363
|
+
Object.defineProperty(Arrow.prototype, "element", {
|
|
9364
|
+
get: function () {
|
|
9365
|
+
return this._element;
|
|
9366
|
+
},
|
|
9367
|
+
enumerable: true,
|
|
9368
|
+
configurable: true
|
|
9369
|
+
});
|
|
9370
|
+
Arrow.prototype.update = function () {
|
|
9371
|
+
this.calculatePath();
|
|
9372
|
+
this._element.setAttribute("d", this._path);
|
|
9373
|
+
};
|
|
9374
|
+
Arrow.prototype.calculatePath = function () {
|
|
9375
|
+
var _this = this;
|
|
9376
|
+
var startX = this.fromTask.element.getX() + this.fromTask.element.getWidth() / 2;
|
|
9377
|
+
var condition = function () {
|
|
9378
|
+
return _this.toTask.element.getX() < startX + _this._gantt.options.padding &&
|
|
9379
|
+
startX > _this.fromTask.element.getX() + _this._gantt.options.padding;
|
|
9380
|
+
};
|
|
9381
|
+
while (condition()) {
|
|
9382
|
+
startX -= 10;
|
|
9383
|
+
}
|
|
9384
|
+
var startY = this._gantt.options.headerHeight +
|
|
9385
|
+
this._gantt.options.barHeight +
|
|
9386
|
+
(this._gantt.options.padding + this._gantt.options.barHeight) *
|
|
9387
|
+
this.fromTask.task._index +
|
|
9388
|
+
this._gantt.options.padding;
|
|
9389
|
+
var endX = this.toTask.element.getX() - this._gantt.options.padding / 2;
|
|
9390
|
+
var endY = this._gantt.options.headerHeight +
|
|
9391
|
+
this._gantt.options.barHeight / 2 +
|
|
9392
|
+
(this._gantt.options.padding + this._gantt.options.barHeight) *
|
|
9393
|
+
this.toTask.task._index +
|
|
9394
|
+
this._gantt.options.padding;
|
|
9395
|
+
var fromIsBelowTo = this.fromTask.task._index > this.toTask.task._index;
|
|
9396
|
+
var curve = this._gantt.options.arrowCurve;
|
|
9397
|
+
var clockwise = fromIsBelowTo ? 1 : 0;
|
|
9398
|
+
var curveY = fromIsBelowTo ? -curve : curve;
|
|
9399
|
+
var offset = fromIsBelowTo
|
|
9400
|
+
? endY + this._gantt.options.arrowCurve
|
|
9401
|
+
: endY - this._gantt.options.arrowCurve;
|
|
9402
|
+
this._path = "\n M " + startX + " " + startY + "\n V " + offset + "\n a " + curve + " " + curve + " 0 0 " + clockwise + " " + curve + " " + curveY + "\n L " + endX + " " + endY + "\n m -5 -5\n l 5 5\n l -5 5";
|
|
9403
|
+
if (this.toTask.element.getX() < this.fromTask.element.getX() + this._gantt.options.padding) {
|
|
9404
|
+
var down1 = this._gantt.options.padding / 2 - curve;
|
|
9405
|
+
var down2 = this.toTask.element.getY() + this.toTask.element.getHeight() / 2 - curveY;
|
|
9406
|
+
var left = this.toTask.element.getX() - this._gantt.options.padding;
|
|
9407
|
+
this._path = "\n M " + startX + " " + startY + "\n v " + down1 + "\n a " + curve + " " + curve + " 0 0 1 -" + curve + " " + curve + "\n H " + left + "\n a " + curve + " " + curve + " 0 0 " + clockwise + " -" + curve + " " + curveY + "\n V " + down2 + "\n a " + curve + " " + curve + " 0 0 " + clockwise + " " + curve + " " + curveY + "\n L " + endX + " " + endY + "\n m -5 -5\n l 5 5\n l -5 5";
|
|
9408
|
+
}
|
|
9409
|
+
};
|
|
9410
|
+
Arrow.prototype.draw = function () {
|
|
9411
|
+
this._element = createSVG("path", {
|
|
9412
|
+
d: this._path,
|
|
9413
|
+
"data-from": this.fromTask.task.id,
|
|
9414
|
+
"data-to": this.toTask.task.id,
|
|
9415
|
+
});
|
|
9416
|
+
};
|
|
9417
|
+
return Arrow;
|
|
9418
|
+
}());
|
|
9419
|
+
|
|
9420
|
+
var defaultOptions = {
|
|
9421
|
+
headerHeight: 94,
|
|
9422
|
+
columnWidth: 30,
|
|
9423
|
+
step: 24,
|
|
9424
|
+
barHeight: 20,
|
|
9425
|
+
barCornerRadius: 0,
|
|
9426
|
+
arrowCurve: 4,
|
|
9427
|
+
padding: 24,
|
|
9428
|
+
viewMode: exports.ViewMode.Day,
|
|
9429
|
+
dateFormat: "YYYY-MM-DD",
|
|
9430
|
+
popupTrigger: "click",
|
|
9431
|
+
customPopupHtml: null,
|
|
9432
|
+
language: "en",
|
|
9433
|
+
};
|
|
9434
|
+
|
|
9435
|
+
var Gantt = /** @class */ (function () {
|
|
9436
|
+
function Gantt(wrapper, tasks, options) {
|
|
9437
|
+
this.setup_wrapper(wrapper);
|
|
9438
|
+
this.setup_options(options);
|
|
9439
|
+
this.setup_tasks(tasks);
|
|
9440
|
+
// initialize with default view mode
|
|
9441
|
+
this.change_view_mode();
|
|
9442
|
+
this.bind_events();
|
|
9443
|
+
}
|
|
9444
|
+
Object.defineProperty(Gantt.prototype, "minDate", {
|
|
9445
|
+
get: function () {
|
|
9446
|
+
return this._minDate;
|
|
9447
|
+
},
|
|
9448
|
+
enumerable: true,
|
|
9449
|
+
configurable: true
|
|
9450
|
+
});
|
|
9451
|
+
Object.defineProperty(Gantt.prototype, "maxDate", {
|
|
9452
|
+
get: function () {
|
|
9453
|
+
return this._maxDate;
|
|
9454
|
+
},
|
|
9455
|
+
enumerable: true,
|
|
9456
|
+
configurable: true
|
|
9457
|
+
});
|
|
9458
|
+
Gantt.prototype.setup_wrapper = function (element) {
|
|
9459
|
+
var svg_element, wrapper_element;
|
|
9460
|
+
// CSS Selector is passed
|
|
9461
|
+
if (typeof element === "string") {
|
|
9462
|
+
element = document.querySelector(element);
|
|
9463
|
+
}
|
|
9464
|
+
// get the SVGElement
|
|
9465
|
+
if (element instanceof HTMLElement) {
|
|
9466
|
+
wrapper_element = element;
|
|
9467
|
+
svg_element = element.querySelector("svg");
|
|
9468
|
+
}
|
|
9469
|
+
else if (element instanceof SVGElement) {
|
|
9470
|
+
svg_element = element;
|
|
9471
|
+
}
|
|
9472
|
+
else {
|
|
9473
|
+
throw new TypeError("Frappé Gantt only supports usage of a string CSS selector, HTML DOM element or SVG DOM element for the \'element\' parameter");
|
|
9474
|
+
}
|
|
9475
|
+
// svg element
|
|
9476
|
+
if (!svg_element) {
|
|
9477
|
+
// create it
|
|
9478
|
+
this.$svg = createSVG("svg", {
|
|
9479
|
+
append_to: wrapper_element,
|
|
9480
|
+
class: "gantt",
|
|
9481
|
+
});
|
|
9482
|
+
}
|
|
9483
|
+
else {
|
|
9484
|
+
this.$svg = svg_element;
|
|
9485
|
+
this.$svg.classList.add("gantt");
|
|
9486
|
+
}
|
|
9487
|
+
// wrapper element
|
|
9488
|
+
this.$container = document.createElement("div");
|
|
9489
|
+
this.$container.classList.add("gantt-container");
|
|
9490
|
+
var parent_element = this.$svg.parentElement;
|
|
9491
|
+
parent_element.appendChild(this.$container);
|
|
9492
|
+
this.$container.appendChild(this.$svg);
|
|
9493
|
+
// popup wrapper
|
|
9494
|
+
this.popup_wrapper = document.createElement("div");
|
|
9495
|
+
this.popup_wrapper.classList.add("popup-wrapper");
|
|
9496
|
+
this.$container.appendChild(this.popup_wrapper);
|
|
9497
|
+
};
|
|
9498
|
+
Gantt.prototype.setup_options = function (options) {
|
|
9499
|
+
this.options = Object.assign({}, defaultOptions, options);
|
|
9500
|
+
};
|
|
9501
|
+
Gantt.prototype.setup_tasks = function (tasks) {
|
|
9502
|
+
// prepare tasks
|
|
9503
|
+
this.tasks = tasks.map(function (task, i) {
|
|
9504
|
+
//standard colors if needed
|
|
9505
|
+
task.color = task.color || '#7892A1';
|
|
9506
|
+
// convert to Date objects
|
|
9507
|
+
task._start = DateUtils.parse(task.start);
|
|
9508
|
+
task._end = DateUtils.parse(task.end);
|
|
9509
|
+
// make task invalid if duration too large
|
|
9510
|
+
if (DateUtils.diff(task._end, task._start, "year") > 10) {
|
|
9511
|
+
task.end = null;
|
|
9512
|
+
}
|
|
9513
|
+
// cache index
|
|
9514
|
+
task._index = i;
|
|
9515
|
+
if (typeof task._row_id === "number") {
|
|
9516
|
+
task._index = task._row_id;
|
|
9517
|
+
}
|
|
9518
|
+
// invalid dates
|
|
9519
|
+
if (!task.start && !task.end) {
|
|
9520
|
+
var today = DateUtils.today();
|
|
9521
|
+
task._start = today;
|
|
9522
|
+
task._end = DateUtils.add(today, 2, "day");
|
|
9523
|
+
}
|
|
9524
|
+
if (!task.start && task.end) {
|
|
9525
|
+
task._start = DateUtils.add(task._end, -2, 'day');
|
|
9526
|
+
}
|
|
9527
|
+
if (task.start && !task.end) {
|
|
9528
|
+
task._end = DateUtils.add(task._start, 2, "day");
|
|
9529
|
+
}
|
|
9530
|
+
// if hours is not set, assume the last day is full day
|
|
9531
|
+
// e.g: 2018-09-09 becomes 2018-09-09 23:59:59
|
|
9532
|
+
var task_end_values = DateUtils.getDateValues(task._end);
|
|
9533
|
+
if (task_end_values.slice(3).every(function (d) { return d === 0; })) {
|
|
9534
|
+
task._end = DateUtils.add(task._end, 24, "hour");
|
|
9535
|
+
}
|
|
9536
|
+
// invalid flag
|
|
9537
|
+
if (!task.start || !task.end) {
|
|
9538
|
+
task.invalid = true;
|
|
9539
|
+
}
|
|
9540
|
+
// dependencies
|
|
9541
|
+
if (typeof task.dependencies === "string" || !task.dependencies) {
|
|
9542
|
+
var deps = [];
|
|
9543
|
+
if (task.dependencies) {
|
|
9544
|
+
deps = task.dependencies
|
|
9545
|
+
.split(',')
|
|
9546
|
+
.map(function (d) { return d.trim(); })
|
|
9547
|
+
.filter(function (d) { return d; });
|
|
9548
|
+
}
|
|
9549
|
+
task.dependencies = deps;
|
|
9550
|
+
}
|
|
9551
|
+
// uids
|
|
9552
|
+
if (!task.id) {
|
|
9553
|
+
task.id = generate_id(task);
|
|
9554
|
+
}
|
|
9555
|
+
return task;
|
|
9556
|
+
});
|
|
9557
|
+
this.setup_dependencies();
|
|
9558
|
+
};
|
|
9559
|
+
Gantt.prototype.setup_dependencies = function () {
|
|
9560
|
+
var e_1, _a, e_2, _b;
|
|
9561
|
+
this.dependency_map = {};
|
|
9562
|
+
try {
|
|
9563
|
+
for (var _c = __values(this.tasks), _d = _c.next(); !_d.done; _d = _c.next()) {
|
|
9564
|
+
var t = _d.value;
|
|
9565
|
+
try {
|
|
9566
|
+
for (var _e = (e_2 = void 0, __values(t.dependencies)), _f = _e.next(); !_f.done; _f = _e.next()) {
|
|
9567
|
+
var d = _f.value;
|
|
9568
|
+
this.dependency_map[d] = this.dependency_map[d] || [];
|
|
9569
|
+
this.dependency_map[d].push(t.id);
|
|
9570
|
+
}
|
|
9571
|
+
}
|
|
9572
|
+
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
9573
|
+
finally {
|
|
9574
|
+
try {
|
|
9575
|
+
if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
|
|
9576
|
+
}
|
|
9577
|
+
finally { if (e_2) throw e_2.error; }
|
|
9578
|
+
}
|
|
9579
|
+
}
|
|
9580
|
+
}
|
|
9581
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
9582
|
+
finally {
|
|
9583
|
+
try {
|
|
9584
|
+
if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
|
|
9585
|
+
}
|
|
9586
|
+
finally { if (e_1) throw e_1.error; }
|
|
9587
|
+
}
|
|
9588
|
+
};
|
|
9589
|
+
Gantt.prototype.refresh = function (tasks) {
|
|
9590
|
+
this.setup_tasks(tasks);
|
|
9591
|
+
this.change_view_mode();
|
|
9592
|
+
};
|
|
9593
|
+
Gantt.prototype.change_view_mode = function (mode) {
|
|
9594
|
+
if (mode === void 0) { mode = this.options.viewMode; }
|
|
9595
|
+
this.update_view_scale(mode);
|
|
9596
|
+
this.setup_dates();
|
|
9597
|
+
this.render();
|
|
9598
|
+
// fire viewmode_change event
|
|
9599
|
+
this.trigger_event("onViewChange", [mode]);
|
|
9600
|
+
};
|
|
9601
|
+
Gantt.prototype.update_view_scale = function (view_mode) {
|
|
9602
|
+
this.options.viewMode = view_mode;
|
|
9603
|
+
// this.isHourView = false;
|
|
9604
|
+
if (view_mode === exports.ViewMode.Hour) {
|
|
9605
|
+
this.options.step = 24 / 24;
|
|
9606
|
+
this.options.columnWidth = 50;
|
|
9607
|
+
// this.isHourView = true;
|
|
9608
|
+
}
|
|
9609
|
+
else if (view_mode === exports.ViewMode.Day) {
|
|
9610
|
+
this.options.step = 24;
|
|
9611
|
+
this.options.columnWidth = 50;
|
|
9612
|
+
}
|
|
9613
|
+
else if (view_mode === exports.ViewMode.HalfDay) {
|
|
9614
|
+
this.options.step = 24 / 2;
|
|
9615
|
+
this.options.columnWidth = 50;
|
|
9616
|
+
}
|
|
9617
|
+
else if (view_mode === exports.ViewMode.QuarterDay) {
|
|
9618
|
+
this.options.step = 24 / 4;
|
|
9619
|
+
this.options.columnWidth = 50;
|
|
9620
|
+
}
|
|
9621
|
+
else if (view_mode === exports.ViewMode.Week) {
|
|
9622
|
+
this.options.step = 24 * 7;
|
|
9623
|
+
this.options.columnWidth = 140;
|
|
9624
|
+
}
|
|
9625
|
+
else if (view_mode === exports.ViewMode.Month) {
|
|
9626
|
+
this.options.step = 24 * 30;
|
|
9627
|
+
this.options.columnWidth = 120;
|
|
9628
|
+
}
|
|
9629
|
+
else if (view_mode === exports.ViewMode.Year) {
|
|
9630
|
+
this.options.step = 24 * 365;
|
|
9631
|
+
this.options.columnWidth = 120;
|
|
9632
|
+
}
|
|
9633
|
+
};
|
|
9634
|
+
Gantt.prototype.setup_dates = function () {
|
|
9635
|
+
this.setup_gantt_dates();
|
|
9636
|
+
this.setup_date_values();
|
|
9637
|
+
};
|
|
9638
|
+
Gantt.prototype.setup_gantt_dates = function () {
|
|
9639
|
+
var e_3, _a;
|
|
9640
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
9641
|
+
this._minDate = null;
|
|
9642
|
+
this._maxDate = null;
|
|
9643
|
+
try {
|
|
9644
|
+
for (var _r = __values(this.tasks), _s = _r.next(); !_s.done; _s = _r.next()) {
|
|
9645
|
+
var task = _s.value;
|
|
9646
|
+
// set global start and end date
|
|
9647
|
+
if (!this.minDate || task.start < this.minDate) {
|
|
9648
|
+
this._minDate = task.start;
|
|
9649
|
+
}
|
|
9650
|
+
if (!this.maxDate || task.end > this.maxDate) {
|
|
9651
|
+
this._maxDate = task.end;
|
|
9652
|
+
}
|
|
9653
|
+
}
|
|
9654
|
+
}
|
|
9655
|
+
catch (e_3_1) { e_3 = { error: e_3_1 }; }
|
|
9656
|
+
finally {
|
|
9657
|
+
try {
|
|
9658
|
+
if (_s && !_s.done && (_a = _r.return)) _a.call(_r);
|
|
9659
|
+
}
|
|
9660
|
+
finally { if (e_3) throw e_3.error; }
|
|
9661
|
+
}
|
|
9662
|
+
this._realMinDate = this.minDate;
|
|
9663
|
+
this._realMaxDate = this.maxDate;
|
|
9664
|
+
switch (this.options.viewMode) {
|
|
9665
|
+
case exports.ViewMode.Hour:
|
|
9666
|
+
this._minDate = DateUtils.add(this.minDate, -((_b = this.options.marginBeforeStart) !== null && _b !== void 0 ? _b : 1), "hour");
|
|
9667
|
+
this._maxDate = DateUtils.add(this.maxDate, (_c = this.options.marginAfterEnd) !== null && _c !== void 0 ? _c : 1, "hour");
|
|
9668
|
+
break;
|
|
9669
|
+
case exports.ViewMode.QuarterDay:
|
|
9670
|
+
this._minDate = DateUtils.add(this.minDate, -((_d = this.options.marginBeforeStart) !== null && _d !== void 0 ? _d : 12), "hour");
|
|
9671
|
+
this._maxDate = DateUtils.add(this.maxDate, (_e = this.options.marginAfterEnd) !== null && _e !== void 0 ? _e : 12, "hour");
|
|
9672
|
+
break;
|
|
9673
|
+
case exports.ViewMode.HalfDay:
|
|
9674
|
+
this._minDate = DateUtils.add(this.minDate, -((_f = this.options.marginBeforeStart) !== null && _f !== void 0 ? _f : 1), "day");
|
|
9675
|
+
this._maxDate = DateUtils.add(this.maxDate, (_g = this.options.marginAfterEnd) !== null && _g !== void 0 ? _g : 1, "day");
|
|
9676
|
+
break;
|
|
9677
|
+
case exports.ViewMode.Day:
|
|
9678
|
+
this._minDate = DateUtils.add(this.minDate, -((_h = this.options.marginBeforeStart) !== null && _h !== void 0 ? _h : 3), "day");
|
|
9679
|
+
this._maxDate = DateUtils.add(this.maxDate, (_j = this.options.marginAfterEnd) !== null && _j !== void 0 ? _j : 3, "day");
|
|
9680
|
+
break;
|
|
9681
|
+
case exports.ViewMode.Week:
|
|
9682
|
+
this._minDate = DateUtils.add(this.minDate, -((_k = this.options.marginBeforeStart) !== null && _k !== void 0 ? _k : 1), "month");
|
|
9683
|
+
this._maxDate = DateUtils.add(this.maxDate, (_l = this.options.marginAfterEnd) !== null && _l !== void 0 ? _l : 1, "month");
|
|
9684
|
+
break;
|
|
9685
|
+
case exports.ViewMode.Month:
|
|
9686
|
+
this._minDate = DateUtils.add(this.minDate, -((_m = this.options.marginBeforeStart) !== null && _m !== void 0 ? _m : 1), "year");
|
|
9687
|
+
this._maxDate = DateUtils.add(this.maxDate, (_o = this.options.marginAfterEnd) !== null && _o !== void 0 ? _o : 1, "year");
|
|
9688
|
+
break;
|
|
9689
|
+
case exports.ViewMode.Year:
|
|
9690
|
+
this._minDate = DateUtils.add(this.minDate, -((_p = this.options.marginBeforeStart) !== null && _p !== void 0 ? _p : 2), "year");
|
|
9691
|
+
this._maxDate = DateUtils.add(this.maxDate, (_q = this.options.marginAfterEnd) !== null && _q !== void 0 ? _q : 2, "year");
|
|
9692
|
+
break;
|
|
9693
|
+
}
|
|
9694
|
+
};
|
|
9695
|
+
Gantt.prototype.setup_date_values = function () {
|
|
9696
|
+
this.dates = [];
|
|
9697
|
+
var cur_date = null;
|
|
9698
|
+
while (cur_date === null || cur_date < this.maxDate) {
|
|
9699
|
+
if (!cur_date) {
|
|
9700
|
+
cur_date = DateUtils.clone(this.minDate);
|
|
9701
|
+
}
|
|
9702
|
+
else {
|
|
9703
|
+
if (this.view_is(exports.ViewMode.Year)) {
|
|
9704
|
+
cur_date = DateUtils.add(cur_date, 1, "year");
|
|
9705
|
+
}
|
|
9706
|
+
else if (this.view_is(exports.ViewMode.Month)) {
|
|
9707
|
+
cur_date = DateUtils.add(cur_date, 1, "month");
|
|
9708
|
+
}
|
|
9709
|
+
else {
|
|
9710
|
+
cur_date = DateUtils.add(cur_date, this.options.step, 'hour');
|
|
9711
|
+
}
|
|
9712
|
+
}
|
|
9713
|
+
this.dates.push(cur_date);
|
|
9714
|
+
}
|
|
9715
|
+
console.log("cur_date", cur_date);
|
|
9716
|
+
console.log("dates", this.dates);
|
|
9717
|
+
};
|
|
9718
|
+
Gantt.prototype.bind_events = function () {
|
|
9719
|
+
this.bind_grid_click();
|
|
9720
|
+
this.bind_bar_events();
|
|
9721
|
+
};
|
|
9722
|
+
Gantt.prototype.render = function () {
|
|
9723
|
+
this.clear();
|
|
9724
|
+
this.setup_layers();
|
|
9725
|
+
this.make_grid();
|
|
9726
|
+
this.make_dates();
|
|
9727
|
+
this.make_bars();
|
|
9728
|
+
this.make_arrows();
|
|
9729
|
+
this.map_arrows_on_bars();
|
|
9730
|
+
this.set_width();
|
|
9731
|
+
this.set_scroll_position();
|
|
9732
|
+
};
|
|
9733
|
+
Gantt.prototype.setup_layers = function () {
|
|
9734
|
+
var e_4, _a;
|
|
9735
|
+
this.layers = {};
|
|
9736
|
+
var layers = ["grid", "date", "arrow", "progress", "bar", "details"];
|
|
9737
|
+
try {
|
|
9738
|
+
// make group layers
|
|
9739
|
+
for (var layers_1 = __values(layers), layers_1_1 = layers_1.next(); !layers_1_1.done; layers_1_1 = layers_1.next()) {
|
|
9740
|
+
var layer = layers_1_1.value;
|
|
9741
|
+
this.layers[layer] = createSVG('g', {
|
|
9742
|
+
class: layer,
|
|
9743
|
+
append_to: this.$svg,
|
|
9744
|
+
});
|
|
9745
|
+
}
|
|
9746
|
+
}
|
|
9747
|
+
catch (e_4_1) { e_4 = { error: e_4_1 }; }
|
|
9748
|
+
finally {
|
|
9749
|
+
try {
|
|
9750
|
+
if (layers_1_1 && !layers_1_1.done && (_a = layers_1.return)) _a.call(layers_1);
|
|
9751
|
+
}
|
|
9752
|
+
finally { if (e_4) throw e_4.error; }
|
|
9753
|
+
}
|
|
9754
|
+
};
|
|
9755
|
+
Gantt.prototype.make_grid = function () {
|
|
9756
|
+
this.make_grid_background();
|
|
9757
|
+
this.make_grid_rows();
|
|
9758
|
+
this.make_grid_header();
|
|
9759
|
+
this.make_grid_highlights();
|
|
9760
|
+
this.make_grid_ticks();
|
|
9761
|
+
};
|
|
9762
|
+
Gantt.prototype.make_grid_background = function () {
|
|
9763
|
+
var grid_width = this.dates.length * this.options.columnWidth;
|
|
9764
|
+
var distinct_rows = __spread(new Set(this.tasks.map(function (x) { return x._row_id; })));
|
|
9765
|
+
var grid_height = this.options.headerHeight +
|
|
9766
|
+
this.options.padding / 2 +
|
|
9767
|
+
(this.options.barHeight + this.options.padding) *
|
|
9768
|
+
distinct_rows.length;
|
|
9769
|
+
createSVG("rect", {
|
|
9770
|
+
x: 0,
|
|
9771
|
+
y: 0,
|
|
9772
|
+
width: grid_width,
|
|
9773
|
+
height: grid_height,
|
|
9774
|
+
class: "grid-background",
|
|
9775
|
+
append_to: this.layers.grid,
|
|
9776
|
+
});
|
|
9777
|
+
$.attr(this.$svg, {
|
|
9778
|
+
height: grid_height,
|
|
9779
|
+
width: "100%",
|
|
9780
|
+
}, null);
|
|
9781
|
+
};
|
|
9782
|
+
Gantt.prototype.make_grid_rows = function () {
|
|
9783
|
+
var _this = this;
|
|
9784
|
+
var rows_layer = createSVG("g", { append_to: this.layers.grid });
|
|
9785
|
+
var lines_layer = createSVG("g", { append_to: this.layers.grid });
|
|
9786
|
+
var row_width = this.dates.length * this.options.columnWidth;
|
|
9787
|
+
var row_height = this.options.barHeight + this.options.padding;
|
|
9788
|
+
//TODO: ajustar o posicionamento das linhas
|
|
9789
|
+
var row_y = this.options.headerHeight + this.options.padding / 2;
|
|
9790
|
+
this.tasks.forEach(function (_) {
|
|
9791
|
+
createSVG("rect", {
|
|
9792
|
+
x: 0,
|
|
9793
|
+
y: row_y,
|
|
9794
|
+
width: row_width,
|
|
9795
|
+
height: row_height,
|
|
9796
|
+
class: "grid-row",
|
|
9797
|
+
append_to: rows_layer,
|
|
9798
|
+
});
|
|
9799
|
+
createSVG("line", {
|
|
9800
|
+
x1: 0,
|
|
9801
|
+
y1: row_y + row_height,
|
|
9802
|
+
x2: row_width,
|
|
9803
|
+
y2: row_y + row_height,
|
|
9804
|
+
class: "row-line",
|
|
9805
|
+
append_to: lines_layer,
|
|
9806
|
+
});
|
|
9807
|
+
row_y += _this.options.barHeight + _this.options.padding;
|
|
9808
|
+
});
|
|
9809
|
+
};
|
|
9810
|
+
Gantt.prototype.make_grid_header = function () {
|
|
9811
|
+
// const addIsHourView = this.isHourView ? 25 : 10
|
|
9812
|
+
var header_width = this.dates.length * this.options.columnWidth;
|
|
9813
|
+
var header_height = this.options.headerHeight + 10;
|
|
9814
|
+
createSVG("rect", {
|
|
9815
|
+
x: 0,
|
|
9816
|
+
y: 0,
|
|
9817
|
+
width: header_width,
|
|
9818
|
+
height: header_height,
|
|
9819
|
+
class: "grid-header",
|
|
9820
|
+
append_to: this.layers.grid,
|
|
9821
|
+
});
|
|
9822
|
+
};
|
|
9823
|
+
Gantt.prototype.make_grid_ticks = function () {
|
|
9824
|
+
var e_5, _a;
|
|
9825
|
+
var tick_x = 0;
|
|
9826
|
+
var tick_y = this.options.headerHeight + this.options.padding / 2;
|
|
9827
|
+
var tick_height = (this.options.barHeight + this.options.padding) *
|
|
9828
|
+
this.tasks.length;
|
|
9829
|
+
try {
|
|
9830
|
+
for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
9831
|
+
var date = _c.value;
|
|
9832
|
+
var tick_class = "tick";
|
|
9833
|
+
// thick tick for monday
|
|
9834
|
+
if (this.view_is(exports.ViewMode.Day) && date.getDate() === 1) {
|
|
9835
|
+
tick_class += " thick";
|
|
9836
|
+
}
|
|
9837
|
+
// thick tick for first week
|
|
9838
|
+
if (this.view_is(exports.ViewMode.Week) &&
|
|
9839
|
+
date.getDate() >= 1 &&
|
|
9840
|
+
date.getDate() < 8) {
|
|
9841
|
+
tick_class += " thick";
|
|
9842
|
+
}
|
|
9843
|
+
// thick ticks for quarters
|
|
9844
|
+
if (this.view_is(exports.ViewMode.Month) && date.getMonth() % 3 === 0) {
|
|
9845
|
+
tick_class += " thick";
|
|
9846
|
+
}
|
|
9847
|
+
createSVG("path", {
|
|
9848
|
+
d: "M " + tick_x + " " + tick_y + " v " + tick_height,
|
|
9849
|
+
class: tick_class,
|
|
9850
|
+
append_to: this.layers.grid,
|
|
9851
|
+
});
|
|
9852
|
+
if (this.view_is(exports.ViewMode.Month)) {
|
|
9853
|
+
tick_x +=
|
|
9854
|
+
(DateUtils.getDaysInMonth(date) *
|
|
9855
|
+
this.options.columnWidth) /
|
|
9856
|
+
30;
|
|
9857
|
+
}
|
|
9858
|
+
else {
|
|
9859
|
+
tick_x += this.options.columnWidth;
|
|
9860
|
+
}
|
|
9861
|
+
}
|
|
9862
|
+
}
|
|
9863
|
+
catch (e_5_1) { e_5 = { error: e_5_1 }; }
|
|
9864
|
+
finally {
|
|
9865
|
+
try {
|
|
9866
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
9867
|
+
}
|
|
9868
|
+
finally { if (e_5) throw e_5.error; }
|
|
9869
|
+
}
|
|
9870
|
+
};
|
|
9871
|
+
Gantt.prototype.make_grid_highlights = function () {
|
|
9872
|
+
var e_6, _a;
|
|
9873
|
+
if (this.view_is(exports.ViewMode.Day)) {
|
|
9874
|
+
var width = this.options.columnWidth;
|
|
9875
|
+
var height = (this.options.barHeight + this.options.padding) *
|
|
9876
|
+
this.tasks.length +
|
|
9877
|
+
this.options.headerHeight +
|
|
9878
|
+
this.options.padding / 2;
|
|
9879
|
+
var x = 0;
|
|
9880
|
+
try {
|
|
9881
|
+
for (var _b = __values(this.dates), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
9882
|
+
var date = _c.value;
|
|
9883
|
+
var y = (this.options.headerHeight + this.options.padding) / 2;
|
|
9884
|
+
var isToday = date.toString() == DateUtils.today();
|
|
9885
|
+
var isWeekend = (date.getDay() == 0 || date.getDay() == 6);
|
|
9886
|
+
var className = void 0;
|
|
9887
|
+
if (isToday) {
|
|
9888
|
+
className = "today-highlight";
|
|
9889
|
+
y = (this.options.headerHeight + this.options.padding) / 2;
|
|
9890
|
+
}
|
|
9891
|
+
else if (isWeekend) {
|
|
9892
|
+
className = "weekend-highlight";
|
|
9893
|
+
}
|
|
9894
|
+
var rx = 3;
|
|
9895
|
+
var ry = 3;
|
|
9896
|
+
if (isToday || isWeekend) {
|
|
9897
|
+
createSVG("rect", {
|
|
9898
|
+
x: x,
|
|
9899
|
+
y: y,
|
|
9900
|
+
rx: rx,
|
|
9901
|
+
ry: ry,
|
|
9902
|
+
width: width,
|
|
9903
|
+
height: height,
|
|
9904
|
+
class: className,
|
|
9905
|
+
append_to: this.layers.grid
|
|
9906
|
+
});
|
|
9907
|
+
}
|
|
9908
|
+
x += this.options.columnWidth;
|
|
9909
|
+
}
|
|
9910
|
+
}
|
|
9911
|
+
catch (e_6_1) { e_6 = { error: e_6_1 }; }
|
|
9912
|
+
finally {
|
|
9913
|
+
try {
|
|
9914
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
9915
|
+
}
|
|
9916
|
+
finally { if (e_6) throw e_6.error; }
|
|
9917
|
+
}
|
|
9918
|
+
}
|
|
9919
|
+
};
|
|
9920
|
+
Gantt.prototype.make_dates = function () {
|
|
9921
|
+
var dates = this.get_dates_to_draw();
|
|
9922
|
+
var isHourView = this.view_is([exports.ViewMode.Hour, exports.ViewMode.QuarterDay, exports.ViewMode.HalfDay]);
|
|
9923
|
+
var counter = 0;
|
|
9924
|
+
for (var i = 0; i < dates.length; i++) {
|
|
9925
|
+
var date = dates[i];
|
|
9926
|
+
if (isHourView && date.date >= this._realMinDate && date.date <= this._realMaxDate) {
|
|
9927
|
+
createSVG("text", {
|
|
9928
|
+
x: date.lower_x,
|
|
9929
|
+
y: date.lower_y,
|
|
9930
|
+
innerHTML: "H" + counter++ * this.options.step,
|
|
9931
|
+
class: "title-1",
|
|
9932
|
+
append_to: this.layers.date,
|
|
9933
|
+
});
|
|
9934
|
+
}
|
|
9935
|
+
createSVG("text", {
|
|
9936
|
+
x: date.lower_x,
|
|
9937
|
+
y: date.lower_y + 20,
|
|
9938
|
+
innerHTML: date.lower_text,
|
|
9939
|
+
class: "title-2",
|
|
9940
|
+
append_to: this.layers.date,
|
|
9941
|
+
});
|
|
9942
|
+
if (date.upper_text) {
|
|
9943
|
+
var $upper_text = createSVG("text", {
|
|
9944
|
+
x: date.upper_x,
|
|
9945
|
+
y: date.upper_y,
|
|
9946
|
+
innerHTML: date.upper_text,
|
|
9947
|
+
class: "upper-text",
|
|
9948
|
+
append_to: this.layers.date,
|
|
9949
|
+
});
|
|
9950
|
+
// remove out-of-bound dates
|
|
9951
|
+
if ($upper_text.getBBox().x2 > this.layers.grid.getBBox().width) {
|
|
9952
|
+
$upper_text.remove();
|
|
9953
|
+
}
|
|
9954
|
+
}
|
|
9955
|
+
}
|
|
9956
|
+
};
|
|
9957
|
+
Gantt.prototype.get_dates_to_draw = function () {
|
|
9958
|
+
var _this = this;
|
|
9959
|
+
var last_date = null;
|
|
9960
|
+
var dates = this.dates.map(function (date, i) {
|
|
9961
|
+
var d = _this.get_date_info(date, last_date, i);
|
|
9962
|
+
last_date = date;
|
|
9963
|
+
return d;
|
|
9964
|
+
});
|
|
9965
|
+
return dates;
|
|
9966
|
+
};
|
|
9967
|
+
Gantt.prototype.get_date_info = function (date, last_date, i) {
|
|
9968
|
+
if (!last_date) {
|
|
9969
|
+
last_date = DateUtils.add(date, 1, "year");
|
|
9970
|
+
}
|
|
9971
|
+
var date_text = {
|
|
9972
|
+
hourLower: DateUtils.format(date, "HH:mm", this.options.language),
|
|
9973
|
+
quarterDayLower: DateUtils.format(date, "HH:mm", this.options.language),
|
|
9974
|
+
halfDayLower: DateUtils.format(date, "HH:mm", this.options.language),
|
|
9975
|
+
dayLower: date.getDate() !== last_date.getDate()
|
|
9976
|
+
? DateUtils.format(date, "D", this.options.language)
|
|
9977
|
+
: "",
|
|
9978
|
+
weekLower: date.getMonth() !== last_date.getMonth()
|
|
9979
|
+
? DateUtils.format(date, "D MMM", this.options.language)
|
|
9980
|
+
: DateUtils.format(date, "D", this.options.language),
|
|
9981
|
+
monthLower: DateUtils.format(date, "MMMM", this.options.language),
|
|
9982
|
+
yearLower: DateUtils.format(date, "YYYY", this.options.language),
|
|
9983
|
+
quarterDayUpper: date.getDate() !== last_date.getDate()
|
|
9984
|
+
? DateUtils.format(date, "D MMM", this.options.language)
|
|
9985
|
+
: "",
|
|
9986
|
+
halfDayUpper: date.getDate() !== last_date.getDate()
|
|
9987
|
+
? date.getMonth() !== last_date.getMonth()
|
|
9988
|
+
? DateUtils.format(date, "D MMM", this.options.language)
|
|
9989
|
+
: DateUtils.format(date, "D", this.options.language)
|
|
9990
|
+
: "",
|
|
9991
|
+
dayUpper: date.getMonth() !== last_date.getMonth()
|
|
9992
|
+
? DateUtils.format(date, "MMMM", this.options.language)
|
|
9993
|
+
: "",
|
|
9994
|
+
weekUpper: date.getMonth() !== last_date.getMonth()
|
|
9995
|
+
? DateUtils.format(date, "MMMM", this.options.language)
|
|
9996
|
+
: "",
|
|
9997
|
+
monthUpper: date.getFullYear() !== last_date.getFullYear()
|
|
9998
|
+
? DateUtils.format(date, "YYYY", this.options.language)
|
|
9999
|
+
: "",
|
|
10000
|
+
yearUpper: date.getFullYear() !== last_date.getFullYear()
|
|
10001
|
+
? DateUtils.format(date, "YYYY", this.options.language)
|
|
10002
|
+
: "",
|
|
10003
|
+
hour: date.getHours() !== last_date.getHours()
|
|
10004
|
+
? DateUtils.format(date, "HH:mm", this.options.language)
|
|
10005
|
+
: "",
|
|
10006
|
+
};
|
|
10007
|
+
// Descontando 20 para adcionar uma segunda linha de informação no cabeçalho
|
|
10008
|
+
var base_pos = {
|
|
10009
|
+
x: i * this.options.columnWidth,
|
|
10010
|
+
lower_y: this.options.headerHeight - 20,
|
|
10011
|
+
upper_y: this.options.headerHeight - 20 - 25,
|
|
10012
|
+
};
|
|
10013
|
+
var x_pos = {
|
|
10014
|
+
hourLower: this.options.columnWidth / 2,
|
|
10015
|
+
hourUpper: this.options.columnWidth * 24 / 2,
|
|
10016
|
+
quarterDayLower: this.options.columnWidth / 2,
|
|
10017
|
+
quarterDayUpper: this.options.columnWidth * 4 / 2,
|
|
10018
|
+
halfDayLower: this.options.columnWidth / 2,
|
|
10019
|
+
halfDayUpper: this.options.columnWidth * 2 / 2,
|
|
10020
|
+
dayLower: this.options.columnWidth / 2,
|
|
10021
|
+
dayUpper: (this.options.columnWidth * 30) / 2,
|
|
10022
|
+
weekLower: 0,
|
|
10023
|
+
weekUpper: (this.options.columnWidth * 4) / 2,
|
|
10024
|
+
monthLower: this.options.columnWidth / 2,
|
|
10025
|
+
monthUpper: (this.options.columnWidth * 12) / 2,
|
|
10026
|
+
yearLower: this.options.columnWidth / 2,
|
|
10027
|
+
yearUpper: (this.options.columnWidth * 30) / 2,
|
|
10028
|
+
};
|
|
10029
|
+
return {
|
|
10030
|
+
upper_text: date_text[this.options.viewMode + "Upper"],
|
|
10031
|
+
lower_text: date_text[this.options.viewMode + "Lower"],
|
|
10032
|
+
upper_x: base_pos.x + x_pos[this.options.viewMode + "Upper"],
|
|
10033
|
+
upper_y: base_pos.upper_y,
|
|
10034
|
+
lower_x: base_pos.x + x_pos[this.options.viewMode + "Lower"],
|
|
10035
|
+
lower_y: base_pos.lower_y,
|
|
10036
|
+
date: date,
|
|
10037
|
+
};
|
|
10038
|
+
};
|
|
10039
|
+
Gantt.prototype.make_bars = function () {
|
|
10040
|
+
var _this = this;
|
|
10041
|
+
this.bars = this.tasks.map(function (task) {
|
|
10042
|
+
var bar = new Bar(_this, task);
|
|
10043
|
+
_this.layers.bar.appendChild(bar.group);
|
|
10044
|
+
return bar;
|
|
10045
|
+
});
|
|
10046
|
+
};
|
|
10047
|
+
Gantt.prototype.make_arrows = function () {
|
|
10048
|
+
var e_7, _a;
|
|
10049
|
+
var _this = this;
|
|
10050
|
+
this.arrows = [];
|
|
10051
|
+
var _loop_1 = function (task) {
|
|
10052
|
+
var arrows = [];
|
|
10053
|
+
arrows = task.dependencies
|
|
10054
|
+
.map(function (task_id) {
|
|
10055
|
+
var dependency = _this.get_task(task_id);
|
|
10056
|
+
if (!dependency)
|
|
10057
|
+
return;
|
|
10058
|
+
var arrow = new Arrow(_this, _this.bars[dependency._index], // from_task
|
|
10059
|
+
_this.bars[task._index] // to_task
|
|
10060
|
+
);
|
|
10061
|
+
_this.layers.arrow.appendChild(arrow.element);
|
|
10062
|
+
return arrow;
|
|
10063
|
+
})
|
|
10064
|
+
.filter(Boolean); // filter falsy values
|
|
10065
|
+
this_1.arrows = this_1.arrows.concat(arrows);
|
|
10066
|
+
};
|
|
10067
|
+
var this_1 = this;
|
|
10068
|
+
try {
|
|
10069
|
+
for (var _b = __values(this.tasks), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
10070
|
+
var task = _c.value;
|
|
10071
|
+
_loop_1(task);
|
|
10072
|
+
}
|
|
10073
|
+
}
|
|
10074
|
+
catch (e_7_1) { e_7 = { error: e_7_1 }; }
|
|
10075
|
+
finally {
|
|
10076
|
+
try {
|
|
10077
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
10078
|
+
}
|
|
10079
|
+
finally { if (e_7) throw e_7.error; }
|
|
10080
|
+
}
|
|
10081
|
+
};
|
|
10082
|
+
Gantt.prototype.map_arrows_on_bars = function () {
|
|
10083
|
+
var e_8, _a;
|
|
10084
|
+
var _loop_2 = function (bar) {
|
|
10085
|
+
bar.arrows = this_2.arrows.filter(function (arrow) {
|
|
10086
|
+
return (arrow.fromTask.task.id === bar.task.id ||
|
|
10087
|
+
arrow.toTask.task.id === bar.task.id);
|
|
10088
|
+
});
|
|
10089
|
+
};
|
|
10090
|
+
var this_2 = this;
|
|
10091
|
+
try {
|
|
10092
|
+
for (var _b = __values(this.bars), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
10093
|
+
var bar = _c.value;
|
|
10094
|
+
_loop_2(bar);
|
|
10095
|
+
}
|
|
10096
|
+
}
|
|
10097
|
+
catch (e_8_1) { e_8 = { error: e_8_1 }; }
|
|
10098
|
+
finally {
|
|
10099
|
+
try {
|
|
10100
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
10101
|
+
}
|
|
10102
|
+
finally { if (e_8) throw e_8.error; }
|
|
10103
|
+
}
|
|
10104
|
+
};
|
|
10105
|
+
Gantt.prototype.set_width = function () {
|
|
10106
|
+
var cur_width = this.$svg.getBoundingClientRect().width;
|
|
10107
|
+
var actual_width = this.$svg
|
|
10108
|
+
.querySelector(".grid .grid-row")
|
|
10109
|
+
.getAttribute("width");
|
|
10110
|
+
if (cur_width < actual_width) {
|
|
10111
|
+
this.$svg.setAttribute("width", actual_width);
|
|
10112
|
+
}
|
|
10113
|
+
};
|
|
10114
|
+
Gantt.prototype.set_scroll_position = function () {
|
|
10115
|
+
var parent_element = this.$svg.parentElement;
|
|
10116
|
+
if (!parent_element)
|
|
10117
|
+
return;
|
|
10118
|
+
var hours_before_first_task = DateUtils.diff(this.get_oldest_starting_date(), this.minDate, "hour");
|
|
10119
|
+
var scroll_pos = (hours_before_first_task / this.options.step) *
|
|
10120
|
+
this.options.columnWidth -
|
|
10121
|
+
this.options.columnWidth;
|
|
10122
|
+
parent_element.scrollLeft = scroll_pos;
|
|
10123
|
+
};
|
|
10124
|
+
Gantt.prototype.bind_grid_click = function () {
|
|
10125
|
+
var _this = this;
|
|
10126
|
+
$.on(this.$svg, this.options.popupTrigger, ".grid-row, .grid-header", function () {
|
|
10127
|
+
_this.unselect_all();
|
|
10128
|
+
_this.hide_popup();
|
|
10129
|
+
});
|
|
10130
|
+
};
|
|
10131
|
+
Gantt.prototype.bind_bar_events = function () {
|
|
10132
|
+
var _this = this;
|
|
10133
|
+
var is_dragging = false;
|
|
10134
|
+
var x_on_start = 0;
|
|
10135
|
+
var is_resizing_left = false;
|
|
10136
|
+
var is_resizing_right = false;
|
|
10137
|
+
var parent_bar_id = null;
|
|
10138
|
+
var bars = [];
|
|
10139
|
+
this.bar_being_dragged = null;
|
|
10140
|
+
function action_in_progress() {
|
|
10141
|
+
return is_dragging || is_resizing_left || is_resizing_right;
|
|
10142
|
+
}
|
|
10143
|
+
$.on(this.$svg, "mousedown", ".bar-wrapper, .handle", function (e, element) {
|
|
10144
|
+
var bar_wrapper = $.closest(".bar-wrapper", element);
|
|
10145
|
+
if (element.classList.contains("left")) {
|
|
10146
|
+
is_resizing_left = true;
|
|
10147
|
+
}
|
|
10148
|
+
else if (element.classList.contains("right")) {
|
|
10149
|
+
is_resizing_right = true;
|
|
10150
|
+
}
|
|
10151
|
+
else if (element.classList.contains("bar-wrapper")) {
|
|
10152
|
+
is_dragging = true;
|
|
10153
|
+
}
|
|
10154
|
+
bar_wrapper.classList.add("active");
|
|
10155
|
+
x_on_start = e.offsetX;
|
|
10156
|
+
parent_bar_id = bar_wrapper.getAttribute("data-id");
|
|
10157
|
+
var ids = __spread([
|
|
10158
|
+
parent_bar_id
|
|
10159
|
+
], _this.get_all_dependent_tasks(parent_bar_id));
|
|
10160
|
+
bars = ids.map(function (id) { return _this.get_bar(id); });
|
|
10161
|
+
_this.bar_being_dragged = parent_bar_id;
|
|
10162
|
+
bars.forEach(function (bar) {
|
|
10163
|
+
var $bar = bar.element;
|
|
10164
|
+
$bar.ox = $bar.getX();
|
|
10165
|
+
$bar.oy = $bar.getY();
|
|
10166
|
+
$bar.owidth = $bar.getWidth();
|
|
10167
|
+
$bar.finaldx = 0;
|
|
10168
|
+
});
|
|
10169
|
+
});
|
|
10170
|
+
$.on(this.$svg, "mousemove", function (e) {
|
|
10171
|
+
if (!action_in_progress()) {
|
|
10172
|
+
return;
|
|
10173
|
+
}
|
|
10174
|
+
var dx = e.offsetX - x_on_start;
|
|
10175
|
+
bars.forEach(function (bar) {
|
|
10176
|
+
var $bar = bar.element;
|
|
10177
|
+
$bar.finaldx = _this.get_snap_position(dx);
|
|
10178
|
+
_this.hide_popup();
|
|
10179
|
+
if (is_resizing_left) {
|
|
10180
|
+
if (parent_bar_id === bar.task.id) {
|
|
10181
|
+
bar.updateBarPosition({
|
|
10182
|
+
x: $bar.ox + $bar.finaldx,
|
|
10183
|
+
width: $bar.owidth - $bar.finaldx,
|
|
10184
|
+
});
|
|
10185
|
+
}
|
|
10186
|
+
else {
|
|
10187
|
+
bar.updateBarPosition({
|
|
10188
|
+
x: $bar.ox + $bar.finaldx,
|
|
10189
|
+
});
|
|
10190
|
+
}
|
|
10191
|
+
}
|
|
10192
|
+
else if (is_resizing_right) {
|
|
10193
|
+
if (parent_bar_id === bar.task.id) {
|
|
10194
|
+
bar.updateBarPosition({
|
|
10195
|
+
width: $bar.owidth + $bar.finaldx,
|
|
10196
|
+
});
|
|
10197
|
+
}
|
|
10198
|
+
}
|
|
10199
|
+
else if (is_dragging) {
|
|
10200
|
+
bar.updateBarPosition({ x: $bar.ox + $bar.finaldx });
|
|
10201
|
+
}
|
|
10202
|
+
});
|
|
10203
|
+
}, null);
|
|
10204
|
+
document.addEventListener("mouseup", function (e) {
|
|
10205
|
+
if (is_dragging || is_resizing_left || is_resizing_right) {
|
|
10206
|
+
bars.forEach(function (bar) { return bar.group.classList.remove("active"); });
|
|
10207
|
+
}
|
|
10208
|
+
is_dragging = false;
|
|
10209
|
+
is_resizing_left = false;
|
|
10210
|
+
is_resizing_right = false;
|
|
10211
|
+
});
|
|
10212
|
+
$.on(this.$svg, "mouseup", function (e) {
|
|
10213
|
+
_this.bar_being_dragged = null;
|
|
10214
|
+
bars.forEach(function (bar) {
|
|
10215
|
+
var $bar = bar.element;
|
|
10216
|
+
if (!$bar.finaldx)
|
|
10217
|
+
return;
|
|
10218
|
+
bar.dateChanged();
|
|
10219
|
+
bar.setActionCompleted();
|
|
10220
|
+
});
|
|
10221
|
+
}, null);
|
|
10222
|
+
};
|
|
10223
|
+
Gantt.prototype.get_all_dependent_tasks = function (task_id) {
|
|
10224
|
+
var _this = this;
|
|
10225
|
+
var out = [];
|
|
10226
|
+
var to_process = [task_id];
|
|
10227
|
+
while (to_process.length) {
|
|
10228
|
+
var deps = to_process.reduce(function (acc, curr) {
|
|
10229
|
+
acc = acc.concat(_this.dependency_map[curr]);
|
|
10230
|
+
return acc;
|
|
10231
|
+
}, []);
|
|
10232
|
+
out = out.concat(deps);
|
|
10233
|
+
to_process = deps.filter(function (d) { return !to_process.includes(d); });
|
|
10234
|
+
}
|
|
10235
|
+
return out.filter(Boolean);
|
|
10236
|
+
};
|
|
10237
|
+
Gantt.prototype.get_snap_position = function (dx) {
|
|
10238
|
+
var odx = dx, rem, position;
|
|
10239
|
+
if (this.view_is(exports.ViewMode.Hour)) {
|
|
10240
|
+
rem = dx % (this.options.columnWidth / 6);
|
|
10241
|
+
position = odx - rem + (rem < this.options.columnWidth / 12 ? 0 : this.options.columnWidth / 6);
|
|
10242
|
+
}
|
|
10243
|
+
else if (this.view_is(exports.ViewMode.Week)) {
|
|
10244
|
+
rem = dx % (this.options.columnWidth / 7);
|
|
10245
|
+
position = odx - rem + (rem < this.options.columnWidth / 14 ? 0 : this.options.columnWidth / 7);
|
|
10246
|
+
}
|
|
10247
|
+
else if (this.view_is(exports.ViewMode.Month)) {
|
|
10248
|
+
rem = dx % (this.options.columnWidth / 30);
|
|
10249
|
+
position = odx - rem + (rem < this.options.columnWidth / 60 ? 0 : this.options.columnWidth / 30);
|
|
10250
|
+
}
|
|
10251
|
+
else {
|
|
10252
|
+
rem = dx % this.options.columnWidth;
|
|
10253
|
+
position = odx - rem + (rem < this.options.columnWidth / 2 ? 0 : this.options.columnWidth);
|
|
10254
|
+
}
|
|
10255
|
+
return position;
|
|
10256
|
+
};
|
|
10257
|
+
Gantt.prototype.unselect_all = function () {
|
|
10258
|
+
__spread(this.$svg.querySelectorAll(".bar-wrapper")).forEach(function (el) {
|
|
10259
|
+
el.classList.remove("active");
|
|
10260
|
+
});
|
|
10261
|
+
};
|
|
10262
|
+
Gantt.prototype.view_is = function (modes) {
|
|
10263
|
+
var _this = this;
|
|
10264
|
+
if (Array.isArray(modes)) {
|
|
10265
|
+
return modes.some(function (mode) { return _this.options.viewMode === mode; });
|
|
10266
|
+
}
|
|
10267
|
+
return this.options.viewMode === modes;
|
|
10268
|
+
};
|
|
10269
|
+
Gantt.prototype.get_task = function (id) {
|
|
10270
|
+
return this.tasks.find(function (task) {
|
|
10271
|
+
return task.id === id;
|
|
10272
|
+
});
|
|
10273
|
+
};
|
|
10274
|
+
Gantt.prototype.get_bar = function (id) {
|
|
10275
|
+
return this.bars.find(function (bar) {
|
|
10276
|
+
return bar.task.id === id;
|
|
10277
|
+
});
|
|
10278
|
+
};
|
|
10279
|
+
Gantt.prototype.show_popup = function (options) {
|
|
10280
|
+
if (!this.popup) {
|
|
10281
|
+
this.popup = new Popup(this.popup_wrapper, this.options.customPopupHtml);
|
|
10282
|
+
}
|
|
10283
|
+
this.popup.show(options);
|
|
10284
|
+
};
|
|
10285
|
+
Gantt.prototype.hide_popup = function () {
|
|
10286
|
+
this.popup && this.popup.hide();
|
|
10287
|
+
};
|
|
10288
|
+
Gantt.prototype.trigger_event = function (event, args) {
|
|
10289
|
+
if (this.options[event]) {
|
|
10290
|
+
this.options[event].apply(null, args);
|
|
10291
|
+
}
|
|
10292
|
+
};
|
|
10293
|
+
Gantt.prototype.get_oldest_starting_date = function () {
|
|
10294
|
+
return this.tasks
|
|
10295
|
+
.map(function (task) { return task._start; })
|
|
10296
|
+
.reduce(function (prev_date, cur_date) {
|
|
10297
|
+
return cur_date <= prev_date ? cur_date : prev_date;
|
|
10298
|
+
});
|
|
10299
|
+
};
|
|
10300
|
+
Gantt.prototype.clear = function () {
|
|
10301
|
+
this.$svg.innerHTML = '';
|
|
10302
|
+
};
|
|
10303
|
+
return Gantt;
|
|
10304
|
+
}());
|
|
10305
|
+
function generate_id(task) {
|
|
10306
|
+
return task.name + "_" + Math.random().toString(36).slice(2, 12);
|
|
10307
|
+
}
|
|
10308
|
+
|
|
10309
|
+
var GanttComponent = /** @class */ (function () {
|
|
10310
|
+
function GanttComponent() {
|
|
10311
|
+
this.multipleTaskPerLine = false;
|
|
10312
|
+
this.showSideTable = true;
|
|
10313
|
+
this.viewMode = exports.ViewMode.Day;
|
|
10314
|
+
this.taskClicked = new core.EventEmitter();
|
|
10315
|
+
this.taskDateChanged = new core.EventEmitter();
|
|
10316
|
+
this.viewChanged = new core.EventEmitter();
|
|
10317
|
+
}
|
|
10318
|
+
GanttComponent.prototype.ngOnInit = function () {
|
|
10319
|
+
this._validateViewMode();
|
|
10320
|
+
};
|
|
10321
|
+
GanttComponent.prototype.ngAfterViewInit = function () {
|
|
10322
|
+
var _this = this;
|
|
10323
|
+
this._gantt = new Gantt("#gantt", this._filterTask(this.tasks), {
|
|
10324
|
+
viewMode: this.viewMode,
|
|
10325
|
+
marginBeforeStart: this.marginBeforeStart,
|
|
10326
|
+
marginAfterEnd: this.marginAfterEnd,
|
|
10327
|
+
language: "pt-BR",
|
|
10328
|
+
onClick: function (task) { return _this.taskClicked.emit(task); },
|
|
10329
|
+
onDateChange: function (task, start, end) { return _this.taskDateChanged.emit({ task: task, start: start, end: end }); },
|
|
10330
|
+
onViewChange: function (viewMode) { return _this.viewChanged.emit(viewMode); },
|
|
10331
|
+
});
|
|
10332
|
+
};
|
|
10333
|
+
GanttComponent.prototype.ngOnChanges = function (changes) {
|
|
10334
|
+
if (!this._gantt) {
|
|
10335
|
+
return;
|
|
10336
|
+
}
|
|
10337
|
+
if (changes.viewMode) {
|
|
10338
|
+
this._gantt.options.viewMode = changes.viewMode.currentValue;
|
|
10339
|
+
this._gantt.change_view_mode();
|
|
10340
|
+
}
|
|
10341
|
+
if (changes.tasks) {
|
|
10342
|
+
this._gantt.refresh(this._filterTask(changes.tasks.currentValue));
|
|
10343
|
+
}
|
|
10344
|
+
};
|
|
10345
|
+
GanttComponent.prototype._filterTask = function (tasksGroups) {
|
|
10346
|
+
var tasks = [];
|
|
10347
|
+
if (this.multipleTaskPerLine) {
|
|
10348
|
+
tasksGroups.forEach(function (group, index) {
|
|
10349
|
+
tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
|
|
10350
|
+
return __assign(__assign({}, task), { _row_id: index });
|
|
10351
|
+
})));
|
|
10352
|
+
}, []);
|
|
10353
|
+
}
|
|
10354
|
+
else {
|
|
10355
|
+
var i_1 = 0;
|
|
10356
|
+
tasksGroups.forEach(function (group) {
|
|
10357
|
+
tasks.push.apply(tasks, __spread(group.tasks.map(function (task) {
|
|
10358
|
+
return __assign(__assign({}, task), { _row_id: i_1++ });
|
|
10359
|
+
})));
|
|
10360
|
+
}, []);
|
|
10361
|
+
}
|
|
10362
|
+
return tasks;
|
|
10363
|
+
};
|
|
10364
|
+
GanttComponent.prototype._validateViewMode = function () {
|
|
10365
|
+
if (![
|
|
10366
|
+
exports.ViewMode.Hour,
|
|
10367
|
+
exports.ViewMode.QuarterDay,
|
|
10368
|
+
exports.ViewMode.HalfDay,
|
|
10369
|
+
exports.ViewMode.Day,
|
|
10370
|
+
exports.ViewMode.Week,
|
|
10371
|
+
exports.ViewMode.Month,
|
|
10372
|
+
exports.ViewMode.Year,
|
|
10373
|
+
].includes(this.viewMode)) {
|
|
10374
|
+
throw new Error("Invalid gantt view mode");
|
|
10375
|
+
}
|
|
10376
|
+
};
|
|
10377
|
+
__decorate([
|
|
10378
|
+
core.Input()
|
|
10379
|
+
], GanttComponent.prototype, "columnTitle", void 0);
|
|
10380
|
+
__decorate([
|
|
10381
|
+
core.Input()
|
|
10382
|
+
], GanttComponent.prototype, "multipleTaskPerLine", void 0);
|
|
10383
|
+
__decorate([
|
|
10384
|
+
core.Input()
|
|
10385
|
+
], GanttComponent.prototype, "showSideTable", void 0);
|
|
10386
|
+
__decorate([
|
|
10387
|
+
core.Input()
|
|
10388
|
+
], GanttComponent.prototype, "viewMode", void 0);
|
|
10389
|
+
__decorate([
|
|
10390
|
+
core.Input()
|
|
10391
|
+
], GanttComponent.prototype, "tasks", void 0);
|
|
10392
|
+
__decorate([
|
|
10393
|
+
core.Input()
|
|
10394
|
+
], GanttComponent.prototype, "marginBeforeStart", void 0);
|
|
10395
|
+
__decorate([
|
|
10396
|
+
core.Input()
|
|
10397
|
+
], GanttComponent.prototype, "marginAfterEnd", void 0);
|
|
10398
|
+
__decorate([
|
|
10399
|
+
core.Output()
|
|
10400
|
+
], GanttComponent.prototype, "taskClicked", void 0);
|
|
10401
|
+
__decorate([
|
|
10402
|
+
core.Output()
|
|
10403
|
+
], GanttComponent.prototype, "taskDateChanged", void 0);
|
|
10404
|
+
__decorate([
|
|
10405
|
+
core.Output()
|
|
10406
|
+
], GanttComponent.prototype, "viewChanged", void 0);
|
|
10407
|
+
GanttComponent = __decorate([
|
|
10408
|
+
core.Component({
|
|
10409
|
+
selector: "s-gantt",
|
|
10410
|
+
template: "<div class=\"outer\">\n <gantt-side-table\n *ngIf=\"showSideTable\"\n [tasks]=\"tasks\"\n [columnTitle]=\"columnTitle\"\n [multipleTaskPerLine]=\"multipleTaskPerLine\">\n </gantt-side-table>\n <svg id=\"gantt\"></svg>\n</div>",
|
|
10411
|
+
encapsulation: core.ViewEncapsulation.None,
|
|
10412
|
+
styles: [".outer{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:start;align-items:flex-start;-ms-flex-line-pack:center;align-content:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-direction:row;flex-direction:row}", ".gantt{border:1px solid #e0e0e0}.gantt .weekend-highlight{fill:#b8c2cc;opacity:.5;stroke:#ebeff2;stroke-width:1}.gantt .grid-background{fill:none}.gantt .grid-header,.gantt .grid-row{fill:#fff}.gantt .grid-row:nth-child(even){fill:#f5f5f5}.gantt .row-line{stroke:#ebeff2}.gantt .tick{stroke:#e0e0e0;stroke-width:.2}.gantt .tick.thick{stroke-width:.4}.gantt .today-highlight{fill:#ffe979;opacity:.5}.gantt .arrow{fill:none;stroke:#666;stroke-width:1.4}.gantt .bar{opacity:.8;stroke:#8d99a6;stroke-width:0;transition:stroke-width .3s;-webkit-user-select:none;-ms-user-select:none;user-select:none}.gantt .bar-invalid{fill:transparent;stroke:#8d99a6;stroke-dasharray:5;stroke-width:1}.gantt .bar-invalid~.bar-label{fill:#555}.gantt .bar-label{fill:#fff;text-anchor:middle;font-size:12px;font-weight:lighter}.gantt .bar-label.big{fill:#555;text-anchor:start}.gantt .bar-wrapper{cursor:pointer;outline:0}.gantt .bar-wrapper.active .bar,.gantt .bar-wrapper:hover .bar{opacity:1}.gantt .bar-wrapper.active .bar{stroke:#212533;stroke-width:2}.gantt .lower-text,.gantt .upper-text{font-size:12px;text-anchor:middle}.gantt .upper-text{fill:#555}.gantt .lower-text{fill:#333}.gantt .hide{display:none}.gantt-container{border-left:1px solid #e0e0e0;font-size:12px;overflow:auto;position:relative}.gantt-container .title-1{fill:#999;font-size:12px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .title-2{fill:#333;font-size:14px;font-weight:400;line-height:150%;text-anchor:middle}.gantt-container .popup-wrapper{left:0;position:absolute;top:0}.gantt-container .popup-wrapper .popup{background:#0e1119;border-radius:2px;color:#fff;padding:8px;font-family:\"Open Sans\" sans-serif;line-height:150%;font-weight:400}.gantt-container .popup-wrapper .popup .wrp-title{border-bottom:1px solid #525966;padding-bottom:10px}.gantt-container .popup-wrapper .popup .wrp-title .title{font-size:14px}.gantt-container .popup-wrapper .popup .wrp-subtitle{color:#dfe2e5;padding-top:10px}.gantt-container .popup-wrapper .popup .wrp-subtitle .icon{margin-right:8px}.gantt-container .popup-wrapper .popup .wrp-subtitle .subtitle{font-size:12px}.gantt-container .popup-wrapper .popup .pointer{border:6px solid transparent;border-top-color:#0e1119;height:6px;margin-left:-4px;position:absolute}"]
|
|
10413
|
+
})
|
|
10414
|
+
], GanttComponent);
|
|
10415
|
+
return GanttComponent;
|
|
10416
|
+
}());
|
|
10417
|
+
|
|
10418
|
+
var SideTableComponent = /** @class */ (function () {
|
|
10419
|
+
function SideTableComponent() {
|
|
10420
|
+
this.ROW_HEIGHT = 44;
|
|
10421
|
+
this.multipleTaskPerLine = false;
|
|
10422
|
+
}
|
|
10423
|
+
__decorate([
|
|
10424
|
+
core.Input()
|
|
10425
|
+
], SideTableComponent.prototype, "columnTitle", void 0);
|
|
10426
|
+
__decorate([
|
|
10427
|
+
core.Input()
|
|
10428
|
+
], SideTableComponent.prototype, "tasks", void 0);
|
|
10429
|
+
__decorate([
|
|
10430
|
+
core.Input()
|
|
10431
|
+
], SideTableComponent.prototype, "multipleTaskPerLine", void 0);
|
|
10432
|
+
SideTableComponent = __decorate([
|
|
10433
|
+
core.Component({
|
|
10434
|
+
selector: 'gantt-side-table',
|
|
10435
|
+
template: "<div class=\"side-table\">\n <div class=\"column-title\">\n <span>{{ columnTitle }}</span>\n </div>\n <div class=\"tasks\">\n <div *ngFor=\"let task of tasks; let i = index\" class=\"task\" [ngStyle]=\"{'height.px': multipleTaskPerLine\n ? ROW_HEIGHT\n : ROW_HEIGHT * task.tasks.length}\">\n <div class=\"title\">\n {{ task.title }}\n </div>\n <div class=\"subtitle\">\n {{ task.subtitle }}\n </div>\n </div>\n </div>\n</div>",
|
|
10436
|
+
styles: [".side-table{background:#fff;height:100%;min-width:175px}.side-table .column-title{height:106px;border:1px solid #e0e0e0;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;padding:8px}.side-table .column-title span{font-family:\"Open Sans\" sans-serif;font-size:14px;font-weight:700;line-height:150%}.side-table .task{-ms-flex-align:center;align-items:center;background-color:#fff;border:1px solid #e0e0e0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:\"Open Sans\" sans-serif;font-weight:400;-ms-flex-pack:center;justify-content:center;line-height:150%;padding:5px}.side-table .task .title{color:#333;font-size:14px}.side-table .task .subtitle{color:#999;font-size:12px}"]
|
|
10437
|
+
})
|
|
10438
|
+
], SideTableComponent);
|
|
10439
|
+
return SideTableComponent;
|
|
10440
|
+
}());
|
|
10441
|
+
|
|
10442
|
+
var GanttModule = /** @class */ (function () {
|
|
10443
|
+
function GanttModule() {
|
|
10444
|
+
}
|
|
10445
|
+
GanttModule = __decorate([
|
|
10446
|
+
core.NgModule({
|
|
10447
|
+
imports: [common.CommonModule],
|
|
10448
|
+
declarations: [
|
|
10449
|
+
GanttComponent,
|
|
10450
|
+
SideTableComponent,
|
|
10451
|
+
],
|
|
10452
|
+
exports: [GanttComponent],
|
|
10453
|
+
})
|
|
10454
|
+
], GanttModule);
|
|
10455
|
+
return GanttModule;
|
|
10456
|
+
}());
|
|
10457
|
+
|
|
8754
10458
|
var HeaderComponent = /** @class */ (function () {
|
|
8755
10459
|
function HeaderComponent() {
|
|
8756
10460
|
}
|
|
@@ -11728,7 +13432,7 @@
|
|
|
11728
13432
|
startCompletionResultsSearch(context);
|
|
11729
13433
|
}
|
|
11730
13434
|
var cancelLastCompletionSearch = function () { };
|
|
11731
|
-
var ɵ0 = cancelLastCompletionSearch;
|
|
13435
|
+
var ɵ0$1 = cancelLastCompletionSearch;
|
|
11732
13436
|
var codeMirrorViewElement;
|
|
11733
13437
|
/*
|
|
11734
13438
|
* Starts a new completionResults's async search.
|
|
@@ -12698,6 +14402,102 @@
|
|
|
12698
14402
|
return SplitButtonModule;
|
|
12699
14403
|
}());
|
|
12700
14404
|
|
|
14405
|
+
var SwitchComponent = /** @class */ (function () {
|
|
14406
|
+
function SwitchComponent() {
|
|
14407
|
+
this.readonly = false;
|
|
14408
|
+
this.disabled = false;
|
|
14409
|
+
this.valueChanged = new core.EventEmitter();
|
|
14410
|
+
this.value = false;
|
|
14411
|
+
}
|
|
14412
|
+
SwitchComponent_1 = SwitchComponent;
|
|
14413
|
+
SwitchComponent.prototype.onFocusIn = function () {
|
|
14414
|
+
var switchElement = this.switchRef.nativeElement;
|
|
14415
|
+
switchElement.classList.add("switch--focus");
|
|
14416
|
+
};
|
|
14417
|
+
SwitchComponent.prototype.onFocusOut = function () {
|
|
14418
|
+
var switchElement = this.switchRef.nativeElement;
|
|
14419
|
+
switchElement.classList.remove("switch--focus");
|
|
14420
|
+
};
|
|
14421
|
+
SwitchComponent.prototype.writeValue = function (value) {
|
|
14422
|
+
if (!this.disabled) {
|
|
14423
|
+
this.value = value;
|
|
14424
|
+
}
|
|
14425
|
+
};
|
|
14426
|
+
SwitchComponent.prototype.registerOnChange = function (onChange) {
|
|
14427
|
+
this._onChange = onChange;
|
|
14428
|
+
};
|
|
14429
|
+
SwitchComponent.prototype.registerOnTouched = function (onTouched) {
|
|
14430
|
+
this._onTouched = onTouched;
|
|
14431
|
+
};
|
|
14432
|
+
SwitchComponent.prototype.setDisabledState = function (disabled) {
|
|
14433
|
+
this.disabled = disabled;
|
|
14434
|
+
};
|
|
14435
|
+
SwitchComponent.prototype.toggleCheck = function () {
|
|
14436
|
+
this.value = !this.value;
|
|
14437
|
+
this.valueChanged.emit(this.value);
|
|
14438
|
+
if (this._onChange) {
|
|
14439
|
+
this._onChange(this.value);
|
|
14440
|
+
}
|
|
14441
|
+
};
|
|
14442
|
+
var SwitchComponent_1;
|
|
14443
|
+
__decorate([
|
|
14444
|
+
core.Input()
|
|
14445
|
+
], SwitchComponent.prototype, "readonly", void 0);
|
|
14446
|
+
__decorate([
|
|
14447
|
+
core.Input()
|
|
14448
|
+
], SwitchComponent.prototype, "trueLabel", void 0);
|
|
14449
|
+
__decorate([
|
|
14450
|
+
core.Input()
|
|
14451
|
+
], SwitchComponent.prototype, "falseLabel", void 0);
|
|
14452
|
+
__decorate([
|
|
14453
|
+
core.Input()
|
|
14454
|
+
], SwitchComponent.prototype, "inputId", void 0);
|
|
14455
|
+
__decorate([
|
|
14456
|
+
core.Input()
|
|
14457
|
+
], SwitchComponent.prototype, "disabled", void 0);
|
|
14458
|
+
__decorate([
|
|
14459
|
+
core.Output()
|
|
14460
|
+
], SwitchComponent.prototype, "valueChanged", void 0);
|
|
14461
|
+
__decorate([
|
|
14462
|
+
core.Input()
|
|
14463
|
+
], SwitchComponent.prototype, "value", void 0);
|
|
14464
|
+
__decorate([
|
|
14465
|
+
core.ViewChild("switch", { static: true })
|
|
14466
|
+
], SwitchComponent.prototype, "switchRef", void 0);
|
|
14467
|
+
__decorate([
|
|
14468
|
+
core.HostListener('focusin')
|
|
14469
|
+
], SwitchComponent.prototype, "onFocusIn", null);
|
|
14470
|
+
__decorate([
|
|
14471
|
+
core.HostListener('focusout')
|
|
14472
|
+
], SwitchComponent.prototype, "onFocusOut", null);
|
|
14473
|
+
SwitchComponent = SwitchComponent_1 = __decorate([
|
|
14474
|
+
core.Component({
|
|
14475
|
+
selector: 's-switch',
|
|
14476
|
+
template: "<div #switch class=\"switch\" [ngClass]=\"{ 'switch--disabled': disabled }\">\n <label class=\"switch-toggle\">\n <input\n #input\n [id]=\"inputId\"\n type=\"checkbox\"\n [checked]=\"value\"\n [disabled]=\"readonly || disabled\"\n (change)=\"toggleCheck()\">\n <span class=\"slider\"></span>\n </label>\n <span class=\"label\">\n {{ value ? trueLabel : falseLabel }}\n </span>\n</div>",
|
|
14477
|
+
providers: [{
|
|
14478
|
+
provide: forms.NG_VALUE_ACCESSOR,
|
|
14479
|
+
useExisting: core.forwardRef(function () { return SwitchComponent_1; }),
|
|
14480
|
+
multi: true,
|
|
14481
|
+
}],
|
|
14482
|
+
styles: [".switch{display:-ms-inline-flexbox;display:inline-flex}.switch .switch-toggle{display:inline-block;height:24px;position:relative;width:40px}.switch .switch-toggle input{height:0;opacity:0;width:0}.switch .switch-toggle input:checked+.slider{background-color:#428bca;border-radius:15px}.switch .switch-toggle input:checked+.slider:before{transform:translateX(16px)}.switch .switch-toggle .slider{background-color:#a5a5b2;border-radius:15px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.4s}.switch .switch-toggle .slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}.switch .label{color:#212533;font-family:\"Open Sans\" sans-serif;font-size:.875rem;font-weight:400;line-height:150%;margin-left:12px}.switch--disabled{opacity:.5}.switch--focus .switch-toggle .slider{box-shadow:0 0 0 2px #428BCA80}"]
|
|
14483
|
+
})
|
|
14484
|
+
], SwitchComponent);
|
|
14485
|
+
return SwitchComponent;
|
|
14486
|
+
}());
|
|
14487
|
+
|
|
14488
|
+
var SwitchModule = /** @class */ (function () {
|
|
14489
|
+
function SwitchModule() {
|
|
14490
|
+
}
|
|
14491
|
+
SwitchModule = __decorate([
|
|
14492
|
+
core.NgModule({
|
|
14493
|
+
imports: [common.CommonModule],
|
|
14494
|
+
declarations: [SwitchComponent],
|
|
14495
|
+
exports: [SwitchComponent],
|
|
14496
|
+
})
|
|
14497
|
+
], SwitchModule);
|
|
14498
|
+
return SwitchModule;
|
|
14499
|
+
}());
|
|
14500
|
+
|
|
12701
14501
|
var PanelComponent = /** @class */ (function () {
|
|
12702
14502
|
function PanelComponent() {
|
|
12703
14503
|
this.toggleable = true;
|
|
@@ -13043,6 +14843,8 @@
|
|
|
13043
14843
|
exports.FileUploadComponent = FileUploadComponent;
|
|
13044
14844
|
exports.FileUploadModule = FileUploadModule;
|
|
13045
14845
|
exports.FormField = FormField;
|
|
14846
|
+
exports.GanttComponent = GanttComponent;
|
|
14847
|
+
exports.GanttModule = GanttModule;
|
|
13046
14848
|
exports.GlobalSearchComponent = GlobalSearchComponent;
|
|
13047
14849
|
exports.GlobalSearchDropdownItemComponent = GlobalSearchDropdownItemComponent;
|
|
13048
14850
|
exports.GlobalSearchModule = GlobalSearchModule;
|
|
@@ -13114,6 +14916,8 @@
|
|
|
13114
14916
|
exports.StepsComponent = StepsComponent;
|
|
13115
14917
|
exports.StepsModule = StepsModule;
|
|
13116
14918
|
exports.Structure = Structure;
|
|
14919
|
+
exports.SwitchComponent = SwitchComponent;
|
|
14920
|
+
exports.SwitchModule = SwitchModule;
|
|
13117
14921
|
exports.TableFrozenPositionDirective = TableFrozenPositionDirective;
|
|
13118
14922
|
exports.TableHeaderCheckboxComponent = TableHeaderCheckboxComponent;
|
|
13119
14923
|
exports.TableHeaderCheckboxModule = TableHeaderCheckboxModule;
|
|
@@ -13144,30 +14948,31 @@
|
|
|
13144
14948
|
exports.ɵbe = PasswordFieldComponent;
|
|
13145
14949
|
exports.ɵbf = SliderFieldComponent;
|
|
13146
14950
|
exports.ɵbh = DecimalField;
|
|
13147
|
-
exports.ɵbi =
|
|
13148
|
-
exports.ɵbj =
|
|
13149
|
-
exports.ɵbk =
|
|
13150
|
-
exports.ɵbl =
|
|
13151
|
-
exports.ɵbm =
|
|
13152
|
-
exports.ɵbn =
|
|
13153
|
-
exports.ɵbo =
|
|
13154
|
-
exports.ɵbp =
|
|
13155
|
-
exports.ɵbq =
|
|
13156
|
-
exports.ɵbr =
|
|
13157
|
-
exports.ɵbs =
|
|
13158
|
-
exports.ɵbt =
|
|
13159
|
-
exports.ɵbu =
|
|
13160
|
-
exports.ɵbv =
|
|
13161
|
-
exports.ɵbw =
|
|
13162
|
-
exports.ɵbx =
|
|
13163
|
-
exports.ɵby =
|
|
13164
|
-
exports.ɵbz =
|
|
14951
|
+
exports.ɵbi = SideTableComponent;
|
|
14952
|
+
exports.ɵbj = StructureModule;
|
|
14953
|
+
exports.ɵbk = HeaderComponent;
|
|
14954
|
+
exports.ɵbl = FooterComponent;
|
|
14955
|
+
exports.ɵbm = NumberLocaleOptions;
|
|
14956
|
+
exports.ɵbn = ThumbnailService;
|
|
14957
|
+
exports.ɵbo = BorderButtonModule;
|
|
14958
|
+
exports.ɵbp = BorderButtonComponent;
|
|
14959
|
+
exports.ɵbq = TimelineItemModule;
|
|
14960
|
+
exports.ɵbr = TimelineIconItemComponent;
|
|
14961
|
+
exports.ɵbs = HorizontalTimelineModule;
|
|
14962
|
+
exports.ɵbt = HorizontalTimelineComponent;
|
|
14963
|
+
exports.ɵbu = VerticalTimelineModule;
|
|
14964
|
+
exports.ɵbv = VerticalTimelineComponent;
|
|
14965
|
+
exports.ɵbw = RangeLineComponent;
|
|
14966
|
+
exports.ɵbx = CollapseOptionComponent;
|
|
14967
|
+
exports.ɵby = CollapsedItemsComponent;
|
|
14968
|
+
exports.ɵbz = VerticalItemsComponent;
|
|
13165
14969
|
exports.ɵc = CountryPhonePickerService;
|
|
13166
|
-
exports.ɵca =
|
|
13167
|
-
exports.ɵcb =
|
|
13168
|
-
exports.ɵcc =
|
|
13169
|
-
exports.ɵcd =
|
|
13170
|
-
exports.ɵce =
|
|
14970
|
+
exports.ɵca = InfiniteScrollModule;
|
|
14971
|
+
exports.ɵcb = InfiniteScrollDirective;
|
|
14972
|
+
exports.ɵcc = CustomTranslationsModule;
|
|
14973
|
+
exports.ɵcd = CodeEditorComponent;
|
|
14974
|
+
exports.ɵce = CoreFacade;
|
|
14975
|
+
exports.ɵcf = CodeMirror6Core;
|
|
13171
14976
|
exports.ɵd = LocalizedCurrencyImpurePipe;
|
|
13172
14977
|
exports.ɵe = LocalizedBignumberPipe;
|
|
13173
14978
|
exports.ɵf = LocalizedBignumberImpurePipe;
|