6 Commits

Author SHA1 Message Date
kikin 03a0372ec6 component fix 2020-10-28 13:16:45 -06:00
kikin b18c5eb606 mostrando en Home 2020-10-27 18:04:38 -06:00
kikin 5ac7f52101 mostrando en Home 2020-10-27 18:03:59 -06:00
kikin baa1d530cf search component 2020-10-22 19:50:17 -05:00
kikin 2b8fd0098a search comppnent 2020-10-22 19:49:11 -05:00
KIKIN 54cd339130 SearchResultsPage agregado 2020-09-17 20:14:40 -05:00
8 changed files with 164 additions and 445 deletions
+76
View File
@@ -10968,6 +10968,36 @@
}
},
"vue-loader-v16": {
<<<<<<< HEAD
<<<<<<< HEAD
=======
<<<<<<< HEAD
"version": "npm:vue-loader@16.0.0-beta.7",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.7.tgz",
"integrity": "sha512-xQ8/GZmRPdQ3EinnE0IXwdVoDzh7Dowo0MowoyBuScEBXrRabw6At5/IdtD3waKklKW5PGokPsm8KRN6rvQ1cw==",
"dev": true,
"optional": true,
"requires": {
"@types/mini-css-extract-plugin": "^0.9.1",
"chalk": "^3.0.0",
"hash-sum": "^2.0.0",
"loader-utils": "^1.2.3",
"merge-source-map": "^1.1.0",
"source-map": "^0.6.1"
},
"dependencies": {
"ansi-styles": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
"integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
"dev": true,
"optional": true,
"requires": {
"@types/color-name": "^1.1.1",
=======
>>>>>>> origin
=======
>>>>>>> origin
"version": "npm:vue-loader@16.0.0-beta.8",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.8.tgz",
"integrity": "sha512-oouKUQWWHbSihqSD7mhymGPX1OQ4hedzAHyvm8RdyHh6m3oIvoRF+NM45i/bhNOlo8jCnuJhaSUf/6oDjv978g==",
@@ -10986,13 +11016,38 @@
"dev": true,
"optional": true,
"requires": {
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> origin
>>>>>>> origin
=======
>>>>>>> origin
"color-convert": "^2.0.1"
}
},
"chalk": {
<<<<<<< HEAD
<<<<<<< HEAD
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
=======
<<<<<<< HEAD
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
"integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
=======
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
>>>>>>> origin
>>>>>>> origin
=======
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
>>>>>>> origin
"dev": true,
"optional": true,
"requires": {
@@ -11024,6 +11079,20 @@
"dev": true,
"optional": true
},
<<<<<<< HEAD
<<<<<<< HEAD
=======
<<<<<<< HEAD
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true,
"optional": true
=======
>>>>>>> origin
=======
>>>>>>> origin
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
@@ -11035,6 +11104,13 @@
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> origin
>>>>>>> origin
=======
>>>>>>> origin
},
"supports-color": {
"version": "7.2.0",
-357
View File
@@ -1,357 +0,0 @@
<template>
<div class="container">
<div class="row ">
<div class="col-md-6 col-sm-12 pt-5">
<div class="row p-0">
<div class=" p-0 col-12 col-md-12 col-lg-2 col-xl-2 d-flex align-items-center justify-content-start flex-row flex-lg-column flex-xl-column ">
<div v-bind:key="src.id"
v-for="src in src"
@click="src2 = src">
<img :src="src" alt="" class="smalll" />
</div>
</div>
<div class="p-0 col-10 d-flex justify-content-center flex-column align-items-center">
<img :src="src2" alt="" class="libro" />
<button class="button pre" @click="showModal()">
Previsualizar
</button>
</div>
</div>
<div v-if="Visible" @close="closeModal()">
<transition name="modal">
<div class="modal-backdrop" @click.self="closeModal()">
<div
class="modal"
role="dialog"
aria-labelledby="modalTitle"
aria-describedby="modalDescription"
>
<section class="modal-body rounded" id="modalDescription">
<iframe
:src="PDF"
width="100%"
height="100%"
frameborder="0"
></iframe>
</section>
</div>
</div>
</transition>
</div>
<br /><br />
</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>Versión:</b>
<p>{{ version }}</p>
<b>Descripción:</b>
<div class="overflow-auto">{{ desc }}</div>
<b>Precio: </b>
<p>${{ precio }}</p>
<b>Cantidad:</b>
<div class="row d-flex align-items-center" >
<div class="col-2 ">
<select name="num" id="num">
<option value="volvo"
v-for="n in inventario"
:key="n"
>
{{n}}
</option>
</select>
</div>
<div class="col-10">
<a
href="https://demo-tienda.acatlan.unam.mx/"
class="button text-white d-flex justify-content-center align-items-center"
id="buttonC"
>
<p class="text-center">Agregar al carrito</p>
</a>
</div>
</div>
</div>
</div>
<Title title="Similares" />
<div class="divMaster row ">
<div class="col-10 offset-1 d-flex flex-wrap justify-content-center mb-5">
<!-- <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 class="carousel-items card m-3 shadow"
style="width: 12rem;"
v-bind:key="item.id"
v-for="item in Libros"
@click="descripcion(libro.id)"
>
<img :src="item.img" class="card-img-top" alt="img" />
<div class="card-body ">
<h5 class="text-center"> <b >${{item.precio}}</b></h5>
<p class="card-text overflow-clip">{{item.descripcion}}</p>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import Title from "../components/titulo.vue";
export default {
components: {
Title
//modal
},
data() {
return {
inventario:5,
idLibro: "",
titulo: "Procesos sociopolíticos y el espacio urbano. El desarrollo histórico urbano de San José Río Hondo, Naucalpan de Juárez (1700 a.C al 2000 d.C.)",
autor: "Mario Camacho Cardona",
paginas: "250",
isbn: "978-607-02-8433-5",
edicion: "Primera edición 2016",
precio: "324",
src: [ "https://demo-tienda.acatlan.unam.mx/55-large_default/metodos-numericos-para-sistemas-de-ecuaciones-no-lineales-interpolacion-y-ajuste-de-curvas.jpg",
"https://tienda.acatlan.unam.mx/365-large_default/ganz-toll-breves-apuntes-sobre-la-sintaxis-alemana.jpg",
"https://tienda.acatlan.unam.mx/363-large_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-2-livello.jpg"],
src2:"https://tienda.acatlan.unam.mx/363-large_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-2-livello.jpg",
version: "Impresa",
desc: `La obra valora la generación y las trasformaciones de la configuración espacial urbano-regional a través del suceder del desarrollo urbano-regional, provocadas por los modelos económico-políticos, administrativos. El sitio de estudio fue: San José Rio Hondo, ubicado en el Estado de México.`,
boton2: "",
categoria: "",
Libros: [
{
img:'https://tienda.acatlan.unam.mx/330-home_default/taza-ceramica-.jpg',
precio:199.00,
descripcion:'esta es la descripcion del articulo'
} ,
{
img:'https://tienda.acatlan.unam.mx/3-home_default/problemas-de-estadistica-aplicada-a-las-ciencias-sociales-y-a-la-vida-cotidiana.jpg',
precio:199.00,
descripcion:'esta es la descripcion del articulo'
},
{
img:'https://tienda.acatlan.unam.mx/3-home_default/problemas-de-estadistica-aplicada-a-las-ciencias-sociales-y-a-la-vida-cotidiana.jpg',
precio:199.00,
descripcion:'esta es la descripcion del articulo'
}
],
Visible: false,
isModalVisible: false,
//PDF: "http://www.ataun.eus/bibliotecagratuita/Cl%C3%A1sicos%20en%20Espa%C3%B1ol/Nicol%C3%A1s%20Maquiavelo/El%20pr%C3%ADncipe.pdf#toolbar=0&navpanes=0&scrollbar=0&zoom=80"
//PDF: "RUTA.pdf" //nombre del archivo de previsualizacion del libro
PDF: "https://venus.acatlan.unam.mx/portal/PDFget/?nombrePDF=espacio_semico_ambiental.pdf"
};
},
methods: {
close() {
this.$emit("close");
},
async descripcion(idLibro) {
localStorage.clear();
window.localStorage.setItem("idLibro", idLibro);
location.reload();
},
showModal() {
this.Visible = true;
},
closeModal() {
this.Visible = false;
}
}
};
</script>
<style scoped>
.modal-backdrop {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: center;
align-items: center;
}
.modal {
background: #ffffff;
box-shadow: 2px 2px 20px 1px;
/* overflow-x: auto; */
display: flex;
flex-direction: column;
position: relative;
width: 90%;
height: 90%;
}
.modal-body {
/* position: relative; */
padding: 20px 10px;
}
.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: 2.5rem;
width: 15rem;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.5rem;
border-radius: .5rem;
-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;
}
#buttonC{
margin-top: 0rem;
}
#buttonC p{
margin: 0;
font-size: 80%;
}
.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: 0;
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
}
.smalll {
width: 80px;
margin: .7rem;
margin-right: 0;
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
}
.modal-backdrop{
opacity: 1;
}
.shadow{
-webkit-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
-moz-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
}
@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;
}
#buttonC{
margin-top: 0rem;
width: 12rem;
}
}
</style>
+82
View File
@@ -0,0 +1,82 @@
<template>
<div class="container my-5">
<h4><b>Resultados para "{{productResult[0].searchText}}"</b></h4>
<p>Hay {{productResult[0].numberFound}} productos</p>
<div class="my-4 d-flex justify-content-sm-start justify-content-center flex-wrap">
<div class="card g-card-sty mr-4 mb-3" style="width: 12rem;">
<img v-bind:src="productResult[0].img" class="card-img-top" style="height:250px" alt="...">
<div class="card-body text-center" maxlength="5">
<p class="card-text">{{productResult[0].description}}</p>
<span><b>${{productResult[0].price}}</b></span>
</div>
</div>
<div class="card g-card-sty mr-4 mb-3" style="width: 12rem;">
<img v-bind:src="productResult[1].img" class="card-img-top" style="height:250px" alt="...">
<div class="card-body text-center">
<p class="card-text">{{productResult[1].description}}</p>
<span><b>${{productResult[1].price}}</b></span>
</div>
</div>
<div class="card g-card-sty mr-4 mb-3" style="width: 12rem;">
<img v-bind:src="productResult[2].img" class="card-img-top" style="height:250px" alt="...">
<div class="card-body text-center">
<p class="card-text">{{productResult[2].description}}</p>
<span><b>${{productResult[2].price}}</b></span>
</div>
</div>
</div>
<p>Mostrando {{productResult[0].numberFound}} de {{productResult[0].totalBookCategory}} artículo(s)</p>
</div>
</template>
<script>
export default {
data(){
return {
productResult: [
{
searchText: "Lorem ipsum",
numberFound: 3,
description: "Some quick example text to build on the card title and...",
price: 180,
totalBookCategory: 28,
img: 'https://images.cdn3.buscalibre.com/fit-in/360x360/7d/92/7d92cb1e49ff2d7756f192114e5c8901.jpg'
},
{
searchText: "Lorem ipsum",
numberFound: 3,
description: "2 Some quick example text to build on the card title and...",
price: 190,
totalBookCategory: 28,
img: 'https://m.media-amazon.com/images/I/51HdyT9COEL.jpg'
},
{
searchText: "Lorem ipsum",
numberFound: 3,
description: "3 Some quick example text to build on the card title and...",
price: 200,
totalBookCategory: 28,
img: 'https://upload.wikimedia.org/wikipedia/commons/8/8e/Lenin_book_1902.jpg'
}
]
}
}
}
</script>
<style scoped>
.g-card-sty {
-webkit-box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
-moz-box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
}
p {
text-overflow: ellipsis;
width: 100%;
white-space: nowrap;
overflow: hidden;
}
</style>
-46
View File
@@ -1,46 +0,0 @@
<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;
text-align: center;
}
@media screen and (max-width: 450px) {
.pTitulo {
font-size: 20px;
padding: 0px 3px;
}
.bgAzul {
width: 60%;
}
}
</style>
-11
View File
@@ -1,11 +0,0 @@
const config = {
//ngrok
//api: "https://f8d86328e778.ngrok.io"
//Local
//api: "http://localhost:3000"
//Pruebas
api: "https://venus.acatlan.unam.mx/portal"
};
module.exports = config;
-1
View File
@@ -4,7 +4,6 @@ import VueRouter from 'vue-router'
import Home from './view/Home.vue'
import PersonalData from './view/PersonalData.vue'
import Descrip from './view/Descrip.vue'
const routes = [
{
path: '/',
-25
View File
@@ -1,25 +0,0 @@
<template>
<div>
<Header />
<Description />
<Footer />
</div>
</template>
<script>
import Header from "./../components/Header.vue";
import Description from "./../components/Description.vue";
import Footer from "./../components/Footer.vue";
export default {
components: {
Header,
Description,
Footer
}
};
</script>
+6 -5
View File
@@ -1,9 +1,9 @@
<template>
<div>
<Header></Header>
<div class="container my-5">
<h1 class="text-center">Home</h1>
</div>
<SearchResultsPage></SearchResultsPage>
<Footer></Footer>
</div>
</template>
@@ -11,13 +11,14 @@
<script>
import Header from '../components/Header'
import SearchResultsPage from '../components/SearchResultsPage'
import Footer from '../components/Footer'
export default {
components: {
Header,
Footer,
SearchResultsPage,
Footer
}
}
</script>