Работает регистрация

src/views/LandingPages/SignIn/BasicRegister.vue

@@ -13,31 +13,38 @@ import setMaterialInput from "@/assets/js/material-input";
 
 const username = ref('');
 const password = ref('');
+const email = ref(''); // Add email
 const errorMessage = ref('');
 
 const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token')); // Computed property to check if the user is authenticated
 
 
-const login = async () => {
+
-  if (!username.value || !password.value) {
+
-    errorMessage.value = "Please fill in both fields.";
+// New register function
+const register = async () => {
+  if (!username.value || !password.value || !email.value) {
+    errorMessage.value = "Please fill in all fields.";
   } else {
-    const url = 'http://somebodyhire.me/api/token/';
+    const url = 'http://somebodyhire.me/api/register/';
     const headers = {
       'Content-Type': 'application/json',
     };
     const body = {
       username: username.value,
       password: password.value,
+      email: email.value, // include email in the request body
+      is_staff: false
     };
 
     try {
       const response = await axios.post(url, body, { headers });
-      errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nResponse:\nStatus: ${response.status}\nHeaders: ${JSON.stringify(response.headers)}\nBody: ${JSON.stringify(response.data)}`;
+      errorMessage.value = `Registration successful. Welcome ${response.data.username}!`; // Display success message
-      sessionStorage.setItem('access_token', response.data.access); // Save the access token in sessionStorage (new line)
+      sessionStorage.setItem('access_token', response.data.token); // Save the access token in sessionStorage
     } catch (error) {
       if (error.response) {
-        // The request was made and the server responded with a status code that falls out of the range of 2xx
+        // The request was made and the server responded with a status code
+        // that falls out of the range of 2xx
         errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nResponse:\nStatus: ${error.response.status}\nHeaders: ${JSON.stringify(error.response.headers)}\nBody: ${JSON.stringify(error.response.data)}`;
       } else if (error.request) {
         // The request was made but no response was received
@@ -50,11 +57,6 @@ const login = async () => {
   }
 };
 
-const logout = () => { // Method to logout the user by clearing the session storage (new function)
-  sessionStorage.removeItem('access_token');
-};
-
-
 onMounted(() => {
   setMaterialInput();
 });
@@ -66,17 +68,16 @@ export default {
     return {
       username: '',
       password: '',
+      email: '',
       errorMessage: '',
     };
   },
   methods: {
-    login() {
+    register() {
-      if (!this.username || !this.password) {
+      this.username = username.value;
-        this.errorMessage = "Please fill in both fields.";
+      this.password = password.value;
-      } else {
+      this.email = email.value;
-        // Implement login logic here
+      register(); // Call the register function
-        this.errorMessage = `Can't login now, you are trying to sign in with login: ${this.username} and password: ${this.password}`;
-      }
     },
   },
 };
@@ -115,15 +116,10 @@ export default {
               <div class="card-body">
                 <form role="form" class="text-start">
                   <div>
-                    <div v-if="isAuthenticated">
+                    <div>
-                        <!-- This will only be displayed if the user is authenticated -->
-                        <p>Опять Ты!</p>
-                        <button @click="logout">Выход</button>
-                    </div>
-
-                    <div v-else>
                         <!-- This will be displayed if the user is not authenticated -->
-                        <p>Ты с какого района?</p>
+                        <p>Пожалуйста, зарегистрируйтесь</p>
+                        <p>Пароль должен быть не менее 8 символов, и не быть похожим на имя пользователя или адрес почты</p>
                     
 
 
@@ -132,6 +128,11 @@ export default {
                         <input v-model="username" type="text" placeholder="Имя пользователя" />
                       </div>
 
+                      <div>
+                        <input v-model="email" type="email" placeholder="Email" />
+                      </div>
+
+
                       <div>
                         <input v-model="password" type="password" placeholder="Пароль" />
                       </div>
@@ -139,12 +140,12 @@ export default {
 
                     <div class="text-center">
                       <button
-                        type="button"
+  type="button"
-                        class="btn bg-gradient-dark w-100 my-4 mb-2"
+  class="btn bg-gradient-dark w-100 my-4 mb-2"
-                        @click="login"
+  @click="register"
-                                      >
+>
-                          Войти
+  Зарегистрироваться
-                      </button>
+</button>
 
                     </div>