save survey answers first pass

frontend/src/components/form.vue

@@ -57,6 +57,7 @@
 import Joi from 'joi'
 import { validatorMapping, makeKebob } from '@/utils'
 import { defineProps, reactive, ref } from 'vue'
+import { saveSurveyByProfileID } from '../services/survey.service'
 
 const slidevalue = ref('0')
 
@@ -109,15 +110,32 @@ const isValid = step => {
 const next = e => {
     const validity = isValid(state.step - 1)
     if (validity.error) return console.error(validity.error)
-    // TODO: make steps work, 
-    // console.log('next', )
+    // TODO: make steps work,
     // Save or next
     if (state.step === props.form.length) {
         // TODO: call survey service
         // TODO: in the survey service, create a save function
         // call service from here, pass it profile id as argument
         // profileId = answers['what-is-your-user-id']
-        alert('saved...')
+        const questiontoResponseKeyId = {}
+        props.form.forEach(step => {
+            step.forEach(prompt => {
+                questiontoResponseKeyId[makeKebob(prompt.question)] = prompt.id
+            })
+        })
+        const idWithResponseVal = []
+        Object.keys(answers).forEach(answerKey => {
+            idWithResponseVal.push({
+                response_key_id: questiontoResponseKeyId[answerKey],
+                val: answers[answerKey],
+            })
+        })
+        // Remove 1st answer from idWithResponseVal and use it for profileId
+        // Bc we don't want to pass the 1st question to backend & we want profileId
+        // Necessary atm bc we manually added question in Survey class (entity)
+        const profileId = idWithResponseVal.shift().val
+
+        saveSurveyByProfileID(idWithResponseVal, profileId)
         resetAnswers()
         state.step = 1
     } else if (state.step < props.form.length) {

frontend/src/entities/survey/survey.js

@@ -14,7 +14,7 @@ class Survey extends _baseRecord {
                 {
                     id: 0,
                     type: 'input-string',
-                    question: 'what is your user id',
+                    question: 'what is your profile id',
                     responses: null,
                     description: null,
                     category: null,

frontend/src/services/survey.service.js

@@ -9,62 +9,64 @@ import { Survey } from '../entities/survey'
  * @returns {array} instantiated Profile objects (see: /entites/profile)
  */
 const fetchSurveyByProfileId = async profileId => {
-    const myquestions = await db.get(`/survey/questions`)
-    // const myquestions = [
-    //     [
-    //         {
-    //             id: 1,
-    //             type: 'input-string',
-    //             question: 'whats your favorite color',
-    //             responses: null,
-    //         },
-    //     ],
-    // [
-    //     {
-    //     "response_key_id": 1,
-    //     "response_key_category": "grit",
-    //     "response_key_prompt": "what is your name",
-    //     "response_key_description": null
-    //     },
-    // ],
-    //     [
-    //         {
-    //             id: 2,
-    //             type: 'tag-cloud',
-    //             question: 'whats your favorite number',
-    //             responses: ['1', '2', '3'],
-    //         },
-    //     ],
-    //     [
-    //         {
-    //             id: 3,
-    //             type: 'checklist',
-    //             question: 'what is your current status',
-    //             responses: ['employed', 'unemployed', 'degenerate', 'alien'],
-    //         },
-    //     ],
-    //     [
-    //         {
-    //             id: 4,
-    //             type: 'slide',
-    //             question: 'choose a num',
-    //             responses: null,
-    //         },
-    //     ],
-    //     [
-    //         {
-    //             id: 5,
-    //             type: 'checklist',
-    //             question: 'pick a status',
-    //             responses: ['cry', 'sad', 'mad', 'numb'],
-    //         },
-    //     ],
-    // ]
-    const allsteps = { 'step-1': [], 'step-2': [], 'step-3': [], 'step-4': [] }
-    let counter = 0
+    // const myquestions = await db.get(`/survey/questions`)
+    const myquestions = [
+        {
+            response_key_id: 1,
+            response_key_prompt: 'whats your favorite color',
+            response_key_description: 'color description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 2,
+            response_key_prompt: 'whats your favorite food',
+            response_key_description: 'food description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 3,
+            response_key_prompt: 'whats your favorite animal',
+            response_key_description: 'animal description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 4,
+            response_key_prompt: 'whats your favorite tree',
+            response_key_description: 'tree description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 5,
+            response_key_prompt: 'whats your favorite plant',
+            response_key_description: 'plant description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 6,
+            response_key_prompt: 'whats your favorite frog',
+            response_key_description: 'frog description',
+            response_key_category: 'category',
+        },
+        {
+            response_key_id: 7,
+            response_key_prompt: 'what is your zipcode',
+            response_key_description: 'zipcode description',
+            response_key_category: 'category',
+        },
+    ]
+    const allsteps = { }
+    const questionsPerStep = 3
+    const stepsNeeded = Math.ceil(myquestions.length / questionsPerStep)
 
+    // Create the steps needed inside allsteps
+    for (let i = 1; i <= stepsNeeded; i++) {
+        allsteps[`step-${i}`] = []
+    }
+
+    // Add the questions into each step, dividing into questionsPerStep
     for (let i = 0; i < myquestions.length; i++) {
         const question = myquestions[i]
+        // Reformats myquestions into the format we want
         const reformatted = {
             id: question.response_key_id,
             type: 'input-string',
@@ -73,22 +75,37 @@ const fetchSurveyByProfileId = async profileId => {
             description: question.response_key_description,
             category: question.response_key_category,
         }
-        counter = counter + 1
-        // TODO: check for step array before pushing
-        if (i < 4 * counter && i >= 4 * (counter - 1)) {
-            allsteps[`step-${counter}`].push(reformatted)
+        for (let n = 1; n <= stepsNeeded; n++) {
+            if (i >=questionsPerStep*(n-1) && i < questionsPerStep*n) {
+                allsteps[`step-${n}`].push(reformatted)
+            }
         }
     }
     const mysurvey = new Survey(allsteps)
-
     return mysurvey
 }
 
-// TODO: saveSurveyByProfileID - needs await, db.post
-const saveSurveyByProfileID = async profileID => {
-    const myresponses = await db.post(`/${profileId}/respond`)
-    
-    
+// TODO: separate to newSurvey vs updateSurvey
+const saveSurveyByProfileID = async (surveyResponses, profileId) => {
+    surveyResponses.forEach((responseKeyIdwithVal) => {
+        const keyId = responseKeyIdwithVal.response_key_id
+        const val = responseKeyIdwithVal.val
+        console.log('posting this', `/${profileId}/respond?response_key_id=${keyId}&val=${val}`)
+        // POST 
+        // const myresponses = db.post(`/${profileId}/respond?response_key_id=${keyId}&val=${val}`)
+        // PATCH
+        // const myresponses = db.patch(`/profile/${profileId}/update/${keyId}`, 
+        // [
+        //     {
+        //         response_id: 2,
+        //         profile_id: profileId,
+        //         response_key_id: keyId,
+        //         val: val,
+        //     },
+        // ]
+        // )
+        // return myresponses
+    })
 }
 
-export { fetchSurveyByProfileId }
+export { fetchSurveyByProfileId, saveSurveyByProfileID }

frontend/src/utils/db.js

@@ -52,19 +52,22 @@ class Connector {
             console.error(error)
         }
     }
-    async put(endpoint, entry) {
-        /** from ajv schema validation */
-        if (entry.isValid()) {
-            try {
-            } catch (err) {
-                /** valid data but can't save */
-                console.error("can't put", entry)
+    async patch(endpoint, payload = {}) {
+        const header = { ...headerTemplate }
+        header.method = 'PATCH'
+        header.body = JSON.stringify(payload)
+        try {
+            let res = await fetch(`${remote}${endpoint}`, header)
+            if (!res.ok) {
+                throw Error(res.statusText)
             }
-        } else {
-            /** not valid data */
-            console.error('NOT VALID!', entry.isValid())
+            const jsonRes = await res.json()
+            return jsonRes.data
+        } catch (error) {
+            console.error(error)
         }
     }
+    
     /** !: DEV ONLY */
     // async removeAll() { }
 }