pruebas #2
+14
-14
@@ -1,14 +1,14 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"],
|
||||
parserOptions: {
|
||||
parser: "babel-eslint"
|
||||
},
|
||||
rules: {
|
||||
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
|
||||
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off"
|
||||
}
|
||||
};
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"],
|
||||
parserOptions: {
|
||||
parser: "babel-eslint"
|
||||
},
|
||||
rules: {
|
||||
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
|
||||
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off"
|
||||
}
|
||||
};
|
||||
|
||||
Vendored
+1
File diff suppressed because one or more lines are too long
Vendored
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
@@ -1 +1 @@
|
||||
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" type=image/png href=assets/icono.png><title>Portal Editorial Acatlán</title><link href=css/app.ce68868a.css rel=preload as=style><link href=css/chunk-vendors.138628b4.css rel=preload as=style><link href=js/app.8ace1eb0.js rel=preload as=script><link href=js/chunk-vendors.97a56a87.js rel=preload as=script><link href=css/chunk-vendors.138628b4.css rel=stylesheet><link href=css/app.ce68868a.css rel=stylesheet></head><body><noscript><strong>We're sorry but portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.97a56a87.js></script><script src=js/app.8ace1eb0.js></script></body></html>
|
||||
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" type=image/png href=assets/icono.png><title>Portal Editorial Acatlán</title><link href=css/app.afa3884b.css rel=preload as=style><link href=css/chunk-vendors.138628b4.css rel=preload as=style><link href=js/app.79cc18fa.js rel=preload as=script><link href=js/chunk-vendors.67046eec.js rel=preload as=script><link href=css/chunk-vendors.138628b4.css rel=stylesheet><link href=css/app.afa3884b.css rel=stylesheet></head><body><noscript><strong>We're sorry but portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.67046eec.js></script><script src=js/app.79cc18fa.js></script></body></html>
|
||||
Vendored
+2
File diff suppressed because one or more lines are too long
Vendored
+1
File diff suppressed because one or more lines are too long
Vendored
-2
File diff suppressed because one or more lines are too long
Vendored
-1
File diff suppressed because one or more lines are too long
Vendored
+96
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
Vendored
-73
File diff suppressed because one or more lines are too long
-1
File diff suppressed because one or more lines are too long
Generated
+1095
-199
File diff suppressed because it is too large
Load Diff
+10
-6
@@ -8,14 +8,16 @@
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
"axios": "^0.21.1",
|
||||
"bootstrap": "^4.5.2",
|
||||
"bootstrap-vue": "^2.21.2",
|
||||
"core-js": "^3.6.5",
|
||||
"jquery": "^3.5.1",
|
||||
"popper.js": "^1.16.1",
|
||||
"sweetalert2": "^10.5.1",
|
||||
"sweetalert2": "^10.13.0",
|
||||
"vue": "^2.6.11",
|
||||
"vue-router": "^3.3.4"
|
||||
"vue-router": "^3.3.4",
|
||||
"vuex": "^3.6.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.4.0",
|
||||
@@ -23,10 +25,12 @@
|
||||
"@vue/cli-service": "~4.4.0",
|
||||
"@vue/eslint-config-prettier": "^6.0.0",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"eslint": "^6.7.2",
|
||||
"eslint": "^7.17.0",
|
||||
"eslint-config-airbnb-base": "^14.2.1",
|
||||
"eslint-plugin-import": "^2.22.1",
|
||||
"eslint-plugin-prettier": "^3.1.3",
|
||||
"eslint-plugin-vue": "^6.2.2",
|
||||
"prettier": "^1.19.1",
|
||||
"eslint-plugin-vue": "^7.4.1",
|
||||
"prettier": "1.19.1",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,279 @@
|
||||
<template>
|
||||
<b-container fluid>
|
||||
<div v-if="!cargando">
|
||||
<b-row class="mb-2">
|
||||
<b-col class="mt-5 mb-3">
|
||||
<h1 style="text-align:center;">Agregar Libro</h1>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="isbn"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="ISBN"
|
||||
v-model="isbn"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="titulo"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Titulo"
|
||||
v-model="titulo"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-dropdown v-model="categoria" v-bind:text="categoria" block split split-variant="outline-primary" variant="primary" class="m-2">
|
||||
<b-dropdown-item @click="categoria='Ciencias Socioeconómicas'" >Ciencias Socioeconómicas</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Diseño y Edificación'" >Diseño y Edificación</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Enseñanza de Idiomas'" >Enseñanza de Idiomas</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Estudios de Posgrado'" >Estudios de Posgrado</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Humanidades'" >Humanidades</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Matemáticas e Ingenieria'" >Matemáticas e Ingenieria</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Universidad Abierta y Educación a Distancia'" >Universidad Abierta y Educación a Distancia</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="autor"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Autor"
|
||||
v-model="autor"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="paginas"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Numero de paginas"
|
||||
v-model="paginas"
|
||||
type="number"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="precio"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Precio"
|
||||
v-model="precio"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-dropdown v-model="version" v-bind:text="version" block split split-variant="outline-primary" variant="primary" class="m-2">
|
||||
<b-dropdown-item @click="version='Impresa'" >Impresa</b-dropdown-item>
|
||||
<b-dropdown-item @click="version='Digital'" >Digital</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-input
|
||||
id="year"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Año de publicación"
|
||||
v-model="year"
|
||||
type="number"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-file
|
||||
id="pdfNuevo"
|
||||
placeholder="Seleccione el PDF o arrastre..."
|
||||
accept=".pdf"
|
||||
></b-form-file>
|
||||
</b-col>
|
||||
|
||||
<b-col>
|
||||
<b-form-file
|
||||
id="imagenNuevo"
|
||||
placeholder="Seleccione la imagen o arrastre..."
|
||||
accept=".png, .jpg"
|
||||
></b-form-file>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-textarea
|
||||
id="descripcion"
|
||||
v-model="impresion"
|
||||
placeholder="Ediciones (Primera edición: 2016)"
|
||||
rows="3"
|
||||
max-rows="6"
|
||||
></b-form-textarea>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-textarea
|
||||
id="descripcion"
|
||||
v-model="descripcion"
|
||||
placeholder="Descripción"
|
||||
rows="3"
|
||||
max-rows="6"
|
||||
></b-form-textarea>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col class="mb-5">
|
||||
<div style="margin-top: 2rem;">
|
||||
<b-button block variant="success" @click="agregarLibro()">Agregar</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
<div v-else>
|
||||
<CargandoLibro v-bind:imageLoading="imageLoading" v-bind:pdfLoading="pdfLoading" v-bind:dataLoading="dataLoading" v-bind:imageSaved="imageSaved" v-bind:pdfSaved="pdfSaved" v-bind:dataSaved="dataSaved" />
|
||||
</div>
|
||||
</b-container>
|
||||
</template>
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Swal from 'sweetalert2'
|
||||
import CargandoLibro from './cargandoDatos.vue';
|
||||
export default {
|
||||
components: {
|
||||
CargandoLibro
|
||||
},
|
||||
props: {
|
||||
nombreLibro: String,
|
||||
value: String
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isbn: "",
|
||||
titulo: "",
|
||||
categoria:"Categoria",
|
||||
autor:"",
|
||||
paginas:"",
|
||||
impresion:"",
|
||||
precio:"",
|
||||
version:"Versión",
|
||||
descripcion:"",
|
||||
year:"",
|
||||
cargando: false,
|
||||
imageLoading: true,
|
||||
pdfLoading: true,
|
||||
dataLoading: true,
|
||||
imageSaved: false,
|
||||
pdfSaved: false,
|
||||
dataSaved: false
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
faltaCampo(campo){
|
||||
Swal.fire(
|
||||
`Te falta por llenar el campo de ${campo}`,
|
||||
'',
|
||||
'warning'
|
||||
)
|
||||
},
|
||||
async agregarLibro(){
|
||||
try{
|
||||
|
||||
|
||||
var formData = new FormData();
|
||||
var imagen = document.querySelector('#imagenNuevo');
|
||||
var pdf = document.querySelector('#pdfNuevo');
|
||||
if(this.isbn !== "") formData.append("isbn", this.isbn); else return this.faltaCampo("ISBN");
|
||||
if(this.titulo !== "") formData.append("titulo", this.titulo); else return this.faltaCampo("Titulo");
|
||||
if(this.categoria !== "Categoria") formData.append("categoria", this.categoria); else return this.faltaCampo("Categoria");
|
||||
if(this.autor !== "") formData.append("autor", this.autor); else return this.faltaCampo("Autor");
|
||||
if(this.paginas !== "") formData.append("paginas", this.paginas); else return this.faltaCampo("Paginas");
|
||||
if(this.impresion !== "") formData.append("edicion", this.impresion); else return this.faltaCampo("Edición");
|
||||
if(this.precio !== "") formData.append("precio", this.precio); else return this.faltaCampo("Precio");
|
||||
if(this.version !== "Versión") formData.append("version", this.version); else return this.faltaCampo("Versión");
|
||||
if(this.descripcion !== "") formData.append("descripcion", this.descripcion); else return this.faltaCampo("Descripción");
|
||||
if(this.year !== "") formData.append("year", this.year); else return this.faltaCampo("Año de publicación");
|
||||
if(imagen.files.length === 0) return this.faltaCampo("Imagen");
|
||||
if(pdf.files.length === 0) return this.faltaCampo("Pdf");
|
||||
formData.append("type", 'addLibro');
|
||||
formData.append("seccion", 'datos');
|
||||
if(imagen.files[0].size > 1200000){
|
||||
Swal.fire(
|
||||
`EL tamaño de la Imagen es muy grande`,
|
||||
'Por favor suba imagenes menores a 1MG',
|
||||
'warning'
|
||||
)
|
||||
return;
|
||||
}
|
||||
|
||||
if(pdf.files[0].size > 1200000){
|
||||
Swal.fire(
|
||||
`EL tamaño del PDF es muy grande`,
|
||||
'Por favor suba PDFs menores a 1MG',
|
||||
'warning'
|
||||
)
|
||||
return;
|
||||
}
|
||||
|
||||
this.cargando = true;
|
||||
let idLibro = null;
|
||||
let textoFinal = ``;
|
||||
await axios.post( `${config.api}/actualizarLibro`, formData ,{ headers: { 'Content-Type': 'multipart/form-data' } }).then(response =>{
|
||||
console.log('lo que responde datos:', response);
|
||||
idLibro = response.data.idLibro;
|
||||
this.dataLoading= false;
|
||||
this.dataSaved = true;
|
||||
}).catch(async () =>{
|
||||
this.dataLoading= false
|
||||
await Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'No se pudieron guardar los datos',
|
||||
text: `No se pudieron guardar los datos en la base de datos, intentelo en un otro momento`,
|
||||
});
|
||||
location.reload();
|
||||
return;
|
||||
});
|
||||
formData.delete('seccion');
|
||||
formData.append("seccion", 'imagen');
|
||||
formData.append("idLibro", idLibro);
|
||||
formData.append("imagen", imagen.files[0]);
|
||||
await axios.post( `${config.api}/actualizarLibro`, formData ,{ headers: { 'Content-Type': 'multipart/form-data' } }).then(() =>{
|
||||
this.imageLoading= false;
|
||||
this.imageSaved = true;
|
||||
}).catch(() => {
|
||||
this.imageLoading= false;
|
||||
textoFinal += `No su pudo guardar la imagen`;
|
||||
});
|
||||
formData.delete('seccion');
|
||||
formData.delete('imagen');
|
||||
formData.append("seccion", 'pdf');
|
||||
formData.append("pdf", pdf.files[0]);
|
||||
await axios.post( `${config.api}/actualizarLibro`, formData ,{ headers: { 'Content-Type': 'multipart/form-data' } }).then(() =>{
|
||||
this.pdfLoading= false;
|
||||
this.pdfSaved = true;
|
||||
}).catch(() =>{
|
||||
this.pdfLoading= false;
|
||||
textoFinal += `y tampoco se pude guardar el pdf`;
|
||||
});
|
||||
if(textoFinal!== ``)
|
||||
textoFinal += ` actualize los datos editando el libro`
|
||||
await Swal.fire(
|
||||
'Se termino de subir los datos',
|
||||
textoFinal,
|
||||
'success'
|
||||
);
|
||||
location.reload();
|
||||
}
|
||||
catch(error){
|
||||
console.log(error);
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'El libro no pudo ser agregado',
|
||||
text: `Algo salio mal, ${error}`,
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<div class="container" style="margin-top: 3rem; margin-bottom: 3rem;">
|
||||
<div class="d-flex justify-content-center" >
|
||||
<b-card class="text-left " style="width: 20rem; margin-top: .8rem;" >
|
||||
<b-container v-if="dataLoading">
|
||||
<b-row>
|
||||
<b-col cols="3">
|
||||
<b-spinner variant="primary" label="Spinning"></b-spinner>
|
||||
</b-col>
|
||||
<b-col >
|
||||
<b-card-text block>
|
||||
Guardando Datos...
|
||||
</b-card-text>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-alert v-else-if="dataSaved" variant="success" show style="margin: 0rem">Datos Guardados</b-alert>
|
||||
<b-alert v-else show variant="danger">Los datos no se pudieron guardar</b-alert>
|
||||
</b-card>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
|
||||
<b-card class="text-left" style="width: 20rem; margin-top: .8rem;" >
|
||||
<b-container v-if="imageLoading">
|
||||
<b-row>
|
||||
<b-col cols="3">
|
||||
<b-spinner variant="primary" label="Spinning"></b-spinner>
|
||||
</b-col>
|
||||
<b-col >
|
||||
<b-card-text block>
|
||||
Guardando Imagen...
|
||||
</b-card-text>
|
||||
</b-col>
|
||||
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-alert v-else-if="imageSaved" variant="success" show style="margin: 0rem">Imagen Guardada</b-alert>
|
||||
<b-alert v-else show variant="danger">La imagen no se pudo guardar</b-alert>
|
||||
</b-card>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<b-card class="text-left" style="width: 20rem; margin-top: .8rem;" >
|
||||
<b-container v-if="pdfLoading">
|
||||
<b-row>
|
||||
<b-col cols="3">
|
||||
<b-spinner variant="primary" label="Spinning"></b-spinner>
|
||||
</b-col>
|
||||
<b-col >
|
||||
<b-card-text block>
|
||||
Guardando PDF...
|
||||
</b-card-text>
|
||||
</b-col>
|
||||
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-alert v-else-if="pdfSaved" variant="success" show style="margin: 0rem">PDF Guardado</b-alert>
|
||||
<b-alert v-else show variant="danger">El pdf no se pudo guardar</b-alert>
|
||||
</b-card>
|
||||
</div>
|
||||
<h3 style="margin-top: 2rem;"><strong>Cargando...</strong></h3>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
imageLoading: Boolean,
|
||||
pdfLoading: Boolean,
|
||||
dataLoading: Boolean,
|
||||
imageSaved: Boolean,
|
||||
pdfSaved: Boolean,
|
||||
dataSaved: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,151 @@
|
||||
<template>
|
||||
<b-container class="mt-5">
|
||||
<div class="mb-5">
|
||||
<h1 class="mb-4" style="text-align:left;">Agregar Imagen</h1>
|
||||
<b-row>
|
||||
<b-col class="p-0" cols="8">
|
||||
<b-form-file
|
||||
v-model="nuevaImagenBanner"
|
||||
id="nuevaImagenBanner"
|
||||
block
|
||||
placeholder="Seleccione la imagen o arrastre aqui..."
|
||||
accept=".png, .jpg"
|
||||
></b-form-file>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-button block variant="success" @click="agregarImagen()">Agregar</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
<h1 class="mb-4" style="text-align:left;">Eliminar Imagen</h1>
|
||||
<div class=" row ">
|
||||
<div class="d-flex flex-wrap" style="justify-content: space-between;">
|
||||
<div v-bind:key="imagenBanner.id" v-for="imagenBanner in imagenesBanner" >
|
||||
<b-card class="m-3" style="width: 28rem;">
|
||||
<b-card-img :src="imagenBanner.img" alt="Image" ></b-card-img>
|
||||
<b-card-footer><b-button variant="danger" @click="eliminarImagen(imagenBanner.nombreImagen)">Eliminar</b-button></b-card-footer>
|
||||
</b-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</b-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Swal from 'sweetalert2'
|
||||
export default {
|
||||
name: "editarBanner",
|
||||
data() {
|
||||
return {
|
||||
imagenesBanner: [],
|
||||
nuevaImagenBanner: null,
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
async eliminarImagen(nombreImagenBanner){
|
||||
const swalWithBootstrapButtons = Swal.mixin({
|
||||
customClass: {
|
||||
confirmButton: 'btn btn-outline-success',
|
||||
cancelButton: 'btn btn-outline-danger'
|
||||
},
|
||||
buttonsStyling: false
|
||||
})
|
||||
|
||||
swalWithBootstrapButtons.fire({
|
||||
title: '¿Estás seguro de que quieres eliminar la imagen?',
|
||||
icon: 'warning',
|
||||
showCancelButton: true,
|
||||
confirmButtonText: 'Si, eliminar',
|
||||
cancelButtonText: 'No, cancelar',
|
||||
reverseButtons: true
|
||||
}).then(async (result) => {
|
||||
if (result.isConfirmed) {
|
||||
try{
|
||||
await axios.post( `${config.api}/eliminarImagenCarrusel`,{nombre: nombreImagenBanner} );
|
||||
await swalWithBootstrapButtons.fire(
|
||||
'Eliminado!',
|
||||
'Se ha eliminado la imagen con éxito.',
|
||||
'success'
|
||||
);
|
||||
location.reload();
|
||||
}
|
||||
catch(error){
|
||||
console.log(error);
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'La imagen no pudo ser eliminada',
|
||||
text: 'algo salio mal, mensaje en consola',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
async agregarImagen(){
|
||||
try{
|
||||
let formData = new FormData();
|
||||
let imagenBanner = document.querySelector('#nuevaImagenBanner');
|
||||
console.log('tamaño: ',imagenBanner.files.length);
|
||||
if(imagenBanner.files.length === 0){
|
||||
Swal.fire(
|
||||
'¿Aún no has seleccionado la imagen?',
|
||||
'',
|
||||
'question'
|
||||
);
|
||||
return;
|
||||
}
|
||||
formData.append("imagen", imagenBanner.files[0]);
|
||||
await axios.post( `${config.api}/agregarImagenCarrusel`, formData ,{ headers: {'Content-Type': 'multipart/form-data'}} );
|
||||
await Swal.fire(
|
||||
'Imagen agregada con éxito',
|
||||
'',
|
||||
'success'
|
||||
);
|
||||
location.reload();
|
||||
}
|
||||
catch(error){
|
||||
console.log(error);
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'La imagen no pudo ser agregada',
|
||||
text: 'Algo salio mal, mensaje en consola',
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
let path = `${config.api}/imagenCarrusel?nombre=`;
|
||||
let nombres = await axios.get(`${config.api}/nombreCarrusel`);
|
||||
nombres = nombres.data.data;
|
||||
for (let i = 0; i < nombres.length; i++) {
|
||||
let config = {
|
||||
url: `${path}${nombres[i]}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.imagenesBanner.push({ id: i, img: reader.result, nombreImagen: nombres[i]});
|
||||
};
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error msj: ${error}`);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<b-container class="mt-2">
|
||||
<div style="margin-bottom: 2rem">
|
||||
<h4 style="text-align:left">Libros cargados </h4>
|
||||
<b-progress :max="librosTotales" height="1.5rem" >
|
||||
<b-progress-bar :value="Libros.length">
|
||||
<span>Cargados: <strong>{{ Libros.length }} / {{ librosTotales }}</strong></span>
|
||||
</b-progress-bar>
|
||||
</b-progress>
|
||||
</div>
|
||||
<div class=" divMaster row row d-flex flex-wrap justify-content-center mb-3">
|
||||
<b-input-group class="mb-2">
|
||||
<b-input-group-prepend is-text>
|
||||
<b-icon icon="search"></b-icon>
|
||||
</b-input-group-prepend>
|
||||
<b-form-input type="search" placeholder="Buscar por nombre del libro, autor o categoría" v-model="searchLibro" ></b-form-input>
|
||||
</b-input-group>
|
||||
</div>
|
||||
<div class="divMaster row ">
|
||||
<div class=" d-flex flex-wrap " style="justify-content: space-between;">
|
||||
<div v-bind:key="libro.id" v-for="libro in listaLibroFiltrada" >
|
||||
<b-card class="mb-3" style="width: 14rem; height: 25rem;">
|
||||
<b-card-img :src="libro.img" alt="Image" style="max-width: 20rem; height: 15rem;" ></b-card-img>
|
||||
<p class="mt-1" style="text-align: left; font-size: 15px;">{{nombreLibro(libro.titulo)}}</p>
|
||||
<template #footer>
|
||||
<b-button variant="outline-warning" class="float-left" @click="libroSelect=libro" v-b-modal.modalEditarLibro>Editar</b-button>
|
||||
<b-button variant="outline-danger" class="float-right" @click="eliminarLibro(libro.idLibro)" >Eliminar</b-button>
|
||||
</template>
|
||||
</b-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ModalEditar v-bind:libro="libroSelect" />
|
||||
</b-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import ModalEditar from './modalEditar.vue';
|
||||
import Swal from 'sweetalert2';
|
||||
export default {
|
||||
components: {
|
||||
ModalEditar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Libros: [],
|
||||
searchLibro: "",
|
||||
libroSelect: null,
|
||||
librosTotales: 0,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async eliminarLibro(idLibro){
|
||||
const swalWithBootstrapButtons = Swal.mixin({
|
||||
customClass: {
|
||||
confirmButton: 'btn btn-outline-success',
|
||||
cancelButton: 'btn btn-outline-danger'
|
||||
},
|
||||
buttonsStyling: false
|
||||
})
|
||||
|
||||
swalWithBootstrapButtons.fire({
|
||||
title: '¿Estás seguro de que quieres eliminar el libro?',
|
||||
icon: 'warning',
|
||||
showCancelButton: true,
|
||||
confirmButtonText: 'Si, eliminar',
|
||||
cancelButtonText: 'No, cancelar',
|
||||
reverseButtons: true
|
||||
}).then(async (result) => {
|
||||
if (result.isConfirmed) {
|
||||
try{
|
||||
await axios.post( `${config.api}/eliminarLibro`,{idLibro: idLibro} );
|
||||
await swalWithBootstrapButtons.fire(
|
||||
'Eliminado!',
|
||||
'Se ha eliminado el libro con éxito.',
|
||||
'success'
|
||||
);
|
||||
location.reload();
|
||||
}
|
||||
catch(error){
|
||||
console.log(error);
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'El libro no pudo ser eliminado',
|
||||
text: 'algo salio mal, mensaje en consola',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
nombreLibro(nombreLibro){
|
||||
let maxLengthtitulo = 40;
|
||||
if(nombreLibro.length < maxLengthtitulo)
|
||||
return nombreLibro;
|
||||
return `${nombreLibro.substring(0, maxLengthtitulo)}...`;
|
||||
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
let todosLibros = await axios.get(`${config.api}/getTodosLibros`);
|
||||
let path = `${config.api}/libroImagen?idLibro=`;
|
||||
todosLibros = todosLibros.data.data;
|
||||
this.librosTotales = todosLibros.length;
|
||||
|
||||
for (let i = 0; i < todosLibros.length; i++) {
|
||||
let config = {
|
||||
url: `${path}${todosLibros[i].idLibro}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
try {
|
||||
axios(config).then( async response => {
|
||||
let reader = new FileReader();
|
||||
await reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.Libros.push({
|
||||
id: todosLibros[i].idLibro,
|
||||
titulo: todosLibros[i].titulo,
|
||||
img: reader.result,
|
||||
idLibro: todosLibros[i].idLibro,
|
||||
isbn: todosLibros[i].isbn,
|
||||
categoria: todosLibros[i].categoria,
|
||||
autor: todosLibros[i].autor,
|
||||
paginas: todosLibros[i].paginas,
|
||||
impresion: todosLibros[i].impresion,
|
||||
precio: todosLibros[i].precio,
|
||||
version: todosLibros[i].version,
|
||||
descripcion: todosLibros[i].descripcion,
|
||||
year: todosLibros[i].year,
|
||||
});
|
||||
};
|
||||
}).catch(() =>{
|
||||
|
||||
this.Libros.push({
|
||||
id: todosLibros[i].idLibro,
|
||||
titulo: todosLibros[i].titulo,
|
||||
idLibro: todosLibros[i].idLibro,
|
||||
isbn: todosLibros[i].isbn,
|
||||
categoria: todosLibros[i].categoria,
|
||||
autor: todosLibros[i].autor,
|
||||
paginas: todosLibros[i].paginas,
|
||||
impresion: todosLibros[i].impresion,
|
||||
precio: todosLibros[i].precio,
|
||||
version: todosLibros[i].version,
|
||||
descripcion: todosLibros[i].descripcion,
|
||||
year: todosLibros[i].year,
|
||||
});
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(`No existe esa imagen`);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error ${error}`);
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
listaLibroFiltrada: function()
|
||||
{
|
||||
return this.Libros.filter( (item)=>{
|
||||
let searchTitulo = (item.titulo).toLowerCase().includes(this.searchLibro.toLowerCase()) ;
|
||||
let searchAutor = (item.autor).toLowerCase().includes(this.searchLibro.toLowerCase()) ;
|
||||
let searchCategoria = (item.categoria).toLowerCase().includes(this.searchLibro.toLowerCase()) ;
|
||||
if(searchTitulo || searchAutor || searchCategoria)
|
||||
return true;
|
||||
return false;
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,333 @@
|
||||
<template>
|
||||
<b-modal size="lg" id="modalEditarLibro" hide-footer title="Editar Libro">
|
||||
|
||||
<b-container fluid v-if="!loading">
|
||||
<b-row class="mb-2">
|
||||
<b-col >
|
||||
<h2 style="text-align:left;"> {{libro.titulo}}</h2>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveIsbn" name="check-button" switch><b>ISBN:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.isbn}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="isbn"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveTitulo" name="check-button" switch><b>Titulo:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.titulo}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="titulo"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveCategoria" name="check-button" switch><b>Categoria:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.categoria}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-dropdown v-model="categoria" v-bind:text="categoria" block split split-variant="outline-primary" variant="primary" class="m-2">
|
||||
<b-dropdown-item @click="categoria='Ciencias Socioeconómicas'" >Ciencias Socioeconómicas</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Diseño y Edificación'" >Diseño y Edificación</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Enseñanza de Idiomas'" >Enseñanza de Idiomas</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Estudios de Posgrado'" >Estudios de Posgrado</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Humanidades'" >Humanidades</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Matemáticas e Ingenieria'" >Matemáticas e Ingenieria</b-dropdown-item>
|
||||
<b-dropdown-item @click="categoria='Universidad Abierta y Educación a Distancia'" >Universidad Abierta y Educación a Distancia</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveAutor" name="check-button" switch><b>Autor:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.autor}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="autor"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActivePaginas" name="check-button" switch><b>Numero de paginas:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.paginas}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="paginas"
|
||||
type="number"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActivePrecio" name="check-button" switch><b>Precio:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.precio}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="precio"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveEdicion" name="check-button" switch><b>Edición:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.impresion}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="edicion"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveVersion" name="check-button" switch><b>Versión:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.version}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="version"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveYear" name="check-button" switch><b>Año de publicación:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2">{{libro.year}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-input
|
||||
id="inline-form-input-name"
|
||||
class="mb-2 mr-sm-2 mb-sm-0"
|
||||
placeholder="Editar"
|
||||
v-model="year"
|
||||
type="number"
|
||||
></b-form-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveDescripcion" name="check-button" switch><b>Descrpción:</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<label class="mr-sm-2" style="font-size: 12px">{{libro.descripcion}}</label>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-textarea
|
||||
id="textarea"
|
||||
v-model="descripcion"
|
||||
placeholder="Editar"
|
||||
rows="3"
|
||||
max-rows="6"
|
||||
></b-form-textarea>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActiveImagen" name="check-button" switch><b>Imagen</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-file
|
||||
placeholder="Seleccione la imagen o arrastre..."
|
||||
accept=".png, .jpg"
|
||||
id="imagen"
|
||||
></b-form-file>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<b-form-checkbox v-model="isActivePdf" name="check-button" switch><b>PDF Visualización</b></b-form-checkbox>
|
||||
</b-col>
|
||||
<b-col>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<b-form-file
|
||||
placeholder="Seleccione el PDF o arrastre..."
|
||||
id="pdf"
|
||||
accept=".pdf"
|
||||
></b-form-file>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="mb-2">
|
||||
<b-col>
|
||||
<div style="margin-top: 2rem;">
|
||||
<b-button variant="outline-success" class="float-right" @click="actualizarLibro(libro.idLibro)" style="width: 30%; ">Actualizar</b-button>
|
||||
<b-button @click="$bvModal.hide('modalEditarLibro')" variant="outline-danger" class="btn float-left" style="width: 30%; ">Cancelar</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-container v-else>
|
||||
<div class="text-center">
|
||||
<b-spinner style="width: 10rem; height: 10rem; margin: 3rem;" variant="primary" label="Text Centered"></b-spinner><br />
|
||||
<strong><h1 style="margin: 3rem;">Guardando...</h1></strong>
|
||||
</div>
|
||||
</b-container>
|
||||
</b-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Swal from 'sweetalert2'
|
||||
export default {
|
||||
props: {
|
||||
libro: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isbn: "",
|
||||
titulo: "",
|
||||
categoria:"Categoria",
|
||||
autor:"",
|
||||
paginas:"",
|
||||
impresion:"",
|
||||
precio:"",
|
||||
version:"",
|
||||
descripcion:"",
|
||||
year:"",
|
||||
edicion:"",
|
||||
isActiveIsbn: false,
|
||||
isActiveTitulo: false,
|
||||
isActiveCategoria: false,
|
||||
isActiveAutor: false,
|
||||
isActivePaginas: false,
|
||||
isActivePrecio: false,
|
||||
isActiveVersion: false,
|
||||
isActiveYear: false,
|
||||
isActiveDescripcion: false,
|
||||
isActiveImagen: false,
|
||||
isActivePdf: false,
|
||||
isActiveEdicion:false,
|
||||
loading: false
|
||||
};
|
||||
|
||||
},
|
||||
methods:{
|
||||
async actualizarLibro(idLibro){
|
||||
try{
|
||||
var formData = new FormData();
|
||||
if(this.isActiveIsbn) formData.append("isbn", this.isbn);
|
||||
if(this.isActiveTitulo) formData.append("titulo", this.titulo);
|
||||
if(this.isActiveCategoria) formData.append("categoria", this.categoria);
|
||||
if(this.isActiveAutor) formData.append("autor", this.autor);
|
||||
if(this.isActivePaginas) formData.append("paginas", this.paginas);
|
||||
if(this.isActiveEdicion) formData.append("edicion", this.impresion);
|
||||
if(this.isActivePrecio) formData.append("precio", this.precio);
|
||||
if(this.isActiveVersion) formData.append("version", this.version);
|
||||
if(this.isActiveDescripcion) formData.append("descripcion", this.descripcion);
|
||||
if(this.isActiveYear) formData.append("year", this.year);
|
||||
if(this.isActiveImagen){
|
||||
var imagen = document.querySelector('#imagen');
|
||||
if(imagen.files[0].size > 1200000){
|
||||
Swal.fire(
|
||||
`EL tamaño de la Imagen es muy grande`,
|
||||
'Por favor suba imagenes menores a 1MG',
|
||||
'warning'
|
||||
)
|
||||
return;
|
||||
}
|
||||
formData.append("imagen", imagen.files[0]);
|
||||
}
|
||||
if(this.isActivePdf){
|
||||
var pdf = document.querySelector('#pdf');
|
||||
if(pdf.files[0].size > 1200000){
|
||||
Swal.fire(
|
||||
`EL tamaño del PDF es muy grande`,
|
||||
'Por favor suba PDFs menores a 1MG',
|
||||
'warning'
|
||||
)
|
||||
return;
|
||||
}
|
||||
formData.append("pdf", pdf.files[0]);
|
||||
}
|
||||
if( formData.entries().next().done){
|
||||
Swal.fire(
|
||||
'¿Aún no has ningún campo a editar?',
|
||||
'',
|
||||
'question'
|
||||
);
|
||||
return;
|
||||
}
|
||||
formData.append("idLibro", idLibro);
|
||||
formData.append("type", 'editarLibro');
|
||||
this.loading = true;
|
||||
await axios.post( `${config.api}/actualizarLibro`, formData ,{ headers: { 'Content-Type': 'multipart/form-data' } });
|
||||
this.loading = false;
|
||||
await Swal.fire(
|
||||
'Libro actualizado con éxito',
|
||||
'',
|
||||
'success'
|
||||
);
|
||||
location.reload();
|
||||
}
|
||||
catch(error){
|
||||
console.log(error);
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'El libro no pudo ser actualizado',
|
||||
text: `Algo salio mal, ${error}`,
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-nav vertical class="mt-3">
|
||||
<b-nav-item class="m-2">
|
||||
<div class="accordion" role="tablist">
|
||||
<b-card no-body >
|
||||
<b-card-header header-tag="header" role="tab">
|
||||
<b-button block squared v-b-toggle.user class="p-1 azulUnam">
|
||||
<b-icon icon="person-fill" style="margin-bottom: 4px;"></b-icon>
|
||||
{{user}}
|
||||
</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse id="user" accordion="my-accordion" role="tabpanel">
|
||||
<b-card-body>
|
||||
<b-button block variant="light" class="p-1 m-0 rojo" @click="cerrarSesion()">Cerrar sesión</b-button>
|
||||
</b-card-body>
|
||||
</b-collapse>
|
||||
</b-card>
|
||||
</div>
|
||||
|
||||
</b-nav-item>
|
||||
<b-nav-item class="m-2">
|
||||
<div class="accordion" role="tablist">
|
||||
<b-card no-body >
|
||||
<b-card-header header-tag="header" role="tab">
|
||||
<b-button block squared v-b-toggle.banner @click="$store.commit('cambiarNav','EditarBanner')" class="p-1 azulUnam">Banner principal</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse id="banner" accordion="my-accordion" role="tabpanel">
|
||||
<b-card-body>
|
||||
</b-card-body>
|
||||
</b-collapse>
|
||||
</b-card>
|
||||
</div>
|
||||
</b-nav-item>
|
||||
<b-nav-item class="m-2">
|
||||
<div class="accordion" role="tablist">
|
||||
<b-card no-body >
|
||||
<b-card-header header-tag="header" role="tab">
|
||||
<b-button block squared v-b-toggle.libros class="p-1 azulUnam">Libros</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse id="libros" accordion="my-accordion" role="tabpanel">
|
||||
<b-card-body>
|
||||
<b-button block variant="light" class="p-1 m-0" @click="$store.commit('cambiarNav','EditarLibro')">Editar</b-button>
|
||||
<b-button block variant="light" class="p-1 m-0" @click="$store.commit('cambiarNav','AgregarLibro')">Agregar</b-button>
|
||||
</b-card-body>
|
||||
</b-collapse>
|
||||
</b-card>
|
||||
</div>
|
||||
</b-nav-item>
|
||||
</b-nav>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Swal from 'sweetalert2'
|
||||
export default {
|
||||
props:{
|
||||
user: String
|
||||
},
|
||||
methods:{
|
||||
cerrarSesion(){
|
||||
const swalWithBootstrapButtons = Swal.mixin({
|
||||
customClass: {
|
||||
confirmButton: 'btn btn-outline-success',
|
||||
cancelButton: 'btn btn-outline-danger'
|
||||
},
|
||||
buttonsStyling: false
|
||||
})
|
||||
|
||||
swalWithBootstrapButtons.fire({
|
||||
title: '¿Estás seguro de que quieres cerrar la sesión?',
|
||||
icon: 'warning',
|
||||
showCancelButton: true,
|
||||
confirmButtonText: 'Si, salir',
|
||||
cancelButtonText: 'No',
|
||||
reverseButtons: true
|
||||
}).then(async (result) => {
|
||||
if (result.isConfirmed) {
|
||||
localStorage.clear();
|
||||
this.$router.replace('/login');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.azulUnam {
|
||||
background-color: #1e3c70;
|
||||
}
|
||||
.rojo:hover{
|
||||
background-color: #CA230C;
|
||||
color: white;
|
||||
}
|
||||
|
||||
</style>
|
||||
+21
-3
@@ -2,19 +2,37 @@ import Vue from "vue";
|
||||
import App from "./App.vue";
|
||||
import "bootstrap";
|
||||
import "bootstrap/dist/css/bootstrap.min.css";
|
||||
|
||||
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
|
||||
import Vuex from 'vuex'
|
||||
import VueRouter from "vue-router";
|
||||
import { routes } from "./routes";
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
Vue.use(Vuex)
|
||||
Vue.use(BootstrapVue);
|
||||
Vue.use(IconsPlugin);
|
||||
Vue.use(VueRouter);
|
||||
|
||||
const router = new VueRouter({
|
||||
routes
|
||||
});
|
||||
|
||||
const store = new Vuex.Store({
|
||||
state: {
|
||||
selectNav: "EditarLibro",
|
||||
},
|
||||
mutations: {
|
||||
cambiarNav (state, selectNav) {
|
||||
state.selectNav = selectNav
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
render: h => h(App),
|
||||
router
|
||||
router,
|
||||
store: store,
|
||||
});
|
||||
|
||||
+3
-1
@@ -9,6 +9,7 @@ import presentacion from "./view/presentacion.vue";
|
||||
import proceso from "./view/proceso.vue";
|
||||
import puntos from "./view/puntos.vue";
|
||||
import contacto from "./view/contacto.vue";
|
||||
import panelAdmin from "./view/panelAdmin.vue";
|
||||
|
||||
export const routes = [
|
||||
{ path: "/", component: home, name: "/" },
|
||||
@@ -22,5 +23,6 @@ export const routes = [
|
||||
{ path: "/presentacion", component: presentacion, name: "presentacion" },
|
||||
{ path: "/proceso", component: proceso, name: "proceso" },
|
||||
{ path: "/puntos", component: puntos, name: "puntos" },
|
||||
{ path: "/contacto", component: contacto, name: "contacto" }
|
||||
{ path: "/contacto", component: contacto, name: "contacto" },
|
||||
{ path: "/panelAdmin", component: panelAdmin, name: "panelAdmin" }
|
||||
];
|
||||
|
||||
+31
-12
@@ -1,22 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<h1 class="my-5">Inicia Sesion</h1>
|
||||
<h1 class="my-5">Inicia Sesión</h1>
|
||||
<div class="row d-flex justify-content-center">
|
||||
<div class="col-12 col-md-8 col-lg-6 col-xl-6">
|
||||
<form class="row d-flex justify-content-center">
|
||||
<input
|
||||
type="text"
|
||||
v-model="data.email"
|
||||
id="login"
|
||||
v-model="email"
|
||||
class="form-control col-8"
|
||||
name="login"
|
||||
placeholder="Usuario"
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
v-model="data.password"
|
||||
id="password"
|
||||
v-model="password"
|
||||
class="form-control col-8 my-3"
|
||||
name="login"
|
||||
placeholder="Contraseña"
|
||||
@@ -35,24 +33,45 @@
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Swal from 'sweetalert2'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
data: {
|
||||
email: "",
|
||||
password: ""
|
||||
}
|
||||
email: "",
|
||||
password: ""
|
||||
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
login() {
|
||||
alert(this.data.email);
|
||||
const datos = {
|
||||
usuario: this.email,
|
||||
password: this.password
|
||||
}
|
||||
axios.post( `${config.api}/loginAdmin`, datos ).then(async response =>{
|
||||
localStorage.setItem('tokenPortal', response.data.token);
|
||||
await Swal.fire(
|
||||
'Bienvenido',
|
||||
'',
|
||||
'success'
|
||||
);
|
||||
this.$router.replace('/panelAdmin');
|
||||
|
||||
}).catch(() =>{
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'El usuario o la contraseña es incorrecta',
|
||||
text: `Intentalo de nuevo.`,
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Header
|
||||
}
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<b-row>
|
||||
<b-col cols="2" style="background-color: #bb8800;" class="p-0 m-0">
|
||||
<div class="p-0 m-0">
|
||||
<NavAdmin v-bind:user="usuario"/>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="10">
|
||||
<b-row v-if="this.$store.state.selectNav=='EditarBanner'">
|
||||
<EditarBanner />
|
||||
</b-row>
|
||||
<b-row v-if="this.$store.state.selectNav=='EditarLibro'">
|
||||
<EditarLibro />
|
||||
</b-row>
|
||||
<b-row v-if="this.$store.state.selectNav=='AgregarLibro'">
|
||||
<AgregarLibro />
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
import Footer from "./../components/footer.vue";
|
||||
import EditarLibro from './../components/editarLibro.vue';
|
||||
import EditarBanner from './../components/editarBanner.vue';
|
||||
import AgregarLibro from './../components/agregarLibro.vue';
|
||||
import NavAdmin from './../components/navAdmin.vue';
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Swal from 'sweetalert2'
|
||||
export default {
|
||||
name: "panelAdmin",
|
||||
components: {
|
||||
Header,
|
||||
Footer,
|
||||
EditarLibro,
|
||||
NavAdmin,
|
||||
EditarBanner,
|
||||
AgregarLibro
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
usuario: ""
|
||||
|
||||
};
|
||||
},
|
||||
beforeCreate(){
|
||||
let token = localStorage.getItem('tokenPortal');
|
||||
console.log(token);
|
||||
if(token === null) this.$router.replace('/login');
|
||||
axios.post( `${config.api}/checkToken`, {token: token}, {
|
||||
headers: {
|
||||
authorization: 'Bearer ' + token,
|
||||
}}).then(async response =>{
|
||||
console.log('lo que responde', response.data.datos.user.user);
|
||||
this.usuario = response.data.datos.user.user;
|
||||
}).catch(async (error) =>{
|
||||
console.log(error);
|
||||
await Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'La sesión ha expirado',
|
||||
text: `Ingrese de nuevo.`,
|
||||
});
|
||||
this.$router.replace('/login')
|
||||
});
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user