|
@@ -1,9 +1,9 @@
|
|
|
-import { SGraphItem, SLineStyle } from '@saga-web/graph/lib'
|
|
|
-import { Legend } from '../types/Legend'
|
|
|
-import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from '@saga-web/draw'
|
|
|
-import { STextItem } from '@saga-web/graph/lib'
|
|
|
-import { hexify } from '@/components/mapClass/until'
|
|
|
-import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib'
|
|
|
+import { SGraphItem, SLineStyle } from "@saga-web/graph/lib";
|
|
|
+import { Legend } from '../types/Legend';
|
|
|
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
|
|
|
+import { STextItem } from '@saga-web/graph/lib';
|
|
|
+import { hexify } from "@/components/mapClass/until"
|
|
|
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
|
|
|
/**
|
|
|
*图例节点Item(区域类型 --防火分区)
|
|
|
*
|
|
@@ -11,23 +11,23 @@ import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib'
|
|
|
*/
|
|
|
export class SFHFQZoneLegendItem extends SPolygonItem {
|
|
|
/** 图例节点对象数据 */
|
|
|
- data: Legend
|
|
|
+ data: Legend;
|
|
|
|
|
|
/** text item */
|
|
|
- textItem: STextItem = new STextItem(this)
|
|
|
+ textItem: STextItem = new STextItem(this);
|
|
|
|
|
|
get text(): string {
|
|
|
- return this.textItem.text
|
|
|
+ return this.textItem.text;
|
|
|
}
|
|
|
set text(v: string) {
|
|
|
- this.textItem.text = v
|
|
|
- this.update()
|
|
|
+ this.textItem.text = v;
|
|
|
+ this.update();
|
|
|
}
|
|
|
get color(): SColor {
|
|
|
- return this.textItem.color
|
|
|
+ return this.textItem.color;
|
|
|
}
|
|
|
set color(v: SColor) {
|
|
|
- this.textItem.color = v
|
|
|
+ this.textItem.color = v;
|
|
|
}
|
|
|
get font(): SFont {
|
|
|
return this.textItem.font
|
|
@@ -37,62 +37,77 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
|
|
|
}
|
|
|
|
|
|
get status(): SItemStatus {
|
|
|
- return this._status
|
|
|
+ return this._status;
|
|
|
}
|
|
|
// 编辑当前状态
|
|
|
set status(value: SItemStatus) {
|
|
|
- this._status = value
|
|
|
+ this._status = value;
|
|
|
// 如果状态为show则需清栈
|
|
|
if (value == SItemStatus.Normal) {
|
|
|
// 切换显示状态显示文本
|
|
|
- this.showText = true
|
|
|
+ this.showText = true;
|
|
|
// 切换显示状态不可移动文本
|
|
|
- this.textItem.moveable = false
|
|
|
+ this.textItem.moveable = false;
|
|
|
|
|
|
if (this.undoStack) {
|
|
|
- this.undoStack.clear()
|
|
|
+ this.undoStack.clear();
|
|
|
}
|
|
|
} else if (value == SItemStatus.Edit) {
|
|
|
// 切换编辑状态显示文本
|
|
|
- this.showText = true
|
|
|
+ this.showText = true;
|
|
|
// 切换编辑状态可移动文本
|
|
|
- this.textItem.moveable = true
|
|
|
+ this.textItem.moveable = true;
|
|
|
} else if (value == SItemStatus.Create) {
|
|
|
// 切换创建状态不显示文本
|
|
|
- this.showText = false
|
|
|
+ this.showText = false;
|
|
|
// 切换创建状态不可移动文本
|
|
|
- this.textItem.moveable = false
|
|
|
+ this.textItem.moveable = false;
|
|
|
}
|
|
|
- this.update()
|
|
|
- }
|
|
|
+ this.update();
|
|
|
+ };
|
|
|
+
|
|
|
+ /** 是否激活 */
|
|
|
+ _isActive: boolean = false;
|
|
|
+ get isActive(): boolean {
|
|
|
+ return this._isActive;
|
|
|
+ } // Get isActive
|
|
|
+ set isActive(v: boolean) {
|
|
|
+ this._isActive = v;
|
|
|
+ if (v) {
|
|
|
+ this.cursor = "pointer";
|
|
|
+ } else {
|
|
|
+ this.cursor = "auto";
|
|
|
+ }
|
|
|
+ this.update();
|
|
|
+ } // Set isActive
|
|
|
|
|
|
/** 是否显示文字 */
|
|
|
- _showText: boolean = true
|
|
|
+ _showText: boolean = true;
|
|
|
get showText(): boolean {
|
|
|
- return this._showText
|
|
|
+ return this._showText;
|
|
|
}
|
|
|
set showText(v: boolean) {
|
|
|
if (v === this._showText) {
|
|
|
return
|
|
|
}
|
|
|
- this._showText = v
|
|
|
+ this._showText = v;
|
|
|
if (v) {
|
|
|
- this.textItem.show()
|
|
|
+ this.textItem.show();
|
|
|
} else {
|
|
|
- this.textItem.hide()
|
|
|
+ this.textItem.hide();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/** 是否蒙版遮罩 */
|
|
|
- _maskFlag: boolean = false
|
|
|
+ _maskFlag: boolean = false;
|
|
|
get maskFlag(): boolean {
|
|
|
- return this._maskFlag
|
|
|
+ return this._maskFlag;
|
|
|
}
|
|
|
set maskFlag(v: boolean) {
|
|
|
if (v === this._maskFlag) {
|
|
|
return
|
|
|
}
|
|
|
- this._maskFlag = v
|
|
|
+ this._maskFlag = v;
|
|
|
this.update()
|
|
|
}
|
|
|
|
|
@@ -103,105 +118,112 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
|
|
|
* @param data 图例节点对象数据
|
|
|
*/
|
|
|
constructor(parent: SGraphItem | null, data: Legend) {
|
|
|
- super(parent)
|
|
|
- this.textItem.isTransform = false
|
|
|
- this.zOrder = ItemOrder.polygonOrder
|
|
|
- this.data = data
|
|
|
- this.id = data.ID
|
|
|
- this.name = data.Name
|
|
|
- this.text = data.Name
|
|
|
+ super(parent);
|
|
|
+ this.textItem.isTransform = false;
|
|
|
+ this.zOrder = ItemOrder.polygonOrder;
|
|
|
+ this.data = data;
|
|
|
+ this.id = data.ID;
|
|
|
+ this.name = data.Name;
|
|
|
+ this.text = data.Name;
|
|
|
if (data) {
|
|
|
- this.setPointList = []
|
|
|
- let setPointList: SPoint[]
|
|
|
+ this.setPointList = [];
|
|
|
+ let setPointList: SPoint[];
|
|
|
if (data.OutLine) {
|
|
|
if (data.OutLine[0] instanceof SPoint) {
|
|
|
- this.setPointList = data.OutLine
|
|
|
+ this.setPointList = data.OutLine;
|
|
|
} else {
|
|
|
- setPointList = data.OutLine.map((i) => {
|
|
|
- return new SPoint(i.X, i.Y)
|
|
|
+ setPointList = data.OutLine.map(i => {
|
|
|
+ return (new SPoint(i.X, i.Y))
|
|
|
})
|
|
|
- this.setPointList = setPointList
|
|
|
+ this.setPointList = setPointList;
|
|
|
}
|
|
|
}
|
|
|
+ if (data.Properties.Zorder) {
|
|
|
+ this.zOrder = data.Properties.Zorder;
|
|
|
+ }
|
|
|
// 设置线宽
|
|
|
if (data.Properties.LineWidth) {
|
|
|
- this.lineWidth = data.Properties.LineWidth
|
|
|
+ this.lineWidth = data.Properties.LineWidth;
|
|
|
}
|
|
|
if (data.Properties.StrokeColor) {
|
|
|
- this.strokeColor = data.Properties.StrokeColor.includes('#')
|
|
|
- ? new SColor(data.Properties.StrokeColor)
|
|
|
- : new SColor(hexify(data.Properties.StrokeColor))
|
|
|
+ this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
|
|
|
}
|
|
|
if (data.Properties.FillColor) {
|
|
|
- this.fillColor = data.Properties.FillColor.includes('#')
|
|
|
- ? new SColor(data.Properties.FillColor)
|
|
|
- : new SColor(hexify(data.Properties.FillColor))
|
|
|
+ this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor));
|
|
|
}
|
|
|
if (data.Properties.TextPos) {
|
|
|
- this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y)
|
|
|
+ this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
|
|
|
}
|
|
|
if (data.Properties.color) {
|
|
|
- this.color = new SColor(data.Properties.color)
|
|
|
+ this.color = new SColor(data.Properties.color);
|
|
|
}
|
|
|
if (data.Properties.font) {
|
|
|
- this.font = new SFont('sans-serif', data.Properties.font)
|
|
|
+ this.font = new SFont("sans-serif", data.Properties.font);
|
|
|
+ }
|
|
|
+ if (data.Properties && data.Properties.IsActive) {
|
|
|
+ this.isActive = data.Properties.IsActive;
|
|
|
+ }
|
|
|
+ if (data.AttachObjectIds && data.AttachObjectIds.length) {
|
|
|
+ this.isActive = true;
|
|
|
}
|
|
|
switch (data.Properties.LineDash) {
|
|
|
- case 'solid':
|
|
|
- this.lineStyle = SLineStyle.Solid
|
|
|
- break
|
|
|
- case 'dotted':
|
|
|
- this.lineStyle = SLineStyle.Dotted
|
|
|
- break
|
|
|
- case 'dashed':
|
|
|
- this.lineStyle = SLineStyle.Dashed
|
|
|
- break
|
|
|
+ case "solid":
|
|
|
+ this.lineStyle = SLineStyle.Solid;
|
|
|
+ break;
|
|
|
+ case "dotted":
|
|
|
+ this.lineStyle = SLineStyle.Dotted;
|
|
|
+ break;
|
|
|
+ case "dashed":
|
|
|
+ this.lineStyle = SLineStyle.Dashed;
|
|
|
+ break;
|
|
|
default:
|
|
|
- this.lineStyle = SLineStyle.Solid
|
|
|
+ this.lineStyle = SLineStyle.Solid;
|
|
|
}
|
|
|
}
|
|
|
// 监听多边形创建完成事件,并动态计算文本位置
|
|
|
- this.connect('finishCreated', this, () => {
|
|
|
+ this.connect("finishCreated", this, () => {
|
|
|
// 计算文本位置
|
|
|
let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
|
|
|
- return pre + cur.x / arr.length
|
|
|
- }, 0),
|
|
|
+ return pre + (cur.x / arr.length)
|
|
|
+ }, 0),
|
|
|
y: number = this.getPointList.reduce((pre, cur, index, arr) => {
|
|
|
- return pre + cur.y / arr.length
|
|
|
- }, 0)
|
|
|
- this.textItem.moveTo(x, y)
|
|
|
+ return pre + (cur.y / arr.length)
|
|
|
+ }, 0);
|
|
|
+ this.textItem.moveTo(x, y);
|
|
|
})
|
|
|
}
|
|
|
|
|
|
toData(): any {
|
|
|
- this.data.Pos = { X: this.x, Y: this.y }
|
|
|
- this.data.Name = this.name
|
|
|
- this.data.Properties.FillColor = this.fillColor.value
|
|
|
- this.data.Properties.StrokeColor = this.strokeColor.value
|
|
|
- this.data.Properties.LineWidth = this.lineWidth
|
|
|
+ this.data.Pos = { X: this.x, Y: this.y };
|
|
|
+ this.data.Name = this.name;
|
|
|
+ this.data.Properties.Zorder = this.zOrder;
|
|
|
+ this.data.Properties.FillColor = this.fillColor.value;
|
|
|
+ this.data.Properties.StrokeColor = this.strokeColor.value;
|
|
|
+ this.data.Properties.LineWidth = this.lineWidth;
|
|
|
switch (this.lineStyle) {
|
|
|
case SLineStyle.Solid:
|
|
|
- this.data.Properties.LineDash = 'solid'
|
|
|
- break
|
|
|
+ this.data.Properties.LineDash = "solid";
|
|
|
+ break;
|
|
|
case SLineStyle.Dotted:
|
|
|
- this.data.Properties.LineDash = 'dotted'
|
|
|
- break
|
|
|
+ this.data.Properties.LineDash = "dotted";
|
|
|
+ break;
|
|
|
case SLineStyle.Dashed:
|
|
|
- this.data.Properties.LineDash = 'dashed'
|
|
|
- break
|
|
|
+ this.data.Properties.LineDash = "dashed";
|
|
|
+ break;
|
|
|
default:
|
|
|
- this.data.Properties.LineDash = 'solid'
|
|
|
+ this.data.Properties.LineDash = "solid";
|
|
|
}
|
|
|
- this.data.OutLine = this.getPointList.map((pos) => {
|
|
|
+ this.data.OutLine = this.getPointList.map(pos => {
|
|
|
return {
|
|
|
X: pos.x,
|
|
|
- Y: pos.y,
|
|
|
+ Y: pos.y
|
|
|
}
|
|
|
- })
|
|
|
- this.data.Properties.TextPos = { X: this.textItem.x, Y: this.textItem.y }
|
|
|
- this.data.Properties.font = this.font.size
|
|
|
- this.data.Properties.color = this.color.value
|
|
|
- return this.data
|
|
|
+ });
|
|
|
+ this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
|
|
|
+ this.data.Properties.font = this.font.size;
|
|
|
+ this.data.Properties.color = this.color.value;
|
|
|
+ this.data.Properties.IsActive = this.isActive;
|
|
|
+ return this.data;
|
|
|
}
|
|
|
|
|
|
onDraw(painter: SPainter) {
|
|
@@ -214,7 +236,6 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
|
|
|
painter.pen.lineCapStyle = SLineCapStyle.Square
|
|
|
painter.pen.lineWidth = painter.toPx(this._lineWidth)
|
|
|
painter.brush.color = brushcolor
|
|
|
-
|
|
|
if (this.selected) {
|
|
|
painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
|
|
|
painter.shadow.shadowBlur = 10;
|
|
@@ -222,11 +243,10 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
|
|
|
painter.shadow.shadowOffsetX = 5;
|
|
|
painter.shadow.shadowOffsetY = 5;
|
|
|
}
|
|
|
-
|
|
|
// @ts-ignore
|
|
|
- painter.drawPolygon([...this.pointList])
|
|
|
+ painter.drawPolygon([...this.pointList]);
|
|
|
} else {
|
|
|
- super.onDraw(painter)
|
|
|
+ super.onDraw(painter);
|
|
|
}
|
|
|
}
|
|
|
} // Class SZoneLegendItem
|