arturogll
282 lines
8.4 KiB
Vue
282 lines
8.4 KiB
Vue
<template lang="pug">
|
|
main
|
|
.modal#modal
|
|
.modal-background
|
|
.modal-card
|
|
header.modal-card-head
|
|
p.modal-card-title Actualizar Multa
|
|
button.delete(v-on:click="toggleModal()")
|
|
section.modal-card-body
|
|
.field
|
|
label.label No serie
|
|
.control
|
|
input.input(type="text" v-model="equipo.no_serie" placeholder="Numero de serie")
|
|
.field
|
|
label.label No inventario
|
|
.control
|
|
input.input( v-model="equipo.no_inventario" placeholder="Numero de inventario")
|
|
br
|
|
.field
|
|
br
|
|
input#switch.switch.is-danger(type="checkbox" v-model="equipo.baja")
|
|
label(for="switch") Suspender equipo
|
|
footer.modal-card-foot
|
|
button.button.is-success(v-on:click="update()") Guardar
|
|
button.button(v-on:click="toggleModal()") Cancelar
|
|
.pageloader.is-u-blue#pageloader
|
|
span.title.is-size-3 Puma trabajando
|
|
.container
|
|
.columns
|
|
.column.is-8
|
|
br
|
|
h1.is-size-1 Carritos
|
|
.columns
|
|
.column.is-3
|
|
.field
|
|
.control.has-icons-left
|
|
input.input(v-model="search" placeholder="Buscar")
|
|
span.icon.is-small.is-left
|
|
font-awesome-icon(icon="search")
|
|
.column.is-2
|
|
.field
|
|
p.control.has-icons-left
|
|
span.select.is-fullwidth
|
|
select.is-fullwidth(v-model="tipo")
|
|
option laptop
|
|
option ipad
|
|
option chromebook
|
|
span.icon.is-small.is-left
|
|
font-awesome-icon(icon="laptop")
|
|
.column.is-2
|
|
.field
|
|
p.control.has-icons-left
|
|
span.select.is-fullwidth
|
|
select.is-fullwidth(v-model="car")
|
|
option(v-for="car in carrito") {{ car.carrito }}
|
|
span.icon.is-small.is-left
|
|
.column.is-1
|
|
.field.has-text-right
|
|
.button.is-u-golden(v-on:click="upload()") subir
|
|
.column.is-3
|
|
.field
|
|
.file.is-u-blue.is-right
|
|
label.file-label
|
|
input#file.file-input(type="file" ref="file" v-on:change="changeFile()")
|
|
span.file-cta
|
|
span.file-icon
|
|
i
|
|
font-awesome-icon(icon="upload")
|
|
span.file-label Elige un Archivo csv
|
|
|
|
.columns
|
|
.column.is-12
|
|
br
|
|
br
|
|
table.table.is-fullwidth.is-hoverable.is-narrow.is-striped
|
|
thead
|
|
tr
|
|
th Carrito
|
|
th Equipo
|
|
th No Serie
|
|
th No Inventario
|
|
th Tipo
|
|
th Activo
|
|
th Editar
|
|
tbody
|
|
tr(v-for="dt in filteredEquipo")
|
|
td {{dt["carritos.id"]}}
|
|
td {{dt["carritos.equipos.equipo_carrito"]}}
|
|
td {{dt["carritos.equipos.no_serie"]}}
|
|
td {{dt["carritos.equipos.no_inventario"]}}
|
|
td {{dt["carritos.equipos.equipo"]}}
|
|
td
|
|
span.tag.is-success(v-if="dt['carritos.equipos.baja'] == '0'") activo
|
|
span.tag.is-warning(v-else) desactivado
|
|
td
|
|
a.button.is-u-blue.is-outlined(v-on:click="setUpdate(dt)")
|
|
span.icon.is-small
|
|
font-awesome-icon(icon="pen")
|
|
</template>
|
|
|
|
<script>
|
|
import UmHeader from './Header.vue'
|
|
import UmFooter from './Footer.vue'
|
|
import swal from 'sweetalert'
|
|
import api from '../api'
|
|
const axios = require('axios')
|
|
|
|
export default {
|
|
components: {
|
|
UmFooter,
|
|
UmHeader
|
|
},
|
|
name: 'equipo',
|
|
data () {
|
|
return {
|
|
search: '',
|
|
msg: 'hola',
|
|
data: [],
|
|
carrito: [],
|
|
tipo: '',
|
|
car: '',
|
|
file: '',
|
|
equipo: {
|
|
no_serie: '',
|
|
no_inventario: '',
|
|
baja: '',
|
|
id:''
|
|
}
|
|
}
|
|
},
|
|
mounted () {
|
|
axios.get(api.url + '/equipo/?kiosko=' + window.localStorage.pcpumaK, {
|
|
headers: {
|
|
'token': window.localStorage.pcpumaT
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log(response)
|
|
this.data = response.data.data
|
|
})
|
|
.catch(error => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
methods: {
|
|
update : function () {
|
|
this.toggleModal()
|
|
axios({
|
|
method: 'put',
|
|
url: api.url + '/equipo',
|
|
data:this.equipo,
|
|
headers: {
|
|
'token': window.localStorage.pcpumaT
|
|
}
|
|
})
|
|
.then(response => {
|
|
swal('Exito', 'Se actualizo', 'success')
|
|
|
|
// axios.get(api.url + '/equipo/?kiosko=' + window.localStorage.pcpumaK, {
|
|
// headers: {
|
|
// 'token': window.localStorage.pcpumaT
|
|
// }
|
|
// })
|
|
// .then(response => {
|
|
// // console.log(response)
|
|
// this.data = response.data.data
|
|
// swal('Exito', 'Se cargarón los datos', 'success')
|
|
// })
|
|
// .catch(error => {
|
|
// swal('Error', error.response.data.err, 'error')
|
|
// })
|
|
})
|
|
.catch(error => {
|
|
swal('Error', error.response.data.err, 'error')
|
|
})
|
|
},
|
|
setUpdate: function (dt) {
|
|
console.log(dt)
|
|
this.toggleModal()
|
|
this.equipo.no_serie = dt['carritos.equipos.no_serie']
|
|
this.equipo.no_inventario = dt['carritos.equipos.no_inventario']
|
|
this.equipo.baja = dt['carritos.equipos.baja']
|
|
this.equipo.id = dt['carritos.equipos.id']
|
|
},
|
|
toggleModal: function () {
|
|
let modal = document.getElementById('modal')
|
|
if (!modal.classList.contains('is-active')) {
|
|
modal.classList.add('is-active')
|
|
} else {
|
|
modal.classList.remove('is-active')
|
|
}
|
|
},
|
|
count: function (arr) {
|
|
return `${arr.length}`
|
|
},
|
|
changeFile: function () {
|
|
this.file = event.target.files[0]
|
|
console.log(this.file)
|
|
},
|
|
upload: function () {
|
|
// Add a request interceptor
|
|
const fue = axios.interceptors.request.use(function (config) {
|
|
// Do something before request is sent
|
|
document.getElementById('pageloader').classList.add('is-active')
|
|
console.log('sefue')
|
|
return config
|
|
}, function (error) {
|
|
// Do something with request error
|
|
return Promise.reject(error)
|
|
})
|
|
// Add a response interceptor
|
|
const regreso = axios.interceptors.response.use(function (response) {
|
|
// Do something with response data
|
|
document.getElementById('pageloader').classList.remove('is-active')
|
|
console.log('regreso')
|
|
return response
|
|
}, function (error) {
|
|
// Do something with response error
|
|
return Promise.reject(error)
|
|
})
|
|
let data = new FormData()
|
|
data.append('archivo', this.file)
|
|
axios({
|
|
method: 'post',
|
|
url: api.url + '/carrito-upload',
|
|
data,
|
|
headers: {
|
|
admin: '123',
|
|
'Content-Type': 'multipart/form-data',
|
|
'token': window.localStorage.pcpumaT
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log(response.data)
|
|
axios.interceptors.request.eject(fue)
|
|
axios.interceptors.request.eject(regreso)
|
|
axios.get(api.url + '/equipo/?kiosko=' + window.localStorage.pcpumaK, {
|
|
headers: {
|
|
'token': window.localStorage.pcpumaT
|
|
}
|
|
})
|
|
.then(response => {
|
|
// console.log(response)
|
|
this.data = response.data.data
|
|
swal('Exito', 'Se cargarón los datos', 'success')
|
|
})
|
|
.catch(error => {
|
|
swal('Error', error.response.data.err, 'error')
|
|
})
|
|
})
|
|
.catch(error => {
|
|
console.log(error.response.data)
|
|
})
|
|
}
|
|
},
|
|
computed: {
|
|
filteredEquipo: function () {
|
|
return this.data.filter(dat => {
|
|
if (this.tipo !== '') {
|
|
if (this.tipo !== dat['carritos.equipos.equipo']) {
|
|
return false
|
|
}
|
|
}
|
|
if (this.car !== '') {
|
|
if (parseInt(this.car) !== dat.carrito) {
|
|
return false
|
|
}
|
|
}
|
|
let reg = new RegExp(this.search)
|
|
if (reg.test(dat['carritos.equipos.no_serie']) || reg.test(dat['carritos.equipos.no_inventario']) || reg.test(dat.id)) {
|
|
return true
|
|
}
|
|
return false
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="css">
|
|
</style>
|