Add date picker for launch and ready to order fields

This commit is contained in:
Christian Vidal Wolf
2026-04-14 17:09:12 +02:00
parent f4f69633ce
commit 78df66be24
+26 -10
View File
@@ -11,6 +11,24 @@ interface MissingDataViewProps {
onCaptureState: (message: string) => void;
}
function formatDateForInput(val: string): string {
if (!val) return '';
const parts = val.split('/');
if (parts.length === 3) {
return `${parts[2]}-${parts[1]}-${parts[0]}`;
}
return val;
}
function formatDateFromInput(val: string): string {
if (!val) return '';
const parts = val.split('-');
if (parts.length === 3) {
return `${parts[2]}/${parts[1]}/${parts[0]}`;
}
return val;
}
function formatDateValue(val: any): string {
if (val === null || val === undefined || val === '') return '';
if (typeof val === 'number') {
@@ -160,8 +178,8 @@ export function MissingDataView({ data, headers, onSaveRow, onCaptureState }: Mi
setEditing({
rowIndex,
classification: String(row[COLUMNS.CLASSIFICATION] || ''),
launchDate: launchDateCol >= 0 ? formatDateValue(row[launchDateCol]) || String(row[launchDateCol] ?? '') : '',
readyToOrder: readyToOrderCol >= 0 ? formatDateValue(row[readyToOrderCol]) || String(row[readyToOrderCol] ?? '') : '',
launchDate: launchDateCol >= 0 ? formatDateForInput(formatDateValue(row[launchDateCol]) || String(row[launchDateCol] ?? '')) : '',
readyToOrder: readyToOrderCol >= 0 ? formatDateForInput(formatDateValue(row[readyToOrderCol]) || String(row[readyToOrderCol] ?? '')) : '',
});
};
@@ -171,8 +189,8 @@ export function MissingDataView({ data, headers, onSaveRow, onCaptureState }: Mi
onCaptureState(`Updated product ${row[COLUMNS.ARTICLE_NO]}`);
const newRow = [...row];
newRow[COLUMNS.CLASSIFICATION] = editing.classification;
if (launchDateCol >= 0) newRow[launchDateCol] = editing.launchDate;
if (readyToOrderCol >= 0) newRow[readyToOrderCol] = editing.readyToOrder;
if (launchDateCol >= 0) newRow[launchDateCol] = formatDateFromInput(editing.launchDate);
if (readyToOrderCol >= 0) newRow[readyToOrderCol] = formatDateFromInput(editing.readyToOrder);
onSaveRow(editing.rowIndex, newRow);
setEditing(null);
};
@@ -411,12 +429,11 @@ export function MissingDataView({ data, headers, onSaveRow, onCaptureState }: Mi
<div className="flex flex-col gap-1.5">
<label className="text-xs font-medium text-slate-400 uppercase tracking-wider">{launchHeader}</label>
<input
type="text"
type="date"
value={editing.launchDate}
onChange={e => setEditing(prev => prev ? { ...prev, launchDate: e.target.value } : prev)}
placeholder="DD/MM/YYYY"
className={cn(
"w-full bg-slate-900 border rounded-md px-3 py-2.5 text-sm text-white font-mono focus:outline-none focus:ring-1 transition-colors",
"w-full bg-slate-900 border rounded-md px-3 py-2.5 text-sm text-white focus:outline-none focus:ring-1 transition-colors",
editing.launchDate !== (formatDateValue(editingRow[launchDateCol]) || String(editingRow[launchDateCol] ?? ''))
? "border-blue-500 focus:ring-blue-500"
: "border-slate-700 focus:border-slate-500 focus:ring-slate-500"
@@ -429,12 +446,11 @@ export function MissingDataView({ data, headers, onSaveRow, onCaptureState }: Mi
<div className="flex flex-col gap-1.5">
<label className="text-xs font-medium text-slate-400 uppercase tracking-wider">{readyHeader}</label>
<input
type="text"
type="date"
value={editing.readyToOrder}
onChange={e => setEditing(prev => prev ? { ...prev, readyToOrder: e.target.value } : prev)}
placeholder="DD/MM/YYYY"
className={cn(
"w-full bg-slate-900 border rounded-md px-3 py-2.5 text-sm text-white font-mono focus:outline-none focus:ring-1 transition-colors",
"w-full bg-slate-900 border rounded-md px-3 py-2.5 text-sm text-white focus:outline-none focus:ring-1 transition-colors",
editing.readyToOrder !== (formatDateValue(editingRow[readyToOrderCol]) || String(editingRow[readyToOrderCol] ?? ''))
? "border-blue-500 focus:ring-blue-500"
: "border-slate-700 focus:border-slate-500 focus:ring-slate-500"