diff --git a/src/vite-project/src/App.jsx b/src/vite-project/src/App.jsx
index ddd080c9e7cbdefb925d7997aa0ca6100979a601..22342b9cefc751e724af718a792228241c868dfb 100644
--- a/src/vite-project/src/App.jsx
+++ b/src/vite-project/src/App.jsx
@@ -46,7 +46,7 @@ function App() {
<Route path="/packagesdetailinfo/:id" element={<PackagesDetailInfo />} />
<Route path="/packagesinfofill" element={<PackagesInfoFill />} />
<Route path="/voucherinfofill" element={<VoucherInfoFill />} />
- <Route path="/packagesupdateinfo" element={<PackagesUpdateInfo />} />
+ <Route path="/packagesupdateinfo/:id" element={<PackagesUpdateInfo />} />
<Route path="/choose-voucher" element={<ChooseVoucher />} />
<Route path="/voucher-use-info" element={<VoucherUseInfo />} />
<Route path="/subs-register" element={<SubsRegister />} />
diff --git a/src/vite-project/src/components/NavbarAdmin.jsx b/src/vite-project/src/components/NavbarAdmin.jsx
index 92a0a112ab9fdb7c5bd3dc0be24d46c7d618c29b..872fb0a9ce0f053f92204c8dcef7650531b83e33 100644
--- a/src/vite-project/src/components/NavbarAdmin.jsx
+++ b/src/vite-project/src/components/NavbarAdmin.jsx
@@ -2,7 +2,7 @@ import React, {useRef, useEffect, useState} from 'react';
import { Link, useNavigate } from 'react-router-dom';
import NavbarAdminlogo from '../img/logo2.png'
-function NavbarAdmin({username}) {
+function NavbarAdmin() {
const navigate = useNavigate();
const [isOpen, setIsOpen] = useState(false);
@@ -21,6 +21,8 @@ function NavbarAdmin({username}) {
}
};
+ const username = localStorage.getItem('username');
+
return (
<nav className="bg-blue-400 p-4">
<div className="flex items-center justify-between">
@@ -60,7 +62,7 @@ function NavbarAdmin({username}) {
<Link to="/packagesinfo" className="text-black">Packages</Link>
<Link to="/voucheredit" className="text-black">Voucher</Link>
<div onClick={toggleDropdown} className="relative inline-block text-left text-black focus:outline-none hover:text-indigo-500">
- Jason
+ {username}
<div
className={`${
isDropdownOpen ? 'block' : 'hidden'
diff --git a/src/vite-project/src/components/NavbarUser.jsx b/src/vite-project/src/components/NavbarUser.jsx
index 414c939e04ac7b479360bc2d70d47d6aef80655f..5d5ec03d91dc7b2dffde9961dcd87b76d3c3bba7 100644
--- a/src/vite-project/src/components/NavbarUser.jsx
+++ b/src/vite-project/src/components/NavbarUser.jsx
@@ -2,7 +2,7 @@ import React, {useRef, useEffect, useState} from 'react';
import { Link, useNavigate } from 'react-router-dom';
import NavbarUserlogo from '../img/logo2.png'
-function NavbarUser({username}) {
+function NavbarUser() {
const navigate = useNavigate();
const [isOpen, setIsOpen] = useState(false);
@@ -21,6 +21,8 @@ function NavbarUser({username}) {
}
};
+ const username = localStorage.getItem('username');
+
return (
<nav className="bg-blue-400 p-4">
<div className="flex items-center justify-between">
@@ -60,7 +62,7 @@ function NavbarUser({username}) {
<Link to="/packagescheckout" className="text-black">Packages</Link>
<Link to="/vouchercheck" className="text-black">Voucher</Link>
<div onClick={toggleDropdown} className="relative inline-block text-left text-black focus:outline-none hover:text-indigo-500">
- Jason
+ {username}
<div
className={`${
isDropdownOpen ? 'block' : 'hidden'
diff --git a/src/vite-project/src/pages/dashboard.jsx b/src/vite-project/src/pages/dashboard.jsx
index 48b345abb8b18d9491a3611cee336c90c75877cc..6d3cf1aacbd9e3068e6e2bf5f9abecb94e4c3d1e 100644
--- a/src/vite-project/src/pages/dashboard.jsx
+++ b/src/vite-project/src/pages/dashboard.jsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect } from "react";
import { useLocation } from 'react-router-dom';
import DashboardImage from "../img/seablue.jpg";
import NavbarAdmin from '../components/NavbarAdmin.jsx'
@@ -8,12 +8,12 @@ import NavBar from '../components/Navbar';
function Dashboard() {
const location = useLocation();
- const role = "user"
-
+ const role = localStorage.getItem('role');
+ console.log(role);
return (
<>
{/* Condition based on role */}
- {role === "admin" ? <NavbarAdmin /> : <NavbarUser />}
+ {role === "Admin" ? <NavbarAdmin /> : <NavbarUser />}
<div className="landingpage">
<img src={DashboardImage} id='landingimage' alt="landingimage" className="w-full" />
<div className="titletext absolute top-72 w-full text-center">
diff --git a/src/vite-project/src/pages/login.jsx b/src/vite-project/src/pages/login.jsx
index e40c560720280dea84e85dc64ea96c06e9566225..d40c4f68124e31a46fcb88b13fb565d25f2c8685 100644
--- a/src/vite-project/src/pages/login.jsx
+++ b/src/vite-project/src/pages/login.jsx
@@ -8,28 +8,6 @@ import { isTokenAvailable } from "../components/tokenConfig.jsx";
function Login() {
const navigate = useNavigate();
const [loggedInUser, setLoggedInUser] = useState(null);
-
- const requestLogin = async () => {
- try {
- const response = await axios.post('/login', { username, password });
- const data = response.data;
- if (response.status === 200) {
- localStorage.setItem('token', data.accessToken);
- const token = localStorage.getItem('token');
- const profile = await axios.get('/profile', { headers: { authorization: `${token}` } });
- const role = profile.data.role;
- setLoggedInUser({ username });
- console.log(role);
- navigate('/dashboard', { state: { role: role } });
- } else if (response.status === 401) {
- window.alert('Username or password tidak tepat, silahkan coba lagi');
- } else {
- window.alert('Kesalahan server, silahkan coba lagi');
- }
- } catch (error) {
- console.error('Error fetching data:', error);
- }
- };
const SubmitButton = () => {
@@ -46,8 +24,9 @@ function Login() {
const profile = await axios.get('/profile', { headers: { authorization: `${token}` } });
const role = profile.data.role;
setLoggedInUser({ username });
- console.log(role);
- navigate('/dashboard');
+ localStorage.setItem('role', role);
+ localStorage.setItem('username', username);
+ navigate('/dashboard', { state: { role } });
} else if (response.status === 401) {
window.alert('Username or password tidak tepat, silahkan coba lagi');
} else {
@@ -98,4 +77,4 @@ function Login() {
);
}
-export default Login;
+export default Login;
\ No newline at end of file
diff --git a/src/vite-project/src/pages/packagesdetailadmin.jsx b/src/vite-project/src/pages/packagesdetailadmin.jsx
index b91093a4abb663c93e13ca5eb3cca173fcfa4ca8..08bf586cb7103fb25e23755b2641c235d23a7fee 100644
--- a/src/vite-project/src/pages/packagesdetailadmin.jsx
+++ b/src/vite-project/src/pages/packagesdetailadmin.jsx
@@ -8,11 +8,19 @@ function PackagesDetail() {
const { id } = useParams();
const [packageData, setPackageData] = useState(null);
const navigate = useNavigate();
- const DeleteButton = () => {
+ const DeleteButton = async () => {
const confirmation = window.confirm('Yakin mau hapus packages?');
if (confirmation) {
- console.log('Paket Perjalanan Berhasil dihapus!');
+ try {
+ await axios.delete(`/package/${id}`, {
+ headers: {
+ 'Authorization': `${localStorage.getItem('token')}`
+ }
+ });
+ } catch (error) {
+ window.alert('Error deleting package:', error);
+ }
window.alert('Paket Perjalanan Berhasil dihapus!');
navigate('/packagesinfo');
}
@@ -56,7 +64,7 @@ function PackagesDetail() {
</div>
</div>
<div class="flex space-x-4 mt-44">
- <Link to="/packagesupdateinfo" className=" bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded text-center">
+ <Link to={`/packagesupdateinfo/${id}`} className=" bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded text-center">
Update
</Link>
<button class="voucher-detail-button bg-red-500 hover:bg-red-400 text-white font-bold py-2 px-4 border-b-4 border-red-700 hover:border-red-500 rounded" onClick={DeleteButton}>
diff --git a/src/vite-project/src/pages/packagespageuser.jsx b/src/vite-project/src/pages/packagespageuser.jsx
index c5ff85aab0840ec4f09e9b7b5d256972a6bf53fa..c7fc43c0d44be11c1858850fbeca6dc79a6b8fc8 100644
--- a/src/vite-project/src/pages/packagespageuser.jsx
+++ b/src/vite-project/src/pages/packagespageuser.jsx
@@ -1,59 +1,61 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
import packages from '../img/package.png'
import NavbarUser from '../components/NavbarUser.jsx'
import { Link, useNavigate } from 'react-router-dom';
-
-const DataDummy = [
- {
- "title" : 'Package A',
- "loc" : "Bali",
- },
- {
- "title" : 'Package B',
- "loc" : "Jakarta",
- },
- {
- "title" : 'Package C',
- "loc" : "Yogyakarta",
- },
-]
+import axios from '../components/axiosConfig';
function PackagesPageUser() {
const navigate = useNavigate();
+ const [packagesData, setPackagesData] = useState([]);
const KonfirmasiButton = (index) => {
const confirmation = window.confirm('Yakin mau konfirmasi?');
if (confirmation) {
- const confirmedPackage = DataDummy[index];
- if (index === DataDummy.length - 1) {
+ const confirmedPackage = packagesData[index];
+ if (index === packagesData.length - 1) {
navigate('/subs-register');
- } else {
- console.log(`Paket Perjalanan ${confirmedPackage.title} dengan tujuan ${confirmedPackage.loc} berhasil dikonfirmasi!`);
+ } else {
window.alert('Paket Perjalanan Berhasil dikonfirmasi!');
}
}
};
+
+ useEffect(() => {
+ axios.get('/package', {
+ headers: {
+ 'Authorization': `${localStorage.getItem('token')}`
+ }
+ })
+ .then(response => {
+ setPackagesData(response.data.data);
+ console.log(response.data);
+ })
+ .catch(error => {
+ console.log('Error fetching packages data:', error);
+ });
+ }, []);
+
return (
<>
<NavbarUser/>
- <h1 class="top-2 font-sans text-4xl font-bold py-10 ml-10">
+ <h1 className="top-2 font-sans text-4xl font-bold py-10 ml-10">
Package Tersedia:
</h1>
- {DataDummy.map((item, index) => (
- <div class="bg-white rounded-xl max-w-screen-2xl p-5 pt-5 mb-6 ml-10 mr-10" key={index}>
- <div class="flex justify-between items-center">
- <div class="flex items-center">
- <img src={packages} alt="packages" class="w-16 h-16 ml-5 mr-7"/>
- <div class="ml-4">
- <h2 class="text-black text-3xl">{item.title}</h2>
- <h3 class="text-black text-xl pt-4">{item.loc}</h3>
+ {packagesData.map((item, index) => (
+ <div className="bg-white rounded-xl max-w-screen-2xl p-5 pt-5 mb-6 ml-10 mr-10" key={index}>
+ <div className="flex justify-between items-center">
+ <div className="flex items-center">
+ <img src={packages} alt="packages" className="w-16 h-16 ml-5 mr-7"/>
+ <div className="ml-4">
+ <h2 className="text-black text-3xl">{item.PackageName}</h2>
+ <h3 className="text-black text-xl pt-4">{item.PackageRoute}</h3>
</div>
</div>
- <div class="flex space-x-4">
- <Link to="/packagesdetailconfirm">
- <button class="voucher-detail-button bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded">
+ <div className="flex space-x-4">
+ <Link to={`/packagesdetailinfo/${item.PackageID}`}>
+ <button className="voucher-detail-button bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded">
Detail
</button>
</Link>
@@ -68,4 +70,4 @@ function PackagesPageUser() {
);
}
-export default PackagesPageUser;
+export default PackagesPageUser;
\ No newline at end of file
diff --git a/src/vite-project/src/pages/packagesupdateinfo.jsx b/src/vite-project/src/pages/packagesupdateinfo.jsx
index 7a940d2c2cd96c2fc83fa41279f429e46a013f04..094a9d3c0c6f6cf7caa8666af5e6dce094b2957c 100644
--- a/src/vite-project/src/pages/packagesupdateinfo.jsx
+++ b/src/vite-project/src/pages/packagesupdateinfo.jsx
@@ -1,10 +1,12 @@
import React from "react";
import NavbarAdmin from '../components/NavbarAdmin.jsx'
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, useNavigate, useParams } from 'react-router-dom';
+import axios from '../components/axiosConfig.jsx'
function PackagesUpdateFill() {
+ const {id} = useParams();
const navigate = useNavigate();
- const SubmitButton = () => {
+ const SubmitButton = async () => {
const namaPackage = document.getElementById('namaPackage').value;
const kota = document.getElementById('kota').value;
const rute = document.getElementById('rute').value;
@@ -34,8 +36,29 @@ function PackagesUpdateFill() {
console.log('Waktu Selesai:', waktuSelesai);
console.log('Harga:', harga);
console.log('Berhasil update informasi package!');
- window.alert('Informasi Package berhasil diperbaharui!');
- navigate('/packagesdetailinfo');
+ try {
+ const response = await axios.put(`/package/${id}`, {
+ PackageName: namaPackage,
+ PackageDesc: deskripsi,
+ PackageRoute: rute,
+ PackageStartDate: `${waktuMulai}T00:00:00Z`,
+ PackageEndDate: `${waktuSelesai}T00:00:00Z`,
+ City: kota,
+ Price: Number(harga)
+ }, {
+ headers: {
+ 'Authorization': `${localStorage.getItem('token')}`
+ }
+ });
+ if (response.status === 200) {
+ window.alert('Informasi Package berhasil diperbaharui!');
+ } else {
+ window.alert('Kesalahan server, silahkan coba lagi');
+ }
+ } catch (error) {
+ window.alert('Unavailable');
+ }
+ navigate(`/packagesdetailinfo/${id}`);
}
};
return (
diff --git a/src/vite-project/src/pages/subscriptionsreq.jsx b/src/vite-project/src/pages/subscriptionsreq.jsx
index 173ac445d1dea90cf0608733bfdbbb50fe942d2e..2d50b42052e955e67014b7b0e1d0a5a32c278fa7 100644
--- a/src/vite-project/src/pages/subscriptionsreq.jsx
+++ b/src/vite-project/src/pages/subscriptionsreq.jsx
@@ -3,19 +3,19 @@ import NavbarAdmin from '../components/NavbarAdmin.jsx'
const DataDummy = [
{
- "username": "user1",
- "firstName": "John",
- "lastName": "Doe",
+ "username": "bintang",
+ "firstName": "Bintang",
+ "lastName": "Hijriawan",
},
{
- "username": "user2",
- "firstName": "Johns",
- "lastName": "Does",
+ "username": "jason",
+ "firstName": "Jason",
+ "lastName": "Rivalino",
},
{
- "username": "user3",
- "firstName": "Johny",
- "lastName": "Doez",
+ "username": "malik",
+ "firstName": "Malik",
+ "lastName": "Baharsyah",
},
]
diff --git a/src/vite-project/src/pages/subslist.jsx b/src/vite-project/src/pages/subslist.jsx
index c223736a07a44c70c72d4c91c374007be5a2046b..4f0254f54802ba356295ffe05766ad847d807643 100644
--- a/src/vite-project/src/pages/subslist.jsx
+++ b/src/vite-project/src/pages/subslist.jsx
@@ -30,34 +30,6 @@ const DataDummy = [
"start": "2021-01-01",
"end": "2021-12-31"
},
- {
- "username": "user1",
- "firstName": "John",
- "lastName": "Doe",
- "start": "2021-01-01",
- "end": "2021-12-31"
- },
- {
- "username": "user1",
- "firstName": "John",
- "lastName": "Doe",
- "start": "2021-01-01",
- "end": "2021-12-31"
- },
- {
- "username": "user1",
- "firstName": "John",
- "lastName": "Doe",
- "start": "2021-01-01",
- "end": "2021-12-31"
- },
- {
- "username": "user1",
- "firstName": "John",
- "lastName": "Doe",
- "start": "2021-01-01",
- "end": "2021-12-31"
- },
]