import { coordinate } from "../Coordinate.js"; import LayerEvents from "../enum/LayerEvents.js"; import UIEvents from "../enum/UIEvents.js"; import VectorType from "../enum/VectorType.js"; import GeoActions from "../enum/GeoActions.js"; import { stateService } from "../Service/StateService.js"; import { uiService } from "../Service/UIService.js"; import { dataService } from "../Service/DataService.js"; import { historyService } from "../Service/HistoryService.js"; import { elementService } from "../Service/ElementService"; import { lineService } from "../Service/LineService.js"; import { circleService } from "../Service/CircleService.js"; import { textService } from "../Service/TextService.js"; import { magnifierService } from "../Service/MagnifierService.js"; import { mathUtil } from "../Util/MathUtil"; import Constant from "../Constant"; // import { roomsUtil } from "../Room/RoomsUtil.js"; import { addRoad } from "../Controls/AddRoad"; import { addLine } from "./AddLine.js"; import VectorCategory from "../enum/VectorCategory.js"; // import { floorplanData } from "../VectorData.js"; import Message from "@/components/base/components/message/message.vue"; import { pointService } from "../Service/PointService.js"; import Settings from "../Settings.js"; export default class UIControl { constructor(layer, newsletter, graphicStateUI) { this._prompts = []; this.layer = layer; this.newsletter = newsletter; this.graphicStateUI = graphicStateUI; } get selectUI() { return this.newsletter.selectUI; } set selectUI(selectUI) { this.updateEventNameForSelectUI(selectUI); this.newsletter.selectUI = selectUI; } get focusVector() { return this.newsletter.focusVector; } set focusVector(focusVector) { this.newsletter.focusVector = focusVector; } /** * 获取选中要操作的UI */ get currentUI() {} /** * 设置选中要操作的UI */ set currentUI(value) { this.selectUI = value; } clearUI() { this.currentUI = null; this.selectUI = null; } //点击左侧栏后,更新事件 updateEventNameForSelectUI(selectUI) { console.log(this.selectUI, selectUI); if (selectUI != null) { if (this.selectUI == selectUI) { return; } else if (this.selectUI != selectUI) { if (this.selectUI != null) { //先取消当前事件和进程 this.layer.exit(); } //执行新的事件 if (uiService.isBelongRoad(selectUI) || selectUI == "road") { stateService.setEventName(LayerEvents.AddRoad); } else if (selectUI == UIEvents.CurveRoad) { stateService.setEventName(LayerEvents.AddCurveRoad); } else if (uiService.isBelongLine(selectUI)) { stateService.setEventName(LayerEvents.AddLine); } else if (selectUI == UIEvents.CurveLine) { stateService.setEventName(LayerEvents.AddCurveLine); } else if (uiService.isBelongPoint(selectUI)) { stateService.setEventName(LayerEvents.AddPoint); } else if (selectUI == UIEvents.Circle) { stateService.setEventName(LayerEvents.AddCircle); } else if (selectUI == UIEvents.Text) { stateService.setEventName(LayerEvents.AddText); } else if (selectUI == UIEvents.Magnifier) { stateService.setEventName(LayerEvents.AddMagnifier); } else if (selectUI == UIEvents.SVG) { stateService.setEventName(LayerEvents.AddSVG); } else if (selectUI == UIEvents.Img) { stateService.setEventName(LayerEvents.Img); } } } } async handleGeo(action) { let needAutoRedraw = false; const item = stateService.getFocusItem(); if (item && item.vectorId) { switch (action) { case GeoActions.CopyAction: await this.copyVector(item.vectorId, item.type); needAutoRedraw = true; break; case GeoActions.DeleteAction: this.deleteVector(item.vectorId, item.type); needAutoRedraw = true; break; } } if (needAutoRedraw) { this.layer.history.save(); this.layer.renderer.autoRedraw(); } } //删除按钮 deleteVector(vectorId, geoType) { switch (geoType) { case VectorType.Point: pointService.deletePoint(vectorId); break; case VectorType.Line: dataService.deleteLine(vectorId); if (vectorId == Settings.baseLineId) { this.layer.initLocation(); Settings.baseLineId = null; } break; case VectorType.CurveLine: break; case VectorType.Circle: dataService.deleteCircle(vectorId); break; case VectorType.Text: dataService.deleteText(vectorId); break; case VectorType.Magnifier: dataService.deleteMagnifier(vectorId); break; } this.layer.exit(); uiService.setLineCategory(VectorCategory.Line.NormalLine); uiService.setPointCategory(VectorCategory.Point.NormalPoint); this.focusVector = null; } //复制按钮 async copyVector(vectorId, geoType) { switch (geoType) { case VectorType.Line: lineService.copy(vectorId); break; case VectorType.CurveLine: break; case VectorType.Circle: circleService.copy(vectorId); break; case VectorType.Text: textService.copy(vectorId); break; case VectorType.Magnifier: await magnifierService.copy(vectorId); break; } } //截图 async screenShot() { let canvas = this.layer.canvas; this.menu_view_reset(); //隐藏grid dataService.setGridDisplay(false); this.layer.renderer.autoRedraw(); // this.downloadCadImg(canvas, "test.jpg"); const blob = await this.getCadBlob(canvas); //显示grid dataService.setGridDisplay(true); this.layer.renderer.autoRedraw(); return blob; } getCadBlob(canvas) { var type = "jpg"; return new Promise((resolve) => canvas.toBlob(resolve, `${type}/image`)); } downloadCadImg(canvas, filename) { // 图片导出为 jpg 格式 var type = "jpg"; var imgData = canvas.toDataURL(type, 3); canvas.toBlob(`${type}/image`); // 加工image data,替换mime type imgData = imgData.replace(this._fixType(type), "image/octet-stream"); // 下载后的图片名 //var filename = 'cad_' + new Date().getTime() + '.' + type // download debugger; this.saveFile(imgData, filename); } saveFile(data, filename) { var save_link = document.createElementNS( "http://www.w3.org/1999/xhtml", "a" ); save_link.href = data; save_link.download = filename; var event = document.createEvent("MouseEvents"); event.initMouseEvent( "click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null ); save_link.dispatchEvent(event); } _fixType(type) { type = type.toLowerCase().replace(/jpg/i, "jpeg"); var r = type.match(/png|jpeg|bmp|gif/)[0]; return "image/" + r; } /****************************************************************************针对菜单*******************************************************************************/ //撤销 menu_revoke() { this.layer.history.goPreState(); const historyState = historyService.getHistoryState(); this.graphicStateUI.canRevoke = historyState.pre; this.graphicStateUI.canRecovery = true; this.layer.stopAddVector(); this.layer.renderer.autoRedraw(); } //恢复 menu_recovery() { this.layer.history.goNextState(); const historyState = historyService.getHistoryState(); this.graphicStateUI.canRecovery = historyState.next; this.graphicStateUI.canRevoke = true; this.layer.stopAddVector(); this.layer.renderer.autoRedraw(); } menu_view_reset() { coordinate.reSet(this.layer.canvas); this.layer.renderer.autoRedraw(); } // value 为true则开 false则关 menu_backgroundImg(value) { console.log(value); // const backgroundImg = dataService.getBackgroundImg(); backgroundImg.setDisplay(value); this.graphicStateUI.showBackImage = value; this.layer.renderer.autoRedraw(); } menu_clear() { dataService.clear(); Settings.locationMode = null; Settings.baseLineId = null; Settings.selectBasePointId = null; elementService.hideAll(); this.layer.exit(); this.layer.initLocation(); this.layer.history.save(); this.layer.renderer.autoRedraw(); } /******************************************************************************************************************************************************************/ prompt(msg) { this._prompts.push( Message.success(typeof msg === "string" ? { msg } : msg) ); } // 进入持续添加出确认与取消框 showConfirm() { this.graphicStateUI.continuedMode = true; } confirmEntry() { console.log("确认"); this.graphicStateUI.continuedMode = false; } confirmCancel() { console.log("取消"); this.graphicStateUI.continuedMode = false; } hidePrompt() { for (let prompt of this._prompts) { prompt(); } } }