diff --git a/src/api/History.ts b/src/api/History.ts index 1057526b064a5a51cc95ed5e0eda023967570a24..41c7f69f470a18caca904076bae801597ddab599 100644 --- a/src/api/History.ts +++ b/src/api/History.ts @@ -1,5 +1,6 @@ import axios from "axios"; import HistoryInterface from "../interfaces/HistoryInterface"; +import HistoryDetailInterface from "../interfaces/HistoryDetailInterface"; const REST_URL = "http://localhost:5000"; // TODO : using env @@ -14,3 +15,25 @@ export async function fetchHistory(username : string) { } } +export async function fetchHistoryById(historyId : number) { + try { + const API_URL = REST_URL + "/history/history/" + historyId; + const response = await axios.get<HistoryInterface>(API_URL); + return response; + } catch(err) { + alert(err); + throw err; + } +} + +export async function fetchHistoryDetails(historyId : number) { + try { + const API_URL = REST_URL + "/history/detail/" + historyId; + const response = await axios.get<HistoryDetailInterface[]>(API_URL); + return response; + } catch(err) { + alert(err); + throw err; + } +} + diff --git a/src/components/HistoryCard.tsx b/src/components/HistoryCard.tsx index 5c83e149cf2156d53d5701a17d1a833a985553dc..6e4d352af2c68bb9677d2d6d0da99a58cda83561 100644 --- a/src/components/HistoryCard.tsx +++ b/src/components/HistoryCard.tsx @@ -29,7 +29,7 @@ export default function HistoryCard({history} : paramInterface) { <CardHeader> <Heading> <LinkOverlay href={hrefLink}> - {history.address} + {history.alamat_tujuan} </LinkOverlay> </Heading> </CardHeader> @@ -40,7 +40,7 @@ export default function HistoryCard({history} : paramInterface) { Nama Pemesan </Text> <Text> - {history.customerName} + {history.nama_penerima} </Text> </Box> <Box> @@ -48,7 +48,7 @@ export default function HistoryCard({history} : paramInterface) { Ongkos Kirim </Text> <Text> - {history.salary} + {history.biaya_pengiriman} </Text> </Box> <Box> diff --git a/src/interfaces/HistoryDetailInterface.ts b/src/interfaces/HistoryDetailInterface.ts index c4403ffb9ca9e6d72bb03eff2615ccf5e5d847ce..43d5480bc5e6f2da26d192f148cecd93e0fd09b0 100644 --- a/src/interfaces/HistoryDetailInterface.ts +++ b/src/interfaces/HistoryDetailInterface.ts @@ -1,9 +1,8 @@ -import OrderDetail from "./OrderDetail" export default interface HistoryDetailInterface { - address : string - customerName : string - salary : number - rating : number - orderDetails : OrderDetail[] + id: number + history_id : number + product_name: string + quantity: number + price : number } diff --git a/src/interfaces/HistoryInterface.ts b/src/interfaces/HistoryInterface.ts index 59a10c4e1ae7fa2946f8394b503e96955ce5aef5..3a9c6b7e13ac2a8d8fd60f3934968fa72ae77b75 100644 --- a/src/interfaces/HistoryInterface.ts +++ b/src/interfaces/HistoryInterface.ts @@ -1,8 +1,10 @@ -export default interface HistoryInterface { - id : number; - address : string - customerName : string - salary : number +export default interface History { + id: number + user_id : number + alamat_tujuan : string + id_penerima : number + nama_penerima : string + biaya_pengiriman : number rating : number } diff --git a/src/pages/History.tsx b/src/pages/History.tsx index 23d65079accab97edf56d06830f99066e2f6c506..ad57adfc14341fc61c834c95592bcaf6160870c7 100644 --- a/src/pages/History.tsx +++ b/src/pages/History.tsx @@ -8,7 +8,6 @@ import { useEffect, useState } from 'react' import HistoryCard from '../components/HistoryCard'; import { getUser } from '../utils/LocalStorage'; import { getHistory } from '../utils/History'; -import { getUserDetail } from '../utils/Profile'; export default function History() { diff --git a/src/pages/HistoryDetail.tsx b/src/pages/HistoryDetail.tsx index ad6647b900ed95be78bc4193d80ed3c437885aa6..a57925740332c91c3b0f1ea886f7c7f330327664 100644 --- a/src/pages/HistoryDetail.tsx +++ b/src/pages/HistoryDetail.tsx @@ -12,38 +12,33 @@ import { Thead, Tr, } from '@chakra-ui/react' -import { useState } from 'react' +import { useEffect, useState } from 'react' +import { useParams } from 'react-router-dom'; +import HistoryInterface from '../interfaces/HistoryInterface'; +import { getHistoryById, getHistoryDetails } from '../utils/History'; import HistoryDetailInterface from '../interfaces/HistoryDetailInterface'; -// TODO : fetch data from SOAP -const dummyData : HistoryDetailInterface = { - address : "jl.ngawi", - customerName : "rusdi", - salary : 69, - rating : 0, - orderDetails : [ - { - nama_produk : "pisau cukur", - quantity : 69 - }, - { - nama_produk : "ivan gunawan", - quantity : 420 - }, - { - nama_produk : "pisau cukur 2", - quantity : 692 - }, - { - nama_produk : "ivan gunawan 2", - quantity : 4202 - }, - ] -} export default function HistoryDetail() { - const [history, setHistory] = useState<HistoryDetailInterface>(dummyData); - // TODO : implement pick history functionality + const { id } = useParams(); + const historyId= parseInt(id ? id : "0"); + const [history, setHistory] = useState<HistoryInterface>(); + const [historyDetails, setHistoryDetails] = useState<HistoryDetailInterface[]>([]); + + useEffect(() => { + const historyResponse = getHistoryById(historyId); + const detailResponse = getHistoryDetails(historyId); + + historyResponse.then((response) => { + setHistory(response); + console.log("history", response); + }); + + detailResponse.then((response) => { + setHistoryDetails(response); + console.log("detail", response); + }); + }, []); return ( <Box @@ -57,7 +52,7 @@ export default function HistoryDetail() { py={10} > <Heading p={5}> - {history.address} + {history?.alamat_tujuan} </Heading> <Stack divider={<StackDivider/>} spacing={2}> @@ -66,7 +61,7 @@ export default function HistoryDetail() { Nama Pemesan </Text> <Text> - {history.customerName} + {history?.nama_penerima} </Text> </Box> <Box> @@ -74,7 +69,7 @@ export default function HistoryDetail() { Ongkos Kirim </Text> <Text> - {history.salary} + {history?.biaya_pengiriman} </Text> </Box> <Box> @@ -82,7 +77,7 @@ export default function HistoryDetail() { Rating </Text> <Text> - {history.rating === 0 ? "Belum di rating" : history.rating} + {history?.rating === 0 ? "Belum di rating" : history?.rating} </Text> </Box> <Box> @@ -99,9 +94,9 @@ export default function HistoryDetail() { </Tr> </Thead> <Tbody> - {history.orderDetails.map((detail) => ( + {historyDetails?.map((detail) => ( <Tr> - <Td>{detail.nama_produk}</Td> + <Td>{detail.product_name}</Td> <Td>{detail.quantity}</Td> </Tr> ))} diff --git a/src/utils/History.ts b/src/utils/History.ts index 332f45b622c12f4d1a7806ccb827d1b7062e1248..f366baadb1c4cb43b414e5f34a250569025a2d63 100644 --- a/src/utils/History.ts +++ b/src/utils/History.ts @@ -1,7 +1,19 @@ -import { fetchHistory } from "../api/History"; +import { fetchHistory, fetchHistoryById, fetchHistoryDetails } from "../api/History"; export async function getHistory(username : string) { const response = await fetchHistory(username); const histories = response.data; return histories; } + +export async function getHistoryById(historyId : number) { + const response = await fetchHistoryById(historyId); + const histories = response.data; + return histories; +} + +export async function getHistoryDetails(historyId : number) { + const response = await fetchHistoryDetails(historyId); + const histories = response.data; + return histories; +}