fix(step-details): add max char message

hypha-dao · Sep 8, 2023 · 4ef1d8d · 4ef1d8d
1 parent 0a9dce5
commit 4ef1d8d
Showing 1 changed file with 16 additions and 18 deletions.
diff --git a/src/pages/proposals/create/StepDetails.vue b/src/pages/proposals/create/StepDetails.vue
@@ -62,20 +62,11 @@ export default {
     sanitizeDescription () { return this.$sanitize(this.description, { allowedTags: [] }) },
 
     canGoNext () {
-      if (this.$store.state.proposals.draft.edit) {
-        if (this.sanitizeDescription.length < DESCRIPTION_MAX_LENGTH) {
-          if (this.fields.purpose && this.purpose.length === 0) {
-            return true
-          }
-          return false
-        }
-      } else if (this.sanitizeDescription.length > 0 && this.title.length > 0 && this.sanitizeDescription.length < DESCRIPTION_MAX_LENGTH && this.title.length <= TITLE_MAX_LENGTH) {
-        if (this.fields.purpose && this.purpose.length === 0) {
-          return true
-        }
-        return false
-      }
-      return true
+      return [
+        this.title !== '',
+        this.description !== '',
+        this.sanitizeDescription.length < DESCRIPTION_MAX_LENGTH
+      ].every()
     },
 
     title: {
@@ -99,9 +90,7 @@ export default {
       set (value) { this.$store.commit('proposals/setVotingMethod', value) }
     },
 
-    isEditing () {
-      return this.$store.state.proposals.draft.edit
-    }
+    isEditing () { return this.$store.state.proposals.draft.edit }
   },
 
   created () {
@@ -163,7 +152,16 @@ widget
       q-input.q-mt-xs.rounded-border(:disable="isEditing || isProposalType(PROPOSAL_TYPE.ABILITY) || isProposalType(PROPOSAL_TYPE.ASSIGNBADGE)" :placeholder="fields.title.placeholder" :rules="[val => !!val || $t('pages.proposals.create.stepdetails.titleIsRequired'), val => (val.length <= TITLE_MAX_LENGTH) || $t('pages.proposals.create.stepdetails.proposalTitleLengthHasToBeLess', { TITLE_MAX_LENGTH: TITLE_MAX_LENGTH, length: title.length })]" dense outlined v-model="title")
     .col.q-mt-sm(v-if="fields.description")
       label.h-label {{ fields.description.label }}
-      q-field.q-mt-xs.rounded-border(:rules="[rules.required, val => this.$sanitize(val, { allowedTags: [] }).length < DESCRIPTION_MAX_LENGTH || $t('pages.proposals.create.stepdetails.theDescriptionMustContainLess', { DESCRIPTION_MAX_LENGTH: DESCRIPTION_MAX_LENGTH, length: this.$sanitize(description, { allowedTags: [] }).length })]" dense maxlength="4000" outlined ref="bio" stack-label v-model="description" :disable="isProposalType(PROPOSAL_TYPE.ABILITY) || isProposalType(PROPOSAL_TYPE.ASSIGNBADGE)")
+      q-field.q-mt-xs.rounded-border(
+        :disable="isProposalType(PROPOSAL_TYPE.ABILITY) || isProposalType(PROPOSAL_TYPE.ASSIGNBADGE)"
+        :rules="[rules.required, val => this.$sanitize(val, { allowedTags: [] }).length < DESCRIPTION_MAX_LENGTH || $t('pages.proposals.create.stepdetails.theDescriptionMustContainLess', { DESCRIPTION_MAX_LENGTH: DESCRIPTION_MAX_LENGTH, length: this.$sanitize(description, { allowedTags: [] }).length })]"
+        dense
+        maxlength="4000"
+        outlined
+        ref="description"
+        stack-label
+        v-model="description"
+      )
         input-editor.full-width(:placeholder="fields.description.placeholder" :toolbar="[['bold', 'italic', /*'strike', 'underline'*/],['token', 'hr', 'link', 'custom_btn'],['quote', 'unordered', 'ordered']]" flat ref="editorRef" v-model="description")
     .col.q-mt-sm(v-if="fields.circle")
       label.h-label {{ fields.circle.label }}