PTopoScene.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308
  1. /*
  2. * *********************************************************************************************************************
  3. *
  4. * !!
  5. * .F88X
  6. * X8888Y
  7. * .}888888N;
  8. * i888888N; .:! .I$WI:
  9. * R888888I .'N88~ i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
  10. * .R888888I .;N8888~ .X8' "8I.!,/8" !%NY8`"8I8~~8>,88I
  11. * +888888N; .8888888Y "&&8Y.}8,
  12. * ./888888N; .R888888Y .'}~ .>}'.`+> i}! "i' +/' .'i~ !11,.:">, .~]! .i}i
  13. * ~888888%: .I888888l .]88~`1/iY88Ii+1'.R$8$8]"888888888> Y8$ W8E X8E W8888'188Il}Y88$*
  14. * 18888888 E8888881 .]W%8$`R8X'&8%++N8i,8N%N8+l8%` .}8N:.R$RE%N88N%N$K$R 188,FE$8%~Y88I
  15. * .E888888I .i8888888' .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
  16. * 8888888I .,N888888~ ~88i"8W,!N8*.I88.}888%F,i$88"F88" 888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
  17. * i888888N' I888Y ]88;/EX*IFKFK88X K8R .l8W 88Y ~88}'88E&%8W.X8N``]88!.$8K .:W8I
  18. * .i888888N; I8Y .&8$ .X88! i881.:%888>I88 ;88] +88+.';;;;:.Y88X 18N.,88l .+88/
  19. * .:R888888I
  20. * .&888888I Copyright (c) 2009-2020. 博锐尚格科技股份有限公司
  21. * ~8888'
  22. * .!88~ All rights reserved.
  23. *
  24. * ****/
  25. import { SBaseEditScene, SBasePipe, SBaseEquipment } from "./../big-edit";
  26. import { SGraphEdit, SGraphPropertyCommand, } from "./../edit";
  27. import { SMouseEvent } from "@persagy-web/base/lib";
  28. import { SGraphSelectContainer, SLineStyle } from "@persagy-web/graph";
  29. import { SItemStatus } from "@persagy-web/big/lib/enums/SItemStatus";
  30. import { rgbaNum } from "./../big-edit/until";
  31. // 引入命令
  32. import { SGraphAddCommand } from "./../edit/commands/SGraphAddCommand"
  33. import { SColor, SFont, SArrowStyleType } from '@persagy-web/draw/lib';
  34. /**
  35. * 拓扑图场景类
  36. *
  37. * @author 韩耀龙 <han_yao_long@163.com>
  38. */
  39. export class PTopoScene extends SBaseEditScene {
  40. /** 图例数据 */
  41. legendObj: any = null;
  42. constructor() {
  43. super()
  44. // 选择绑定选额item事件
  45. this.selectContainer.connect("listChange", this, this.listChange);
  46. }
  47. /**
  48. * 选中返回的选中 item 回调方法
  49. *
  50. * @param event 鼠标事件参数
  51. */
  52. listChange(list: any): void {
  53. const itemList: any = []
  54. list.itemList.forEach((item: any) => {
  55. if ((item instanceof SGraphEdit) && !(item instanceof SGraphSelectContainer)) {
  56. itemList.push(item)
  57. }
  58. })
  59. this.emitChoice(itemList);
  60. }
  61. /**
  62. * 选中返回的选中 item 回调方法(用于场景的外部调用)
  63. *
  64. * @param list 选中的 item 数组
  65. */
  66. emitChoice(list: any) {
  67. }
  68. /**
  69. * 鼠标左键按下
  70. *
  71. * @param event 鼠标事件参数
  72. */
  73. onMouseDown(event: SMouseEvent): any {
  74. this.vueOnMouseDown(event) //外部调用
  75. if (this.grabItem) {
  76. if (this.grabItem instanceof SBasePipe) {
  77. this.setTipeEndanchor(event)
  78. return true;
  79. }
  80. return this.grabItem.onMouseDown(event);
  81. }
  82. if (this.editCmd == "EditBaseLine") {
  83. this.addPolyLineArrow(event);
  84. this.clearCmdStatus();
  85. } else if (this.editCmd == "EditBasePolyLine") {
  86. this.addPolyLine(event);
  87. this.clearCmdStatus();
  88. } else if (this.editCmd == "EditBasetext") {
  89. this.addTextItem(event);
  90. this.clearCmdStatus();
  91. }
  92. else if (this.editCmd == "BaseExplain") {
  93. this.addExplainItem(event);
  94. this.clearCmdStatus();
  95. } else if (this.editCmd == "EditBaseImage") {
  96. this.addImageItem(event)
  97. this.clearCmdStatus();
  98. }
  99. else if (this.editCmd == "EditBasePolygon") {
  100. this.addPolygonItem(event);
  101. this.clearCmdStatus();
  102. } else if (this.editCmd == "EditBaseRect") {
  103. this.addRectItem(event)
  104. this.clearCmdStatus();
  105. } else if (this.editCmd == "EditBaseTriangle") {
  106. this.addTriangleItem(event)
  107. this.clearCmdStatus();
  108. } else if (this.editCmd == "EditBaseCircle") {
  109. this.addCircleItem(event)
  110. this.clearCmdStatus();
  111. }
  112. else if (this.editCmd == "EditBaseArrows") {
  113. this.addPolygonArrow(event)
  114. this.clearCmdStatus();
  115. }
  116. else if (this.editCmd == "wantou" || this.editCmd == "santong" || this.editCmd == "sitong") {
  117. this.addPipeUninTool(event, this.editCmd)
  118. this.clearCmdStatus();
  119. }
  120. else if (this.editCmd == "EditBasePipe") {
  121. this.addBasePipe(event, this.legendObj);
  122. this.clearCmdStatus();
  123. }
  124. else if (this.editCmd == "") {
  125. super.onMouseDown(event);
  126. }
  127. }
  128. /**
  129. * 鼠标右键事件
  130. *
  131. * @param event 鼠标事件参数
  132. * @returns 是否点击右键
  133. */
  134. onContextMenu(event: SMouseEvent): boolean {
  135. if (!super.onContextMenu(event)) {
  136. this.getItem(null, [event])
  137. }
  138. return true
  139. }
  140. /**
  141. * 修改 item 样式,数据等方法
  142. *
  143. * @param styletype string 修改样式类型
  144. * @param changeStyle 更改样式数据
  145. * @param itemList ? SGraphEdit[] 如果不传入默认使用选择器中选中得item
  146. */
  147. updateStyle(styletype: string, changestyle: any, itemList?: SGraphEdit[]): void {
  148. // 如果未传入需要修改样式的item,默认取选择器中的item
  149. let List = null;
  150. if (itemList && itemList.length) {
  151. List = itemList;
  152. } else {
  153. List = this.selectContainer.itemList;
  154. };
  155. let styleValue: any
  156. if (styletype == "strokeColor" || styletype == "backgroundColor" || styletype == "fillColor") {
  157. const colorlist = rgbaNum(changestyle)
  158. styleValue = new SColor(Number(colorlist[0]), Number(colorlist[1]), Number(colorlist[2]), colorlist[3] * 255);
  159. } else if (styletype == "lineStyle") {
  160. styleValue = SLineStyle[changestyle]
  161. } else if (styletype == "begin" || styletype == "end") {
  162. styleValue = SArrowStyleType[changestyle]
  163. } else if (styletype == "font") {
  164. styleValue = new SFont("sans-serif", changestyle)
  165. } else {
  166. styleValue = changestyle
  167. }
  168. List.forEach((item: SGraphEdit, index: number) => {
  169. if (item instanceof SGraphSelectContainer) {
  170. return
  171. }
  172. const oldMsg = item[styletype];
  173. const newMsg = styleValue;
  174. this.undoStack.push(new SGraphPropertyCommand(this, item, styletype, oldMsg, newMsg));
  175. item[styletype] = styleValue;
  176. })
  177. }
  178. /**
  179. * 修改指定设备得信息点
  180. *
  181. * @param obj Object 信息点
  182. */
  183. changeEquipMsgPoint(obj: any): void {
  184. const List = this.selectContainer.itemList.length ? this.selectContainer.itemList[0] : null;
  185. if (List && List instanceof SBaseEquipment) {
  186. List.setMsgPoint(obj);
  187. }
  188. }
  189. /**
  190. * item 创建完成后回调
  191. *
  192. * @param event 鼠标事件参数
  193. */
  194. finishCreated(item: SGraphEdit): void {
  195. this.grabItem = null;
  196. item.status = SItemStatus.Normal;
  197. this.undoStack.push(new SGraphAddCommand(this, item));
  198. this.selectContainer.clear();
  199. this.selectContainer.toggleItem(item);
  200. }
  201. /**
  202. * 修改 cmdstatus 函数;常在在业务中调用
  203. */
  204. clearCmdStatus() {
  205. //do something
  206. }
  207. /**
  208. * 获取item (常用与场景外的调用F)
  209. * @param event SMouseEvent 鼠标事件
  210. * @param item SGraphEdit|null 返回item
  211. *
  212. */
  213. getItem(item: SGraphEdit | null, event: SMouseEvent[]): void {
  214. // do something
  215. }
  216. /**
  217. * 获取item (常用与场景外的调用F)
  218. * @param event SMouseEvent 鼠标事件
  219. * @param item SGraphEdit|null 返回item
  220. *
  221. */
  222. vueOnMouseDown(event: SMouseEvent) {
  223. // do something
  224. }
  225. /**
  226. * 设置 item 状态
  227. */
  228. setItemStatus() {
  229. const List = this.selectContainer.itemList[0];
  230. if (List && List instanceof SGraphEdit) {
  231. if (List.status == SItemStatus.Normal) {
  232. List.status = SItemStatus.Edit;
  233. this.grabItem = List;
  234. } else {
  235. List.status = SItemStatus.Normal;
  236. this.grabItem = null
  237. }
  238. }
  239. }
  240. /**
  241. * 获取item (常用与场景外的调用F)
  242. *
  243. * @params isAll 是否为全部item数据
  244. * @return obj 返回保存的数据接口
  245. */
  246. save(isAll: boolean = true) {
  247. if (!this.view) return;
  248. const Marktype: string[] = ['BasePolygon', 'BaseLine', 'BaseText', 'BaseExplain', 'BaseImage', 'BaseCircle', 'BaseArrow', 'BaseTriangle', 'BaseRect', 'BaseArrowPolygon'];
  249. const NodeType: string[] = ['BaseEquipment'];
  250. const RelationType: string[] = ["BasePipe"];
  251. const markers: any = []; /**图例节点 */ // 与工程信息无关的标识对象(增加文本注释,图上的图片说明)
  252. const nodes: any = []; /**图例节点 */ // 与工程信息无关的标识对象(增加文本注释,图上的图片说明)
  253. const relations: any = []; /**图例节点 */ // 与工程信息无关的标识对象(增加文本注释,图上的图片说明)
  254. let nodeList;
  255. if (isAll) {
  256. nodeList = this.root.children;
  257. } else {
  258. nodeList = this.selectContainer.itemList;
  259. };
  260. nodeList.forEach(item => {
  261. if ((item instanceof SGraphEdit) && !(item instanceof SGraphSelectContainer)) {
  262. // 添加节点数据
  263. if (item.data && Marktype.includes(item.data.properties.type)) {
  264. markers.push(item.toData())
  265. }
  266. if (item.legendData && NodeType.includes(item.legendData.properties.type)) {
  267. nodes.push(item.toData())
  268. }
  269. if (item.relationData && RelationType.includes(item.relationData.properties.type)) {
  270. relations.push(item.toData())
  271. }
  272. }
  273. });
  274. return {
  275. markers,
  276. nodes,
  277. relations
  278. }
  279. }
  280. }