@burh/nuxt-core 1.0.23 → 1.0.24

package/components/burh-ds/Headings/StepHeader.vue

@@ -6,11 +6,9 @@
       placeholder="Escreva o nome da etapa" 
       type="text" 
       class="" 
-      :error="getError('Ask')" 
-      :valid="isValid('Ask')" 
       v-on:input="emitStage()"
       v-model="name"
-      v-validate="'required'"/>
+      />
 
     <div class="pb-3">
       <textarea 
@@ -64,12 +62,6 @@ export default {
     }
   },
   methods: {
-    getError(name){
-      return this.errors.first(name);
-    },
-    isValid(name) {
-      return this.validated && !this.errors.has(name);
-    },
     emitStage() {
       this.$emit('change-stage', 
       { 

package/components/burh-ds/Loadings/LoadingFullPage.vue

@@ -19,6 +19,7 @@ import Loading from 'vue-loading-overlay';
 import 'vue-loading-overlay/dist/vue-loading.css';
 
 export default {
+	name: 'loading-full-page',
 	// data() {
 	// 	return {
 	// 		isLoading: false,

package/components/burh-ds/Modals/SendTest.vue

@@ -3,34 +3,19 @@
     <template slot="header">
 		<h2 class="display-4 px-4">Insira os e-mail que deseja enviar o teste</h2>
 	</template>
-    <div class="row px-4">
-        <div class="col-3">
-            <label for="name">Nome(opcional)</label>
-		</div>
-        <div class="col-3">
-            <label for="email">E-mail</label>
-		</div>
-        <div class="col-3">
+    <div class="row px-4 justify-content-start">
+        <div class="col-4">
             <label for="teste">Selecione a vaga</label>
 		</div>
-        <div class="col-3">
+        <div class="col-4">
             <label for="teste">Selecione o teste</label>
 		</div>
     </div>
-    <div class="row px-4"
-        v-for="(slot, idx) in slots"
-        :key="idx"
-    >
-        <div class="col-3">
-            <base-input v-model="slot.name"/>
-        </div>
-        <div class="col-3">
-            <base-input v-model="slot.email"/>
-        </div>
-        <div class="col-3">
+    <div class="row px-4 justify-content-start">
+        <div class="col-4">
             <el-select
                 placeholder="Escolha a vaga"
-                v-model="slot.jobid">
+                v-model="jobid">
                 <el-option v-for="job in allJobs"
                     class="select-danger"
                     :value="job.id"
@@ -38,11 +23,12 @@
                     :key="job.id">
                 </el-option>
             </el-select>
+            <span></span>
         </div>
-        <div class="col-2">
+        <div class="col-4">
             <el-select
                 placeholder="Escolha o teste"
-                v-model="slot.testid">
+                v-model="testid">
                 <el-option v-for="test in allTests"
                     class="select-danger"
                     :value="test.id"
@@ -51,6 +37,26 @@
                 </el-option>
             </el-select>
         </div>
+    </div>
+    <hr>
+    <div class="row px-4">
+        <div class="col-4">
+            <label for="name">Nome(opcional)</label>
+		</div>
+        <div class="col-8">
+            <label for="email">E-mail</label>
+		</div>
+    </div>
+    <div class="row px-4"
+        v-for="(slot, idx) in slots"
+        :key="idx"
+    >
+        <div class="col-4">
+            <base-input v-model="slot.name"/>
+        </div>
+        <div class="col-7">
+            <base-input v-model="slot.email"/>
+        </div>
         <div class="col-1">
             <i v-if="idx !== (slots.length - 1)" class="fa fa-trash pointer" @click="removeSlot(slot.id)"></i>
             <i v-else class="fa fa-plus pointer" @click="addSlot"></i>
@@ -98,52 +104,46 @@ export default {
             this.slots = [...this.slots, newSlot];
         },
         sendTest() {
-            const testRequest = this.slots;
+            const filterSlots = slot => slot.email !== "";
+            const formatRequest = slot => ({...slot, jobid: this.jobid, testid: this.testid});
+            const testRequest = this.slots.filter(filterSlots).map(formatRequest);
             this.$emit('send-test', testRequest);
         }
     },
     watch: {
         selectedTest(newValue) {
-            this.slots = this.slots.map(slot => ({...slot, testid: newValue}));
+            this.testid =  newValue;
         }
     },
 	data() {
 		return {
+            jobid: null,
+            testid: this.selectedTest,
             slots: [
                 {
                     id: 'first',
                     name: '',
                     email: '',
-                    testid: this.selectedTest,
-                    jobid: null,
                 },
                 {
                     id: 'second',
                     name: '',
                     email: '',
-                    testid: this.selectedTest,
-                    jobid: null,
                 },
                 {
                     id: 'third',
                     name: '',
                     email: '',
-                    testid: this.selectedTest,
-                    jobid: null,
                 },
                 {
                     id: 'fourth',
                     name: '',
                     email: '',
-                    testid: this.selectedTest,
-                    jobid: null,
                 },
                 {
                     id: 'fifth',
                     name: '',
                     email: '',
-                    testid: this.selectedTest,
-                    jobid: null,
                 }
             ]
         }

package/components/burh-ds/Pagination/NamedPagination.vue

@@ -87,36 +87,12 @@ export default {
 			}
 			return this.defaultPagesToDisplay;
 		},
-		minPage() {
-			if (this.value >= 5) {
-                const pagesToAdd = Math.floor(5 / 2);
-                const newMaxPage = pagesToAdd + this.value;
-                if (newMaxPage > this.pagesName.length) {
-                   return this.pagesName.length - 5 + 1;
-                }
-                return this.value - pagesToAdd;
-            } else {
-                return 1;
-            }
-		},
-		maxPage() {
-            const pagesToDisplay = this.pagesName.length === 5 ? 5 : (this.pagesName.length);
-            if (this.value >= pagesToDisplay) {
-                const pagesToAdd = Math.floor(pagesToDisplay / 2);
-                const newMaxPage = pagesToAdd + this.value;
-                if (newMaxPage < this.pagesName.length) {
-                    return newMaxPage;
-                } else {
-                return this.pagesName.length;
-                }
-            } else {
-                return pagesToDisplay;
-            }
-		}
 	},
 	data() {
 		return {
-			defaultPagesToDisplay: 1
+            defaultPagesToDisplay: 1,
+            minPage: 1,
+            maxPage: this.pagesName.length >= 5 ? 5 : this.pagesName.length,
 		};
 	},
 	methods: {
@@ -128,7 +104,6 @@ export default {
 			return arr;
 		},
 		changePage(item) {
-            console.log(item)
 			this.$emit('input', item);
 		},
 		nextPage() {
@@ -148,7 +123,24 @@ export default {
 		},
 		total() {
 			this.$emit('input', 1);
-		}
+        },
+        value(newValue, oldValue) {
+            const pagesToDisplay = this.pagesName.length >= 5 ? 5 : this.pagesName.length;
+            if(newValue < 5) {
+                this.minPage = 1;
+                this.maxPage = pagesToDisplay;
+            }
+            else {
+                if(newValue < this.minPage) {
+                    this.minPage = newValue;
+                    this.maxPage = this.minPage + 4;
+                }
+                if(newValue > this.maxPage) {
+                    this.maxPage = newValue;
+                    this.minPage = this.maxPage - 4;
+                }
+            }
+        }
 	}
 };
 </script>

package/components/burh-ds/Questions/Question.vue

@@ -1,17 +1,18 @@
 <template>
     <div class="card position-relative">
         <div class="row px-4 justify-content-start">
-            <base-input 
-                name="Question"
-                :label="`Pergunta #${position + 1}`" 
-                placeholder="Escreva uma pergunta" 
-                type="text" 
-                class="col-8" 
-                :error="getError('Question')" 
-                :valid="isValid('Question')"
-                :value="question.question" 
-                v-on:input="setQuestion('question', $event)"
-                v-validate="'required'"/>
+            <validation-provider tag="div" class="col-8" :vid="`question-${stepIndex}-${position}`" 
+              name="Pergunta" rules="required" v-slot="{ errors }">
+                <base-input 
+                    :label="`Pergunta #${position + 1}`" 
+                    placeholder="Escreva uma pergunta" 
+                    type="text" 
+                    :error="errors[0]" 
+                    :valid="errors.length ? true : false"
+                    :value="question.question" 
+                    v-on:input="setQuestion('question', $event)"
+                />
+            </validation-provider>
 
             <div class="col-4">
                 <label class="form-control-label d-block pt-1">
@@ -39,7 +40,7 @@
                     :data="question.multiples"
                     v-on:data-changed="mergeDataQuestion"/>
                 <question-attach 
-                    v-if="question.question_type == 'question-attach'"
+                    v-if="question.question_type == 'annex'"
                     :data="question"
                     v-on:data-changed="mergeDataQuestion"/>
             </div>
@@ -70,7 +71,14 @@ export default {
         QuestionAttach
     },
     props: {
-        position: Number,
+        stepIndex: {
+            type: Number,
+            default: 0
+        },
+        position: {
+            type: Number,
+            default: 0
+        },
         data: null,
         icons: {
             type: Array,
@@ -84,7 +92,7 @@ export default {
             default: () => [
                 { value: 'paragraph', label: 'Paragrafo' },
                 { value: 'multiple', label: 'Alternativa' },
-                { value: 'question-attach', label: 'Anexo' }
+                { value: 'annex', label: 'Anexo' }
             ]
         },
     },
@@ -94,12 +102,6 @@ export default {
             question: this.data,
         }
     },
-    mounted() {
-      this.$validator.attach({ name: "Question", rules: "required" });
-      this.$nextTick(() => {
-        this.$validator.attach({ name: "Question", rules: "required" });
-      })
-    },
     watch: {
         data(newValue) {
             this.question = newValue;
@@ -120,12 +122,6 @@ export default {
         isChangeTypeQuestion(value) {
             return this.listComponentes.includes(value);
         },
-        getError(name){
-            return this.errors.first(name);
-        },
-        isValid(name) {
-            return this.validated && !this.errors.has(name);
-        },
     }
 }
 </script>

package/components/burh-ds/Questions/QuestionRadio.vue

@@ -1,7 +1,8 @@
 <template>
   <div>
-    <el-radio-group v-model="selected" v-for="(answer, index) in answers" :key="index">
+    <el-radio-group v-model="selected">
       <question-radio-item
+        v-for="(answer, index) in answers" :key="index"
         :response="answer.name" 
         v-on:change-answer="setAnswers($event, answer)"
       ></question-radio-item>
@@ -17,82 +18,79 @@ import QuestionRadioItem from '@burh/nuxt-core/components/burh-ds/Questions/Ques
 import Swal from 'sweetalert2';
 
 export default {
-  name: 'question-radio',
-  components: {
-    [Radio.name]: Radio,
-    [RadioGroup.name]: RadioGroup,
-    QuestionRadioItem
-  },
-  props: {
-    data: {
-      type: Array,
-      default: () => [{}, {}]
+    name: 'question-radio',
+    components: {
+        [Radio.name]: Radio,
+        [RadioGroup.name]: RadioGroup,
+        QuestionRadioItem
     },
-  },
-  data() {
-    return {
-      selected: null,
-      answers: this.data,
-      minRadios: 2,
-    }
-  },
-  created() {
-      this.loadAnswer();
-  },
-  methods: {
-    addOption() {
-      this.answers.push({});
+    props: {
+        data: {
+        type: Array,
+        default: () => [{}, {}]
+        },
     },
-    removeLastOption() {
-      if(this.answers.length <= this.minRadios) {
-        return Swal.fire({
-          title: 'Oops...',
-          text: 'Questões do tipo alternativa deverão conter no mínimo 2 respostas!',
-          type: 'warning',
-          buttonsStyling: false,
-          confirmButtonText: 'Okay!',
-          confirmButtonClass: 'btn btn-primary btn-fill',
-        })
-      } 
-      this.answers.splice(this.answers.length - 1, 1);
-    },
-    loadAnswer() {
-      const answerSelected = this.answers.find(ans => ans.correct);
-      this.selected = answerSelected ? answerSelected.name : null;
-    },
-    setAnswers(value, answer) {
-      answer.name = value;
-      if (answer.correct) {
-        this.selected = value
-      }
-      this.emitRadioList();
-    },
-    makeRadiolist() {
-      const listRadio = this.answers.map(radio => {
+    data() {
         return {
-          name: radio.name,
-          correct: radio.name === this.selected ? true : false
+            selected: null,
+            answers: this.data,
+            minRadios: 2,
         }
-      })
-      return listRadio
-    },
-    emitRadioList() {
-      const payload = {
-        response: this.selected,
-        multiples: this.makeRadiolist()
-      }
-      this.$emit('data-changed', payload)
     },
-  },
-  watch: {
-    data(newValue) {
-      this.answers = newValue.map(e => { return { ...e }}); //prevent cloning references
-      this.loadAnswer();
+    methods: {
+        addOption() {
+            this.answers.push({});
+        },
+        removeLastOption() {
+            if(this.answers.length <= this.minRadios) {
+                return Swal.fire({
+                title: 'Oops...',
+                text: 'Questões do tipo alternativa deverão conter no mínimo 2 respostas!',
+                type: 'warning',
+                buttonsStyling: false,
+                confirmButtonText: 'Okay!',
+                confirmButtonClass: 'btn btn-primary btn-fill',
+                })
+            } 
+            this.answers.splice(this.answers.length - 1, 1);
+        },
+        setAnswers({id, value}, answer) {
+            answer.name = value;
+            answer.id = id;
+
+            if(this.selected == null && answer.correct != false) { // be carefully here
+                this.selected = answer.id
+            }
+
+            this.emitRadioList();
+        },
+        makeRadiolist() {
+            const listRadio = this.answers.map(radio => {
+
+                return {
+                    id: radio.id,
+                    name: radio.name,
+                    correct: radio.id === this.selected ? true : false
+                }
+            })
+            return listRadio
+        },
+        emitRadioList() {
+            const payload = {
+                response: this.selected,
+                multiples: this.makeRadiolist()
+            }
+            this.$emit('data-changed', payload)
+        },
     },
-    selected() {
-      this.emitRadioList();
+    watch: {
+        data(newValue) {
+            this.answers = newValue.map(e => { return { ...e }}); //prevent cloning references
+        },
+        selected() {
+            this.emitRadioList();
+        },
     },
-  },
 }
 </script>
 

package/components/burh-ds/Questions/QuestionRadioItem.vue

@@ -1,19 +1,22 @@
 <template>
-    <el-radio 
-        :label="value" 
-        class="form-radio" 
-        :class="{'form-radio--error': getError('Response')}">
-        <base-input 
-            name="Response" 
-            class="" 
-            type="text" 
-            placeholder="Coloque uma resposta aqui" 
-            v-model="value"
-            v-on:input="$emit('change-answer', value)" 
-            :error="getError('Response')" 
-            :valid="isValid('Response')" 
-            v-validate="'required'"/>
-    </el-radio>
+    <validation-provider tag="div" class="" :vid="`radio-${id}`"
+        name="Resposta" rules="required" v-slot="{ errors }">
+        <el-radio 
+            :label="id" 
+            class="form-radio" 
+            :class="{'form-radio--error': errors[0]}">
+                <base-input 
+                    name="Response" 
+                    class="" 
+                    type="text" 
+                    placeholder="Coloque uma resposta aqui" 
+                    v-model="value"
+                    :error="errors[0]"
+                    :valid="errors.length ? true : false"
+                    v-on:input="$emit('change-answer', {id, value})">
+                </base-input>
+        </el-radio>
+    </validation-provider>
 </template>
 
 <script>
@@ -30,19 +33,15 @@ export default {
             default: ''
         }
     },
+    created() {
+        this.$emit('change-answer', {id: this.id, value: this.value});
+    },
     data() {
         return {
+            id: this.$uuid.v4(),
             value: this.response,
         }
     },
-    methods: {
-        getError(name){
-            return this.errors.first(name);
-        },
-        isValid(name) {
-            return this.validated && !this.errors.has(name);
-        },
-    },
     watch: {
         response(newValue) {
             this.value = this.response

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burh/nuxt-core",
-  "version": "1.0.23",
+  "version": "1.0.24",
   "description": "Design System and Components.",
   "author": "Burh",
   "scripts": {