setup-members #19
31
.gitignore
vendored
31
.gitignore
vendored
@@ -22,3 +22,34 @@
|
||||
go.work
|
||||
go.work.sum
|
||||
|
||||
# ---> React & npm
|
||||
node_modules/
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# ---> NPM cache
|
||||
.npmrc
|
||||
|
||||
# ---> Webpack
|
||||
dist/
|
||||
build/
|
||||
|
||||
# ---> Babel
|
||||
.babelrc
|
||||
babel.config.js
|
||||
|
||||
# ---> ESLint
|
||||
.eslintrc
|
||||
.eslintignore
|
||||
eslintcache.js
|
||||
|
||||
# ---> Prettier
|
||||
.prettierrc
|
||||
prettierignore
|
||||
|
||||
# ---> Jest
|
||||
coverage/
|
||||
jest.config.js
|
||||
|
||||
|
||||
16425
client/package-lock.json
generated
Normal file
16425
client/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
41
client/package.json
Normal file
41
client/package.json
Normal file
@@ -0,0 +1,41 @@
|
||||
{
|
||||
"name": "go-sjles-pta-vote-client",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"dependencies": {
|
||||
"@testing-library/jest-dom": "6.9.1",
|
||||
"@testing-library/react": "16.3.2",
|
||||
"@testing-library/user-event": "14.6.1",
|
||||
"axios":"1.13.2",
|
||||
"css-loader": "7.1.2",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3",
|
||||
"react-router": "7.12.0",
|
||||
"react-scripts": "5.0.1",
|
||||
"sass-loader": "16.0.6",
|
||||
"webpack": "5.104.1",
|
||||
"webpack-cli": "6.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"typescript": "^4"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
}
|
||||
}
|
||||
12
client/public/index.html
Normal file
12
client/public/index.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>PTA Vote System</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
</html>
|
||||
14
client/src/App.css
Normal file
14
client/src/App.css
Normal file
@@ -0,0 +1,14 @@
|
||||
.App {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #282c34;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: calc(10px + 2vmin);
|
||||
color: white;
|
||||
}
|
||||
27
client/src/App.js
Normal file
27
client/src/App.js
Normal file
@@ -0,0 +1,27 @@
|
||||
import React from 'react';
|
||||
import { BrowserRouter as Router, Routes, Route } from 'react-router';
|
||||
import './App.css';
|
||||
import AdminMembersPage from './pages/AdminMembersPage';
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<Router>
|
||||
<div className="App">
|
||||
<header className="App-header">
|
||||
<h1>PTA Vote System</h1>
|
||||
{/* Add navigation link */}
|
||||
<nav>
|
||||
<a href="/admin-members">Upload Members</a>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<Routes>
|
||||
<Route path="/admin-members" element={<AdminMembersPage />} />
|
||||
</Routes>
|
||||
</main>
|
||||
</div>
|
||||
</Router>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
63
client/src/components/MembersForm.js
Normal file
63
client/src/components/MembersForm.js
Normal file
@@ -0,0 +1,63 @@
|
||||
import React, { useState } from 'react';
|
||||
import axios from '../services/api';
|
||||
|
||||
function MembersForm() {
|
||||
const [year, setYear] = useState('');
|
||||
const [file, setFile] = useState(null);
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (!year || !file) {
|
||||
alert('Both year and file are required!');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const formData = new FormData();
|
||||
formData.append('year', year);
|
||||
formData.append('members.csv', file);
|
||||
|
||||
await axios.post('/admin/members', formData, {
|
||||
headers: { 'Content-Type': 'multipart/form-data' }
|
||||
});
|
||||
|
||||
alert('Members uploaded successfully!');
|
||||
setYear('');
|
||||
setFile(null);
|
||||
} catch (error) {
|
||||
alert(`Error uploading members: ${error.response?.data.error || error.message}`);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<h1>Upload Members CSV</h1>
|
||||
<div className="form-group">
|
||||
<label htmlFor="year">Year:</label>
|
||||
<input
|
||||
type="number"
|
||||
id="year"
|
||||
value={year}
|
||||
onChange={(e) => setYear(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="members.csv">CSV File:</label>
|
||||
<input
|
||||
type="file"
|
||||
id="members.csv"
|
||||
accept=".csv"
|
||||
onChange={(e) => setFile(e.target.files[0])}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button type="submit">Upload</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
export default MembersForm;
|
||||
48
client/src/components/VoteForm.js
Normal file
48
client/src/components/VoteForm.js
Normal file
@@ -0,0 +1,48 @@
|
||||
import React, { useState } from 'react';
|
||||
import axios from 'axios';
|
||||
|
||||
function VoteForm() {
|
||||
const [email, setEmail] = useState('');
|
||||
const [voteOption, setVoteOption] = useState('');
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
try {
|
||||
await axios.post('http://localhost:8080/vote', {
|
||||
email,
|
||||
voteOption
|
||||
});
|
||||
|
||||
alert('Vote submitted successfully!');
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
alert('Error submitting vote');
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input
|
||||
type="email"
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
placeholder="Enter your email"
|
||||
required
|
||||
/>
|
||||
|
||||
<select
|
||||
value={voteOption}
|
||||
onChange={(e) => setVoteOption(e.target.value)}
|
||||
required
|
||||
>
|
||||
<option value="">Select an option</option>
|
||||
{/* Add options dynamically based on poll data */}
|
||||
</select>
|
||||
|
||||
<button type="submit">Submit Vote</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
export default VoteForm;
|
||||
11
client/src/index.js
Normal file
11
client/src/index.js
Normal file
@@ -0,0 +1,11 @@
|
||||
import React from 'react';
|
||||
import {createRoot} from 'react-dom/client';
|
||||
import './App.css';
|
||||
import App from './App';
|
||||
|
||||
const root = createRoot(document.getElementById('root'));
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
);
|
||||
13
client/src/pages/AdminMembersPage.js
Normal file
13
client/src/pages/AdminMembersPage.js
Normal file
@@ -0,0 +1,13 @@
|
||||
import React from 'react';
|
||||
import MembersForm from '../components/MembersForm';
|
||||
|
||||
function AdminMembersPage() {
|
||||
return (
|
||||
<div className="admin-members-page">
|
||||
<h1>Upload Members</h1>
|
||||
<MembersForm />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default AdminMembersPage;
|
||||
7
client/src/services/api.js
Normal file
7
client/src/services/api.js
Normal file
@@ -0,0 +1,7 @@
|
||||
import axios from 'axios';
|
||||
|
||||
const api = axios.create({
|
||||
baseURL: '/api',
|
||||
});
|
||||
|
||||
export default api;
|
||||
@@ -2,10 +2,7 @@ package db
|
||||
|
||||
import (
|
||||
"database/sql"
|
||||
"errors"
|
||||
"log"
|
||||
"os"
|
||||
"strings"
|
||||
|
||||
"go-sjles-pta-vote/server/config"
|
||||
|
||||
|
||||
@@ -102,15 +102,22 @@ func adminIDHandler(w http.ResponseWriter, r *http.Request) {
|
||||
|
||||
func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
|
||||
if r.Method == "GET" {
|
||||
filePath := "./server/templates/members.html"
|
||||
log.Printf("Serving members.html from %s", filePath)
|
||||
http.ServeFile(w, r, filePath)
|
||||
// Redirect to client's AdminMembersPage instead of serving members.html
|
||||
w.Header().Set("Location", "/admin-members")
|
||||
w.WriteHeader(http.StatusFound)
|
||||
return
|
||||
} else if r.Method == "POST" {
|
||||
var year int
|
||||
var err error
|
||||
r.ParseForm()
|
||||
|
||||
if err = r.ParseMultipartForm(10 << 20); err != nil {
|
||||
http.Error(w, "Failed to parse multipart form", http.StatusBadRequest)
|
||||
return
|
||||
}
|
||||
|
||||
if y := r.FormValue("year"); y != "" {
|
||||
year, err = strconv.Atoi(y)
|
||||
log.Printf("Parsed year: %d", year)
|
||||
if err != nil {
|
||||
http.Error(w, "Invalid year", http.StatusBadRequest)
|
||||
return
|
||||
@@ -130,8 +137,7 @@ func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
|
||||
return
|
||||
}
|
||||
|
||||
err = services.ParseMembersFromBytes(year, fileBytes)
|
||||
if err != nil {
|
||||
if err = services.ParseMembersFromBytes(year, fileBytes); err != nil {
|
||||
w.WriteHeader(http.StatusBadRequest)
|
||||
json.NewEncoder(w).Encode(map[string]string{"error": err.Error()})
|
||||
return
|
||||
@@ -144,6 +150,16 @@ func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
|
||||
}
|
||||
}
|
||||
|
||||
// Add a new handler for the client's AdminMembersPage
|
||||
func adminMembersClientHandler(w http.ResponseWriter, r *http.Request) {
|
||||
filePath := "./client/build/admin-members.html"
|
||||
if _, err := os.Stat(filePath); err == nil {
|
||||
http.ServeFile(w, r, filePath)
|
||||
} else {
|
||||
w.WriteHeader(http.StatusNotFound)
|
||||
}
|
||||
}
|
||||
|
||||
func main() {
|
||||
log.SetOutput(os.Stdout)
|
||||
log.SetFlags(log.LstdFlags | log.Lshortfile)
|
||||
@@ -161,6 +177,24 @@ func main() {
|
||||
filePath := "./server/icons/favicon.ico"
|
||||
http.ServeFile(w, r, filePath)
|
||||
})
|
||||
http.Handle("/", http.FileServer(http.Dir("./client/build")))
|
||||
|
||||
// Add this function to handle static files during development
|
||||
http.HandleFunc("/static/", func(w http.ResponseWriter, r *http.Request) {
|
||||
if r.URL.Path == "/" {
|
||||
http.ServeFile(w, r, "./client/build/index.html")
|
||||
} else {
|
||||
file := "./client/build" + r.URL.Path
|
||||
if _, err := os.Stat(file); err == nil {
|
||||
http.ServeFile(w, r, file)
|
||||
} else {
|
||||
w.WriteHeader(http.StatusNotFound)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// Add this line to handle client's AdminMembersPage
|
||||
http.HandleFunc("/admin-members", adminMembersClientHandler)
|
||||
|
||||
log.Fatal(http.ListenAndServe(":8080", nil))
|
||||
}
|
||||
|
||||
@@ -16,7 +16,7 @@ type Member struct {
|
||||
Email string
|
||||
}
|
||||
|
||||
BATCH_SIZE := 100
|
||||
const BATCH_SIZE = 100
|
||||
|
||||
func ParseMembersFromBytes(year int, fileBytes []byte) error {
|
||||
reader := csv.NewReader(strings.NewReader(string(fileBytes)))
|
||||
|
||||
@@ -4,15 +4,77 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Upload Members</title>
|
||||
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
||||
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
|
||||
<script src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
|
||||
<script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
||||
<script type="text/babel">
|
||||
function MembersForm() {
|
||||
const [year, setYear] = React.useState(0);
|
||||
const [file, setFile] = React.useState(null);
|
||||
|
||||
const handleSubmit = (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (!year || !file) {
|
||||
alert('Both year and file are required!');
|
||||
return;
|
||||
}
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append('year', year);
|
||||
formData.append('members.csv', file);
|
||||
|
||||
fetch('/admin/members', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
alert('Members uploaded successfully!');
|
||||
} else {
|
||||
alert(`Error: ${data.error}`);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<h1>Upload Members CSV</h1>
|
||||
<form action="/admin/members" method="post" enctype="multipart/form-data">
|
||||
<label for="year">Year:</label>
|
||||
<input type="number" id="year" name="year" required><br><br>
|
||||
<label for="members.csv">CSV File:</label>
|
||||
<input type="file" id="members.csv" name="members.csv" accept=".csv" required><br><br>
|
||||
<label htmlFor="year">Year:</label>
|
||||
<input
|
||||
type="number"
|
||||
id="year"
|
||||
name="year"
|
||||
value={year}
|
||||
onChange={(e) => setYear(e.target.value)}
|
||||
required
|
||||
/><br/><br/>
|
||||
|
||||
<label htmlFor="members.csv">CSV File:</label>
|
||||
<input
|
||||
type="file"
|
||||
id="members.csv"
|
||||
name="members.csv"
|
||||
accept=".csv"
|
||||
onChange={(e) => setFile(e.target.files[0])}
|
||||
required
|
||||
/><br/><br/>
|
||||
|
||||
<button type="submit">Upload</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||
root.render(
|
||||
<MembersForm />
|
||||
);
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user