修复 时间组件拖拽 位置数据不更新的问题
This commit is contained in:
parent
0f9b0f84a5
commit
38f7b1a6e2
@ -104,18 +104,16 @@ class MouseController extends Eventful {
|
||||
const draggingTarget = e.target;
|
||||
// draggingTarget.draggable
|
||||
if (draggingTarget) {
|
||||
if (e.target.parent.getName()=='background') {
|
||||
if (e.target.parent.name=='background') {
|
||||
this._draggingName='background';
|
||||
} else if (this.isAllowDragging&&e.target.parent.getName()=='simple') {
|
||||
} else if (this.isAllowDragging&&e.target.parent.name=='simple') {
|
||||
this._draggingName='simple';
|
||||
} else if (this.isAllowDragging&&e.target.parent.getName()=='group') {
|
||||
} else if (this.isAllowDragging&&e.target.parent.name=='group') {
|
||||
this._draggingName='group';
|
||||
this._offsetX=e.offsetX;
|
||||
this._offsetY=e.offsetY;
|
||||
// debugger;
|
||||
// this._draggingTarget.parent.model.point
|
||||
|
||||
} else if (this.isAllowDragging&&e.target.parent.getName()=='group_child') {
|
||||
} else if (this.isAllowDragging&&(e.target.parent.name=='group_child'||e.target.name=='group_child')) {
|
||||
this._draggingName='group_child';
|
||||
this._offsetX=e.offsetX;
|
||||
this._offsetY=e.offsetY;
|
||||
@ -127,13 +125,6 @@ class MouseController extends Eventful {
|
||||
this._dragging = true;
|
||||
// this.dispatchToElement(param(draggingTarget, e), 'dragstart', e.event);
|
||||
}
|
||||
|
||||
// var x = e.offsetX;
|
||||
// var y = e.offsetY;
|
||||
|
||||
// this._x = x;
|
||||
// this._y = y;
|
||||
// this._dragging = true;
|
||||
}
|
||||
|
||||
mousemove(e) {
|
||||
@ -161,39 +152,44 @@ class MouseController extends Eventful {
|
||||
} else if (this.isAllowDragging&&this._draggingTarget&&this._draggingName=='simple') {
|
||||
this._draggingTarget.drift(dx, dy, e);
|
||||
return true;
|
||||
} else if (this.isAllowDragging&&this._draggingTarget&&(this._draggingName=='group'||this._draggingName=='group_child')) {
|
||||
// debugger;
|
||||
if (this._draggingName=='group') {
|
||||
// this._draggingTarget.parent.model.point.x+=dx;
|
||||
// this._draggingTarget.parent.model.point.y+=dy;
|
||||
// this._draggingTarget.parent.dirty();
|
||||
} else if (this.isAllowDragging&&this._draggingTarget&&(this._draggingName=='group_child')) {
|
||||
// this._draggingName=='group'||
|
||||
if (this._draggingTarget.parent.parent.name=='group') {
|
||||
this._draggingTarget.parent.drift(dx, dy, e);
|
||||
return true;
|
||||
} else {
|
||||
this._draggingTarget.parent.parent.drift(dx, dy, e);
|
||||
return true;
|
||||
}
|
||||
// if (this._draggingName=='group') {
|
||||
// // this._draggingTarget.parent.model.point.x+=dx;
|
||||
// // this._draggingTarget.parent.model.point.y+=dy;
|
||||
// // this._draggingTarget.parent.dirty();
|
||||
// this._draggingTarget.parent.drift(dx, dy, e);
|
||||
// return true;
|
||||
// } else {
|
||||
// this._draggingTarget.parent.parent.drift(dx, dy, e);
|
||||
// return true;
|
||||
// }
|
||||
}
|
||||
} else {
|
||||
// debugger;
|
||||
return true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
mouseup(e) {
|
||||
// debugger;
|
||||
const draggingTarget = this._draggingTarget;
|
||||
if (!eventTool.notLeftMouse(e)&&draggingTarget) {
|
||||
if (this._draggingName=='simple') {
|
||||
console.log();
|
||||
} else if (this._draggingName=='group'||this._draggingName=='group_child') {
|
||||
if (this._draggingName=='group') {
|
||||
this._draggingTarget.parent.setModal(e.offsetX - this._offsetX, e.offsetY - this._offsetY);
|
||||
this._draggingTarget.parent.dirty();
|
||||
if (this._draggingTarget.parent.parent.name=='group') {
|
||||
this._draggingTarget.parent.parent.setModal(e.offsetX - this._offsetX, e.offsetY - this._offsetY);
|
||||
this._draggingTarget.parent.parent.dirty();
|
||||
} else {
|
||||
this._draggingTarget.parent.parent.parent.setModal(e.offsetX - this._offsetX, e.offsetY - this._offsetY);
|
||||
this._draggingTarget.parent.parent.dirty();
|
||||
this._draggingTarget.parent.dirty();
|
||||
}
|
||||
}
|
||||
this._dragging = false;
|
||||
|
@ -31,24 +31,34 @@ export default class clock extends Group {
|
||||
|
||||
}
|
||||
create() {
|
||||
this.grouper=new Group({
|
||||
id: this.model.code,
|
||||
position: [this.model.point.x, this.model.point.y]
|
||||
});
|
||||
this.clockBg = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: {
|
||||
image: clockBg,
|
||||
x: this.model.point.x,
|
||||
y: this.model.point.y,
|
||||
// x: this.model.point.x,
|
||||
// y: this.model.point.y,
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: this.model.width,
|
||||
height: this.model.width/493*156
|
||||
}
|
||||
});
|
||||
this.clockBg.name ='group_child';
|
||||
this.num1 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.1,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.1,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.1,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -56,10 +66,13 @@ export default class clock extends Group {
|
||||
this.num2 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.22,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.22,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.22,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -67,10 +80,13 @@ export default class clock extends Group {
|
||||
this.num3 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.39,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.39,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.39,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -78,10 +94,13 @@ export default class clock extends Group {
|
||||
this.num4 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.52,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.52,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.52,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -89,10 +108,13 @@ export default class clock extends Group {
|
||||
this.num5 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.69,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.69,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.69,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -100,10 +122,13 @@ export default class clock extends Group {
|
||||
this.num6 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: this.getImagePic('0'),
|
||||
x: this.model.point.x+this.model.width*0.82,
|
||||
y: this.model.point.y+this.model.width*0.052,
|
||||
// x: this.model.point.x+this.model.width*0.82,
|
||||
// y: this.model.point.y+this.model.width*0.052,
|
||||
x: this.model.width*0.82,
|
||||
y: this.model.width*0.052,
|
||||
width: this.model.width*0.1,
|
||||
height: this.model.width*0.1/37*74
|
||||
}
|
||||
@ -111,10 +136,13 @@ export default class clock extends Group {
|
||||
this.clockColon1 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: clockColon,
|
||||
x: this.model.point.x+this.model.width*0.16,
|
||||
y: this.model.point.y-this.model.width*0.028,
|
||||
// x: this.model.point.x+this.model.width*0.16,
|
||||
// y: this.model.point.y-this.model.width*0.028,
|
||||
x: +this.model.width*0.16,
|
||||
y: -this.model.width*0.028,
|
||||
width: this.model.width*0.37,
|
||||
height: this.model.width/1*0.37
|
||||
}
|
||||
@ -122,23 +150,27 @@ export default class clock extends Group {
|
||||
this.clockColon2 = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: 'group_child',
|
||||
style: {
|
||||
image: clockColon,
|
||||
x: this.model.point.x+this.model.width*0.46,
|
||||
y: this.model.point.y-this.model.width*0.028,
|
||||
// x: this.model.point.x+this.model.width*0.46,
|
||||
// y: this.model.point.y-this.model.width*0.028,
|
||||
x: +this.model.width*0.46,
|
||||
y: -this.model.width*0.028,
|
||||
width: this.model.width*0.37,
|
||||
height: this.model.width/1*0.37
|
||||
}
|
||||
});
|
||||
this.add(this.clockBg);
|
||||
this.add(this.num1);
|
||||
this.add(this.num2);
|
||||
this.add(this.num3);
|
||||
this.add(this.num4);
|
||||
this.add(this.num5);
|
||||
this.add(this.num6);
|
||||
this.add(this.clockColon1);
|
||||
this.add(this.clockColon2);
|
||||
this.grouper.add(this.clockBg);
|
||||
this.grouper.add(this.num1);
|
||||
this.grouper.add(this.num2);
|
||||
this.grouper.add(this.num3);
|
||||
this.grouper.add(this.num4);
|
||||
this.grouper.add(this.num5);
|
||||
this.grouper.add(this.num6);
|
||||
this.grouper.add(this.clockColon1);
|
||||
this.grouper.add(this.clockColon2);
|
||||
this.add(this.grouper);
|
||||
}
|
||||
getImagePic(context) {
|
||||
let pic = clock0;
|
||||
@ -268,8 +300,12 @@ export default class clock extends Group {
|
||||
// debugger;
|
||||
// this.parent.dirty();
|
||||
//
|
||||
// this.model.point.x+=dx;
|
||||
// this.model.point.y+=dy;
|
||||
this.model.point.x+=dx;
|
||||
this.model.point.y+=dy;
|
||||
// this.attr('transform', [1, 0, 0, 1, 0, 0]);
|
||||
// this.transform = [1, 0, 0, 1, 0, 0];
|
||||
// this.invTransform = [1, 0, 0, 1, 0, 0];
|
||||
// console.log(this.model, this);
|
||||
// this.eachChild(function(child) {
|
||||
// // // debugger;
|
||||
// child.style.x+=dx;
|
||||
|
Loading…
Reference in New Issue
Block a user