source: src/main/resources/static/UserSignup.html@ 7deb3e2

Last change on this file since 7deb3e2 was 3d60932, checked in by ste08 <sjovanoska@…>, 4 months ago

Fix commiT
  • Property mode set to 100644
File size: 2.6 KB
Line 
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Sign Up</title>
7 <link rel="stylesheet" href="/css/main.css">
8 <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
9 <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
10</head>
11<body>
12
13<div class="signup-container" id="app">
14 <h1>Sign Up</h1>
15 <form @submit.prevent="signupUser">
16 <div class="form-group">
17 <label for="name">Name</label>
18 <input type="text" id="name" v-model="name" required placeholder="Enter your name" />
19 </div>
20 <div class="form-group">
21 <label for="surname">Surname</label>
22 <input type="text" id="surname" v-model="surname" required placeholder="Enter your surname" />
23 </div>
24
25 <div class="form-group">
26 <label for="email">Email</label>
27 <input type="email" id="email" v-model="email" required placeholder="Enter your email" />
28 </div>
29
30 <div class="form-group">
31 <label for="password">Password</label>
32 <input type="password" id="password" v-model="password" required placeholder="Enter your password" />
33 </div>
34
35 <div class="form-group">
36 <label for="phoneNumber">Phone Number</label>
37 <input type="text" id="phoneNumber" v-model="phone_number" required placeholder="Enter your phone number" />
38 </div>
39
40 <button type="submit">Sign Up</button>
41 </form>
42 <p>
43 Already have an account? <a href="/login">Login here</a>
44 </p>
45</div>
46
47<script>
48 new Vue({
49 el: '#app',
50 data: {
51 name: '',
52 surname: '',
53 email: '',
54 password: '',
55 phone_number: ''
56 },
57 methods: {
58 signupUser() {
59 const userData = {
60 name: this.name,
61 surname: this.surname,
62 email: this.email,
63 password: this.password,
64 phone_number: this.phone_number
65 };
66
67 axios.post('http://localhost:8080/api/user/signup', userData)
68 .then(response => {
69 alert(response.data);
70 window.location.href = '/login';
71 })
72 .catch(error => {
73 const errorMessage = error.response ? error.response.data : 'An error occurred';
74 alert(errorMessage);
75 });
76 }
77 }
78 });
79</script>
80
81</body>
82</html>
Note: See TracBrowser for help on using the repository browser.