2
0
mirror of https://github.com/inventree/InvenTree.git synced 2025-12-16 09:18:10 +00:00

Refactor UI table for parameter templates

This commit is contained in:
Oliver Walters
2025-11-10 13:10:38 +00:00
parent 5f067e2c50
commit 59563e7b48
4 changed files with 138 additions and 115 deletions

View File

@@ -243,5 +243,7 @@ export enum ApiEndpoints {
notes_image_upload = 'notes-image-upload/',
email_list = 'admin/email/',
email_test = 'admin/email/test/',
config_list = 'admin/config/'
config_list = 'admin/config/',
parameter_list = 'parameter/',
parameter_template_list = 'parameter/template/'
}

View File

@@ -2,21 +2,21 @@ import { t } from '@lingui/core/macro';
import { Accordion } from '@mantine/core';
import { StylishText } from '../../../../components/items/StylishText';
import PartParameterTemplateTable from '../../../../tables/part/PartParameterTemplateTable';
import ParameterTemplateTable from '../../../../tables/general/ParameterTemplateTable';
import SelectionListTable from '../../../../tables/part/SelectionListTable';
export default function PartParameterPanel() {
return (
<Accordion defaultValue='parametertemplate'>
<Accordion.Item value='parametertemplate' key='parametertemplate'>
<Accordion multiple defaultValue={['parameter-templates']}>
<Accordion.Item value='parameter-templates' key='parameter-templates'>
<Accordion.Control>
<StylishText size='lg'>{t`Part Parameter Template`}</StylishText>
<StylishText size='lg'>{t`Parameter Templates`}</StylishText>
</Accordion.Control>
<Accordion.Panel>
<PartParameterTemplateTable />
<ParameterTemplateTable />
</Accordion.Panel>
</Accordion.Item>
<Accordion.Item value='selectionlist' key='selectionlist'>
<Accordion.Item value='selection-lists' key='selection-lists'>
<Accordion.Control>
<StylishText size='lg'>{t`Selection Lists`}</StylishText>
</Accordion.Control>

View File

@@ -1,19 +1,18 @@
import { t } from '@lingui/core/macro';
import { useCallback, useMemo, useState } from 'react';
import { AddItemButton } from '@lib/components/AddItemButton';
import {
type RowAction,
AddItemButton,
ApiEndpoints,
type ApiFormFieldSet,
RowDeleteAction,
RowDuplicateAction,
RowEditAction
} from '@lib/components/RowActions';
import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
import { UserRoles } from '@lib/enums/Roles';
import { apiUrl } from '@lib/functions/Api';
RowEditAction,
UserRoles,
apiUrl
} from '@lib/index';
import type { TableFilter } from '@lib/types/Filters';
import type { ApiFormFieldSet } from '@lib/types/Forms';
import type { TableColumn } from '@lib/types/Tables';
import type { RowAction, TableColumn } from '@lib/types/Tables';
import { t } from '@lingui/core/macro';
import { useCallback, useMemo, useState } from 'react';
import { useFilters } from '../../hooks/UseFilter';
import {
useCreateApiFormModal,
useDeleteApiFormModal,
@@ -24,11 +23,113 @@ import { useUserState } from '../../states/UserState';
import { BooleanColumn, DescriptionColumn } from '../ColumnRenderers';
import { InvenTreeTable } from '../InvenTreeTable';
export default function PartParameterTemplateTable() {
const table = useTable('part-parameter-templates');
/**
* Render a table of ParameterTemplate objects
*/
export default function ParameterTemplateTable() {
const table = useTable('parameter-templates');
const user = useUserState();
const parameterTemplateFields: ApiFormFieldSet = useMemo(() => {
return {
name: {},
description: {},
units: {},
model_type: {},
choices: {},
checkbox: {},
selectionlist: {}
};
}, []);
const newTemplate = useCreateApiFormModal({
url: ApiEndpoints.parameter_template_list,
title: t`Add Parameter Template`,
table: table,
fields: useMemo(
() => ({
...parameterTemplateFields
}),
[parameterTemplateFields]
)
});
const [selectedTemplate, setSelectedTemplate] = useState<any | undefined>(
undefined
);
const duplicateTemplate = useCreateApiFormModal({
url: ApiEndpoints.parameter_template_list,
title: t`Duplicate Parameter Template`,
table: table,
fields: useMemo(
() => ({
...parameterTemplateFields
}),
[parameterTemplateFields]
),
initialData: selectedTemplate
});
const deleteTemplate = useDeleteApiFormModal({
url: ApiEndpoints.parameter_template_list,
pk: selectedTemplate?.pk,
title: t`Delete Parameter Template`,
table: table
});
const editTemplate = useEditApiFormModal({
url: ApiEndpoints.parameter_template_list,
pk: selectedTemplate?.pk,
title: t`Edit Parameter Template`,
table: table,
fields: useMemo(
() => ({
...parameterTemplateFields
}),
[parameterTemplateFields]
)
});
// Callback for row actions
const rowActions = useCallback(
(record: any): RowAction[] => {
return [
RowEditAction({
onClick: () => {
setSelectedTemplate(record);
editTemplate.open();
}
}),
RowDuplicateAction({
onClick: () => {
setSelectedTemplate(record);
duplicateTemplate.open();
}
}),
RowDeleteAction({
onClick: () => {
setSelectedTemplate(record);
deleteTemplate.open();
}
})
];
},
[user]
);
const modelTypeFilters = useFilters({
url: apiUrl(ApiEndpoints.parameter_template_list),
method: 'OPTIONS',
accessor: 'data.actions.POST.model_type.choices',
transform: (item: any) => {
return {
value: item.value,
label: item.display_name
};
}
});
const tableFilters: TableFilter[] = useMemo(() => {
return [
{
@@ -45,9 +146,15 @@ export default function PartParameterTemplateTable() {
name: 'has_units',
label: t`Has Units`,
description: t`Show templates with units`
},
{
name: 'model_type',
label: t`Model Type`,
description: t`Filter by model type`,
choices: modelTypeFilters.choices
}
];
}, []);
}, [modelTypeFilters.choices]);
const tableColumns: TableColumn[] = useMemo(() => {
return [
@@ -56,16 +163,14 @@ export default function PartParameterTemplateTable() {
sortable: true,
switchable: false
},
{
accessor: 'parts',
sortable: true,
switchable: true
},
DescriptionColumn({}),
{
accessor: 'units',
sortable: true
},
DescriptionColumn({}),
{
accessor: 'model_type'
},
BooleanColumn({
accessor: 'checkbox'
}),
@@ -75,90 +180,6 @@ export default function PartParameterTemplateTable() {
];
}, []);
const partParameterTemplateFields: ApiFormFieldSet = useMemo(() => {
return {
name: {},
description: {},
units: {},
choices: {},
checkbox: {},
selectionlist: {}
};
}, []);
const newTemplate = useCreateApiFormModal({
url: ApiEndpoints.part_parameter_template_list,
title: t`Add Parameter Template`,
table: table,
fields: useMemo(
() => ({ ...partParameterTemplateFields }),
[partParameterTemplateFields]
)
});
const [selectedTemplate, setSelectedTemplate] = useState<any | undefined>(
undefined
);
const duplicateTemplate = useCreateApiFormModal({
url: ApiEndpoints.part_parameter_template_list,
title: t`Duplicate Parameter Template`,
table: table,
fields: useMemo(
() => ({ ...partParameterTemplateFields }),
[partParameterTemplateFields]
),
initialData: selectedTemplate
});
const editTemplate = useEditApiFormModal({
url: ApiEndpoints.part_parameter_template_list,
pk: selectedTemplate?.pk,
title: t`Edit Parameter Template`,
table: table,
fields: useMemo(
() => ({ ...partParameterTemplateFields }),
[partParameterTemplateFields]
)
});
const deleteTemplate = useDeleteApiFormModal({
url: ApiEndpoints.part_parameter_template_list,
pk: selectedTemplate?.pk,
title: t`Delete Parameter Template`,
table: table
});
// Callback for row actions
const rowActions = useCallback(
(record: any): RowAction[] => {
return [
RowEditAction({
hidden: !user.hasChangeRole(UserRoles.part),
onClick: () => {
setSelectedTemplate(record);
editTemplate.open();
}
}),
RowDuplicateAction({
hidden: !user.hasAddRole(UserRoles.part),
onClick: () => {
setSelectedTemplate(record);
duplicateTemplate.open();
}
}),
RowDeleteAction({
hidden: !user.hasDeleteRole(UserRoles.part),
onClick: () => {
setSelectedTemplate(record);
deleteTemplate.open();
}
})
];
},
[user]
);
const tableActions = useMemo(() => {
return [
<AddItemButton
@@ -177,13 +198,13 @@ export default function PartParameterTemplateTable() {
{duplicateTemplate.modal}
{deleteTemplate.modal}
<InvenTreeTable
url={apiUrl(ApiEndpoints.part_parameter_template_list)}
url={apiUrl(ApiEndpoints.parameter_template_list)}
tableState={table}
columns={tableColumns}
props={{
rowActions: rowActions,
tableFilters: tableFilters,
tableActions: tableActions,
tableFilters: tableFilters,
enableDownload: true
}}
/>