123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276 |
- import { SBaseEditScene, SBaseLineEdit, SBaseTextEdit, SBaseImageEdit, SBaseExpainEdit } from "./../big-edit";
- import { SPersagyImageEdit } from "./"
- // import { SGraphItem } from "@persagy-web/graph/";
- import { SGraphEdit } from "./../edit"
- import { SMouseEvent, SUndoStack } from "@persagy-web/base/lib";
- import { SItemStatus } from "@persagy-web/big/lib/enums/SItemStatus";
- import { uuid } from "./../big-edit/until";
- // 引入命令
- import { SGraphAddCommand } from "./../edit/commands/SGraphAddCommand"
- export class PTopoScene extends SBaseEditScene {
- undoStack = new SUndoStack();
- constructor() {
- super()
- // // 选择绑定选额item事件
- this.selectContainer.connect("listChange", this, this.listChange);
- }
- /**
- * 选中返回的选中item回调方法
- *
- * @param event 鼠标事件参数
- */
- listChange(list: any): void {
- this.emitChoice(list.itemList)
- }
- /**
- * 选中返回的选中item回调方法(用于场景的外部调用)
- *
- * @param list 选中的item数组
- */
- emitChoice(list: any) {
- }
- /**
- * 鼠标左键按下
- *
- * @param event 鼠标事件参数
- */
- onMouseDown(event: SMouseEvent): any {
- if (this.editCmd == "EditBaseLine") {
- this.addLine(event)
- this.clearCmdStatus();
- } else if (this.editCmd == "EditBasetext") {
- this.addTextItem(event);
- this.clearCmdStatus();
- } else if (this.editCmd == "EditBaseImage") {
- this.addImageItem(event)
- this.clearCmdStatus();
- } else if (this.editCmd == "EditBasePostil") {
- this.addExplainItem(event)
- this.clearCmdStatus();
- } else if (this.editCmd == "EditBasePolygon") {
- console.log('编辑多边形')
- } else if (this.editCmd == "EditBaseTriangle") {
- console.log('编辑三角形')
- } else if (this.editCmd == "EditBaseCircle") {
- console.log('编辑圆')
- } else if (this.editCmd == "EditBaseArrows") {
- console.log('编辑箭头')
- } else if (this.editCmd == "") {
- super.onMouseDown(event);
- }
- }
- /**
- * 鼠标右键事件
- *
- * @param event 鼠标事件参数
- */
- onContextMenu(event: SMouseEvent): boolean {
- if (!super.onContextMenu(event)) {
- this.getItem(event, null)
- }
- return true
- }
- /////////////////////////////////////////////////////////////////////////////////////////////////
- //新增 item 类方法;
- /**
- * 新增基础类直线
- *
- * @param event 鼠标事件参数
- */
- addLine(event: SMouseEvent): void {
- const data = {
- /** ID */
- ID: uuid(),
- /** 名称 */
- Name: '基础直线',
- /** 图标(Image),线类型(Line) */
- Type: "BaseLine",
- /** 位置 */
- Pos: { X: 0, Y: 0 },
- /** 由应用自己定义 */
- Properties: {
- },
- Style: {
- Line: [{ X: event.x, Y: event.y }],
- }
- }
- const lineItem = new SBaseLineEdit(null, data);
- lineItem.status = SItemStatus.Create;
- this.addItem(lineItem);
- this.undoStack.push(new SGraphAddCommand(this, lineItem));
- lineItem.selectable = true;
- this.grabItem = lineItem;
- lineItem.connect("finishCreated", this, this.finishCreated);
- if (this.view) {
- this.view.update();
- }
- }
- /**
- * 新增基础类文本
- *
- * @param event 鼠标事件参数
- */
- addTextItem(event: SMouseEvent): void {
- const data = {
- /** ID */
- ID: uuid(),
- /** 名称 */
- Name: '基础文本',
- /** 图标 */
- Type: "BaseText",
- /** 位置 */
- Pos: { X: event.x, Y: event.y },
- /** 由应用自己定义 */
- Properties: {
- // IconUrl: require(`../../assets/images/t-text-hover.png`),
- Text: '请在右侧属性栏输入文字!',
- Color: "#646c73",
- Font: 14,
- BackgroundColor: "#f7f9facc"
- },
- Style: {}
- }
- const item = new SBaseExpainEdit(null, data);
- item.moveTo(event.x, event.y);
- item.selectable = true;
- item.moveable = true;
- this.addItem(item);
- this.undoStack.push(new SGraphAddCommand(this, item));
- // this.Markers.push(item);
- this.grabItem = null;
- // this.focusItem = item;
- this.finishCreated(item);
- // this.scenceUpdate(this);
- }
- /**
- * 新增基础类注释
- *
- * @param event 鼠标事件参数
- */
- addExplainItem(event: SMouseEvent): void {
- const data = {
- /** ID */
- ID: uuid(),
- /** 名称 */
- Name: '基础注释文本',
- /** 图标 */
- Type: "BaseExplain",
- /** 位置 */
- Pos: { X: event.x, Y: event.y },
- /** 由应用自己定义 */
- Properties: {
- // IconUrl: require(`../../assets/images/t-text-hover.png`),
- Text: '请在右侧属性栏输入文字!',
- Color: "#646c73",
- Font: 14,
- BackgroundColor: "#f7f9facc"
- },
- Style: {}
- }
- const item = new SBaseTextEdit(null, data);
- item.moveTo(event.x, event.y);
- item.selectable = true;
- item.moveable = true;
- this.addItem(item);
- this.undoStack.push(new SGraphAddCommand(this, item));
- // this.Markers.push(item);
- this.grabItem = null;
- // this.focusItem = item;
- this.finishCreated(item);
- // this.scenceUpdate(this);
- }
- /**
- * 新增基础类图片
- *
- * @param event 鼠标事件参数
- */
- addImageItem(event: SMouseEvent): void {
- const data = {
- /** ID */
- ID: uuid(),
- /** 名称 */
- Name: '基础图片',
- Num: 1,
- /** 图标(Image),线类型(Line) */
- Type: "BaseImage",
- /** 位置 */
- Pos: { X: event.x, Y: event.y },
- /** 由应用自己定义 */
- Properties: {
- // IconUrl: require(`../../assets/images/t-img-hover.png`),
- StrokeColor: "#c0ccda",
- Url: '',
- },
- Style: {}
- }
- const item = new SPersagyImageEdit(null, data);
- item.selectable = true;
- item.moveable = true;
- this.addItem(item);
- this.undoStack.push(new SGraphAddCommand(this, item));
- this.Markers.push(item);
- this.finishCreated(item);
- }
- /////////////////////////////////////////////////////////////////////////////////////////////////
- //修改 item 样式,数据等方法;
- updateStyle(): void {
- // 修改样式
- }
- /**
- * item 创建完成后回调
- *
- * @param event 鼠标事件参数
- */
- finishCreated(item: SGraphEdit): void {
- this.grabItem = null;
- item.status = SItemStatus.Normal;
- }
- /**
- * 修改 cmdstatus 函数;常在在业务中调用
- *
- */
- clearCmdStatus() {
- }
- /**
- * 获取item (常用与场景外的调用F)
- * @param event SMouseEvent 鼠标事件
- * @param item SGraphEdit|null 返回item
- *
- */
- getItem(event: SMouseEvent, item: SGraphEdit | null) {
- }
- /**
- * 重做
- *
- * @return any
- */
- redo(): void {
- if (this.grabItem && this.grabItem.redo) {
- this.grabItem.redo()
- } else {
- this.undoStack.redo();
- }
- }
- /**
- * 撤销
- *
- * @return any
- */
- undo(): void {
- if (this.grabItem && this.grabItem.undo) {
- this.grabItem.undo()
- } else {
- this.undoStack.undo();
- }
- }
- }
|