Add test start, end date and test station to the next gen UI (#6883)

* Add test start, end date and test station to the next gen UI

* [PUI]Add new test fields to the forms too

* Fix review comments

* Fix review comments #2

src/frontend/src/components/forms/fields/ApiFormField.tsx

@@ -64,6 +64,7 @@ export type ApiFormFieldType = {
     | 'string'
     | 'boolean'
     | 'date'
+    | 'datetime'
     | 'integer'
     | 'decimal'
     | 'float'
@@ -215,6 +216,7 @@ export function ApiFormField({
           />
         );
       case 'date':
+      case 'datetime':
         return <DateField controller={controller} definition={definition} />;
       case 'integer':
       case 'decimal':

src/frontend/src/components/forms/fields/DateField.tsx

@@ -1,9 +1,13 @@
 import { DateInput } from '@mantine/dates';
+import dayjs from 'dayjs';
+import customParseFormat from 'dayjs/plugin/customParseFormat';
 import { useCallback, useId, useMemo } from 'react';
 import { FieldValues, UseControllerReturn } from 'react-hook-form';
 
 import { ApiFormFieldType } from './ApiFormField';
 
+dayjs.extend(customParseFormat);
+
 export default function DateField({
   controller,
   definition
@@ -18,13 +22,16 @@ export default function DateField({
     fieldState: { error }
   } = controller;
 
+  const valueFormat =
+    definition.field_type == 'date' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss';
+
   const onChange = useCallback(
     (value: any) => {
       // Convert the returned date object to a string
       if (value) {
         value = value.toString();
         let date = new Date(value);
-        value = date.toISOString().split('T')[0];
+        value = dayjs(value).format(valueFormat);
       }
 
       field.onChange(value);
@@ -50,7 +57,7 @@ export default function DateField({
       value={dateValue}
       clearable={!definition.required}
       onChange={onChange}
-      valueFormat="YYYY-MM-DD"
+      valueFormat={valueFormat}
       label={definition.label}
       description={definition.description}
       placeholder={definition.placeholder}

src/frontend/src/defaults/formatters.tsx

@@ -88,6 +88,7 @@ export function formatPriceRange(
 
 interface renderDateOptionsType {
   showTime?: boolean;
+  showSeconds?: boolean;
 }
 
 /*
@@ -106,6 +107,9 @@ export function renderDate(date: string, options: renderDateOptionsType = {}) {
 
   if (options.showTime) {
     fmt += ' HH:mm';
+    if (options.showSeconds) {
+      fmt += ':ss';
+    }
   }
 
   const m = dayjs(date);

src/frontend/src/tables/stock/StockItemTestResultTable.tsx

@@ -202,6 +202,41 @@ export default function StockItemTestResultTable({
             </Group>
           );
         }
+      },
+      {
+        accessor: 'test_station',
+        sortable: true,
+        title: t`Test station`
+      },
+      {
+        accessor: 'started_datetime',
+        sortable: true,
+        title: t`Started`,
+        render: (record: any) => {
+          return (
+            <Group position="apart">
+              {renderDate(record.started_datetime, {
+                showTime: true,
+                showSeconds: true
+              })}
+            </Group>
+          );
+        }
+      },
+      {
+        accessor: 'finished_datetime',
+        sortable: true,
+        title: t`Finished`,
+        render: (record: any) => {
+          return (
+            <Group position="apart">
+              {renderDate(record.finished_datetime, {
+                showTime: true,
+                showSeconds: true
+              })}
+            </Group>
+          );
+        }
       }
     ];
   }, [itemId]);
@@ -218,6 +253,9 @@ export default function StockItemTestResultTable({
       value: {},
       attachment: {},
       notes: {},
+      test_station: {},
+      started_datetime: {},
+      finished_datetime: {},
       stock_item: {
         value: itemId,
         hidden: true