Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | 1x 2x 16x 4x 4x 4x 4x 4x 2x 4x 4x 2x 4x 2x 2x 2x 2x | import { IButton, IDivider, IRow, IText, ITooltip } from '@zeedhi/common';
import { ITekGridExportConfig, MultiOptionParams, TekGrid, TekTreeGrid } from '../../../components';
import { IExportOption } from './interfaces';
export class MultiOption implements IExportOption {
private config: ITekGridExportConfig;
constructor(config: ITekGridExportConfig) {
this.config = config;
}
private formatName(id: string, type: string, grid: TekGrid | TekTreeGrid) {
return `${grid.name}_export_${type}_${id}`;
}
private buildTooltip(option: MultiOptionParams, type: string, grid: TekGrid | TekTreeGrid): ITooltip {
const { label } = option;
return {
name: this.formatName(`tooltip_${label}`, type, grid),
component: 'ZdTooltip',
bottom: true,
label: label,
children: [],
}
}
private buildButton(option: MultiOptionParams, type: string, grid: TekGrid | TekTreeGrid): IButton {
const { cssClass, label, iconName, reportParams } = option;
const { portrait: optionPortrait, rowObj } = reportParams || {};
return {
name: this.formatName(`button_${label}`, type, grid),
component: 'ZdButton',
cssClass,
icon: true,
iconName,
events: {
click: () => grid.getReport(type, optionPortrait, rowObj) as any,
},
}
}
private buildDivider(option: MultiOptionParams, type: string, grid: TekGrid | TekTreeGrid): IDivider {
const { label } = option;
return {
name: this.formatName(`divider_${label}`, type, grid),
component: 'ZdDivider',
cssClass: 'zd-my-1',
vertical: true,
};
}
buildComponent(grid: TekGrid | TekTreeGrid) {
const {
type, label, multiOption,
} = this.config;
const optionComponents = (multiOption || []).map((option) => ([
{
...this.buildTooltip(option, type, grid),
children: [
this.buildButton(option, type, grid),
],
},
this.buildDivider(option, type, grid),
]))
.flat();
optionComponents.pop();
const text: IText = {
name: this.formatName('text', type, grid),
component: 'ZdText',
cssClass: 'zd-display-flex zd-align-center zd-flex-grow-1 tek-grid-export-multioption-text',
events: {
click: ({ event }) => event?.stopPropagation(),
},
text: label || '',
};
const result: IRow = {
name: this.formatName('row', type, grid),
component: 'ZdRow',
cssClass: 'zd-display-flex zd-ma-0 zd-py-0 zd-gap-x-1 tek-grid-export-multioption-row',
children: [text, ...optionComponents],
};
return result;
}
}
|