V-1.9-loading-colores

This commit is contained in:
Andres2908
2020-11-29 19:41:17 -06:00
parent 73854eb031
commit 0d238306aa
+49 -33
View File
@@ -2,7 +2,7 @@
<div class="container">
<div class="columns">
<div class="column is-3 mb-0 ">
<div class="column is-3 mb-0">
<b-field >
<b-input
placeholder="No.Cuenta"
@@ -26,17 +26,17 @@
</b-field>
</div>
<div class="column is-3" >
<div class="column is-3 mb-4 pb-4 " >
<b-field>
<b-select placeholder="Status" icon="information" value="1" expanded rounded v-model="idStatus">
<b-select placeholder="Status" icon="information" expanded rounded v-model="idStatus">
<optgroup label="Status">
<option value="1">Pre-registro</option>
<option value="2">Pre-validado</option>
<option value="3">Registro</option>
<option value="4">Pre-término</option>
<option value="5">Término</option>
<option value="6">Liberado</option>
<option value="7">Rechazado</option>
<option value=1>Pre-registro</option>
<option value=2>Pre-validado</option>
<option value=3>Registro</option>
<option value=4>Pre-término</option>
<option value=5>Término</option>
<option value=6>Liberado</option>
<option value=7>Rechazado</option>
</optgroup>
</b-select>
</b-field>
@@ -60,6 +60,8 @@
:data="data"
:loading="loading"
hoverable
striped
paginated
backend-pagination
:total="total"
@@ -69,33 +71,33 @@
<b-table-column field="nombre" label="Nombre" v-slot="props" centered>
{{ props.row.nombre}}
</b-table-column>
<b-table-column field="numeroCuenta" label="Numero de Cuenta" v-slot="props" centered>
<b-table-column field="numeroCuenta" label="Número de Cuenta" v-slot="props" centered>
{{ props.row.numeroCuenta}}
</b-table-column>
<b-table-column field="carrera" label="Carrera" v-slot="props" centered>
{{ props.row.carrera}}
</b-table-column>
<b-table-column field="fechaInicio" label="fecha Inicio" v-slot="props" centered>
<b-table-column field="fechaInicio" truncate=10 label="Fecha Inicio" v-slot="props" centered>
{{ props.row.fechaInicio}}
</b-table-column>
<b-table-column field="fechaFin" label="Fecha fin" v-slot="props" centered>
<b-table-column field="fechaFin" label="Fecha Fin" v-slot="props" centered>
{{ props.row.fechaFin}}
</b-table-column>
<b-table-column field="status" label="Status" v-slot="props" centered>
<span class="tag" :class="types(props.row.status)">{{ props.row.status}}</span>
</b-table-column>
<!--
<b-table-column field="cartaTermino" label="Carta Término" v-slot="props" centered v-if="id == 2">
<div v-if="props.row.idStatus === 'Pre-Termino'">
<div v-if="props.row.status === 'Pre-Termino'">
<span
v-if="props.row.cartaTermino === true"
v-if="props.row.cartaTermino === 1"
>
<b-icon :icon="iconoCarta(props.row.cartaTermino)"
class="tag is-success"></b-icon>
</span>
<b-button
v-if="props.row.cartaTermino === false"
v-if="props.row.cartaTermino === null"
size="is-small"
:class="botonCarta(props.row.cartaTermino)"
:icon="iconoCarta(props.row.cartaTermino)">
@@ -103,10 +105,9 @@
</b-button>
</div>
</b-table-column>
-->
<b-table-column field="cuestionario" label="Cuestionario" v-slot="props" centered v-if="id == 2">
<div
v-if="props.row.status === 'Pre-Termino'">
<div v-if="props.row.status === 'Pre-Termino'">
<span
v-if="props.row.cuestionario === 1"
>
@@ -115,7 +116,7 @@
</span>
<b-button
v-if="props.row.cuestionario === 2"
v-if="props.row.cuestionario === null"
size="is-small"
:class="botonCuestionario(props.row.cuestionario)"
:icon="iconoCuestionario(props.row.cuestionario)">
@@ -148,8 +149,7 @@ export default {
perPage: 25,
numeroCuenta: '',
nombre: '',
idStatus: '',
tipoUsuario: 1
idStatus: 1
}
},
props: {
@@ -183,21 +183,21 @@ export default {
}
},
botonCarta (cartaTermino) {
if (cartaTermino === true) {
if (cartaTermino === 1) {
return 'is-success'
} else {
return 'is-danger'
}
},
botonCuestionario (cuestionario) {
if (cuestionario === true) {
if (cuestionario === 1) {
return 'is-success'
} else {
return 'is-danger'
}
},
iconoCarta (cartaTermino) {
if (cartaTermino === true) {
if (cartaTermino === 1) {
return 'check'
} else {
return 'close'
@@ -211,15 +211,14 @@ export default {
}
},
obtenerDatos () {
// this.loading = true
this.loading = true
this.data = []
if (this.idStatus || this.nombre || this.numeroCuenta) {
/* if (this.idStatus || this.nombre || this.numeroCuenta) {
this.page = 1
}
axios.get(`${process.env.api}/servicio/servicios_responsable?idUsuario=2&pagina=${this.page}&idStatus&nombre=${this.nombre}&numeroCuenta=${this.numeroCuenta}`)
} */
axios.get(`${process.env.api}/servicio/servicios_responsable?idUsuario=2&pagina=${this.page}&idStatus=${this.idStatus}&nombre=${this.nombre}&numeroCuenta=${this.numeroCuenta}`)
.then(res => {
const servicios = res.data.servicios
// this.page = 1
if (servicios.length !== 0) {
for (let i = 0; i < servicios.length; i++) {
@@ -230,14 +229,15 @@ export default {
fechaInicio: servicios[i].fechaInicio,
fechaFin: servicios[i].fechaFin,
status: servicios[i].Status.status,
cuestionario: servicios[i].idCuestionarioAlumno
cuestionario: servicios[i].idCuestionarioPrograma,
cartaTermino: servicios[i].cartaTermino
})
}
}
let currentTotal = servicios.length
let contador
for (let i = 0; i < ((res.data.faltantes + res.data.registros) / 25) + 1; i++) {
for (let i = 0; i < (res.data.registros / 25) + 1; i++) {
contador = i
}
currentTotal = this.perPage * contador
@@ -253,4 +253,20 @@ export default {
</script>
<style>
.input:focus{
border:#1b3d70;
box-shadow: 0 0 8px 0 #1b3d70;
}
.select select:focus{
border-color: #1b3d70;
box-shadow: 0 0 8px 0 #1b3d70;
/* #4776EA */
}
.select:not(.is-multiple):not(.is-loading)::after{
border-color: #1b3d70;
}
.pagination-link.is-current {
background-color: #1b3d70;
border-color: #1b3d70;
}
</style>