CIDWA/pcpuma-front
11
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

login

Browse Source
This commit is contained in:
arturo
2018-11-05 21:40:16 -06:00
parent df4613562a
commit 473d45f66c
14 changed files with 235 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+16 -6
View File
@@ -1795,6 +1795,15 @@
"integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==",
"dev": true
},
"axios": {
"version": "0.18.0",
"resolved": "http://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
"integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=",
"requires": {
"follow-redirects": "^1.3.0",
"is-buffer": "^1.1.5"
}
},
"babel-code-frame": {
"version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@@ -5012,7 +5021,6 @@
"version": "1.5.9",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.9.tgz",
"integrity": "sha512-Bh65EZI/RU8nx0wbYF9shkFZlqLP+6WT/5FnA3cE/djNSuKNHJEinGGZgu/cQEkeeb2GdFOgenAmn8qaqYke2w==",
"dev": true,
"requires": {
"debug": "=3.1.0"
},
@@ -5021,7 +5029,6 @@
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"dev": true,
"requires": {
"ms": "2.0.0"
}
@@ -5029,8 +5036,7 @@
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
"dev": true
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
}
}
},
@@ -6589,8 +6595,7 @@
"is-buffer": {
"version": "1.1.6",
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
"integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
"dev": true
"integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
},
"is-builtin-module": {
"version": "1.0.0",
@@ -14734,6 +14739,11 @@
"vue-style-loader": "^4.1.0"
}
},
"vue-router": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.0.1.tgz",
"integrity": "sha512-vLLoY452L+JBpALMP5UHum9+7nzR9PeIBCghU9ZtJ1eWm6ieUI8Zb/DI3MYxH32bxkjzYV1LRjNv4qr8d+uX/w=="
},
"vue-style-loader": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",
package.json
+3 -1
View File
@@ -12,10 +12,12 @@
"@fortawesome/free-brands-svg-icons": "^5.5.0",
"@fortawesome/free-solid-svg-icons": "^5.5.0",
"@fortawesome/vue-fontawesome": "^0.1.2",
"axios": "^0.18.0",
"bulma": "^0.7.2",
"i": "^0.3.6",
"npm": "^6.4.1",
"vue": "^2.5.17"
"vue": "^2.5.17",
"vue-router": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.1.1",
src/App.vue
+2 -8
View File
@@ -1,17 +1,11 @@
<template lang="pug">
#app
um-header
um-inicio
um-footer
router-view
</template>
<script>
import UmFooter from './layout/Footer.vue'
import UmHeader from './layout/Header.vue'
import UmInicio from './layout/Inicio.vue'
export default {
name: 'app',
components: { UmFooter, UmHeader, UmInicio }
name: 'app'
}
</script>
src/assets/unam.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 324 KiB

src/components/general/Notificacion.vue
+28
View File
@@ -0,0 +1,28 @@
<template lang="pug">
div.notification(class="is-danger" v-if="this.status")
button.delete(v-on:click="change()")
span {{ msj }}
</template>
<script>
export default {
props: {
msj: String
},
methods: {
change: function () {
this.status = false
}
},
watch: {
msj: function () {
this.status = true
}
},
data () {
return {
status: true
}
}
}
</script>
src/components/inicio/Equipo.vue
+3 -4
View File
@@ -1,7 +1,6 @@
<template lang="html">
<section>
equipo
</section>
<template lang="pug">
section
span resumen
</template>
<script>
src/components/inicio/Resumen.vue
+18 -24
View File
@@ -1,27 +1,21 @@
<template lang="html">
<div class="tabs is-centered">
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><font-awesome-icon icon="laptop" /></span>
<span>Laptop</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><font-awesome-icon icon="tablet-alt" /></span>
Tablet
</a>
</li>
<li>
<a>
<span class="icon is-small"><font-awesome-icon icon="laptop" /></span>
Chromebook
</a>
</li>
</ul>
</div>
<template lang="pug">
div.tabs.is-centered
ul
li
a
span.icon.is-small
font-awesome-icon(icon="laptop")
span Laptop
li
a
span.icon.is-small
font-awesome-icon(icon="tablet-alt")
span Tablet
li
a
span.icon.is-small
font-awesome-icon(icon="laptop")
span Chromebook
</template>
<script>
src/layout/Equipo.vue
+42
View File
@@ -0,0 +1,42 @@
<template lang="pug">
div#equipo
table.table
thead
tr
th id
th serial
tbody
tr
td 1
td 1231241322
tr
td 1
td {{ equipo }}
</template>
<script>
const axios = require('axios')
export default {
name: 'equipo',
data () {
return {
msg: 'hola'
}
},
computed: {
equipo: function () {
axios.get('http://39a65af6.ngrok.io/equipo')
.then(function (response) {
console.log(response)
})
.catch(function (error) {
console.log(error)
})
return 'hola'
}
}
}
</script>
<style lang="css">
</style>
src/layout/Footer.vue
+4 -8
View File
@@ -1,9 +1,5 @@
<template lang="html">
<footer class="footer">
<div class="content has-text-centered">
<p>
<strong class="has-text-white">PC Puma | 2018</strong>
</p>
</div>
</footer>
<template lang="pug">
footer.footer
div.content.has-text-centered
p.has-text-white PC PUMA | 2018
</template>
src/layout/Header.vue
+14 -44
View File
@@ -1,45 +1,15 @@
<template lang="html">
<nav class="navbar is-u-blue" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="https://bulma.io">
PC PUMA
</a>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item">
Inicio
</a>
<a class="navbar-item">
Prestamos
</a>
<a class="navbar-item">
Equipos
</a>
<a class="navbar-item">
Usuarios
</a>
</div>
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<a class="button is-u-golden">
<strong>Salir</strong>
</a>
</div>
</div>
</div>
</div>
</nav>
<template lang="pug">
nav.navbar.is-u-blue
div.navbar-brand
a.navbar-item PC PUMA
div.navbar-menu
div.navbar-start
router-link.navbar-item(to="/") Inicio
router-link.navbar-item(to="/") Prestamos
router-link.navbar-item(to="/equipo") equipos
router-link.navbar-item(to="/") usuarios
div.navbar-end
div.navbar-item
a.button.is-u-golden
strong Salir
</template>
src/layout/Inicio.vue
+22 -23
View File
@@ -1,32 +1,31 @@
<template lang="html">
<div class="container">
<br><br>
<div class="columns">
<div class="column is-12 has-text-centered">
<h1 class="is-size-2">Bienvenido A PC Puma</h1>
<h2 class="is-size-3">Usuario</h2>
</div>
</div>
<br><br>
<div class="columns">
<div class="column is-4 is-offset-4">
<resumen/>
</div>
</div>
<div class="columns">
<div class="column is-10 is-offset-1">
<equipo/>
</div>
</div>
</div>
<template lang="pug">
main
um-header
.container
br
br
div.columns
div.column.is-12.has-text-centered
h1.is-size-2 Bienvenido A PC Puma
h2.is-size-3 Usuario
br
br
div.columns
.column.is-6.is-offset-3
resumen
div.columns
.column.is-10.is-offset-1
equipo
um-footer
</template>
<script>
import Resumen from '../components/inicio/Resumen.vue'
import Equipo from '../components/inicio/Equipo.vue'
import UmFooter from '../layout/Footer.vue'
import UmHeader from '../layout/Header.vue'
export default {
components: { Resumen, Equipo }
components: { Resumen, Equipo, UmHeader, UmFooter }
}
</script>
src/layout/Login.vue
+65
View File
@@ -0,0 +1,65 @@
<template lang="pug">
main
nav.navbar.is-u-blue
div.navbar-brand
a.navbar-item PC PUMA
.container
.columns
.column.is-4.is-offset-4
figure.image
img(src="../assets/unam.png")
un-notification(v-if='this.status' v-bind:msj='this.err' status=true)
form
.field
p.control.has-icons-left
input.input(placeholder="Usuario" v-model="user")
span.icon.is-small.is-left
i
font-awesome-icon(icon="user")
.field
p.control.has-icons-left
input.input(placeholder="Contraseña" v-model="pass")
span.icon.is-small.is-left
i
font-awesome-icon(icon="lock")
.field.has-text-centered
input.button.is-u-blue(type="submit" v-on:click="Login()" value="Iniciar sesión")
</template>
<script>
import UnNotification from '../components/general/Notificacion.vue'
const axios = require('axios')
export default {
components: {
UnNotification
},
data () {
return {
user: '',
pass: '',
err: '',
status: false
}
},
methods: {
Login: function () {
axios.post('http://39a65af6.ngrok.io/login', {
nombre: this.user,
pass: this.pass
})
.then(response => {
console.log(response.data.data)
window.localStorage.pcpumaT = response.data.data.token
window.localStorage.pcpumaU = response.data.data.usuario
})
.catch(error => {
this.err = error.response.data.err
this.status = !error.response.data.status
})
}
}
}
</script>
<style lang="css">
</style>
src/main.js
+9 -4
View File
@@ -1,19 +1,24 @@
import Vue from 'vue'
import App from './App.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faLaptop, faTabletAlt } from '@fortawesome/free-solid-svg-icons'
import { faLaptop, faTabletAlt, faUser, faLock } from '@fortawesome/free-solid-svg-icons'
import { faChrome } from '@fortawesome/free-brands-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import VueRouter from 'vue-router'
import routes from './routes.js'
library.add(faChrome)
library.add(faLaptop)
library.add(faUser)
library.add(faLock)
library.add(faTabletAlt)
Vue.component('font-awesome-icon', FontAwesomeIcon)
Vue.use(VueRouter)
// import Child from './components/Child.vue'
Vue.config.productionTip = false
// Vue.component('child', Child)
const router = new VueRouter({ routes })
new Vue({
render: h => h(App)
render: h => h(App),
router
}).$mount('#app')
src/routes.js
+9
View File
@@ -0,0 +1,9 @@
import Equipo from './layout/Equipo.vue'
import Inicio from './layout/Inicio.vue'
import Login from './layout/Login.vue'
const routes = [
{ path: '/', component: Inicio, name: 'inicio' },
{ path: '/equipo', component: Equipo, name: 'equipo' },
{ path: '/login', component: Login, name: 'login' }
]
export default routes