[公开]中共北京市委党校2026年-2028年互联网接入服务采购项目中标结果公告

020/mini-project

/src/components/Contact/Contact.js
import React from 'react'
import { Card, Button, message } from 'antd'
import { Link } from 'react-router-dom'
import { useState } from 'react'
import './style.css'
import axios from 'axios'

function Home() {
const [user, setUser] = useState({
username: '',
email: '',
password: '',
})

const handleChange = (e) => {
const { name, value } = e.target
setUser((prevState) => ({
...prevState,
[name]: value,
}))
}

const handleSubmit = (e) => {
e.preventDefault()
const { username, email, password } = user

if (!username || !email || !password) {
message.error('Please fill in all the fields.')
return
}

axios
.post('http://localhost:8000/api/v1/register', user)
.then((res) => {
message.success('Register successfully!')
setUser({
username: '',
email: '',
password: '',
})
})
.catch((err) => {
message.error('Register failed.')
})
}

return (
<div className="home">
<div className="home__container">
<div className="home__header">
<img
className="home__header__logo"
src="https://cdn-icons-png.flaticon.com/512/284/284645.png"
alt=""
/>
<h1>Mini Project</h1>
</div>
<div className="home__form">
<Card title="Register" bordered={false}>
<form onSubmit={handleSubmit}>
<div>
<label htmlFor="username">Username</label>
<input
type="text"
name="username"
placeholder="Username"
value={user.username}
onChange={handleChange}
required
/>
</div>
<div>
<label htmlFor="email">Email</label>
<input
type="email"
name="email"
placeholder="Email"
value={user.email}
onChange={handleChange}
required
/>
</div>
<div>
<label htmlFor="password">Password</label>
<input
type="password"
name="password"
placeholder="Password"
value={user.password}
onChange={handleChange}
required
/>
</div>
<div>
<Button type="primary" htmlType="submit">
Register
</Button>
</div>
</form>
</Card>
<div className="home__form__text">
Already have an account?
<Link to="/login" className="home__form__text__link">
Login
</Link>
</div>
</div>
</div>
</div>
)
}

export default Home

/src/components/Header/Header.js
import React from 'react'
import { Link } from 'react-router-dom'
import './style.css'

const Header = () => {
return (
<header className="header">
<div className="header__container">
<Link to="/">
<img
className="header__logo"
src="https://cdn-icons-png.flaticon.com/512/284/284645.png"
alt=""
/>
</Link>
<Link to="/contact">
<div className="header__contact">Contact</div>
</Link>
<Link to="/about">
<div className="header__about">About</div>
</Link>
<Link to="/login">
<div className="header__login">Login</div>
</Link>
</div>
</header>
)
}

export default Header

/src/components/About/About.js
import React from 'react'
import { Card, Button, message } from 'antd'
import { Link } from 'react-router-dom'
import { useState } from 'react'
import axios from 'axios'

function About() {
const [user, setUser] = useState({
username: '',
email: '',
password: '',
})

const handleChange = (e) => {
const { name, value } = e.target
setUser((prevState) => ({
...prevState,
[name]: value,
}))
}

const handleSubmit = (e) => {
e.preventDefault()
const { username, email, password } = user

if (!username || !email || !password) {
message.error('Please fill in all the fields.')
return
}

axios
.post('http://localhost:8000/api/v1/register', user)
.then((res) => {
message.success('Register successfully!')
setUser({
username: '',
email: '',
password: '',
})
})
.catch((err) => {
message.error('Register failed.')
})
}

return (
<div className="about">
<div className="about__container">
<Card title="Register" bordered={false}>
<form onSubmit={handleSubmit}>
<div>
<label htmlFor="username">Username</label>
<input
type="text"
name="username"
placeholder="Username"
value={user.username}
onChange={handleChange}
required
/>
</div>
<div>
<label htmlFor="email">Email</label>
<input
type="email"
name="email"
placeholder="