mirror of
https://github.com/s-frick/effigenix.git
synced 2026-03-28 12:09:35 +01:00
feat(tui): Edit-Screen für Lagerort-Bearbeitung (Name, Temperaturbereich)
StorageLocationEditScreen mit Formular für Name und Temperaturbereich. StorageType wird als immutable angezeigt. Erreichbar über [Bearbeiten] im DetailScreen. Vervollständigt Story 1.2 im Frontend.
This commit is contained in:
parent
614f3ece30
commit
5020df5d93
6 changed files with 192 additions and 4 deletions
|
|
@ -36,6 +36,7 @@ import { InventoryMenu } from './components/inventory/InventoryMenu.js';
|
||||||
import { StorageLocationListScreen } from './components/inventory/StorageLocationListScreen.js';
|
import { StorageLocationListScreen } from './components/inventory/StorageLocationListScreen.js';
|
||||||
import { StorageLocationCreateScreen } from './components/inventory/StorageLocationCreateScreen.js';
|
import { StorageLocationCreateScreen } from './components/inventory/StorageLocationCreateScreen.js';
|
||||||
import { StorageLocationDetailScreen } from './components/inventory/StorageLocationDetailScreen.js';
|
import { StorageLocationDetailScreen } from './components/inventory/StorageLocationDetailScreen.js';
|
||||||
|
import { StorageLocationEditScreen } from './components/inventory/StorageLocationEditScreen.js';
|
||||||
import { StockBatchEntryScreen } from './components/inventory/StockBatchEntryScreen.js';
|
import { StockBatchEntryScreen } from './components/inventory/StockBatchEntryScreen.js';
|
||||||
import { AddBatchScreen } from './components/inventory/AddBatchScreen.js';
|
import { AddBatchScreen } from './components/inventory/AddBatchScreen.js';
|
||||||
// Produktion
|
// Produktion
|
||||||
|
|
@ -114,6 +115,7 @@ function ScreenRouter() {
|
||||||
{current === 'storage-location-list' && <StorageLocationListScreen />}
|
{current === 'storage-location-list' && <StorageLocationListScreen />}
|
||||||
{current === 'storage-location-create' && <StorageLocationCreateScreen />}
|
{current === 'storage-location-create' && <StorageLocationCreateScreen />}
|
||||||
{current === 'storage-location-detail' && <StorageLocationDetailScreen />}
|
{current === 'storage-location-detail' && <StorageLocationDetailScreen />}
|
||||||
|
{current === 'storage-location-edit' && <StorageLocationEditScreen />}
|
||||||
{current === 'stock-batch-entry' && <StockBatchEntryScreen />}
|
{current === 'stock-batch-entry' && <StockBatchEntryScreen />}
|
||||||
{current === 'stock-add-batch' && <AddBatchScreen />}
|
{current === 'stock-add-batch' && <AddBatchScreen />}
|
||||||
{current === 'stock-list' && <StockListScreen />}
|
{current === 'stock-list' && <StockListScreen />}
|
||||||
|
|
|
||||||
|
|
@ -10,10 +10,11 @@ import { SuccessDisplay } from '../shared/SuccessDisplay.js';
|
||||||
import { ConfirmDialog } from '../shared/ConfirmDialog.js';
|
import { ConfirmDialog } from '../shared/ConfirmDialog.js';
|
||||||
import { client } from '../../utils/api-client.js';
|
import { client } from '../../utils/api-client.js';
|
||||||
|
|
||||||
type MenuAction = 'toggle-status' | 'back';
|
type MenuAction = 'edit' | 'toggle-status' | 'back';
|
||||||
type Mode = 'menu' | 'confirm-status';
|
type Mode = 'menu' | 'confirm-status';
|
||||||
|
|
||||||
const MENU_ITEMS: { id: MenuAction; label: (loc: StorageLocationDTO) => string }[] = [
|
const MENU_ITEMS: { id: MenuAction; label: (loc: StorageLocationDTO) => string }[] = [
|
||||||
|
{ id: 'edit', label: () => '[Bearbeiten]' },
|
||||||
{ id: 'toggle-status', label: (loc) => loc.active ? '[Deaktivieren]' : '[Aktivieren]' },
|
{ id: 'toggle-status', label: (loc) => loc.active ? '[Deaktivieren]' : '[Aktivieren]' },
|
||||||
{ id: 'back', label: () => '[Zurück]' },
|
{ id: 'back', label: () => '[Zurück]' },
|
||||||
];
|
];
|
||||||
|
|
@ -23,7 +24,7 @@ function errorMessage(err: unknown): string {
|
||||||
}
|
}
|
||||||
|
|
||||||
export function StorageLocationDetailScreen() {
|
export function StorageLocationDetailScreen() {
|
||||||
const { params, back } = useNavigation();
|
const { params, back, navigate } = useNavigation();
|
||||||
const storageLocationId = params['storageLocationId'] ?? '';
|
const storageLocationId = params['storageLocationId'] ?? '';
|
||||||
const { activateStorageLocation, deactivateStorageLocation } = useStorageLocations();
|
const { activateStorageLocation, deactivateStorageLocation } = useStorageLocations();
|
||||||
|
|
||||||
|
|
@ -61,6 +62,9 @@ export function StorageLocationDetailScreen() {
|
||||||
if (!item) return;
|
if (!item) return;
|
||||||
|
|
||||||
switch (item.id) {
|
switch (item.id) {
|
||||||
|
case 'edit':
|
||||||
|
navigate('storage-location-edit', { storageLocationId: location.id });
|
||||||
|
break;
|
||||||
case 'toggle-status':
|
case 'toggle-status':
|
||||||
setMode('confirm-status');
|
setMode('confirm-status');
|
||||||
break;
|
break;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,159 @@
|
||||||
|
import React, { useCallback, useEffect, useState } from 'react';
|
||||||
|
import { Box, Text, useInput } from 'ink';
|
||||||
|
import type { StorageLocationDTO, StorageType } from '@effigenix/api-client';
|
||||||
|
import { STORAGE_TYPE_LABELS } from '@effigenix/api-client';
|
||||||
|
import { useNavigation } from '../../state/navigation-context.js';
|
||||||
|
import { useStorageLocations } from '../../hooks/useStorageLocations.js';
|
||||||
|
import { FormInput } from '../shared/FormInput.js';
|
||||||
|
import { LoadingSpinner } from '../shared/LoadingSpinner.js';
|
||||||
|
import { ErrorDisplay } from '../shared/ErrorDisplay.js';
|
||||||
|
import { client } from '../../utils/api-client.js';
|
||||||
|
|
||||||
|
type Field = 'name' | 'minTemperature' | 'maxTemperature';
|
||||||
|
const FIELDS: Field[] = ['name', 'minTemperature', 'maxTemperature'];
|
||||||
|
|
||||||
|
const FIELD_LABELS: Record<Field, string> = {
|
||||||
|
name: 'Name',
|
||||||
|
minTemperature: 'Min. Temperatur (°C)',
|
||||||
|
maxTemperature: 'Max. Temperatur (°C)',
|
||||||
|
};
|
||||||
|
|
||||||
|
function errorMessage(err: unknown): string {
|
||||||
|
return err instanceof Error ? err.message : 'Unbekannter Fehler';
|
||||||
|
}
|
||||||
|
|
||||||
|
export function StorageLocationEditScreen() {
|
||||||
|
const { params, replace, back } = useNavigation();
|
||||||
|
const storageLocationId = params['storageLocationId'] ?? '';
|
||||||
|
const { updateStorageLocation } = useStorageLocations();
|
||||||
|
|
||||||
|
const [location, setLocation] = useState<StorageLocationDTO | null>(null);
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
const [saving, setSaving] = useState(false);
|
||||||
|
const [error, setError] = useState<string | null>(null);
|
||||||
|
const [values, setValues] = useState<Record<Field, string>>({
|
||||||
|
name: '',
|
||||||
|
minTemperature: '',
|
||||||
|
maxTemperature: '',
|
||||||
|
});
|
||||||
|
const [activeField, setActiveField] = useState<Field>('name');
|
||||||
|
const [fieldErrors, setFieldErrors] = useState<Partial<Record<Field, string>>>({});
|
||||||
|
|
||||||
|
const loadLocation = useCallback(() => {
|
||||||
|
setLoading(true);
|
||||||
|
setError(null);
|
||||||
|
client.storageLocations.getById(storageLocationId)
|
||||||
|
.then((loc) => {
|
||||||
|
setLocation(loc);
|
||||||
|
setValues({
|
||||||
|
name: loc.name,
|
||||||
|
minTemperature: loc.temperatureRange?.minTemperature?.toString() ?? '',
|
||||||
|
maxTemperature: loc.temperatureRange?.maxTemperature?.toString() ?? '',
|
||||||
|
});
|
||||||
|
setLoading(false);
|
||||||
|
})
|
||||||
|
.catch((err: unknown) => { setError(errorMessage(err)); setLoading(false); });
|
||||||
|
}, [storageLocationId]);
|
||||||
|
|
||||||
|
useEffect(() => { if (storageLocationId) loadLocation(); }, [loadLocation, storageLocationId]);
|
||||||
|
|
||||||
|
const setField = (field: Field) => (value: string) => {
|
||||||
|
setValues((v) => ({ ...v, [field]: value }));
|
||||||
|
};
|
||||||
|
|
||||||
|
useInput((_input, key) => {
|
||||||
|
if (loading || saving) return;
|
||||||
|
|
||||||
|
if (key.tab || key.downArrow) {
|
||||||
|
setActiveField((f) => {
|
||||||
|
const idx = FIELDS.indexOf(f);
|
||||||
|
return FIELDS[(idx + 1) % FIELDS.length] ?? f;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (key.upArrow) {
|
||||||
|
setActiveField((f) => {
|
||||||
|
const idx = FIELDS.indexOf(f);
|
||||||
|
return FIELDS[(idx - 1 + FIELDS.length) % FIELDS.length] ?? f;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (key.escape) back();
|
||||||
|
});
|
||||||
|
|
||||||
|
const handleSubmit = async () => {
|
||||||
|
const errors: Partial<Record<Field, string>> = {};
|
||||||
|
if (!values.name.trim()) errors.name = 'Name ist erforderlich.';
|
||||||
|
setFieldErrors(errors);
|
||||||
|
if (Object.keys(errors).length > 0) return;
|
||||||
|
|
||||||
|
setSaving(true);
|
||||||
|
setError(null);
|
||||||
|
const result = await updateStorageLocation(storageLocationId, {
|
||||||
|
...(values.name.trim() ? { name: values.name.trim() } : {}),
|
||||||
|
...(values.minTemperature.trim() ? { minTemperature: values.minTemperature.trim() } : {}),
|
||||||
|
...(values.maxTemperature.trim() ? { maxTemperature: values.maxTemperature.trim() } : {}),
|
||||||
|
});
|
||||||
|
setSaving(false);
|
||||||
|
|
||||||
|
if (result) {
|
||||||
|
replace('storage-location-detail', { storageLocationId });
|
||||||
|
} else {
|
||||||
|
setError('Speichern fehlgeschlagen.');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleFieldSubmit = (field: Field) => (_value: string) => {
|
||||||
|
const idx = FIELDS.indexOf(field);
|
||||||
|
if (idx < FIELDS.length - 1) {
|
||||||
|
setActiveField(FIELDS[idx + 1] ?? field);
|
||||||
|
} else {
|
||||||
|
void handleSubmit();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (loading) return <LoadingSpinner label="Lade Lagerort..." />;
|
||||||
|
if (error && !location) return <ErrorDisplay message={error} onDismiss={back} />;
|
||||||
|
if (!location) return <Text color="red">Lagerort nicht gefunden.</Text>;
|
||||||
|
|
||||||
|
const typeName = STORAGE_TYPE_LABELS[location.storageType as StorageType] ?? location.storageType;
|
||||||
|
|
||||||
|
if (saving) {
|
||||||
|
return (
|
||||||
|
<Box flexDirection="column" alignItems="center" paddingY={2}>
|
||||||
|
<LoadingSpinner label="Lagerort wird gespeichert..." />
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Box flexDirection="column" gap={1}>
|
||||||
|
<Text color="cyan" bold>Lagerort bearbeiten: {location.name}</Text>
|
||||||
|
{error && <ErrorDisplay message={error} onDismiss={() => setError(null)} />}
|
||||||
|
|
||||||
|
<Box gap={2}>
|
||||||
|
<Text color="gray">Lagertyp:</Text>
|
||||||
|
<Text>{typeName}</Text>
|
||||||
|
<Text color="gray" dimColor>(nicht änderbar)</Text>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box flexDirection="column" gap={1} width={60}>
|
||||||
|
{FIELDS.map((field) => (
|
||||||
|
<FormInput
|
||||||
|
key={field}
|
||||||
|
label={FIELD_LABELS[field]}
|
||||||
|
value={values[field]}
|
||||||
|
onChange={setField(field)}
|
||||||
|
onSubmit={handleFieldSubmit(field)}
|
||||||
|
focus={activeField === field}
|
||||||
|
{...(fieldErrors[field] ? { error: fieldErrors[field] } : {})}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box marginTop={1}>
|
||||||
|
<Text color="gray" dimColor>
|
||||||
|
Tab/↑↓ Feld wechseln · Enter auf letztem Feld speichern · Escape Abbrechen
|
||||||
|
</Text>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -33,6 +33,7 @@ export type Screen =
|
||||||
| 'storage-location-list'
|
| 'storage-location-list'
|
||||||
| 'storage-location-create'
|
| 'storage-location-create'
|
||||||
| 'storage-location-detail'
|
| 'storage-location-detail'
|
||||||
|
| 'storage-location-edit'
|
||||||
| 'stock-batch-entry'
|
| 'stock-batch-entry'
|
||||||
| 'stock-add-batch'
|
| 'stock-add-batch'
|
||||||
| 'stock-list'
|
| 'stock-list'
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -71,7 +71,7 @@ export interface paths {
|
||||||
path?: never;
|
path?: never;
|
||||||
cookie?: never;
|
cookie?: never;
|
||||||
};
|
};
|
||||||
get?: never;
|
get: operations["getStorageLocation"];
|
||||||
put: operations["updateStorageLocation"];
|
put: operations["updateStorageLocation"];
|
||||||
post?: never;
|
post?: never;
|
||||||
delete?: never;
|
delete?: never;
|
||||||
|
|
@ -1885,6 +1885,28 @@ export interface operations {
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
getStorageLocation: {
|
||||||
|
parameters: {
|
||||||
|
query?: never;
|
||||||
|
header?: never;
|
||||||
|
path: {
|
||||||
|
id: string;
|
||||||
|
};
|
||||||
|
cookie?: never;
|
||||||
|
};
|
||||||
|
requestBody?: never;
|
||||||
|
responses: {
|
||||||
|
/** @description OK */
|
||||||
|
200: {
|
||||||
|
headers: {
|
||||||
|
[name: string]: unknown;
|
||||||
|
};
|
||||||
|
content: {
|
||||||
|
"*/*": components["schemas"]["StorageLocationResponse"];
|
||||||
|
};
|
||||||
|
};
|
||||||
|
};
|
||||||
|
};
|
||||||
updateStorageLocation: {
|
updateStorageLocation: {
|
||||||
parameters: {
|
parameters: {
|
||||||
query?: never;
|
query?: never;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue