generated from lucien/api-template
Compare commits
1 commit
Author | SHA1 | Date | |
---|---|---|---|
6b59a47b4e |
9 changed files with 134 additions and 620 deletions
|
@ -2,9 +2,9 @@
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Vite + React + TS</title>
|
<link rel="shortcut icon" href="bank.png" type="image/png">
|
||||||
|
<title>Tanuki's Bank</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
|
|
607
front/package-lock.json
generated
607
front/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -10,13 +10,10 @@
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@tailwindcss/vite": "^4.1.4",
|
|
||||||
"axios": "^1.8.4",
|
"axios": "^1.8.4",
|
||||||
"daisyui": "^5.0.28",
|
|
||||||
"react": "^19.0.0",
|
"react": "^19.0.0",
|
||||||
"react-dom": "^19.0.0",
|
"react-dom": "^19.0.0",
|
||||||
"react-router-dom": "^7.5.1",
|
"react-router-dom": "^7.5.1"
|
||||||
"tailwindcss": "^4.1.4"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@eslint/js": "^9.21.0",
|
"@eslint/js": "^9.21.0",
|
||||||
|
|
BIN
front/public/bank.png
Normal file
BIN
front/public/bank.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 14 KiB |
|
@ -1,49 +1,67 @@
|
||||||
|
import { useState } from "react"
|
||||||
import { Link } from "react-router-dom"
|
import { Link } from "react-router-dom"
|
||||||
import { User } from "../types"
|
import { User } from "../types"
|
||||||
|
|
||||||
export default function TopBar({ user }: { user: User | undefined }) {
|
export default function TopBar({ user }: { user: User | undefined }) {
|
||||||
|
const [burgerMenuOpen, setBurgerMenuOpen] = useState(false)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="navbar bg-base-200">
|
<div className="bank-section topbar">
|
||||||
<div className="navbar-start">
|
<div className="topbar-left">
|
||||||
<ul className="menu menu-horizontal rounded-box bg-base-300">
|
<Link to="/">Home</Link>
|
||||||
<li>
|
{user?.admin == 1 && (
|
||||||
<Link to="/" className="">Home</Link>
|
<Link to="/admin">Admin</Link>
|
||||||
</li>
|
)}
|
||||||
{user?.admin == 1 && (
|
|
||||||
<li>
|
|
||||||
<Link to="/admin" className="">Admin</Link>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="navbar-center text-xl">
|
<div className="topbar-center">
|
||||||
<h1>Tanuki's Bank</h1>
|
<h1>Tanuki's Bank</h1>
|
||||||
</div>
|
</div>
|
||||||
{user ? (
|
{user ? (
|
||||||
<div className="navbar-end">
|
<div className="topbar-right">
|
||||||
<div className="flex items-center gap-3">
|
<span>{user.name}</span>
|
||||||
<span>{user.name}</span>
|
<button onClick={() => {
|
||||||
<button className="btn bg-accent" onClick={() => {
|
localStorage.removeItem("token")
|
||||||
localStorage.removeItem("token")
|
window.location.reload()
|
||||||
window.location.reload()
|
}}>
|
||||||
}}>
|
Logout
|
||||||
Logout
|
</button>
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="navbar-end">
|
<div className="topbar-right">
|
||||||
<ul className="menu menu-horizontal rounded-box bg-base-300">
|
<Link to="/login">Login</Link>
|
||||||
<li>
|
<Link to="/register">Register</Link>
|
||||||
<Link to="/login" className="">Login</Link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<Link to="/register" className="">Register</Link>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
<div className="burger-menu">
|
||||||
|
{burgerMenuOpen && (
|
||||||
|
<div className="burger-menu-content">
|
||||||
|
<Link to="/">Home</Link>
|
||||||
|
{user?.admin == 1 && (
|
||||||
|
<Link to="/admin">Admin</Link>
|
||||||
|
)}
|
||||||
|
{user ? (
|
||||||
|
<div className="burger-menu-user">
|
||||||
|
<span>{user.name}</span>
|
||||||
|
<button onClick={() => {
|
||||||
|
localStorage.removeItem("token")
|
||||||
|
window.location.reload()
|
||||||
|
}}>
|
||||||
|
Logout
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="burger-menu-user">
|
||||||
|
<Link to="/login">Login</Link>
|
||||||
|
<Link to="/register">Register</Link>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<button onClick={() => setBurgerMenuOpen(!burgerMenuOpen)}>
|
||||||
|
{burgerMenuOpen ? "Close" : "Menu"}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
|
@ -1,10 +1,4 @@
|
||||||
@import "tailwindcss";
|
html {
|
||||||
@plugin "daisyui" {
|
|
||||||
themes: light --default, autumn --prefersdark;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*html {
|
|
||||||
background: #2a6c9b;
|
background: #2a6c9b;
|
||||||
background: linear-gradient(167deg, rgba(42, 108, 155, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(163, 237, 83, 1) 100%);
|
background: linear-gradient(167deg, rgba(42, 108, 155, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(163, 237, 83, 1) 100%);
|
||||||
}
|
}
|
||||||
|
@ -85,4 +79,4 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 15px;
|
gap: 15px;
|
||||||
}
|
}
|
||||||
}*/
|
}
|
||||||
|
|
|
@ -31,20 +31,15 @@ export default function Login () {
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className="bank-page">
|
||||||
<TopBar user={undefined} />
|
<TopBar user={undefined} />
|
||||||
<div className="card bg-base-200 m-4">
|
<div className="bank-section">
|
||||||
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center">
|
<h1>Login</h1>
|
||||||
<div className="card-title">
|
<form onSubmit={handleSubmit}>
|
||||||
<h1>Login</h1>
|
<input type="text" id="username" name="username" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
|
||||||
</div>
|
<input type="password" id="password" name="password" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
|
||||||
<input type="text" id="username" name="username" className="input" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
|
<button type="submit" >Login</button>
|
||||||
<input type="password" id="password" name="password" className="input" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
|
|
||||||
<div className="card-actions">
|
|
||||||
<button type="submit" className="btn bg-accent" >Login</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
|
@ -46,19 +46,17 @@ export default function Register () {
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className='bank-page'>
|
||||||
<TopBar user={undefined} />
|
<TopBar user={undefined} />
|
||||||
<div className="card bg-base-200 m-4">
|
<div className='bank-section'>
|
||||||
<form onSubmit={handleSubmit} className="card-body gap-5 flex flex-col items-center">
|
<h1>Register</h1>
|
||||||
<div className='card-title'>
|
<form onSubmit={handleSubmit}>
|
||||||
<h1>Register</h1>
|
<input type="text" id="name" name="name" placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} />
|
||||||
</div>
|
<input type="text" id="lastname" name="lastname" placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} />
|
||||||
<input type="text" className='input' placeholder="Name" value={name} onChange={(e) => setName(e.target.value)} />
|
<input type="text" id="email" name="email" placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} />
|
||||||
<input type="text" className='input' placeholder="Lastname" value={lastname} onChange={(e) => setLastname(e.target.value)} />
|
<input type="text" id="numero" name="numero" placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} />
|
||||||
<input type="text" className='input' placeholder="Email" value={email} onChange={(e) => setEmail(e.target.value)} />
|
<input type="password" id="password" name="password" placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
|
||||||
<input type="text" className='input' placeholder="Numero" value={numero} onChange={(e) => setNumero(e.target.value)} />
|
<button type="submit">Register</button>
|
||||||
<input type="password" className='input' placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
|
|
||||||
<button type="submit" className='btn bg-accent'>Register</button>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,10 +1,9 @@
|
||||||
import { defineConfig } from 'vite'
|
import { defineConfig } from 'vite'
|
||||||
import react from '@vitejs/plugin-react'
|
import react from '@vitejs/plugin-react'
|
||||||
import tailwindcss from '@tailwindcss/vite';
|
|
||||||
|
|
||||||
// https://vite.dev/config/
|
// https://vite.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [react(), tailwindcss()],
|
plugins: [react()],
|
||||||
server: {
|
server: {
|
||||||
proxy: {
|
proxy: {
|
||||||
'/api': {
|
'/api': {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue