@omniumretail/component-library 1.2.3 → 1.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle.js +1 -1
- package/dist/types/components/ResponsiveTable/index.d.ts +1 -0
- package/package.json +1 -1
- package/src/components/Questions/SingleQuestion/index.tsx +2 -2
- package/src/components/ResponsiveTable/ResponsiveTable.stories.tsx +30 -12
- package/src/components/ResponsiveTable/index.tsx +11 -4
|
@@ -46,5 +46,6 @@ export interface ResponsiveTableCustomProps extends TableProps<any> {
|
|
|
46
46
|
buttonActionMethod?: () => void;
|
|
47
47
|
buttonActionStyle?: string | ((record: any) => any);
|
|
48
48
|
cleanRowSelection?: boolean;
|
|
49
|
+
getRowActions?: (record: any) => any;
|
|
49
50
|
}
|
|
50
51
|
export declare const ResponsiveTable: (props: ResponsiveTableCustomProps) => import("react/jsx-runtime").JSX.Element;
|
package/package.json
CHANGED
|
@@ -37,7 +37,7 @@ export const SingleQuestion = ({
|
|
|
37
37
|
return Number(a.IsMultipleChoise) - Number(b.IsMultipleChoise);
|
|
38
38
|
});
|
|
39
39
|
|
|
40
|
-
const answerTypeOptions = sortedAnswerTypeOptions?.map((answerType: any
|
|
40
|
+
const answerTypeOptions = sortedAnswerTypeOptions?.map((answerType: any) => {
|
|
41
41
|
const formattedOptions = answerType.Options?.map((option: any, idx: number) => {
|
|
42
42
|
const flag = option.NeedsAction ? "🚩" : "";
|
|
43
43
|
return (
|
|
@@ -56,7 +56,7 @@ export const SingleQuestion = ({
|
|
|
56
56
|
return {
|
|
57
57
|
value: answerType.Id,
|
|
58
58
|
label: (
|
|
59
|
-
<div>{answerType?.
|
|
59
|
+
<div>{!answerType?.UseName ? formattedOptions : answerType.Name}</div>
|
|
60
60
|
),
|
|
61
61
|
};
|
|
62
62
|
});
|
|
@@ -25,23 +25,41 @@ const Template: Story<ResponsiveTableCustomProps> = (args) => {
|
|
|
25
25
|
return (record as any)?.type === "Efetivo" ? "Pog" : null;
|
|
26
26
|
};
|
|
27
27
|
|
|
28
|
-
|
|
28
|
+
const getActionsForRecord = (record: any) => {
|
|
29
|
+
return (record as any)?.role === "Gerente"
|
|
30
|
+
? [
|
|
31
|
+
{
|
|
32
|
+
key: '1', label: `${t('actions.one')}`, onClick: () => {
|
|
33
|
+
setClearRowSelection(true);
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
{ key: '2', label: `${t('actions.two')}` },
|
|
37
|
+
{
|
|
38
|
+
key: '3', label: 'label 3'
|
|
39
|
+
}
|
|
40
|
+
]
|
|
41
|
+
: [
|
|
42
|
+
{
|
|
43
|
+
key: '1', label: `${t('actions.one')}`, onClick: () => {
|
|
44
|
+
setClearRowSelection(true);
|
|
45
|
+
}
|
|
46
|
+
},
|
|
47
|
+
{ key: '2', label: `${t('actions.two')}` },
|
|
48
|
+
{
|
|
49
|
+
key: '3', label: 'label 3'
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
key: '4', label: 'label 4'
|
|
53
|
+
}
|
|
54
|
+
];
|
|
55
|
+
};
|
|
56
|
+
|
|
29
57
|
|
|
30
58
|
return <ResponsiveTable
|
|
31
59
|
scroll={{ x: 4000 }}
|
|
32
60
|
cleanRowSelection={clearRowSelection}
|
|
33
61
|
columnsSortChange={handleSortByColumnChange} paginationInfo={setPageInfo} headingTranslationsKey={'tableHeadings'} rowSelectionInfo={setRowSelectionInfo}
|
|
34
|
-
|
|
35
|
-
{
|
|
36
|
-
key: '1', label: `${t('actions.one')}`, onClick: () => {
|
|
37
|
-
setClearRowSelection(true);
|
|
38
|
-
}
|
|
39
|
-
},
|
|
40
|
-
{ key: '2', label: `${t('actions.two')}` },
|
|
41
|
-
{
|
|
42
|
-
key: '3', label: 'label 3'
|
|
43
|
-
}
|
|
44
|
-
]}
|
|
62
|
+
getRowActions={getActionsForRecord}
|
|
45
63
|
fixedColumns={[{ dataIndex: 'action', side: 'right' }]} buttonActionMethod={() => handleSortByColumnChange} buttonActionLabel={getButtonLabel} {...args}>
|
|
46
64
|
</ResponsiveTable>;
|
|
47
65
|
};
|
|
@@ -52,6 +52,7 @@ export interface ResponsiveTableCustomProps extends TableProps<any> {
|
|
|
52
52
|
buttonActionMethod?: () => void;
|
|
53
53
|
buttonActionStyle?: string | ((record: any) => any);
|
|
54
54
|
cleanRowSelection?: boolean;
|
|
55
|
+
getRowActions?: (record: any) => any;
|
|
55
56
|
}
|
|
56
57
|
|
|
57
58
|
export const ResponsiveTable = (props: ResponsiveTableCustomProps) => {
|
|
@@ -81,7 +82,8 @@ export const ResponsiveTable = (props: ResponsiveTableCustomProps) => {
|
|
|
81
82
|
buttonActionMethod,
|
|
82
83
|
buttonActionStyle,
|
|
83
84
|
buttonActionLabel,
|
|
84
|
-
cleanRowSelection
|
|
85
|
+
cleanRowSelection,
|
|
86
|
+
getRowActions
|
|
85
87
|
} = props;
|
|
86
88
|
|
|
87
89
|
const [customFilters, setCustomFilters] = useState<any>([]);
|
|
@@ -211,7 +213,12 @@ export const ResponsiveTable = (props: ResponsiveTableCustomProps) => {
|
|
|
211
213
|
ellipsis: false,
|
|
212
214
|
align: 'right',
|
|
213
215
|
render: (_: any, record: any) => {
|
|
214
|
-
|
|
216
|
+
const rowActions = getRowActions ? getRowActions(record) : null;
|
|
217
|
+
|
|
218
|
+
if ((!items?.[0] && !rowActions)) return null;
|
|
219
|
+
|
|
220
|
+
const actions = rowActions ? rowActions : items;
|
|
221
|
+
|
|
215
222
|
const buttonLabel = buttonActionLabel ? buttonActionLabel(record) : null;
|
|
216
223
|
|
|
217
224
|
const buttonClass = typeof buttonActionStyle === 'function'
|
|
@@ -224,7 +231,7 @@ export const ResponsiveTable = (props: ResponsiveTableCustomProps) => {
|
|
|
224
231
|
<Button customClass={buttonClass} onClick={() => buttonActionMethod?.()}>{buttonActionName || buttonLabel}</Button>
|
|
225
232
|
}
|
|
226
233
|
|
|
227
|
-
<Dropdown menu={{ items }}>
|
|
234
|
+
<Dropdown menu={{ items: actions }}>
|
|
228
235
|
<a>
|
|
229
236
|
<MoreOutlined style={{ color: 'var(--color-blue)', transform: 'scale(1.6)' }} />
|
|
230
237
|
</a>
|
|
@@ -234,7 +241,7 @@ export const ResponsiveTable = (props: ResponsiveTableCustomProps) => {
|
|
|
234
241
|
},
|
|
235
242
|
};
|
|
236
243
|
|
|
237
|
-
items && columns.push(columnActions as any);
|
|
244
|
+
(items || getRowActions) && columns.push(columnActions as any);
|
|
238
245
|
|
|
239
246
|
if (fixedColumns) {
|
|
240
247
|
fixedColumns.forEach((column) => {
|