Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| c8eb7eeda2 | |||
| 3d33ac2040 |
Generated
+31
@@ -2231,6 +2231,37 @@
|
||||
"integrity": "sha512-3YDiu347mtVtjpyV3u5kVqQLP242c06zwDOgpeRnybmXlYYsLbtTrUBUm8i8srONt+FWobl5aibnU1030PeeuA==",
|
||||
"dev": true
|
||||
},
|
||||
"axios": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
|
||||
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
|
||||
"requires": {
|
||||
"follow-redirects": "1.5.10"
|
||||
},
|
||||
"dependencies": {
|
||||
"debug": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
|
||||
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
|
||||
"requires": {
|
||||
"ms": "2.0.0"
|
||||
}
|
||||
},
|
||||
"follow-redirects": {
|
||||
"version": "1.5.10",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
|
||||
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
|
||||
"requires": {
|
||||
"debug": "=3.1.0"
|
||||
}
|
||||
},
|
||||
"ms": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
|
||||
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
|
||||
}
|
||||
}
|
||||
},
|
||||
"babel-eslint": {
|
||||
"version": "10.1.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
"bootstrap": "^4.5.2",
|
||||
"core-js": "^3.6.5",
|
||||
"jquery": "^3.5.1",
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="container">
|
||||
<div class="row ">
|
||||
<div class="col-md-6 col-sm-12 py-5">
|
||||
<img v-bind:src="rutaIm" class="libro" />
|
||||
<img :src="src" alt="" class="libro" />
|
||||
<button class="button pre">
|
||||
Previsualizar</button
|
||||
><br /><br />
|
||||
@@ -78,6 +78,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Title from "../components/titulo.vue";
|
||||
export default {
|
||||
components: {
|
||||
@@ -86,17 +88,18 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
titulo: "Competitive programing",
|
||||
autor: "HALIM",
|
||||
paginas: "300",
|
||||
isbn: "POSF-12-43",
|
||||
edicion: "Primera edicion",
|
||||
precio: "$3232.00",
|
||||
rutaIm:
|
||||
"https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg",
|
||||
version: "Electronica",
|
||||
desc: `En relación al estudio del álgebra, las expresiones algebraicas son el conjunto de números, y por símbolos representados por letras que manifiestan un valor desconocido, siendo llamado como incógnita o variable.\n\nLos símbolos se encuentran relacionados a través de signos que indican las operaciones que se necesitan efectuar, bien sea multiplicación, suma, resta, entre otros, con el objetivo de conseguir el resultado de las variables. En este sentido, los términos se distinguen o separan por medio de signos, y en el caso de estar separadas por el signo de igualdad se llama ecuación.`,
|
||||
boton2: "Comprar",
|
||||
idLibro: "",
|
||||
titulo: "",
|
||||
autor: "",
|
||||
paginas: "",
|
||||
isbn: "",
|
||||
edicion: "",
|
||||
precio: "",
|
||||
src: "",
|
||||
version: "",
|
||||
desc: ``,
|
||||
boton2: "",
|
||||
categoria: "",
|
||||
Libros: [
|
||||
{
|
||||
id: 0,
|
||||
@@ -121,6 +124,78 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
//this.idLibro = window.localStorage.getItem("idLibro");
|
||||
this.idLibro = 1;
|
||||
|
||||
let detalle = await axios.get(
|
||||
`${config.api}/libroDetalle?idLibro=${this.idLibro}`
|
||||
);
|
||||
|
||||
detalle = await detalle.data.datos;
|
||||
|
||||
this.titulo = detalle.titulo;
|
||||
this.autor = detalle.autor;
|
||||
this.paginas = detalle.paginas;
|
||||
this.isbn = detalle.isbn;
|
||||
this.edicion = detalle.impresion;
|
||||
this.precio = detalle.precio;
|
||||
this.version = detalle.version;
|
||||
this.desc = detalle.descripcion;
|
||||
this.categoria = detalle.categoria;
|
||||
if (detalle.precio !== "Gratis") this.boton2 = "Comprar";
|
||||
else this.boton2 = "Descargar";
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
|
||||
try {
|
||||
let config = {
|
||||
// example url
|
||||
url: `http://localhost:3000/libroImagen?idLibro=${this.idLibro}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.src = reader.result;
|
||||
};
|
||||
});
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
try {
|
||||
let similares = await axios.get(
|
||||
`${config.api}/librosSimilares?categoria=${this.categoria}`
|
||||
);
|
||||
similares = similares.data.data;
|
||||
console.log(`${similares}`);
|
||||
for (let i = 0; i < similares.length; i++) {
|
||||
this.Libros[i].title = similares[i].titulo;
|
||||
let config = {
|
||||
// example url
|
||||
url: `http://localhost:3000/libroImagen?idLibro=${i+2}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.Libros[i].img = reader.result;
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error ${error}`);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
const config = {
|
||||
api: "http://localhost:3000"
|
||||
//api: "https://venus.acatlan.unam.mx/indiana_hackaton"
|
||||
};
|
||||
module.exports = config;
|
||||
+1
-3
@@ -1,11 +1,9 @@
|
||||
import home from "./view/home.vue";
|
||||
import login from "./view/login.vue";
|
||||
import libroDescripcion from "./view/libroDescripcion.vue";
|
||||
import difusion from "./view/difusion.vue";
|
||||
|
||||
export const routes = [
|
||||
{ path: "/", component: home, name: "form" },
|
||||
{ path: "/panelAdmin", component: login, name: "Login" },
|
||||
{ path: "/desc", component: libroDescripcion, name: "LibroDesc" },
|
||||
{ path: "/difusion", component: difusion, name: "difusion" }
|
||||
{ path: "/desc", component: libroDescripcion, name: "LibroDesc" }
|
||||
];
|
||||
|
||||
@@ -1,97 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<Nav />
|
||||
<!-- <div class="row">
|
||||
<div class="col-10 offset-1"> -->
|
||||
<Title title="Conoce mas" class="mt-5" />
|
||||
<!-- </div>
|
||||
</div> -->
|
||||
<div class="container">
|
||||
<div class="row my-5" v-bind:key="de.id" v-for="de in des">
|
||||
<div class="titulo col-12 mb-5">
|
||||
<h1>{{ de.titulo }}</h1>
|
||||
</div>
|
||||
<div class="libro col-10 col-sm-5 col-md-5 col-lg-5 col-xl-5 offset-1">
|
||||
<img
|
||||
:src="de.img"
|
||||
class=" figure-img img-fluid rounded"
|
||||
alt="libro"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="texto col-10 col-sm-5 col-md-5 col-lg-5 col-xl-5 d-flex align-items-center justify-content-center flex-column"
|
||||
>
|
||||
<h4>Descripcion:</h4>
|
||||
<p class="scroll">
|
||||
{{ de.descrip }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="video col-12 d-flex my-4 justify-content-center">
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
:src="de.video"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "../components/header.vue";
|
||||
import Nav from "../esteticas/nav.vue";
|
||||
import Footer from "../components/footer.vue";
|
||||
import Title from "../components/titulo.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Header,
|
||||
Nav,
|
||||
Footer,
|
||||
Title
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
des: [
|
||||
{
|
||||
id: 0,
|
||||
titulo: "Algebra lineal productos internos y teoremas de estructura",
|
||||
img:
|
||||
"https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg",
|
||||
descrip: ` Los símbolos se encuentran relacionados a través de signos que
|
||||
indican las operaciones que se necesitan efectuar, bien sea
|
||||
multiplicación, suma, resta, entre otros, con el objetivo de
|
||||
conseguir el resultado de las variables. En este sentido, los
|
||||
términos se distinguen o separan por medio de signos, y en el caso
|
||||
de estar separadas por el signo de igualdad se llama ecuación.`,
|
||||
video: "https://www.youtube.com/embed/gOsM-DYAEhY"
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.imgLibro {
|
||||
height: 600px;
|
||||
}
|
||||
.scroll {
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@media (max-width: 400px) {
|
||||
.scroll {
|
||||
height: 90%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,3 @@
|
||||
module.exports = {
|
||||
publicPath: "./"
|
||||
};
|
||||
Reference in New Issue
Block a user