@flexem/fc-gui 3.0.0-alpha.123 → 3.0.0-alpha.125

package/elements/historical-curve/historical-curve.element.js

@@ -5,6 +5,7 @@ import * as nv from 'nvd3';
 import { GetHistoryDataArgs } from '../../config';
 import { HistoricalCurveTimeRange } from '../../config/history-data/historical-curve.time-range';
 import { LOCALIZATION } from '../../localization';
+import { SYSTEM_TEXT_LIBRARY_TYPES, TIME_PERIOD_KEYS } from '../../service';
 import { ConditionalDisplayElement } from '../base/conditional-display-element';
 import { HistoricalCurveElementStatus } from './historical-curve-element-status';
 import { LOGGER_SERVICE_TOKEN } from '../../logger';
@@ -12,9 +13,12 @@ import { GlobalSettings, DisplayMode } from '../../settings';
 import { CurveType } from '../../model/historical-curve/curve-type';
 import { AxisRangeType } from '../../model/historical-curve/historical-curve-axis-settings';
 export class HistoricalCurveElement extends ConditionalDisplayElement {
-    constructor(element, injector, permissionChecker, variableCommunicator, variableStore, historyDataStore, signalRAppId) {
+    constructor(element, injector, permissionChecker, variableCommunicator, variableStore, historyDataStore, signalRAppId, systemTextLibraryService, languageService, guiContext) {
         super(element, permissionChecker, variableCommunicator, variableStore, signalRAppId);
         this.historyDataStore = historyDataStore;
+        this.systemTextLibraryService = systemTextLibraryService;
+        this.languageService = languageService;
+        this.guiContext = guiContext;
         this.displayOption = {
             dataLimit: 500,
             dataZoomHeight: 32,
@@ -56,6 +60,8 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
         }
         this.loadFirstPage();
         this.initKeyboardListener();
+        // 订阅语种变化事件
+        this.subscribeLanguageChange();
     }
     dispose() {
         clearInterval(this.refreshIntervalId);
@@ -69,6 +75,11 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
             window.removeEventListener('native.keyboardshow', this.setNeedResize);
             window.removeEventListener('native.keyboardhide', this.setNeedResize);
         }
+        // 取消语种变化订阅
+        if (this.languageChangeSubscription) {
+            this.languageChangeSubscription.unsubscribe();
+            this.languageChangeSubscription = undefined;
+        }
         this.logger.debug(`[GUI]Dispose Histoical Curve Refresh Interval:${d3.time.format('%x %X')(new Date())}`);
     }
     initKeyboardListener() {
@@ -78,17 +89,84 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
             window.addEventListener('native.keyboardhide', this.setNeedResize);
         }
     }
+    /**
+     * 订阅语种变化事件
+     */
+    subscribeLanguageChange() {
+        if (this.guiContext && this.guiContext.languageChanged$) {
+            this.languageChangeSubscription = this.guiContext.languageChanged$.subscribe(() => {
+                // 只更新时间段选择器的文案，不重新查询数据
+                this.updateLanguageTexts();
+            });
+        }
+    }
+    /**
+     * 更新语种相关的文案（时间段选择器）
+     */
+    updateLanguageTexts() {
+        const selectElement = this.rootElement.select('select');
+        if (!selectElement.empty()) {
+            // 重新生成时间段数据
+            const updatedTimePeriods = this.getValidTimePeriods();
+            // 更新选项文本
+            const options = selectElement.selectAll('option');
+            options.each(function (_d, i) {
+                if (i < updatedTimePeriods.length) {
+                    d3.select(this).text(updatedTimePeriods[i].name);
+                }
+            });
+        }
+    }
+    /**
+     * 获取当前语种的 culture 代码
+     */
+    getCurrentCulture() {
+        var _a, _b, _c, _e, _f, _g;
+        // 获取当前语种ID
+        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;
+        // 确定要使用的语种代码（culture）
+        const defaultLanguage = ((_e = this.languageService) === null || _e === void 0 ? void 0 : _e.getDefaultLanguage()) || 'zh-CN';
+        if (currentLanguageId === null || currentLanguageId === undefined) {
+            // 设备未设置当前语种，使用默认语种
+            return defaultLanguage;
+        }
+        else {
+            // 设备已设置当前语种，获取对应的语种代码
+            const currentLanguage = (_g = (_f = this.guiContext) === null || _f === void 0 ? void 0 : _f.getLanguageCultureById) === null || _g === void 0 ? void 0 : _g.call(_f, currentLanguageId);
+            if (currentLanguage) {
+                return currentLanguage;
+            }
+            else {
+                // 无法获取语种代码，使用默认语种
+                return defaultLanguage;
+            }
+        }
+    }
     getValidTimePeriods() {
         const timePeriods = new Array();
-        timePeriods.push({ key: 6, name: this.localization.lastThirtyMinutes });
-        timePeriods.push({ key: 1, name: this.localization.lastOneHour });
-        timePeriods.push({ key: 7, name: this.localization.lastEightHour });
-        timePeriods.push({ key: 2, name: this.localization.lastTwentyFourHours });
-        timePeriods.push({ key: 3, name: this.localization.lastSevenDays });
-        timePeriods.push({ key: 4, name: this.localization.lastThirtyDays });
-        timePeriods.push({ key: 5, name: this.localization.lastOneYear });
+        timePeriods.push({ key: 6, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_THIRTY_MINUTES) });
+        timePeriods.push({ key: 1, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_ONE_HOUR) });
+        timePeriods.push({ key: 7, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_EIGHT_HOURS) });
+        timePeriods.push({ key: 2, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_TWENTY_FOUR_HOURS) });
+        timePeriods.push({ key: 3, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_SEVEN_DAYS) });
+        timePeriods.push({ key: 4, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_THIRTY_DAYS) });
+        timePeriods.push({ key: 5, name: this.getTimePeriodText(TIME_PERIOD_KEYS.LAST_ONE_YEAR) });
         return timePeriods;
     }
+    /**
+     * 获取时间段文案（从系统文本库获取多语种翻译）
+     */
+    getTimePeriodText(textKey) {
+        const currentCulture = this.getCurrentCulture();
+        const systemType = SYSTEM_TEXT_LIBRARY_TYPES.COMPONENT_BUILTIN;
+        if (this.systemTextLibraryService) {
+            const translation = this.systemTextLibraryService.getSystemTextValue(systemType, textKey, currentCulture);
+            if (translation) {
+                return translation;
+            }
+        }
+        return '';
+    }
     updateTimeRange(timePeriodType) {
         this.currentTimePeriod = +timePeriodType;
         this.updateQueryTimeRange();
@@ -127,30 +205,50 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
         if (!this.model.dataSetting) {
             return;
         }
-        const dataItemName = this.model.dataSetting.dataName;
         const dataSourceCode = this.model.dataSetting.dataSourceCode;
-        const channelNames = this.model.dataSetting.channels.map(c => c.name);
         this.updateElementStatus(HistoricalCurveElementStatus.Loading);
-        const input = new GetHistoryDataArgs(dataSourceCode, dataItemName, channelNames, startTime, endTime, limit, rangeType);
-        this.historyDataStore.getHistoryData(input).subscribe(result => {
-            if (result.error) {
-                this.updateElementStatus(HistoricalCurveElementStatus.LoadFailed, result.error);
+        // 【新格式】如果有多条目配置，使用多条目查询
+        if (this.model.dataSetting.dataItems && this.model.dataSetting.dataItems.length > 0) {
+            const historyDataItems = this.model.dataSetting.dataItems.map(item => ({
+                dataItemName: item.dataName,
+                channelNames: item.channels.map(c => c.name)
+            }));
+            // 使用第一个条目的信息作为兼容参数
+            const firstItem = this.model.dataSetting.dataItems[0];
+            const input = new GetHistoryDataArgs(dataSourceCode, firstItem.dataName, firstItem.channels.map(c => c.name), startTime, endTime, limit, rangeType, historyDataItems // 传递多条目参数
+            );
+            this.historyDataStore.getHistoryData(input).subscribe(result => {
+                this.handleQueryResult(result);
+            });
+        }
+        // 【旧格式】单条目模式
+        else {
+            const dataItemName = this.model.dataSetting.dataName;
+            const channelNames = this.model.dataSetting.channels.map(c => c.name);
+            const input = new GetHistoryDataArgs(dataSourceCode, dataItemName, channelNames, startTime, endTime, limit, rangeType);
+            this.historyDataStore.getHistoryData(input).subscribe(result => {
+                this.handleQueryResult(result);
+            });
+        }
+    }
+    handleQueryResult(result) {
+        if (result.error) {
+            this.updateElementStatus(HistoricalCurveElementStatus.LoadFailed, result.error);
+        }
+        else {
+            this.clearStatus();
+            if (result.isUnbind) {
+                this.updateElementStatus(HistoricalCurveElementStatus.Unbound);
             }
             else {
-                this.clearStatus();
-                if (result.isUnbind) {
-                    this.updateElementStatus(HistoricalCurveElementStatus.Unbound);
-                }
-                else {
-                    this.updateElementStatus(HistoricalCurveElementStatus.Normal);
-                }
-                if (result.values.length) {
-                    this.currentStartTime = moment(first(result.values).time);
-                    this.currentEndTime = moment(last(result.values).time);
-                }
-                this.chartElement = this.renderChart(result.values);
+                this.updateElementStatus(HistoricalCurveElementStatus.Normal);
             }
-        });
+            if (result.values.length) {
+                this.currentStartTime = moment(first(result.values).time);
+                this.currentEndTime = moment(last(result.values).time);
+            }
+            this.chartElement = this.renderChart(result.values);
+        }
     }
     setupTooltipAutoHide(chart) {
         const chartContainer = this.rootElement.select('.nv-focus').node();
@@ -178,11 +276,31 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
         const chartWidth = this.model.displaySetting.size.width;
         const chartHeight = this.model.displaySetting.size.height - this.displayOption.operationAreaHeight - this.displayOption.operationAreaMarginTop;
         const data = new Array();
-        each(this.model.dataSetting.channels, (channel, key) => {
-            const values = new Array();
-            each(result, v => values.push({ x: moment(v.time).local().toDate().valueOf(), y: v.values[key] }));
-            data.push({ key: channel.name, area: channel.projectEnabled, values: values });
-        });
+        // 【新格式】多条目模式：曲线名称使用"条目名-通道名"格式
+        if (this.model.dataSetting.dataItems && this.model.dataSetting.dataItems.length > 0) {
+            let channelIndex = 0;
+            each(this.model.dataSetting.dataItems, dataItem => {
+                each(dataItem.channels, channel => {
+                    const values = new Array();
+                    each(result, v => values.push({ x: moment(v.time).local().toDate().valueOf(), y: v.values[channelIndex] }));
+                    // 使用"条目名-通道名"格式
+                    const displayName = `${dataItem.dataName}-${channel.name}`;
+                    data.push({ key: displayName, area: channel.projectEnabled, values: values });
+                    channelIndex++;
+                });
+            });
+        }
+        // 【旧格式】单条目模式：同样使用"条目名-通道名"格式
+        else {
+            const dataItemName = this.model.dataSetting.dataName;
+            each(this.model.dataSetting.channels, (channel, key) => {
+                const values = new Array();
+                each(result, v => values.push({ x: moment(v.time).local().toDate().valueOf(), y: v.values[key] }));
+                // 使用"条目名-通道名"格式
+                const displayName = `${dataItemName}-${channel.name}`;
+                data.push({ key: displayName, area: channel.projectEnabled, values: values });
+            });
+        }
         this.data = data;
         nv.addGraph(() => {
             let chart;
@@ -203,8 +321,22 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
                 .find('.nv-legend')
                 .find('.nv-series');
             let hiddenCount = 0;
+            // 获取所有通道（支持多条目和单条目模式）
+            const allChannels = [];
+            if (this.model.dataSetting.dataItems && this.model.dataSetting.dataItems.length > 0) {
+                // 【新格式】多条目模式：收集所有条目的所有通道
+                each(this.model.dataSetting.dataItems, dataItem => {
+                    each(dataItem.channels, channel => {
+                        allChannels.push(channel);
+                    });
+                });
+            }
+            else {
+                // 【旧格式】单条目模式
+                allChannels.push(...this.model.dataSetting.channels);
+            }
             for (let i = 0; i < this.data.length; i++) {
-                const channel = this.model.dataSetting.channels[i];
+                const channel = allChannels[i];
                 if (legendList.eq(i).children().eq(0).css('fill-opacity') === '1') {
                     const pointList = this.$element
                         .find('.nv-scatterWrap')
@@ -346,7 +478,21 @@ export class HistoricalCurveElement extends ConditionalDisplayElement {
         }
         chart.width(chartWidth);
         chart.height(chartHeight);
-        chart.color(this.model.dataSetting.channels.map(c => c.connectorColor));
+        // 获取所有通道的颜色（支持多条目和单条目模式）
+        let channelColors = [];
+        if (this.model.dataSetting.dataItems && this.model.dataSetting.dataItems.length > 0) {
+            // 【新格式】多条目模式：收集所有条目的所有通道颜色
+            each(this.model.dataSetting.dataItems, dataItem => {
+                each(dataItem.channels, channel => {
+                    channelColors.push(channel.connectorColor);
+                });
+            });
+        }
+        else {
+            // 【旧格式】单条目模式
+            channelColors = this.model.dataSetting.channels.map(c => c.connectorColor);
+        }
+        chart.color(channelColors);
         this.rootElement.append('g').datum(data).call(chart);
         this.rootElement.selectAll('.nv-noData').attr('x', chartWidth / 2).attr('y', chartHeight / 2 + this.displayOption.operationAreaHeight);
         this.resizeEventListener = nv.utils.windowResize(() => {

package/elements/historical-curve/historical-curve.element.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"HistoricalCurveElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-display-element","name":"ConditionalDisplayElement","line":21,"character":44},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":68,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":69,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":70,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":71,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":72,"character":23},{"__symbolic":"reference","module":"../../config","name":"HistoryDataStore","line":73,"character":43},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"initKeyboardListener":[{"__symbolic":"method"}],"getValidTimePeriods":[{"__symbolic":"method"}],"updateTimeRange":[{"__symbolic":"method"}],"updateQueryTimeRange":[{"__symbolic":"method"}],"reRenderElement":[{"__symbolic":"method"}],"renderElement":[{"__symbolic":"method"}],"setupTooltipAutoHide":[{"__symbolic":"method"}],"renderChart":[{"__symbolic":"method"}],"initPoint":[{"__symbolic":"method"}],"getLineChart":[{"__symbolic":"method"}],"getMultiBarWithFocusChart":[{"__symbolic":"method"}],"renderCommonProperty":[{"__symbolic":"method"}],"renderOperationArea":[{"__symbolic":"method"}],"timeFormat":[{"__symbolic":"method"}],"loadFirstPage":[{"__symbolic":"method"}],"loadNextPage":[{"__symbolic":"method"}],"loadPreviousPage":[{"__symbolic":"method"}],"loadLastPage":[{"__symbolic":"method"}],"initElementStatus":[{"__symbolic":"method"}],"updateElementStatus":[{"__symbolic":"method"}],"setStatusAsUnbound":[{"__symbolic":"method"}],"setStatusAsLoading":[{"__symbolic":"method"}],"setStatusAsLoadFailed":[{"__symbolic":"method"}],"renderStatus":[{"__symbolic":"method"}],"clearStatus":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"HistoricalCurveElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-display-element","name":"ConditionalDisplayElement","line":23,"character":44},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":71,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":72,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":73,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":74,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":75,"character":23},{"__symbolic":"reference","module":"../../config","name":"HistoryDataStore","line":76,"character":43},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"../../service","name":"SystemTextLibraryService","line":78,"character":52},{"__symbolic":"reference","module":"../../service","name":"LanguageService","line":79,"character":43},{"__symbolic":"reference","module":"../../gui/gui-context","name":"GuiContext","line":80,"character":38}]}],"dispose":[{"__symbolic":"method"}],"initKeyboardListener":[{"__symbolic":"method"}],"subscribeLanguageChange":[{"__symbolic":"method"}],"updateLanguageTexts":[{"__symbolic":"method"}],"getCurrentCulture":[{"__symbolic":"method"}],"getValidTimePeriods":[{"__symbolic":"method"}],"getTimePeriodText":[{"__symbolic":"method"}],"updateTimeRange":[{"__symbolic":"method"}],"updateQueryTimeRange":[{"__symbolic":"method"}],"reRenderElement":[{"__symbolic":"method"}],"renderElement":[{"__symbolic":"method"}],"handleQueryResult":[{"__symbolic":"method"}],"setupTooltipAutoHide":[{"__symbolic":"method"}],"renderChart":[{"__symbolic":"method"}],"initPoint":[{"__symbolic":"method"}],"getLineChart":[{"__symbolic":"method"}],"getMultiBarWithFocusChart":[{"__symbolic":"method"}],"renderCommonProperty":[{"__symbolic":"method"}],"renderOperationArea":[{"__symbolic":"method"}],"timeFormat":[{"__symbolic":"method"}],"loadFirstPage":[{"__symbolic":"method"}],"loadNextPage":[{"__symbolic":"method"}],"loadPreviousPage":[{"__symbolic":"method"}],"loadLastPage":[{"__symbolic":"method"}],"initElementStatus":[{"__symbolic":"method"}],"updateElementStatus":[{"__symbolic":"method"}],"setStatusAsUnbound":[{"__symbolic":"method"}],"setStatusAsLoading":[{"__symbolic":"method"}],"setStatusAsLoadFailed":[{"__symbolic":"method"}],"renderStatus":[{"__symbolic":"method"}],"clearStatus":[{"__symbolic":"method"}]}}}}]

package/elements/main-element.js

@@ -29,6 +29,7 @@ import { VideoElement } from './video/video-element';
 import { WeatherElement } from './weather/weater-element';
 import { AirQualityElement } from './air-quality/air-quality-element';
 import { AlarmElement } from './alarm/alarm-element';
+import { ScrollAlarmElement } from './scroll-alarm/scroll-alarm-element';
 export class MainElement {
     constructor(injector, bsModalService, context, variableCommunicator, popupViewService, signalRAppId) {
         this.injector = injector;
@@ -60,7 +61,7 @@ export class MainElement {
             const category = $(element).data('model').category;
             switch (category) {
                 case GuiConsts.components.numericalDisplayKey:
-                    const numericalDisplayElement = new NumericalDisplayElement(element, this.injector, this.bsModalService, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.graphStore, this.context.operationRecordService, this.context.releasedVariableService, this.context.securityChecker, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId);
+                    const numericalDisplayElement = new NumericalDisplayElement(element, this.injector, this.bsModalService, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.graphStore, this.context.operationRecordService, this.context.releasedVariableService, this.context.securityChecker, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId, this.context);
                     this.elements.push(numericalDisplayElement);
                     break;
                 case GuiConsts.components.imageKey:
@@ -73,23 +74,23 @@ export class MainElement {
                     this.elements.push(new PipeElement(element, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId));
                     break;
                 case GuiConsts.components.switchIndicatorLightKey:
-                    this.elements.push(new SwitchIndicatorLightElement(element, this.injector, this.bsModalService, this.variableCommunicator, this.context.configStore.graphStore, this.context.permissionChecker, this.context.operationRecordService, this.context.securityChecker, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId));
+                    this.elements.push(new SwitchIndicatorLightElement(element, this.injector, this.bsModalService, this.variableCommunicator, this.context.configStore.graphStore, this.context.permissionChecker, this.context.operationRecordService, this.context.securityChecker, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId, this.context.textLibraryService, this.context.languageService, this.context));
                     break;
                 case GuiConsts.components.barGraphKey:
                     this.elements.push(new BarGraphElement(element, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId));
                     break;
                 case GuiConsts.components.toggleViewKey:
                 case GuiConsts.components.viewOperationElement:
-                    this.elements.push(new ViewOperationElement(element, this.injector, this.bsModalService, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.context.permissionChecker, this.context.operationRecordService, this.context.securityChecker, this.injector.get(LOCALIZATION), this.popupViewService, guiOptions.hostContainerId, guiOptions.el, this.signalRAppId));
+                    this.elements.push(new ViewOperationElement(element, this.injector, this.bsModalService, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.context.permissionChecker, this.context.operationRecordService, this.context.securityChecker, this.injector.get(LOCALIZATION), this.popupViewService, guiOptions.hostContainerId, guiOptions.el, this.signalRAppId, this.context.textLibraryService, this.context.languageService, this.context));
                     break;
                 case GuiConsts.components.characterKey:
                     this.elements.push(new CharacterDisplayElement(element, this.injector, this.bsModalService, this.variableCommunicator, this.context.configStore.graphStore, this.context.permissionChecker, this.context.operationRecordService, this.context.securityChecker, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId));
                     break;
                 case GuiConsts.components.textKey:
-                    this.elements.push(new TextElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.signalRAppId));
+                    this.elements.push(new TextElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.signalRAppId, this.context.textLibraryService, this.context.languageService, this.context));
                     break;
                 case GuiConsts.components.hyperlinkKey:
-                    this.elements.push(new HyperlinkElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.signalRAppId));
+                    this.elements.push(new HyperlinkElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.signalRAppId, this.context.textLibraryService, this.context.languageService, this.context));
                     break;
                 case GuiConsts.components.straightLineKey:
                     this.elements.push(new StraightLineElement(element, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.signalRAppId));
@@ -110,7 +111,7 @@ export class MainElement {
                     this.elements.push(new DatetimeDisplayElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.graphStore, this.signalRAppId));
                     break;
                 case GuiConsts.components.historicalCurveKey:
-                    this.elements.push(new HistoricalCurveElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.historyDataStore, this.signalRAppId));
+                    this.elements.push(new HistoricalCurveElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.historyDataStore, this.signalRAppId, this.context.systemTextLibraryService, this.context.languageService, this.context));
                     break;
                 case GuiConsts.components.ringGraphKey:
                     this.elements.push(new RingGraphElement(element, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.injector.get(LOCALIZATION), this.signalRAppId));
@@ -131,7 +132,10 @@ export class MainElement {
                     this.elements.push(new AirQualityElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.weatherService, this.signalRAppId));
                     break;
                 case GuiConsts.components.alarmKey:
-                    this.elements.push(new AlarmElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.alarmsStore, this.signalRAppId));
+                    this.elements.push(new AlarmElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.alarmsStore, this.signalRAppId, this.context.systemTextLibraryService, this.context.languageService, this.context));
+                    break;
+                case GuiConsts.components.scrollAlarmKey:
+                    this.elements.push(new ScrollAlarmElement(element, this.injector, this.context.permissionChecker, this.variableCommunicator, this.context.configStore.variableStore, this.context.configStore.alarmsStore, this.signalRAppId));
                     break;
             }
         });
@@ -298,7 +302,7 @@ export class MainElement {
         each(this.elements, e => {
             if (e instanceof HistoricalCurveElement || e instanceof VideoElement
                 || e instanceof WeatherElement || e instanceof NumericalDisplayElement || e instanceof TextElement
-                || e instanceof AirQualityElement || e instanceof SwitchIndicatorLightElement) {
+                || e instanceof AirQualityElement || e instanceof ScrollAlarmElement) {
                 e.dispose();
             }
         });

package/elements/main-element.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"MainElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":55,"character":43},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":56,"character":41},{"__symbolic":"reference","module":"../gui/gui-context","name":"GuiContext","line":57,"character":34},{"__symbolic":"reference","module":"../communication","name":"VariableCommunicator","line":58,"character":47},{"__symbolic":"reference","module":"../view/popup-view.service","name":"PopupViewService","line":59,"character":43},null]}],"load":[{"__symbolic":"method"}],"uniformStretch":[{"__symbolic":"method"}],"changeVideoStyle":[{"__symbolic":"method"}],"horizontalStretch":[{"__symbolic":"method"}],"initElementState":[{"__symbolic":"method"}],"getVariableNames":[{"__symbolic":"method"}],"reportVariableStates":[{"__symbolic":"method"}],"getVirtualDeviceIdFromRect":[{"__symbolic":"method"}],"reportVariableValues":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}],"checkIsLoaded":[{"__symbolic":"method"}],"initBackground":[{"__symbolic":"method"}],"getImageEl":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"MainElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":56,"character":43},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":57,"character":41},{"__symbolic":"reference","module":"../gui/gui-context","name":"GuiContext","line":58,"character":34},{"__symbolic":"reference","module":"../communication","name":"VariableCommunicator","line":59,"character":47},{"__symbolic":"reference","module":"../view/popup-view.service","name":"PopupViewService","line":60,"character":43},null]}],"load":[{"__symbolic":"method"}],"uniformStretch":[{"__symbolic":"method"}],"changeVideoStyle":[{"__symbolic":"method"}],"horizontalStretch":[{"__symbolic":"method"}],"initElementState":[{"__symbolic":"method"}],"getVariableNames":[{"__symbolic":"method"}],"reportVariableStates":[{"__symbolic":"method"}],"getVirtualDeviceIdFromRect":[{"__symbolic":"method"}],"reportVariableValues":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}],"checkIsLoaded":[{"__symbolic":"method"}],"initBackground":[{"__symbolic":"method"}],"getImageEl":[{"__symbolic":"method"}]}}}}]

package/elements/numerical-display/numerical-display-element.d.ts

@@ -4,15 +4,17 @@ import { GraphStore, VariableStore } from '../../config';
 import { Localization } from '../../localization';
 import { NumericalDisplay } from '../../model';
 import { PermissionChecker, OperationRecordService, ReleasedVariableService } from '../../service';
-import { VariableCommunicator } from '../../communication';
+import { VariableCommunicator, VariableValue } from '../../communication';
 import { ReadableElement } from '../base/readable-element';
 import { SecurityChecker } from '../../security';
+import { GuiContext } from '../../gui/gui-context';
 export declare class NumericalDisplayElement extends ReadableElement {
     private readonly modalService;
     private readonly graphStore;
     private readonly operationRecordService;
     private readonly releasedVariableService;
     private readonly securityChecker;
+    private readonly guiContext?;
     private readonly dataTypeService;
     private readonly fractionDigitService;
     private readonly accessPermissionService;
@@ -28,8 +30,13 @@ export declare class NumericalDisplayElement extends ReadableElement {
     private numericalOperation;
     private restorationTimer;
     get writeVariableName(): string;
-    constructor(element: HTMLElement, injector: Injector, modalService: BsModalService, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, graphStore: GraphStore, operationRecordService: OperationRecordService, releasedVariableService: ReleasedVariableService, securityChecker: SecurityChecker, variableStore: VariableStore, localization: Localization, signalRAppId: string);
+    constructor(element: HTMLElement, injector: Injector, modalService: BsModalService, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, graphStore: GraphStore, operationRecordService: OperationRecordService, releasedVariableService: ReleasedVariableService, securityChecker: SecurityChecker, variableStore: VariableStore, localization: Localization, signalRAppId: string, guiContext?: GuiContext);
     dispose(): void;
+    /**
+     * 重写父类方法，处理"当前语种ID"系统变量
+     * 当值为null时，显示默认语种ID
+     */
+    reportValueChanged(value: VariableValue): void;
     initElement(): any;
     private checkElementPassword;
     private initVariableText;

package/elements/numerical-display/numerical-display-element.js

@@ -18,13 +18,14 @@ var variableRwTypeEnum;
     variableRwTypeEnum[variableRwTypeEnum["readWiter"] = 6] = "readWiter";
 })(variableRwTypeEnum || (variableRwTypeEnum = {}));
 export class NumericalDisplayElement extends ReadableElement {
-    constructor(element, injector, modalService, permissionChecker, variableCommunicator, graphStore, operationRecordService, releasedVariableService, securityChecker, variableStore, localization, signalRAppId) {
+    constructor(element, injector, modalService, permissionChecker, variableCommunicator, graphStore, operationRecordService, releasedVariableService, securityChecker, variableStore, localization, signalRAppId, guiContext) {
         super(element, permissionChecker, variableCommunicator, variableStore, localization, signalRAppId);
         this.modalService = modalService;
         this.graphStore = graphStore;
         this.operationRecordService = operationRecordService;
         this.releasedVariableService = releasedVariableService;
         this.securityChecker = securityChecker;
+        this.guiContext = guiContext;
         this.displayText = '';
         this.enableDataParsed = false;
         this.logger = injector.get(LOGGER_SERVICE_TOKEN);
@@ -57,6 +58,25 @@ export class NumericalDisplayElement extends ReadableElement {
             this.$element.remove();
         }
     }
+    /**
+     * 重写父类方法，处理"当前语种ID"系统变量
+     * 当值为null时，显示默认语种ID
+     */
+    reportValueChanged(value) {
+        var _a, _b, _c;
+        // 处理系统变量"当前语种ID"
+        if (value.variableName === '当前语种ID') {
+            let displayValue = value.value;
+            // 如果值为null，使用默认语种ID
+            if (displayValue === null || displayValue === undefined) {
+                displayValue = (_c = (_b = (_a = this.guiContext) === null || _a === void 0 ? void 0 : _a.getDefaultLanguageId) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : 0;
+            }
+            this.updateVariableValue(displayValue);
+            return;
+        }
+        // 其他变量调用父类方法
+        super.reportValueChanged(value);
+    }
     initElement() {
         const { rootElement } = this;
         rootElement.selectAll('*').remove();
@@ -180,7 +200,7 @@ export class NumericalDisplayElement extends ReadableElement {
         if (null == this.writeVariableName) {
             return;
         }
-        const args = new WriteValueModalArgs(this.writeVariableName, this.model.dataType, this.model.fBoxDataType, this.model.integerDigits, this.model.fractionDigits, this.numericalOperationService.getNumericalOperations(this.model), this.model.version, this.enableDataParsed, this.releasedVariableService);
+        const args = new WriteValueModalArgs(this.writeVariableName, this.model.dataType, this.model.fBoxDataType, this.model.integerDigits, this.model.fractionDigits, this.numericalOperationService.getNumericalOperations(this.model), this.model.version, this.enableDataParsed, this.releasedVariableService, this.guiContext);
         this.writeValueMmodalRef = this.modalService.show(WriteValueModalComponent, {
             initialState: { args: args }, backdrop: 'static', class: 'gui-modal-dialog-position', animated: false
         });

package/elements/numerical-display/numerical-display-element.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"NumericalDisplayElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/readable-element","name":"ReadableElement","line":28,"character":45},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":50,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":51,"character":18},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":52,"character":39},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":53,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":54,"character":30},{"__symbolic":"reference","module":"../../config","name":"GraphStore","line":55,"character":37},{"__symbolic":"reference","module":"../../service","name":"OperationRecordService","line":56,"character":49},{"__symbolic":"reference","module":"../../service","name":"ReleasedVariableService","line":57,"character":50},{"__symbolic":"reference","module":"../../security","name":"SecurityChecker","line":58,"character":42},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":59,"character":23},{"__symbolic":"reference","module":"../../localization","name":"Localization","line":60,"character":22},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"initElement":[{"__symbolic":"method"}],"checkElementPassword":[{"__symbolic":"method"}],"initVariableText":[{"__symbolic":"method"}],"initGraphAndText":[{"__symbolic":"method"}],"doWriteValue":[{"__symbolic":"method"}],"recordOperation":[{"__symbolic":"method"}],"changeStates":[{"__symbolic":"method"}],"updateVariableValue":[{"__symbolic":"method"}],"updateDisplayText":[{"__symbolic":"method"}],"rebuildTextElement":[{"__symbolic":"method"}],"formatNumericalDisplayText":[{"__symbolic":"method"}],"formatFloatDisplayText":[{"__symbolic":"method"}],"isNumeric":[{"__symbolic":"method"}],"formatDisplayTextUnit":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"NumericalDisplayElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/readable-element","name":"ReadableElement","line":29,"character":45},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":51,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":52,"character":18},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":53,"character":39},{"__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":"GraphStore","line":56,"character":37},{"__symbolic":"reference","module":"../../service","name":"OperationRecordService","line":57,"character":49},{"__symbolic":"reference","module":"../../service","name":"ReleasedVariableService","line":58,"character":50},{"__symbolic":"reference","module":"../../security","name":"SecurityChecker","line":59,"character":42},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":60,"character":23},{"__symbolic":"reference","module":"../../localization","name":"Localization","line":61,"character":22},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"../../gui/gui-context","name":"GuiContext","line":63,"character":38}]}],"dispose":[{"__symbolic":"method"}],"reportValueChanged":[{"__symbolic":"method"}],"initElement":[{"__symbolic":"method"}],"checkElementPassword":[{"__symbolic":"method"}],"initVariableText":[{"__symbolic":"method"}],"initGraphAndText":[{"__symbolic":"method"}],"doWriteValue":[{"__symbolic":"method"}],"recordOperation":[{"__symbolic":"method"}],"changeStates":[{"__symbolic":"method"}],"updateVariableValue":[{"__symbolic":"method"}],"updateDisplayText":[{"__symbolic":"method"}],"rebuildTextElement":[{"__symbolic":"method"}],"formatNumericalDisplayText":[{"__symbolic":"method"}],"formatFloatDisplayText":[{"__symbolic":"method"}],"isNumeric":[{"__symbolic":"method"}],"formatDisplayTextUnit":[{"__symbolic":"method"}]}}}}]

package/elements/scroll-alarm/scroll-alarm-element.d.ts

@@ -0,0 +1,54 @@
+import { Injector } from '@angular/core';
+import { PermissionChecker } from '../../service';
+import { VariableCommunicator } from '../../communication';
+import { ConditionalDynamicDisplayElement } from '../base/conditional-dynamic-display-element';
+import { ScrollAlarmModel } from '../../model/scroll-alarm/scroll-alarm.model';
+import { AlarmsStore, VariableStore } from '../../config';
+export declare class ScrollAlarmElement extends ConditionalDynamicDisplayElement {
+    private readonly alarmsStore;
+    readonly model: ScrollAlarmModel;
+    private readonly logger;
+    readonly variableCommunicator: VariableCommunicator;
+    private elementStatus;
+    private element;
+    private scrollIntervalId;
+    private alarmNames;
+    private startTime;
+    private endTime;
+    private getAlarmDataId;
+    private alarmRefreshThrottleId;
+    private isWaitingForAlarmRefresh;
+    private isScrolling;
+    private isDisposed;
+    private isRefreshingCurrentPage;
+    private currentPage;
+    private maxResultCount;
+    private displayedItems;
+    private pageWidths;
+    private totalWidth;
+    private container;
+    private allAlarmsContainer;
+    private currentLeft;
+    private autoCycle;
+    private hasMoreData;
+    private isLoadingNextPage;
+    private headerFont;
+    private fontString;
+    private hasTriedFirstPage;
+    constructor(element: HTMLElement, injector: Injector, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, variableStore: VariableStore, alarmsStore: AlarmsStore, signalRAppId: string);
+    dispose(): void;
+    private getAlarmData;
+    private initDisplayContainer;
+    private renderNewPage;
+    private removeOldestPage;
+    private scrollContent;
+    private initScrolling;
+    private pauseScroll;
+    private resumeScroll;
+    private resetToFirstPage;
+    private updateQueryTimeRange;
+    private setStatusAsNormal;
+    private setStatusAsLoading;
+    private renderStatus;
+    private clearStatus;
+}