SBaseEquipment.ts 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258
  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) 2016-2020. 博锐尚格科技股份有限公司
  21. * ~8888'
  22. * .!88~ All rights reserved.
  23. *
  24. * *********************************************************************************************************************
  25. */
  26. import { SGraphItem, SAnchorItem } from "@persagy-web/graph/lib";
  27. import { Legend } from "./../types/Legend";
  28. import { SBaseIconTextEdit, SBaseTextEdit } from "@persagy-web/edit";
  29. import { SColor } from '@persagy-web/draw/lib';
  30. import { svgTobase64, uuid } from "./../until"
  31. /**
  32. * 编辑基础设备类
  33. *
  34. * @author 韩耀龙 <han_yao_long@163.com>
  35. */
  36. export class SBaseEquipment extends SBaseIconTextEdit {
  37. /** 图例节点 id */
  38. nodeId: string | null = null;
  39. /** 设备图例 */
  40. _legendData: Legend | null = null;
  41. set legendData(val) {
  42. this._legendData = val;
  43. this.initData()
  44. } // set legendData()
  45. get legendData(): Legend | null {
  46. return this._legendData
  47. } // get legendData()
  48. /** 信息点存储 */
  49. _infoPointList: any[] = []
  50. set infoPointList(val) {
  51. this._infoPointList = val;
  52. } // set infoPointList()
  53. get infoPointList(): any[] {
  54. return this._infoPointList
  55. } // get infoPointList()
  56. /** 图得url */
  57. _url: string = '';
  58. set url(val) {
  59. this._url = val;
  60. this.initUrl()
  61. } // set infoPointList()
  62. get url(): string {
  63. return this._url
  64. } // get infoPointList()
  65. // 设备附加数据
  66. anotherMsg: string = ''
  67. /**
  68. * 构造函数
  69. *
  70. * @param parent 指向父对象
  71. * @param data 数据
  72. */
  73. constructor(parent: SGraphItem | null, data: Legend) {
  74. super(parent);
  75. this.legendData = data;
  76. } // Constructor
  77. /**
  78. * 设置 legendData 时对 item 做设置
  79. */
  80. initData() {
  81. if (!this.legendData) return;
  82. this.nodeId = this.legendData?.nodeId
  83. if (this.legendData.size) {
  84. this.sWidth = this.legendData.size.width;
  85. this.sHeight = this.legendData.size.height;
  86. }
  87. this.img.connect("onMove", this, this.changeAnchorPoint.bind(this));
  88. if (this.legendData.anchorList && this.legendData.anchorList.length) {
  89. this.anchorList = this.legendData.anchorList.map(t => {
  90. let item = new SAnchorItem(this);
  91. if (t.anchorId) {
  92. item.id = t.anchorId;
  93. }
  94. item.moveTo(t.pos.x, t.pos.y);
  95. return item;
  96. });
  97. } else {
  98. const anchorPoint = [
  99. { x: this.img.x, y: this.img.y, anchorId: uuid() },
  100. ];
  101. this.anchorList = anchorPoint.map(t => {
  102. let item = new SAnchorItem(this);
  103. if (t.anchorId) {
  104. item.id = t.anchorId;
  105. }
  106. item.moveTo(t.x, t.y);
  107. return item;
  108. });
  109. }
  110. // 存储信息点
  111. if (this.legendData.properties && this.legendData.properties.infoPointList) {
  112. const infoPointList = this.legendData.properties.infoPointList;
  113. if (infoPointList.length) {
  114. this.infoPointList = infoPointList;
  115. this.infoPointList.forEach((obj, i) => {
  116. this.setTextItem(obj, i)
  117. })
  118. } else {
  119. this.infoPointList = []
  120. }
  121. } else {
  122. this.infoPointList = []
  123. }
  124. this.showAnchor = false;
  125. this.url = this.legendData.style.default.base64Url ? this.legendData.style.default.base64Url : this.legendData.style.default.url
  126. this.anotherMsg = this.legendData.properties.anotherMsg ? this.legendData.properties.anotherMsg : '';
  127. this.x = this.legendData.pos.x;
  128. this.y = this.legendData.pos.y;
  129. this.moveable = true;
  130. this.selectable = true;
  131. }
  132. initUrl() {
  133. svgTobase64(this.url).then((res) => {
  134. this.img.url = res ? res : '';
  135. }).catch((res) => {
  136. this.img.url = res;
  137. })
  138. }
  139. /**
  140. * 设置信息点
  141. *
  142. * @params obj 设置的信息点
  143. */
  144. setMsgPoint(val: any) {
  145. // 根据是否勾选来判断是够增加或删除
  146. if (val.checked) {
  147. this._infoPointList.push(val);
  148. this.setTextItem(val, (this._infoPointList.length - 1))
  149. } else {
  150. let deleteItemIndex: number = -1;
  151. this._infoPointList.forEach((item, index) => {
  152. if (val.id == item.id) {
  153. deleteItemIndex = index;
  154. }
  155. });
  156. this._infoPointList.splice(deleteItemIndex, 1);
  157. this.setTextItem(val, deleteItemIndex)
  158. }
  159. }
  160. /**
  161. * 根据选中状态增加 textItem
  162. *
  163. * @params obj textItem 文本信息
  164. * @params index 文本索引
  165. */
  166. setTextItem(val: any, index: number): void {
  167. if (val.checked) {
  168. let item = new SBaseTextEdit(this, null);
  169. item.propertyData = val;
  170. item.text = val.name;
  171. if (val.pos) {
  172. item.moveTo(val.pos.x, val.pos.y)
  173. } else {
  174. item.moveTo(
  175. this.img.width * 0.5,
  176. -(this.font.size * 1.25 * 0.5) + (index) * 10
  177. );
  178. }
  179. item.font.size = val.font ? val.font : 12;
  180. item.isTransform = false;
  181. item.showSelect = false;
  182. item.color = val.color ? new SColor(val.color) : new SColor('#000000');
  183. item.connect('textSelect', this, this.textSelectChange)
  184. this.textItemList.push(item)
  185. } else {
  186. this.textItemList.splice(index, 1)
  187. this.scene?.removeItem(this.textItemList[index]);
  188. }
  189. }
  190. /**
  191. * 返回对象储存的相关数据
  192. *
  193. * @return 对象储存的相关数据
  194. */
  195. toData(): any {
  196. if (this.legendData) {
  197. const list = this.anchorList.map((item) => {
  198. return {
  199. anchorId: item.id,
  200. pos: {
  201. x: item.x,
  202. y: item.y
  203. }
  204. }
  205. })
  206. this.legendData.anchorList = list;
  207. // 反馈大小
  208. if (this.legendData.size) {
  209. this.legendData.size.width = this.sWidth;
  210. this.legendData.size.height = this.sHeight
  211. } else {
  212. this.legendData.size = {
  213. width: this.sWidth,
  214. height: this.sHeight
  215. }
  216. }
  217. // 位置
  218. this.legendData.pos = {
  219. x: this.x,
  220. y: this.y
  221. };
  222. // 存储信息点
  223. const infoPoinList: any[] = []
  224. this.textItemList.forEach(item => {
  225. let obj = Object.assign(item.propertyData, {
  226. pos: { x: item.x, y: item.y },
  227. font: item.font.size,
  228. color: item.color.value
  229. })
  230. delete obj.currentEquipMsg
  231. infoPoinList.push(obj)
  232. });
  233. this.legendData.properties.infoPointList = infoPoinList;
  234. this.legendData.properties.anotherMsg = this.anotherMsg;
  235. this.legendData.style.default.base64Url = "";
  236. this.legendData.style.default.url = this.url;
  237. return this.legendData
  238. }
  239. }
  240. }