@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.
- package/bundles/@flexem/fc-gui.umd.js +20 -35
- package/bundles/@flexem/fc-gui.umd.js.map +1 -1
- package/bundles/@flexem/fc-gui.umd.min.js +1 -1
- package/bundles/@flexem/fc-gui.umd.min.js.map +1 -1
- package/elements/character-display/character-display-element.js +2 -2
- package/elements/historical-curve/historical-curve.element.js +12 -27
- package/elements/numerical-display/numerical-display-element.js +2 -2
- package/elements/switch-indicator-light/switch-indicator-light-element.js +2 -2
- package/elements/view-operation/view-operation.element.js +2 -2
- package/package.json +1 -1
|
@@ -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
|
-
|
|
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
|
-
//
|
|
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();
|