admin responsalbes listo

components/admin/responsables/cargaMasiva.vue

@@ -10,7 +10,7 @@
         drag-drop
         expanded
       >
-        <section
+        <div
           class="
             section
             is-flex is-align-items-center is-justify-content-center
@@ -19,7 +19,7 @@
         >
           <div class="content has-text-centered">
             <p>
-              <b-icon icon="upload" size="is-large"></b-icon>
+              <b-icon icon="upload" size="is-large" />
             </p>
 
             <p>
@@ -28,12 +28,21 @@
               }}
             </p>
           </div>
-        </section>
+        </div>
       </b-upload>
     </b-field>
 
     <div>
-      <b-button :disabled="!csv.name" @click="dialog()" class="is-info">
+      <b-button
+        :disabled="!csv.name"
+        @click="
+          imprimirWarning(
+            '¿Seguro(a) que quiere enviar este archivo?',
+            enviarCargaMasiva
+          )
+        "
+        class="is-info"
+      >
         Enviar archivo
       </b-button>
 
@@ -41,8 +50,6 @@
         Descargar plantilla
       </b-button>
     </div>
-
-    <b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading" />
   </div>
 </template>
 
@@ -54,9 +61,6 @@ export default {
     return {
       csv: {},
       link: `${process.env.api}/plantilla.csv`,
-      isLoading: false,
-      toastType: '',
-      toastMessage: '',
     }
   },
   props: {
@@ -64,39 +68,21 @@ export default {
     imprimirMensaje: { type: Function, required: true },
     imprimirWarning: { type: Function, required: true },
     imprimirError: { type: Function, required: true },
+    updateIsLoading: { type: Function, required: true },
   },
   methods: {
     validarExt() {
       const extPermitidas = /(.csv)$/i
 
       if (!extPermitidas.exec(this.csv.name)) {
-        this.toastType = 'is-danger'
-        this.toastMessage = 'Asegurate de ingresar un archivo .CSV'
-        this.toast()
+        this.imprimirError({ message: 'Asegurate de ingresar un archivo .CSV' })
         this.csv = {}
       }
     },
-    toast() {
-      this.$buefy.toast.open({
-        message: this.toastMessage,
-        type: this.toastType,
-      })
-    },
-    dialog() {
-      this.$buefy.dialog.confirm({
-        title: 'Carga masiva',
-        message: '¿Seguro(a) que quiere enviar este archivo?',
-        confirmText: 'Confirmar',
-        cancelText: 'Cancelar',
-        type: 'is-success',
-        hasIcon: true,
-        onConfirm: () => this.enviarCargaMasiva(),
-      })
-    },
     enviarCargaMasiva() {
       const formData = new FormData()
 
-      this.isLoading = true
+      this.updateIsLoading(true)
       formData.append('csv', this.csv)
       axios
         .post(
@@ -105,14 +91,12 @@ export default {
           this.admin.token
         )
         .then((res) => {
-          this.isLoading = false
-          this.toastType = 'is-success'
-          this.toastMessage = 'Se ha enviado la carga masiva con éxito'
-          this.toast()
+          this.updateIsLoading(false)
+          this.imprimirMensaje(res.data.message)
           this.$router.push('/admin')
         })
         .catch((err) => {
-          this.isLoading = false
+          this.updateIsLoading(false)
           this.imprimirError(err.response.data)
         })
     },

components/admin/responsables/tablaResponsables.vue

@@ -8,7 +8,7 @@
           type="text"
           placeholder="Correo"
           icon="mail"
-          v-model="busqueda.correo"
+          v-model="search.correo"
           @keyup.enter.native="obtenerResponsables()"
           rounded
         />
@@ -19,7 +19,7 @@
           type="name"
           placeholder="Nombre"
           icon="account"
-          v-model="busqueda.nombre"
+          v-model="search.nombre"
           @keyup.enter.native="obtenerResponsables()"
           rounded
         />
@@ -42,7 +42,7 @@
       :total="total"
       :current-page="page"
       :per-page="perPage"
-      :selected.sync="responsableSeleccionado"
+      :selected.sync="responsableSelected"
       :loading="isLoading"
       :row-class="(row, index) => 'pointer'"
       @page-change="onPageChange"
@@ -84,9 +84,9 @@ export default {
       perPage: 25,
       total: 0,
       isLoading: false,
-      busqueda: {},
-      busquedaAnterior: {},
-      responsableSeleccionado: {},
+      search: {},
+      searchAnterior: {},
+      responsableSelected: {},
     }
   },
   props: {
@@ -112,15 +112,15 @@ export default {
 
       this.isLoading = true
       if (
-        this.busqueda.correo != this.busquedaAnterior.correo ||
-        this.busqueda.nombre != this.busquedaAnterior.nombre
+        this.search.correo != this.searchAnterior.correo ||
+        this.search.nombre != this.searchAnterior.nombre
       ) {
         this.page = 1
-        this.busquedaAnterior.correo = this.busqueda.correo
-        this.busquedaAnterior.nombre = this.busqueda.nombre
+        this.searchAnterior.correo = this.search.correo
+        this.searchAnterior.nombre = this.search.nombre
       }
-      if (this.busqueda.nombre) data += `&nombre=${this.busqueda.nombre}`
-      if (this.busqueda.correo) data = `&correo=${this.busqueda.correo}`
+      if (this.search.nombre) data += `&nombre=${this.search.nombre}`
+      if (this.search.correo) data = `&correo=${this.search.correo}`
       axios
         .get(
           `${process.env.api}/usuario/responsables?&pagina=${this.page}${data}`,
@@ -138,11 +138,8 @@ export default {
     },
   },
   watch: {
-    responsableSeleccionado() {
-      localStorage.setItem(
-        'idResponsable',
-        this.responsableSeleccionado.idUsuario
-      )
+    responsableSelected() {
+      localStorage.setItem('idResponsable', this.responsableSelected.idUsuario)
       this.$router.push(`/admin/responsables/infoResponsable`)
     },
   },