|
@@ -8,124 +8,124 @@ import {
|
|
import { SItemStatus } from "..";
|
|
import { SItemStatus } from "..";
|
|
import { SMouseEvent } from "@saga-web/base";
|
|
import { SMouseEvent } from "@saga-web/base";
|
|
import { SSize, SRect, SPainter, SColor, SFont } from "@saga-web/draw";
|
|
import { SSize, SRect, SPainter, SColor, SFont } from "@saga-web/draw";
|
|
|
|
+import { Anchor } from "../types/topology/Anchor";
|
|
|
|
|
|
/**
|
|
/**
|
|
* 图例item icon
|
|
* 图例item icon
|
|
*
|
|
*
|
|
* */
|
|
* */
|
|
export class SIconTextItem extends SObjectItem {
|
|
export class SIconTextItem extends SObjectItem {
|
|
-
|
|
|
|
/** item状态 */
|
|
/** item状态 */
|
|
_status: SItemStatus = SItemStatus.Normal;
|
|
_status: SItemStatus = SItemStatus.Normal;
|
|
get status(): SItemStatus {
|
|
get status(): SItemStatus {
|
|
- return this._status;
|
|
|
|
|
|
+ return this._status;
|
|
}
|
|
}
|
|
set status(v: SItemStatus) {
|
|
set status(v: SItemStatus) {
|
|
- this._status = v;
|
|
|
|
- if (v == SItemStatus.Normal) {
|
|
|
|
- this.moveable = true;
|
|
|
|
- this.textItem.moveable = false;
|
|
|
|
- this.img.moveable = false;
|
|
|
|
- } else if (v == SItemStatus.Edit) {
|
|
|
|
- this.moveable = false;
|
|
|
|
- this.textItem.moveable = true;
|
|
|
|
- this.img.moveable = true;
|
|
|
|
- } else if (v == SItemStatus.Create) {
|
|
|
|
- this.moveable = true;
|
|
|
|
- this.textItem.moveable = false;
|
|
|
|
- this.img.moveable = false;
|
|
|
|
- }
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this._status = v;
|
|
|
|
+ if (v == SItemStatus.Normal) {
|
|
|
|
+ this.moveable = true;
|
|
|
|
+ this.textItem.moveable = false;
|
|
|
|
+ this.img.moveable = false;
|
|
|
|
+ } else if (v == SItemStatus.Edit) {
|
|
|
|
+ this.moveable = false;
|
|
|
|
+ this.textItem.moveable = true;
|
|
|
|
+ this.img.moveable = true;
|
|
|
|
+ } else if (v == SItemStatus.Create) {
|
|
|
|
+ this.moveable = true;
|
|
|
|
+ this.textItem.moveable = false;
|
|
|
|
+ this.img.moveable = false;
|
|
|
|
+ }
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
|
|
|
|
/** 是否显示文字 */
|
|
/** 是否显示文字 */
|
|
_showText: boolean = true;
|
|
_showText: boolean = true;
|
|
get showText(): boolean {
|
|
get showText(): boolean {
|
|
- return this._showText;
|
|
|
|
|
|
+ return this._showText;
|
|
}
|
|
}
|
|
set showText(v: boolean) {
|
|
set showText(v: boolean) {
|
|
- if (v === this._showText) {
|
|
|
|
- return
|
|
|
|
- }
|
|
|
|
- this._showText = v;
|
|
|
|
- if (v) {
|
|
|
|
- this.textItem.show();
|
|
|
|
- } else {
|
|
|
|
- this.textItem.hide();
|
|
|
|
- }
|
|
|
|
|
|
+ if (v === this._showText) {
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ this._showText = v;
|
|
|
|
+ if (v) {
|
|
|
|
+ this.textItem.show();
|
|
|
|
+ } else {
|
|
|
|
+ this.textItem.hide();
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
/** X轴坐标 */
|
|
/** X轴坐标 */
|
|
get x(): number {
|
|
get x(): number {
|
|
- return this.pos.x;
|
|
|
|
|
|
+ return this.pos.x;
|
|
} // Get x
|
|
} // Get x
|
|
set x(v: number) {
|
|
set x(v: number) {
|
|
- this.pos.x = v;
|
|
|
|
- this.$emit("changePos");
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.pos.x = v;
|
|
|
|
+ this.$emit("changePos");
|
|
|
|
+ this.update();
|
|
} // Set x
|
|
} // Set x
|
|
/** Y轴坐标 */
|
|
/** Y轴坐标 */
|
|
get y(): number {
|
|
get y(): number {
|
|
- return this.pos.y;
|
|
|
|
|
|
+ return this.pos.y;
|
|
} // Get y
|
|
} // Get y
|
|
set y(v: number) {
|
|
set y(v: number) {
|
|
- this.pos.y = v;
|
|
|
|
- this.$emit("changePos");
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.pos.y = v;
|
|
|
|
+ this.$emit("changePos");
|
|
|
|
+ this.update();
|
|
} // Set y
|
|
} // Set y
|
|
|
|
|
|
/** icon宽 */
|
|
/** icon宽 */
|
|
get sWidth(): number {
|
|
get sWidth(): number {
|
|
- return this.img.width;
|
|
|
|
|
|
+ return this.img.width;
|
|
}
|
|
}
|
|
set sWidth(v: number) {
|
|
set sWidth(v: number) {
|
|
- this.img.width = v;
|
|
|
|
- this.changeAhchorPoint();
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.img.width = v;
|
|
|
|
+ this.changeAhchorPoint();
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
|
|
|
|
/** icon宽 */
|
|
/** icon宽 */
|
|
get sHeight(): number {
|
|
get sHeight(): number {
|
|
- return this.img.height;
|
|
|
|
|
|
+ return this.img.height;
|
|
}
|
|
}
|
|
set sHeight(v: number) {
|
|
set sHeight(v: number) {
|
|
- this.img.height = v;
|
|
|
|
- this.changeAhchorPoint();
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.img.height = v;
|
|
|
|
+ this.changeAhchorPoint();
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
|
|
|
|
/** 是否显示锚点 */
|
|
/** 是否显示锚点 */
|
|
_showAnchor: boolean = false;
|
|
_showAnchor: boolean = false;
|
|
get showAnchor(): boolean {
|
|
get showAnchor(): boolean {
|
|
- return this._showAnchor;
|
|
|
|
|
|
+ return this._showAnchor;
|
|
}
|
|
}
|
|
set showAnchor(v: boolean) {
|
|
set showAnchor(v: boolean) {
|
|
- this._showAnchor = v;
|
|
|
|
- this.anchorList.forEach(t => {
|
|
|
|
- t.visible = v;
|
|
|
|
- })
|
|
|
|
|
|
+ this._showAnchor = v;
|
|
|
|
+ this.anchorList.forEach(t => {
|
|
|
|
+ t.visible = v;
|
|
|
|
+ });
|
|
}
|
|
}
|
|
|
|
|
|
get text(): string {
|
|
get text(): string {
|
|
- return this.textItem.text;
|
|
|
|
|
|
+ return this.textItem.text;
|
|
}
|
|
}
|
|
set text(v: string) {
|
|
set text(v: string) {
|
|
- this.textItem.text = v;
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.textItem.text = v;
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
get color(): SColor {
|
|
get color(): SColor {
|
|
- return this.textItem.color;
|
|
|
|
|
|
+ return this.textItem.color;
|
|
}
|
|
}
|
|
set color(v: SColor) {
|
|
set color(v: SColor) {
|
|
- this.textItem.color = v;
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.textItem.color = v;
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
get font(): SFont {
|
|
get font(): SFont {
|
|
- return this.textItem.font;
|
|
|
|
|
|
+ return this.textItem.font;
|
|
}
|
|
}
|
|
set font(v: SFont) {
|
|
set font(v: SFont) {
|
|
- this.textItem.font = v;
|
|
|
|
- this.update();
|
|
|
|
|
|
+ this.textItem.font = v;
|
|
|
|
+ this.update();
|
|
}
|
|
}
|
|
/** img Item */
|
|
/** img Item */
|
|
img: SImageItem = new SImageItem(this);
|
|
img: SImageItem = new SImageItem(this);
|
|
@@ -137,32 +137,46 @@ export class SIconTextItem extends SObjectItem {
|
|
* 构造体
|
|
* 构造体
|
|
*
|
|
*
|
|
* */
|
|
* */
|
|
- constructor(parent: SGraphItem | null) {
|
|
|
|
- super(parent);
|
|
|
|
- this.img.url = `http://adm.sagacloud.cn:8080/doc/assets/img/logo.png`;
|
|
|
|
- this.img.width = 24;
|
|
|
|
- this.img.height = 24;
|
|
|
|
- this.img.connect("onMove", this, this.changeAhchorPoint.bind(this));
|
|
|
|
- let anchorPoint = [
|
|
|
|
- { x: this.img.x, y: this.img.y + (this.img.height / 2) },
|
|
|
|
- { x: this.img.x, y: this.img.y - (this.img.height / 2) },
|
|
|
|
- { x: this.img.x - (this.img.width / 2), y: this.img.y },
|
|
|
|
- { x: this.img.x + (this.img.width / 2), y: this.img.y }
|
|
|
|
- ];
|
|
|
|
- this.anchorList = anchorPoint.map(t => {
|
|
|
|
- let item = new SAnchorItem(this);
|
|
|
|
- item.moveTo(t.x, t.y);
|
|
|
|
- return item;
|
|
|
|
- });
|
|
|
|
- this.update();
|
|
|
|
- this.textItem.text = "";
|
|
|
|
- this.textItem.backgroundColor = SColor.White;
|
|
|
|
- this.textItem.font.size = 12;
|
|
|
|
- // 偏移二分之一文本高度
|
|
|
|
- this.textItem.moveTo(17, -(this.textItem.height * 0.5));
|
|
|
|
- this.moveable = true;
|
|
|
|
- this.selectable = true;
|
|
|
|
- this.isTransform = false;
|
|
|
|
|
|
+ constructor(parent: SGraphItem | null, data?: Anchor[]) {
|
|
|
|
+ super(parent);
|
|
|
|
+ this.img.url = `http://adm.sagacloud.cn:8080/doc/assets/img/logo.png`;
|
|
|
|
+ this.img.width = 24;
|
|
|
|
+ this.img.height = 24;
|
|
|
|
+ this.img.connect("onMove", this, this.changeAhchorPoint.bind(this));
|
|
|
|
+ let anchorPoint;
|
|
|
|
+ if (data && data.length) {
|
|
|
|
+ anchorPoint = data.map(t => {
|
|
|
|
+ return {
|
|
|
|
+ x: t.Pos.X,
|
|
|
|
+ y: t.Pos.Y,
|
|
|
|
+ id: t.ID
|
|
|
|
+ };
|
|
|
|
+ });
|
|
|
|
+ } else {
|
|
|
|
+ anchorPoint = [
|
|
|
|
+ { x: this.img.x, y: this.img.y + this.img.height / 2, id: "" },
|
|
|
|
+ { x: this.img.x, y: this.img.y - this.img.height / 2, id: "" },
|
|
|
|
+ { x: this.img.x - this.img.width / 2, y: this.img.y, id: "" },
|
|
|
|
+ { x: this.img.x + this.img.width / 2, y: this.img.y, id: "" }
|
|
|
|
+ ];
|
|
|
|
+ }
|
|
|
|
+ this.anchorList = anchorPoint.map(t => {
|
|
|
|
+ let item = new SAnchorItem(this);
|
|
|
|
+ if (t.id) {
|
|
|
|
+ item.id = t.id;
|
|
|
|
+ }
|
|
|
|
+ item.moveTo(t.x, t.y);
|
|
|
|
+ return item;
|
|
|
|
+ });
|
|
|
|
+ this.update();
|
|
|
|
+ this.textItem.text = "";
|
|
|
|
+ this.textItem.backgroundColor = SColor.White;
|
|
|
|
+ this.textItem.font.size = 12;
|
|
|
|
+ // 偏移二分之一文本高度
|
|
|
|
+ this.textItem.moveTo(17, -(this.textItem.height * 0.5));
|
|
|
|
+ this.moveable = true;
|
|
|
|
+ this.selectable = true;
|
|
|
|
+ this.isTransform = false;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -170,18 +184,18 @@ export class SIconTextItem extends SObjectItem {
|
|
*
|
|
*
|
|
* */
|
|
* */
|
|
private changeAhchorPoint(): void {
|
|
private changeAhchorPoint(): void {
|
|
- // 判断是否有锚点
|
|
|
|
- if (this.anchorList.length) {
|
|
|
|
- let anchorPoint = [
|
|
|
|
- { x: this.img.x, y: this.img.y + (this.img.height / 2) },
|
|
|
|
- { x: this.img.x, y: this.img.y - (this.img.height / 2) },
|
|
|
|
- { x: this.img.x - (this.img.width / 2), y: this.img.y },
|
|
|
|
- { x: this.img.x + (this.img.width / 2), y: this.img.y }
|
|
|
|
- ];
|
|
|
|
- this.anchorList.forEach((item, index) => {
|
|
|
|
- item.moveTo(anchorPoint[index].x, anchorPoint[index].y);
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
|
|
+ // 判断是否有锚点
|
|
|
|
+ if (this.anchorList.length) {
|
|
|
|
+ let anchorPoint = [
|
|
|
|
+ { x: this.img.x, y: this.img.y + this.img.height / 2 },
|
|
|
|
+ { x: this.img.x, y: this.img.y - this.img.height / 2 },
|
|
|
|
+ { x: this.img.x - this.img.width / 2, y: this.img.y },
|
|
|
|
+ { x: this.img.x + this.img.width / 2, y: this.img.y }
|
|
|
|
+ ];
|
|
|
|
+ this.anchorList.forEach((item, index) => {
|
|
|
|
+ item.moveTo(anchorPoint[index].x, anchorPoint[index].y);
|
|
|
|
+ });
|
|
|
|
+ }
|
|
} // Function changeAhchorPoint()
|
|
} // Function changeAhchorPoint()
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -189,12 +203,12 @@ export class SIconTextItem extends SObjectItem {
|
|
*
|
|
*
|
|
* */
|
|
* */
|
|
onMouseDown(event: SMouseEvent): boolean {
|
|
onMouseDown(event: SMouseEvent): boolean {
|
|
- if (this.status == SItemStatus.Normal) {
|
|
|
|
- return super.onMouseDown(event);
|
|
|
|
- } else if (this.status == SItemStatus.Edit) {
|
|
|
|
- return super.onMouseDown(event);
|
|
|
|
- }
|
|
|
|
- return true;
|
|
|
|
|
|
+ if (this.status == SItemStatus.Normal) {
|
|
|
|
+ return super.onMouseDown(event);
|
|
|
|
+ } else if (this.status == SItemStatus.Edit) {
|
|
|
|
+ return super.onMouseDown(event);
|
|
|
|
+ }
|
|
|
|
+ return true;
|
|
} // Function onMouseDown()
|
|
} // Function onMouseDown()
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -204,7 +218,7 @@ export class SIconTextItem extends SObjectItem {
|
|
* @param newSize 改之后大小
|
|
* @param newSize 改之后大小
|
|
* */
|
|
* */
|
|
onResize(oldSize: SSize, newSize: SSize) {
|
|
onResize(oldSize: SSize, newSize: SSize) {
|
|
- console.log(arguments);
|
|
|
|
|
|
+ console.log(arguments);
|
|
} // Function onResize()
|
|
} // Function onResize()
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -214,16 +228,16 @@ export class SIconTextItem extends SObjectItem {
|
|
* @return 是否处理事件
|
|
* @return 是否处理事件
|
|
* */
|
|
* */
|
|
onDoubleClick(event: SMouseEvent): boolean {
|
|
onDoubleClick(event: SMouseEvent): boolean {
|
|
- // 如果位show状态 双击改对象则需改为编辑状态
|
|
|
|
- if (SItemStatus.Normal == this.status) {
|
|
|
|
- this.status = SItemStatus.Edit;
|
|
|
|
- this.grabItem(this);
|
|
|
|
- } else if (SItemStatus.Edit == this.status) {
|
|
|
|
- this.status = SItemStatus.Normal;
|
|
|
|
- this.releaseItem();
|
|
|
|
- }
|
|
|
|
- this.update();
|
|
|
|
- return true;
|
|
|
|
|
|
+ // 如果位show状态 双击改对象则需改为编辑状态
|
|
|
|
+ if (SItemStatus.Normal == this.status) {
|
|
|
|
+ this.status = SItemStatus.Edit;
|
|
|
|
+ this.grabItem(this);
|
|
|
|
+ } else if (SItemStatus.Edit == this.status) {
|
|
|
|
+ this.status = SItemStatus.Normal;
|
|
|
|
+ this.releaseItem();
|
|
|
|
+ }
|
|
|
|
+ this.update();
|
|
|
|
+ return true;
|
|
} // Function onDoubleClick()
|
|
} // Function onDoubleClick()
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -232,11 +246,17 @@ export class SIconTextItem extends SObjectItem {
|
|
* @return SRect 所有子对象的并集
|
|
* @return SRect 所有子对象的并集
|
|
* */
|
|
* */
|
|
boundingRect(): SRect {
|
|
boundingRect(): SRect {
|
|
- let rect = this.img.boundingRect().adjusted(this.img.pos.x, this.img.pos.y, 0, 0);
|
|
|
|
- if (this.showText) {
|
|
|
|
- rect = rect.unioned(this.textItem.boundingRect().adjusted(this.textItem.pos.x, this.textItem.pos.y, 0, 0));
|
|
|
|
- }
|
|
|
|
- return rect.adjusted(-5, -5, 10, 10);
|
|
|
|
|
|
+ let rect = this.img
|
|
|
|
+ .boundingRect()
|
|
|
|
+ .adjusted(this.img.pos.x, this.img.pos.y, 0, 0);
|
|
|
|
+ if (this.showText) {
|
|
|
|
+ rect = rect.unioned(
|
|
|
|
+ this.textItem
|
|
|
|
+ .boundingRect()
|
|
|
|
+ .adjusted(this.textItem.pos.x, this.textItem.pos.y, 0, 0)
|
|
|
|
+ );
|
|
|
|
+ }
|
|
|
|
+ return rect.adjusted(-5, -5, 10, 10);
|
|
} // Function boundingRect()
|
|
} // Function boundingRect()
|
|
|
|
|
|
/**
|
|
/**
|
|
@@ -245,26 +265,20 @@ export class SIconTextItem extends SObjectItem {
|
|
* @param painter painter对象
|
|
* @param painter painter对象
|
|
*/
|
|
*/
|
|
onDraw(painter: SPainter): void {
|
|
onDraw(painter: SPainter): void {
|
|
- if (this.status == SItemStatus.Normal) {
|
|
|
|
- if (this.selected) {
|
|
|
|
- painter.pen.lineWidth = painter.toPx(1);
|
|
|
|
- painter.pen.lineDash = [
|
|
|
|
- painter.toPx(3),
|
|
|
|
- painter.toPx(7)
|
|
|
|
- ];
|
|
|
|
- painter.pen.color = SColor.Black;
|
|
|
|
- painter.brush.color = SColor.Transparent;
|
|
|
|
- painter.drawRect(this.boundingRect());
|
|
|
|
|
|
+ if (this.status == SItemStatus.Normal) {
|
|
|
|
+ if (this.selected) {
|
|
|
|
+ painter.pen.lineWidth = painter.toPx(1);
|
|
|
|
+ painter.pen.lineDash = [painter.toPx(3), painter.toPx(7)];
|
|
|
|
+ painter.pen.color = SColor.Black;
|
|
|
|
+ painter.brush.color = SColor.Transparent;
|
|
|
|
+ painter.drawRect(this.boundingRect());
|
|
|
|
+ }
|
|
|
|
+ } else if (this.status == SItemStatus.Edit) {
|
|
|
|
+ painter.pen.lineWidth = painter.toPx(1);
|
|
|
|
+ painter.pen.lineDash = [painter.toPx(3), painter.toPx(7)];
|
|
|
|
+ painter.pen.color = SColor.Red;
|
|
|
|
+ painter.brush.color = SColor.Transparent;
|
|
|
|
+ painter.drawRect(this.boundingRect());
|
|
}
|
|
}
|
|
- } else if (this.status == SItemStatus.Edit) {
|
|
|
|
- painter.pen.lineWidth = painter.toPx(1);
|
|
|
|
- painter.pen.lineDash = [
|
|
|
|
- painter.toPx(3),
|
|
|
|
- painter.toPx(7)
|
|
|
|
- ];
|
|
|
|
- painter.pen.color = SColor.Red;
|
|
|
|
- painter.brush.color = SColor.Transparent;
|
|
|
|
- painter.drawRect(this.boundingRect());
|
|
|
|
- }
|
|
|
|
} // Function onDraw()
|
|
} // Function onDraw()
|
|
- }
|
|
|
|
|
|
+}
|