feature: job update

src/Main.tsx

@@ -215,6 +215,7 @@ export default function Main() {
  }
  />
  <Route path="/insertJob" element={<InsertJob />} />
+ <Route path="/editJob/:id" element={<InsertJob />} />
  <Route path="/register" element={<Register />} />
  <Route path="/authenticate" element={<Login />} />
  <Route path="/view/:id" element={<ViewOfferRequest />} />

src/components/InsertJob.tsx

@@ -7,20 +7,39 @@ import {
  Input,
  Select,
 } from '@chakra-ui/react';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import GenericService from '../service/GenericService';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import Job from '../dto/Job';
 import FileUpload from './FileUpload';
 
 export default function InserJob() {
- const [form, setForm] = useState({
+ const [form, setForm] = useState<Job>({
  title: '',
  description: '',
  price: 0,
  type: 0,
+ id: undefined,
  });
+
+ let { id } = useParams();
+
  const [files, setFiles] = useState(Array<string>);
+
+ useEffect(() => {
+ if (id) {
+ GenericService.get<Job>('api/v1/job/' + id).then((job) => {
+ setForm({
+ title: job.title,
+ description: job.description,
+ price: job.price,
+ type: job.type,
+ id: job.id,
+ });
+ });
+ }
+ }, []);
+
  const updateFormData = (evt: any) => {
  const name = evt.target.name;
  const value =
@@ -40,15 +59,28 @@ export default function InserJob() {
  type: form.type,
  images: files,
  price: form.price,
+ id: form.id,
  };
- GenericService.create<Job>('api/v1/job', data).then((data) => {
- console.log(data);
- if (form.type == 0) {
- navigate('/offers');
- } else if (form.type == 1) {
- navigate('/requests');
- }
- });
+
+ if (!form.id) {
+ GenericService.create<Job>('api/v1/job', data).then((data) => {
+ console.log(data);
+ if (form.type == 0) {
+ navigate('/offers');
+ } else if (form.type == 1) {
+ navigate('/requests');
+ }
+ });
+ } else {
+ GenericService.put<Job>('api/v1/job', form.id, data).then((data) => {
+ console.log(data);
+ if (form.type == 0) {
+ navigate('/offers');
+ } else if (form.type == 1) {
+ navigate('/requests');
+ }
+ });
+ }
  };
 
  const updateFileList = (files: Array<any>) => {

src/components/JobOffersRequests.tsx

@@ -86,6 +86,10 @@ function JobComponent({ job, deleteItem }: JobProps) {
  navigate('/view/' + id);
  };
 
+ const goToEditOfferRequest = (id: number | undefined) => {
+ navigate('/editJob/' + id);
+ };
+
  const calulateAcceptButtonLabel = () => {
  if (job.type === JobConst.TYPE_OFFER) {
  return 'Request service';
@@ -172,6 +176,14 @@ function JobComponent({ job, deleteItem }: JobProps) {
  >
  Delete
  </Button>
+ <Button
+ variant={'solid'}
+ colorScheme="green"
+ display={showUserButtons(job) ? '' : 'none'}
+ onClick={() => goToEditOfferRequest(job.id)}
+ >
+ Edit
+ </Button>
  </Box>
  </Box>
  </Flex>

src/service/GenericService.ts

@@ -122,6 +122,24 @@ export default class GenericService {
  });
  }
 
+ public static async put<T>(
+ modelName: string,
+ id: number,
+ data: T
+ ): Promise<T> {
+ return await customAxios
+ .put<T>(`${this.baseUrl}${modelName}/${id}`, data, {
+ // withCredentials: true,
+ })
+ .then(async (result: any) => {
+ let data = result.data;
+ return data;
+ })
+ .catch((err: any) => {
+ throw err;
+ });
+ }
+
  public static async delete<T>(modelName: string, id: number): Promise<T> {
  return await customAxios
  .delete(`${this.baseUrl}${modelName}/${id}`, { withCredentials: true })