avance profesor, inicio qr

This commit is contained in:
2022-05-11 00:45:13 -05:00
parent 61c48b04f3
commit dd41fe7cdd
8 changed files with 489 additions and 13 deletions
+2
View File
@@ -179,6 +179,8 @@ export default {
localStorage.setItem('token', info.token)
localStorage.setItem('idProfesor', info.Profesor.idProfesor)
localStorage.setItem('nombre', info.Profesor.nombre)
localStorage.setItem('adscripcion', info.Profesor.adscripcion)
localStorage.setItem('numeroTrabajador', info.Profesor.numeroTrabajador)
this.updateIsLoading(false)
this.$router.push(`/${'profesor'}`)
+3 -3
View File
@@ -23,9 +23,9 @@
<script>
export default {
// data() {
// return { numeroTrabajador: localStorage.getItem('numeroTrabajador') }
// },
data() {
return { numeroTrabajador: localStorage.getItem('numeroTrabajador') }
},
methods: {
cerrarSesion() {
localStorage.clear()
+84
View File
@@ -0,0 +1,84 @@
<template>
<StreamBarcodeReader @decode="onDecode"> </StreamBarcodeReader>
</template>
<script>
import axios from 'axios'
import { StreamBarcodeReader } from 'vue-barcode-reader'
export default {
components: { StreamBarcodeReader },
data() {
return {
idAlumno: '',
idAlumnoAnterior: '',
leyendo: false,
isLoading: false,
}
},
props: {
imprimirWarning: { type: Function, required: true },
imprimirError: { type: Function, required: true },
imprimirMensaje: { type: Function, required: true },
actualizarIsLoading: { type: Function, required: true },
actualizarUpdateTabla: { type: Function, required: true },
},
methods: {
resetear() {
this.idAlumno = ''
this.leyendo = false
},
noSeguir() {
this.resetear()
this.idAlumnoAnterior = ''
},
confirmarAsistencia() {
const data = { idAlumno: this.idAlumno }
this.actualizarIsLoading(true)
axios
.put(`${process.env.api}/alumno/pasar_lista`, data)
.then((res) => {
this.resetear()
this.actualizarUpdateTabla(true)
this.actualizarIsLoading(false)
this.imprimirMensaje(res.data.message)
})
.catch((err) => {
this.actualizarIsLoading(false)
this.imprimirError(err.response.data)
})
},
onDecode(decodedString) {
try {
this.idAlumno = JSON.parse(decodedString).idAlumno
} catch (err) {
this.idAlumno = ''
this.imprimirError({ message: 'Este QR no es valido.' })
}
if (!this.leyendo) {
if (this.idAlumno && this.idAlumno != this.idAlumnoAnterior) {
this.leyendo = true
this.idAlumnoAnterior = this.idAlumno
this.imprimirWarning(
'Estas a punto de pasar asistencia a este alumno ¿Esta seguro de querer realizar esta acción?',
this.confirmarAsistencia,
this.noSeguir
)
}
}
},
},
}
</script>
<style>
video {
width: 100%;
}
.laser,
.overlay-element {
display: none;
}
</style>
+141 -1
View File
@@ -16,7 +16,8 @@
"nuxt-sweetalert2": "^1.0.0",
"validator": "^13.6.0",
"vue-barcode-reader": "^1.0.2",
"vue-json-csv": "^1.2.12"
"vue-json-csv": "^1.2.12",
"vue-qrcode-reader": "^3.1.0"
},
"devDependencies": {
"eslint-config-prettier": "^8.1.0",
@@ -2809,6 +2810,29 @@
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
},
"node_modules/barcode-detector": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/barcode-detector/-/barcode-detector-1.0.0.tgz",
"integrity": "sha512-LZSyqjumoq2WmMOeQZ2BiYYAqwnTlkXgqKOTcJlathpFS6IejsdSb6aIGmoSyOCjBgFNATzLgMJ9shNfklnz6A==",
"dependencies": {
"@zxing/library": "^0.18.4",
"jsqr": "^1.3.1"
}
},
"node_modules/barcode-detector/node_modules/@zxing/library": {
"version": "0.18.6",
"resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.18.6.tgz",
"integrity": "sha512-bulZ9JHoLFd9W36pi+7e7DnEYNJhljYjZ1UTsKPOoLMU3qtC+REHITeCRNx40zTRJZx18W5TBRXt5pq2Uopjsw==",
"dependencies": {
"ts-custom-error": "^3.0.0"
},
"engines": {
"node": ">= 10.4.0"
},
"optionalDependencies": {
"@zxing/text-encoding": "~0.9.0"
}
},
"node_modules/base": {
"version": "0.11.2",
"resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
@@ -3347,6 +3371,11 @@
"node": ">=4"
}
},
"node_modules/callforth": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/callforth/-/callforth-0.3.1.tgz",
"integrity": "sha512-Q2zPfqnwoKsb1DTVCr4lmhe49wKNBsMmNlbudjleu3/co+Nw1pOqFHYJHrW3VZ253ou9AAr+xauQR0C55NPdzA=="
},
"node_modules/callsites": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
@@ -6755,6 +6784,11 @@
"universalify": "^2.0.0"
}
},
"node_modules/jsqr": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/jsqr/-/jsqr-1.4.0.tgz",
"integrity": "sha512-dxLob7q65Xg2DvstYkRpkYtmKm2sPJ9oFhrhmudT1dZvNFFTlroai3AWSpLey/w5vMcLBXRgOJsbXpdN9HzU/A=="
},
"node_modules/kind-of": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
@@ -9746,6 +9780,18 @@
"inherits": "^2.0.1"
}
},
"node_modules/rtcpeerconnection-shim": {
"version": "1.2.15",
"resolved": "https://registry.npmjs.org/rtcpeerconnection-shim/-/rtcpeerconnection-shim-1.2.15.tgz",
"integrity": "sha512-C6DxhXt7bssQ1nHb154lqeL0SXz5Dx4RczXZu2Aa/L1NJFnEVDxFwCBo3fqtuljhHIGceg5JKBV4XJ0gW5JKyw==",
"dependencies": {
"sdp": "^2.6.0"
},
"engines": {
"node": ">=6.0.0",
"npm": ">=3.10.0"
}
},
"node_modules/run-async": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@@ -9827,6 +9873,11 @@
"resolved": "https://registry.npmjs.org/scule/-/scule-0.1.1.tgz",
"integrity": "sha512-1j2RlmUNADEprCkzDaeo8w2tdum/mvQWAKdRaS2raud7IOnPaDbLSFKhcY5xXPbAFYWk4ZQ0BUnfmg0ZUcI+Pg=="
},
"node_modules/sdp": {
"version": "2.12.0",
"resolved": "https://registry.npmjs.org/sdp/-/sdp-2.12.0.tgz",
"integrity": "sha512-jhXqQAQVM+8Xj5EjJGVweuEzgtGWb3tmEEpl3CLP3cStInSbVHSg0QWOGQzNq8pSID4JkpeV2mPqlMDLrm0/Vw=="
},
"node_modules/semver": {
"version": "6.3.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@@ -11374,6 +11425,18 @@
"resolved": "https://registry.npmjs.org/vue-no-ssr/-/vue-no-ssr-1.1.1.tgz",
"integrity": "sha512-ZMjqRpWabMPqPc7gIrG0Nw6vRf1+itwf0Itft7LbMXs2g3Zs/NFmevjZGN1x7K3Q95GmIjWbQZTVerxiBxI+0g=="
},
"node_modules/vue-qrcode-reader": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/vue-qrcode-reader/-/vue-qrcode-reader-3.1.0.tgz",
"integrity": "sha512-k2uoUjibxzdHJPfmsL1T9KVNzKPG/xIzKWMgBTXExoJlvZ5VKrBIFpP3P+rXNylfL3yw5AftE3K1yf4CoTkfkQ==",
"dependencies": {
"barcode-detector": "^1.0.0",
"callforth": "^0.3.1",
"core-js": "^3.6.5",
"vue": "^2.6.11",
"webrtc-adapter": "7.7.0"
}
},
"node_modules/vue-router": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
@@ -12367,6 +12430,19 @@
"node": ">= 8.0.0"
}
},
"node_modules/webrtc-adapter": {
"version": "7.7.0",
"resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-7.7.0.tgz",
"integrity": "sha512-7Bp9OBnx642oJRkom1tNAbeJjUadAq2rh5xLL9YXPw5hVyt2h4hHr5bcoPYDs1stp/mZHSPSQA34YISdnr0DBQ==",
"dependencies": {
"rtcpeerconnection-shim": "^1.2.15",
"sdp": "^2.12.0"
},
"engines": {
"node": ">=6.0.0",
"npm": ">=3.10.0"
}
},
"node_modules/which": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
@@ -15170,6 +15246,26 @@
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
},
"barcode-detector": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/barcode-detector/-/barcode-detector-1.0.0.tgz",
"integrity": "sha512-LZSyqjumoq2WmMOeQZ2BiYYAqwnTlkXgqKOTcJlathpFS6IejsdSb6aIGmoSyOCjBgFNATzLgMJ9shNfklnz6A==",
"requires": {
"@zxing/library": "^0.18.4",
"jsqr": "^1.3.1"
},
"dependencies": {
"@zxing/library": {
"version": "0.18.6",
"resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.18.6.tgz",
"integrity": "sha512-bulZ9JHoLFd9W36pi+7e7DnEYNJhljYjZ1UTsKPOoLMU3qtC+REHITeCRNx40zTRJZx18W5TBRXt5pq2Uopjsw==",
"requires": {
"@zxing/text-encoding": "~0.9.0",
"ts-custom-error": "^3.0.0"
}
}
}
},
"base": {
"version": "0.11.2",
"resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
@@ -15616,6 +15712,11 @@
"caller-callsite": "^2.0.0"
}
},
"callforth": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/callforth/-/callforth-0.3.1.tgz",
"integrity": "sha512-Q2zPfqnwoKsb1DTVCr4lmhe49wKNBsMmNlbudjleu3/co+Nw1pOqFHYJHrW3VZ253ou9AAr+xauQR0C55NPdzA=="
},
"callsites": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
@@ -18415,6 +18516,11 @@
"universalify": "^2.0.0"
}
},
"jsqr": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/jsqr/-/jsqr-1.4.0.tgz",
"integrity": "sha512-dxLob7q65Xg2DvstYkRpkYtmKm2sPJ9oFhrhmudT1dZvNFFTlroai3AWSpLey/w5vMcLBXRgOJsbXpdN9HzU/A=="
},
"kind-of": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
@@ -20913,6 +21019,14 @@
"inherits": "^2.0.1"
}
},
"rtcpeerconnection-shim": {
"version": "1.2.15",
"resolved": "https://registry.npmjs.org/rtcpeerconnection-shim/-/rtcpeerconnection-shim-1.2.15.tgz",
"integrity": "sha512-C6DxhXt7bssQ1nHb154lqeL0SXz5Dx4RczXZu2Aa/L1NJFnEVDxFwCBo3fqtuljhHIGceg5JKBV4XJ0gW5JKyw==",
"requires": {
"sdp": "^2.6.0"
}
},
"run-async": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@@ -20987,6 +21101,11 @@
"resolved": "https://registry.npmjs.org/scule/-/scule-0.1.1.tgz",
"integrity": "sha512-1j2RlmUNADEprCkzDaeo8w2tdum/mvQWAKdRaS2raud7IOnPaDbLSFKhcY5xXPbAFYWk4ZQ0BUnfmg0ZUcI+Pg=="
},
"sdp": {
"version": "2.12.0",
"resolved": "https://registry.npmjs.org/sdp/-/sdp-2.12.0.tgz",
"integrity": "sha512-jhXqQAQVM+8Xj5EjJGVweuEzgtGWb3tmEEpl3CLP3cStInSbVHSg0QWOGQzNq8pSID4JkpeV2mPqlMDLrm0/Vw=="
},
"semver": {
"version": "6.3.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@@ -22298,6 +22417,18 @@
"resolved": "https://registry.npmjs.org/vue-no-ssr/-/vue-no-ssr-1.1.1.tgz",
"integrity": "sha512-ZMjqRpWabMPqPc7gIrG0Nw6vRf1+itwf0Itft7LbMXs2g3Zs/NFmevjZGN1x7K3Q95GmIjWbQZTVerxiBxI+0g=="
},
"vue-qrcode-reader": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/vue-qrcode-reader/-/vue-qrcode-reader-3.1.0.tgz",
"integrity": "sha512-k2uoUjibxzdHJPfmsL1T9KVNzKPG/xIzKWMgBTXExoJlvZ5VKrBIFpP3P+rXNylfL3yw5AftE3K1yf4CoTkfkQ==",
"requires": {
"barcode-detector": "^1.0.0",
"callforth": "^0.3.1",
"core-js": "^3.6.5",
"vue": "^2.6.11",
"webrtc-adapter": "7.7.0"
}
},
"vue-router": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
@@ -23136,6 +23267,15 @@
"wrap-ansi": "^6.0.0"
}
},
"webrtc-adapter": {
"version": "7.7.0",
"resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-7.7.0.tgz",
"integrity": "sha512-7Bp9OBnx642oJRkom1tNAbeJjUadAq2rh5xLL9YXPw5hVyt2h4hHr5bcoPYDs1stp/mZHSPSQA34YISdnr0DBQ==",
"requires": {
"rtcpeerconnection-shim": "^1.2.15",
"sdp": "^2.12.0"
}
},
"which": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+2 -1
View File
@@ -17,7 +17,8 @@
"nuxt-sweetalert2": "^1.0.0",
"validator": "^13.6.0",
"vue-barcode-reader": "^1.0.2",
"vue-json-csv": "^1.2.12"
"vue-json-csv": "^1.2.12",
"vue-qrcode-reader": "^3.1.0"
},
"devDependencies": {
"eslint-config-prettier": "^8.1.0",
+10 -8
View File
@@ -12,7 +12,7 @@
drag-drop
expanded
>
<div class="section has-text-centered">
<div class="section has-text-centered m-3">
<b-icon icon="upload" size="is-large" class="mb-2" />
<p class="is-size-5">
@@ -22,11 +22,6 @@
</p>
<p class="is-size-6">Tamaño máximo 20MB</p>
<p class="is-size-7">
Si al momento de elegir un archivo este no se selecciona, haga click
en cancelar en la ventana emergente e intente de nuevo.
</p>
</div>
</b-upload>
</b-field>
@@ -36,7 +31,7 @@
</b-button>
</div>
<p class="is-size-4 my-3">Descargar base de datos invitados:</p>
<div class="has-text-centered">
<div class="boton has-text-centered">
<b-button class="is-info">
<JsonCSV
class="btn btn-default"
@@ -55,7 +50,6 @@
<script>
import JsonCSV from 'vue-json-csv'
import axios from 'axios'
import sweetalert2 from 'sweetalert2'
export default {
components: {
@@ -155,4 +149,12 @@ export default {
.full-h {
height: 75vh;
}
@media (max-width: 768px) {
.container {
margin: 0 15px !important;
}
.full-h {
height: 80vh;
}
}
</style>
+113
View File
@@ -0,0 +1,113 @@
<template>
<section class="container full-h">
<div class="my-3 has-text-centered">
<p class="is-size-2">Lector de códigos QR</p>
</div>
<!-- <p class="is-size-4 my-3">Subir base de datos de los profesores:</p> -->
<div v-if="!isReading" class="has-text-centered mb-4">
<b-button type="is-info" @click="() => this.isReading = true">
Leer QR
</b-button>
</div>
<StreamBarcodeReader @decode="onDecode"> </StreamBarcodeReader>
<b-loading :is-full-page="true" v-model="isLoading" :can-cancel="false" />
</section>
</template>
<script>
import { StreamBarcodeReader } from 'vue-barcode-reader'
import axios from 'axios'
export default {
components: { StreamBarcodeReader },
data() {
return {
isLoading: false,
isReading: false,
idProfesor: ''
}
},
methods: {
resetear() {
if (this.idProfesor) this.idProfesor = ''
},
onDecode(decodedString) {
let decodedData = {}
try {
decodedData = JSON.parse(decodedString)
} catch (err) {
this.resetear()
}
if (decodedData.idProfesor) {
if (typeof decodedData.idProfesor === 'number')
this.idProfesor = decodedData.idProfesor.toString()
else this.idProfesor = decodedData.idProfesor
}
if (this.idProfesor)
this.enviar(this.idProfesor)
},
// confirmarEnviar() {
// this.$swal({
// title: '¿Estás seguro de querer registrar este invitado?',
// type: 'question',
// timer: 9000,
// showCancelButton: true,
// cancelButtonColor: '#d33',
// confirmButtonText: 'Aceptar',
// confirmButtonColor: '#1e3c70',
// }).then((res) => {
// if (res.value) {
// this.enviar()
// }
// })
// },
enviar(idProfesor) {
console.log(`Se ha enviado el qr con id ${idProfesor}`)
// const formData = new FormData()
// this.isLoading = true
// formData.append('file', this.csv)
// axios
// .post(`${process.env.api}/profesor/cargarDatos`, formData)
// .then((res) => {
// this.isLoading = false
// this.csv = {}
// this.successUpload()
// }).catch(err => {
// this.isLoading = false
// this.csv = {}
// console.log(err)
// this.errorMessage()
// })
},
// successUpload() {
// this.$swal({
// title: 'Se ha subido el archivo con éxito.',
// type: 'success',
// timer: 5000,
// confirmButtonText: 'Aceptar',
// confirmButtonColor: '#1e3c70',
// })
// },
// errorMessage(){
// this.$swal({
// title: 'Ha ocurrido un error al subir el archivo.',
// type: 'error',
// timer: 5000,
// confirmButtonText: 'Aceptar',
// confirmButtonColor: '#1e3c70',
// })
// }
},
layout: 'default',
}
</script>
<style scoped>
.full-h {
height: 75vh;
}
</style>
+134
View File
@@ -0,0 +1,134 @@
<template>
<div class="container full-h">
<div class="my-3 has-text-centered">
<p class="is-size-2 my-5">
REGISTRO DE PROFESORES PARA LA OBTENCIÓN DE MEDALLA
</p>
</div>
<div class="is-flex is-justify-content-center box">
<div>
<p class="is-size-4 block"><b>Nombre:</b> {{ `${Profesor.nombre}` }}</p>
<p class="is-size-4 block">
<b>Número de trabajador: </b>{{ `${Profesor.numeroTrabajador}` }}
</p>
<p class="is-size-4 block">
<b>Adscripción:</b> {{ `${Profesor.adscripcion}` }}
</p>
<div class="is-flex">
<p class="is-size-4 block mr-4"><b>Cantidad de invitados: </b></p>
<b-select
v-model="numeroInvitados"
placeholder="Seleccione"
class="is-size-4 block mx-0"
>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</b-select>
</div>
</div>
</div>
<p v-if="flag" class="is-size-3 my-5">Información de los invitados:</p>
<div
v-for="(item, index) in invitados"
v-bind:key="index"
class="is-flex is-justify-content-center box"
>
<div>
<p class="is-size-3 has-text-centered block">
{{ `Invitado ${index + 1}` }}
</p>
<div class="columns">
<div class="column">
<p class="is-size-4 block has-text-weight-bold">Nombre(s):</p>
<p class="is-size-4 block has-text-weight-bold">Apellidos:</p>
<p class="is-size-4 block has-text-weight-bold">Edad:</p>
</div>
<div class="column">
<b-input
expanded
class="block"
type="text"
v-model="invitados[index].nombre"
></b-input>
<b-input
expanded
class="block"
type="text"
v-model="invitados[index].apellido"
></b-input>
<b-input
expanded
class="block"
type="number"
min="0"
v-model="invitados[index].edad"
></b-input>
</div>
</div>
</div>
</div>
<div class="has-text-centered">
<b-button
v-if="mostrarBoton()"
class="is-success mb-5"
@click="enviar()"
>Enviar</b-button
>
</div>
</div>
</template>
<script>
export default {
data() {
return {
Profesor: {},
numeroInvitados: null,
invitados: [],
flag: false,
isDisabled: false,
}
},
methods: {
enviar() {
console.log(this.invitados)
},
mostrarBoton(){
console.log("validando")
console.log(this.numeroInvitados)
if(this.numeroInvitados === 0) return true
let counter = 0
this.invitados.forEach(item => {
if(item.nombre && item.apellido && item.edad) counter += 1
});
if(counter == this.numeroInvitados) return true
this.isDisabled = true
}
},
created() {
this.Profesor.idProfesor = localStorage.getItem('idProfesor')
this.Profesor.nombre = localStorage.getItem('nombre')
this.Profesor.adscripcion = localStorage.getItem('adscripcion')
this.Profesor.numeroTrabajador = localStorage.getItem('numeroTrabajador')
},
watch: {
numeroInvitados() {
this.invitados = []
if (this.numeroInvitados > 0) this.flag = true
else this.flag = false
for (let i = 0; i < this.numeroInvitados; i++) {
this.invitados[i] = {}
}
},
},
layout: 'profesor',
}
</script>
<style scoped>
/* .full-h {
height: 75vh;
} */
</style>