18 Commits

Author SHA1 Message Date
casnet1 1687e3e671 arreglo de conflictos 2020-10-23 11:10:25 -05:00
danielGe 6c21a132f7 Merge pull request 'componente direcciones solo para reemplazar' (#6) from directionForm into master
Reviewed-on: #6
2020-10-23 06:26:41 +00:00
danielGe 769c9b8a2d Merge pull request 'cart' (#7) from cart into master
Reviewed-on: #7
2020-10-23 06:26:15 +00:00
danielGe a614aaccd8 Merge pull request 'mainMenu' (#8) from mainMenu into master
Reviewed-on: #8
2020-10-23 06:24:40 +00:00
kikin bcc7617e79 navbar component 2020-10-22 21:00:51 -05:00
kikin 667d6e34a4 navbar component 2020-10-22 20:58:26 -05:00
kikin 60f40876f7 cart comp 2020-10-21 17:59:29 -05:00
kikin 189b78ebea cart comp 2020-10-21 17:53:22 -05:00
kikin 9f2f2ef7b0 confi 2020-10-21 16:17:18 -05:00
eithan 387f0ce6da componente direcciones solo para reemplazar 2020-10-08 21:23:39 -05:00
eithan c72226aaa4 vistas y rutas de proceso de pago 2020-10-08 16:42:14 -05:00
danielGe d4e15ddb55 Merge pull request 'WIP payment falta llamar a los componentes' (#3) from payment into master
Reviewed-on: #3
2020-10-04 22:04:30 +00:00
danielGe aaca0ea583 Merge pull request 'WIP Creacion de la seccion de datos personales' (#2) from dataSection into master
Reviewed-on: #2
2020-10-04 21:53:11 +00:00
danielGe 5eff4a916e actualizacion de cambios 2020-10-04 16:51:46 -05:00
danielGe 1552b7e04f separacion del carrito en componentes 2020-10-04 16:23:44 -05:00
danielGe 77aead338f Merge pull request 'WIP Integracion del componente Car hecho por Enrrique' (#1) from cart into master
Reviewed-on: #1
2020-10-04 21:06:11 +00:00
casnet1 39a65ffc0c terminos y opcion de pago 2020-09-25 14:44:17 -05:00
KIKIN 1cc6644c95 cart page, ready 2020-09-17 19:06:39 -05:00
14 changed files with 774 additions and 49 deletions
+21 -30
View File
@@ -1392,16 +1392,6 @@
"integrity": "sha512-Jus9s4CDbqwocc5pOAnh8ShfrnMcPHuJYzVcSUU7lrh8Ni5HuIqX3oilL86p3dlTrk0LzHRCgA/GQ7uNCw6l2Q==",
"dev": true
},
"@types/mini-css-extract-plugin": {
"version": "0.9.1",
"resolved": "https://registry.npmjs.org/@types/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.1.tgz",
"integrity": "sha512-+mN04Oszdz9tGjUP/c1ReVwJXxSniLd7lF++sv+8dkABxVNthg6uccei+4ssKxRHGoMmPxdn7uBdJWONSJGTGQ==",
"dev": true,
"optional": true,
"requires": {
"@types/webpack": "*"
}
},
"@types/minimatch": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
@@ -10978,35 +10968,31 @@
}
},
"vue-loader-v16": {
"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==",
"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==",
"dev": true,
"optional": true,
"requires": {
"@types/mini-css-extract-plugin": "^0.9.1",
"chalk": "^3.0.0",
"chalk": "^4.1.0",
"hash-sum": "^2.0.0",
"loader-utils": "^1.2.3",
"merge-source-map": "^1.1.0",
"source-map": "^0.6.1"
"loader-utils": "^2.0.0"
},
"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==",
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true,
"optional": true,
"requires": {
"@types/color-name": "^1.1.1",
"color-convert": "^2.0.1"
}
},
"chalk": {
"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==",
"dev": true,
"optional": true,
"requires": {
@@ -11038,12 +11024,17 @@
"dev": true,
"optional": true
},
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"dev": true,
"optional": true
"optional": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
},
"supports-color": {
"version": "7.2.0",
+132
View File
@@ -0,0 +1,132 @@
<template>
<div class="my-5">
<div class="container d-flex flex-wrap justify-content-between">
<div class="cont-resum-shop py-2 mb-4">
<h2 class="ml-3">Carrito</h2>
<hr>
<div class="d-flex justify-content-between mx-4 my-4">
<div class="d-flex">
<!-- v-bind:src="'/media/avatars/' + joke.avatar" -->
<img v-bind:src="infoResume[0].img" alt="Logo" style="height: 150px">
<p class="mx-4">
{{productInfo[0].descripcion}}<br><span class="price-style"><b>${{productInfo[0].precio}}</b></span>
</p>
</div>
<div class="d-flex flex-wrap flex-column align-items-center">
<div>
<input type="number" class="inp-number p-1 d-inline-block" name="" id="" v-bind:value="infoResume[0].cantidad">
</div>
<span class="my-4"><b>${{infoResume[0].cantidad * productInfo[0].precio}}</b></span>
<div>
<a href="#" class="text-dark">
<font-awesome-icon icon="trash" class=""/>
</a>
</div>
</div>
</div>
<div class="d-flex justify-content-between mx-4 my-4">
<div class="d-flex">
<!-- v-bind:src="'/media/avatars/' + joke.avatar" -->
<img v-bind:src="infoResume[1].img" alt="Logo" style="height: 150px">
<p class="mx-4">
{{productInfo[1].descripcion}}<br><span class="price-style"><b>${{productInfo[1].precio}}</b></span>
</p>
</div>
<div class="d-flex flex-wrap flex-column align-items-center">
<div>
<input type="number" class="inp-number p-1 d-inline-block" name="" id="" v-bind:value="infoResume[1].cantidad">
</div>
<span class="my-4"><b>${{infoResume[1].cantidad * productInfo[1].precio}}</b></span>
<div>
<a href="#" class="text-dark">
<font-awesome-icon icon="trash" class=""/>
</a>
</div>
</div>
</div>
</div>
<div class="g-sec bg-light py-4 px-4 d-flex flex-column align-self-start align-items-center" style="">
<div class="d-flex justify-content-between">
<p class="mr-5">{{infoResume[0].cantidad}} Artículos<br>Envío</p>
<p>${{infoResume[0].cantidad * productInfo[0].precio}}<br>{{infoResume[0].envioStatus}}</p>
</div>
<hr style="width:100%">
<div class="d-flex justify-content-between">
<p class="mr-5">Total(IVA incluido)<br>${{infoResume[0].cantidad * productInfo[0].precio}}</p>
</div>
<hr style="width:100%">
<button class="btn btn-primary mx-auto"><b>IR A LA CAJA</b></button>
</div>
</div>
<div class="container mt-3">
<div class="d-inline-block">
<a href="#">
<p>
Continuar la compra
</p>
</a>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
return {
productInfo: [
{
id: 1,
descripcion: 'Invitacion al psicoanálisis y lazos con la política, Lorem ipsum',
precio: 10
},
{
id: 2,
descripcion: 'Invitacion al derrocamiento de la burguesía, camarada.',
precio: 2
}
],
infoResume:[
{
cantidad: 4,
envioStatus: 'pendiente',
img: 'https://images.cdn3.buscalibre.com/fit-in/360x360/7d/92/7d92cb1e49ff2d7756f192114e5c8901.jpg',
},
{
cantidad: 17,
envioStatus: 'pendiente',
img: 'https://images-na.ssl-images-amazon.com/images/I/51vHCno0a4L._SY291_BO1,204,203,200_QL40_ML2_.jpg',
}
],
}
}
}
</script>
<style>
.cont-resum-shop {
/* background-color: skyblue; */
-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);
/* border-radius: 5px; */
/* font-size: 15px; */
}
.inp-number {
width: 55px;
border-radius: 5px;
border: 0.3px solid lightgray;
}
.price-style {
color: #6C59FE;
}
.g-sec {
-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);
}
</style>
+235
View File
@@ -0,0 +1,235 @@
<template>
<div>
<div>
<h1>Direcciones</h1>
</div>
<div>
<form class="mt-4" role="form" data-toggle="validator" >
<div class="my-3">
<div class="row tipoComprobante">
<div class="form-check col-4 ">
<label class="form-check-label" >
Tipo de Comprobante:
</label>
</div>
<div class="form-check col-4">
<input class="form-check-input" type="radio" id="exampleRadios1" v-model="select" value="ticket">
<label class="form-check-label" for="exampleRadios1">
Ticket
</label>
</div>
<div class="form-check col-4">
<input class="form-check-input" type="radio" id="exampleRadios2" v-model="select" value="factura">
<label class="form-check-label" for="exampleRadios2">
Factura
</label>
</div>
</div>
<div class=" datosFactura" v-if="select == 'factura'">
<h3 class="my-5">Direccion de Facturacion</h3>
<div class="form-group">
<label for="InputNombre1">RFC</label>
<input type="text" class="form-control" id="InputRFC" v-model="Facturacion.RFC">
</div>
<div class="form-group">
<label for="InputApellido1">Nombres</label>
<input type="text" class="form-control" id="InputNombres" v-model="Facturacion.nombres">
</div>
<div class="form-group">
<label for="InputCorreo1">Apellidos</label>
<input type="email" class="form-control" id="InputApellidos" v-model="Facturacion.apellidos">
</div>
<div class="form-group">
<label for="InputNombre1">Empresa</label>
<input type="text" class="form-control" id="InputEmpresa" v-model="Facturacion.empresa">
</div>
<div class="form-group">
<label for="InputApellido1">calle</label>
<input type="text" class="form-control" id="InputCalle" v-model="Facturacion.calle">
</div>
<div class="form-group">
<label for="InputCorreo1">Numero Exterior</label>
<input type="email" class="form-control" id="InputExterior" v-model="Facturacion.exterior">
</div>
<div class="form-group">
<label for="InputNombre1">Numero Interior</label>
<input type="text" class="form-control" id="InputInterior" v-model="Facturacion.interior">
</div>
<div class="form-group">
<label for="InputApellido1">Colonia</label>
<input type="text" class="form-control" id="InputColonia" v-model="Facturacion.colonia">
</div>
<div class="form-group">
<label for="InputCorreo1">Provincia o estado</label>
<input type="email" class="form-control" id="InputEstado" v-model="Facturacion.estado">
</div>
<div class="form-group">
<label for="InputNombre1">Pais</label>
<input type="text" class="form-control" id="InputPais" v-model="Facturacion.pais">
</div>
<div class="form-group">
<label for="InputApellido1">Telefono</label>
<input type="text" class="form-control" id="InputTelefono" v-model="Facturacion.telefono">
</div>
<div class="form-group">
<label for="InputCorreo1">Correo</label>
<input type="email" class="form-control" id="InputCorreo" v-model="Facturacion.correo">
</div>
</div>
<div class="row direccionIgual" v-if="select == 'factura'">
<div class="form-check col-8 ">
<label class="form-check-label" >
¿La direccion de facturacion es la misma a la de envio?
</label>
</div>
<div class="form-check col-2">
<input class="form-check-input" type="radio" id="exampleRadios3" v-model="sameDirection" value="true">
<label class="form-check-label" for="exampleRadios3">
Si
</label>
</div>
<div class="form-check col-2">
<input class="form-check-input" type="radio" id="exampleRadios4" v-model="sameDirection" value="false">
<label class="form-check-label" for="exampleRadios4">
No
</label>
</div>
</div>
<div class=" datosEnvio" v-if="select == 'ticket' || (sameDirection == 'false' && select == 'factura')">
<h3 class="my-5">Direccion de Envio</h3>
<div class="form-group">
<label for="InputApellido1">Nombres</label>
<input type="text" class="form-control" id="InputNombres2" v-model="Envio.nombres">
</div>
<div class="form-group">
<label for="InputCorreo1">Apellidos</label>
<input type="email" class="form-control" id="InputApellidos2" v-model="Envio.apellidos">
</div>
<div class="form-group">
<label for="InputCorreo1">Correo</label>
<input type="email" class="form-control" id="InputCorreo2" v-model="Envio.correo">
</div>
<div class="form-group">
<label for="InputApellido1">calle</label>
<input type="text" class="form-control" id="InputCalle2" v-model="Envio.calle">
</div>
<div class="form-group">
<label for="InputCorreo1">Numero Exterior</label>
<input type="email" class="form-control" id="InputExterior2" v-model="Envio.exterior">
</div>
<div class="form-group">
<label for="InputNombre1">Numero Interior</label>
<input type="text" class="form-control" id="InputInterior2" v-model="Envio.interior">
</div>
<div class="form-group">
<label for="InputApellido1">Colonia</label>
<input type="text" class="form-control" id="InputColonia2" v-model="Envio.colonia">
</div>
<div class="form-group">
<label for="InputApellido1">Codigo Postal</label>
<input type="text" class="form-control" id="InputPostal" v-model="Envio.postal">
</div>
<div class="form-group">
<label for="InputCorreo1">Provincia o estado</label>
<input type="email" class="form-control" id="InputEstado2" v-model="Envio.estado">
</div>
<div class="form-group">
<label for="InputNombre1">Pais</label>
<input type="text" class="form-control" id="InputPais2" v-model="Envio.pais">
</div>
<div class="form-group">
<label for="InputApellido1">Telefono</label>
<input type="text" class="form-control" id="InputTelefono2" v-model="Envio.telefono">
</div>
</div>
</div>
</form>
</div>
</div>
</template>
<script>
export default {
data(){
return{
sameDirection:'',
select:'',
Facturacion:
{
RFC:'',
nombres:'',
apellidos:'',
empresa:'',
calle:'',
exterior:'',
interior:'',
colonia:'',
estado:'',
pais:'',
telefono:'',
correo:''
},
Envio:{
RFC:'',
nombres:'',
apellidos:'',
postal:'',
calle:'',
exterior:'',
interior:'',
colonia:'',
estado:'',
pais:'',
telefono:'',
correo:''
}
}
}
}
</script>
+1 -15
View File
@@ -27,18 +27,7 @@
</div>
</header>
<div class="header-f" >
<div class="container d-flex py-2 align-items-center justify-content-between">
<div>
<input class="form-control mr-sm-2" type="search" placeholder="Buscar" aria-label="Search">
</div>
<div>
<a href="#" class="cart-icon-custom-properties text-decoration-none text-white">
<font-awesome-icon icon="shopping-cart" class="text-white" /><sup> ( )</sup>
</a>
</div>
</div>
</div>
</div>
</template>
@@ -63,9 +52,6 @@ export default {
background: #1b3d70;
}
.header-f {
background-color: #bb8800;
}
.cart-icon-custom-properties {
font-size: 20px;
}
+110
View File
@@ -0,0 +1,110 @@
<template>
<div>
<div class="header-f" >
<div class="container d-flex py-2 align-items-center justify-content-between">
<div class="d-flex">
<div>
<b-button v-b-toggle.sidebar-backdrop class="mr-3 menu-toggle-sty"><font-awesome-icon icon="bars"/></b-button>
<b-sidebar
id="sidebar-backdrop"
title="Menú"
:backdrop-variant="variant"
backdrop
shadow
>
<div class="px-3 mt-3 py-2 d-flex align-items-center profi-main-text-sty">
<font-awesome-icon icon="user" class="mr-2" />
<a href="#" class="text-decoration-none">
<h5 class="my-auto">Iniciar sesión</h5>
</a>
</div>
<h6 class="px-3 pt-4 mb-4">MAIN LOREM IPSUM</h6>
<ul class="px-3">
<li v-for="item in items" :key="item.mensaje">
<a href="#"> {{ item.mensaje }} </a>
</li>
</ul>
<h6 class="px-3 my-4">CONFIGURACIÓN</h6>
<ul class="px-3">
<li v-for="item in configuracion" :key="item.mensaje">
<a href="#"> {{ item.mensaje }} </a>
</li>
</ul>
</b-sidebar>
</div>
<input class="form-control mr-sm-2" type="search" placeholder="Buscar" aria-label="Search">
</div>
<div>
<a href="#" class="cart-icon-custom-properties text-decoration-none text-white">
<font-awesome-icon icon="shopping-cart" class="text-white" /><sup> ( )</sup>
</a>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
items: [
{ mensaje: 'Investigación Aplicada y Multidisciplinaria' },
{ mensaje: 'Ciencias Socioeconómicas' }
],
configuracion: [
{ mensaje: 'Mi cuenta' },
{ mensaje: 'Ayuda' },
{ mensaje: 'Salir' },
]
}
},
methods: {
}
}
</script>
<style scoped>
.header-f {
background-color: #bb8800;
}
.cart-icon-custom-properties {
font-size: 20px;
}
.menu-toggle-sty {
background-color: transparent!important;
border: 1px solid white!important;
color: white!important;
}
.menu-toggle-sty:hover {
border: 1px solid rgba(255, 255, 255, 0.7)!important;
color: rgba(255, 255, 255, 0.7)!important;
}
.profi-main-text-sty, .profi-main-text-sty a {
color: black!important;
}
.profi-main-text-sty a:hover{
color:gray!important;
transition: 0.2s;
}
ul li {
list-style: none;
margin: 10px auto;
}
ul li a {
text-decoration: none;
color: black!important;
}
ul li a:hover {
color: rgba(0, 0, 0, 0.6)!important;
transition: 0.2s;
}
</style>
+62
View File
@@ -0,0 +1,62 @@
<template>
<div>
<h3 class="my-3">Pago</h3>
<form class="form-check">
<div class="form-check">
<input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="LineaUnam" v-model="metodo">
<label class="form-check-label" for="exampleRadios1">
Pago en linea UNAM
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="Ficha" v-model="metodo">
<label class="form-check-label" for="exampleRadios2">
Ficha de Deposito
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" v-model="terminos" id="defaultCheck1">
<label class="form-check-label" for="defaultCheck1">
Estoy deacuerdo con los Terminos de servicio y los acepto sin reservas
</label>
</div>
<button type="button" class="btn btn-primary ml-4">Pedido con obligacion de pago</button>
<div v-if="(metodo) != '' && (terminos) == true " class="d-flex justify-content-right">
<button type="submit" @click="NextStep()" class="btn btn-success">continuar</button>
</div>
</form>
</div>
</template>
<script>
export default {
data(){
return{
metodo:'',
terminos:false
}
}
}
</script>
<style>
.form-check div{
margin: 1rem 0;
}
</style>
+3 -1
View File
@@ -11,7 +11,8 @@ import {
faShoppingCart,
faTrash,
faMapMarkerAlt,
faPhoneAlt
faPhoneAlt,
faBars
} from '@fortawesome/free-solid-svg-icons'
@@ -27,4 +28,5 @@ library.add(faShoppingCart)
library.add(faTrash)
library.add(faMapMarkerAlt)
library.add(faPhoneAlt)
library.add(faBars)
+24
View File
@@ -3,6 +3,10 @@ import VueRouter from 'vue-router'
import Home from './view/Home.vue'
import PersonalData from './view/PersonalData.vue'
import Cart from './view/Cart.vue'
import Pago from './view/Pago.vue'
import Envio from './view/Envio.vue'
import Direccion from './view/Direccion'
const routes = [
{
@@ -19,6 +23,26 @@ const routes = [
path: '/datosPersonales',
component: PersonalData,
name: 'personalData'
},
{
path: '/cart',
component: Cart,
name: 'cart'
},
{
path: '/pago',
component: Pago,
name: 'pago'
},
{
path: '/envio',
component: Envio,
name: 'envio'
},
{
path: '/direcciones',
component: Direccion,
name: 'direcciones'
}
]
+61
View File
@@ -0,0 +1,61 @@
<template>
<div>
<Header></Header>
<div class="my-5">
<div class="row">
<section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
<ShoppingNav currentStep=2></ShoppingNav>
<Directions></Directions>
</section>
<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 ">
<!-- <h3 class="text-center">status</h3> -->
<ShoppingStatus></ShoppingStatus>
</aside>
</div>
</div>
<Footer></Footer>
</div>
</template>
<script>
import Header from '../components/Header'
import Footer from '../components/Footer'
import ShoppingNav from '../components/ShoppingNav'
import ShoppingStatus from '../components/ShoppingStatus'
import Directions from '../components/Directions'
export default {
components: {
Header,
Footer,
ShoppingNav,
ShoppingStatus,
Directions
}
}
</script>
<style scoped>
#CompraStatus{
padding: 0;
}
@media screen and (max-width:760px ) {
#CompraStatus{
margin-top: 2rem;
}
}
</style>
+60
View File
@@ -0,0 +1,60 @@
<template>
<div>
<Header></Header>
<div class="my-5">
<div class="row">
<section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
<ShoppingNav currentStep=2></ShoppingNav>
<ShippingSection></ShippingSection>
</section>
<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 ">
<!-- <h3 class="text-center">status</h3> -->
<ShoppingStatus></ShoppingStatus>
</aside>
</div>
</div>
<Footer></Footer>
</div>
</template>
<script>
import Header from '../components/Header'
import Footer from '../components/Footer'
import ShoppingNav from '../components/ShoppingNav'
import ShoppingStatus from '../components/ShoppingStatus'
import ShippingSection from '../components/ShippingSection'
export default {
components: {
Header,
Footer,
ShoppingNav,
ShoppingStatus,
ShippingSection
}
}
</script>
<style scoped>
#CompraStatus{
padding: 0;
}
@media screen and (max-width:760px ) {
#CompraStatus{
margin-top: 2rem;
}
}
</style>
+4 -3
View File
@@ -9,14 +9,15 @@
</template>
<script>
import Header from '../components/Header'
import Footer from '../components/Footer'
export default {
components: {
Header,
Footer
Footer,
}
}
</script>
+61
View File
@@ -0,0 +1,61 @@
<template>
<div>
<Header></Header>
<div class="my-5">
<div class="row">
<section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
<ShoppingNav currentStep=2></ShoppingNav>
<Payment></Payment>
</section>
<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 ">
<!-- <h3 class="text-center">status</h3> -->
<ShoppingStatus></ShoppingStatus>
</aside>
</div>
</div>
<Footer></Footer>
</div>
</template>
<script>
import Header from '../components/Header'
import Footer from '../components/Footer'
import ShoppingNav from '../components/ShoppingNav'
import ShoppingStatus from '../components/ShoppingStatus'
import Payment from '../components/Payment'
export default {
components: {
Header,
Footer,
ShoppingNav,
ShoppingStatus,
Payment
}
}
</script>
<style scoped>
#CompraStatus{
padding: 0;
}
@media screen and (max-width:760px ) {
#CompraStatus{
margin-top: 2rem;
}
}
</style>
View File