feat: add error messages for empty fields

wbstack · Jan 4, 2024 · b29f8cf · b29f8cf
1 parent ae1ff28
commit b29f8cf
Showing 1 changed file with 55 additions and 46 deletions.
diff --git a/src/components/Pages/ManageWiki/Cards/QuestyCaptcha.vue b/src/components/Pages/ManageWiki/Cards/QuestyCaptcha.vue
@@ -40,7 +40,7 @@
               multiple
               outlined
               :rules="[required]"
-              :error-messages="getErrorMessages(entry, 'answer')"
+              :error-messages="getErrorMessages(entry, 'answers')"
               hide-selected
             >
               <template v-slot:selection="{ item }" >
@@ -132,7 +132,24 @@ export default {
         answers: []
       })
     },
-    checkEmptyField () {
+    // checkEmptyField () {
+    //   const questionsList = this.questionsFromStore
+    //   for (let i = 0; i < questionsList.length; i++) {
+    //     const entry = questionsList[i]
+    //     entry.errorMessages = {}
+    //     if (!entry.question.trim()) {
+    //       entry.errorMessages.question = 'Field cannot be empty. Please provide a question'
+    //     } if (!entry.answers || entry.answers.length === 0) {
+    //       entry.errorMessages.answers = 'Field cannot be empty. Please provide an answer'
+    //     } else {
+    //       return true
+    //     }
+    //   }
+    // },
+    getErrorMessages (entry, field) {
+      return entry.errorMessages ? [entry.errorMessages[field]] : []
+    },
+    saveForm () {
       const questionsList = this.questionsFromStore
       for (let i = 0; i < questionsList.length; i++) {
         const entry = questionsList[i]
@@ -142,51 +159,43 @@ export default {
         } if (!entry.answers || entry.answers.length === 0) {
           entry.errorMessages.answers = 'Field cannot be empty. Please provide an answer'
         } else {
-          return true
-        }
-      }
-    },
-    getErrorMessages (entry, field) {
-      return entry.errorMessages ? [entry.errorMessages[field]] : []
-    },
-    saveForm () {
-      if (this.checkEmptyField() === true) {
-        const wiki = this.wikiId
-        const promises = []
-        const captchaEnabledSetting = 'wwUseQuestyCaptcha'
-        const captchaQuestionsSetting = 'wwCaptchaQuestions'
-        const enableValue = this.captchaActivate
-        const questions = {}
-        // for (const questionAnswerPair of this.questionsFromStore) {
-        //   for (let i = 0; i < this.questionsFromStore.length; i++) {
-        //     const noAnswer = Object.prototype.hasOwnProperty.call(questionAnswerPair, 'question') && typeof questionAnswerPair.question === 'string' && questionAnswerPair.question.trim() !== ''
-        //     const noQuestion = Object.prototype.hasOwnProperty.call(questionAnswerPair, 'answers') && Array.isArray(questionAnswerPair.answers) && questionAnswerPair.answers.length > 0
-        //     if (!noAnswer) {
-        //       this.error.answers = 'Field cannot be empty. Please provide an answer'
-        //     }
-        //     if (!noQuestion) {
-        //       this.error.question = 'Field cannot be empty. Please provide a question'
-        //     }
-        //   }
-        // }
-        this.questionsFromStore.forEach(item => {
-          questions[item.question] = item.answers
-        })
-        const JSONQuestions = JSON.stringify(questions)
-        promises.push(
-          this.$store.dispatch('updateSetting', { wiki, setting: captchaEnabledSetting, value: enableValue }),
-          this.$store.dispatch('updateSetting', { wiki, setting: captchaQuestionsSetting, value: JSONQuestions })
-        )
-        Promise.all(promises)
-          .then(() => {
-            this.$store.dispatch('setEnabledQuestyCaptcha', enableValue)
-            this.$store.dispatch('setQuestyCaptchaQuestions', this.questionsFromStore)
-            this.successMessage = true
-          })
-          .catch(err => {
-            console.log(err.response)
-            this.errorMessage = true
+          const wiki = this.wikiId
+          const promises = []
+          const captchaEnabledSetting = 'wwUseQuestyCaptcha'
+          const captchaQuestionsSetting = 'wwCaptchaQuestions'
+          const enableValue = this.captchaActivate
+          const questions = {}
+          // for (const questionAnswerPair of this.questionsFromStore) {
+          //   for (let i = 0; i < this.questionsFromStore.length; i++) {
+          //     const noAnswer = Object.prototype.hasOwnProperty.call(questionAnswerPair, 'question') && typeof questionAnswerPair.question === 'string' && questionAnswerPair.question.trim() !== ''
+          //     const noQuestion = Object.prototype.hasOwnProperty.call(questionAnswerPair, 'answers') && Array.isArray(questionAnswerPair.answers) && questionAnswerPair.answers.length > 0
+          //     if (noAnswer) {
+          //       this.error.answers = 'Field cannot be empty. Please provide an answer'
+          //     }
+          //     if (noQuestion) {
+          //       this.error.question = 'Field cannot be empty. Please provide a question'
+          //     }
+          //   }
+          // }
+          this.questionsFromStore.forEach(item => {
+            questions[item.question] = item.answers
           })
+          const JSONQuestions = JSON.stringify(questions)
+          promises.push(
+            this.$store.dispatch('updateSetting', { wiki, setting: captchaEnabledSetting, value: enableValue }),
+            this.$store.dispatch('updateSetting', { wiki, setting: captchaQuestionsSetting, value: JSONQuestions })
+          )
+          Promise.all(promises)
+            .then(() => {
+              this.$store.dispatch('setEnabledQuestyCaptcha', enableValue)
+              this.$store.dispatch('setQuestyCaptchaQuestions', this.questionsFromStore)
+              this.successMessage = true
+            })
+            .catch(err => {
+              console.log(err.response)
+              this.errorMessage = true
+            })
+        }
       }
     },
     recoverDefaultQuestions () {