@flexem/fc-gui 3.0.0-alpha.184 → 3.0.0-alpha.187

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.
@@ -222,7 +222,7 @@ export class CharacterDisplayElement extends ReadableElement {
222
222
  }
223
223
  if (!this.isEnable) {
224
224
  const message = !this.isGrantedPermission ? this.localization.permissiontip : this.localization.conditionIsNotMetTip;
225
- const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position', animated: false });
225
+ const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false });
226
226
  const onClosedSub = modalRef.content.onClosed.subscribe(() => {
227
227
  modalRef.hide();
228
228
  onClosedSub.unsubscribe();
@@ -231,7 +231,7 @@ export class CharacterDisplayElement extends ReadableElement {
231
231
  }
232
232
  if (this.model.useSecurity) {
233
233
  const modalRef = this.modalService.show(ConfirmOperationModalComponent, {
234
- backdrop: 'static', class: 'gui-modal-dialog-position', animated: false
234
+ backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false
235
235
  });
236
236
  const onClosedSub = modalRef.content.onClosed.subscribe(result => {
237
237
  modalRef.hide();
@@ -164,19 +164,6 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
164
164
  item.textContent = updatedTimePeriods[i].name;
165
165
  }
166
166
  });
167
- // 文字更新后重新测量宽度,修正首次加载时文字为空导致宽度过小的问题
168
- const prevDisplay = this.dropdownListEl.style.display;
169
- const prevVisibility = this.dropdownListEl.style.visibility;
170
- this.dropdownListEl.style.display = 'block';
171
- this.dropdownListEl.style.visibility = 'hidden';
172
- this.dropdownListEl.style.width = '';
173
- const newWidth = this.dropdownListEl.offsetWidth;
174
- this.dropdownListEl.style.display = prevDisplay;
175
- this.dropdownListEl.style.visibility = prevVisibility;
176
- this.dropdownListEl.style.width = newWidth + 'px';
177
- if (this.dropdownTriggerEl) {
178
- this.dropdownTriggerEl.style.width = newWidth + 'px';
179
- }
180
167
  }
181
168
  // 更新触发按钮文字(显示当前选中项的最新语言文案)
182
169
  if (this.dropdownTriggerEl) {
@@ -671,9 +658,7 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
671
658
  .style('padding', '4px 8px')
672
659
  .style('cursor', 'pointer')
673
660
  .style('white-space', 'nowrap')
674
- .style('font-size', (parseFloat(this.displayOption.operationSelectFontSize) * scale) + 'px')
675
- .style('line-height', (this.displayOption.operationAreaHeight * scale - 8) + 'px')
676
- .style('min-height', (this.displayOption.operationAreaHeight * scale - 8) + 'px')
661
+ // 字号/行高在打开时动态根据 trigger 的视口实际尺寸设置,见 dropdownTrigger.on('click') 处理
677
662
  .style('background', tp.key === Number(this.currentTimePeriod) ? '#1890ff' : 'transparent')
678
663
  .style('color', tp.key === Number(this.currentTimePeriod) ? '#fff' : '#333')
679
664
  .text(tp.name)
@@ -715,15 +700,6 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
715
700
  this.reRenderElement(this.startTime, this.endTime, this.displayOption.dataLimit, HistoricalCurveTimeRange.BeginOpenEndOpen);
716
701
  });
717
702
  });
718
- // 测量下拉列表最大宽度,让 trigger 和列表宽度一致
719
- dropdownListEl.style.display = 'block';
720
- dropdownListEl.style.visibility = 'hidden';
721
- const listContentWidth = dropdownListEl.offsetWidth;
722
- dropdownListEl.style.display = 'none';
723
- dropdownListEl.style.visibility = '';
724
- dropdownListEl.style.width = listContentWidth + 'px';
725
- dropdownTrigger.node().style.width = listContentWidth + 'px';
726
- dropdownTrigger.node().style.boxSizing = 'border-box';
727
703
  const hideDropdown = () => { dropdownListEl.style.display = 'none'; };
728
704
  dropdownTrigger.on('click', () => {
729
705
  const isVisible = dropdownListEl.style.display !== 'none';
@@ -733,10 +709,19 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
733
709
  else {
734
710
  const triggerNode = dropdownTrigger.node();
735
711
  const triggerRect = triggerNode.getBoundingClientRect();
736
- // 设置宽度至少和 trigger 一样宽
712
+ // trigger 在视口中的实际高度(已经过画布 transform 缩放),用于对齐下拉项尺寸。
713
+ // 不能在渲染时写死设计像素,因为下拉挂在 body 上不受画布 transform 影响。
714
+ const itemHeight = triggerRect.height;
715
+ // 字号取行高的 60%,保证文字在行内垂直居中且不溢出
716
+ const itemFontSize = Math.round(itemHeight * 0.6);
717
+ dropdownList.selectAll('.hc-dropdown-item')
718
+ .style('font-size', itemFontSize + 'px')
719
+ .style('line-height', itemHeight + 'px')
720
+ .style('min-height', itemHeight + 'px');
721
+ // 设置宽度至少和 trigger 一样宽,先展示再测宽度
722
+ dropdownListEl.style.display = 'block';
737
723
  dropdownListEl.style.minWidth = triggerRect.width + 'px';
738
724
  dropdownListEl.style.left = triggerRect.left + 'px';
739
- dropdownListEl.style.display = 'block';
740
725
  const listHeight = dropdownListEl.offsetHeight;
741
726
  const spaceBelow = window.innerHeight - triggerRect.bottom;
742
727
  if (spaceBelow < listHeight) {
@@ -138,7 +138,7 @@ export class NumericalDisplayElement extends ReadableElement {
138
138
  }
139
139
  if (!this.isEnable) {
140
140
  const message = !this.isGrantedPermission ? this.localization.permissiontip : this.localization.conditionIsNotMetTip;
141
- const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position', animated: false });
141
+ const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false });
142
142
  const onClosedSub = modalRef.content.onClosed.subscribe(() => {
143
143
  modalRef.hide();
144
144
  onClosedSub.unsubscribe();
@@ -147,7 +147,7 @@ export class NumericalDisplayElement extends ReadableElement {
147
147
  }
148
148
  if (this.model.useSecurity) {
149
149
  const modalRef = this.modalService.show(ConfirmOperationModalComponent, {
150
- backdrop: 'static', class: 'gui-modal-dialog-position', animated: false
150
+ backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false
151
151
  });
152
152
  const onClosedSub = modalRef.content.onClosed.subscribe(result => {
153
153
  modalRef.hide();
@@ -42,7 +42,7 @@ export class SwitchIndicatorLightElement extends ConditionalEnableElement {
42
42
  }
43
43
  if (!this.isEnable) {
44
44
  const message = !this.isGrantedPermission ? this.localization.permissiontip : this.localization.conditionIsNotMetTip;
45
- const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position', animated: false });
45
+ const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false });
46
46
  const onClosedSub = modalRef.content.onClosed.subscribe(() => {
47
47
  modalRef.hide();
48
48
  onClosedSub.unsubscribe();
@@ -52,7 +52,7 @@ export class SwitchIndicatorLightElement extends ConditionalEnableElement {
52
52
  if (this.switchOperator.canExecute()) {
53
53
  if (!this.isBitRestoration || !this.isVerifiedForRestoration) {
54
54
  if (this.model.useSecurity) {
55
- const modalRef = this.modalService.show(ConfirmOperationModalComponent, { backdrop: 'static', class: 'gui-modal-dialog-position', animated: false });
55
+ const modalRef = this.modalService.show(ConfirmOperationModalComponent, { backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false });
56
56
  const onClosedSub = modalRef.content.onClosed.subscribe(result => {
57
57
  modalRef.hide();
58
58
  onClosedSub.unsubscribe();
@@ -49,7 +49,7 @@ export class ViewOperationElement extends ConditionalEnableElement {
49
49
  d3.event.preventDefault();
50
50
  if (!this.isEnable) {
51
51
  const message = !this.isGrantedPermission ? this.localization.permissiontip : this.localization.conditionIsNotMetTip;
52
- const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position', animated: false });
52
+ const modalRef = this.modalService.show(AlertModalComponent, { initialState: { alermMessage: message }, backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false });
53
53
  const onClosedSub = modalRef.content.onClosed.subscribe(() => {
54
54
  modalRef.hide();
55
55
  onClosedSub.unsubscribe();
@@ -65,7 +65,7 @@ export class ViewOperationElement extends ConditionalEnableElement {
65
65
  }
66
66
  if (this.model.useSecurity) {
67
67
  const modalRef = this.modalService.show(ConfirmOperationModalComponent, {
68
- backdrop: 'static', class: 'gui-modal-dialog-position', animated: false
68
+ backdrop: 'static', class: 'gui-modal-dialog-position gui-modal-dialog-tip', animated: false
69
69
  });
70
70
  const onClosedSub = modalRef.content.onClosed.subscribe(result => {
71
71
  modalRef.hide();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "main": "bundles/fc-gui.umd.js",
3
- "version": "3.0.0-alpha.184",
3
+ "version": "3.0.0-alpha.187",
4
4
  "module": "public_api.js",
5
5
  "typings": "public_api.d.ts",
6
6
  "license": "UNLICENSED",