update profile to backend

backend/secfit/users/serializers.py

@@ -93,6 +93,20 @@ class UserPutSerializer(serializers.ModelSerializer):
 
         return instance
 
+class UserProfilePostSerializer(serializers.ModelSerializer):
+
+    class Meta:
+        model = get_user_model()
+        fields = [
+                     "email",
+                     "username",
+                     "phone_number",
+                     "country",
+                     "city",
+                     "street_address",
+                     "favourite_exercise",
+                     "main_gym",
+                 ]
 
 class AthleteFileSerializer(serializers.HyperlinkedModelSerializer):
     owner = serializers.ReadOnlyField(source="owner.username")

backend/secfit/users/urls.py

@@ -6,6 +6,8 @@ urlpatterns = [
     path("api/users/", views.UserList.as_view(), name="user-list"),
     path("api/users/<int:pk>/", views.UserDetail.as_view(), name="user-detail"),
     path("api/users/<str:username>/", views.UserDetail.as_view(), name="user-detail"),
+    path("api/users/<str:username>/", views.UserDetail.as_view(), name="userinstance-detail"),
+
     path("api/offers/", views.OfferList.as_view(), name="offer-list"),
     path("api/offers/<int:pk>/", views.OfferDetail.as_view(), name="offer-detail"),
     path(

backend/secfit/users/views.py

@@ -8,6 +8,7 @@ from users.serializers import (
     AthleteFileSerializer,
     UserPutSerializer,
     UserGetSerializer,
+    UserProfilePostSerializer
 )
 from rest_framework.permissions import (
     AllowAny,
@@ -74,6 +75,10 @@ class UserDetail(
     def delete(self, request, *args, **kwargs):
         return self.destroy(request, *args, **kwargs)
 
+    def post(self, request, *args, **kwargs):
+        self.serializer_class = UserProfilePostSerializer
+        return self.update(request, *args, **kwargs)
+
     def put(self, request, *args, **kwargs):
         self.serializer_class = UserPutSerializer
         return self.update(request, *args, **kwargs)

frontend/www/profile.html

@@ -59,8 +59,8 @@
                  required>
         </div> <!-- form-group// -->
         <div class="d-grid">
-          <input type="button" class="btn btn-primary" id="btn-create-account"
-                 value=" Create Account  ">
+          <input type="button" class="btn btn-primary" id="btn-edit-account"
+                 value=" Update profile  ">
         </div> <!-- form-group// -->
       </form>
     </article>

frontend/www/scripts/profile.js

@@ -7,14 +7,14 @@ async function init() {
     let user = await userResponse.json().then((val) => {
         if(val){
             console.log(val);
-            document.getElementById("username").placeholder = `${val.username}`;
-            document.getElementById("email").placeholder = `${val.email}`;
-            document.getElementById("phone_number").placeholder = `${val.phone_number}`;
-            document.getElementById("country").placeholder = `${val.country}`;
-            document.getElementById("city").placeholder = `${val.city}`;
-            document.getElementById("street_address").placeholder = `${val.street_address}`;
-            document.getElementById("main_gym").placeholder = `${val.main_gym}`;
-            document.getElementById("favourite_exercise").placeholder = `${val.favourite_exercise}`;
+            document.getElementById("username").value = `${val.username}`;
+            document.getElementById("email").value = `${val.email}`;
+            document.getElementById("phone_number").value = `${val.phone_number}`;
+            document.getElementById("country").value = `${val.country}`;
+            document.getElementById("city").value = `${val.city}`;
+            document.getElementById("street_address").value = `${val.street_address}`;
+            document.getElementById("main_gym").value = `${val.main_gym}`;
+            document.getElementById("favourite_exercise").value = `${val.favourite_exercise}`;
         }
 
     }).catch(console.log)
@@ -22,14 +22,35 @@ async function init() {
 
 }
 
-async function createNewUser(event) {
-    const username = sessionStorage.getItem("username");
-    let userResponse = await sendRequest("GET", `${HOST}/api/users/${username}/`);
-    let user = await userResponse.json();
-
+async function updateUser(event) {
+    const usrName = sessionStorage.getItem("username");
     let form = document.querySelector("#form-edit-user");
-    console.log(form);
     let formData = new FormData(form);
+
+    let body = {
+        username: usrName,
+        email: formData.get("email"),
+        phone_number: formData.get("phone_number"),
+        country: formData.get("country"),
+        city: formData.get("city"),
+        street_address: formData.get("street_address"),
+        main_gym: formData.get("main_gym"),
+        favourite_exercise: formData.get("favourite_exercise")
+    };
+
+    const username = sessionStorage.getItem("username");
+    response = await sendRequest("POST", `${HOST}/api/users/${username}/`, body);
+    if (response.ok) {
+        console.log("UPDATED PROFILE");
+    } else {
+        console.log("CAN'T GET JWT TOKEN ON REGISTRATION");
+        let data = await response.json();
+        let alert = createAlert("Profile update could not complete. Try again!", data);
+        document.body.prepend(alert);
+    }
+
+
+
     /*
     let response = await sendRequest("POST", `${HOST}/api/users/`, formData, "");
 
@@ -67,5 +88,5 @@ async function createNewUser(event) {
      */
 }
 
-document.querySelector("#btn-create-account").addEventListener("click", async (event) => await createNewUser(event));
+document.querySelector("#btn-edit-account").addEventListener("click", async (event) => await updateUser(event));
 init();