Added pricing field for single spool

client/public/locales/en/common.json

@@ -134,6 +134,7 @@
             "id": "ID",
             "filament_name": "Filament",
             "filament": "Filament",
+            "price": "Price",
             "material": "Material",
             "weight_to_use": "Weight",
             "used_weight": "Used Weight",
@@ -150,6 +151,7 @@
             "archived": "Archived"
         },
         "fields_help": {
+            "price": "Price of a full spool in the system configured currency.",
             "weight_to_use": "Select what weight value to enter. Measured weight is only available if the spool weight is set for the selected filament.",
             "used_weight": "How much filament has been used from the spool. A new spool should have 0g used.",
             "remaining_weight": "How much filament is left on the spool. For a new spool this should match the spool weight.",

client/src/pages/spools/create.tsx

@@ -201,7 +201,20 @@ export const SpoolCreate: React.FC<IResourceComponentsProps & CreateOrCloneProps
             }}
           />
         </Form.Item>
-
+        <Form.Item
+          label={t("filament.fields.price")}
+          help={t("filament.fields_help.price")}
+          name={["price"]}
+          rules={[
+            {
+              required: false,
+              type: "number",
+              min: 0,
+            },
+          ]}
+        >
+                    <InputNumber precision={2} formatter={numberFormatter} parser={numberParser} />
+        </Form.Item>
         <Form.Item hidden={true} name={["used_weight"]} initialValue={0}>
           <InputNumber value={usedWeight} />
         </Form.Item>

client/src/pages/spools/edit.tsx

@@ -181,6 +181,20 @@ export const SpoolEdit: React.FC<IResourceComponentsProps> = () => {
             }}
           />
         </Form.Item>
+        <Form.Item
+          label={t("spool.fields.price")}
+          help={t("spool.fields_help.price")}
+          name={["price"]}
+          rules={[
+            {
+              required: false,
+              type: "number",
+              min: 0,
+            },
+          ]}
+        >
+          <InputNumber precision={2} formatter={numberFormatter} parser={numberParser} />
+        </Form.Item>
         <Form.Item hidden={true} name={["used_weight"]} initialValue={0}>
           <InputNumber value={usedWeight} />
         </Form.Item>

client/src/pages/spools/list.tsx

@@ -73,6 +73,7 @@ const allColumns: (keyof ISpoolCollapsed & string)[] = [
   "id",
   "combined_name",
   "filament.material",
+  "price",
   "used_weight",
   "remaining_weight",
   "used_length",
@@ -312,6 +313,14 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             filterValueQuery: useSpoolmanMaterials(),
             width: 120,
           }),
+          SortedColumn({
+            id: "price",
+            i18ncat: "spool",
+            actions,
+            dataSource,
+            tableState,
+            width: 80,
+          }),
           NumberColumn({
             id: "used_weight",
             i18ncat: "spool",

client/src/pages/spools/model.tsx

@@ -6,6 +6,7 @@ export interface ISpool {
   first_used?: string;
   last_used?: string;
   filament: IFilament;
+  price?: number;
   remaining_weight?: number;
   used_weight: number;
   remaining_length?: number;

client/src/pages/spools/show.tsx

@@ -58,6 +58,8 @@ export const SpoolShow: React.FC<IResourceComponentsProps> = () => {
       <NumberField value={record?.id ?? ""} />
       <Title level={5}>{t("spool.fields.filament")}</Title>
       <TextField value={record ? filamentURL(record?.filament) : ""} />
+      <Title level={5}>{t("spool.fields.price")}</Title>
+      <NumberField value={record?.price ?? ""} />
       <Title level={5}>{t("spool.fields.registered")}</Title>
       <DateField
         value={dayjs.utc(record?.registered).local()}