@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
286 lines (285 loc) • 13.2 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.StyledColumnModule = void 0;
const tslib_1 = require("tslib");
const AdaptableModuleBase_1 = require("./AdaptableModuleBase");
const ModuleConstants = tslib_1.__importStar(require("../Utilities/Constants/ModuleConstants"));
const StyledColumnRedux = tslib_1.__importStar(require("../Redux/ActionsReducers/StyledColumnRedux"));
const StyledColumnWizard_1 = require("../View/StyledColumn/Wizard/StyledColumnWizard");
const StyledColumnWizardStyleSection_1 = require("../View/StyledColumn/Wizard/StyledColumnWizardStyleSection/StyledColumnWizardStyleSection");
const ObjectFactory_1 = tslib_1.__importDefault(require("../Utilities/ObjectFactory"));
const StyledColumnBadgePreview_1 = require("../View/StyledColumn/Wizard/StyledColumnWizardStyleSection/Components/StyledColumnBadgePreview");
const getObjectTagsViewItems_1 = require("../Utilities/getObjectTagsViewItems");
const StyledColumnBadgeSettings_1 = require("../View/StyledColumn/Wizard/StyledColumnWizardStyleSection/Components/StyledColumnBadgeSettings");
class StyledColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
constructor(api) {
super(ModuleConstants.StyledColumnModuleId, ModuleConstants.StyledColumnFriendlyName, 'brush', 'StyledColumnPopup', // to change
'Create a Special Column Style e.g Gradient, Percent Bar or Badge', api);
}
getModuleAdaptableObjects(config) {
return this.api.styledColumnApi.getStyledColumns(config);
}
getExplicitlyReferencedColumnIds(styledColumn) {
return [styledColumn.ColumnId];
}
hasNamedQueryReferences() {
return false;
}
createColumnMenuItems(column) {
let returnColumnMenuItems = [];
// Need a Column and an editable Module
if (column && this.isModuleEditable() && !column.isTreeColumn) {
let styledColumn = this.api.styledColumnApi.getStyledColumnForColumnId(column.columnId);
// First look at Sparkline Columns - needs to be editable array type
if (this.api.columnApi.hasNumericArrayDataType(column.columnId) &&
column.IsReadOnly !== true &&
this.api.styledColumnApi.canDisplaySparklines()) {
let sparklineColumnExists = column.isSparkline && Boolean(styledColumn);
if (column.isSparkline && !sparklineColumnExists) {
// do nothing as we only want to continue if there is no sparkline column or if its in state
// because if just one then it was created in AG Grid and we dont want to edit it
}
else {
const hasSparklineStyle = styledColumn != null && styledColumn.SparklineStyle != null;
if (!hasSparklineStyle) {
styledColumn = {
...ObjectFactory_1.default.CreateEmptyStyledColumn(),
ColumnId: column.columnId,
SparklineStyle: {},
};
}
let label = hasSparklineStyle ? 'Edit ' : 'Create ';
let name = hasSparklineStyle
? 'styled-column-sparkline-edit'
: 'styled-column-sparkline-add';
let popupParam = {
action: hasSparklineStyle ? 'Edit' : 'New',
source: 'ColumnMenu',
value: styledColumn,
config: {
defaultCurrentSectionName: 'Settings',
},
};
returnColumnMenuItems.push(this.createMenuItemShowPopup(name, label + 'Sparkline Column', this.moduleInfo.Popup, this.getGlyphForStyledColumn(styledColumn), popupParam));
}
}
// Next do non sparkline
else if (!column.isSparkline) {
// Edit is common
if (styledColumn) {
if (!styledColumn.IsReadOnly) {
let defaultCurrentSectionName = undefined;
if (styledColumn.BadgeStyle) {
defaultCurrentSectionName = 'Badges';
}
else {
defaultCurrentSectionName = 'Style';
}
const popupParam = {
action: 'Edit',
source: 'ColumnMenu',
value: styledColumn,
config: {
defaultCurrentSectionName,
},
};
const icon = this.getGlyphForStyledColumn(styledColumn);
const typeLabel = this.getTypeLabel(styledColumn);
const label = `Edit ${typeLabel}`;
const name = this.getTypeName(styledColumn);
returnColumnMenuItems.push(this.createMenuItemShowPopup(name, label, this.moduleInfo.Popup, icon, popupParam));
}
}
else {
const newStyledColumn = {
...ObjectFactory_1.default.CreateEmptyStyledColumn(),
ColumnId: column.columnId,
};
const popupParam = {
action: 'New',
source: 'ColumnMenu',
value: newStyledColumn,
config: {},
};
const badgeLabel = 'Create Badge Style';
const newBadgeButton = this.createMenuItemShowPopup('styled-column-badge-add', badgeLabel, this.moduleInfo.Popup, 'badge', {
...popupParam,
value: {
...newStyledColumn,
BadgeStyle: {
Badges: [ObjectFactory_1.default.CreateDefaultStyledColumnBadge()],
},
},
config: {
defaultCurrentSectionName: 'Badges',
},
});
switch (column.dataType) {
// Number
// Create Styled Column - Gradient | Percent Bar | Badge
case 'number':
const emptyRanges = this.api.columnScopeApi.createCellColorRangesForScope({
ColumnIds: [column.columnId],
});
const newGrandientButton = this.createMenuItemShowPopup('styled-column-gradient-add', 'Create Gradient Column', this.moduleInfo.Popup, 'gradient', {
...popupParam,
value: {
...newStyledColumn,
GradientStyle: {
CellRanges: emptyRanges,
},
},
config: {
defaultCurrentSectionName: 'Style',
},
});
const newPercentBarButton = this.createMenuItemShowPopup('styled-column-percent-bar-add', 'Create Percent Bar', this.moduleInfo.Popup, 'percent', {
...popupParam,
value: {
...newStyledColumn,
PercentBarStyle: {
CellRanges: emptyRanges,
},
},
config: {
defaultCurrentSectionName: 'Style',
},
});
returnColumnMenuItems.push(...[newGrandientButton, newPercentBarButton, newBadgeButton]);
break;
case 'text':
case 'textArray':
case 'numberArray':
returnColumnMenuItems.push(newBadgeButton);
break;
}
}
}
}
return returnColumnMenuItems;
}
getGlyphForStyledColumn(styledColumn) {
if (styledColumn.GradientStyle) {
return 'gradient';
}
else if (styledColumn.PercentBarStyle) {
return 'percent';
}
else if (styledColumn.SparklineStyle) {
return 'spark-line';
}
else if (styledColumn.BadgeStyle) {
return 'badge';
}
return this.moduleInfo.Glyph;
}
getTeamSharingAction() {
return {
ModuleEntities: this.api.styledColumnApi.getStyledColumns(),
AddAction: StyledColumnRedux.StyledColumnAdd,
EditAction: StyledColumnRedux.StyledColumnEdit,
};
}
toView(styledColumn) {
const specificTypeItems = [];
if (styledColumn.GradientStyle || styledColumn.PercentBarStyle) {
specificTypeItems.push({
name: 'Style',
view: () => {
return (0, StyledColumnWizardStyleSection_1.renderStyledColumnStyleSummary)(styledColumn, this.api);
},
});
}
if (styledColumn.BadgeStyle) {
specificTypeItems.push({
name: 'Rows',
values: [
`Data Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeDataRows ? 'No' : 'Yes'}`,
`Group Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeGroupRows ? 'No' : 'Yes'}`,
`Summary Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeSummaryRows ? 'No' : 'Yes'}`,
`Total Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeTotalRows ? 'No' : 'Yes'}`,
],
});
}
if (styledColumn.BadgeStyle) {
specificTypeItems.push({
name: 'Settings',
view: StyledColumnBadgeSettings_1.StyledColumnBadgeSettings,
});
specificTypeItems.push({
name: 'Preview',
view: StyledColumnBadgePreview_1.StyledColumnBadgePreview,
});
}
return {
abObject: styledColumn,
items: [
{
name: 'Type',
values: [this.getTypeLabel(styledColumn)],
},
{
name: 'Column',
values: [this.api.columnApi.getFriendlyNameForColumnId(styledColumn.ColumnId)],
},
...specificTypeItems,
,
(0, getObjectTagsViewItems_1.getObjectTagsViewItems)(styledColumn, this.api),
].filter(Boolean),
};
}
toViewAll() {
return this.getModuleAdaptableObjects({
includeLayoutNotAssociatedObjects: this.showLayoutNotAssociatedObjects(),
}).map((styledColumn) => this.toView(styledColumn));
}
getViewProperties() {
return {
getEditAction: StyledColumnRedux.StyledColumnEdit,
getDeleteAction: StyledColumnRedux.StyledColumnDelete,
getSuspendAction: StyledColumnRedux.StyledColumnSuspend,
getUnSuspendAction: StyledColumnRedux.StyledColumnUnSuspend,
getSuspendAllAction: StyledColumnRedux.StyledColumnSuspendAll,
getUnSuspendAllAction: StyledColumnRedux.StyledColumnUnSuspendAll,
getEditWizard() {
return StyledColumnWizard_1.StyledColumnWizard;
},
};
}
canBeAssociatedWithLayouts() {
return true;
}
getTypeLabel(styledColumn) {
let type = null;
if (styledColumn.GradientStyle) {
type = 'Gradient Column';
}
else if (styledColumn.PercentBarStyle) {
type = 'Percent Bar';
}
else if (styledColumn.SparklineStyle) {
type = 'Spark Line';
}
else if (styledColumn.BadgeStyle) {
type = 'Badge Style';
}
return type;
}
getTypeName(styledColumn) {
let type = null;
if (styledColumn.GradientStyle) {
type = 'styled-column-gradient-edit';
}
else if (styledColumn.PercentBarStyle) {
type = 'styled-column-percent-bar-edit';
}
else if (styledColumn.SparklineStyle) {
type = 'styled-column-sparkline-edit';
}
else if (styledColumn.BadgeStyle) {
type = 'styled-column-badge-edit';
}
return type;
}
}
exports.StyledColumnModule = StyledColumnModule;