devexpress-richedit
Version:
DevExpress Rich Text Editor is an advanced word-processing tool designed for working with rich text documents.
100 lines (99 loc) • 4.19 kB
JavaScript
import { formatMessage } from 'devextreme/localization';
import dxList from 'devextreme/ui/list';
import { DialogBase } from './dialog-base';
import { SearchUtils } from '@devexpress/utils/lib/utils/search';
export class InsertMergeFieldDialog extends DialogBase {
fieldsList;
insertBtn;
getTitle() {
return formatMessage("XtraRichEditStringId.MenuCmd_ShowInsertMergeFieldForm");
}
getMaxWidth() {
return 400;
}
get dataSource() {
return this.richedit.owner.dataSource;
}
getFormOptions() {
return {
items: [
{
label: { visible: false },
template: () => {
const element = document.createElement('div');
let currentItemIndex = Number.NaN;
let resetDoubleClickTimerId = null;
this.fieldsList = new dxList(element, {
height: 250,
searchEnabled: true,
dataSource: Object.keys(this.dataSource.items()[0]).sort((a, b) => a.localeCompare(b)),
noDataText: formatMessage("ASPxRichEditStringId.InsertMergeField_NoFields"),
selectionMode: 'single',
onOptionChanged: (e) => {
if (e.name === 'items')
this.setButtonsEnabled();
},
onSelectionChanged: () => this.setButtonsEnabled(),
onItemClick: (e) => {
if (resetDoubleClickTimerId)
clearTimeout(resetDoubleClickTimerId);
if (e.itemIndex == currentItemIndex) {
this.applyParameters();
this.popupDialog.hide();
}
if (typeof (e.itemIndex) === 'number')
currentItemIndex = e.itemIndex;
else
currentItemIndex = e.itemIndex ? e.itemIndex.item : Number.NaN;
resetDoubleClickTimerId = setTimeout(() => {
currentItemIndex = Number.NaN;
}, (300));
},
});
return element;
}
}
]
};
}
afterShowing() {
this.setButtonsEnabled();
}
setButtonsEnabled() {
const selectedItem = this.fieldsList.option('selectedItems')[0];
const shouldDisable = !selectedItem || SearchUtils.binaryIndexOf(this.fieldsList.option('items'), (a) => a.localeCompare(selectedItem)) < 0;
this.insertBtn.option('disabled', shouldDisable);
}
getToolbarItems() {
return [
{
widget: 'dxButton',
location: 'after',
toolbar: 'bottom',
options: {
text: formatMessage("ASPxRichEditStringId.InsertButton"),
onInitialized: (e) => { this.insertBtn = e.component; },
onClick: () => {
this.applyParameters();
this.popupDialog.hide();
}
}
},
{
widget: 'dxButton',
location: 'after',
toolbar: 'bottom',
options: {
text: formatMessage("ASPxRichEditStringId.CloseButton"),
onClick: () => {
this.popupDialog.hide();
this.afterClosing();
}
}
}
];
}
updateParameters(parameters, _data) {
parameters.fieldName = this.fieldsList.option('selectedItems')[0];
}
}