4

backend/src/middlewares/upload.js

@@ -6,7 +6,7 @@ const fs = require('fs');
 const maxSize = 10 * 1024 * 1024;
 
 // Ensure uploads directory exists
-const uploadDir = path.join(__dirname, '../../uploads');
+const uploadDir = path.join(__dirname, '../../uploads/documents');
 if (!fs.existsSync(uploadDir)) {
   fs.mkdirSync(uploadDir, { recursive: true });
 }

backend/src/routes/documents.js

@@ -82,7 +82,7 @@ router.post('/', processFile, wrapAsync(async (req, res) => {
     }
     // Attach file URL if file was uploaded
     if (req.file) {
-      data.fileurl = `/uploads/${req.file.filename}`;
+      data.fileurl = `/uploads/documents/${req.file.filename}`;
     }
     await DocumentsService.create(data, req.currentUser, true, link.host);
     const payload = true;
@@ -180,7 +180,7 @@ router.put('/:id', processFile, wrapAsync(async (req, res) => {
     // Attach file URL if file was uploaded
     if (req.file) {
       data.fileurl = `/uploads/${req.file.filename}`;
-    }
+      data.fileurl = `/uploads/documents/${req.file.filename}`;
     await DocumentsService.update(data, req.params.id, req.currentUser);
     res.status(200).send(true);
 }));
@@ -194,11 +194,6 @@ router.put('/:id', processFile, wrapAsync(async (req, res) => {
   *        500:
   *          description: Some server error
   */
-router.put('/:id', wrapAsync(async (req, res) => {
-  await DocumentsService.update(req.body.data, req.body.id, req.currentUser);
-  const payload = true;
-  res.status(200).send(payload);
-}));
 
 /**
   * @swagger

frontend/src/components/Documents/configureDocumentsCols.tsx

@@ -65,18 +65,20 @@ export const loadColumns = async (
             editable: true,
 
         },
-
         {
             field: 'fileurl',
-            headerName: 'Fileurl',
+            headerName: 'File',
             flex: 1,
             minWidth: 120,
             filterable: false,
             headerClassName: 'datagrid--header',
             cellClassName: 'datagrid--cell',
-
-            editable: true,
-
+            renderCell: (params: GridValueGetterParams) =>
+                params.value ? (
+                    <a href={params.value as string} download>
+                        Download
+                    </a>
+                ) : null,
         },
 
         {

frontend/src/pages/documents/documents-edit.tsx

@@ -41,6 +41,8 @@ const EditDocumentsPage = () => {
 
   }
   const [initialValues, setInitialValues] = useState(initVals)
+  const [file, setFile] = useState<File | null>(null)
+
 
   const { documents } = useAppSelector((state) => state.documents)
 
@@ -63,10 +65,13 @@ const EditDocumentsPage = () => {
           setInitialValues(newInitialVal);
       }
   }, [documents])
-
   const handleSubmit = async (data) => {
-    await dispatch(update({ id: id, data }))
-    await router.push('/documents/documents-list')
+    const formData = new FormData();
+    formData.append('title', data.title);
+    formData.append('document_type', data.document_type);
+    if (file) formData.append('file', file);
+    await dispatch(update({ id: id, data: formData }));
+    await router.push('/documents/documents-list');
   }
 
   return (
@@ -111,14 +116,24 @@ const EditDocumentsPage = () => {
         </Field>
     </FormField>
 
-    <FormField
-        label="Fileurl"
+    <FormField label="File" labelFor="file">
+      {initialValues.fileurl && (
+        <a
+          href={initialValues.fileurl}
+          download
+          className="block mb-2 text-blue-600 hover:underline"
         >
-        <Field
-            name="fileurl"
-            placeholder="Fileurl"
+          Download current file
+        </a>
+      )}
+      <input
+        id="file"
+        name="file"
+        type="file"
+        onChange={e => setFile(e.currentTarget.files ? e.currentTarget.files[0] : null)}
       />
     </FormField>
+    <BaseDivider />
 
               <BaseDivider />
               <BaseButtons>

frontend/src/pages/documents/documents-new.tsx

@@ -1,6 +1,4 @@
-import { mdiChartTimelineVariant } from '@mdi/js'
-import Head from 'next/head'
-import React, { ReactElement } from 'react'
+import React, { ReactElement, useState } from 'react';
 import CardBox from '../../components/CardBox'
 import LayoutAuthenticated from '../../layouts/Authenticated'
 import SectionMain from '../../components/SectionMain'
@@ -36,10 +34,18 @@ const initialValues = {
 const DocumentsNew = () => {
   const router = useRouter()
   const dispatch = useAppDispatch()
+  const [file, setFile] = useState<File | null>(null)
+
 
 const handleSubmit = async (data) => {
-    await dispatch(create(data))
-    await router.push('/documents/documents-list')
+  const formData = new FormData();
+  formData.append('title', data.title);
+  formData.append('document_type', data.document_type);
+  if (file) {
+    formData.append('file', file);
+  }
+  await dispatch(create(formData));
+  await router.push('/documents/documents-list');
 }
   return (
     <>
@@ -82,15 +88,16 @@ const DocumentsNew = () => {
         <option value="Plan">Plan</option>
 
       </Field>
+  <FormField label="File" labelFor="file">
+    <input
+      id="file"
+      name="file"
+      type="file"
+      onChange={e => setFile(e.currentTarget.files ? e.currentTarget.files[0] : null)}
+    />
   </FormField>
 
-  <FormField
-      label="Fileurl"
-  >
-      <Field
-          name="fileurl"
-          placeholder="Fileurl"
-      />
+  <BaseDivider />
   </FormField>
 
               <BaseDivider />

frontend/src/pages/documents/documents-view.tsx

@@ -61,7 +61,7 @@ const DocumentsView = () => {
 
                 <div className={'mb-4'}>
                     <p className={'block font-bold mb-2'}>Fileurl</p>
-                    <p>{documents?.fileurl}</p>
+                    <p><a href={documents?.fileurl} download>Download</a></p>
                 </div>
 
                 <BaseDivider />

frontend/src/stores/documents/documentsSlice.ts

@@ -65,21 +65,24 @@ export const deleteItem = createAsyncThunk('documents/deleteDocuments', async (i
     }
 })
 
-export const create = createAsyncThunk('documents/createDocuments', async (data: any, { rejectWithValue }) => {
+export const create = createAsyncThunk('documents/createDocuments', async (payload: any, { rejectWithValue }) => {
     try {
-        const result = await axios.post(
-          'documents',
-          { data }
-        )
-        return result.data
+        let result;
+        if (payload instanceof FormData) {
+            // FormData upload
+            result = await axios.post('documents', payload);
+        } else {
+            // JSON fallback
+            result = await axios.post('documents', { data: payload });
+        }
+        return result.data;
     } catch (error) {
         if (!error.response) {
             throw error;
         }
-
         return rejectWithValue(error.response.data);
     }
-})
+});
 
 export const uploadCsv = createAsyncThunk(
   'documents/uploadCsv',
@@ -108,19 +111,23 @@ export const uploadCsv = createAsyncThunk(
 
 export const update = createAsyncThunk('documents/updateDocuments', async (payload: any, { rejectWithValue }) => {
     try {
-        const result = await axios.put(
-          `documents/${payload.id}`,
-          { id: payload.id, data: payload.data }
-        )
-        return result.data
+        let result;
+        const { id, data } = payload;
+        if (data instanceof FormData) {
+            // Multipart upload
+            result = await axios.put(`documents/${id}`, data);
+        } else {
+            // JSON fallback
+            result = await axios.put(`documents/${id}`, { id, data });
+        }
+        return result.data;
     } catch (error) {
         if (!error.response) {
             throw error;
         }
-
         return rejectWithValue(error.response.data);
     }
-})
+});
 
 export const documentsSlice = createSlice({
     name: 'documents',