mirror of
https://github.com/inventree/InvenTree.git
synced 2025-09-13 14:11:37 +00:00
[UI] Details Table Fixes (#10263)
* Remove "copy" button from link * Handle empty details group * Tweak text * Fix link in details field
This commit is contained in:
@@ -22,7 +22,7 @@ import { YesNoButton } from '@lib/components/YesNoButton';
|
|||||||
import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
|
import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
|
||||||
import { ModelType } from '@lib/enums/ModelType';
|
import { ModelType } from '@lib/enums/ModelType';
|
||||||
import { apiUrl } from '@lib/functions/Api';
|
import { apiUrl } from '@lib/functions/Api';
|
||||||
import { getDetailUrl } from '@lib/functions/Navigation';
|
import { getBaseUrl, getDetailUrl } from '@lib/functions/Navigation';
|
||||||
import { navigateToLink } from '@lib/functions/Navigation';
|
import { navigateToLink } from '@lib/functions/Navigation';
|
||||||
import type { InvenTreeIconType } from '@lib/types/Icons';
|
import type { InvenTreeIconType } from '@lib/types/Icons';
|
||||||
import { useApi } from '../../contexts/ApiContext';
|
import { useApi } from '../../contexts/ApiContext';
|
||||||
@@ -369,6 +369,10 @@ function TableAnchorValue(props: Readonly<FieldProps>) {
|
|||||||
[detailUrl]
|
[detailUrl]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const absoluteUrl = useMemo(() => {
|
||||||
|
return `/${getBaseUrl()}${detailUrl}`;
|
||||||
|
}, [detailUrl]);
|
||||||
|
|
||||||
if (!data || data.isLoading || data.isFetching) {
|
if (!data || data.isLoading || data.isFetching) {
|
||||||
return <Skeleton height={12} radius='md' />;
|
return <Skeleton height={12} radius='md' />;
|
||||||
}
|
}
|
||||||
@@ -412,7 +416,7 @@ function TableAnchorValue(props: Readonly<FieldProps>) {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{make_link ? (
|
{make_link ? (
|
||||||
<Anchor href='#' onClick={handleLinkClick}>
|
<Anchor href={absoluteUrl} onClick={handleLinkClick}>
|
||||||
<Text>{value}</Text>
|
<Text>{value}</Text>
|
||||||
</Anchor>
|
</Anchor>
|
||||||
) : (
|
) : (
|
||||||
@@ -518,6 +522,14 @@ export function DetailsTable({
|
|||||||
fields: DetailsField[];
|
fields: DetailsField[];
|
||||||
title?: string;
|
title?: string;
|
||||||
}>) {
|
}>) {
|
||||||
|
const visibleFields = useMemo(() => {
|
||||||
|
return fields.filter((field) => !field.hidden);
|
||||||
|
}, [fields]);
|
||||||
|
|
||||||
|
if (!visibleFields?.length) {
|
||||||
|
return <div />;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Paper
|
<Paper
|
||||||
p='xs'
|
p='xs'
|
||||||
@@ -528,11 +540,9 @@ export function DetailsTable({
|
|||||||
{title && <StylishText size='lg'>{title}</StylishText>}
|
{title && <StylishText size='lg'>{title}</StylishText>}
|
||||||
<Table striped verticalSpacing={5} horizontalSpacing='sm'>
|
<Table striped verticalSpacing={5} horizontalSpacing='sm'>
|
||||||
<Table.Tbody>
|
<Table.Tbody>
|
||||||
{fields
|
{visibleFields.map((field: DetailsField, index: number) => (
|
||||||
.filter((field: DetailsField) => !field.hidden)
|
<DetailsTableField field={field} item={item} key={index} />
|
||||||
.map((field: DetailsField, index: number) => (
|
))}
|
||||||
<DetailsTableField field={field} item={item} key={index} />
|
|
||||||
))}
|
|
||||||
</Table.Tbody>
|
</Table.Tbody>
|
||||||
</Table>
|
</Table>
|
||||||
</Stack>
|
</Stack>
|
||||||
|
@@ -157,9 +157,8 @@ export default function SupplierPartDetail() {
|
|||||||
type: 'link',
|
type: 'link',
|
||||||
name: 'manufacturer_part',
|
name: 'manufacturer_part',
|
||||||
model_field: 'MPN',
|
model_field: 'MPN',
|
||||||
label: t`Manufacturer Part Number`,
|
label: t`Manufacturer Part`,
|
||||||
model: ModelType.manufacturerpart,
|
model: ModelType.manufacturerpart,
|
||||||
copy: true,
|
|
||||||
icon: 'reference',
|
icon: 'reference',
|
||||||
hidden: !data.manufacturer_part
|
hidden: !data.manufacturer_part
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user