tonym/spoolman2
1
0
Fork 0
Code Issues 19 Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Added right alignment for NumberColumns and price

Browse Source 
Removed seconds from date / times
Removed decimals from spool length and weight
This commit is contained in:
Thomas Zahari
2024-07-12 16:42:26 +02:00
parent 052bdb453d
commit 7e87751caf
3 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
client/src/components/column.tsx
View File

@@ -44,6 +44,7 @@ interface BaseColumnProps<Obj extends Entity> {
i18ncat?: string; i18ncat?: string;
i18nkey?: string; i18nkey?: string;
title?: string; title?: string;
align?: AlignType;
sorter?: boolean; sorter?: boolean;
t: (key: string) => string; t: (key: string) => string;
navigate: (link: string) => void; navigate: (link: string) => void;
@@ -87,6 +88,7 @@ function Column<Obj extends Entity>(
const columnProps: ColumnType<Obj> = { const columnProps: ColumnType<Obj> = {
dataIndex: props.id, dataIndex: props.id,
align: props.align,
title: props.title ?? t(props.i18nkey ?? `${props.i18ncat}.fields.${props.id}`), title: props.title ?? t(props.i18nkey ?? `${props.i18ncat}.fields.${props.id}`),
filterMultiple: props.allowMultipleFilters ?? true, filterMultiple: props.allowMultipleFilters ?? true,
width: props.width ?? undefined, width: props.width ?? undefined,
@@ -226,6 +228,7 @@ interface NumberColumnProps<Obj extends Entity> extends BaseColumnProps<Obj> {
export function NumberColumn<Obj extends Entity>(props: NumberColumnProps<Obj>) { export function NumberColumn<Obj extends Entity>(props: NumberColumnProps<Obj>) {
return Column({ return Column({
...props, ...props,
align: 'right',
render: (rawValue) => { render: (rawValue) => {
const value = props.transform ? props.transform(rawValue) : rawValue; const value = props.transform ? props.transform(rawValue) : rawValue;
if (value === null || value === undefined) { if (value === null || value === undefined) {
@@ -255,7 +258,7 @@ export function DateColumn<Obj extends Entity>(props: BaseColumnProps<Obj>) {
hidden={!value} hidden={!value}
value={dayjs.utc(value).local()} value={dayjs.utc(value).local()}
title={dayjs.utc(value).local().format()} title={dayjs.utc(value).local().format()}
format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm"
/> />
); );
}, },

5
client/src/pages/filaments/list.tsx
View File

@@ -260,6 +260,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
...commonProps, ...commonProps,
id: "price", id: "price",
i18ncat: "filament", i18ncat: "filament",
align: 'right',
width: 80, width: 80,
render: (_, obj: IFilamentCollapsed) => { render: (_, obj: IFilamentCollapsed) => {
return obj.price?.toLocaleString(undefined, { return obj.price?.toLocaleString(undefined, {
@@ -291,7 +292,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
id: "weight", id: "weight",
i18ncat: "filament", i18ncat: "filament",
unit: "g", unit: "g",
maxDecimals: 1, maxDecimals: 0,
width: 100, width: 100,
}), }),
NumberColumn({ NumberColumn({
@@ -299,7 +300,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
id: "spool_weight", id: "spool_weight",
i18ncat: "filament", i18ncat: "filament",
unit: "g", unit: "g",
maxDecimals: 1, maxDecimals: 0,
width: 100, width: 100,
}), }),
FilteredQueryColumn({ FilteredQueryColumn({

10
client/src/pages/spools/list.tsx
View File

@@ -363,6 +363,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
...commonProps, ...commonProps,
id: "price", id: "price",
i18ncat: "spool", i18ncat: "spool",
align: 'right',
width: 80, width: 80,
render: (_, obj: ISpoolCollapsed) => { render: (_, obj: ISpoolCollapsed) => {
return obj.price?.toLocaleString(undefined, { return obj.price?.toLocaleString(undefined, {
@@ -377,8 +378,9 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
...commonProps, ...commonProps,
id: "used_weight", id: "used_weight",
i18ncat: "spool", i18ncat: "spool",
align: 'right',
unit: "g", unit: "g",
maxDecimals: 1, maxDecimals: 0,
width: 110, width: 110,
}), }),
NumberColumn({ NumberColumn({
@@ -386,7 +388,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
id: "remaining_weight", id: "remaining_weight",
i18ncat: "spool", i18ncat: "spool",
unit: "g", unit: "g",
maxDecimals: 1, maxDecimals: 0,
defaultText: t("unknown"), defaultText: t("unknown"),
width: 110, width: 110,
}), }),
@@ -395,7 +397,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
id: "used_length", id: "used_length",
i18ncat: "spool", i18ncat: "spool",
unit: "mm", unit: "mm",
maxDecimals: 1, maxDecimals: 0,
width: 120, width: 120,
}), }),
NumberColumn({ NumberColumn({
@@ -403,7 +405,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
id: "remaining_length", id: "remaining_length",
i18ncat: "spool", i18ncat: "spool",
unit: "mm", unit: "mm",
maxDecimals: 1, maxDecimals: 0,
defaultText: t("unknown"), defaultText: t("unknown"),
width: 120, width: 120,
}), }),