construido para presentacion #1
@@ -1,6 +1,5 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
|
||||
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 278 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 278 KiB |
Vendored
+1
@@ -0,0 +1 @@
|
||||
#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px;padding:0;margin:0}.row{margin:0!important}.divMaster{height:7em;margin:0 auto}.azulUnam{background-color:#1e3c70}.sizeImg{height:5rem}.logo_acatlan_resp{display:none!important}@media (max-width:450px){.logo_acatlan,.logo_unam{display:none!important}.logo_acatlan_resp{display:block!important}.logo_acatlan_resp a img{height:5rem}}[data-v-9a0c37aa]{margin:0;padding:0}.divMaster[data-v-9a0c37aa]{height:auto;margin:0 auto}nav[data-v-9a0c37aa]{padding:.5rem 0}.azulUnam[data-v-9a0c37aa]{background-color:#1e3c70}.doradoUnam[data-v-9a0c37aa],.dropdown-item[data-v-9a0c37aa]:hover{background-color:#b80}.dropdown-itemBusqueda[data-v-9a0c37aa]:hover{background-color:#1e3c70;color:#fff}.nav-link[data-v-9a0c37aa]:focus{background-color:#1e3c70;border-radius:1rem}.nav-link[data-v-9a0c37aa]:hover{background-color:#1e3c70;color:#fff}.nav-link[data-v-9a0c37aa]{transition:.3s;font-size:20px}.dropdown-item[data-v-9a0c37aa]{padding:.3rem 1rem}.menuText[data-v-9a0c37aa]{display:none}.reDer[data-v-9a0c37aa]{border-top-right-radius:20px 20px!important;border-bottom-right-radius:20px 20px!important}.reIzq[data-v-9a0c37aa]{border-top-left-radius:20px 20px!important;border-bottom-left-radius:20px 20px!important}.dropdown[data-v-9a0c37aa]{position:relative;display:inline-block;height:auto}.dropdown-content[data-v-9a0c37aa]{position:absolute;background-color:#f9f9f9;min-width:160px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);top:.8rem;left:-10rem;display:block}.rescont[data-v-9a0c37aa]{z-index:2}.list-group-item[data-v-9a0c37aa]{padding:12px 16px}@media (max-width:450px){.buscador[data-v-9a0c37aa],.menuText[data-v-9a0c37aa]{display:block!important}.dropdown-menu[data-v-9a0c37aa]{width:80vw!important}}.boton-footer[data-v-ad216416]{background-color:#b80;color:#fff;width:14rem;font-size:.8rem}.dos[data-v-ad216416],.tres[data-v-ad216416],.uno[data-v-ad216416]{margin-right:1rem}.btn[data-v-ad216416]{margin-bottom:1rem}.Azul-puma[data-v-ad216416]{background-color:#1e3c70}.footer[data-v-ad216416]{text-align:center;color:#fff}@media (max-width:768px){.tres[data-v-ad216416],.uno[data-v-ad216416]{margin-right:4rem}.dos[data-v-ad216416]{margin-right:0}.footer[data-v-ad216416]{font-size:.7rem}}@media (max-width:970px){.dos[data-v-ad216416],.tres[data-v-ad216416],.uno[data-v-ad216416]{margin-right:.5rem}.footer[data-v-ad216416]{font-size:.7rem}}.divMaster[data-v-5e380f72],.divMaster[data-v-d6e69568]{height:auto}.card[data-v-5e380f72]{border:none!important;border-bottom:5px solid #1b3d70!important}a[data-v-5e380f72]{text-decoration:none!important;color:#000}.bor{border:none!important;border-bottom:5px solid #1b3d70!important}.bgAzul{background-color:#1b3d70;width:40%;border-top-right-radius:20px 20px!important;border-top-left-radius:20px 20px!important}.pTitulo{margin:0;font-size:30px}@media screen and (max-width:400px){.pTitulo{font-size:20px}.bgAzul{width:60%}}.divMaster[data-v-307e5400]{height:auto}.card[data-v-307e5400]{border:none!important;border-bottom:5px solid #1b3d70!important}a[data-v-307e5400]{text-decoration:none!important;color:#000}.img[data-v-307e5400]{margin-left:1rem;margin-top:1rem}.izq[data-v-307e5400]{display:flex;justify-content:flex-start}.button[data-v-307e5400]{background-color:#b80;border:none;color:#fff;height:4.5rem;width:15rem;text-align:center;text-decoration:none;display:inline-block;font-size:1.5rem;border-radius:1rem;transition-duration:.4s;box-shadow:0 8px 16px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);margin-top:2rem}.button[data-v-307e5400]:hover{background-color:#46c200;color:#fff}.pre[data-v-307e5400]{background-color:#1e3c70}.pre[data-v-307e5400]:hover{background-color:#b80}.titulo[data-v-307e5400]{font-size:1rem;text-align:left;color:balck}p[data-v-307e5400]{margin-bottom:.5rem}.libro[data-v-307e5400]{width:320px;height:480px;margin-right:auto;box-shadow:0 0 20px 0 rgba(0,0,0,.57)}@media (max-width:450px){.libro[data-v-307e5400]{width:270px;height:380px;margin-right:auto;box-shadow:0 0 20px 0 rgba(0,0,0,.57)}.button[data-v-307e5400]{text-align:center;margin-top:3rem}}@media screen and (max-width:380px){.button[data-v-307e5400]{text-align:center;margin-top:3rem}}.imgLibro{height:600px}.scroll{width:100%;height:60%;overflow:auto}@media (max-width:400px){.scroll{height:90%}}.card-header[data-v-0a2f2010]{background-color:#b80;padding:.5rem;display:flex;justify-content:space-between;align-items:center}p[data-v-0a2f2010]{margin-bottom:0}#collapse1 div div[data-v-0a2f2010]{margin:1rem 0}#collapse2 div h5[data-v-0a2f2010]{margin-top:2rem}#collapseA1 div p[data-v-0a2f2010]{margin:1rem 0}.ims[data-v-0a2f2010]{max-width:50%}.divMaster[data-v-3d3fad27]{height:auto}.card[data-v-3d3fad27]{border:none!important;border-bottom:5px solid #1b3d70!important}a[data-v-3d3fad27]{text-decoration:none!important;color:#000}
|
||||
Vendored
+6
File diff suppressed because one or more lines are too long
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
Vendored
+1
@@ -0,0 +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.5ec169bf.css rel=preload as=style><link href=css/chunk-vendors.138628b4.css rel=preload as=style><link href=js/app.f18e8628.js rel=preload as=script><link href=js/chunk-vendors.8f463115.js rel=preload as=script><link href=css/chunk-vendors.138628b4.css rel=stylesheet><link href=css/app.5ec169bf.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.8f463115.js></script><script src=js/app.f18e8628.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
+68
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
Generated
+46
@@ -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",
|
||||
@@ -2455,6 +2486,11 @@
|
||||
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=",
|
||||
"dev": true
|
||||
},
|
||||
"bootstrap": {
|
||||
"version": "4.5.2",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.2.tgz",
|
||||
"integrity": "sha512-vlGn0bcySYl/iV+BGA544JkkZP5LB3jsmkeKLFQakCOwCM3AOk7VkldBz4jrzSe+Z0Ezn99NVXa1o45cQY4R6A=="
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
@@ -6454,6 +6490,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
|
||||
"integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
|
||||
},
|
||||
"js-message": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.5.tgz",
|
||||
@@ -7857,6 +7898,11 @@
|
||||
"ts-pnp": "^1.1.6"
|
||||
}
|
||||
},
|
||||
"popper.js": {
|
||||
"version": "1.16.1",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
|
||||
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
|
||||
},
|
||||
"portfinder": {
|
||||
"version": "1.0.28",
|
||||
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
|
||||
|
||||
@@ -8,7 +8,11 @@
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
"bootstrap": "^4.5.2",
|
||||
"core-js": "^3.6.5",
|
||||
"jquery": "^3.5.1",
|
||||
"popper.js": "^1.16.1",
|
||||
"vue": "^2.6.11",
|
||||
"vue-router": "^3.3.4"
|
||||
},
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 278 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 278 KiB |
+2
-2
@@ -4,8 +4,8 @@
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<link rel="shortcut icon" type="image/png" href="assets/icono.png">
|
||||
<title>Portal Editorial Acatlán</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
|
||||
+29
-22
@@ -1,22 +1,29 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "App"
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#app {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "App"
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#app {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.row {
|
||||
margin: 0 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.7 KiB |
@@ -1,114 +0,0 @@
|
||||
<template>
|
||||
<div class="hello">
|
||||
<h1>{{ msg }}</h1>
|
||||
<p>
|
||||
For a guide and recipes on how to configure / customize this project,<br />
|
||||
check out the
|
||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-cli documentation</a
|
||||
>.
|
||||
</p>
|
||||
<h3>Installed CLI Plugins</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>babel</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>eslint</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Essential Links</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
|
||||
>Forum</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
|
||||
>Community Chat</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
|
||||
>Twitter</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Ecosystem</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://router.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-router</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-devtools#vue-devtools"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vue-devtools</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-loader</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/awesome-vue"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>awesome-vue</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "HelloWorld",
|
||||
props: {
|
||||
msg: String
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
h3 {
|
||||
margin: 40px 0 0;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
}
|
||||
a {
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<div class="divMaster row my-5">
|
||||
<div
|
||||
id="carouselExampleControls"
|
||||
class="carousel slide col-md-10 col-lg-10 col-xl-10 col-12 mx-auto"
|
||||
data-ride="carousel"
|
||||
>
|
||||
<div class="carousel-inner">
|
||||
<div
|
||||
class="carousel-item"
|
||||
v-bind:key="libro.id"
|
||||
v-for="(libro, idx) in Libros"
|
||||
:class="{ active: idx == 0 }"
|
||||
>
|
||||
<img :src="libro.img" class="d-block w-100 img-fluid" alt="img" />
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
class="carousel-control-prev"
|
||||
href="#carouselExampleControls"
|
||||
role="button"
|
||||
data-slide="prev"
|
||||
>
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
<a
|
||||
class="carousel-control-next"
|
||||
href="#carouselExampleControls"
|
||||
role="button"
|
||||
data-slide="next"
|
||||
>
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
Libros: []
|
||||
};
|
||||
},
|
||||
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++) {
|
||||
console.log(path);
|
||||
let config = {
|
||||
// example url
|
||||
url: `${path}${nombres[i]}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.Libros.push({ id: i, img: reader.result });
|
||||
};
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error msj: ${error}`);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="divMaster row mb-5">
|
||||
<div class="col-10 offset-1 d-flex flex-wrap justify-content-center">
|
||||
<div
|
||||
class="card m-3"
|
||||
style="width: 12rem;"
|
||||
v-bind:key="libro.id"
|
||||
v-for="libro in Libros"
|
||||
@click="descripcion(libro.id)"
|
||||
>
|
||||
<router-link :to="{ path: 'home' }" class="textt">
|
||||
<img :src="libro.img" class="card-img-top rounded" alt="libro" />
|
||||
<div class="card-body cd textt">
|
||||
<p class="card-text textt">
|
||||
{{ libro.title }}
|
||||
</p>
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
Libros: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async descripcion(idLibro) {
|
||||
console.log(` Este es el id del libro ${idLibro}`);
|
||||
localStorage.clear();
|
||||
window.localStorage.setItem("idLibro", idLibro);
|
||||
this.$router.push("/desc");
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
let novedades = await axios.get(`${config.api}/librosNovedades`);
|
||||
let path = `${config.api}/libroImagen?idLibro=`;
|
||||
novedades = novedades.data.data;
|
||||
console.log(`${novedades}`);
|
||||
for (let i = 0; i < novedades.length; i++) {
|
||||
//alert(novedades[i].titulo);
|
||||
//this.Libros[i].title = novedades[i].titulo;
|
||||
let config = {
|
||||
// example url
|
||||
url: `${path}${(i % 3) + 1}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.Libros.push({
|
||||
id: novedades[i].idLibro,
|
||||
title: novedades[i].titulo,
|
||||
img: reader.result
|
||||
});
|
||||
};
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error ${error}`);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
.card {
|
||||
border: none !important;
|
||||
border-bottom: 5px solid #1b3d70 !important;
|
||||
}
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
color: black;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,271 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="row ">
|
||||
<div class="col-md-6 col-sm-12 py-5">
|
||||
<img :src="src" alt="" class="libro" />
|
||||
<button class="button pre">
|
||||
Previsualizar</button
|
||||
><br /><br />
|
||||
<div class="container">
|
||||
<div class="row izq">
|
||||
<b style="font-size: 18px;" class="izq">Compartir</b><br />
|
||||
</div>
|
||||
<div class="container izq">
|
||||
<a href="https://www.facebook.com/" class="img"
|
||||
><img
|
||||
style="width: 45px; height: 45px"
|
||||
src="../assets/facebook.png"
|
||||
alt="Facebook"
|
||||
/></a>
|
||||
<a href="https://www.instagram.com/" class="img"
|
||||
><img
|
||||
style="width: 45px; height: 45px"
|
||||
src="../assets/Instagram.png"
|
||||
alt="Instagram"
|
||||
/></a>
|
||||
<a href="https://www.youtube.com/" class="img"
|
||||
><img
|
||||
style="width: 45px; height: 45px"
|
||||
src="../assets/YouTube.png"
|
||||
alt="Youtube"
|
||||
/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 col-sm-12 py-5 titulo">
|
||||
<b>Titulo:</b>
|
||||
<p>{{ titulo }}</p>
|
||||
<b>Autor: </b>
|
||||
<p>{{ autor }}</p>
|
||||
<b>Paginas: </b>
|
||||
<p>{{ paginas }}</p>
|
||||
<b>ISBN: </b>
|
||||
<p>{{ isbn }}</p>
|
||||
<b>Año de Impresión: </b>
|
||||
<p>{{ edicion }}</p>
|
||||
<b>Precio: </b>
|
||||
<p>{{ precio }}</p>
|
||||
<b>Versión:</b>
|
||||
<p>{{ version }}</p>
|
||||
<b>Descripción:</b>
|
||||
<div class="overflow-auto">{{ desc }}</div>
|
||||
<button class="button ">
|
||||
{{ boton2 }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<Title title="Similares" />
|
||||
<div class="divMaster row mb-5">
|
||||
<div class="col-10 offset-1 d-flex flex-wrap justify-content-center">
|
||||
<div
|
||||
class="card m-3"
|
||||
style="width: 12rem;"
|
||||
v-bind:key="libro.id"
|
||||
v-for="libro in Libros"
|
||||
@click="descripcion(libro.id)"
|
||||
>
|
||||
<div class="textt">
|
||||
<img :src="libro.img" class="card-img-top rounded" alt="libro" />
|
||||
<div class="card-body cd textt">
|
||||
<p class="card-text textt">
|
||||
{{ libro.title }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
import Title from "../components/titulo.vue";
|
||||
export default {
|
||||
components: {
|
||||
Title
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
idLibro: "",
|
||||
titulo: "",
|
||||
autor: "",
|
||||
paginas: "",
|
||||
isbn: "",
|
||||
edicion: "",
|
||||
precio: "",
|
||||
src: "",
|
||||
version: "",
|
||||
desc: ``,
|
||||
boton2: "",
|
||||
categoria: "",
|
||||
Libros: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async descripcion(idLibro) {
|
||||
localStorage.clear();
|
||||
window.localStorage.setItem("idLibro", idLibro);
|
||||
location.reload();
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
let path = `${config.api}`;
|
||||
try {
|
||||
this.idLibro = window.localStorage.getItem("idLibro");
|
||||
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);
|
||||
}
|
||||
this.idLibro = 1;
|
||||
|
||||
try {
|
||||
let config = {
|
||||
// example url
|
||||
url: `${path}/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++) {
|
||||
let config = {
|
||||
// example url
|
||||
url: `${path}/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.push({
|
||||
id: similares[i].idLibro,
|
||||
title: similares[i].titulo,
|
||||
img: reader.result
|
||||
});
|
||||
//this.Libros[i].img = reader.result;
|
||||
};
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error ${error}`);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
.card {
|
||||
border: none !important;
|
||||
border-bottom: 5px solid #1b3d70 !important;
|
||||
}
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
color: black;
|
||||
}
|
||||
.img {
|
||||
margin-left: 1rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.izq {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.button {
|
||||
background-color: rgb(187, 136, 0);
|
||||
border: none;
|
||||
color: white;
|
||||
height: 4.5rem;
|
||||
width: 15rem;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
font-size: 1.5rem;
|
||||
border-radius: 1rem;
|
||||
-webkit-transition-duration: 0.4s; /* Safari */
|
||||
transition-duration: 0.4s;
|
||||
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||
margin-top: 2rem;
|
||||
}
|
||||
.button:hover {
|
||||
background-color: #46c200;
|
||||
color: white;
|
||||
}
|
||||
.pre {
|
||||
background-color: #1e3c70;
|
||||
}
|
||||
.pre:hover {
|
||||
background-color: rgb(187, 136, 0);
|
||||
}
|
||||
|
||||
.titulo {
|
||||
font-size: 1rem;
|
||||
text-align: left;
|
||||
color: balck;
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.libro {
|
||||
width: 320px;
|
||||
height: 480px;
|
||||
margin-right: auto;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
|
||||
}
|
||||
@media (max-width: 450px) {
|
||||
.libro {
|
||||
width: 270px;
|
||||
height: 380px;
|
||||
margin-right: auto;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
|
||||
}
|
||||
.button {
|
||||
text-align: center;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 380px) {
|
||||
.button {
|
||||
text-align: center;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<footer class="container-fluid Azul-puma footer py-3 ">
|
||||
<div class="container">
|
||||
<div row>
|
||||
<button type="button" class="col-md-6 col-sm-12 btn boton-footer uno">
|
||||
Comité Editorial
|
||||
</button>
|
||||
<router-link to="/lineamientos">
|
||||
<button type="button" class="col-md-6 col-sm-12 btn boton-footer dos">
|
||||
Política Editorial y Lineamentos
|
||||
</button></router-link
|
||||
>
|
||||
<button type="button" class="col-md-6 col-sm-12 btn boton-footer tres">
|
||||
Proceso Editorial y Organismos
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="col-md-6 col-sm-12 btn boton-footer cuatro"
|
||||
>
|
||||
Puntos de Venta
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div row>
|
||||
<p class="mb-0 ">Hecho en México, todos los derechos reservados 2020.</p>
|
||||
<p class="my-0 ">
|
||||
Esta página puede ser reproducida con fines no lucrativos, siempre y
|
||||
cuando no se mutile, se cite la fuente
|
||||
</p>
|
||||
<p>
|
||||
completa y su dirección electrónica. De otra forma, requiere permiso
|
||||
previo por escrito de la institución.
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.boton-footer {
|
||||
background-color: rgb(187, 136, 0);
|
||||
color: white;
|
||||
width: 14rem;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.uno,
|
||||
.dos,
|
||||
.tres {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
.btn {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.Azul-puma {
|
||||
background-color: #1e3c70;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.uno,
|
||||
.tres {
|
||||
margin-right: 4rem;
|
||||
}
|
||||
.dos {
|
||||
margin-right: 0rem;
|
||||
}
|
||||
.footer {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 970px) {
|
||||
.uno,
|
||||
.dos,
|
||||
.tres {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.footer {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,65 @@
|
||||
<template>
|
||||
<div class="row divMaster header cl-12 azulUnam">
|
||||
<div
|
||||
class="logo_unam col-4 offset-1 d-inline-flex my-2 align-items-center"
|
||||
>
|
||||
<a href="https://www.unam.mx/" target="_blank">
|
||||
<img class="sizeImg" src="../assets/Logo-UNAM.png" alt="logo unam" />
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="logo_acatlan col-4 offset-2 d-inline-flex justify-content-end my-2 align-items-center"
|
||||
>
|
||||
<a href="https://www.acatlan.unam.mx/" target="_blank">
|
||||
<img
|
||||
class="sizeImg"
|
||||
src="../assets/FES-editoriales.png"
|
||||
alt="logo unam"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="logo_acatlan_resp col-8 offset-2 d-flex justify-content-center my-2 align-items-center"
|
||||
>
|
||||
<a href="https://www.acatlan.unam.mx/" target="_blank">
|
||||
<img
|
||||
class="sizeImg"
|
||||
src="../assets/FES-editoriales.png"
|
||||
alt="logo unam"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.divMaster {
|
||||
height: 7em;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.azulUnam {
|
||||
background-color: #1e3c70;
|
||||
}
|
||||
.sizeImg {
|
||||
height: 5rem;
|
||||
}
|
||||
.logo_acatlan_resp {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
.logo_acatlan,
|
||||
.logo_unam {
|
||||
display: none !important;
|
||||
}
|
||||
.logo_acatlan_resp {
|
||||
display: block !important;
|
||||
}
|
||||
.logo_acatlan_resp a img {
|
||||
height: 5rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<nav
|
||||
class="navbar navbar-expand-md navbar-light "
|
||||
style="background-color:#BB8800;"
|
||||
>
|
||||
<div class="container">
|
||||
<nav class=" ">
|
||||
<button
|
||||
class=" navbar-toggler van text-whitee btn-sm"
|
||||
type="button"
|
||||
id="toggle-menu"
|
||||
data-toggle="collapse"
|
||||
data-target="#navbarNav"
|
||||
aria-controls="navbarNav"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
v-on:click="toggle()"
|
||||
>
|
||||
<span
|
||||
class=" navbar-toggler-icon x m-1 text-white"
|
||||
style="color:white !important;"
|
||||
></span>
|
||||
Menú
|
||||
</button>
|
||||
</nav>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav mr-auto mt-0 mt-lg-0">
|
||||
<li class="nav-item dropdown">
|
||||
<router-link to="#" class="nav-item nav-link text-white "
|
||||
><a> Inicio</a></router-link
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<router-link to="#" class="nav-item nav-link text-white"
|
||||
><a>Presentacion</a></router-link
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<router-link to="#" class="nav-item nav-link text-white"
|
||||
><a>Libros</a></router-link
|
||||
>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<router-link to="#" class="nav-item nav-link text-white"
|
||||
><a>Difusión Editorial</a></router-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="form-inline my-0 my-lg-0">
|
||||
<div class="input-group input-group-sm mb-0">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control reIzq "
|
||||
placeholder="Buscar"
|
||||
aria-label="Recipient's username"
|
||||
aria-describedby="basic-addon2"
|
||||
/>
|
||||
<div class="input-group-append reDer bg-white">
|
||||
<button class="btn my-0" type="submit">
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
viewBox="0 0 16 16"
|
||||
class="bi bi-search"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
toggle: function() {
|
||||
let element = document.getElementById("navbarNav");
|
||||
element.classList.toggle("block");
|
||||
element.classList.add("mystyle");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.reDer {
|
||||
border-top-right-radius: 20px 20px !important;
|
||||
border-bottom-right-radius: 20px 20px !important;
|
||||
}
|
||||
.reIzq {
|
||||
border-top-left-radius: 20px 20px !important;
|
||||
border-bottom-left-radius: 20px 20px !important;
|
||||
}
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.mystyle {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
a {
|
||||
max-height: 100%;
|
||||
}
|
||||
.menu {
|
||||
background-color: #bb8800;
|
||||
}
|
||||
|
||||
.menu nav ul {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 0rem;
|
||||
}
|
||||
|
||||
.menu nav ul div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.menu nav ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.menu nav ul li a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
a {
|
||||
color: white;
|
||||
transition: 0.5s;
|
||||
padding-left: 0.3rem;
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: #1e3c70;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #936900;
|
||||
}
|
||||
|
||||
.van {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.x {
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.van {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div class="divMaster row mb-5">
|
||||
<div class="col-10 offset-1 d-flex flex-wrap justify-content-center">
|
||||
<div
|
||||
class="card m-3"
|
||||
style="width: 12rem;"
|
||||
v-bind:key="libro.id"
|
||||
v-for="libro in Libros"
|
||||
@click="descripcion(libro.id)"
|
||||
>
|
||||
<router-link :to="{ path: 'home' }" class="textt">
|
||||
<img :src="libro.img" class="card-img-top rounded" alt="libro" />
|
||||
<div class="card-body cd textt">
|
||||
<p class="card-text textt">
|
||||
{{ libro.title }}
|
||||
</p>
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
export default {
|
||||
components: {},
|
||||
|
||||
data() {
|
||||
return {
|
||||
categoria: "",
|
||||
Libros: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async descripcion(idLibro) {
|
||||
localStorage.clear();
|
||||
window.localStorage.setItem("idLibro", idLibro);
|
||||
this.$router.push("/desc");
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
let path = `${config.api}`;
|
||||
this.categoria = window.localStorage.getItem("categoria");
|
||||
try {
|
||||
let similares = await axios.get(
|
||||
`${config.api}/temaLibro?categoria=${this.categoria}`
|
||||
);
|
||||
similares = similares.data.data;
|
||||
console.log(` este es el resutlado${similares}`);
|
||||
for (let i = 0; i < similares.length; i++) {
|
||||
let config = {
|
||||
// example url
|
||||
url: `${path}/libroImagen?idLibro=${(i % 4) + 1}`,
|
||||
method: "GET",
|
||||
responseType: "blob"
|
||||
};
|
||||
await axios(config).then(response => {
|
||||
let reader = new FileReader();
|
||||
reader.readAsDataURL(response.data);
|
||||
reader.onload = () => {
|
||||
this.Libros.push({
|
||||
id: similares[i].idLibro,
|
||||
title: similares[i].titulo,
|
||||
img: reader.result
|
||||
});
|
||||
//this.Libros[i].img = reader.result;
|
||||
};
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(`Ocurrio un error ${error}`);
|
||||
}
|
||||
},
|
||||
beforeCreate() {
|
||||
if (!window.localStorage.getItem("categoria")) this.$router.push("/");
|
||||
else this.categoria = window.localStorage.getItem("categoria");
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.divMaster {
|
||||
height: auto;
|
||||
}
|
||||
.card {
|
||||
border: none !important;
|
||||
border-bottom: 5px solid #1b3d70 !important;
|
||||
}
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
color: black;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<div class="divMaster">
|
||||
<div class="row">
|
||||
<div class="col-10 offset-1 bor d-flex justify-content-center">
|
||||
<div class="bgAzul">
|
||||
<p class="text-white pTitulo">{{ title }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ["title"]
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.bor {
|
||||
border: none !important;
|
||||
border-bottom: 5px solid #1b3d70 !important;
|
||||
}
|
||||
.bgAzul {
|
||||
background-color: #1b3d70;
|
||||
width: 40%;
|
||||
|
||||
border-top-right-radius: 20px 20px !important;
|
||||
border-top-left-radius: 20px 20px !important;
|
||||
}
|
||||
.pTitulo {
|
||||
margin: 0;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 400px) {
|
||||
.pTitulo {
|
||||
font-size: 20px;
|
||||
}
|
||||
.bgAzul {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,11 @@
|
||||
const config = {
|
||||
//ngrok
|
||||
//api: "https://f8d86328e778.ngrok.io"
|
||||
|
||||
//Local
|
||||
//api: "http://localhost:3001"
|
||||
|
||||
//Pruebas
|
||||
api: "https://venus.acatlan.unam.mx/portal"
|
||||
};
|
||||
module.exports = config;
|
||||
@@ -0,0 +1,317 @@
|
||||
<template>
|
||||
<div class="divMaster doradoUnam row d-flex justify-content-center">
|
||||
<div class="col-10 offset-1">
|
||||
<nav class="navbar navbar-expand-sm navbar-dark ">
|
||||
<button
|
||||
@click="method()"
|
||||
class="navbar-toggler col-5"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#navbarTogglerDemo02"
|
||||
aria-controls="navbarTogglerDemo02"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<span class="navbar-toggler-icon blanco"></span>
|
||||
<span class="mx-2">Menu</span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse " id="navbarTogglerDemo02">
|
||||
<ul
|
||||
class="navbar-nav mr-auto w-100 d-flex align-items-center justify-content-start mt-0 mt-lg-0"
|
||||
>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#" @click="inicio()"
|
||||
>Inicio</a
|
||||
>
|
||||
</li>
|
||||
<!--<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#">Presentacion</a>
|
||||
</li>-->
|
||||
|
||||
<li class="nav-item ml-4">
|
||||
<div class="dropdown">
|
||||
<a
|
||||
class="btn nav-link dropdown-toggle text-white"
|
||||
href="#"
|
||||
role="button"
|
||||
id="dropdownMenuLink"
|
||||
data-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
>
|
||||
Libros
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="dropdown-menu azulUnam"
|
||||
aria-labelledby="navbarDropdown"
|
||||
>
|
||||
<a
|
||||
class="dropdown-item text-white"
|
||||
@click="tema('Ciencias Socioeconomicas')"
|
||||
>Ciencias Socioeconomicas</a
|
||||
>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a
|
||||
class="dropdown-item text-white"
|
||||
@click="tema('Diseño y Edificacion')"
|
||||
>Diseño y Edificacion</a
|
||||
>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a
|
||||
class="dropdown-item text-white"
|
||||
@click="tema('Enseñanza de Idiomas')"
|
||||
>Enseñanza de Idiomas</a
|
||||
>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a
|
||||
class="dropdown-item text-white"
|
||||
@click="tema('Estudios de Posgrado')"
|
||||
>Estudios de Posgrado</a
|
||||
>
|
||||
<div class="dropdown-divider "></div>
|
||||
<a
|
||||
class="dropdown-item text-white "
|
||||
@click="tema('Humanidades')"
|
||||
>Humanidades</a
|
||||
>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a
|
||||
class="dropdown-item text-white"
|
||||
@click="tema('Matematicas e Ingenieria')"
|
||||
>Matematicas e Ingenieria</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!--<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#">Difusion Editorial</a>
|
||||
</li>-->
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<form
|
||||
id="buscador"
|
||||
v-if="isExist"
|
||||
class="form-inline my-0 my-lg-0 buscador col-4 d-flex justify-content-end"
|
||||
>
|
||||
<div class="input-group input-group-sm mb-0">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control reIzq "
|
||||
placeholder="Buscar"
|
||||
aria-label="Recipient's username"
|
||||
aria-describedby="basic-addon2"
|
||||
v-model="nombre"
|
||||
/>
|
||||
<div class="input-group-append reDer bg-white dropdown">
|
||||
<button class="btn my-0" type="submit">
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
viewBox="0 0 16 16"
|
||||
class="bi bi-search blanco"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div>-->
|
||||
<div v-if="nombre.length > 2" class=" rescont ">
|
||||
<ul class=" dropdown-menu d-block dropdown-menu-right ">
|
||||
<li
|
||||
class=" dropdown-item dropdown-itemBusqueda text-wrap "
|
||||
v-for="item in buscarLibro"
|
||||
v-bind:key="item.idLibro"
|
||||
@click="descripcion(item.idLibro)"
|
||||
>
|
||||
{{ item.titulo }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- <ul class=" dropdown-menu d-block dropdown-menu-right">
|
||||
<li class="dropdown-item text-wrap">Lorem ipsum dolor sit amet consectetur adipisicing elit.</li>
|
||||
|
||||
<li class="dropdown-item dropdown-itemBusqueda text-wrap">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat nam molestiae delectus aliquid dignissimos ullam illo provident laborum perspiciatis sapiente. Officiis eveniet animi ad beatae iusto cupiditate earum quo enim?</li>
|
||||
<li class=" dropdown-item text-wrap">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat nam molestiae delectus aliquid dignissimos ullam illo provident laborum perspiciatis sapiente. Officiis eveniet animi ad beatae iusto cupiditate earum quo enim?</li>
|
||||
|
||||
<li class=" dropdown-item text-wrap">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat nam molestiae delectus aliquid dignissimos ullam illo provident laborum perspiciatis sapiente. Officiis eveniet animi ad beatae iusto cupiditate earum quo enim?</li>
|
||||
|
||||
</ul> -->
|
||||
</div>
|
||||
</form>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import config from "../config/config.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isExist: true,
|
||||
libros: [],
|
||||
nombre: ""
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async descripcion(idLibro) {
|
||||
console.log(` Este es el id del libro ${idLibro}`);
|
||||
localStorage.clear();
|
||||
window.localStorage.setItem("idLibro", idLibro);
|
||||
this.$router.push("/desc").catch(() => {
|
||||
location.reload();
|
||||
});
|
||||
},
|
||||
inicio() {
|
||||
this.$router.push("/").catch(() => {
|
||||
location.reload();
|
||||
});
|
||||
},
|
||||
async tema(categoria) {
|
||||
window.localStorage.setItem("categoria", categoria);
|
||||
this.$router.push("/tema").catch(() => {
|
||||
location.reload();
|
||||
});
|
||||
},
|
||||
method() {
|
||||
this.isExist = !this.isExist;
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
let path = `${config.api}`;
|
||||
try {
|
||||
let libros = await axios.get(`${path}/getLibros`);
|
||||
this.libros = await libros.data.data;
|
||||
} catch (error) {
|
||||
console.log(`Error ${error}`);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
buscarLibro: function() {
|
||||
return this.libros.filter(item =>
|
||||
item.titulo.toLowerCase().includes(this.nombre.toLowerCase())
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.divMaster {
|
||||
/* max-width: 1280px; */
|
||||
height: auto;
|
||||
margin: 0 auto;
|
||||
}
|
||||
nav {
|
||||
padding: 0.5rem 0;
|
||||
}
|
||||
|
||||
.azulUnam {
|
||||
background-color: #1e3c70;
|
||||
}
|
||||
|
||||
.doradoUnam {
|
||||
background-color: #bb8800;
|
||||
}
|
||||
|
||||
.dropdown-item:hover {
|
||||
background-color: #bb8800;
|
||||
}
|
||||
|
||||
.dropdown-itemBusqueda:hover {
|
||||
background-color: #1e3c70;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.nav-link:focus {
|
||||
background-color: #1e3c70;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
background-color: #1e3c70;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
transition: 0.3s;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
padding: 0.3rem 1rem;
|
||||
}
|
||||
|
||||
.menuText {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.reDer {
|
||||
border-top-right-radius: 20px 20px !important;
|
||||
border-bottom-right-radius: 20px 20px !important;
|
||||
}
|
||||
|
||||
.reIzq {
|
||||
border-top-left-radius: 20px 20px !important;
|
||||
border-bottom-left-radius: 20px 20px !important;
|
||||
}
|
||||
|
||||
/*
|
||||
.dropdown-menu {
|
||||
width: 10% !important;
|
||||
} */
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
position: absolute;
|
||||
background-color: #f9f9f9;
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
|
||||
/* padding: 12px 16px; */
|
||||
top: 0.8rem;
|
||||
left: -10rem;
|
||||
display: block;
|
||||
}
|
||||
.rescont {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
padding: 12px 16px;
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
.menuText,
|
||||
.buscador {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
width: 80vw !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
+4
-2
@@ -1,11 +1,13 @@
|
||||
import Vue from "vue";
|
||||
import App from "./App.vue";
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
import "bootstrap";
|
||||
import "bootstrap/dist/css/bootstrap.min.css";
|
||||
|
||||
import VueRouter from "vue-router";
|
||||
import { routes } from "./routes";
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
Vue.use(VueRouter);
|
||||
const router = new VueRouter({
|
||||
routes
|
||||
|
||||
+13
-4
@@ -1,6 +1,15 @@
|
||||
import Form from "./components/home.vue";
|
||||
import Login from "./components/login.vue";
|
||||
import home from "./view/home.vue";
|
||||
import login from "./view/login.vue";
|
||||
import libroDescripcion from "./view/libroDescripcion.vue";
|
||||
import difusion from "./view/difusion.vue";
|
||||
import lineamientos from "./view/lineamiento.vue";
|
||||
import tema from "./view/tema.vue";
|
||||
|
||||
export const routes = [
|
||||
{ path: "/", component: Form, name: "form" },
|
||||
{ path: "/panelAdmin", component: Login, name: "Login" }
|
||||
{ path: "/", component: home, name: "form" },
|
||||
{ path: "/login", component: login, name: "Login" },
|
||||
{ path: "/desc", component: libroDescripcion, name: "LibroDesc" },
|
||||
{ path: "/difusion", component: difusion, name: "difusion" },
|
||||
{ path: "/lineamientos", component: lineamientos, name: "lineamientos" },
|
||||
{ path: "/tema", component: tema, name: "tema" }
|
||||
];
|
||||
|
||||
@@ -0,0 +1,97 @@
|
||||
<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,32 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<Nav />
|
||||
<Carr />
|
||||
<Title title="Recientes" />
|
||||
<Cart />
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
import Nav from "./../esteticas/nav.vue";
|
||||
//import Nav from "./../components/navPrincipal.vue";
|
||||
import Footer from "./../components/footer.vue";
|
||||
import Carr from "../components/carrusel.vue";
|
||||
import Cart from "../components/cartLibro.vue";
|
||||
import Title from "../components/titulo.vue";
|
||||
|
||||
export default {
|
||||
name: "home",
|
||||
components: {
|
||||
Header,
|
||||
Nav,
|
||||
Footer,
|
||||
Carr,
|
||||
Cart,
|
||||
Title
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<Nav />
|
||||
|
||||
<Descrip />
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
import Nav from "./../esteticas/nav.vue";
|
||||
import Descrip from "./../components/descripcion.vue";
|
||||
import Footer from "./../components/footer.vue";
|
||||
|
||||
export default {
|
||||
name: "App",
|
||||
components: {
|
||||
Header,
|
||||
Nav,
|
||||
Descrip,
|
||||
Footer
|
||||
}
|
||||
};
|
||||
</script>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<h1 class="my-5">Inicia Sesion</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"
|
||||
class="form-control col-8"
|
||||
name="login"
|
||||
placeholder="Usuario"
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
v-model="data.password"
|
||||
id="password"
|
||||
class="form-control col-8 my-3"
|
||||
name="login"
|
||||
placeholder="Contraseña"
|
||||
/>
|
||||
<input
|
||||
type="button"
|
||||
@click="login"
|
||||
class="btn bg-primary text-white col-5"
|
||||
value="Ingresar"
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
data: {
|
||||
email: "",
|
||||
password: ""
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
login() {
|
||||
alert(this.data.email);
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Header
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
@@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header />
|
||||
<Nav />
|
||||
<Title title="Resultado" class="my-5" />
|
||||
<Cart />
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from "./../components/header.vue";
|
||||
import Nav from "./../esteticas/nav.vue";
|
||||
//import Nav from "./../components/navPrincipal.vue";
|
||||
import Footer from "./../components/footer.vue";
|
||||
import Cart from "../components/temaLibro.vue";
|
||||
import Title from "../components/titulo.vue";
|
||||
|
||||
export default {
|
||||
name: "home",
|
||||
components: {
|
||||
Header,
|
||||
Nav,
|
||||
Footer,
|
||||
Cart,
|
||||
Title
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,3 @@
|
||||
module.exports = {
|
||||
publicPath: "./"
|
||||
};
|
||||
Reference in New Issue
Block a user