Ya quedó todo hoy 18/11/2020

package-lock.json

@@ -1787,13 +1787,12 @@
           "dev": true
         },
         "ansi-styles": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
-          "integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
           "dev": true,
           "optional": true,
           "requires": {
-            "@types/color-name": "^1.1.1",
             "color-convert": "^2.0.1"
           }
         },
@@ -1983,9 +1982,9 @@
           }
         },
         "vue-loader-v16": {
-          "version": "npm:vue-loader@16.0.0-beta.8",
-          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.8.tgz",
-          "integrity": "sha512-oouKUQWWHbSihqSD7mhymGPX1OQ4hedzAHyvm8RdyHh6m3oIvoRF+NM45i/bhNOlo8jCnuJhaSUf/6oDjv978g==",
+          "version": "npm:vue-loader@16.0.0-rc.1",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-rc.1.tgz",
+          "integrity": "sha512-yR+BS90EOXTNieasf8ce9J3TFCpm2DGqoqdbtiwQ33hon3FyIznLX7sKavAq1VmfBnOeV6It0Htg4aniv8ph1g==",
           "dev": true,
           "optional": true,
           "requires": {

src/main.js

@@ -12,7 +12,8 @@ import {
     faKey,
     faExclamationCircle,
     faEnvelope,
-    faHome
+    faHome,
+    faSearch
 } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
@@ -25,6 +26,7 @@ library.add(faExclamationCircle)
 library.add(faKey)
 library.add(faEnvelope)
 library.add(faHome)
+library.add(faSearch)
 
 Vue.component('font-awesome-icon', FontAwesomeIcon)
 

src/views/User.vue

@@ -16,36 +16,88 @@
                 <span v-if="pcView">Ver impresoras</span>
                 <span v-else>Ver computadoras</span>
             </button>
-            
-            <div class="row m-0 mt-3 mb-4">
-                <div class="row">
-                    <div class="col">
-                        <input
-                        type="text"
-                        id="Inventario"
-                        v-on:keyup="extraeInventario()"
-                        class="form-control input-login-form shadow-none"
-                        placeholder="Número de inventario"
-                        /> <!-- https://www.tutorialesprogramacionya.com/vueya/detalleconcepto.php?punto=7&codigo=7&inicio=0 -->
+            <div class="my-3">Se observan {{ datosmios.length }} registros de un total de {{ respuesta.length }}</div>
+            <div class="row m-0 mt-1 mb-4">
+                <div class="row d-flex flex-wrap">
+                    <div class="input-group pl-3 col-12 col-md-4">
+                        <div class="input-group-prepend">
+                            <span class="input-group-text" id="basic-addon1">
+                                <font-awesome-icon icon="search" class="user-icon-input" />
+                            </span>
+                        </div>
+                        <input 
+                            type="text"
+                            id="Inventario"
+                            v-on:keyup="extraeInventario()"
+                            class="form-control input-login-form shadow-none"
+                            placeholder="Número de inventario ó de serie"
+                        />  <!-- https://www.tutorialesprogramacionya.com/vueya/detalleconcepto.php?punto=7&codigo=7&inicio=0 -->
                     </div>
-                    <div class="col">
-                        <select
-                            name="tipo"
-                            id="tipo"
-                            @change="buscaValor()"
-                            class="form-control select-login-form shadow-none"
-                        >
-                            <!-- <option value="0" selected>Todos</option>
-                            <option v-for="opcion in tipo" :value="opcion.activoFijo">{{opcion.activoFijo}}</option> -->
+                    
+                    <div class="d-flex flex-wrap my-1">
+                        <div class="col-md-2 col-12 mt-3" v-show="pcView">
+                            <select
+                                name="tipo"
+                                id="tipo"
+                                @change="buscaValor()"
+                                class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Tipo</option>
+                                    <option v-for="opcion1 in tipo" :key="opcion1.idActivoFijo" :value='opcion1.activoFijo'>{{opcion1.activoFijo}}</option>
+                            </select>
+                        </div>
+
+                        <div class="col-md-2 col-12 mt-3" v-show="!pcView">
+                            <select
+                                name="tipo"
+                                id="tipo"
+                                @change="buscaValor()"
+                                class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Tipo</option>
+                                    <option v-for="opcion in tipoPrinters" :key="opcion.tipo" :value='opcion.tipo'>{{opcion.tipo}}</option>
+                            </select>
+                        </div>
+
+                        <div class="col-md-2 col-12 mt-3">
+                            <select name="Ubica" id="Ubica" 
+                            @change="buscaUbica()"
+                            class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Ubicación</option>
+                                <option v-for="opcion in Ubica" :key="opcion.ubicacion" :value='opcion.ubicacion'>{{opcion.ubicacion}}</option>
+                            </select>
+                        </div>
+
+                        <div class="col-md-2 col-12 mt-3" v-show="pcView">
+                            <select name="Procesador" id="Procesador" 
+                            @change="buscaProcesador()"
+                            class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Procesador</option>
+                                <option v-for="opcion in procesa" :key="opcion.procesa" :value='opcion.procesa'>{{opcion.procesa}}</option>
+                            </select>
+                        </div>
+                        
+                        <div class="col-md-2 col-12 mt-3" v-show="pcView">
+                            <select name="SisOper" id="SisOper" 
+                            @change="buscaSisOper()"
+                            class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Sistema Operativo</option>
+                                <option v-for="opcion in os" :key="opcion.osname" :value='opcion.osname'>{{opcion.osname}}</option>
+                            </select>
+                        </div>
+
+                        <div class="col-md-2 col-12 mt-3">
+                            <select name="Uso" id="Uso" 
+                            @change="buscaUso()"
+                            class="form-control select-login-form shadow-none">
+                                <option value="Todos" selected>Uso</option>
+                                <option v-for="opcion in uso" :key="opcion.uso" :value='opcion.uso'>{{opcion.uso}}</option>
+                            </select>
+                        </div>
+                        
 
-                            <option value="Todos" selected>Todos</option>
-                                <option v-show="pcView" v-for="opcion in tipo" :key="opcion.idActivoFijo" :value='opcion.activoFijo'>{{opcion.activoFijo}}</option>
-                                <option v-show="!pcView" v-for="opcion in tipoPrinters" :key="opcion.tipo" :value='opcion.tipo'>{{opcion.tipo}}</option>
-                        </select>
                     </div>
                 </div>
             </div>
-
+            
             <div v-if="pcView" class="table-responsive table-fixed text-nowrap justify-content-md-center"
                 style="max-height: 350px;">
                 <table :class="['table', 'table-sm', 'text-center', { 'table-hover': admin(), 't-hov': admin() }]" style="font-size:14px">
@@ -61,10 +113,8 @@
                     <!-- <tbody class="overflow-auto thov"  v-for="item in respuesta" :key="item.noInventario">
                         <tr @click="watchRow(item.noInventario)" 
                             v-if="(seleccionado == item.activoFijo || seleccionado == '0')  -->
-                    <tbody class="overflow-auto thov"  v-for="item in respuesta" :key="item.noInventario">
-                        <tr @click="watchRow(item.noInventario)" 
-                            v-if="(seleccionado == item.activoFijo || seleccionado == 'Todos') 
-                                && item.noInventario.indexOf(miNoInventario) != -1"> 
+                    <tbody class="overflow-auto thov"  v-for="item in datosmios" :key="item.noInventario">
+                        <tr @click="watchRow(item.noInventario)" > 
                                 <!-- https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Useful_string_methods -->
                             <td class="text-primary">{{ item.noInventario }}</td>
                             <td>{{ item.activoFijo }}</td>
@@ -107,10 +157,9 @@
                     <!-- <tbody v-for="item in respuesta" :key="item.noInventario">
                         <tr @click="watchRow(item.noInventario)" v-if="seleccionado == item.tipo || seleccionado == '0'"> -->
                             
-                    <tbody v-for="item in respuesta" :key="item.noInventario">
+                    <tbody v-for="item in datosmios" :key="item.noInventario">
                         <tr @click="watchRow(item.noInventario)" 
-                            v-if="(seleccionado == item.tipo || seleccionado == 'Todos')
-                            && item.noInventario.indexOf(miNoInventario) != -1">
+                            >
                             <!-- https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Useful_string_methods -->
                             <td class="text-primary">{{ item.noInventario }}</td>
                             <td>{{ item.tipo }}</td>
@@ -218,8 +267,16 @@ export default {
             respuesta: [],
             datosmios: [],
             tipo: [],
+            Ubica: [],
+            uso: [],
+            procesa: [],
+            os: [],
             tipoPrinters: [],
             seleccionado: String,
+            seleccionadoUbica: String,
+            seleccionadoUso: String,
+            seleccionadoProcesador: String,
+            seleccionadoOS: String,
             miNoInventario: String,
             file: null
         }
@@ -228,14 +285,24 @@ export default {
     created() {
         this.getComputers();
         this.traetipo();
+        this.traeUbica();
+        this.traeUso();
+        this.traeProcesador();
+        this.traeOS();
         this.seleccionado = "Todos";
+        this.seleccionadoUbica = "Todos";
+        this.seleccionadoUso = "Todos";
+        this.seleccionadoProcesador = "Todos";
+        this.seleccionadoOS = "Todos";
         this.miNoInventario = "";
+        this.contador = 0;
     },
 
     methods: {
         async getComputers() {
             this.loading = true;
             this.respuesta = [];
+            this.datosmios = [];
             const localToken = window.localStorage.token;
             axios.get(`${ config.api }/api/computers`, {
                 headers: {
@@ -252,10 +319,26 @@ export default {
                     this.$bvModal.show('session');
                 }
             });
+            axios.get(`${ config.api }/api/computers`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => {
+                this.datosmios = res.data.equipo;
+                this.loading = false;
+            })
+            .catch((error) => {
+                if(error.response.status === 409) {
+                    localStorage.clear();
+                    this.$bvModal.show('session');
+                }
+            });
         },
         async getPrinters() {
             this.loading = true;
             this.respuesta = [];
+            this.datosmios = [];
             const localToken = window.localStorage.token;
             axios.get(`${ config.api }/api/printers`, {
                 headers: {
@@ -273,6 +356,22 @@ export default {
                     this.$bvModal.show('session');
                 }
             });
+            axios.get(`${ config.api }/api/printers`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => {
+                this.datosmios = res.data.printers;
+                this.loading = false;
+            })
+            .catch(error => {
+                console.log(error.response);
+                if(error.response.status === 409) {
+                    localStorage.clear();
+                    this.$bvModal.show('session');
+                }
+            });
         },
         watchRow(noInventario) {
             localStorage.setItem('noInventario', noInventario);
@@ -291,6 +390,46 @@ export default {
             .then(res => this.tipo = res.data.tipo)
             .catch(err => console.log(err));
         },
+        async traeUbica(){
+            const localToken = window.localStorage.token;
+            axios.get(`${ config.api }/api/ubica`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => this.Ubica = res.data.ubica)
+            .catch(err => console.log(err));
+        },
+        async traeUso(){
+            const localToken = window.localStorage.token;
+            axios.get(`${ config.api }/api/uso`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => this.uso = res.data.uso)
+            .catch(err => console.log(err));
+        },
+        async traeOS(){
+            const localToken = window.localStorage.token;
+            axios.get(`${ config.api }/api/sisoper`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => this.os = res.data.sisoper)
+            .catch(err => console.log(err));
+        },
+        async traeProcesador(){
+            const localToken = window.localStorage.token;
+            axios.get(`${ config.api }/api/procesador`, {
+                headers: {
+                    token: localToken
+                }
+            })
+            .then(res => this.procesa = res.data.procesador)
+            .catch(err => console.log(err));
+        },
         async traetipoImpresora(){
             const localToken = window.localStorage.token;
             axios.get(`${ config.api }/api/tipoPrinters`, {
@@ -307,26 +446,64 @@ export default {
         // },
         changeView() {
             this.loading = true;
+            this.contador = 0;
+            this.seleccionado = "Todos";
+            this.seleccionadoUbica = "Todos";
+            this.seleccionadoUso = "Todos";
+            this.seleccionadoProcesador = "Todos";
+            this.seleccionadoOS = "Todos";
+            this.miNoInventario = "";
+            this.tipo=[];
+            this.tipoPrinters=[];
+            this.Ubica=[];
+            this.uso=[];
+            this.procesa=[];
+            this.os=[];
             if (this.pcView) {
                 this.pcView = !this.pcView;
                 this.getPrinters();
                 this.traetipoImpresora();
-                this.seleccionado = "Todos";
-                this.miNoInventario = "";
-                this.tipo=[' '];
+                this.traeUso();
+                this.traeUbica();
             }
             else{
                 this.pcView = !this.pcView;
                 this.getComputers();
                 this.traetipo();
-                this.seleccionado = "Todos";
-                this.miNoInventario = "";
+                this.traeUbica();
+                this.traeUso();
+                this.traeProcesador();
+                this.traeOS();
             }
-
+            this.generaMisDatos();
         },
         admin() {
             return JSON.parse(window.localStorage.isAdmin);
         },
+        generaMisDatos(){
+            this.datosmios = [];
+            if(this.pcView){
+                for (let i = 0, j = 0; i < this.respuesta.length; i++){
+                    if ((this.seleccionado == "Todos" || this.seleccionado == this.respuesta[i].activoFijo)
+                        && (this.seleccionadoUbica == this.respuesta[i].ubicacion || this.seleccionadoUbica == 'Todos') 
+                        && (this.seleccionadoUso == this.respuesta[i].uso || this.seleccionadoUso == 'Todos') 
+                        && (this.seleccionadoOS == this.respuesta[i].osname || this.seleccionadoOS == 'Todos') 
+                        && (this.seleccionadoProcesador == this.respuesta[i].procesador || this.seleccionadoProcesador == 'Todos')
+                        && ((this.respuesta[i].noInventario.indexOf(this.miNoInventario) != -1) || (this.respuesta[i].noSerie.indexOf(this.miNoInventario) != -1))){
+                        this.datosmios[j++] = this.respuesta[i];
+                    }
+                }
+            } else {
+                for (let i = 0, j = 0; i < this.respuesta.length; i++){
+                    if ((this.seleccionado == "Todos" || this.seleccionado == this.respuesta[i].tipo)
+                    && (this.seleccionadoUbica == this.respuesta[i].ubicacion || this.seleccionadoUbica == 'Todos')
+                    && (this.seleccionadoUso == this.respuesta[i].uso || this.seleccionadoUso == 'Todos')
+                    && ((this.respuesta[i].noInventario.indexOf(this.miNoInventario) != -1) || (this.respuesta[i].noSerie.indexOf(this.miNoInventario) != -1))){
+                        this.datosmios[j++] = this.respuesta[i];
+                    }
+                }
+            }
+        },
         onDescarga(datos){
             var miDato;
             const fecha = new Date();
@@ -359,19 +536,9 @@ export default {
             }
             nomArch += seg;
             if (this.pcView){
-                for (let i = 0, j = 0; i < datos.length; i++){
-                    if (this.seleccionado == "Todos" || this.seleccionado == datos[i].activoFijo){
-                        this.datosmios[j++] = datos[i];
-                    }
-                }
                 nomArch = "Computadoras" + nomArch;
                 miDato = MiXLSX.utils.json_to_sheet([],{ header : this.pcHeads});
             } else {
-                for (let i = 0, j = 0; i < datos.length; i++){
-                    if (this.seleccionado == "Todos" || this.seleccionado == datos[i].tipo){
-                        this.datosmios[j++] = datos[i];
-                    }
-                }
                 miDato = MiXLSX.utils.json_to_sheet([],{header : this.printerHeads});  // https://docs.sheetjs.com
                 nomArch = "Impresoras" + nomArch;
             }
@@ -385,9 +552,27 @@ export default {
         },
         buscaValor(){
             this.seleccionado = document.getElementById("tipo").value;
+            this.generaMisDatos();
+        },
+        buscaUbica(){
+            this.seleccionadoUbica = document.getElementById("Ubica").value;
+            this.generaMisDatos();
         },
         extraeInventario(){
             this.miNoInventario = document.getElementById("Inventario").value;
+            this.generaMisDatos();
+        },
+        buscaUso(){
+            this.seleccionadoUso = document.getElementById("Uso").value;
+            this.generaMisDatos();
+        },
+        buscaProcesador(){
+            this.seleccionadoProcesador = document.getElementById("Procesador").value;
+            this.generaMisDatos();
+        },
+        buscaSisOper(){
+            this.seleccionadoOS = document.getElementById("SisOper").value;
+            this.generaMisDatos();
         },
     },
 }