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

New spool icon updates

Browse Source
This commit is contained in:
Donkie
2024-06-11 17:09:54 +02:00
parent e2df888e96
commit f1b27b441d
9 changed files with 71 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -241,7 +241,12 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
id: "name",
i18ncat: "filament",
color: (record: IFilamentCollapsed) =>
record.multi_color_hexes ? record.multi_color_hexes.split(",") : record.color_hex,
record.multi_color_hexes
? {
colors: record.multi_color_hexes.split(","),
vertical: record.multi_color_direction === "longitudinal",
}
: record.color_hex,
filterValueQuery: useSpoolmanFilamentNames(),
}),
FilteredQueryColumn({

10
client/src/pages/filaments/show.tsx
View File

@@ -11,6 +11,7 @@ import { useNavigate } from "react-router-dom";
import { EntityType, useGetFields } from "../../utils/queryFields";
import { ExtraFieldDisplay } from "../../components/extraFields";
import { useCurrency } from "../../utils/settings";
import SpoolIcon from "../../components/spoolIcon";
dayjs.extend(utc);
const { Title } = Typography;
@@ -49,6 +50,13 @@ export const FilamentShow: React.FC<IResourceComponentsProps> = () => {
navigate(URL);
};
const colorObj = record?.multi_color_hexes
? {
colors: record.multi_color_hexes.split(","),
vertical: record.multi_color_direction === "longitudinal",
}
: record?.color_hex;
return (
<Show
isLoading={isLoading}
@@ -80,7 +88,7 @@ export const FilamentShow: React.FC<IResourceComponentsProps> = () => {
<Title level={5}>{t("filament.fields.name")}</Title>
<TextField value={record?.name} />
<Title level={5}>{t("filament.fields.color_hex")}</Title>
<TextField value={record?.color_hex} />
{colorObj && <SpoolIcon color={colorObj} size="large" />}
<Title level={5}>{t("filament.fields.material")}</Title>
<TextField value={record?.material} />
<Title level={5}>{t("filament.fields.price")}</Title>

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

@@ -344,7 +344,10 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
i18nkey: "spool.fields.filament_name",
color: (record: ISpoolCollapsed) =>
record.filament.multi_color_hexes
? record.filament.multi_color_hexes.split(",")
? {
colors: record.filament.multi_color_hexes.split(","),
vertical: record.filament.multi_color_direction === "longitudinal",
}
: record.filament.color_hex,
dataId: "filament.combined_name",
filterValueQuery: useSpoolmanFilamentFilter(),

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

@@ -11,6 +11,7 @@ import { IFilament } from "../filaments/model";
import { EntityType, useGetFields } from "../../utils/queryFields";
import { ExtraFieldDisplay } from "../../components/extraFields";
import { useCurrency } from "../../utils/settings";
import SpoolIcon from "../../components/spoolIcon";
dayjs.extend(utc);
@@ -66,12 +67,19 @@ export const SpoolShow: React.FC<IResourceComponentsProps> = () => {
});
};
const colorObj = record?.filament.multi_color_hexes
? {
colors: record.filament.multi_color_hexes.split(","),
vertical: record.filament.multi_color_direction === "longitudinal",
}
: record?.filament.color_hex;
return (
<Show isLoading={isLoading} title={record ? formatTitle(record) : ""}>
<Title level={5}>{t("spool.fields.id")}</Title>
<NumberField value={record?.id ?? ""} />
<Title level={5}>{t("spool.fields.filament")}</Title>
<TextField value={record ? filamentURL(record?.filament) : ""} />
{colorObj && <SpoolIcon color={colorObj} />} <TextField value={record ? filamentURL(record?.filament) : ""} />
<Title level={5}>{t("spool.fields.price")}</Title>
<NumberField
value={record ? spoolPrice(record) : ""}