@worktile/gantt 12.2.0-next.1 → 12.2.0

package/bundles/worktile-gantt.umd.js

@@ -564,24 +564,24 @@
         GanttViewType["week"] = "week";
     })(exports.GanttViewType || (exports.GanttViewType = {}));
 
-    var GanttLinkType;
+    exports.GanttLinkType = void 0;
     (function (GanttLinkType) {
         GanttLinkType[GanttLinkType["fs"] = 1] = "fs";
         GanttLinkType[GanttLinkType["ff"] = 2] = "ff";
         GanttLinkType[GanttLinkType["ss"] = 3] = "ss";
         GanttLinkType[GanttLinkType["sf"] = 4] = "sf";
-    })(GanttLinkType || (GanttLinkType = {}));
-    var GanttLinkPathType;
-    (function (GanttLinkPathType) {
-        GanttLinkPathType["curve"] = "curve";
-        GanttLinkPathType["line"] = "line";
-    })(GanttLinkPathType || (GanttLinkPathType = {}));
-    var LinkColors;
+    })(exports.GanttLinkType || (exports.GanttLinkType = {}));
+    exports.GanttLinkLineType = void 0;
+    (function (GanttLinkLineType) {
+        GanttLinkLineType["curve"] = "curve";
+        GanttLinkLineType["straight"] = "straight";
+    })(exports.GanttLinkLineType || (exports.GanttLinkLineType = {}));
+    exports.LinkColors = void 0;
     (function (LinkColors) {
         LinkColors["default"] = "#cacaca";
         LinkColors["blocked"] = "#FF7575";
         LinkColors["active"] = "#348FE4";
-    })(LinkColors || (LinkColors = {}));
+    })(exports.LinkColors || (exports.LinkColors = {}));
 
     exports.GanttItemType = void 0;
     (function (GanttItemType) {
@@ -598,7 +598,7 @@
             this.links = (this.origin.links || []).map(function (link) {
                 if (typeof link === 'string') {
                     return {
-                        type: GanttLinkType.fs,
+                        type: exports.GanttLinkType.fs,
                         link: link
                     };
                 }
@@ -668,8 +668,9 @@
             this.expanded = expanded;
             this.origin.expanded = expanded;
         };
-        GanttItemInternal.prototype.addLink = function (linkId) {
-            this.links = __spreadArray(__spreadArray([], __read(this.links)), [{ type: GanttLinkType.fs, link: linkId }]);
+        GanttItemInternal.prototype.addLink = function (link) {
+            console.log(link);
+            this.links = __spreadArray(__spreadArray([], __read(this.links)), [link]);
             this.origin.links = this.links;
         };
         return GanttItemInternal;
@@ -703,9 +704,9 @@
             yearQuarter: 'yyyy年QQQ'
         },
         linkOptions: {
-            dependencyTypes: [GanttLinkType.fs],
+            dependencyTypes: [exports.GanttLinkType.fs],
             showArrow: false,
-            linkPathType: GanttLinkPathType.curve
+            lineType: exports.GanttLinkLineType.curve
         }
     };
     var GANTT_GLOBAL_CONFIG = new i0.InjectionToken('GANTT_GLOBAL_CONFIG');
@@ -1200,6 +1201,16 @@
             this._multiple = false;
             this.ganttClass = true;
         }
+        Object.defineProperty(GanttUpper.prototype, "linkOptions", {
+            get: function () {
+                return Object.assign({}, defaultConfig.linkOptions, this.config.linkOptions, this._linkOptions);
+            },
+            set: function (options) {
+                this._linkOptions = options;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(GanttUpper.prototype, "selectable", {
             get: function () {
                 return this._selectable;
@@ -1444,7 +1455,7 @@
         return GanttUpper;
     }());
     GanttUpper.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttUpper, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.NgZone }, { token: GANTT_GLOBAL_CONFIG }], target: i0__namespace.ɵɵFactoryTarget.Directive });
-    GanttUpper.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.2", type: GanttUpper, inputs: { originItems: ["items", "originItems"], originGroups: ["groups", "originGroups"], viewType: "viewType", start: "start", end: "end", showTodayLine: "showTodayLine", draggable: "draggable", styles: "styles", viewOptions: "viewOptions", disabledLoadOnScroll: "disabledLoadOnScroll", selectable: "selectable", multiple: "multiple" }, outputs: { loadOnScroll: "loadOnScroll", dragStarted: "dragStarted", dragMoved: "dragMoved", dragEnded: "dragEnded", barClick: "barClick" }, host: { properties: { "class.gantt": "this.ganttClass" } }, queries: [{ propertyName: "barTemplate", first: true, predicate: ["bar"], descendants: true, static: true }, { propertyName: "rangeTemplate", first: true, predicate: ["range"], descendants: true, static: true }, { propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true, static: true }, { propertyName: "groupTemplate", first: true, predicate: ["group"], descendants: true, static: true }, { propertyName: "groupHeaderTemplate", first: true, predicate: ["groupHeader"], descendants: true, static: true }], ngImport: i0__namespace });
+    GanttUpper.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.2", type: GanttUpper, inputs: { originItems: ["items", "originItems"], originGroups: ["groups", "originGroups"], viewType: "viewType", start: "start", end: "end", showTodayLine: "showTodayLine", draggable: "draggable", styles: "styles", viewOptions: "viewOptions", linkOptions: "linkOptions", disabledLoadOnScroll: "disabledLoadOnScroll", selectable: "selectable", multiple: "multiple" }, outputs: { loadOnScroll: "loadOnScroll", dragStarted: "dragStarted", dragMoved: "dragMoved", dragEnded: "dragEnded", barClick: "barClick" }, host: { properties: { "class.gantt": "this.ganttClass" } }, queries: [{ propertyName: "barTemplate", first: true, predicate: ["bar"], descendants: true, static: true }, { propertyName: "rangeTemplate", first: true, predicate: ["range"], descendants: true, static: true }, { propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true, static: true }, { propertyName: "groupTemplate", first: true, predicate: ["group"], descendants: true, static: true }, { propertyName: "groupHeaderTemplate", first: true, predicate: ["groupHeader"], descendants: true, static: true }], ngImport: i0__namespace });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttUpper, decorators: [{
                 type: i0.Directive
             }], ctorParameters: function () {
@@ -1472,6 +1483,8 @@
                     type: i0.Input
                 }], viewOptions: [{
                     type: i0.Input
+                }], linkOptions: [{
+                    type: i0.Input
                 }], disabledLoadOnScroll: [{
                     type: i0.Input
                 }], selectable: [{
@@ -1941,64 +1954,80 @@
                 type: i0.Injectable
             }], ctorParameters: function () { return []; } });
 
+    function getDependencyType(path, dependencyTypes) {
+        if (dependencyTypes.includes(exports.GanttLinkType.ss) && path.from.pos === InBarPosition.start && path.to.pos === InBarPosition.start) {
+            return exports.GanttLinkType.ss;
+        }
+        if (dependencyTypes.includes(exports.GanttLinkType.ff) && path.from.pos === InBarPosition.finish && path.to.pos === InBarPosition.finish) {
+            return exports.GanttLinkType.ff;
+        }
+        if (dependencyTypes.includes(exports.GanttLinkType.sf) && path.from.pos === InBarPosition.start && path.to.pos === InBarPosition.finish) {
+            return exports.GanttLinkType.sf;
+        }
+        return exports.GanttLinkType.fs;
+    }
+    var InBarPosition;
+    (function (InBarPosition) {
+        InBarPosition["start"] = "start";
+        InBarPosition["finish"] = "finish";
+    })(InBarPosition || (InBarPosition = {}));
     var GanttDragContainer = /** @class */ (function () {
-        function GanttDragContainer() {
+        function GanttDragContainer(ganttUpper) {
+            this.ganttUpper = ganttUpper;
             this.dragStarted = new i0.EventEmitter();
             this.dragMoved = new i0.EventEmitter();
             this.dragEnded = new i0.EventEmitter();
             this.linkDragStarted = new i0.EventEmitter();
             this.linkDragEntered = new i0.EventEmitter();
             this.linkDragEnded = new i0.EventEmitter();
+            this.linkDragPath = { from: null, to: null };
         }
-        GanttDragContainer.prototype.emitLinkDragStarted = function (from, item) {
-            this.linkDraggingId = item.id;
-            this.linkDragFrom = from;
-            this.linkDragSource = this.linkDragFrom === 'source' ? item : null;
-            this.linkDragTarget = this.linkDragFrom === 'target' ? item : null;
+        GanttDragContainer.prototype.emitLinkDragStarted = function (from) {
+            this.linkDraggingId = from.item.id;
+            this.linkDragPath.from = from;
             this.linkDragStarted.emit({
-                source: this.linkDragSource && this.linkDragSource.origin,
-                target: this.linkDragTarget && this.linkDragTarget.origin
+                source: from.item.origin,
+                target: null
             });
         };
-        GanttDragContainer.prototype.emitLinkDragEntered = function (item) {
-            if (this.linkDragFrom === 'source') {
-                this.linkDragTarget = item;
-            }
-            else {
-                this.linkDragSource = item;
-            }
+        GanttDragContainer.prototype.emitLinkDragEntered = function (to) {
+            this.linkDragPath.to = to;
             this.linkDragEntered.emit({
-                source: this.linkDragSource.origin,
-                target: this.linkDragTarget.origin
+                source: this.linkDragPath.from.item.origin,
+                target: to.item.origin
             });
         };
         GanttDragContainer.prototype.emitLinkDragLeaved = function () {
-            if (this.linkDragFrom === 'source') {
-                this.linkDragTarget = null;
-            }
-            else {
-                this.linkDragSource = null;
-            }
+            this.linkDragPath.to = null;
         };
-        GanttDragContainer.prototype.emitLinkDragEnded = function () {
+        GanttDragContainer.prototype.emitLinkDragEnded = function (to) {
+            var _a;
+            this.linkDragPath.to = to;
+            var dependencyType = getDependencyType(this.linkDragPath, (_a = this.ganttUpper.linkOptions) === null || _a === void 0 ? void 0 : _a.dependencyTypes);
+            this.linkDragPath.from.item.addLink({
+                link: this.linkDragPath.to.item.id,
+                type: dependencyType
+            });
+            this.linkDragEnded.emit({
+                source: this.linkDragPath.from.item.origin,
+                target: this.linkDragPath.to.item.origin,
+                type: dependencyType
+            });
             this.linkDraggingId = null;
-            if (this.linkDragSource && this.linkDragTarget) {
-                this.linkDragSource.addLink(this.linkDragTarget.id);
-                this.linkDragEnded.emit({
-                    source: this.linkDragSource.origin,
-                    target: this.linkDragTarget.origin
-                });
-            }
-            this.linkDragSource = null;
-            this.linkDragTarget = null;
+            this.linkDragPath = { from: null, to: null };
         };
         return GanttDragContainer;
     }());
-    GanttDragContainer.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttDragContainer, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    GanttDragContainer.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttDragContainer, deps: [{ token: GANTT_UPPER_TOKEN }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
     GanttDragContainer.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttDragContainer });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttDragContainer, decorators: [{
                 type: i0.Injectable
-            }], ctorParameters: function () { return []; } });
+            }], ctorParameters: function () {
+            return [{ type: GanttUpper, decorators: [{
+                            type: i0.Inject,
+                            args: [GANTT_UPPER_TOKEN]
+                        }] }];
+        } });
 
     var GanttPrintService = /** @class */ (function () {
         function GanttPrintService() {
@@ -2349,20 +2378,20 @@
                     args: ['mainTemplate', { static: true }]
                 }] } });
 
-    var GanttLinkPath = /** @class */ (function () {
-        function GanttLinkPath() {
+    var GanttLinkLine = /** @class */ (function () {
+        function GanttLinkLine() {
         }
-        GanttLinkPath.prototype.generatePath = function (source, target, type) {
+        GanttLinkLine.prototype.generatePath = function (source, target, type) {
             if (source.before && source.after && target.before && target.after) {
                 var path = '';
                 switch (type) {
-                    case GanttLinkType.ss:
+                    case exports.GanttLinkType.ss:
                         path = this.generateSSPath(source, target);
                         break;
-                    case GanttLinkType.ff:
+                    case exports.GanttLinkType.ff:
                         path = this.generateFFPath(source, target);
                         break;
-                    case GanttLinkType.sf:
+                    case exports.GanttLinkType.sf:
                         path = this.generateFSAndSFPath(source, target, type);
                         break;
                     default:
@@ -2371,23 +2400,17 @@
                 return path;
             }
         };
-        return GanttLinkPath;
+        return GanttLinkLine;
     }());
-    GanttLinkPath.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttLinkPath, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
-    GanttLinkPath.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttLinkPath });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: GanttLinkPath, decorators: [{
-                type: i0.Injectable
-            }], ctorParameters: function () { return []; } });
 
-    var GanttLinkPathCurve = /** @class */ (function (_super) {
-        __extends(GanttLinkPathCurve, _super);
-        function GanttLinkPathCurve(ganttUpper) {
+    var GanttLinkLineCurve = /** @class */ (function (_super) {
+        __extends(GanttLinkLineCurve, _super);
+        function GanttLinkLineCurve(ganttUpper) {
             var _this = _super.call(this) || this;
             _this.ganttUpper = ganttUpper;
-            _this.bezierWeight = -0.5;
             return _this;
         }
-        GanttLinkPathCurve.prototype.generateSSPath = function (source, target) {
+        GanttLinkLineCurve.prototype.generateSSPath = function (source, target) {
             var x1 = source.before.x;
             var y1 = source.before.y;
             var x4 = target.before.x;
@@ -2401,7 +2424,7 @@
                 return "M " + x1 + " " + y1 + "\n                    L " + x4 + " " + y1 + "\n                    A " + radius + " " + radius + " 0 1 " + isMirror + " " + x4 + " " + y4;
             }
         };
-        GanttLinkPathCurve.prototype.generateFFPath = function (source, target) {
+        GanttLinkLineCurve.prototype.generateFFPath = function (source, target) {
             var x1 = source.after.x;
             var y1 = source.after.y;
             var x4 = target.after.x;
@@ -2415,75 +2438,65 @@
                 return "M " + x1 + " " + y1 + "\n                    A " + radius + " " + radius + " 0 1 " + isMirror + " " + x1 + " " + y4 + "\n                    L " + x4 + " " + y4;
             }
         };
-        GanttLinkPathCurve.prototype.generateFSAndSFPath = function (source, target, type) {
+        GanttLinkLineCurve.prototype.generateFSAndSFPath = function (source, target, type) {
+            var _a;
             var x1 = source.after.x;
             var y1 = source.after.y;
             var x4 = target.before.x;
             var y4 = target.before.y;
-            if (type === GanttLinkType.sf) {
+            var bezierWeight = 0.5;
+            if (type === exports.GanttLinkType.sf) {
                 x1 = target.after.x;
                 y1 = target.after.y;
                 x4 = source.before.x;
                 y4 = source.before.y;
             }
-            var dx = Math.abs(x4 - x1) * this.bezierWeight;
-            var x2 = x1 - dx;
-            var x3 = x4 + dx;
+            var dx = Math.abs(x4 - x1) * bezierWeight;
+            var x2 = x1 + dx;
+            var x3 = x4 - dx;
             var centerX = (x1 + x4) / 2;
             var centerY = (y1 + y4) / 2;
             var controlX = this.ganttUpper.styles.lineHeight / 2;
             var controlY = this.ganttUpper.styles.lineHeight / 2;
             if (x1 >= x4) {
-                if (y4 > y1) {
-                    if (Math.abs(y4 - y1) <= this.ganttUpper.styles.lineHeight) {
-                        return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y1 + controlX) + " " + x1 + " " + (y1 + controlY) + "\n                    L " + x4 + " " + (y4 - controlY) + "\n                    C " + (x4 - controlY) + " " + (y4 - controlY) + "  " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4;
-                    }
-                    else {
-                        controlX = this.ganttUpper.styles.lineHeight;
-                        return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y1 + controlX) + " " + centerX + " " + centerY + "\n                    C " + (x4 - controlX) + " " + (y4 - controlX) + " " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4 + "\n                    ";
-                    }
+                if (Math.abs(y4 - y1) <= this.ganttUpper.styles.lineHeight) {
+                    return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y4 > y1 ? y1 + controlX : y1 - controlX) + " " + x1 + " " + (y4 > y1 ? y1 + controlY : y1 - controlY) + "\n                    L " + x4 + " " + (y4 > y1 ? y4 - controlY : y4 + controlY) + "\n                    C " + (x4 - controlY) + " " + (y4 > y1 ? y4 - controlY : y4 + controlY) + "  " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4 + "\n                    ";
                 }
                 else {
-                    if (Math.abs(y4 - y1) <= this.ganttUpper.styles.lineHeight) {
-                        return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y1 - controlX) + " " + x1 + " " + (y1 - controlY) + "\n                    L " + x4 + " " + (y4 + controlY) + "\n                    C " + (x4 - controlY) + " " + (y4 + controlY) + " " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4 + "\n                    ";
-                    }
-                    else {
-                        controlX = this.ganttUpper.styles.lineHeight;
-                        return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y1 - controlX) + " " + centerX + " " + centerY + "\n                    C " + (x4 - controlX) + " " + (y4 + controlX) + " " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4 + "\n                    ";
-                    }
+                    controlX = this.ganttUpper.styles.lineHeight;
+                    return "M " + x1 + " " + y1 + "\n                    C " + (x1 + controlX) + " " + y1 + " " + (x1 + controlX) + " " + (y4 > y1 ? y1 + controlX : y1 - controlX) + " " + centerX + " " + centerY + "\n                    C " + (x4 - controlX) + " " + (y4 > y1 ? y4 - controlX : y4 + controlX) + " " + (x4 - controlX) + " " + y4 + " " + x4 + " " + y4 + "\n                    ";
                 }
             }
-            else if (x4 - x1 < 100) {
-                var radius = Math.abs(y4 - y1) / 4;
-                var lindWidth = x4 - x1 - radius;
-                lindWidth = Math.max(lindWidth, radius);
-                return "M " + x1 + " " + y1 + "\n                    L " + (x1 + lindWidth) + " " + y1 + "\n                    A " + radius + " " + radius + " 0 1 " + (y4 > y1 ? 1 : 0) + " " + (x1 + lindWidth) + " " + (y4 > y1 ? y1 + 2 * radius : y1 - 2 * radius) + "\n                    L " + (x4 - lindWidth) + " " + (y4 > y1 ? y1 + 2 * radius : y1 - 2 * radius) + "\n                    A " + radius + " " + radius + " 0 1 " + (y4 > y1 ? 0 : 1) + " " + (x4 - lindWidth) + " " + y4 + "\n                    L " + x4 + " " + y4 + "\n                    ";
+            else if (((_a = this.ganttUpper.linkOptions) === null || _a === void 0 ? void 0 : _a.showArrow) && x4 - x1 < 200) {
+                dx = Math.max(Math.abs(y4 - y1) * bezierWeight, 60);
+                x2 = x1 + dx;
+                x3 = x4 - dx;
+                return "M " + x1 + " " + y1 + " C " + x2 + " " + y1 + " " + x3 + " " + y4 + " " + x4 + " " + y4;
             }
             return "M " + x1 + " " + y1 + " C " + x2 + " " + y1 + " " + x3 + " " + y4 + " " + x4 + " " + y4;
         };
-        return GanttLinkPathCurve;
-    }(GanttLinkPath));
-    GanttLinkPathCurve = __decorate([
+        return GanttLinkLineCurve;
+    }(GanttLinkLine));
+    GanttLinkLineCurve = __decorate([
         __param(0, i0.Inject(GANTT_UPPER_TOKEN))
-    ], GanttLinkPathCurve);
+    ], GanttLinkLineCurve);
 
-    var GanttLinkPathLine = /** @class */ (function (_super) {
-        __extends(GanttLinkPathLine, _super);
-        function GanttLinkPathLine() {
+    var GanttLinkLineStraight = /** @class */ (function (_super) {
+        __extends(GanttLinkLineStraight, _super);
+        function GanttLinkLineStraight() {
             var _this = _super.call(this) || this;
             _this.pathControl = 20;
             return _this;
         }
-        GanttLinkPathLine.prototype.generateSSPath = function (source, target) {
+        GanttLinkLineStraight.prototype.generateSSPath = function (source, target) {
             var x1 = source.before.x;
             var y1 = source.before.y;
             var x4 = target.before.x;
             var y4 = target.before.y;
             var control = this.pathControl;
-            var centerY = (y1 + y4) / 2;
             return "M " + x1 + " " + y1 + "\n                        L " + (x4 > x1 ? x1 - control : x4 - control) + " " + y1 + "\n                        L " + (x4 > x1 ? x1 - control : x4 - control) + " " + y4 + "\n                        L " + x4 + " " + y4;
         };
-        GanttLinkPathLine.prototype.generateFFPath = function (source, target) {
+        GanttLinkLineStraight.prototype.generateFFPath = function (source, target) {
             var x1 = source.after.x;
             var y1 = source.after.y;
             var x4 = target.after.x;
@@ -2491,13 +2504,13 @@
             var control = this.pathControl;
             return "M " + x1 + " " + y1 + "\n                        L " + (x4 > x1 ? x4 + control : x1 + control) + " " + y1 + "\n                        L " + (x4 > x1 ? x4 + control : x1 + control) + " " + y4 + "\n                        L " + x4 + " " + y4;
         };
-        GanttLinkPathLine.prototype.generateFSAndSFPath = function (source, target, type) {
+        GanttLinkLineStraight.prototype.generateFSAndSFPath = function (source, target, type) {
             var x1 = source.after.x;
             var y1 = source.after.y;
             var x4 = target.before.x;
             var y4 = target.before.y;
             var control = this.pathControl;
-            if (type === GanttLinkType.sf) {
+            if (type === exports.GanttLinkType.sf) {
                 x1 = target.after.x;
                 y1 = target.after.y;
                 x4 = source.before.x;
@@ -2510,15 +2523,15 @@
                 return "M " + x1 + " " + y1 + "\n                        L " + (x1 + control) + " " + y1 + "\n                        L " + (x1 + control) + " " + (y4 > y1 ? y1 + control : y1 - control) + "\n                        L " + (x4 - control) + " " + (y4 > y1 ? y1 + control : y1 - control) + "\n                        L " + (x4 - control) + " " + y4 + "\n                        L " + x4 + " " + y4;
             }
         };
-        return GanttLinkPathLine;
-    }(GanttLinkPath));
+        return GanttLinkLineStraight;
+    }(GanttLinkLine));
 
-    function generatePathFactory(type, ganttUpper) {
+    function createLineGenerator(type, ganttUpper) {
         switch (type) {
-            case GanttLinkPathType.curve:
-                return new GanttLinkPathCurve(ganttUpper);
-            case GanttLinkPathType.line:
-                return new GanttLinkPathLine();
+            case exports.GanttLinkLineType.curve:
+                return new GanttLinkLineCurve(ganttUpper);
+            case exports.GanttLinkLineType.straight:
+                return new GanttLinkLineStraight();
             default:
                 throw new Error('gantt link path type invalid');
         }
@@ -2534,7 +2547,7 @@
             this.items = [];
             this.lineClick = new i0.EventEmitter();
             this.links = [];
-            this.ganttLinkTypes = GanttLinkType;
+            this.ganttLinkTypes = exports.GanttLinkType;
             this.showArrow = false;
             this.linkItems = [];
             this.firstChange = true;
@@ -2543,7 +2556,7 @@
         }
         GanttLinksComponent.prototype.ngOnInit = function () {
             var _this = this;
-            this.linkPath = generatePathFactory(this.ganttUpper.linkOptions.linkPathType, this.ganttUpper);
+            this.linkLine = createLineGenerator(this.ganttUpper.linkOptions.lineType, this.ganttUpper);
             this.showArrow = this.ganttUpper.linkOptions.showArrow;
             this.buildLinks();
             this.firstChange = false;
@@ -2612,12 +2625,12 @@
                     source.links.forEach(function (link) {
                         var target = _this.linkItems.find(function (item) { return item.id === link.link; });
                         if (target && (target.origin.start || target.origin.end)) {
-                            var color = LinkColors.default;
-                            if (link.type === GanttLinkType.fs && source.end.getTime() > target.start.getTime()) {
-                                color = LinkColors.blocked;
+                            var color = exports.LinkColors.default;
+                            if (link.type === exports.GanttLinkType.fs && source.end.getTime() > target.start.getTime()) {
+                                color = exports.LinkColors.blocked;
                             }
                             _this.links.push({
-                                path: _this.linkPath.generatePath(source, target, link.type),
+                                path: _this.linkLine.generatePath(source, target, link.type),
                                 source: source.origin,
                                 target: target.origin,
                                 type: link.type,
@@ -2639,13 +2652,13 @@
             });
         };
         GanttLinksComponent.prototype.mouseEnterPath = function (link) {
-            if (link.color === LinkColors.default) {
-                link.color = LinkColors.active;
+            if (link.color === exports.LinkColors.default) {
+                link.color = exports.LinkColors.active;
             }
         };
         GanttLinksComponent.prototype.mouseLeavePath = function (link) {
-            if (link.color === LinkColors.active) {
-                link.color = LinkColors.default;
+            if (link.color === exports.LinkColors.active) {
+                link.color = exports.LinkColors.default;
             }
         };
         GanttLinksComponent.prototype.ngOnDestroy = function () {
@@ -2770,7 +2783,8 @@
 
     var dragMinWidth = 10;
     var activeClass = 'gantt-bar-active';
-    var linkDropClass = 'gantt-bar-link-drop';
+    var dropActiveClass = 'gantt-bar-drop-active';
+    var singleDropActiveClass = 'gantt-bar-single-drop-active';
     function createSvgElement(qualifiedName, className) {
         var element = document.createElementNS('http://www.w3.org/2000/svg', qualifiedName);
         element.classList.add(className);
@@ -2800,13 +2814,21 @@
         });
         GanttBarDrag.prototype.createMouseEvents = function () {
             var _this = this;
+            var _a, _b, _c;
+            var dropClass = ((_b = (_a = this.ganttUpper.config.linkOptions) === null || _a === void 0 ? void 0 : _a.dependencyTypes) === null || _b === void 0 ? void 0 : _b.length) === 1 &&
+                ((_c = this.ganttUpper.config.linkOptions) === null || _c === void 0 ? void 0 : _c.dependencyTypes[0]) === exports.GanttLinkType.fs
+                ? singleDropActiveClass
+                : dropActiveClass;
             rxjs.fromEvent(this.barElement, 'mouseenter')
                 .pipe(operators.takeUntil(this.destroy$))
-                .subscribe(function () {
+                .subscribe(function (event) {
                 if (_this.dragContainer.linkDraggingId && _this.dragContainer.linkDraggingId !== _this.item.id) {
                     if (_this.item.linkable) {
-                        _this.barElement.classList.add(linkDropClass);
-                        _this.dragContainer.emitLinkDragEntered(_this.item);
+                        _this.barElement.classList.add(dropClass);
+                        _this.dragContainer.emitLinkDragEntered({
+                            item: _this.item,
+                            element: _this.barElement
+                        });
                     }
                 }
                 else {
@@ -2815,14 +2837,14 @@
             });
             rxjs.fromEvent(this.barElement, 'mouseleave')
                 .pipe(operators.takeUntil(this.destroy$))
-                .subscribe(function () {
+                .subscribe(function (event) {
                 if (!_this.dragContainer.linkDraggingId) {
                     _this.barElement.classList.remove(activeClass);
                 }
                 else {
                     _this.dragContainer.emitLinkDragLeaved();
                 }
-                _this.barElement.classList.remove(linkDropClass);
+                _this.barElement.classList.remove(dropClass);
             });
         };
         GanttBarDrag.prototype.createBarDrag = function () {
@@ -2925,7 +2947,7 @@
             var dragRefs = [];
             var handles = this.barElement.querySelectorAll('.link-handles .handle');
             handles.forEach(function (handle, index) {
-                var isBefore = index === 0;
+                var isBegin = index === 0;
                 var dragRef = _this.dragDrop.createDrag(handle);
                 dragRef.withBoundaryElement(_this.dom.root);
                 dragRef.beforeStarted.subscribe(function () {
@@ -2934,24 +2956,35 @@
                         _this.barDragRef.disabled = true;
                     }
                     _this.createLinkDraggingLine();
-                    _this.dragContainer.emitLinkDragStarted(isBefore ? 'target' : 'source', _this.item);
+                    _this.dragContainer.emitLinkDragStarted({
+                        element: _this.barElement,
+                        item: _this.item,
+                        pos: isBegin ? InBarPosition.start : InBarPosition.finish
+                    });
                 });
                 dragRef.moved.subscribe(function () {
-                    var positions = _this.calcLinkLinePositions(handle, isBefore);
+                    var positions = _this.calcLinkLinePositions(handle, isBegin);
                     _this.linkDraggingLine.setAttribute('x1', positions.x1.toString());
                     _this.linkDraggingLine.setAttribute('y1', positions.y1.toString());
                     _this.linkDraggingLine.setAttribute('x2', positions.x2.toString());
                     _this.linkDraggingLine.setAttribute('y2', positions.y2.toString());
                 });
                 dragRef.ended.subscribe(function (event) {
-                    event.source.reset();
                     handle.style.pointerEvents = '';
                     if (_this.barDragRef) {
                         _this.barDragRef.disabled = false;
                     }
+                    // 计算line拖动的落点位于目标Bar的值，如果值大于Bar宽度的一半，说明是拖动到Begin位置，否则则为拖动到End位置
+                    if (_this.dragContainer.linkDragPath.to) {
+                        var placePointX = event.source.getRootElement().getBoundingClientRect().x -
+                            _this.dragContainer.linkDragPath.to.element.getBoundingClientRect().x;
+                        _this.dragContainer.emitLinkDragEnded(Object.assign(Object.assign({}, _this.dragContainer.linkDragPath.to), { pos: placePointX < _this.dragContainer.linkDragPath.to.item.refs.width / 2
+                                ? InBarPosition.start
+                                : InBarPosition.finish }));
+                    }
+                    event.source.reset();
                     _this.barElement.classList.remove(activeClass);
                     _this.destroyLinkDraggingLine();
-                    _this.dragContainer.emitLinkDragEnded();
                 });
                 dragRefs.push(dragRef);
             });
@@ -3000,6 +3033,7 @@
             if (!this.linkDraggingLine) {
                 var svgElement = createSvgElement('svg', 'gantt-link-drag-container');
                 var linElement = createSvgElement('line', 'link-dragging-line');
+                linElement.style.pointerEvents = 'none';
                 svgElement.appendChild(linElement);
                 this.dom.root.appendChild(svgElement);
                 this.linkDraggingLine = linElement;
@@ -3012,7 +3046,7 @@
             }
         };
         GanttBarDrag.prototype.createDrags = function (elementRef, item, ganttUpper) {
-            var _a, _b;
+            var _d, _e;
             this.item = item;
             this.barElement = elementRef.nativeElement;
             this.ganttUpper = ganttUpper;
@@ -3024,11 +3058,11 @@
                 if (!this.dragDisabled) {
                     var dragRef = this.createBarDrag();
                     var dragHandlesRefs = this.createBarHandleDrags();
-                    (_a = this.dragRefs).push.apply(_a, __spreadArray([dragRef], __read(dragHandlesRefs)));
+                    (_d = this.dragRefs).push.apply(_d, __spreadArray([dragRef], __read(dragHandlesRefs)));
                 }
                 if (!this.linkDragDisabled) {
                     var linkDragRefs = this.createLinkHandleDrags();
-                    (_b = this.dragRefs).push.apply(_b, __spreadArray([], __read(linkDragRefs)));
+                    (_e = this.dragRefs).push.apply(_e, __spreadArray([], __read(linkDragRefs)));
                 }
             }
         };
@@ -3200,9 +3234,7 @@
         }
         NgxGanttComponent.prototype.ngOnInit = function () {
             var _this = this;
-            var _a;
             _super.prototype.onInit.call(this);
-            this.linkOptions = Object.assign({}, defaultConfig.linkOptions, (_a = this.config) === null || _a === void 0 ? void 0 : _a.linkOptions, this.linkOptions);
             this.ngZone.onStable.pipe(operators.take(1)).subscribe(function () {
                 _this.dragContainer.linkDragStarted.pipe(operators.takeUntil(_this.ngUnsubscribe$)).subscribe(function (event) {
                     _this.linkDragStarted.emit(event);
@@ -3262,12 +3294,12 @@
             this.selectionModel.toggle(selectedValue.id);
             var selectedIds = this.selectionModel.selected;
             if (this.multiple) {
-                var selectedValue_1 = this.getGanttItems(selectedIds).map(function (item) { return item.origin; });
-                this.selectedChange.emit({ event: event, selectedValue: selectedValue_1 });
+                var _selectedValue = this.getGanttItems(selectedIds).map(function (item) { return item.origin; });
+                this.selectedChange.emit({ event: event, selectedValue: _selectedValue });
             }
             else {
-                var selectedValue_2 = (_a = this.getGanttItem(selectedIds[0])) === null || _a === void 0 ? void 0 : _a.origin;
-                this.selectedChange.emit({ event: event, selectedValue: selectedValue_2 });
+                var _selectedValue = (_a = this.getGanttItem(selectedIds[0])) === null || _a === void 0 ? void 0 : _a.origin;
+                this.selectedChange.emit({ event: event, selectedValue: _selectedValue });
             }
         };
         NgxGanttComponent.prototype.ngOnDestroy = function () {
@@ -3276,7 +3308,7 @@
         return NgxGanttComponent;
     }(GanttUpper));
     NgxGanttComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.2", ngImport: i0__namespace, type: NgxGanttComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.NgZone }, { token: GANTT_GLOBAL_CONFIG }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NgxGanttComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.2", type: NgxGanttComponent, selector: "ngx-gantt", inputs: { maxLevel: "maxLevel", async: "async", childrenResolve: "childrenResolve", linkable: "linkable", linkOptions: "linkOptions" }, outputs: { linkDragStarted: "linkDragStarted", linkDragEnded: "linkDragEnded", lineClick: "lineClick", selectedChange: "selectedChange" }, providers: [
+    NgxGanttComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.2", type: NgxGanttComponent, selector: "ngx-gantt", inputs: { maxLevel: "maxLevel", async: "async", childrenResolve: "childrenResolve", linkable: "linkable" }, outputs: { linkDragStarted: "linkDragStarted", linkDragEnded: "linkDragEnded", lineClick: "lineClick", selectedChange: "selectedChange" }, providers: [
             {
                 provide: GANTT_UPPER_TOKEN,
                 useExisting: NgxGanttComponent
@@ -3316,8 +3348,6 @@
                     type: i0.Input
                 }], linkable: [{
                     type: i0.Input
-                }], linkOptions: [{
-                    type: i0.Input
                 }], linkDragStarted: [{
                     type: i0.Output
                 }], linkDragEnded: [{