fernando/l-assiette
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Requerimientos

Browse Source
This commit is contained in:
Fernando 2018-10-14 13:05:06 -05:00
parent 8681fd255b
commit a24e3f2600
11 changed files with 12766 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12496
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

12
src/components/headerMin.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<header id="header"> <header>
<div class="contenedor"> <div>
<div id="tituloP" class="center"> <div id="tituloP" class="center">
<router-link to="/"><h1 class="titulo--link">L'Assiette</h1></router-link> <router-link to="/"><h1 class="titulo--link">L'Assiette</h1></router-link>
<div id="tituloP--descripcion"> <div id="tituloP--descripcion">
@ -9,12 +9,12 @@
</div> </div>
</div> </div>
<div id="contenedorInicio-Registro" class="center mySeccion" data-collapsed="false"> <div id="contenedorInicio-Registro" class="center mySeccion" data-collapsed="false">
<a href="" id="botonRegistro" class="boton"> <router-link to="/iniciar-sesion/" id="botonRegistro" class="boton">
Registrarse Registrarse
</a> </router-link>
<a href="" id="botonInicioSesion" class="boton"> <router-link to="/iniciar-sesion/" id="botonInicioSesion" class="boton">
Iniciar Sesion Iniciar Sesion
</a> </router-link>
<br/> <br/>
<br/> <br/>
<br/> <br/>

2
src/components/headerMini.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<header id="header"> <header id="header">
<div class="contenedor"> <div>
<div id="tituloP" class="center tituloP--mini"> <div id="tituloP" class="center tituloP--mini">
<router-link to="/" class="titulo--link">L'Assiette</router-link> <router-link to="/" class="titulo--link">L'Assiette</router-link>
</div> </div>

21
src/components/mi-footer.vue
View File

@ -1,11 +1,20 @@
<template> <template>
<footer id="footer"> <footer id="footer">
<div class="container mi-footer transparent"> <div class="container row mi-footer transparent">
Cocina Francesa.<br/> <div class="col l6 m6">
Una Single Page Application para el curso de IHC, UNSA, 2018.<br/> Cocina Francesa.<br/>
Con lo último en tecnología: Vue.js, BEM, Sass, TypeScript, y nodejs.<br> Una Single Page Application para el curso de IHC, UNSA, 2018.<br/>
<br/> Con lo último en tecnología: Vue.js, BEM, Sass, TypeScript, y nodejs.<br>
Desarrollado por Fernando Araoz, 20173373. <br/>
Desarrollado por Fernando Araoz, 20173373.
</div>
<div class="col l6 m6">
<div class="hide-on-med-and-up"><hr></div>
Contacto: <br>
<br>
<i class="material-icons white-text">local_phone</i>&nbsp;&nbsp;&nbsp;999 - 888 - 777 <br>
<i class="material-icons white-text">email</i>&nbsp;&nbsp;&nbsp;soporte@l-assiete.com
</div>
</div> </div>
</footer> </footer>
</template> </template>

4
src/components/navBar.vue
View File

@ -3,7 +3,7 @@
<ul class="linksNavBar"> <ul class="linksNavBar">
<li><router-link to="/">Inicio</router-link></li> <li><router-link to="/">Inicio</router-link></li>
<li><router-link to="/platos/">Platos</router-link></li> <li><router-link to="/platos/">Platos</router-link></li>
<li><router-link to="/usuarios/mi-cuenta">Mi cuenta</router-link></li> <li><router-link to="/mi-cuenta/">Mi cuenta</router-link></li>
<li><router-link to="/carrito/">Carrito</router-link></li> <li><router-link to="/carrito/">Carrito</router-link></li>
</ul> </ul>
</nav> </nav>
@ -11,7 +11,7 @@
<script> <script>
export default { export default {
name: 'NavBar' name: 'HeaderMini'
} }
</script> </script>

11
src/main.js
View File

@ -9,7 +9,16 @@ require('@/sass/base.sass');
require('@/material-icons/material-icons.css'); require('@/material-icons/material-icons.css');
require('@/materialize/js/materialize.min.js'); require('@/materialize/js/materialize.min.js');
(() => { window.carritoUsuario = [] })(); (() => {
window.carritoUsuario = [];
window.usuarioActual = [
{
nombre: 'Usuario',
email: 'ejemplo@l-assiete.com',
historial: {}
}
];
})();
new Vue({ new Vue({
data: { data: {

56
src/router.js
View File

@ -2,29 +2,39 @@ import Vue from 'vue'
import Router from 'vue-router' import Router from 'vue-router'
import Home from './views/Home.vue' import Home from './views/Home.vue'
Vue.use(Router) Vue.use(Router);
export default new Router({ export default new Router({
mode: 'history', mode: 'history',
base: process.env.BASE_URL, base: process.env.BASE_URL,
routes: [ routes: [
{ {
path: '/', path: '/',
name: 'home', name: 'home',
component: Home component: Home
}, },
{ {
path: '/platos/', path: '/platos/',
name: 'Platos', name: 'Platos',
// route level code-splitting // route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route // this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited. // which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/Platos.vue') component: () => import(/* webpackChunkName: "about" */ './views/Platos.vue')
}, },
{ {
path: '/carrito/', path: '/carrito/',
name: 'Carrito', name: 'Carrito',
component: () => import('./views/carrito.vue') component: () => import('./views/carrito')
} },
] {
path: '/iniciar-sesion/',
name: 'IniciarSesion',
component: () => import('./views/Login-Registro')
},
{
path: '/mi-cuenta/',
name: 'MiCuenta',
component: () => import('./views/MiCuenta')
}
]
}) })

8
src/sass/base.sass
View File

@ -36,11 +36,13 @@ footer
padding: 40px padding: 40px
.container .container
background-color: white
margin-top: 10px margin-top: 10px
margin-bottom: 10px margin-bottom: 10px
padding: 10px padding: 10px
.fondoBlanco
background-color: white
#tituloP #tituloP
padding: 30px padding: 30px
color: white color: white
@ -114,7 +116,7 @@ footer
.descripcionComida .descripcionComida
padding: 0 30px padding: 0 30px
text-align: center text-align: center
font-size: x-large font-size: large
.inicio_registro .inicio_registro
color: white color: white
@ -391,5 +393,5 @@ input
color: $colorPrincipalOscuro color: $colorPrincipalOscuro
.img-inicio .img-inicio
height: 130px height: 90px
margin: 0 20px margin: 0 20px

137
src/views/Login-Registro.vue Normal file
View File

@ -0,0 +1,137 @@
<template>
<div>
<header>
<div>
<div id="tituloP" class="center">
<router-link to="/"><h1 class="titulo--link">L'Assiette</h1></router-link>
<div id="tituloP--descripcion">
Descubre un nuevo sabor
</div>
</div>
</div>
<div class="container">
<div class="row login">
<div class="col l6 m6 s12 login--descripcion center-align">
Inicia sesión <br>
<br>
<button class="login--boton login--botonGoogle hoverable">
<img src="https://image.flaticon.com/icons/svg/281/281764.svg" width="20" height="20"
alt="Google">
&nbsp;&nbsp;
Google
</button><br>
<br>
<button class="login--boton login--botonFacebook hoverable">
<img src="https://image.flaticon.com/icons/svg/145/145802.svg" width="20" height="20"
alt="Facebook">
&nbsp;&nbsp;
Facebook
</button><br>
<br>
O con tu email: <br>
<br>
<div class="center">
<form class="login--form">
<label class="login--form--label">Email:</label>
<input class="login--form--input" type="email" placeholder="Tu email" required><br>
<br>
<label for="" class="login--form--label">Contraseña</label>
<input class="login--form--input" type="password" placeholder="Contraseña" required><br>
<br>
<router-link to="/platos/" class="btn waves-effect waves-light" type="submit" name="action">Inicia Sesión
</router-link>
</form>
</div>
<br>
</div>
<div class="col l6 m6 s12 login--registro center-align" id="bordeIzq">
Regístrate <br>
<br>
<button class="login--boton login--botonGoogle hoverable">
<img src="https://image.flaticon.com/icons/svg/281/281764.svg" width="20" height="20"
alt="Google">
&nbsp;&nbsp;
Google
</button><br>
<br>
<button class="login--boton login--botonFacebook hoverable">
<img src="https://image.flaticon.com/icons/svg/145/145802.svg" width="20" height="20"
alt="Facebook">
&nbsp;&nbsp;
Facebook
</button><br>
<br>
O con tu email: <br>
<br>
<div class="center">
<form action="" class="login--form">
<label for="" class="login--form--label">Nombre</label>
<input class="login--form--input" type="text" placeholder="Tu nombre" required><br>
<br>
<label class="login--form--label">Email:</label>
<input class="login--form--input" type="email" placeholder="Tu email" required><br>
<br>
<label for="" class="login--form--label">Contraseña</label>
<input class="login--form--input" type="password" placeholder="Contraseña" required><br>
<br>
<router-link to="/platos/" class="btn waves-effect waves-light" type="submit" name="action">Regístrame
</router-link>
</form>
</div>
</div>
</div>
<br>
<img src="https://publicholidays.fr/wp-content/uploads/2012/12/France_1920_800_homepage.jpg"
alt="Imagen-paris" class="responsive-image" style="opacity: 0.8;"><br>
</div>
<br>
</header>
</div>
</template>
<script>
import MiFooter from '@/components/mi-footer.vue'
export default {
name: 'IniciarSesion',
components: {
'mi-footer': MiFooter
}
}
</script>
<style scoped lang="sass">
#bordeIzq
border-left: solid 1px white
.login
color: white
.login--boton
border: none
padding: 10px 50px
cursor: pointer
border-radius: 3px
.login--botonGoogle
background-color: white
.login--botonFacebook
background-color: #3b5998
color: white
.login--form
width: 80%
display: inline-block
.login--form--input
color: white
font-size: large !important
text-shadow: 1px 1px 2px black
.login--form--label
color: white
</style>

59
src/views/MiCuenta.vue Normal file
View File

@ -0,0 +1,59 @@
<template>
<div>
<header-mini></header-mini>
<nav-bar></nav-bar>
<section>
<div class="container fondoBlanco">
<h2 class="tienda--titulo">Mi cuenta</h2>
<br>
<div class="row">
<div class="col l6 m6">
{{ usuario[0].nombre }}<br>
{{ usuario[0].email }}<br>
</div>
<div class="col l6 m6">
Historial de Compras <br>
<br>
<template v-for="(plato, key) in usuario[0].historial">
</template>
</div>
</div>
</div>
</section>
<mi-footer></mi-footer>
</div>
</template>
<script>
import HeaderMini from '@/components/headerMini'
import NavBar from '@/components/navBar'
import MiFooter from '@/components/mi-footer'
export default {
name: "MiCuenta",
components: {
'header-mini': HeaderMini,
'nav-bar': NavBar,
'mi-footer': MiFooter
},
data: function () {
return {
usuario: window.usuarioActual
}
},
computed: {
historialVacio: function () {
for (i in this.usuario[0].historial) {
return false
}
return true
}
}
}
</script>
<style scoped>
</style>

5
src/views/Platos.vue
View File

@ -4,12 +4,9 @@
<nav-bar></nav-bar> <nav-bar></nav-bar>
<section class="tienda container mySeccion" data-collapsed="false"> <section class="tienda container mySeccion fondoBlanco" data-collapsed="false">
<h2 class="tienda--titulo">Platos</h2> <h2 class="tienda--titulo">Platos</h2>
<br> <br>
Ver mi cuenta | Ver mi carrito
<br>
<br>
<template v-for="(item,key) in platos"> <template v-for="(item,key) in platos">
<div v-bind:key="key" class="row tienda--tarjeta hoverable"> <div v-bind:key="key" class="row tienda--tarjeta hoverable">
<div class="col l4"> <div class="col l4">