EditScence.ts 70 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020
  1. import { SMouseEvent, SUndoStack } from "@saga-web/base";
  2. import { SGraphScene, SGraphLayoutType, SAnchorItem } from '@saga-web/graph/lib';
  3. import { SFloorParser, SLineItem, SPolylineItem, SItemStatus, ItemOrder, STooltipItem, ItemColor, Transparency, SPolygonItem } from "@saga-web/big";
  4. import { SGraphItem, SLineStyle, SGraphPropertyCommand, SImageItem, STextItem, SGraphPointListInsert, SGraphPointListDelete, SGraphPointListUpdate, SGraphAddCommand } from "@saga-web/graph/lib";
  5. import { SGraphAddListCommand } from "./SGraphAddListCommand"
  6. import { SGraphDeleteCommand } from "./SGraphDeleteCommand"
  7. import { SGraphDeleteListCommand } from "./SGraphDeleteListCommand"
  8. import { SZoneLegendItem } from "@/lib/items/SZoneLegendItem";
  9. import { SSCPZZoneLegendItem } from "@/lib/items/SSCPZZoneLegendItem";
  10. import { SFHFQZoneLegendItem } from "@/lib/items/SFHFQZoneLegendItem";
  11. import { SImageLegendItem } from "@/lib/items/SImageLegendItem";
  12. import { TipelineItem } from "@/lib/items/TipelineItem";
  13. import { SImageMarkerItem } from "@/lib/items/SImageMarkerItem"
  14. import { SPoint, SFont, SColor, SRect } from '@saga-web/draw/lib';
  15. import { Legend } from '@/lib/types/Legend';
  16. import { Relation } from '@/lib/types/Relation';
  17. import { uuid } from "@/components/mapClass/until";
  18. import { STextMarkerItem } from '@/lib/items/STextMarkerItem';
  19. import { SLineMarkerItem } from '@/lib/items/SLineMarkerItem';
  20. import { SSpaceItem } from '@saga-web/big/lib/items/floor/SSpaceItem';
  21. import { SMathUtil } from '@saga-web/big/lib/utils/SMathUtil';
  22. import { MinDis } from '@saga-web/big/lib/types/MinDis';
  23. import { HighlightItem } from '@/lib/items/HighlightItem';
  24. import { TimeSelect } from 'element-ui';
  25. import { STopologyParser } from '@/lib/parsers/STopologyParser';
  26. import { SCustomLegendItem } from '@/lib/items/SCustomLegendItem';
  27. import { SImageShowType } from "@saga-web/graph/lib/enums/SImageShowType";
  28. import { SEquipmentItem } from "@/lib/items/SEquipmentItem"; // 设备类
  29. /**
  30. * 在线绘图
  31. *
  32. * @author 韩耀龙
  33. */
  34. export class EditScence extends SGraphScene {
  35. undoStack = new SUndoStack();
  36. /** 命令 1 绘制直线 */
  37. private cmd = 'choice';
  38. /** 获取当前状态 */
  39. get getCmd(): string {
  40. return this.cmd;
  41. }
  42. /** 背景图像对象 */
  43. private backgroundImgItem: SImageItem | null = null;
  44. /** 背景图像是否加载完成 */
  45. private bgImg: boolean = false;
  46. /** 设备对象 */
  47. equipmentItem: any = [];
  48. /** 编辑当前状态 */
  49. set setCmd(cmd: string) {
  50. if (cmd == 'choice') {
  51. this.grabItem = null;
  52. }
  53. this.cmd = cmd;
  54. if (this.focusItem) {
  55. // 取消操作
  56. this.focusItem.cancelOperate();
  57. this.focusItem = null;
  58. // this.selectContainer.clear()
  59. }
  60. if (this.view) {
  61. this.view.update();
  62. }
  63. };
  64. /** 绘制区域时 是否为点选 */
  65. isSelecting: boolean = true;
  66. /** 是否开启吸附 */
  67. isAbsorbing: boolean = false;
  68. /** 吸附展示item */
  69. highLight: HighlightItem | null = null;
  70. /** 当前选中焦点Item */
  71. focusItem: SGraphItem | null = null;
  72. /** 当前选中焦点ItemList */
  73. focusItemList: SGraphItem[] | null = null;
  74. /**图例节点 */
  75. Nodes: any = []; // 图例节点,所有与工程信息化相关的图例(图标类型与区域)
  76. /**图例节点 */ // 与工程信息无关的标识对象(增加文本注释,图上的图片说明)
  77. Markers: any = [];
  78. /** 管线对象 */
  79. Relations: any = [];
  80. _isEditStatus: Boolean = true; // 是否可编辑
  81. set isEditStatus(bol: Boolean): void {
  82. this._isEditStatus = bol;
  83. }
  84. get isEditStatus(): Boolean {
  85. return this._isEditStatus
  86. }
  87. //复制粘贴
  88. copyString = {
  89. Nodes: [],
  90. Markers: [],
  91. Relations: []
  92. };
  93. constructor() {
  94. super();
  95. // // 选择绑定选额item事件
  96. this.selectContainer.connect("listChange", this, this.listChange);
  97. ItemColor.spaceColor = new SColor("#f0f0f0")
  98. ItemColor.wallColor = new SColor("#d4d4d4")
  99. ItemColor.columnColor = new SColor("#d4d4d4")
  100. ItemColor.virtualWallColor = new SColor("#d4d4d4")
  101. ItemColor.selectColor = new SColor("#f0f0f0")
  102. ItemColor.spaceBorderColor = new SColor("#d4d4d4")
  103. }
  104. /** 绘制图例样式 */
  105. _legend: any | null = null;
  106. get getlegend(): any {
  107. return this._legend;
  108. };
  109. set setlegend(obj: any) {
  110. this._legend = obj;
  111. }
  112. /** fid=>item映射,由解析器存入 */
  113. fidToItem = {}
  114. /**
  115. * 监听变化
  116. * @param obj 变化后的对象
  117. */
  118. listChange(obj: any) {
  119. let itemType: string = 'equipment';
  120. this.focusItemList = obj.itemList;
  121. if (obj.itemList[0] instanceof STextMarkerItem) {
  122. itemType = 'baseText'
  123. } else if (obj.itemList[0] instanceof SImageMarkerItem) {
  124. itemType = 'baseImage'
  125. } else if (obj.itemList[0] instanceof SLineMarkerItem) {
  126. itemType = 'baseLine'
  127. } else if (obj.itemList[0] instanceof SZoneLegendItem) {
  128. itemType = 'Zone'
  129. } else if (obj.itemList[0] instanceof SFHFQZoneLegendItem) {
  130. itemType = 'Zone'
  131. } else if (obj.itemList[0] instanceof SSCPZZoneLegendItem) {
  132. itemType = 'Zone'
  133. } else if (obj.itemList[0] instanceof SCustomLegendItem) {
  134. itemType = 'Zone'
  135. } else if (obj.itemList[0] instanceof SImageLegendItem) {
  136. itemType = 'Image'
  137. } else if (obj.itemList[0] instanceof TipelineItem) {
  138. itemType = 'Line'
  139. } else if (obj.itemList[0] instanceof SSpaceItem) { // 点选
  140. this.clickToAddArea(obj.itemList[0]);
  141. return
  142. } else if (obj.itemList[0] instanceof SEquipmentItem) {
  143. itemType = "Equipment";
  144. }
  145. else {
  146. itemType = ''
  147. };
  148. if (obj.itemList.length == 1) {
  149. // 获取聚焦item
  150. this.focusItem = obj.itemList[0]
  151. } else {
  152. this.focusItem = null
  153. }
  154. let msg = {
  155. itemList: obj.itemList,
  156. itemType,
  157. }
  158. this.emitChange(msg)
  159. }
  160. emitChange(msg: any) {
  161. }
  162. /**
  163. * 增加线段item
  164. */
  165. addLine(event: SMouseEvent): boolean {
  166. const clickItem = this.clickIsItem(event);
  167. if (clickItem) {
  168. let centerPoint = clickItem.boundingRect().center();
  169. const p = clickItem.mapToScene(centerPoint.x, centerPoint.y);
  170. event.x = p.x;
  171. event.y = p.y;
  172. }
  173. const data = {
  174. /** ID */
  175. ID: uuid(),
  176. /** 名称 */
  177. Name: '直线',
  178. /** 图标(Image),线类型(Line) */
  179. Type: "Line",
  180. /** 位置 */
  181. Pos: { X: 0, Y: 0 },
  182. /** 由应用自己定义 */
  183. Properties: {
  184. IconUrl: require("../../assets/images/t-line-hover.png"),
  185. Line: [{ X: event.x, Y: event.y }],
  186. LineWidth: 1,
  187. StrokeColor: "#bdc3c8"
  188. }
  189. }
  190. const item = new SLineMarkerItem(null, data);
  191. item.status = SItemStatus.Create;
  192. item.selectable = true;
  193. this.addItem(item);
  194. // this.Markers.push(item);
  195. item.connect("finishCreated", this, this.finishCreated);
  196. this.grabItem = item;
  197. this.focusItem = item;
  198. // 起始item点
  199. item.startItem = clickItem;
  200. if (clickItem) {
  201. clickItem.connect('onMove', item, item.changePos);
  202. }
  203. return true
  204. }
  205. /**
  206. * 增加折线item
  207. */
  208. addPolylineItem(event: SMouseEvent): boolean {
  209. const point = new SPoint(event.x, event.y)
  210. const item = new TipelineItem(null, [point]);
  211. //设置状态
  212. item.selectable = true;
  213. item.status = SItemStatus.Create;
  214. this.addItem(item);
  215. item.connect("finishCreated", this, this.finishCreated);
  216. this.grabItem = item;
  217. this.focusItem = item;
  218. return true
  219. }
  220. /**
  221. * 增加管道 lenged
  222. */
  223. addTipelineItem(event: SMouseEvent): boolean {
  224. const anc = this.clickIsAnchor(event);
  225. if (anc) {
  226. const p = anc.mapToScene(0, 0)
  227. anc.isConnected = true;
  228. event.x = p.x;
  229. event.y = p.y;
  230. }
  231. const LegendData: Relation = {
  232. ID: uuid(),
  233. Name: this._legend.Name,
  234. GraphElementId: this._legend.Id,
  235. PointList: [{ X: event.x, Y: event.y }],
  236. LineType: "Line",
  237. Properties: {
  238. IconUrl: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
  239. LineDash: this._legend.LineDash,
  240. LineWidth: this._legend.LineWidth,
  241. Color: this._legend.Color,
  242. },
  243. }
  244. const item = new TipelineItem(null, LegendData);
  245. //设置状态
  246. item.selectable = true;
  247. item.status = SItemStatus.Create;
  248. this.addItem(item);
  249. // this.Relations.push(item);
  250. item.connect("finishCreated", this, this.finishCreated);
  251. this.grabItem = item;
  252. this.focusItem = item;
  253. // 起始锚点
  254. item.startAnchor = anc;
  255. if (anc) {
  256. anc.parent?.connect('changePos', item, item.changePos)
  257. item.anchor1ID = anc.id;
  258. item.node1Id = anc.parent.id;
  259. }
  260. return true
  261. }
  262. /**
  263. * 增加多边形item lenged
  264. */
  265. addPolygonItem(event: SMouseEvent): void {
  266. const SubType = this._legend.SubType ? this._legend.SubType : '';
  267. const LegendData: Legend = {
  268. ID: uuid(),
  269. Name: this._legend.Name,
  270. GraphElementType: this._legend.Type,
  271. Num: 1,
  272. GraphElementId: this._legend.Id,
  273. AttachObjectIds: [],
  274. Type: "Zone",
  275. Pos: { X: event.x, Y: event.y },
  276. OutLine: [{ X: event.x, Y: event.y }],
  277. SubType: SubType,
  278. Properties: {
  279. IconUrl: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
  280. StrokeColor: this._legend.Color,
  281. FillColor: this._legend.FillColor,
  282. LineDash: this._legend.LineDash,
  283. LineWidth: this._legend.LineWidth,
  284. font: 14,
  285. color: "#1F2429",
  286. TextPos: { X: 0, Y: 0 },
  287. InfoTypeId: this._legend.InfoTypeId.length ? this._legend.InfoTypeId : [],
  288. InfoSystemId: this._legend.InfoSystemId ? this._legend.InfoSystemId : '',
  289. InfoLocal: this._legend.InfoLocal.length ? this._legend.InfoLocal : []
  290. },
  291. }
  292. let Polylines = null;
  293. if (SubType == "SCPZ") {
  294. Polylines = new SSCPZZoneLegendItem(null, LegendData);
  295. } else if (SubType == "FHFQ") {
  296. Polylines = new SFHFQZoneLegendItem(null, LegendData);
  297. } else if (SubType == "CUSTOM") {
  298. Polylines = new SCustomLegendItem(null, LegendData);
  299. } else {
  300. Polylines = new SZoneLegendItem(null, LegendData);
  301. }
  302. Polylines.selectable = true;
  303. //设置状态
  304. Polylines.status = SItemStatus.Create;
  305. // Polylines.moveable = true;
  306. this.addItem(Polylines);
  307. Polylines.connect("finishCreated", this, this.finishCreated);
  308. this.grabItem = Polylines;
  309. this.focusItem = Polylines;
  310. }
  311. /**
  312. * 点选创建区域
  313. */
  314. clickToAddArea(item: SSpaceItem): void {
  315. if (this.cmd != 'Zone') {
  316. return
  317. }
  318. if (this.isSelecting && this._legend) {
  319. //@ts-ignore
  320. item.isExtracted = true
  321. const SubType = this._legend.SubType ? this._legend.SubType : '';
  322. const LegendData: Legend = {
  323. ID: uuid(),
  324. Name: this._legend.Name,
  325. GraphElementType: this._legend.Type,
  326. Num: 1,
  327. GraphElementId: this._legend.Id,
  328. AttachObjectIds: [],
  329. Type: "Zone",
  330. Pos: { X: item.x, Y: item.y },
  331. OutLine: item.pointArr[0],
  332. SubType: SubType,
  333. Properties: {
  334. IconUrl: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
  335. StrokeColor: this._legend.Color,
  336. FillColor: this._legend.FillColor,
  337. LineDash: this._legend.LineDash,
  338. LineWidth: this._legend.LineWidth,
  339. font: 14,
  340. color: "#1F2429",
  341. FID: item.data.SourceId,
  342. TextPos: { X: item.data.Location.Points[0].X, Y: -item.data.Location.Points[0].Y },
  343. InfoTypeId: this._legend.InfoTypeId.length ? this._legend.InfoTypeId : [],
  344. InfoSystemId: this._legend.InfoSystemId ? this._legend.InfoSystemId : '',
  345. InfoLocal: this._legend.InfoLocal.length ? this._legend.InfoLocal : []
  346. },
  347. }
  348. let Polylines = null;
  349. if (SubType == "SCPZ") {
  350. Polylines = new SSCPZZoneLegendItem(null, LegendData);
  351. } else if (SubType == "FHFQ") {
  352. Polylines = new SFHFQZoneLegendItem(null, LegendData);
  353. } else {
  354. Polylines = new SZoneLegendItem(null, LegendData);
  355. }
  356. Polylines.selectable = true;
  357. //设置状态
  358. Polylines.status = SItemStatus.Normal;
  359. this.addItem(Polylines);
  360. // this.Nodes.push(Polylines);
  361. this.finishCreated(Polylines)
  362. this.focusItem = Polylines;
  363. this.scenceUpdate(this);
  364. }
  365. }
  366. /**
  367. * 增加图片Item mark
  368. */
  369. addImgItem(event: SMouseEvent) {
  370. const data = {
  371. /** ID */
  372. ID: uuid(),
  373. /** 名称 */
  374. Name: '图片',
  375. Num: 1,
  376. /** 图标(Image),线类型(Line) */
  377. Type: "Image",
  378. /** 位置 */
  379. Pos: { X: event.x, Y: event.y },
  380. /** 由应用自己定义 */
  381. Properties: {
  382. IconUrl: require(`../../assets/images/t-img-hover.png`),
  383. StrokeColor: "#c0ccda",
  384. Url: '',
  385. }
  386. }
  387. const item = new SImageMarkerItem(null, data);
  388. item.selectable = true;
  389. item.moveable = true;
  390. this.addItem(item);
  391. this.Markers.push(item);
  392. this.grabItem == null;
  393. this.focusItem = item;
  394. this.finishCreated(item);
  395. this.scenceUpdate(this);
  396. }
  397. /**
  398. * 增加文字item
  399. */
  400. addTextItem(event: SMouseEvent): void {
  401. const data = {
  402. /** ID */
  403. ID: uuid(),
  404. /** 名称 */
  405. Name: '文本',
  406. /** 图标 */
  407. Type: "Text",
  408. /** 位置 */
  409. Pos: { X: event.x, Y: event.y },
  410. /** 由应用自己定义 */
  411. Properties: {
  412. IconUrl: require(`../../assets/images/t-text-hover.png`),
  413. Text: '请在右侧属性栏输入文字!',
  414. Color: "#646c73",
  415. Font: 14,
  416. BackgroundColor: "#f7f9facc"
  417. }
  418. }
  419. const item = new STextMarkerItem(null, data);
  420. item.moveTo(event.x, event.y);
  421. item.selectable = true;
  422. item.moveable = true;
  423. this.addItem(item);
  424. this.Markers.push(item);
  425. this.grabItem = null;
  426. this.focusItem = item;
  427. this.cmd = 'choice';
  428. this.finishCreated(item);
  429. this.scenceUpdate(this);
  430. }
  431. /**
  432. * 增加图标lenged图标
  433. */
  434. addIconItem(event: SMouseEvent): void {
  435. //获取信息工程化相关参数
  436. const LegendData: Legend = {
  437. ID: uuid(),
  438. Name: "",
  439. GraphElementType: this._legend.Type,
  440. Num: 1,
  441. GraphElementId: this._legend.Id,
  442. AttachObjectIds: [],
  443. Pos: { X: event.x, Y: event.y },
  444. Scale: { X: 1, Y: 1, Z: 1 }, // 缩放
  445. Rolate: { X: 0, Y: 0, Z: 0 },
  446. Size: { Width: 0, Height: 0 }, // 大小
  447. Type: this._legend.Type,
  448. Properties: {
  449. IconUrl: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
  450. Url: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
  451. Num: 1, // 此num与信息工程化得num无关
  452. Size: {
  453. Width: this._legend.Size ? this._legend.Size.Width ? this._legend.Size.Width : 32 : 32, //icon 的宽
  454. Height: this._legend.Size ? this._legend.Size.Height ? this._legend.Size.Height : 32 : 32, //icon 的高
  455. },
  456. font: 16, //font
  457. color: "#1F2429", //字体颜色
  458. FrameColor: this._legend.FrameColor,
  459. GraphCategoryId: this._legend.GraphCategoryId,
  460. InfoSystemId: this._legend.InfoSystemId ? this._legend.InfoSystemId : '',
  461. InfoTypeId: this._legend.InfoTypeId.length ? this._legend.InfoTypeId : [],// 铺位可视化Typeid(用于编辑工程信息化时默认问题)
  462. InfoLocal: this._legend.InfoLocal.length ? this._legend.InfoLocal : []
  463. },
  464. }
  465. const cmd = this.cmd;
  466. const item = new SImageLegendItem(null, LegendData);
  467. this.cmd = 'choice';
  468. item.selectable = true;
  469. item.moveable = true;
  470. this.addItem(item);
  471. this.Nodes.push(item);
  472. this.grabItem = null;
  473. this.focusItem = item;
  474. this.finishCreated(item);
  475. this.scenceUpdate(this);
  476. if (event.ctrlKey) {
  477. this.cmd = cmd;
  478. }
  479. }
  480. /**
  481. * 更改item对应属性
  482. */
  483. editItemStatus(): void {
  484. }
  485. /**
  486. * 更改文本对应属性
  487. * @param str string 文字内容
  488. */
  489. updatedText(str: string): void {
  490. if (this.focusItem) {
  491. const oldMsg = this.focusItem.text;
  492. const newMsg = str;
  493. this.focusItem.text = str;
  494. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "text", oldMsg, newMsg));
  495. this.scenceUpdate(this);
  496. }
  497. }
  498. /**
  499. * 更改文本fontSize属性
  500. * @param size number 文字大小
  501. */
  502. updatedFontSize(size: number): void {
  503. if (this.focusItem) {
  504. let old = new SFont(this.focusItem.font);
  505. let font = new SFont(this.focusItem.font);
  506. font.size = size;
  507. this.focusItem.font = font;
  508. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "font", old, font));
  509. }
  510. }
  511. /**
  512. * 更改线宽属性
  513. * @param lineWidth number 线宽大小
  514. */
  515. updatedLineWidth(lineWidth: number): void {
  516. if (this.focusItem) {
  517. const oldMsg = this.focusItem.lineWidth;
  518. const newMsg = lineWidth;
  519. this.focusItem.lineWidth = lineWidth;
  520. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "lineWidth", oldMsg, newMsg));
  521. }
  522. }
  523. /**
  524. * 更改文本颜色属性
  525. * @param str string 颜色
  526. */
  527. updatedFontColor(color: string): void {
  528. if (this.focusItem) {
  529. const oldMsg = this.focusItem.color;
  530. const newMsg = new SColor(color);
  531. this.focusItem.color = newMsg;
  532. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "color", oldMsg, newMsg));
  533. }
  534. }
  535. /**
  536. * 更改border颜色
  537. * @param color string 颜色
  538. */
  539. updatedBorderColor(color: string): void {
  540. if (this.focusItem) {
  541. const oldMsg = this.focusItem.strokeColor;
  542. const newMsg = new SColor(color);
  543. this.focusItem.strokeColor = newMsg;
  544. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "strokeColor", oldMsg, newMsg));
  545. }
  546. }
  547. /**
  548. * 更改item宽
  549. * @param width number 颜色
  550. */
  551. updatedWidth(width: number): void {
  552. if (this.focusItem) {
  553. let oldMsg = null;
  554. const newMsg = width;
  555. if (this.focusItem.data && this.focusItem.data.GraphElementType && this.focusItem.data.GraphElementType == "Image") {
  556. oldMsg = this.focusItem.sWidth
  557. this.focusItem.sWidth = width;
  558. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "sWidth", oldMsg, newMsg));
  559. } else {
  560. oldMsg = this.focusItem.width
  561. this.focusItem.width = width;
  562. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "width", oldMsg, newMsg));
  563. }
  564. }
  565. }
  566. /**
  567. * 更改item高
  568. * @param height number 颜色
  569. */
  570. updatedHeight(height: number): void {
  571. if (this.focusItem) {
  572. let oldMsg = null;
  573. const newMsg = height;
  574. if (this.focusItem.data && this.focusItem.data.GraphElementType && this.focusItem.data.GraphElementType == "Image") {
  575. oldMsg = this.focusItem.sHeight;
  576. this.focusItem.sHeight = height;
  577. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "sHeight", oldMsg, newMsg));
  578. } else {
  579. oldMsg = this.focusItem.height;
  580. this.focusItem.height = height;
  581. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "height", oldMsg, newMsg));
  582. }
  583. }
  584. }
  585. /**
  586. * 更改item坐标
  587. * @param x number x x坐标
  588. * @param y number y y坐标
  589. */
  590. updatedPosition(x: number, y: number): void {
  591. if (this.focusItem) {
  592. let p = this.focusItem.mapFromScene(x, y)
  593. // newx - oldx = newleft - oldleft
  594. // 要求的值(新的x坐标) - 旧的x坐标 = 新的左边界(用户输入的值) - 旧的左边界
  595. this.focusItem.x = (p.x - this.focusItem.boundingRect().left) * this.focusItem.inverseScale + this.focusItem.x;
  596. this.focusItem.y = (p.y - this.focusItem.boundingRect().top) * this.focusItem.inverseScale + this.focusItem.y;
  597. if (this.focusItem instanceof SPolylineItem || this.focusItem instanceof SPolygonItem || this.focusItem instanceof SLineItem) {
  598. this.focusItem.moveToOrigin(this.focusItem.x, this.focusItem.y)
  599. }
  600. }
  601. }
  602. /**
  603. * 更改item 背景色坐标
  604. * @param color string 颜色color
  605. */
  606. updatedbackColor(color: string): void {
  607. if (this.focusItem) {
  608. const newMsg = new SColor(color);
  609. const oldMsg = this.focusItem.backgroundColor;
  610. this.focusItem.backgroundColor = new SColor(color);
  611. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "backgroundColor", oldMsg, newMsg));
  612. }
  613. }
  614. /**
  615. * 更改item Url
  616. * @param url string 图片key
  617. */
  618. upadataImageUrl(url: string): void {
  619. if (this.focusItem) {
  620. const newMsg = '/serve/topology-wanda/Picture/query/' + url;
  621. const oldMsg = this.focusItem.url;
  622. this.focusItem.url = newMsg;
  623. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "url", oldMsg, newMsg));
  624. }
  625. }
  626. /**
  627. * 更改item border
  628. * @param val string border类型
  629. */
  630. upadataBorder(val: string): void {
  631. if (this.focusItem) {
  632. let borderStyle = null;
  633. if (val == 'dashed') {
  634. borderStyle = SLineStyle.Dashed;
  635. } else if (val == 'dotted') {
  636. borderStyle = SLineStyle.Dotted;
  637. } else if (val == 'solid') {
  638. borderStyle = SLineStyle.Solid;
  639. }
  640. const newMsg = borderStyle;
  641. const oldMsg = this.focusItem.lineStyle;
  642. this.focusItem.lineStyle = borderStyle;
  643. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "lineStyle", oldMsg, newMsg));
  644. }
  645. }
  646. /**
  647. * 更改item 名称
  648. * @param val string border类型
  649. */
  650. upadataLengedName(val: string): void {
  651. if (this.focusItem && this.focusItem.data) {
  652. const newMsg = val;
  653. const oldMsg = this.focusItem.text;
  654. this.focusItem.text = val;
  655. this.focusItem.name = val;
  656. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "text", oldMsg, newMsg));
  657. this.scenceUpdate(this);
  658. }
  659. }
  660. /**
  661. * 更改item 名称
  662. * @param val string border类型
  663. */
  664. updateEquipmentName(val: string): void {
  665. console.log(this.focusItem)
  666. this.focusItem && (this.focusItem!.name = val)
  667. }
  668. /**
  669. * 信息点修改
  670. * @param val 修改的信息点
  671. */
  672. updateEquipmentInfoName(val: object): void {
  673. console.log(val)
  674. if (this.focusItem) {
  675. // @ts-ignore
  676. this.focusItem.info = val
  677. }
  678. }
  679. /**
  680. * 添加信息点
  681. */
  682. addEquipmentInfo(): void {
  683. // @ts-ignore
  684. this.focusItem && this.focusItem.addEquipmentInfo()
  685. }
  686. /**
  687. * 删除信息点
  688. */
  689. deleteEquipmentInfo() {
  690. // @ts-ignore
  691. this.focusItem && this.focusItem.deleteEquipmentInfo()
  692. }
  693. /**
  694. * 更改item Num数量
  695. * @param num number item数量 (只对icon设备类)
  696. */
  697. upadatImageNum(num: number): void {
  698. if (this.focusItem && this.focusItem.num) {
  699. const newMsg = num;
  700. const oldMsg = this.focusItem.num;
  701. this.focusItem.num = num;
  702. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "num", oldMsg, newMsg));
  703. }
  704. }
  705. /**
  706. * 更改item Num数量
  707. * @param num number item数量 (只对icon设备类)
  708. */
  709. upadatfillColor(fillColor: string): void {
  710. if (this.focusItem && this.focusItem.fillColor) {
  711. let fillColorT;
  712. if (fillColor.length == 7) {
  713. fillColorT = fillColor + Transparency[15];
  714. if (this.focusItem instanceof SSCPZZoneLegendItem || this.focusItem instanceof SFHFQZoneLegendItem) {
  715. const sc = new SColor(this.focusItem.fillColor);
  716. const alp = ((sc.alpha / 255) * 100).toFixed()
  717. fillColorT = fillColor + Transparency[alp];
  718. // fillColorT = fillColor + Transparency[80];
  719. }
  720. } else {
  721. fillColorT = fillColor;
  722. }
  723. const newMsg = new SColor(fillColorT);
  724. const oldMsg = this.focusItem.fillColor;
  725. this.focusItem.fillColor = new SColor(fillColorT);
  726. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "fillColor", oldMsg, newMsg));
  727. }
  728. }
  729. /**
  730. * 更改图例说
  731. * @param num number
  732. */
  733. upadatitemExplain(ItemExplain: string): void {
  734. if (this.focusItem) {
  735. this.focusItem.data.Properties.ItemExplain = ItemExplain;
  736. }
  737. }
  738. /**
  739. * 更新工程信息化的相关数据
  740. * @param AttachObjectIds Array
  741. */
  742. upadatAttachObjectIds(AttachObjectIds: []): void {
  743. if (this.focusItem) {
  744. this.focusItem.data.AttachObjectIds = AttachObjectIds;
  745. // 重新选中focusitem
  746. const item = this.focusItem;
  747. this.selectContainer.clear();
  748. this.selectContainer.toggleItem(item);
  749. if (
  750. item instanceof SImageLegendItem ||
  751. item instanceof SZoneLegendItem ||
  752. item instanceof SSCPZZoneLegendItem ||
  753. item instanceof SFHFQZoneLegendItem
  754. ) {
  755. let arr = item.data.AttachObjectIds;
  756. if (arr && arr.length && arr[arr.length - 1].name) {
  757. let name = item.name;
  758. item.name = name + `\n${arr[arr.length - 1].name}`;
  759. item.text = name + `\n${arr[arr.length - 1].name}`;
  760. }
  761. // 绑定工程信息化数据后设置状态
  762. if (item.data.AttachObjectIds && item.data.AttachObjectIds.length) {
  763. item.isActive = true;
  764. } else {
  765. item.isActive = false;
  766. }
  767. }
  768. }
  769. }
  770. /**
  771. * 自定义多边形修改背景色
  772. */
  773. updateCustomBgColor(val: string): void {
  774. if (this.focusItem) {
  775. const newMsg = new SColor(val);
  776. const oldMsg = this.focusItem.fillColor;
  777. this.focusItem.fillColor = new SColor(val)
  778. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "fillColor", oldMsg, newMsg));
  779. }
  780. }
  781. /**
  782. * 自定义多边形修改边框色
  783. */
  784. updateCustomBdColor(val: string): void {
  785. if (this.focusItem) {
  786. const newMsg = new SColor(val);
  787. const oldMsg = this.focusItem.strokeColor;
  788. this.focusItem.strokeColor = new SColor(val)
  789. this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "strokeColor", oldMsg, newMsg));
  790. }
  791. }
  792. /**
  793. * 删除指定item
  794. */
  795. deleiteItem(): void {
  796. if (this.focusItem) {
  797. if ((this.focusItem instanceof SZoneLegendItem ||
  798. this.focusItem instanceof SSCPZZoneLegendItem ||
  799. this.focusItem instanceof SFHFQZoneLegendItem ||
  800. this.focusItem instanceof TipelineItem) &&
  801. this.focusItem.curIndex != -1
  802. ) {
  803. this.focusItem.deletePoint(this.focusItem.curIndex);
  804. } else {
  805. this.undoStack.push(new SGraphDeleteCommand(this, this.focusItem));
  806. this.removeItem(this.focusItem);
  807. let a = -1
  808. this.Nodes.forEach((item: any, index: number) => {
  809. if (item.id == this.focusItem.id) {
  810. a = index
  811. }
  812. });
  813. if (a > -1) {
  814. this.Nodes.splice(a, 1);
  815. }
  816. let b = -1;
  817. this.Markers.forEach((item: any, index: number) => {
  818. if (item.id == this.focusItem.id) {
  819. b = index
  820. }
  821. });
  822. if (b > -1) {
  823. this.Markers.splice(b, 1);
  824. }
  825. let c = -1;
  826. this.Relations.forEach((item: any, index: number) => {
  827. if (item.id == this.focusItem.id) {
  828. c = index
  829. }
  830. });
  831. if (c > -1) {
  832. this.Relations.splice(c, 1);
  833. }
  834. this.grabItem = null;
  835. this.focusItem = null;
  836. if (this.view) {
  837. this.view.update();
  838. }
  839. this.scenceUpdate(this);
  840. }
  841. } else {
  842. //批量删除
  843. if (!this.focusItemList) {
  844. return
  845. }
  846. this.undoStack.push(new SGraphDeleteListCommand(this, this.focusItemList))
  847. this.focusItemList.forEach((focusItem) => {
  848. this.removeItem(focusItem);
  849. let a = -1
  850. this.Nodes.forEach((item: any, index: number) => {
  851. if (item.id == focusItem.id) {
  852. a = index
  853. }
  854. });
  855. if (a > -1) {
  856. this.Nodes.splice(a, 1);
  857. }
  858. let b = -1;
  859. this.Markers.forEach((item: any, index: number) => {
  860. if (item.id == focusItem.id) {
  861. b = index
  862. }
  863. });
  864. if (b > -1) {
  865. this.Markers.splice(b, 1);
  866. }
  867. let c = -1;
  868. this.Relations.forEach((item: any, index: number) => {
  869. if (item.id == focusItem.id) {
  870. c = index
  871. }
  872. });
  873. if (c > -1) {
  874. this.Relations.splice(c, 1);
  875. }
  876. });
  877. this.focusItemList = [];
  878. this.grabItem = null;
  879. this.focusItem = null;
  880. if (this.view) {
  881. this.view.update();
  882. }
  883. this.scenceUpdate(this);
  884. }
  885. }
  886. scenceUpdate(scence: any) {
  887. }
  888. /**
  889. * 对齐指定item
  890. * @param v
  891. */
  892. changeAlignItem(v: any): void {
  893. this.selectContainer.layout(v);
  894. }
  895. /**
  896. * 图层排序
  897. * @param v
  898. */
  899. changeOrderItem(v: any): void {
  900. this.selectContainer.setOrder(v);
  901. }
  902. /**
  903. * 提取item
  904. */
  905. extractItem(): void {
  906. console.log(this)
  907. }
  908. /**
  909. * 保存数据
  910. */
  911. saveMsgItem(): any {
  912. const Nodes: any = [];
  913. const Markers: any = [];
  914. const Relations: any = [];
  915. this.Nodes.forEach(e => {
  916. Nodes.push(e.toData())
  917. });
  918. this.Markers.forEach(e => {
  919. Markers.push(e.toData())
  920. });
  921. this.Relations.forEach(e => {
  922. Relations.push(e.toData())
  923. });
  924. // let element = {
  925. // Nodes, Markers, Relations
  926. // }
  927. let backgroundImg: string = ''
  928. let element = {
  929. Nodes,
  930. Markers,
  931. Relations,
  932. backgroundImg
  933. };
  934. if (this.backgroundImgItem) {
  935. element.backgroundImg = this.backgroundImgItem.url
  936. }
  937. return element
  938. }
  939. /**
  940. * 执行取消操作
  941. */
  942. redo(): void {
  943. if (this.grabItem && this.grabItem.redo) {
  944. this.grabItem.redo()
  945. } else {
  946. this.undoStack.redo();
  947. this.scenceUpdate(this);
  948. }
  949. }
  950. /**
  951. * 执行重做操作执行
  952. */
  953. undo(): void {
  954. if (this.grabItem && this.grabItem.undo) {
  955. this.grabItem.undo()
  956. } else {
  957. this.undoStack.undo();
  958. this.scenceUpdate(this);
  959. }
  960. }
  961. /**
  962. * 完成事件创建的回调函数
  963. */
  964. finishCreated(item: any) {
  965. // let arrList = []
  966. if (this.cmd == 'baseLine') {
  967. // arrList = this.Markers;
  968. // 对数组遍历防止相同得id注入
  969. let canPush = true; //是否可注入
  970. this.Markers.forEach((arrItem: any) => {
  971. if (arrItem.id == item.id) {
  972. canPush = false
  973. }
  974. })
  975. if (canPush) {
  976. this.Markers.push(item);
  977. this.undoStack.push(new SGraphAddCommand(this, item));
  978. }
  979. }
  980. this.cmd = 'choice';
  981. this.selectContainer.clear()
  982. this.selectContainer.toggleItem(item)
  983. setTimeout(() => {
  984. this.focusItem = item;
  985. });
  986. if (item instanceof SZoneLegendItem || item instanceof SFHFQZoneLegendItem || item instanceof SSCPZZoneLegendItem || item instanceof SCustomLegendItem) {
  987. let canPush = true; //是否可注入
  988. this.Nodes.forEach((arrItem: any) => {
  989. if (arrItem.id == item.id) {
  990. canPush = false
  991. }
  992. })
  993. if (canPush) {
  994. this.Nodes.push(item); //完成后,方可扔到Node节点
  995. this.undoStack.push(new SGraphAddCommand(this, item));
  996. }
  997. }
  998. // 管道完成后方可保存
  999. if (item instanceof TipelineItem) {
  1000. let canPush = true; //是否可注入
  1001. this.Relations.forEach((arrItem: any) => {
  1002. if (arrItem.id == item.id) {
  1003. canPush = false
  1004. }
  1005. })
  1006. if (canPush) {
  1007. this.Relations.push(item);
  1008. this.undoStack.push(new SGraphAddCommand(this, item));
  1009. }
  1010. }
  1011. this.scenceUpdate(this);
  1012. }
  1013. ////////////////////////
  1014. // 以下为鼠标键盘操作事件
  1015. onMouseDown(event: SMouseEvent): any {
  1016. if (!this.isEditStatus) {
  1017. return true
  1018. }
  1019. // 判断是否开启吸附,并且有吸附的点
  1020. if (
  1021. this.isAbsorbing &&
  1022. this.highLight &&
  1023. this.highLight.visible
  1024. ) {
  1025. event.x = this.highLight.point.x;
  1026. event.y = this.highLight.point.y;
  1027. }
  1028. if (this.grabItem) {
  1029. if (this.grabItem instanceof TipelineItem) {
  1030. this.setTipeEndanchor(event)
  1031. return true;
  1032. } else if (this.grabItem instanceof SLineMarkerItem && this.grabItem.status == SItemStatus.Create) {
  1033. this.setLineItem(event)
  1034. return true;
  1035. }
  1036. return this.grabItem.onMouseDown(event);
  1037. }
  1038. switch (this.cmd) {
  1039. // 画设备
  1040. case "equipment":
  1041. this.addEquipment(event);
  1042. break;
  1043. case 'baseLine':
  1044. this.addLine(event);
  1045. break;
  1046. case 'baseText':
  1047. this.addTextItem(event);
  1048. break;
  1049. case 'baseImage':
  1050. this.addImgItem(event)
  1051. break;
  1052. case 'Zone':
  1053. if (!this.isSelecting) {
  1054. this.addPolygonItem(event);
  1055. } else {
  1056. // 点选创建区域
  1057. return super.onMouseDown(event)
  1058. }
  1059. break;
  1060. case 'Image':
  1061. this.addIconItem(event);
  1062. break;
  1063. case 'Line':
  1064. this.addTipelineItem(event);
  1065. break;
  1066. default:
  1067. return super.onMouseDown(event);
  1068. }
  1069. }
  1070. onMouseMove(event: SMouseEvent): boolean {
  1071. if (!this.isEditStatus) {
  1072. return true
  1073. }
  1074. if (this.isAbsorbing) {
  1075. if (!this.highLight) {
  1076. this.highLight = new HighlightItem(null);
  1077. this.addItem(this.highLight);
  1078. }
  1079. this.highLight.visible = false;
  1080. this.absorbSpace(event);
  1081. }
  1082. if (this.grabItem) {
  1083. if (this.grabItem instanceof TipelineItem) {
  1084. const anc = this.clickIsAnchor(event);
  1085. if (anc) {
  1086. const p = anc.mapToScene(0, 0)
  1087. event.x = p.x;
  1088. event.y = p.y;
  1089. return this.grabItem.onMouseMove(event);
  1090. }
  1091. }
  1092. }
  1093. return super.onMouseMove(event)
  1094. }
  1095. onMouseUp(event: SMouseEvent): boolean {
  1096. if (!this.isEditStatus) {
  1097. return true
  1098. }
  1099. if (this.grabItem) {
  1100. if (this.grabItem instanceof SLineMarkerItem && this.grabItem.status == SItemStatus.Edit) {
  1101. this.setLineItem(event)
  1102. return true;
  1103. } else if (this.grabItem instanceof TipelineItem) {
  1104. this.updateTipeAnc(event);
  1105. return true;
  1106. }
  1107. return this.grabItem.onMouseUp(event);
  1108. }
  1109. return super.onMouseUp(event)
  1110. }
  1111. /**
  1112. * 键盘事件
  1113. *
  1114. * @param event 事件参数
  1115. * @return boolean
  1116. */
  1117. onKeyDown(event: KeyboardEvent): any {
  1118. if (!this.isEditStatus) {
  1119. return true
  1120. }
  1121. if (this.grabItem) {
  1122. this.grabItem.onKeyDown(event);
  1123. if (event.code == "Escape") {
  1124. const item = this.grabItem;
  1125. this.grabItem = null
  1126. this.removeItem(item);
  1127. if (this.view) {
  1128. this.view.update()
  1129. }
  1130. this.setCmd = 'choice'
  1131. }
  1132. }
  1133. // 删除键功能
  1134. if (event.code == 'Delete') {
  1135. this.deleiteItem()
  1136. }
  1137. // 复制粘贴
  1138. if (event.ctrlKey && !event.repeat) {
  1139. if (event.code == 'KeyC') {
  1140. console.log('ctrl c')
  1141. this.copy()
  1142. } else if (event.code == 'KeyV') {
  1143. console.log('ctrl v')
  1144. this.paste()
  1145. }
  1146. }
  1147. return false
  1148. }
  1149. /**
  1150. * 复制
  1151. *
  1152. */
  1153. copy() {
  1154. if (this.selectContainer.itemList.length) {
  1155. this.copyString = {
  1156. Nodes: [],
  1157. Markers: [],
  1158. Relations: []
  1159. };
  1160. this.selectContainer.itemList.forEach(t => {
  1161. const type = this.itemToType(t);
  1162. if (type) {
  1163. const data = JSON.parse(JSON.stringify(t.toData()))
  1164. data.ID = ''
  1165. if (data.Type == 'Image') {
  1166. data.AnchorList = []
  1167. }
  1168. this.copyString[type].push(data)
  1169. }
  1170. })
  1171. // 生成复制字符串
  1172. console.log(this.copyString)
  1173. return
  1174. // 获取input dom
  1175. const input = document.createElement('input');
  1176. input.setAttribute('id', 'COPYINPUT')
  1177. input.value = JSON.stringify(this.copyString)
  1178. document.body.appendChild(input);
  1179. input.select()
  1180. document.execCommand('copy');
  1181. input.style.display = 'none';
  1182. console.log(input.value, Date.now());
  1183. document.body.removeChild(input)
  1184. }
  1185. }
  1186. /**
  1187. * 粘贴
  1188. *
  1189. */
  1190. paste() {
  1191. const parserData = new STopologyParser(null);
  1192. // 需要深拷贝
  1193. parserData.parseData(JSON.parse(JSON.stringify(this.copyString)))
  1194. // 不需要复制区域
  1195. // parserData.zoneLegendList.forEach(t => {
  1196. // if (t instanceof SCustomLegendItem) {
  1197. // if (this.view) {
  1198. // t.pos.x += 10 / this.view.scale
  1199. // t.pos.y += 10 / this.view.scale
  1200. // }
  1201. // this.addItem(t)
  1202. // this.Nodes.push(t);
  1203. // graphItemList.push(t)
  1204. // }
  1205. // // 加到node
  1206. // // 加命令
  1207. // })
  1208. const graphItemList = [];
  1209. parserData.imageLegendList.forEach(t => {
  1210. if (this.view) {
  1211. t.pos.x += 10 / this.view.scale
  1212. t.pos.y += 10 / this.view.scale
  1213. }
  1214. t.moveable = true;
  1215. this.addItem(t)
  1216. this.Nodes.push(t);
  1217. graphItemList.push(t)
  1218. })
  1219. parserData.imageMarkerList.forEach(t => {
  1220. if (this.view) {
  1221. t.pos.x += 10 / this.view.scale
  1222. t.pos.y += 10 / this.view.scale
  1223. }
  1224. t.moveable = true;
  1225. this.addItem(t)
  1226. this.Markers.push(t);
  1227. graphItemList.push(t)
  1228. })
  1229. parserData.lineMarkerList.forEach(t => {
  1230. if (this.view) {
  1231. t.pos.x += 10 / this.view.scale
  1232. t.pos.y += 10 / this.view.scale
  1233. }
  1234. t.moveable = true;
  1235. this.addItem(t)
  1236. this.Markers.push(t);
  1237. graphItemList.push(t)
  1238. })
  1239. parserData.textMarkerList.forEach(t => {
  1240. if (this.view) {
  1241. t.pos.x += 10 / this.view.scale
  1242. t.pos.y += 10 / this.view.scale
  1243. }
  1244. t.moveable = true;
  1245. this.addItem(t)
  1246. this.Markers.push(t);
  1247. graphItemList.push(t)
  1248. })
  1249. parserData.relationList.forEach(t => {
  1250. if (this.view) {
  1251. t.pos.x += 10 / this.view.scale
  1252. t.pos.y += 10 / this.view.scale
  1253. t.moveToOrigin(t.pos.x, t.pos.y)
  1254. }
  1255. t.moveable = true;
  1256. this.addItem(t)
  1257. this.Relations.push(t);
  1258. graphItemList.push(t)
  1259. })
  1260. this.scenceUpdate(this);
  1261. if (graphItemList.length) {
  1262. this.AddListCommand(graphItemList)
  1263. }
  1264. }
  1265. /**
  1266. * 跨页面粘贴
  1267. *
  1268. */
  1269. crossPagePaste(crossPageString: string) {
  1270. try {
  1271. console.log(crossPageString);
  1272. const pageObj = JSON.parse(crossPageString)
  1273. const parserData = new STopologyParser(null);
  1274. // 需要深拷贝
  1275. parserData.parseData(JSON.parse(JSON.stringify(pageObj)))
  1276. // 不需要复制区域
  1277. // parserData.zoneLegendList.forEach(t => {
  1278. // if (t instanceof SCustomLegendItem) {
  1279. // if (this.view) {
  1280. // t.pos.x += 10 / this.view.scale
  1281. // t.pos.y += 10 / this.view.scale
  1282. // }
  1283. // this.addItem(t)
  1284. // this.Nodes.push(t);
  1285. // graphItemList.push(t)
  1286. // }
  1287. // // 加到node
  1288. // // 加命令
  1289. // })
  1290. const graphItemList = [];
  1291. parserData.imageLegendList.forEach(t => {
  1292. if (this.view) {
  1293. t.pos.x += 10 / this.view.scale
  1294. t.pos.y += 10 / this.view.scale
  1295. }
  1296. t.moveable = true;
  1297. this.addItem(t)
  1298. this.Nodes.push(t);
  1299. graphItemList.push(t)
  1300. })
  1301. parserData.imageMarkerList.forEach(t => {
  1302. if (this.view) {
  1303. t.pos.x += 10 / this.view.scale
  1304. t.pos.y += 10 / this.view.scale
  1305. }
  1306. t.moveable = true;
  1307. this.addItem(t)
  1308. this.Markers.push(t);
  1309. graphItemList.push(t)
  1310. })
  1311. parserData.lineMarkerList.forEach(t => {
  1312. if (this.view) {
  1313. t.pos.x += 10 / this.view.scale
  1314. t.pos.y += 10 / this.view.scale
  1315. }
  1316. t.moveable = true;
  1317. this.addItem(t)
  1318. this.Markers.push(t);
  1319. graphItemList.push(t)
  1320. })
  1321. parserData.textMarkerList.forEach(t => {
  1322. if (this.view) {
  1323. t.pos.x += 10 / this.view.scale
  1324. t.pos.y += 10 / this.view.scale
  1325. }
  1326. t.moveable = true;
  1327. this.addItem(t)
  1328. this.Markers.push(t);
  1329. graphItemList.push(t)
  1330. })
  1331. parserData.relationList.forEach(t => {
  1332. if (this.view) {
  1333. t.pos.x += 10 / this.view.scale
  1334. t.pos.y += 10 / this.view.scale
  1335. t.moveToOrigin(t.pos.x, t.pos.y)
  1336. }
  1337. t.moveable = true;
  1338. this.addItem(t)
  1339. this.Relations.push(t);
  1340. graphItemList.push(t)
  1341. })
  1342. this.scenceUpdate(this);
  1343. if (graphItemList.length) {
  1344. this.AddListCommand(graphItemList)
  1345. }
  1346. } catch (e) {
  1347. console.log(e);
  1348. }
  1349. }
  1350. /** 类型转换 */
  1351. itemToType(obj: SGraphItem): String {
  1352. if (obj instanceof STextMarkerItem) {
  1353. return 'Markers'
  1354. } else if (obj instanceof SImageMarkerItem) {
  1355. return 'Markers'
  1356. } else if (obj instanceof SLineMarkerItem) {
  1357. return 'Markers'
  1358. } else if (obj instanceof SZoneLegendItem) {
  1359. return 'Nodes'
  1360. } else if (obj instanceof SFHFQZoneLegendItem) {
  1361. return 'Nodes'
  1362. } else if (obj instanceof SSCPZZoneLegendItem) {
  1363. return 'Nodes'
  1364. } else if (obj instanceof SImageLegendItem) {
  1365. return 'Nodes'
  1366. } else if (obj instanceof TipelineItem) {
  1367. return 'Relations'
  1368. }
  1369. return '';
  1370. }
  1371. /**
  1372. * 鼠标双击事件
  1373. *
  1374. * @param event 事件参数
  1375. * @return boolean
  1376. */
  1377. onDoubleClick(event: SMouseEvent): boolean {
  1378. if (!this.isEditStatus) {
  1379. return true
  1380. } else {
  1381. return super.onDoubleClick(event);
  1382. }
  1383. } // Function onDoubleClick()
  1384. /**
  1385. * 设置管线结束锚点
  1386. *
  1387. */
  1388. setTipeEndanchor(event: SMouseEvent): void {
  1389. if (this.grabItem instanceof TipelineItem) {
  1390. const anc = this.clickIsAnchor(event);
  1391. if (anc) {
  1392. const p = anc.mapToScene(0, 0)
  1393. anc.isConnected = true;
  1394. event.x = p.x;
  1395. event.y = p.y;
  1396. if (this.grabItem.status == SItemStatus.Create) {
  1397. if (this.grabItem.pointList.length) {
  1398. this.grabItem.endAnchor = anc;
  1399. anc.parent?.connect('changePos', this.grabItem, this.grabItem.changePos)
  1400. }
  1401. this.grabItem.anchor2ID = anc.id
  1402. this.grabItem.node2Id = anc.parent.id
  1403. this.grabItem.onMouseDown(event)
  1404. this.grabItem.status = SItemStatus.Normal;
  1405. this.finishCreated(this.grabItem)
  1406. return
  1407. }
  1408. }
  1409. this.grabItem.onMouseDown(event)
  1410. }
  1411. }
  1412. /**
  1413. * 管线item修改锚点
  1414. *
  1415. */
  1416. updateTipeAnc(event: SMouseEvent): void {
  1417. if (this.grabItem instanceof TipelineItem) {
  1418. const anc = this.clickIsAnchor(event);
  1419. if (anc) {
  1420. const p = anc.mapToScene(0, 0)
  1421. event.x = p.x;
  1422. event.y = p.y;
  1423. if (this.grabItem.status == SItemStatus.Edit) {
  1424. if (this.grabItem.curIndex == 0) {
  1425. if (this.grabItem.startAnchor) {
  1426. this.grabItem.startAnchor.isConnected = false
  1427. this.grabItem.startAnchor.parent.disconnect('changePos', this.grabItem);
  1428. }
  1429. anc.isConnected = true;
  1430. this.grabItem.startAnchor = anc;
  1431. this.grabItem.anchor1ID = anc.id
  1432. this.grabItem.node1Id = anc.parent.id
  1433. anc.parent.connect('changePos', this.grabItem, this.grabItem.changePos)
  1434. }
  1435. if (this.grabItem.curIndex == this.grabItem.pointList.length - 1) {
  1436. if (this.grabItem.endAnchor) {
  1437. this.grabItem.endAnchor.isConnected = false
  1438. this.grabItem.endAnchor.parent.disconnect('changePos', this.grabItem);
  1439. }
  1440. anc.isConnected = true;
  1441. this.grabItem.endAnchor = anc;
  1442. this.grabItem.anchor2ID = anc.id
  1443. this.grabItem.node2Id = anc.parent.id
  1444. anc.parent.connect('changePos', this.grabItem, this.grabItem.changePos)
  1445. }
  1446. }
  1447. this.grabItem.onMouseUp(event)
  1448. return
  1449. } else {
  1450. if (this.grabItem.status == SItemStatus.Edit) {
  1451. if (this.grabItem.curIndex == 0) {
  1452. if (this.grabItem.startAnchor) {
  1453. this.grabItem.startAnchor.isConnected = false
  1454. this.grabItem.startAnchor.parent.disconnect('changePos', this.grabItem);
  1455. this.grabItem.startAnchor = null;
  1456. this.grabItem.anchor1ID = ''
  1457. this.grabItem.node1Id = ''
  1458. }
  1459. }
  1460. if (this.grabItem.curIndex == this.grabItem.pointList.length - 1) {
  1461. if (this.grabItem.endAnchor) {
  1462. this.grabItem.endAnchor.isConnected = false
  1463. this.grabItem.endAnchor.parent.disconnect('changePos', this.grabItem);
  1464. this.grabItem.endAnchor = null;
  1465. this.grabItem.anchor2ID = ''
  1466. this.grabItem.node2Id = ''
  1467. }
  1468. }
  1469. }
  1470. this.grabItem.onMouseUp(event)
  1471. return
  1472. }
  1473. }
  1474. }
  1475. /**
  1476. * 设置直线结束Item
  1477. *
  1478. */
  1479. setLineItem(event: SMouseEvent): void {
  1480. if (this.grabItem instanceof SLineMarkerItem) {
  1481. const item = this.clickIsItem(event);
  1482. // 鼠标点是否在某个item内
  1483. if (item) {
  1484. let scenePoint = item.boundingRect().center();
  1485. const p = item.mapToScene(scenePoint.x, scenePoint.y);
  1486. event.x = p.x;
  1487. event.y = p.y;
  1488. if (this.grabItem.status == SItemStatus.Create) {
  1489. // 点击在item内、创建状态且端点列表不为空时将直线结束端点和item绑定
  1490. if (this.grabItem.line.length) {
  1491. if (this.grabItem.startItem?.id == item.id) {
  1492. this.grabItem.endItem = null;
  1493. } else {
  1494. this.grabItem.endItem = item;
  1495. this.grabItem.line[1] = new SPoint(event.x, event.y);
  1496. item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1497. }
  1498. }
  1499. this.grabItem.onMouseDown(event);
  1500. return
  1501. } else if (this.grabItem.status == SItemStatus.Edit) {
  1502. // 点击在item内、编辑状态且点击的为结束端点时
  1503. if (this.grabItem.curIndex == 1) {
  1504. // 直线关联的起始item是直线结束端点所在的item时,不吸附在点击item中心并将直线关联的结束item置为null
  1505. if (this.grabItem.startItem?.id == item.id) {
  1506. this.grabItem.endItem = null;
  1507. } else {// 反正吸附,关联
  1508. this.grabItem.endItem = item;
  1509. this.grabItem.line[1] = new SPoint(event.x, event.y);
  1510. item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1511. }
  1512. } else if (this.grabItem.curIndex == 0) {
  1513. if (this.grabItem.endItem?.id == item.id) {
  1514. this.grabItem.startItem = null;
  1515. } else {
  1516. this.grabItem.startItem = item;
  1517. this.grabItem.line[0] = new SPoint(event.x, event.y);
  1518. item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1519. }
  1520. }
  1521. }
  1522. } else {
  1523. // 如果不在item内且点击的是直线的某个端点,将端点的关联item置为null
  1524. if (this.grabItem.line.length && this.grabItem.curIndex != -1) {
  1525. if (this.grabItem.curIndex == 1) {
  1526. this.grabItem.endItem = null;
  1527. } else if (this.grabItem.curIndex == 0) {
  1528. this.grabItem.startItem = null;
  1529. }
  1530. } else {
  1531. this.grabItem.onMouseDown(event);
  1532. return
  1533. }
  1534. }
  1535. // if (this.grabItem.status == SItemStatus.Create) {
  1536. // // 鼠标点是否在某个item内
  1537. // if (item) {
  1538. // let scenePoint = item.boundingRect().center();
  1539. // const p = item.mapToScene(scenePoint.x, scenePoint.y);
  1540. // event.x = p.x;
  1541. // event.y = p.y;
  1542. // if (this.grabItem.line.length && this.grabItem.curIndex == -1) {
  1543. // this.grabItem.endItem = item;
  1544. // this.grabItem.line[1] = new SPoint(event.x, event.y);
  1545. // item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1546. // }
  1547. // this.grabItem.onMouseDown(event);
  1548. // return
  1549. // } else {
  1550. // if (this.grabItem.line.length && this.grabItem.curIndex != -1) {
  1551. // if (this.grabItem.curIndex == 1) {
  1552. // this.grabItem.endItem = null;
  1553. // } else if (this.grabItem.curIndex == 0) {
  1554. // this.grabItem.startItem = null;
  1555. // }
  1556. // }
  1557. // }
  1558. // } else if (this.grabItem.status == SItemStatus.Edit) {
  1559. // if (this.grabItem.curIndex == 1) {
  1560. // this.grabItem.endItem = item;
  1561. // this.grabItem.line[1] = new SPoint(event.x, event.y);
  1562. // item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1563. // } else if (this.grabItem.curIndex == 0) {
  1564. // this.grabItem.startItem = item;
  1565. // this.grabItem.line[0] = new SPoint(event.x, event.y);
  1566. // item.connect('onMove', this.grabItem, this.grabItem.changePos);
  1567. // }
  1568. // }
  1569. this.grabItem.onMouseUp(event);
  1570. }
  1571. }
  1572. /**
  1573. * 划线时点击位置是否是锚点
  1574. *
  1575. * @param event 事件
  1576. * @param len 限制距离
  1577. * @return 点击的锚点
  1578. * */
  1579. clickIsAnchor(event: SMouseEvent): SAnchorItem | null {
  1580. let minAnchor = null;
  1581. let len: number = -1;
  1582. this.Nodes.forEach(image => {
  1583. // image.showAnchor = false;
  1584. if (image.anchorList && image.anchorList.length) {
  1585. if (image.img && image.img instanceof SImageItem) {
  1586. let scenePoint = image.img.mapFromScene(event.x, event.y);
  1587. if (image.img.contains(scenePoint.x, scenePoint.y)) {
  1588. let anchor = image.anchorList[0]
  1589. let anchorPoint = anchor.mapToScene(0, 0);
  1590. let dis = SMathUtil.pointDistance(
  1591. event.x,
  1592. event.y,
  1593. anchorPoint.x,
  1594. anchorPoint.y
  1595. );
  1596. console.log(dis)
  1597. if (len < 0) {
  1598. minAnchor = anchor;
  1599. len = dis;
  1600. }
  1601. if (dis < len) {
  1602. minAnchor = anchor;
  1603. len = dis;
  1604. }
  1605. }
  1606. // let scenePoint = image.mapFromScene(event.x, event.y);
  1607. // if (image.contains(scenePoint.x, scenePoint.y)) {
  1608. // image.anchorList.forEach(anchor => {
  1609. // let anchorPoint = anchor.mapToScene(0, 0);
  1610. // let dis = SMathUtil.pointDistance(
  1611. // event.x,
  1612. // event.y,
  1613. // anchorPoint.x,
  1614. // anchorPoint.y
  1615. // );
  1616. // if (len < 0) {
  1617. // len = anchor.sceneDis;
  1618. // }
  1619. // if (dis < len) {
  1620. // minAnchor = anchor;
  1621. // len = dis;
  1622. // }
  1623. // })
  1624. }
  1625. }
  1626. })
  1627. console.log('-----------------------')
  1628. console.log(minAnchor)
  1629. console.log('-----------------------')
  1630. // if (minAnchor&&minAnchor.parent) {
  1631. // minAnchor.parent.showAnchor = true
  1632. // }
  1633. return minAnchor;
  1634. }
  1635. /**
  1636. * 划线时点击位置是在文本,图片,,区域内
  1637. *
  1638. * @param event 事件
  1639. * @return 点击的item
  1640. * */
  1641. clickIsItem(event: SMouseEvent): SGraphItem | null {
  1642. let minIten = null;
  1643. let len: number = -1;
  1644. let itemList = this.Nodes.concat(this.Markers);
  1645. itemList.forEach(item => {
  1646. if (
  1647. item instanceof STextMarkerItem ||
  1648. item instanceof SImageMarkerItem ||
  1649. item instanceof SZoneLegendItem ||
  1650. item instanceof SFHFQZoneLegendItem ||
  1651. item instanceof SSCPZZoneLegendItem ||
  1652. item instanceof SEquipmentItem
  1653. ) {
  1654. let scenePoint = item.mapFromScene(event.x, event.y);
  1655. if (item.contains(scenePoint.x, scenePoint.y)) {
  1656. let dis = SMathUtil.pointDistance(
  1657. scenePoint.x,
  1658. scenePoint.y,
  1659. item.boundingRect().center().x,
  1660. item.boundingRect().center().y
  1661. );
  1662. if (len < 0) {
  1663. minIten = item;
  1664. len = dis;
  1665. }
  1666. if (dis < len) {
  1667. minIten = item;
  1668. len = dis;
  1669. }
  1670. }
  1671. }
  1672. })
  1673. console.log('-----------------------')
  1674. console.log(minIten)
  1675. console.log('-----------------------')
  1676. return minIten;
  1677. }
  1678. /**
  1679. * 点是否在吸附区域内
  1680. *
  1681. * @param p 要判断的点
  1682. * @param minX 空间区域
  1683. * @param minY 空间区域
  1684. * @param maxX 空间区域
  1685. * @param maxY 空间区域
  1686. */
  1687. static isPointInAbsorbArea(
  1688. p: SPoint,
  1689. minX: number,
  1690. maxX: number,
  1691. minY: number,
  1692. maxY: number
  1693. ): boolean {
  1694. let rect = new SRect(
  1695. minX - 1000,
  1696. minY - 1000,
  1697. maxX - minX + 2000,
  1698. maxY - minY + 2000
  1699. );
  1700. return rect.contains(p.x, p.y);
  1701. } // Function isPointInAbsorbArea()
  1702. /**
  1703. * 吸附空间
  1704. *
  1705. * @param event 鼠标事件对象
  1706. * @return boolean 是否找到吸附的对象
  1707. */
  1708. absorbSpace(event: SMouseEvent): boolean {
  1709. if (!this.highLight) {
  1710. return false;
  1711. }
  1712. let absorbLen = 1000;
  1713. if (this.view) {
  1714. absorbLen = 10 / this.view.scale;
  1715. }
  1716. let P = this.absorbSpacePoint(event, absorbLen);
  1717. if (P.Point) {
  1718. this.highLight.distance = P.MinDis;
  1719. this.highLight.point = new SPoint(P.Point.X, -P.Point.Y);
  1720. this.highLight.visible = true;
  1721. return true;
  1722. } else {
  1723. let L = this.absorbSpaceLine(event, absorbLen);
  1724. if (L.Line && L.Point) {
  1725. this.highLight.distance = L.MinDis;
  1726. this.highLight.point = L.Point;
  1727. this.highLight.line = L.Line;
  1728. this.highLight.visible = true;
  1729. return true;
  1730. }
  1731. return false;
  1732. }
  1733. } // Function absorbSpace()
  1734. /**
  1735. * 吸附空间点
  1736. *
  1737. * @param event 鼠标事件对象
  1738. * @param absorbLen 吸附距离
  1739. * @return MinDis 吸附的点
  1740. */
  1741. absorbSpacePoint(event: SMouseEvent, absorbLen: number): MinDis {
  1742. let minPointDis = Number.MAX_SAFE_INTEGER;
  1743. let Point;
  1744. this.spaceList.map((space): void => {
  1745. if (
  1746. EditScence.isPointInAbsorbArea(
  1747. new SPoint(event.x, event.y),
  1748. space.minX,
  1749. space.maxX,
  1750. space.minY,
  1751. space.maxY
  1752. )
  1753. ) {
  1754. space.data.OutLine.forEach((item): void => {
  1755. let minDis = SMathUtil.getMinDisPoint(
  1756. new SPoint(event.x, event.y),
  1757. item
  1758. );
  1759. if (
  1760. minDis &&
  1761. minDis.MinDis < absorbLen &&
  1762. minDis.MinDis < minPointDis
  1763. ) {
  1764. minPointDis = minDis.MinDis;
  1765. Point = minDis.Point;
  1766. }
  1767. });
  1768. }
  1769. });
  1770. return {
  1771. MinDis: minPointDis,
  1772. Point: Point
  1773. };
  1774. } // Function absorbSpacePoint()
  1775. /**
  1776. * 吸附空间线
  1777. *
  1778. * @param event 鼠标事件对象
  1779. * @param absorbLen 吸附距离
  1780. * @return PointToLine 吸附的线
  1781. */
  1782. absorbSpaceLine(event: SMouseEvent, absorbLen: number): PointToLine {
  1783. let minPointDis = Number.MAX_SAFE_INTEGER;
  1784. let Point, Line;
  1785. this.spaceList.forEach((space): void => {
  1786. if (
  1787. EditScence.isPointInAbsorbArea(
  1788. new SPoint(event.x, event.y),
  1789. space.minX,
  1790. space.maxX,
  1791. space.minY,
  1792. space.maxY
  1793. )
  1794. ) {
  1795. space.data.OutLine.forEach((item): void => {
  1796. let minDisLine = SMathUtil.getMinDisLine(
  1797. new SPoint(event.x, event.y),
  1798. item
  1799. );
  1800. if (
  1801. minDisLine &&
  1802. minDisLine.MinDis < absorbLen &&
  1803. minDisLine.MinDis < minPointDis
  1804. ) {
  1805. minPointDis = minDisLine.MinDis;
  1806. Point = minDisLine.Point;
  1807. Line = minDisLine.Line;
  1808. }
  1809. });
  1810. }
  1811. });
  1812. return {
  1813. MinDis: minPointDis,
  1814. Point: Point,
  1815. Line: Line
  1816. };
  1817. } // Function absorbSpaceLine()
  1818. /**
  1819. * 添加多个item命令
  1820. * @param focusItemList 鼠标事件对象
  1821. */
  1822. AddListCommand(focusItemList: any[]): void {
  1823. this.undoStack.push(new SGraphAddListCommand(this, focusItemList));
  1824. }
  1825. /**
  1826. * 选中状态方法
  1827. * @param item 鼠标事件对象
  1828. */
  1829. toggleItem(item: SGraphItem): void {
  1830. this.selectContainer.clear()
  1831. this.selectContainer.toggleItem(item)
  1832. }
  1833. /**
  1834. * 修改背景图片
  1835. * @param {string} url 背景图像地址
  1836. */
  1837. setBackgroundImgItem(url: string): void {
  1838. let imgItem = new SImageItem(null);
  1839. imgItem.connect("imgLoadOver", this, () => {
  1840. this.bgImg = true;
  1841. });
  1842. if (this.backgroundImgItem) {
  1843. this.backgroundImgItem.parent = null;
  1844. }
  1845. this.backgroundImgItem = imgItem;
  1846. imgItem.url = url;
  1847. imgItem.showType = SImageShowType.AutoFit;
  1848. console.log(url);
  1849. imgItem.zOrder = -1000;
  1850. this.addItem(imgItem);
  1851. }
  1852. /**
  1853. * 添加设备类
  1854. * @param
  1855. */
  1856. addEquipment(event: SMouseEvent): void {
  1857. // this.img.url = `http://localhost:8091/serve/topology-wanda/Picture/query/
  1858. /* // 14d978b7edd346f088d6cfb53ada4070`; //冷冻泵
  1859. // 4fde075cdafe4e4ea46e876276feab9d`; //水冷螺杆机组
  1860. // 4aa6051e025d4193a776a5b2d2604ed8 //冷却塔1
  1861. // ece9f93ffc754035bcec2e8f27d66a59 //冷却塔2
  1862. */
  1863. // @ts-ignore
  1864. let imgKey = window.__systemConf.imgKey;
  1865. console.log(this._legend)
  1866. let data = {
  1867. ID: uuid(), // ID
  1868. Name: this._legend.Name, // 名称
  1869. AttachObjectIds: ["Eq001", "Eq002"], // 返回工程信息化对象 ID 列表
  1870. Pos: { X: event.x, Y: event.y }, // 位置
  1871. Size: { Width: 80, Height: 80 }, // 大小
  1872. InfoList: this._legend.InfoList || [],
  1873. Properties: this._legend.Properties || {
  1874. StatusImage: [
  1875. {
  1876. Status: "Running", // 运行
  1877. ImageKey: imgKey[0],
  1878. },
  1879. ],
  1880. }, // 由应用自己定义
  1881. };
  1882. let data1 = {
  1883. ID: uuid(), // ID
  1884. Name: "3#冷冻泵", // 名称
  1885. AttachObjectIds: ["Eq001", "Eq002"], // 返回工程信息化对象 ID 列表
  1886. Pos: { X: event.x, Y: event.y }, // 位置
  1887. Size: { Width: 80, Height: 80 }, // 大小
  1888. InfoList: [
  1889. {
  1890. Code: "", // 对应设备的信息点
  1891. Name: "温度", //信息点名称
  1892. X: 30,
  1893. Y: 20,
  1894. Width: 100,
  1895. Height: 25,
  1896. FontSize: 12,
  1897. Background: "#ffffff",
  1898. TextAlign: "",
  1899. Color: "#000000",
  1900. },
  1901. {
  1902. Code: "", // 对应设备的信息点
  1903. Name: "湿度", //信息点名称
  1904. X: 40,
  1905. Y: 28,
  1906. Width: 100,
  1907. Height: 25,
  1908. FontSize: 12,
  1909. Background: "#ffffff",
  1910. TextAlign: "",
  1911. Color: "#000000",
  1912. },
  1913. ],
  1914. Properties: {
  1915. StatusImage: [
  1916. {
  1917. Status: "Running", // 运行
  1918. ImageKey: imgKey[0],
  1919. },
  1920. {
  1921. Status: "Stop", // 停止
  1922. ImageKey: imgKey[1] || "",
  1923. },
  1924. {
  1925. Status: "Selected", // 选择
  1926. ImageKey: imgKey[2] || "",
  1927. },
  1928. {
  1929. Status: "Warning", // 报警
  1930. ImageKey: "",
  1931. },
  1932. ],
  1933. }, // 由应用自己定义
  1934. };
  1935. let equipmentItem = new SEquipmentItem(null, data);
  1936. console.log(event.x, event.y);
  1937. equipmentItem.selectable = true;
  1938. this.Nodes.push(equipmentItem);
  1939. this.addItem(equipmentItem);
  1940. // this.grabItem = equipmentItem;
  1941. // this.focusItem = equipmentItem;
  1942. this.cmd = "choice";
  1943. }
  1944. }