gotthard_g/aaredb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed bug with spreadsheet import

Browse Source
This commit is contained in:
GotthardG
2024-12-10 15:18:48 +01:00
parent 996fc66d76
commit e28c8b05d4
25 changed files with 819 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/components/ShipmentForm.tsx
View File

@ -39,7 +39,10 @@ const ShipmentForm: React.FC<ShipmentFormProps> = ({ sx = {}, onCancel, refreshS
const [errorMessage, setErrorMessage] = React.useState<string | null>(null);
useEffect(() => {
OpenAPI.BASE = 'https://127.0.0.1:8000';
const isTestEnv = import.meta.env.MODE === 'test';
OpenAPI.BASE = isTestEnv
? import.meta.env.VITE_OPENAPI_BASE_TEST
: import.meta.env.VITE_OPENAPI_BASE_DEV;
const getContacts = async () => {
try {

47
frontend/src/components/UploadDialog.tsx
View File

@ -1,14 +1,6 @@
import React, { useState, useEffect, useRef } from 'react';
import {
Dialog,
DialogTitle,
DialogContent,
DialogActions,
Button,
Typography,
IconButton,
Box,
CircularProgress
Dialog, DialogTitle, DialogContent, DialogActions, Button, Typography, IconButton, Box, CircularProgress
} from '@mui/material';
import CloseIcon from '@mui/icons-material/Close';
import DownloadIcon from '@mui/icons-material/Download';
@ -17,45 +9,39 @@ import logo from '../assets/Heidi-logo.png';
import { OpenAPI, SpreadsheetService } from '../../openapi';
import type { Body_upload_file_upload_post } from '../../openapi/models/Body_upload_file_upload_post';
import SpreadsheetTable from './SpreadsheetTable';
import Modal from './Modal'; // Ensure correct import paths
import Modal from './Modal';
import * as ExcelJS from 'exceljs';
interface UploadDialogProps {
open: boolean;
onClose: () => void;
selectedShipment: any; // Adjust the type based on your implementation
selectedShipment: any;
}
const UploadDialog: React.FC<UploadDialogProps> = ({ open, onClose, selectedShipment }) => {
const [uploadError, setUploadError] = useState<string | null>(null);
const [fileSummary, setFileSummary] = useState<{
data: any[];
errors: { row: number, cell: number, value: any, message: string }[];
raw_data: { row_num: number, data: any[] }[];
dewars_count: number;
dewars: string[];
pucks_count: number;
pucks: string[];
samples_count: number;
samples: string[];
headers: string[];
} | null>(null);
const [fileBlob, setFileBlob] = useState<Blob | null>(null); // New state to store the file blob
const [fileSummary, setFileSummary] = useState<any>(null);
const [fileBlob, setFileBlob] = useState<Blob | null>(null);
const [isModalOpen, setIsModalOpen] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const fileInputRef = useRef<HTMLInputElement>(null);
useEffect(() => {
OpenAPI.BASE = 'https://127.0.0.1:8000';
const isTestEnv = import.meta.env.MODE === 'test';
OpenAPI.BASE = isTestEnv
? import.meta.env.VITE_OPENAPI_BASE_TEST
: import.meta.env.VITE_OPENAPI_BASE_DEV;
}, []);
const downloadUrl = `${OpenAPI.BASE}/download-template`;
const handleFileUpload = async (event: React.ChangeEvent<HTMLInputElement>) => {
const file = event.target.files?.[0];
if (!file) return;
setUploadError(null);
setFileSummary(null);
setFileBlob(file); // Store the file blob
setFileBlob(file);
setIsLoading(true);
if (!file.name.endsWith('.xlsx')) {
@ -68,8 +54,8 @@ const UploadDialog: React.FC<UploadDialogProps> = ({ open, onClose, selectedShip
try {
const response = await SpreadsheetService.uploadFileUploadPost(formData);
const { headers, raw_data, errors } = response;
setFileSummary({
data: raw_data,
errors: errors,
@ -82,6 +68,7 @@ const UploadDialog: React.FC<UploadDialogProps> = ({ open, onClose, selectedShip
samples_count: 23,
samples: ['Sample1', 'Sample2']
});
setIsLoading(false);
setIsModalOpen(true);
} catch (error) {
@ -115,7 +102,7 @@ const UploadDialog: React.FC<UploadDialogProps> = ({ open, onClose, selectedShip
<img src={logo} alt="Logo" style={{ width: 200, marginBottom: 16 }} />
<Typography variant="subtitle1">Latest Spreadsheet Template Version 7</Typography>
<Typography variant="body2" color="textSecondary">Last update: November 7, 2024</Typography>
<Button variant="outlined" startIcon={<DownloadIcon />} href="http://127.0.0.1:8000/download-template" download sx={{ mt: 1 }}>
<Button variant="outlined" startIcon={<DownloadIcon />} href={downloadUrl} download sx={{ mt: 1 }}>
Download XLSX
</Button>
<Typography variant="subtitle1" sx={{ mt: 3 }}>Latest Spreadsheet Instructions Version 2.3</Typography>
@ -165,8 +152,8 @@ const UploadDialog: React.FC<UploadDialogProps> = ({ open, onClose, selectedShip
headers={fileSummary.headers}
setRawData={(newRawData) => setFileSummary((prevSummary) => ({ ...prevSummary, raw_data: newRawData }))}
onCancel={handleCancel}
fileBlob={fileBlob} // Pass the original file blob
selectedShipment={selectedShipment} // Pass the selected shipment ID
fileBlob={fileBlob}
selectedShipment={selectedShipment}
/>
</Modal>
)}

15
frontend/src/pages/ShipmentView.tsx
View File

@ -6,12 +6,8 @@ import { Dewar, OpenAPI, Shipment } from '../../openapi';
import useShipments from '../hooks/useShipments';
import { Grid, Container } from '@mui/material';
// Define props for Shipments View
type ShipmentViewProps = React.PropsWithChildren<Record<string, never>>;
const API_BASE_URL = 'https://127.0.0.1:8000';
OpenAPI.BASE = API_BASE_URL;
const ShipmentView: React.FC<ShipmentViewProps> = () => {
const { shipments, error, defaultContactPerson, fetchAndSetShipments } = useShipments();
const [selectedShipment, setSelectedShipment] = useState<Shipment | null>(null);
@ -19,10 +15,13 @@ const ShipmentView: React.FC<ShipmentViewProps> = () => {
const [isCreatingShipment, setIsCreatingShipment] = useState(false);
useEffect(() => {
console.log('Updated shipments:', shipments);
}, [shipments]);
const isTestEnv = import.meta.env.MODE === 'test';
OpenAPI.BASE = isTestEnv
? import.meta.env.VITE_OPENAPI_BASE_TEST
: import.meta.env.VITE_OPENAPI_BASE_DEV;
fetchAndSetShipments();
}, []);
// Handlers for selecting shipment and canceling form
const handleSelectShipment = (shipment: Shipment | null) => {
setSelectedShipment(shipment);
setIsCreatingShipment(false);
@ -32,7 +31,6 @@ const ShipmentView: React.FC<ShipmentViewProps> = () => {
setIsCreatingShipment(false);
};
// Render the shipment content based on state
const renderShipmentContent = () => {
if (isCreatingShipment) {
return (
@ -60,7 +58,6 @@ const ShipmentView: React.FC<ShipmentViewProps> = () => {
return <div>No shipment details available.</div>;
};
// Render the main layout using Grid for layout
return (
<Container maxWidth={false} disableGutters sx={{ display: 'flex', height: '100vh' }}>
<Grid container spacing={2} sx={{ height: '100vh' }}>