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 | 112x 70x 560x 140x 140x 140x 140x 140x 2x 140x 140x 70x 140x 70x 70x 2x 70x 70x | import { IButton, IComponent, IDivider, IRow, IText, ITooltip } from '../../../';
import { IExportable, ITekGridExportConfig, MultiOptionParams } from '../../interfaces';
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: IComponent & IExportable) {
return `${grid.name}_export_${type}_${id}`;
}
private buildTooltip(option: MultiOptionParams, type: string, grid: IComponent & IExportable): ITooltip {
const { label } = option;
return {
name: this.formatName(`tooltip_${label}`, type, grid),
component: 'ZdTooltip',
bottom: true,
label,
children: [],
};
}
private buildButton(option: MultiOptionParams, type: string, grid: IComponent & IExportable): 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: IComponent & IExportable): IDivider {
const { label } = option;
return {
name: this.formatName(`divider_${label}`, type, grid),
component: 'ZdDivider',
cssClass: 'zd-my-1',
vertical: true,
};
}
buildComponent(grid: IComponent & IExportable) {
const { type, label, multiOption } = this.config;
const optionComponents = multiOption!.flatMap((option) => [
{
...this.buildTooltip(option, type, grid),
children: [this.buildButton(option, type, grid)],
},
this.buildDivider(option, type, grid),
]);
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;
}
}
|