devexpress-reporting
Version:
DevExpress Reporting provides the capability to develop a reporting application to create and customize reports.
150 lines (149 loc) • 8.18 kB
JavaScript
/**
* DevExpress HTML/JS Reporting (viewer\ai\_aiPanel.viewmodel.js)
* Version: 25.2.3
* Build date: Dec 15, 2025
* Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED
* License: https://www.devexpress.com/Support/EULAs/universal.xml
*/
import { createViewModelGenerator } from '@devexpress/analytics-core/analytics-serializer-native';
import { extend, getLocalization } from '@devexpress/analytics-core/analytics-internal-native';
import dxLoadIndicator from 'devextreme/ui/load_indicator';
export var TextSourceTarget;
(function (TextSourceTarget) {
TextSourceTarget["Document"] = "document";
TextSourceTarget["Page"] = "page";
TextSourceTarget["Selection"] = "selection";
})(TextSourceTarget || (TextSourceTarget = {}));
export function createViewModel(viewModel) {
const AIPanelHeaderLabel = getLocalization('AI Operations', 'ASPxReportsStringId.AIPanel_PanelHeaderLabel');
const TargetLanguageText = getLocalization('Output Language', 'ASPxReportsStringId.AIPanel_Language');
const TargetContentText = getLocalization('Text to Process', 'ASPxReportsStringId.AIPanel_TargetContent');
const PageSelectText = getLocalization('Page', 'ASPxReportsStringId.AIPanel_Page');
const SummarizeActionText = getLocalization('Summarize', 'ASPxReportsStringId.AIPanel_SummarizeAction');
const TranslateActionText = getLocalization('Translate', 'ASPxReportsStringId.AIPanel_TranslateAction');
const ProcessForAllCheckBoxText = getLocalization('I agree to process all requests in succession/sequentially.', 'ASPxReportsStringId.AIPanel_AgreeToAllChunks');
const textProcessingResultHeaderText = getLocalization('Result', 'ASPxReportsStringId.AIPanel_ProcessingResultHeader');
const ProceedNextChunkButtonText = getLocalization('Proceed', 'ASPxReportsStringId.AIPanel_ProceedChunk');
const CancelChunkedOperationButtonText = getLocalization('Cancel', 'ASPxReportsStringId.AIPanel_CancelChunk');
const aiPanelViewModel = createViewModelGenerator(viewModel)
.generateProperty('buttons', createViewModelGenerator()
.generateProperty('translateTextButton', createViewModelGenerator()
.generateProperty('text', TranslateActionText)
.generateProperty('disabled', this.loading)
.generateProperty('onClick', () => this.onTranslateClick(this.selectedLanguage))
.generateProperty('width', '110px')
.generateProperty('width', this.translationEnabled ? '110px' : '0px')
.generateProperty('visible', this.translationEnabled)
.generateProperty('template', (data, container) => {
const buttonIndicatorElement = this._preparetextProcessingButtonTemplate(data, container);
this.translateButtonLoader = new dxLoadIndicator(buttonIndicatorElement, {
visible: false
});
})
.getViewModel())
.generateProperty('copyResultButton', createViewModelGenerator()
.generateProperty('template', this.copyButtonTemplate)
.generateProperty('hint', getLocalization('Copy', 'AnalyticsCoreStringId.Cmd_Copy'))
.generateProperty('onClick', (e) => this.copyResultClick(e))
.getViewModel())
.generateProperty('summarizeTextButton', createViewModelGenerator()
.generateProperty('text', SummarizeActionText)
.generateProperty('onClick', (e) => this.onSummarizeClick())
.generateProperty('disabled', this.loading)
.generateProperty('width', this.summarizationEnabled ? '110px' : '0px')
.generateProperty('visible', this.summarizationEnabled)
.generateProperty('template', (data, container) => {
const buttonIndicatorElement = this._preparetextProcessingButtonTemplate(data, container);
this.summarizeButtonLoader = new dxLoadIndicator(buttonIndicatorElement, {
visible: false
});
})
.getViewModel())
.getViewModel())
.generateProperty('getSelectBoxOptions', (options, element) => {
return extend(options, { dropDownOptions: {
container: element,
position: { boundary: element, my: 'left top', at: 'left bottom', of: element }
}
});
})
.generateProperty('languageSelectBoxOptions', createViewModelGenerator()
.generateProperty('valueExpr', 'id')
.generateProperty('displayExpr', 'text')
.generateProperty('dataSource', this.languages)
.generateProperty('value', this.selectedLanguage)
.generateProperty('showClearButton', true)
.generateProperty('inputAttr', { 'aria-label': TargetLanguageText })
.generateProperty('visible', this.languages.length > 0)
.generateProperty('onValueChanged', (event) => {
this.selectedLanguage = event.value;
this.languageSelectBoxComponent = event.component;
if (event.value) {
event.component?.option({
validationStatus: 'valid',
validationErrors: []
});
}
})
.getViewModel())
.generateProperty('proceedForAllCheckBoxOptions', createViewModelGenerator()
.generateProperty('text', ProcessForAllCheckBoxText)
.generateProperty('value', this.proceedForAllChunks)
.generateProperty('onValueChanged', (event) => {
this.proceedForAllChunks = event.value;
})
.getViewModel())
.generateProperty('targetSelectBoxOptions', createViewModelGenerator()
.generateProperty('valueExpr', 'key')
.generateProperty('displayExpr', 'text')
.generateProperty('dataSource', this.targets)
.generateProperty('value', this.selectedTarget)
.generateProperty('onValueChanged', (event) => {
this.selectedTarget = event.value ?? TextSourceTarget.Document;
this.pageSelectBoxVisible = (this.selectedTarget === TextSourceTarget.Page);
})
.generateProperty('inputAttr', { 'aria-label': TargetContentText })
.getViewModel())
.generateProperty('pageSelectBoxOptions', createViewModelGenerator()
.generateProperty('valueExpr', 'key')
.generateProperty('displayExpr', 'text')
.generateProperty('dataSource', this.pagesListDataSource)
.generateProperty('value', this.selectedPage)
.generateProperty('visible', this.pageSelectBoxVisible)
.generateProperty('searchEnabled', true)
.generateProperty('searchExpr', 'text')
.generateProperty('inputAttr', { 'aria-label': PageSelectText })
.generateProperty('onValueChanged', (data) => {
if (data.value !== null) {
this.selectedPage = data.value;
this.reportPreview.goToPage(this.selectedPage, true);
}
else {
data.component.option('value', this.selectedPage);
}
})
.getViewModel())
.generateProperty('aiProcessingResultText', this.aiProcessingResultText)
.generateProperty('warningTextLimitPopupVisible', this.warningTextLimitPopupVisible)
.generateProperty('pageSelectBoxVisible', this.pageSelectBoxVisible)
.generateProperty('proceedNextButtonClick', this.proceedNextButtonClick)
.generateProperty('resultVisible', false)
.generateProperty('cancelProcessButtonClick', (event) => {
this.clearProcessing(false);
})
.generateProperty('copyText', (data, event) => {
if (event.keyCode === 13)
this.copyResultClick(event);
return true;
})
.generateProperty('targetLanguageText', TargetLanguageText)
.generateProperty('targetContentText', TargetContentText)
.generateProperty('pageSelectText', PageSelectText)
.generateProperty('textProcessingResultHeaderText', textProcessingResultHeaderText)
.generateProperty('proceedNextChunkButtonText', ProceedNextChunkButtonText)
.generateProperty('cancelChunkedOperationButtonText', CancelChunkedOperationButtonText)
.generateProperty('aiPanelHeaderLabel', AIPanelHeaderLabel)
.generateProperty('limitExceededWarningMsg', this.limitExceededWarningMsg)
.getViewModel();
return aiPanelViewModel;
}