diff --git a/frontend/src/AppRoutes.tsx b/frontend/src/AppRoutes.tsx
index 8c16a86eea5b52f9bb392b48d3de0de04e94e91a..bb20f3582147ec084811e09575485f8bfe3084e1 100644
--- a/frontend/src/AppRoutes.tsx
+++ b/frontend/src/AppRoutes.tsx
@@ -8,8 +8,8 @@ import OrderList from "./pages/OrderList";
import OrderSummary from "./pages/OrderSummary";
import PageManageOrder from "./pages/PageManageOrder";
import PageManageMenu from "./pages/PageManageMenu";
-import SignUpTenant from "./pages/SignUpTenant";
-import SignUpCashier from "./pages/SignUpCashier";
+import SignUpTenant from "./pages/RegisterTenant";
+import SignUpCashier from "./pages/RegisterPage";
import RegisterTable from "./pages/RegisterTable";
import ChooseRolePage from "./pages/RolePage";
import OrderDetails from "./pages/ManageOrderTenant";
@@ -17,6 +17,7 @@ import Summary from "./pages/ManagePayment";
import Payment from "./pages/Payment";
import ViewPaymentHistory from "./pages/ViewPaymentHistory";
import ManagePayment from "./pages/ManagePayment";
+import RegisterPage from "./pages/RegisterPage";
export default function AppRoutes() {
return (
@@ -25,8 +26,8 @@ export default function AppRoutes() {
<Route path="/role" element={<ChooseRolePage />} />
<Route path="/login" element={<LoginPage />} />
<Route path="/login/customer" element={<RegisterTable />} />
- <Route path="/signup/tenant" element={<SignUpTenant />} />
- <Route path="/signup/cashier" element={<SignUpCashier />} />
+ <Route path="/register/" element={<RegisterPage />} />
+ <Route path="/register/tenant" element={<SignUpTenant />} />
<Route path="/tenant/:tenantid" element={<TenantInfo />} />
<Route path="/cart" element={<ShoppingCart />} />
<Route path="/order/list/:tableid" element={<OrderList />} />
diff --git a/frontend/src/components/RegisterForm.tsx b/frontend/src/components/RegisterForm.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..3b410caa8ad45d17e0e4d9e000b3a084bc4da13a
--- /dev/null
+++ b/frontend/src/components/RegisterForm.tsx
@@ -0,0 +1,88 @@
+export default function RegisterForm() {
+ return (
+ <div className="relative bg-white rounded-xl px-16">
+ <div className="flex flex-col items-center justify-between mt-4 p-4 md:p-5">
+ <h1 className="text-5xl font-bold text-mealshub-orange">
+ Register
+ </h1>
+ </div>
+
+ <form action="#" className="p-4 md:p-5">
+ <div className="gap-4 mb-4">
+ <div className="my-2">
+ <label
+ htmlFor="fullname"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Full Name
+ </label>
+ <input
+ type="text"
+ name="fullname"
+ id="fullname"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Name"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="email"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Email
+ </label>
+ <input
+ type="text"
+ name="email"
+ id="email"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Email"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="username"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Username
+ </label>
+ <input
+ type="text"
+ name="username"
+ id="username"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Username"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="password"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Password
+ </label>
+ <input
+ type="text"
+ name="password"
+ id="password"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Password"
+ required
+ />
+ </div>
+ </div>
+ <div className="flex flex-col items-center justify-center">
+ <button
+ type="submit"
+ className="text-white inline-flex items-center bg-mealshub-orange hover:bg-gray-500 focus:ring-4 focus:outline-none focus:ring-blue-100 font-medium rounded-2xl text-xl px-5 py-2.5 justify-center w-full h-16 mb-8"
+ >
+ Sign Up
+ </button>
+ </div>
+ </form>
+ </div>
+ );
+}
diff --git a/frontend/src/components/RegisterTableCard.tsx b/frontend/src/components/RegisterTableCard.tsx
index c2271c407188f76dfb78296cb191a77fbff7a46b..31348f05cfbe16a39471698d532465b3bb12ee86 100644
--- a/frontend/src/components/RegisterTableCard.tsx
+++ b/frontend/src/components/RegisterTableCard.tsx
@@ -70,7 +70,7 @@ export default function RegisterTableCard() {
<select
id="category"
- className="border-2 border-mealshub-orange focus:ring-mealshub-orange focus:border-mealshub-orange text-gray-500 text-normal rounded-xl block w-full p-4"
+ className="ml-4 border-2 border-mealshub-orange focus:ring-mealshub-orange focus:border-mealshub-orange text-gray-500 text-normal rounded-xl block w-full p-4"
onChange={handleSelectNumSeat}
defaultValue={numSeat}
>
@@ -102,7 +102,7 @@ export default function RegisterTableCard() {
</div>
<select
id="category"
- className="border-2 border-mealshub-orange focus:ring-mealshub-orange focus:border-mealshub-orange text-gray-500 text-normal rounded-xl block w-full p-4"
+ className="ml-4 border-2 border-mealshub-orange focus:ring-mealshub-orange focus:border-mealshub-orange text-gray-500 text-normal rounded-xl block w-full p-4"
onChange={handleSelectIdTable}
value={idTable}
>
@@ -110,7 +110,7 @@ export default function RegisterTableCard() {
selected={true}
className="hover:bg-mealshub-orange"
>
- Number of Table
+ Table Number
</option>
<option value="1">1</option>
<option value="2">2</option>
@@ -121,7 +121,7 @@ export default function RegisterTableCard() {
</div>
<button
type="submit"
- className="w-full text-white bg-mealshub-orange font-bold text-xl rounded-full px-5 py-4 text-center shadow-xl mt-8"
+ className="w-full text-white bg-mealshub-orange font-bold text-xl rounded-full px-5 py-4 text-center shadow-xl mt-8 mt-3 hover:bg-mealshub-cream focus:ring-4 focus:outline-none focus:ring-primary-300 "
>
Get Table
</button>
diff --git a/frontend/src/components/RegisterTenantForm.tsx b/frontend/src/components/RegisterTenantForm.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..83920e50000dafa678c8373bc9cb00f8c8bfe055
--- /dev/null
+++ b/frontend/src/components/RegisterTenantForm.tsx
@@ -0,0 +1,103 @@
+export default function RegisterTenant() {
+ return (
+ <div className="relative bg-white rounded-xl px-16">
+ <div className="flex flex-col items-center justify-between mt-4 p-4 md:p-5">
+ <h1 className="text-5xl font-bold text-mealshub-orange">
+ Register
+ </h1>
+ </div>
+
+ <form action="#" className="p-4 md:p-5">
+ <div className="gap-4 mb-4">
+ <div className="my-2">
+ <label
+ htmlFor="name"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Name
+ </label>
+ <input
+ type="text"
+ name="name"
+ id="name"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Name"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="image"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Image
+ </label>
+ <input
+ type="text"
+ name="image"
+ id="image"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Image URL"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="openhour"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Open Hour
+ </label>
+ <input
+ type="text"
+ name="openhour"
+ id="openhour"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Open Hour"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="closehour"
+ className="block mb-2 text-xl font-bold text-mealshub-orange "
+ >
+ Close Hour
+ </label>
+ <input
+ type="text"
+ name="closehour"
+ id="closehour"
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14"
+ placeholder="Close Hour"
+ required
+ />
+ </div>
+ <div className="my-2">
+ <label
+ htmlFor="description"
+ className="block mb-2 text-xl font-bold text-mealshub-orange"
+ >
+ Description
+ </label>
+ <textarea
+ id="description"
+ rows={4}
+ className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5"
+ placeholder="Write your tenant description here"
+ required
+ ></textarea>
+ </div>
+ </div>
+ <div className="flex flex-col items-center justify-center">
+ <button
+ type="submit"
+ className="text-white inline-flex items-center bg-mealshub-orange hover:bg-gray-500 focus:ring-4 focus:outline-none focus:ring-blue-100 font-medium rounded-2xl text-xl px-5 py-2.5 justify-center w-full h-16 mb-8"
+ >
+ Sign Up
+ </button>
+ </div>
+ </form>
+ </div>
+ );
+}
diff --git a/frontend/src/components/SignUpCardCashier.tsx b/frontend/src/components/SignUpCardCashier.tsx
deleted file mode 100644
index 168827f49c0f062bef492d84998e436bdc33a158..0000000000000000000000000000000000000000
--- a/frontend/src/components/SignUpCardCashier.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-export default function SignUpCardCashier() {
- return (
- <div className="relative bg-white rounded-xl px-16">
- <div className="flex flex-col items-center justify-between mt-4 p-4 md:p-5" >
- <h1 className="text-5xl font-bold text-mealshub-orange">
- Register
- </h1>
- </div>
-
- <form action="#" className="p-4 md:p-5">
- <div className="gap-4 mb-4">
- <div className="my-2">
- <label htmlFor="fullname" className="block mb-2 text-xl font-bold text-mealshub-orange ">Full Name</label>
- <input type="text" name="fullname" id="fullname" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Name" required />
- </div>
- <div className="my-2">
- <label htmlFor="email" className="block mb-2 text-xl font-bold text-mealshub-orange ">Email</label>
- <input type="text" name="email" id="email" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Email" required />
- </div>
- <div className="my-2">
- <label htmlFor="password" className="block mb-2 text-xl font-bold text-mealshub-orange ">Password</label>
- <input type="text" name="password" id="password" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Password" required />
- </div>
- </div >
- <div className="flex flex-col items-center justify-center">
- <button type="submit" className="text-white inline-flex items-center bg-mealshub-orange hover:bg-gray-500 focus:ring-4 focus:outline-none focus:ring-blue-100 font-medium rounded-2xl text-xl px-5 py-2.5 justify-center w-full h-16 mb-8">
- Sign Up
- </button>
- </div>
- </form>
- </div>
- )
-}
diff --git a/frontend/src/components/SignUpCardTenant.tsx b/frontend/src/components/SignUpCardTenant.tsx
deleted file mode 100644
index c2fa7882878120be304dc535af78e68f0c2d3411..0000000000000000000000000000000000000000
--- a/frontend/src/components/SignUpCardTenant.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-export default function SignUpCardTenant() {
- return (
- <div className="relative bg-white rounded-xl px-16">
- <div className="flex flex-col items-center justify-between mt-4 p-4 md:p-5" >
- <h1 className="text-5xl font-bold text-mealshub-orange">
- Register
- </h1>
- </div>
-
- <form action="#" className="p-4 md:p-5">
- <div className="gap-4 mb-4">
- <div className="my-2">
- <label htmlFor="name" className="block mb-2 text-xl font-bold text-mealshub-orange ">Name</label>
- <input type="text" name="name" id="name" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Name" required />
- </div>
- <div className="my-2">
- <label htmlFor="openhour" className="block mb-2 text-xl font-bold text-mealshub-orange ">Open Hour</label>
- <input type="text" name="openhour" id="openhour" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Open Hour" required />
- </div>
- <div className="my-2">
- <label htmlFor="closehour" className="block mb-2 text-xl font-bold text-mealshub-orange ">Close Hour</label>
- <input type="text" name="closehour" id="closehour" className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5 h-14" placeholder="Close Hour" required />
- </div>
- <div className="my-2">
- <label htmlFor="description" className="block mb-2 text-xl font-bold text-mealshub-orange">Description</label>
- <textarea id="description" rows={4} className="font-nunito bg-white border border-mealshub-orange text-gray-900 text-m rounded-2xl focus:ring-mealshub-orange focus:border-mealshub-orange block w-96 px-4 p-2.5" placeholder="Write your tenant description here" required></textarea>
- </div>
- </div >
- <div className="flex flex-col items-center justify-center">
- <button type="submit" className="text-white inline-flex items-center bg-mealshub-orange hover:bg-gray-500 focus:ring-4 focus:outline-none focus:ring-blue-100 font-medium rounded-2xl text-xl px-5 py-2.5 justify-center w-full h-16 mb-8">
- Sign Up
- </button>
- </div>
- </form>
- </div>
- )
-}
diff --git a/frontend/src/pages/LoginPage.tsx b/frontend/src/pages/LoginPage.tsx
index 8c76b711f68e52009b78848bb1eba8dd4b965bb6..1dbeed3c2b5e0680ac1f299ca51bcae8ed3b2b41 100644
--- a/frontend/src/pages/LoginPage.tsx
+++ b/frontend/src/pages/LoginPage.tsx
@@ -35,6 +35,10 @@ export default function LoginPage() {
await login(email, password, "tenant-cashier");
};
+ const handleGoBack = () => {
+ navigate(-1);
+ };
+
return (
<div className="grid min-h-screen bg-[url('images/LoginBackground.png')]">
<div className="login-container">
@@ -74,48 +78,23 @@ export default function LoginPage() {
})}
error={errors.password}
/>
- <div className="flex items-center justify-between">
- <div className="flex items-start">
- <div className="flex items-center h-5">
- <input
- id="remember"
- aria-describedby="remember"
- type="checkbox"
- className="w-4 h-4 border border-gray-300 rounded bg-gray-50 focus:ring-3 focus:ring-primary-300"
- required={true}
- />
- </div>
- <div className="ml-3 text-sm">
- <label
- htmlFor="remember"
- className="text-gray-500"
- >
- Remember me
- </label>
- </div>
- </div>
- <a
- href="#"
- className="text-sm font-medium text-mealshub-blue hover:underline"
- >
- Forgot password?
- </a>
- </div>
<button
type="submit"
className="w-full text-white bg-mealshub-orange hover:bg-mealshub-cream focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center"
>
Login
</button>
- <p className="text-sm font-light text-gray-500">
- Don't have an account yet?{" "}
- <a
- href="#"
- className="font-medium text-mealshub-blue hover:underline"
- >
- Register
- </a>
- </p>
+ <div className="flex items-center justify-center">
+ <p className="text-sm font-light text-gray-500">
+ Don't have an account yet?{" "}
+ <a
+ href="#"
+ className="font-medium text-mealshub-blue hover:underline"
+ >
+ Register
+ </a>
+ </p>
+ </div>
</form>
</div>
<div className="p-12">
@@ -123,6 +102,12 @@ export default function LoginPage() {
</div>
</div>
</div>
+ <button
+ onClick={handleGoBack}
+ className="mt-3 bg-mealshub-orange text-white px-4 py-2 rounded-lg hover:bg-mealshub-cream focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium text-sm"
+ >
+ Go Back
+ </button>
</div>
</div>
</div>
diff --git a/frontend/src/pages/SignUpCashier.tsx b/frontend/src/pages/RegisterPage.tsx
similarity index 59%
rename from frontend/src/pages/SignUpCashier.tsx
rename to frontend/src/pages/RegisterPage.tsx
index 2afb7cade932a710747aa52faa30975bbc68b706..03a52bd60963a8d8263dfa4c1ce59388b5cd8a98 100644
--- a/frontend/src/pages/SignUpCashier.tsx
+++ b/frontend/src/pages/RegisterPage.tsx
@@ -1,23 +1,25 @@
-import SignUpCardCashier from "../components/SignUpCardCashier";
+import RegisterForm from "../components/RegisterForm";
-export default function SignUpCashier() {
+export default function RegisterPage() {
return (
<div className="grid grid-cols-2 min-h-screen">
- <div className="relative">
+ <div className="col-span-1 relative">
<img
src="../../public/images/SignUpImg.png"
alt=""
- className="opacity-50 min-h-screen min-w-full"
+ className="absolute opacity-50 h-screen min-w-full"
/>
<div className="absolute top-0 left-0 w-full h-full flex items-center justify-center flex-col">
- <h1 className="text-9xl font-bold text-white">JOIN US</h1>
+ <h1 className="text-9xl font-bold text-white drop-shadow-2xl">
+ JOIN US
+ </h1>
<span className="bg-mealshub-blue text-white font-nunito font-bold text-lg my-16 px-24 py-2">
Discover a new way to dine!
</span>
</div>
</div>
- <div className="flex items-center justify-center flex-col bg-mealshub-cream ">
- <SignUpCardCashier />
+ <div className="flex items-center justify-center bg-mealshub-cream col-span-1">
+ <RegisterForm />
</div>
</div>
);
diff --git a/frontend/src/pages/RegisterTable.tsx b/frontend/src/pages/RegisterTable.tsx
index b1bfb0dfe3258a8f4d8c33d5878bbecb5f1945ae..f73fc8572f45790b3b000c0c7c4b35f7e688808a 100644
--- a/frontend/src/pages/RegisterTable.tsx
+++ b/frontend/src/pages/RegisterTable.tsx
@@ -1,6 +1,14 @@
+import { useNavigate } from "react-router-dom";
+
import RegisterTableCard from "../components/RegisterTableCard";
export default function RegisterTable() {
+ const navigate = useNavigate();
+
+ const handleGoBack = () => {
+ navigate(-1);
+ };
+
return (
<div className="relative">
<img
@@ -12,12 +20,18 @@ export default function RegisterTable() {
<div className="grid grid-cols-2 min-h-screen relative">
<div className="relative z-10">
<div className="absolute top-0 left-0 w-full h-full flex items-center justify-center flex-col">
- <h1 className="text-7xl font-bold text-white text-center drop-shadow-2xl">
+ <h1 className="text-7xl font-bold text-white text-center drop-shadow-xl">
GET YOUR SEAT
</h1>
<span className="bg-mealshub-blue text-white font-lato font-bold text-lg my-16 px-24 py-2">
Secure Your Comfort, Reserve Your Space
</span>
+ <button
+ onClick={handleGoBack}
+ className="text-white text-lg font-lato bg-mealshub-orange px-4 py-2 rounded-md cursor-pointer"
+ >
+ Go Back
+ </button>
</div>
</div>
<div className="flex items-center justify-center z-10">
diff --git a/frontend/src/pages/RegisterTenant.tsx b/frontend/src/pages/RegisterTenant.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..6bb43122b92cefaf0d4d6930638614092a57e777
--- /dev/null
+++ b/frontend/src/pages/RegisterTenant.tsx
@@ -0,0 +1,26 @@
+import RegisterTenantForm from "../components/RegisterTenantForm";
+
+export default function RegisterTenant() {
+ return (
+ <div className="grid grid-cols-2 min-h-screen">
+ <div className="col-span-1 relative">
+ <img
+ src="../../public/images/SignUpImg.png"
+ alt=""
+ className="absolute opacity-50 h-screen min-w-full"
+ />
+ <div className="absolute top-0 left-0 w-full h-full flex items-center justify-center flex-col">
+ <h1 className="text-9xl font-bold text-white drop-shadow-2xl">
+ JOIN US
+ </h1>
+ <span className="bg-mealshub-blue text-white font-nunito font-bold text-lg my-16 px-24 py-2">
+ Discover a new way to dine!
+ </span>
+ </div>
+ </div>
+ <div className="flex items-center justify-center bg-mealshub-cream col-span-1">
+ <RegisterTenantForm />
+ </div>
+ </div>
+ );
+}
diff --git a/frontend/src/pages/SignUpTenant.tsx b/frontend/src/pages/SignUpTenant.tsx
deleted file mode 100644
index 4d9cad1cac567b44eabc6e4dcb3e737619685b02..0000000000000000000000000000000000000000
--- a/frontend/src/pages/SignUpTenant.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import SignUpCardTenant from "../components/SignUpCardTenant";
-
-export default function SignUpTenant() {
- return (
- <div className="grid grid-cols-2 min-h-screen">
- <div className="relative">
- <img src="../../public/images/SignUpImg.png" alt="" className="opacity-50 min-h-screen min-w-full" />
- <div className="absolute top-0 left-0 w-full h-full flex items-center justify-center flex-col">
- <h1 className="text-9xl font-bold text-white">JOIN US</h1>
- <span className="bg-mealshub-blue text-white font-nunito font-bold text-lg my-16 px-24 py-2">
- Discover a new way to dine!
- </span>
- </div>
- </div>
- <div className="flex items-center justify-center flex-col bg-mealshub-cream ">
- <SignUpCardTenant />
- </div>
- </div>
- )
-}
\ No newline at end of file