pcpuma_unam_operador/components/panel_admin/AdminEquipo.vue
2023-01-08 22:51:24 -06:00

337 lines
8.7 KiB
Vue

<template>
<div class="column is-4">
<h3 class="is-size-4 mb-4">Administrador</h3>
<b-field label="Status">
<b-select
icon="list-status"
:disabled="!equipo.id_equipo"
v-model="idStatus"
expanded
rounded
>
<option
v-for="(s, index) in status"
:key="index"
:value="s.id_status"
v-show="equipo.id_equipo"
:disabled="disabledS(s.id_status, equipo.status.id_status)"
>
{{ s.status }}
</option>
</b-select>
</b-field>
<b-field label="Motivo" v-if="mostrarMotivo">
<b-input
icon="list-status"
maxlength="250"
type="textarea"
:disabled="!equipo.id_equipo"
v-model="motivo"
rounded
/>
</b-field>
<b-field label="Tipo de conector">
<b-select
icon="list-status"
:disabled="!equipo.id_equipo"
v-model="idTipoEntrada"
expanded
rounded
>
<option disabled :value="null">Tipo de conector</option>
<option
v-for="(tipoEntrada, index) in tipoEntradas"
:key="index"
:value="tipoEntrada.id_tipo_entrada"
:disabled="disabledT(tipoEntrada.id_tipo_entrada)"
>
{{ tipoEntrada.tipo_entrada }}
</option>
</b-select>
</b-field>
<b-field
label="Software"
v-if="equipo.carrito.tipoCarrito.id_tipo_carrito === 2"
>
<b-select
icon="list-status"
v-model="idPrograma"
:disabled="!equipo.id_equipo"
expanded
rounded
>
<option disabled :value="null">Software</option>
<option
v-for="(programa, index) in programas"
:key="index"
:value="programa.id_programa"
:disabled="disabledP(programa.id_programa)"
>
{{ programa.programa }}
</option>
</b-select>
</b-field>
<b-field
label="Cambiar nombre del equipo"
v-if="operador.tipoUsuario.id_tipo_usuario === 3"
>
<b-input
icon="list-status"
placeholder="Nuevo nombre del equipo"
:disabled="!equipo.id_equipo"
v-model="nuevoNombreEquipo"
rounded
/>
</b-field>
<b-button
class="my-5"
label="Actualizar Información"
type="is-link"
v-show="equipo.id_equipo"
@click="
$alertsGenericos.imprimirWarning(
$buefy,
`¿Estas segur@ que deseas cambiar esta información?`,
updateInformacion
)
"
:disabled="mostrarBoton()"
rounded
expanded
/>
</div>
</template>
<script>
import axios from 'axios'
export default {
props: {
updateIsLoading: { type: Function, required: true, default: () => {} },
buscar: { type: Function, required: true, default: () => {} },
equipo: { type: Object, required: true, default: () => ({}) },
operador: { type: Object, required: true, default: () => ({}) },
},
data() {
return {
programas: [],
status: [],
tipoEntradas: [],
idPrograma: null,
idTipoEntrada: null,
idStatus: '',
nuevoNombreEquipo: '',
motivo: '',
mostrarMotivo: false,
}
},
methods: {
mostrarBoton() {
if (
(this.idStatus != this.equipo.status.id_status && this.motivo) ||
this.idTipoEntrada ||
this.idPrograma ||
(this.nuevoNombreEquipo && this.nuevoNombreEquipo != this.equipo.equipo)
)
return false
return true
},
disabledS(idStatus, idStatusEquipo) {
if (idStatus > 1 && idStatus < 4) return true
if (idStatusEquipo === 2 || idStatusEquipo === 3) return true
else return false
},
disabledT(idTipoEntrada) {
for (let i = 0; i < this.equipo.tiposEntradas.length; i++) {
if (
this.equipo.tiposEntradas[i].tipoEntrada.id_tipo_entrada ===
idTipoEntrada
)
return true
}
},
disabledP(idPrograma) {
for (let i = 0; i < this.equipo.programas.length; i++) {
if (this.equipo.programas[i].programa.id_programa === idPrograma)
return true
}
},
updateInformacion() {
if (
this.idStatus != this.equipo.status.id_status ||
this.nuevoNombreEquipo != ''
)
this.updateEquipo()
if (
this.idPrograma &&
!this.equipo.programas.find((element) => element === this.idPrograma)
)
this.crearEquipoPrograma()
if (
this.idTipoEntrada &&
!this.equipo.tiposEntradas.find(
(element) => element === this.idTipoEntrada
)
)
this.crearTipoEntrada()
},
updateEquipo() {
const data = { id_equipo: this.equipo.id_equipo }
if (this.idStatus && this.idStatus != this.equipo.status.id_status) {
data.id_status = this.idStatus
data.motivo = this.motivo
}
if (this.nuevoNombreEquipo) data.equipo = this.nuevoNombreEquipo
this.updateIsLoading(true)
return axios
.put(`${process.env.api}/equipo`, data, this.$getToken.token())
.then((res) => {
if (this.mostrarMotivo) this.mostrarMotivo = false
if (this.motivo) this.motivo = ''
this.buscar()
this.updateIsLoading(false)
this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
})
.catch((err) => {
this.updateIsLoading(false)
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
crearEquipoPrograma() {
const data = {
id_equipo: this.equipo.id_equipo,
id_programa: this.idPrograma,
}
this.updateIsLoading(true)
return axios
.post(
`${process.env.api}/equipo-programa`,
data,
this.$getToken.token()
)
.then((res) => {
this.idPrograma = null
this.buscar()
this.updateIsLoading(false)
this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
})
.catch((err) => {
this.updateIsLoading(false)
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
crearTipoEntrada() {
const data = {
id_equipo: this.equipo.id_equipo,
id_tipo_entrada: this.idTipoEntrada,
}
this.updateIsLoading(true)
return axios
.post(
`${process.env.api}/equipo-tipo-entrada`,
data,
this.$getToken.token()
)
.then((res) => {
this.idTipoEntrada = null
this.buscar()
this.updateIsLoading(false)
this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
})
.catch((err) => {
this.updateIsLoading(false)
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
obtenerCatalogoStatus() {
return axios
.get(`${process.env.api}/status`, this.$getToken.token())
.then((res) => {
this.status = res.data
})
.catch((err) => {
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
obtenerCatalogoProgramas() {
return axios
.get(`${process.env.api}/institucion-programa`, this.$getToken.token())
.then((res) => {
this.programas = res.data
})
.catch((err) => {
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
obtenerCatalogoTipoEntradas() {
return axios
.get(
`${process.env.api}/institucion-tipo-entrada`,
this.$getToken.token()
)
.then((res) => {
this.tipoEntradas = res.data
})
.catch((err) => {
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
},
watch: {
equipo() {
this.obtenerCatalogoProgramas()
this.obtenerCatalogoTipoEntradas()
this.idStatus = this.equipo.status.id_status
this.idCarrito = this.equipo.carrito.id_carrito
if (this.equipo.programa)
this.idPrograma = this.equipo.programa.id_programa
},
idStatus(value) {
if (value != this.equipo.status.id_status) this.mostrarMotivo = true
},
},
created() {
this.obtenerCatalogoStatus()
this.idStatus = this.equipo.status.id_status
},
}
</script>
<style></style>