@flexem/fc-gui 3.0.0-alpha.14 → 3.0.0-alpha.141

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/CHANGELOG.md +433 -0
  2. package/assets/img/black_first_page.png +0 -0
  3. package/assets/img/black_last_page.png +0 -0
  4. package/assets/img/black_next_page.png +0 -0
  5. package/assets/img/black_previous_page.png +0 -0
  6. package/bundles/@flexem/fc-gui.umd.js +38635 -34598
  7. package/bundles/@flexem/fc-gui.umd.js.map +1 -1
  8. package/bundles/@flexem/fc-gui.umd.min.js +5 -5
  9. package/bundles/@flexem/fc-gui.umd.min.js.map +1 -1
  10. package/communication/variable/variable-communicator.d.ts +4 -0
  11. package/communication/variable/variable-value.d.ts +4 -1
  12. package/communication/variable/variable-value.js +4 -1
  13. package/communication/variable/variable-value.metadata.json +1 -1
  14. package/config/alarm/alarm.store.d.ts +6 -0
  15. package/config/alarm/alarm.store.js +0 -0
  16. package/config/alarm/alarm.store.metadata.json +1 -0
  17. package/config/alarm/get-alarms-args.d.ts +12 -0
  18. package/config/alarm/get-alarms-args.js +13 -0
  19. package/config/alarm/get-alarms-args.metadata.json +1 -0
  20. package/config/alarm/index.d.ts +2 -0
  21. package/config/alarm/index.js +1 -0
  22. package/config/alarm/index.metadata.json +1 -0
  23. package/config/config-store.d.ts +2 -0
  24. package/config/index.d.ts +1 -0
  25. package/config/index.js +1 -0
  26. package/config/index.metadata.json +1 -1
  27. package/elements/air-quality/air-quality-element.d.ts +31 -0
  28. package/elements/air-quality/air-quality-element.js +194 -0
  29. package/elements/air-quality/air-quality-element.metadata.json +1 -0
  30. package/elements/alarm/alarm-element.d.ts +69 -0
  31. package/elements/alarm/alarm-element.js +497 -0
  32. package/elements/alarm/alarm-element.metadata.json +1 -0
  33. package/elements/bar-graph-element.d.ts +10 -2
  34. package/elements/bar-graph-element.js +135 -5
  35. package/elements/bar-graph-element.metadata.json +1 -1
  36. package/elements/base/readable-element.d.ts +6 -1
  37. package/elements/base/readable-element.js +64 -2
  38. package/elements/base/readable-element.metadata.json +1 -1
  39. package/elements/base/state-control-element.d.ts +3 -1
  40. package/elements/base/state-control-element.js +3 -0
  41. package/elements/datetime-display/datetime-display-element.d.ts +1 -0
  42. package/elements/datetime-display/datetime-display-element.js +10 -2
  43. package/elements/datetime-display/datetime-display-element.metadata.json +1 -1
  44. package/elements/datetime-display/time-zone-select-json.d.ts +8 -0
  45. package/elements/datetime-display/time-zone-select-json.js +558 -0
  46. package/elements/historical-curve/historical-curve.element.d.ts +33 -3
  47. package/elements/historical-curve/historical-curve.element.js +368 -26
  48. package/elements/historical-curve/historical-curve.element.metadata.json +1 -1
  49. package/elements/main-element.d.ts +1 -0
  50. package/elements/main-element.js +59 -9
  51. package/elements/main-element.metadata.json +1 -1
  52. package/elements/meter-element.d.ts +7 -1
  53. package/elements/meter-element.js +76 -7
  54. package/elements/meter-element.metadata.json +1 -1
  55. package/elements/numerical-display/numerical-display-element.d.ts +16 -3
  56. package/elements/numerical-display/numerical-display-element.js +83 -11
  57. package/elements/numerical-display/numerical-display-element.metadata.json +1 -1
  58. package/elements/per-view-variable-communicator.d.ts +3 -0
  59. package/elements/per-view-variable-communicator.js +11 -0
  60. package/elements/per-view-variable-communicator.metadata.json +1 -1
  61. package/elements/ring-graph/ring-graph-element.d.ts +13 -1
  62. package/elements/ring-graph/ring-graph-element.js +164 -3
  63. package/elements/ring-graph/ring-graph-element.metadata.json +1 -1
  64. package/elements/scroll-alarm/scroll-alarm-element.d.ts +71 -0
  65. package/elements/scroll-alarm/scroll-alarm-element.js +799 -0
  66. package/elements/scroll-alarm/scroll-alarm-element.metadata.json +1 -0
  67. package/elements/shared/graph/graph-state-element.d.ts +1 -0
  68. package/elements/shared/graph/graph-state-element.js +30 -4
  69. package/elements/shared/graph/graph-state-element.metadata.json +1 -1
  70. package/elements/shared/text/text-element.d.ts +9 -0
  71. package/elements/shared/text/text-element.js +33 -2
  72. package/elements/shared/text/text-element.metadata.json +1 -1
  73. package/elements/shared/text/text-state-element.d.ts +27 -2
  74. package/elements/shared/text/text-state-element.js +161 -63
  75. package/elements/shared/text/text-state-element.metadata.json +1 -1
  76. package/elements/static-elements/hyperlink-element.d.ts +24 -2
  77. package/elements/static-elements/hyperlink-element.js +131 -3
  78. package/elements/static-elements/hyperlink-element.metadata.json +1 -1
  79. package/elements/static-elements/text-element.d.ts +24 -2
  80. package/elements/static-elements/text-element.js +127 -3
  81. package/elements/static-elements/text-element.metadata.json +1 -1
  82. package/elements/switch-indicator-light/switch-indicator-light-element.d.ts +11 -2
  83. package/elements/switch-indicator-light/switch-indicator-light-element.js +49 -10
  84. package/elements/switch-indicator-light/switch-indicator-light-element.metadata.json +1 -1
  85. package/elements/video/video-element.d.ts +4 -0
  86. package/elements/video/video-element.js +81 -21
  87. package/elements/video/video-element.metadata.json +1 -1
  88. package/elements/view-operation/view-operation.element.d.ts +23 -2
  89. package/elements/view-operation/view-operation.element.js +130 -1
  90. package/elements/view-operation/view-operation.element.metadata.json +1 -1
  91. package/elements/weather/weater-element.js +0 -1
  92. package/gui/gui-context.d.ts +12 -2
  93. package/gui/gui-host.d.ts +1 -1
  94. package/gui/gui-view.d.ts +2 -0
  95. package/gui/gui-view.js +38 -2
  96. package/gui/gui-view.metadata.json +1 -1
  97. package/gui/gui.component.d.ts +3 -0
  98. package/gui/gui.component.js +15 -2
  99. package/gui/gui.component.metadata.json +1 -1
  100. package/localization/localization.service.d.ts +7 -0
  101. package/localization/localization.service.js +10 -3
  102. package/localization/localization.service.metadata.json +1 -1
  103. package/localization/localization.service.zh_CN.js +8 -1
  104. package/localization/localization.service.zh_CN.metadata.json +1 -1
  105. package/modal/write-value/write-value-modal-args.d.ts +5 -1
  106. package/modal/write-value/write-value-modal-args.js +3 -1
  107. package/modal/write-value/write-value-modal-args.metadata.json +1 -1
  108. package/modal/write-value/write-value-modal.component.d.ts +12 -7
  109. package/modal/write-value/write-value-modal.component.html +9 -4
  110. package/modal/write-value/write-value-modal.component.js +73 -15
  111. package/modal/write-value/write-value-modal.component.metadata.json +1 -1
  112. package/model/air-quality/air-quality-info.d.ts +23 -0
  113. package/model/air-quality/air-quality-info.js +4 -0
  114. package/model/air-quality/air-quality-info.metadata.json +1 -0
  115. package/model/air-quality/air-quality.model.d.ts +7 -0
  116. package/model/air-quality/air-quality.model.js +0 -0
  117. package/model/air-quality/air-quality.model.metadata.json +1 -0
  118. package/model/alarm/alarm.model.d.ts +13 -0
  119. package/model/alarm/alarm.model.js +0 -0
  120. package/model/alarm/alarm.model.metadata.json +1 -0
  121. package/model/bar-graph/bar-graph.d.ts +4 -0
  122. package/model/base/font-setting-model.d.ts +12 -1
  123. package/model/base/font-setting-model.metadata.json +1 -1
  124. package/model/base/readable-model.d.ts +4 -0
  125. package/model/datetime-display/datetime-display.d.ts +1 -0
  126. package/model/historical-curve/historical-curve-axis-settings.d.ts +11 -0
  127. package/model/historical-curve/historical-curve-axis-settings.js +5 -0
  128. package/model/historical-curve/historical-curve-axis-settings.metadata.json +1 -1
  129. package/model/historical-curve/historical-curve-chanel.model.d.ts +8 -0
  130. package/model/meter/meter.d.ts +4 -0
  131. package/model/ring-graph/ring-graph.model.d.ts +8 -0
  132. package/model/scroll-alarm/scroll-alarm.model.d.ts +21 -0
  133. package/model/scroll-alarm/scroll-alarm.model.js +0 -0
  134. package/model/scroll-alarm/scroll-alarm.model.metadata.json +1 -0
  135. package/model/switch-indicator-light/switch-indicator-light.d.ts +2 -0
  136. package/model/view-operation/view-operation-element.model.d.ts +7 -1
  137. package/package.json +1 -1
  138. package/public_api.js +1 -0
  139. package/remote/communication/variable/remote-variable-communicator.d.ts +22 -0
  140. package/remote/communication/variable/remote-variable-communicator.js +122 -2
  141. package/remote/communication/variable/remote-variable-communicator.metadata.json +1 -1
  142. package/remote/communication/variable/remote-variable-protocol.d.ts +5 -0
  143. package/service/index.d.ts +4 -0
  144. package/service/index.js +1 -0
  145. package/service/index.metadata.json +1 -1
  146. package/service/language.service.d.ts +37 -0
  147. package/service/language.service.js +0 -0
  148. package/service/language.service.metadata.json +1 -0
  149. package/service/released-variable/index.d.ts +1 -0
  150. package/service/released-variable/index.js +0 -0
  151. package/service/released-variable/index.metadata.json +1 -0
  152. package/service/released-variable/released-variable.service.d.ts +4 -0
  153. package/service/released-variable/released-variable.service.js +0 -0
  154. package/service/released-variable/released-variable.service.metadata.json +1 -0
  155. package/service/system-text-library.service.d.ts +76 -0
  156. package/service/system-text-library.service.js +28 -0
  157. package/service/system-text-library.service.metadata.json +1 -0
  158. package/service/text-library.service.d.ts +49 -0
  159. package/service/text-library.service.js +0 -0
  160. package/service/text-library.service.metadata.json +1 -0
  161. package/service/weather.service.d.ts +1 -0
  162. package/shared/gui-consts.d.ts +3 -0
  163. package/shared/gui-consts.js +3 -0
  164. package/shared/gui-consts.metadata.json +1 -1
  165. package/utils/data-type/fbox-data-type.service.js +40 -0
@@ -0,0 +1 @@
1
+ [{"__symbolic":"module","version":4,"metadata":{"ScrollAlarmElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-dynamic-display-element","name":"ConditionalDynamicDisplayElement","line":17,"character":40},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":52,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":53,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":54,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":55,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":56,"character":23},{"__symbolic":"reference","module":"../../config","name":"AlarmsStore","line":57,"character":38},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"getAlarmData":[{"__symbolic":"method"}],"initDisplayContainer":[{"__symbolic":"method"}],"renderNewPage":[{"__symbolic":"method"}],"removeOldestPage":[{"__symbolic":"method"}],"scrollContent":[{"__symbolic":"method"}],"initScrolling":[{"__symbolic":"method"}],"pauseScroll":[{"__symbolic":"method"}],"resumeScroll":[{"__symbolic":"method"}],"resetToFirstPage":[{"__symbolic":"method"}],"updateQueryTimeRange":[{"__symbolic":"method"}],"setStatusAsNormal":[{"__symbolic":"method"}],"setStatusAsLoading":[{"__symbolic":"method"}],"renderStatus":[{"__symbolic":"method"}],"clearStatus":[{"__symbolic":"method"}],"renderStaticDisplay":[{"__symbolic":"method"}],"initStaticScrolling":[{"__symbolic":"method"}],"scrollStaticContent":[{"__symbolic":"method"}],"replaceCurrentScrollingContent":[{"__symbolic":"method"}]}}}}]
@@ -24,4 +24,5 @@ export declare class GraphStateElement {
24
24
  private removeImageElement;
25
25
  private doFaultFlicker;
26
26
  private clearFlickerInterval;
27
+ dispose(): void;
27
28
  }
@@ -42,12 +42,19 @@ export class GraphStateElement {
42
42
  }
43
43
  }
44
44
  changeGraph(stateId, graphResult) {
45
+ // 检查元素是否已被销毁
46
+ if (!this._element) {
47
+ return;
48
+ }
45
49
  if (!graphResult.failed) {
46
50
  const graph = graphResult.graph;
47
51
  switch (graph.graphType) {
48
52
  case GraphType.Image:
49
53
  case GraphType.SVG:
50
54
  const imageElement = this.getImageElement();
55
+ if (!imageElement) {
56
+ return;
57
+ }
51
58
  imageElement.setAttributeNS('http://www.w3.org/1999/xlink', 'href', graph.source);
52
59
  this.doFaultFlicker(imageElement, stateId);
53
60
  break;
@@ -62,10 +69,11 @@ export class GraphStateElement {
62
69
  }
63
70
  }
64
71
  getImageElement() {
65
- if (this.imageElement && /iPhone|iPod/i.test(navigator.userAgent)) {
66
- this.removeImageElement();
67
- }
68
72
  if (!this.imageElement) {
73
+ // 检查 _element 是否已被销毁
74
+ if (!this._element) {
75
+ return null;
76
+ }
69
77
  this.imageElement = document.createElementNS('http://www.w3.org/2000/svg', 'image');
70
78
  this.imageElement.setAttribute('width', this.width + '');
71
79
  this.imageElement.setAttribute('height', this.height + '');
@@ -77,7 +85,7 @@ export class GraphStateElement {
77
85
  return this.imageElement;
78
86
  }
79
87
  removeImageElement() {
80
- if (this.imageElement) {
88
+ if (this.imageElement && this._element) {
81
89
  this._element.removeChild(this.imageElement);
82
90
  delete this.imageElement;
83
91
  }
@@ -110,4 +118,22 @@ export class GraphStateElement {
110
118
  }
111
119
  }
112
120
  }
121
+ dispose() {
122
+ // 清理定时器
123
+ if (this.faultFlickerInterval) {
124
+ clearInterval(this.faultFlickerInterval);
125
+ this.faultFlickerInterval = undefined;
126
+ }
127
+ // 移除图片元素
128
+ this.removeImageElement();
129
+ // 清理图形缓存
130
+ if (this.graphs) {
131
+ this.graphs.clear();
132
+ }
133
+ // 清理 SVG 元素
134
+ if (this._element && this._element.parentNode) {
135
+ this._element.parentNode.removeChild(this._element);
136
+ }
137
+ this._element = null;
138
+ }
113
139
  }
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"GraphStateElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../../model","name":"GraphSetting","line":21,"character":47},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../../config","name":"GraphStore","line":24,"character":37},{"__symbolic":"reference","module":"../../../logger","name":"LoggerService","line":25,"character":33},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"../../../model/switch-indicator-light/indicator-light-fault-flicker","name":"IndicatorLightFaultFlicker","line":27,"character":41}]}]}],"switchToState":[{"__symbolic":"method"}],"changeGraph":[{"__symbolic":"method"}],"getImageElement":[{"__symbolic":"method"}],"removeImageElement":[{"__symbolic":"method"}],"doFaultFlicker":[{"__symbolic":"method"}],"clearFlickerInterval":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"GraphStateElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../../model","name":"GraphSetting","line":21,"character":47},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../../config","name":"GraphStore","line":24,"character":37},{"__symbolic":"reference","module":"../../../logger","name":"LoggerService","line":25,"character":33},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"../../../model/switch-indicator-light/indicator-light-fault-flicker","name":"IndicatorLightFaultFlicker","line":27,"character":41}]}]}],"switchToState":[{"__symbolic":"method"}],"changeGraph":[{"__symbolic":"method"}],"getImageElement":[{"__symbolic":"method"}],"removeImageElement":[{"__symbolic":"method"}],"doFaultFlicker":[{"__symbolic":"method"}],"clearFlickerInterval":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}]}}}}]
@@ -1,8 +1,17 @@
1
1
  import { Font } from '../../../model';
2
2
  export declare class TextElementModal {
3
3
  private _element;
4
+ private font;
5
+ private width;
6
+ private height;
7
+ private isVariableText?;
4
8
  get Element(): SVGElement;
5
9
  constructor(content: string, font: Font, width: number, height: number, isVariableText?: boolean);
10
+ /**
11
+ * 更新文本内容
12
+ * @param content 新的文本内容
13
+ */
14
+ updateText(content: string): void;
6
15
  private getforeignObjectElement;
7
16
  private createNewForeignObjectText;
8
17
  }
@@ -1,6 +1,11 @@
1
1
  import { isNil } from 'lodash';
2
2
  export class TextElementModal {
3
3
  constructor(content, font, width, height, isVariableText) {
4
+ // 保存参数以便后续更新文本
5
+ this.font = font;
6
+ this.width = width;
7
+ this.height = height;
8
+ this.isVariableText = isVariableText;
4
9
  if (/iPhone|iPod/i.test(navigator.userAgent)) {
5
10
  width += 10;
6
11
  }
@@ -12,6 +17,21 @@ export class TextElementModal {
12
17
  get Element() {
13
18
  return this._element;
14
19
  }
20
+ /**
21
+ * 更新文本内容
22
+ * @param content 新的文本内容
23
+ */
24
+ updateText(content) {
25
+ // 清空现有内容
26
+ this._element.innerHTML = '';
27
+ // 创建新的文本元素
28
+ let width = this.width;
29
+ if (/iPhone|iPod/i.test(navigator.userAgent)) {
30
+ width += 10;
31
+ }
32
+ const text = this.createNewForeignObjectText(content, this.font, width, this.height, this.isVariableText);
33
+ this._element.appendChild(text);
34
+ }
15
35
  getforeignObjectElement(width, height) {
16
36
  const textElement = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
17
37
  textElement.setAttribute('width', width.toString());
@@ -19,7 +39,7 @@ export class TextElementModal {
19
39
  return textElement;
20
40
  }
21
41
  createNewForeignObjectText(content, font, width, height, isVariableText) {
22
- if (font) {
42
+ if (font && !font.fontFamily.includes(',msyh')) {
23
43
  font.fontFamily += ',msyh';
24
44
  }
25
45
  const bodyDiv = document.createElement('div');
@@ -36,7 +56,7 @@ export class TextElementModal {
36
56
  for (let index = 0; index < textArray.length; index++) {
37
57
  const textDiv = document.createElement('div');
38
58
  textDiv.className = 'text-list';
39
- textDiv.innerHTML = textArray[index] ? textArray[index] : '&nbsp;';
59
+ const innerHTML = textArray[index] ? textArray[index] : '&nbsp;';
40
60
  let fontString = '';
41
61
  if (font.isItalic) {
42
62
  fontString += 'italic ';
@@ -45,12 +65,23 @@ export class TextElementModal {
45
65
  fontString += 'bold ';
46
66
  }
47
67
  let lineHeight = 0;
68
+ // chrome支持可显示最小字体大小为12px, 更小字体通过缩放实现
69
+ const minFontSize = 12;
48
70
  lineHeight = parseInt(font.fontSize, 10) + 5;
49
71
  fontString += font.fontSize + '/' + lineHeight.toString() + 'px ' + font.fontFamily;
50
72
  textDiv.style.cssText = `color: ${font.color};word-break: break-all;font: ${fontString};`;
51
73
  if (font.isUnderline) {
52
74
  textDiv.style.textDecoration = 'underline';
53
75
  }
76
+ const spanText = document.createElement('span');
77
+ spanText.style.cssText = `
78
+ display: contents;
79
+ transform: scale(${parseInt(font.fontSize, 10) > minFontSize ? 1 : parseInt(font.fontSize, 10) / minFontSize});
80
+ width: 100%;
81
+ height: 100%;
82
+ `;
83
+ spanText.innerHTML = innerHTML;
84
+ textDiv.appendChild(spanText);
54
85
  fragment.appendChild(textDiv);
55
86
  }
56
87
  bodyDiv.appendChild(fragment);
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"TextElementModal":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"../../../model","name":"Font","line":11,"character":39},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"boolean"}]}],"getforeignObjectElement":[{"__symbolic":"method"}],"createNewForeignObjectText":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"TextElementModal":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"../../../model","name":"Font","line":15,"character":39},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"boolean"}]}],"updateText":[{"__symbolic":"method"}],"getforeignObjectElement":[{"__symbolic":"method"}],"createNewForeignObjectText":[{"__symbolic":"method"}]}}}}]
@@ -1,6 +1,9 @@
1
1
  import { LoggerService } from '../../../logger';
2
+ import { TextLibrarySetting } from '../../../model/base/font-setting-model';
2
3
  import { IndicatorLightFaultFlicker } from '../../../model/switch-indicator-light/indicator-light-fault-flicker';
4
+ import { TextLibraryService, LanguageService } from '../../../service';
3
5
  import { TextState } from './text-state.model';
6
+ import { GuiContext } from '../../../gui/gui-context';
4
7
  export declare class TextStateElement {
5
8
  private readonly textStates;
6
9
  private width;
@@ -8,16 +11,38 @@ export declare class TextStateElement {
8
11
  private readonly logger;
9
12
  private readonly version?;
10
13
  private readonly faultFlickers?;
14
+ private readonly textLibrarySetting?;
15
+ private readonly textLibraryService?;
16
+ private readonly languageService?;
17
+ private readonly guiContext?;
18
+ private readonly allowEmpty;
11
19
  private textElement;
12
20
  private _element;
13
21
  get Element(): SVGElement;
14
22
  private faultFlickerStatus;
15
23
  private faultFlickerInterval;
16
- constructor(textStates: TextState[], width: number, height: number, logger: LoggerService, version?: number, faultFlickers?: IndicatorLightFaultFlicker[]);
24
+ private currentStateId;
25
+ private languageChangeSubscription?;
26
+ constructor(textStates: TextState[], width: number, height: number, logger: LoggerService, version?: number, faultFlickers?: IndicatorLightFaultFlicker[], textLibrarySetting?: TextLibrarySetting, textLibraryService?: TextLibraryService, languageService?: LanguageService, guiContext?: GuiContext, allowEmpty?: boolean);
17
27
  switchToState(stateId: number): void;
28
+ /**
29
+ * 订阅语种变化事件
30
+ * 当设备的语种ID改变时,重新渲染当前状态的文本
31
+ */
32
+ private subscribeLanguageChange;
33
+ /**
34
+ * 释放资源
35
+ */
36
+ dispose(): void;
18
37
  private getforeignObjectElement;
19
- private createNewForeignObjectText;
20
38
  private removeForeignObjectlement;
21
39
  private doFaultFlicker;
22
40
  private clearFlickerInterval;
41
+ /**
42
+ * 获取显示文本
43
+ * 如果配置了文本库,则根据状态ID和当前语种ID从文本库中获取对应语种的文本
44
+ * 如果是多语种自定义文本,则根据当前语种ID获取对应语种的文本
45
+ * 否则返回默认文本
46
+ */
47
+ private getDisplayText;
23
48
  }
@@ -1,29 +1,38 @@
1
1
  import { Flicker } from '../../../model';
2
- import { isNil } from 'lodash';
3
2
  export class TextStateElement {
4
- constructor(textStates, width, height, logger, version, faultFlickers) {
3
+ constructor(textStates, width, height, logger, version, faultFlickers, textLibrarySetting, textLibraryService, languageService, guiContext, allowEmpty = false) {
5
4
  this.textStates = textStates;
6
5
  this.width = width;
7
6
  this.height = height;
8
7
  this.logger = logger;
9
8
  this.version = version;
10
9
  this.faultFlickers = faultFlickers;
10
+ this.textLibrarySetting = textLibrarySetting;
11
+ this.textLibraryService = textLibraryService;
12
+ this.languageService = languageService;
13
+ this.guiContext = guiContext;
14
+ this.allowEmpty = allowEmpty;
11
15
  this.faultFlickerStatus = false;
12
16
  this.faultFlickerInterval = undefined;
13
17
  this._element = document.createElementNS('http://www.w3.org/2000/svg', 'g');
18
+ // 订阅语种变化事件
19
+ this.subscribeLanguageChange();
14
20
  }
15
21
  get Element() {
16
22
  return this._element;
17
23
  }
18
24
  switchToState(stateId) {
25
+ // 保存当前状态ID,用于语种切换时重新渲染
26
+ this.currentStateId = stateId;
19
27
  const textState = this.textStates.find(t => t.id === stateId);
20
28
  if (textState === undefined) {
21
29
  this.removeForeignObjectlement();
22
30
  this.logger.debug(`Can not find text state:${stateId}.`);
23
31
  return;
24
32
  }
25
- const content = textState.text.content;
26
- if (content === '') {
33
+ // 获取显示文本(支持文本库)
34
+ const content = this.getDisplayText(stateId, textState.text.content);
35
+ if (content === '' || content == null) {
27
36
  this.removeForeignObjectlement();
28
37
  return;
29
38
  }
@@ -33,71 +42,79 @@ export class TextStateElement {
33
42
  this.logger.debug('The font is undefined.');
34
43
  return;
35
44
  }
36
- const foreignObjectElement = this.getforeignObjectElement();
37
- foreignObjectElement.innerHTML = '';
38
- const text = this.createNewForeignObjectText(content, font);
39
- foreignObjectElement.appendChild(text);
40
- this.doFaultFlicker(foreignObjectElement, stateId);
45
+ const textElement = this.getforeignObjectElement();
46
+ // 清空旧内容
47
+ textElement.textContent = '';
48
+ // 设置 text-anchor 和 dominant-baseline
49
+ textElement.setAttribute('text-anchor', 'middle');
50
+ textElement.setAttribute('dominant-baseline', 'middle');
51
+ textElement.setAttribute('pointer-events', 'auto');
52
+ // 拆分换行
53
+ const lines = content.split('\n');
54
+ const fontSize = parseInt(font.fontSize, 10);
55
+ const lineHeight = fontSize + 4;
56
+ // 总高度 = 行数 * 行高
57
+ const totalHeight = lines.length * lineHeight;
58
+ // 调整文本整体垂直居中(通过 dy)
59
+ const startY = (this.height / 2) - (totalHeight / 2) + (lineHeight / 2);
60
+ // 添加每行文本
61
+ for (let i = 0; i < lines.length; i++) {
62
+ const tspan = document.createElementNS('http://www.w3.org/2000/svg', 'tspan');
63
+ tspan.setAttribute('x', (this.width / 2).toString());
64
+ tspan.setAttribute('y', startY + i * lineHeight + 'px');
65
+ tspan.textContent = lines[i].replace(/ /g, '\u00A0');
66
+ tspan.setAttribute('font-size', font.fontSize);
67
+ tspan.setAttribute('fill', font.color);
68
+ tspan.setAttribute('font-family', font.fontFamily);
69
+ tspan.setAttribute('font-weight', font.isBold ? 'bold' : 'normal');
70
+ tspan.setAttribute('font-style', font.isItalic ? 'italic' : 'normal');
71
+ tspan.setAttribute('text-decoration', font.isUnderline ? 'underline' : 'none');
72
+ tspan.setAttribute('text-anchor', 'middle');
73
+ tspan.setAttribute('dominant-baseline', 'middle');
74
+ textElement.appendChild(tspan);
75
+ }
76
+ this.doFaultFlicker(textElement, stateId);
41
77
  }
42
- getforeignObjectElement() {
43
- if (!this.textElement) {
44
- this.textElement = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
45
- this.textElement.setAttribute('width', this.width.toString());
46
- this.textElement.setAttribute('height', this.height.toString());
47
- this._element.appendChild(this.textElement);
78
+ /**
79
+ * 订阅语种变化事件
80
+ * 当设备的语种ID改变时,重新渲染当前状态的文本
81
+ */
82
+ subscribeLanguageChange() {
83
+ if (this.guiContext && this.guiContext.languageChanged$) {
84
+ this.languageChangeSubscription = this.guiContext.languageChanged$.subscribe(() => {
85
+ // 如果当前有状态,重新渲染
86
+ if (this.currentStateId !== undefined) {
87
+ this.switchToState(this.currentStateId);
88
+ }
89
+ });
48
90
  }
49
- return this.textElement;
50
91
  }
51
- createNewForeignObjectText(content, font) {
52
- if (font) {
53
- font.fontFamily += ',msyh';
92
+ /**
93
+ * 释放资源
94
+ */
95
+ dispose() {
96
+ // 取消语种变化订阅
97
+ if (this.languageChangeSubscription) {
98
+ this.languageChangeSubscription.unsubscribe();
99
+ this.languageChangeSubscription = undefined;
54
100
  }
55
- const bodyDiv = document.createElement('div');
56
- bodyDiv.style.textAlign = font.textAlign ? font.textAlign : 'center';
57
- bodyDiv.style.userSelect = 'none';
58
- bodyDiv.style.display = 'table-cell';
59
- bodyDiv.style.verticalAlign = 'middle';
60
- if (isNil(content)) {
61
- content = '';
101
+ // 清除闪烁定时器
102
+ if (this.faultFlickerInterval) {
103
+ clearInterval(this.faultFlickerInterval);
104
+ this.faultFlickerInterval = undefined;
62
105
  }
63
- let textArray = content.toString().split('\n');
64
- textArray = textArray.map(item => {
65
- return item.toString().replace(/\s/g, '&nbsp;');
66
- });
67
- const fragment = document.createDocumentFragment();
68
- for (let index = 0; index < textArray.length; index++) {
69
- const textDiv = document.createElement('div');
70
- textDiv.innerHTML = textArray[index] ? textArray[index] : '&nbsp;';
71
- let fontString = '';
72
- if (font.isItalic) {
73
- fontString += 'italic ';
74
- }
75
- if (font.isBold) {
76
- fontString += 'bold ';
77
- }
78
- textDiv.style.wordBreak = 'break-word';
79
- textDiv.style.color = font.color;
80
- let lineHeight = 0;
81
- lineHeight = parseInt(font.fontSize, 10) + 5;
82
- fontString += font.fontSize + 'px/' + lineHeight + 'px ' + font.fontFamily;
83
- textDiv.style.font = fontString;
84
- if (font.isUnderline) {
85
- textDiv.style.textDecoration = 'underline';
86
- }
87
- fragment.appendChild(textDiv);
106
+ }
107
+ getforeignObjectElement() {
108
+ if (!this.textElement) {
109
+ this.textElement = document.createElementNS('http://www.w3.org/2000/svg', 'text');
110
+ this.textElement.setAttribute('x', (this.width / 2).toString());
111
+ this.textElement.setAttribute('y', (this.height / 2).toString());
112
+ this.textElement.setAttribute('text-anchor', 'middle');
113
+ this.textElement.setAttribute('dominant-baseline', 'middle');
114
+ this.textElement.setAttribute('pointer-events', 'auto'); // 确保能接收事件
115
+ this._element.appendChild(this.textElement);
88
116
  }
89
- bodyDiv.appendChild(fragment);
90
- const contentDiv = document.createElement('div');
91
- contentDiv.style.display = 'table';
92
- contentDiv.style.width = '100%';
93
- contentDiv.style.height = '100%';
94
- contentDiv.appendChild(bodyDiv);
95
- const containerDiv = document.createElement('div');
96
- containerDiv.style.overflow = 'hidden';
97
- containerDiv.style.width = this.width.toString() + 'px';
98
- containerDiv.style.height = this.height.toString() + 'px';
99
- containerDiv.appendChild(contentDiv);
100
- return containerDiv;
117
+ return this.textElement;
101
118
  }
102
119
  removeForeignObjectlement() {
103
120
  if (this.textElement) {
@@ -133,4 +150,85 @@ export class TextStateElement {
133
150
  }
134
151
  }
135
152
  }
153
+ /**
154
+ * 获取显示文本
155
+ * 如果配置了文本库,则根据状态ID和当前语种ID从文本库中获取对应语种的文本
156
+ * 如果是多语种自定义文本,则根据当前语种ID获取对应语种的文本
157
+ * 否则返回默认文本
158
+ */
159
+ getDisplayText(stateId, defaultContent) {
160
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
161
+ // 如果 defaultContent 是多语种对象,优先使用(覆盖文本库)
162
+ if (defaultContent && typeof defaultContent === 'object' && defaultContent.cultures) {
163
+ const currentLanguageId = (_c = (_b = (_a = this.guiContext) === null || _a === void 0 ? void 0 : _a.getCurrentLanguageId) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : null;
164
+ const defaultLanguage = ((_d = this.languageService) === null || _d === void 0 ? void 0 : _d.getDefaultLanguage()) || 'zh-CN';
165
+ let targetLanguage;
166
+ if (currentLanguageId === null || currentLanguageId === undefined) {
167
+ targetLanguage = defaultLanguage;
168
+ }
169
+ else {
170
+ const currentLanguage = (_f = (_e = this.guiContext) === null || _e === void 0 ? void 0 : _e.getLanguageCultureById) === null || _f === void 0 ? void 0 : _f.call(_e, currentLanguageId);
171
+ targetLanguage = currentLanguage || defaultLanguage;
172
+ }
173
+ if (defaultContent.cultures[targetLanguage]) {
174
+ return defaultContent.cultures[targetLanguage];
175
+ }
176
+ else if (this.allowEmpty) {
177
+ return '';
178
+ }
179
+ else {
180
+ const language = ((_j = (_h = (_g = window.abp) === null || _g === void 0 ? void 0 : _g.localization) === null || _h === void 0 ? void 0 : _h.currentLanguage) === null || _j === void 0 ? void 0 : _j.name) || 'zh-Hans';
181
+ const isChinese = language === 'zh-Hans' || language === 'zh';
182
+ return isChinese ? '文本' : 'Text';
183
+ }
184
+ }
185
+ // 检查是否使用文本库
186
+ if (this.textLibrarySetting && this.textLibrarySetting.labelType === 'textLibrary') {
187
+ const textLibraryId = this.textLibrarySetting.selectedTextLibraryItem;
188
+ if (textLibraryId && this.textLibraryService) {
189
+ // 获取文本库数据
190
+ const textLibraryData = this.textLibraryService.getTextLibraryById(typeof textLibraryId === 'string' ? parseInt(textLibraryId, 10) : textLibraryId);
191
+ if (textLibraryData && textLibraryData.data) {
192
+ // 使用状态ID作为value查找对应的文本条目
193
+ const textEntry = textLibraryData.data.find(entry => entry.value === stateId.toString());
194
+ if (textEntry) {
195
+ // 获取当前语种ID
196
+ const currentLanguageId = (_m = (_l = (_k = this.guiContext) === null || _k === void 0 ? void 0 : _k.getCurrentLanguageId) === null || _l === void 0 ? void 0 : _l.call(_k)) !== null && _m !== void 0 ? _m : null;
197
+ // 确定要使用的语种代码(culture)
198
+ let targetLanguage;
199
+ const defaultLanguage = ((_o = this.languageService) === null || _o === void 0 ? void 0 : _o.getDefaultLanguage()) || 'zh-CN';
200
+ if (currentLanguageId === null || currentLanguageId === undefined) {
201
+ // 设备未设置当前语种,使用默认语种
202
+ targetLanguage = defaultLanguage;
203
+ }
204
+ else {
205
+ // 设备已设置当前语种,获取对应的语种代码
206
+ const currentLanguage = (_q = (_p = this.guiContext) === null || _p === void 0 ? void 0 : _p.getLanguageCultureById) === null || _q === void 0 ? void 0 : _q.call(_p, currentLanguageId);
207
+ if (currentLanguage) {
208
+ // 直接使用设备设置的语种,不再fallback
209
+ targetLanguage = currentLanguage;
210
+ }
211
+ else {
212
+ targetLanguage = defaultLanguage;
213
+ }
214
+ }
215
+ // 返回对应语种的文本,如果没有则返回空字符串
216
+ if (textEntry.cultures && textEntry.cultures[targetLanguage]) {
217
+ const text = textEntry.cultures[targetLanguage];
218
+ return text;
219
+ }
220
+ else {
221
+ // 对应语种没有文本,返回空字符串
222
+ return '';
223
+ }
224
+ }
225
+ }
226
+ }
227
+ }
228
+ // 处理字符串格式的 defaultContent
229
+ if (typeof defaultContent === 'string') {
230
+ return defaultContent;
231
+ }
232
+ return '';
233
+ }
136
234
  }
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"TextStateElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"./text-state.model","name":"TextState","line":18,"character":45}]},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../../logger","name":"LoggerService","line":21,"character":33},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"../../../model/switch-indicator-light/indicator-light-fault-flicker","name":"IndicatorLightFaultFlicker","line":23,"character":41}]}]}],"switchToState":[{"__symbolic":"method"}],"getforeignObjectElement":[{"__symbolic":"method"}],"createNewForeignObjectText":[{"__symbolic":"method"}],"removeForeignObjectlement":[{"__symbolic":"method"}],"doFaultFlicker":[{"__symbolic":"method"}],"clearFlickerInterval":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"TextStateElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"./text-state.model","name":"TextState","line":23,"character":45}]},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../../logger","name":"LoggerService","line":26,"character":33},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","module":"../../../model/switch-indicator-light/indicator-light-fault-flicker","name":"IndicatorLightFaultFlicker","line":28,"character":41}]},{"__symbolic":"reference","module":"../../../model/base/font-setting-model","name":"TextLibrarySetting","line":29,"character":46},{"__symbolic":"reference","module":"../../../service","name":"TextLibraryService","line":30,"character":46},{"__symbolic":"reference","module":"../../../service","name":"LanguageService","line":31,"character":43},{"__symbolic":"reference","module":"../../../gui/gui-context","name":"GuiContext","line":32,"character":38},{"__symbolic":"reference","name":"boolean"}]}],"switchToState":[{"__symbolic":"method"}],"subscribeLanguageChange":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}],"getforeignObjectElement":[{"__symbolic":"method"}],"removeForeignObjectlement":[{"__symbolic":"method"}],"doFaultFlicker":[{"__symbolic":"method"}],"clearFlickerInterval":[{"__symbolic":"method"}],"getDisplayText":[{"__symbolic":"method"}]}}}}]
@@ -1,14 +1,36 @@
1
- import { PermissionChecker } from '../../service';
1
+ import { PermissionChecker, TextLibraryService, LanguageService } from '../../service';
2
2
  import { VariableCommunicator } from '../../communication';
3
3
  import { ConditionalDynamicDisplayElement } from '../base/conditional-dynamic-display-element';
4
4
  import { GraphStore, VariableStore } from '../../config';
5
5
  import { LoggerService } from '../../logger';
6
6
  import { Injector } from '@angular/core';
7
7
  import { HyperlinkModel } from '../../model/hyperlink/hyperlink.model';
8
+ import { GuiContext } from '../../gui/gui-context';
8
9
  export declare class HyperlinkElement extends ConditionalDynamicDisplayElement {
9
10
  private readonly graphStore;
11
+ private readonly textLibraryService?;
12
+ private readonly languageService?;
13
+ private readonly guiContext?;
10
14
  protected readonly model: HyperlinkModel;
11
15
  protected readonly logger: LoggerService;
12
- constructor(element: HTMLElement, injector: Injector, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, variableStore: VariableStore, graphStore: GraphStore, signalRAppId: string);
16
+ private languageChangeSubscription?;
17
+ private textElementModal?;
18
+ constructor(element: HTMLElement, injector: Injector, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, variableStore: VariableStore, graphStore: GraphStore, signalRAppId: string, textLibraryService?: TextLibraryService, languageService?: LanguageService, guiContext?: GuiContext);
19
+ dispose(): void;
20
+ /**
21
+ * 订阅语种变化事件
22
+ * 当设备的语种ID改变时,重新渲染文本
23
+ */
24
+ private subscribeLanguageChange;
25
+ /**
26
+ * 重新渲染文本
27
+ */
28
+ private reRenderText;
13
29
  private initGraphAndText;
30
+ /**
31
+ * 获取显示文本
32
+ * 如果配置了文本库,则从文本库中获取对应语种的文本
33
+ * 否则返回默认文本
34
+ */
35
+ private getDisplayText;
14
36
  }