Primo Committ
This commit is contained in:
paolo
28
.babelrc
Normal file
28
.babelrc
Normal file
@@ -0,0 +1,28 @@
|
||||
{
|
||||
"presets": [
|
||||
[
|
||||
"@babel/preset-env", {
|
||||
"modules": false,
|
||||
"loose": false,
|
||||
"useBuiltIns": "usage"
|
||||
}
|
||||
],
|
||||
[
|
||||
"@babel/preset-stage-2", {
|
||||
"modules": false,
|
||||
"loose": false,
|
||||
"useBuiltIns": true,
|
||||
"decoratorsLegacy": true
|
||||
}
|
||||
]
|
||||
],
|
||||
"plugins": [
|
||||
[
|
||||
"@babel/transform-runtime", {
|
||||
"polyfill": false,
|
||||
"regenerator": false
|
||||
}
|
||||
]
|
||||
],
|
||||
"comments": false
|
||||
}
|
||||
9
.editorconfig
Normal file
9
.editorconfig
Normal file
@@ -0,0 +1,9 @@
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
20
.gitignore
vendored
Normal file
20
.gitignore
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
.quasar
|
||||
.DS_Store
|
||||
.thumbs.db
|
||||
node_modules
|
||||
/dist
|
||||
/src-cordova/node_modules
|
||||
/src-cordova/platforms
|
||||
/src-cordova/plugins
|
||||
/src-cordova/www
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
8
.postcssrc.js
Normal file
8
.postcssrc.js
Normal file
@@ -0,0 +1,8 @@
|
||||
// https://github.com/michael-ciniawsky/postcss-load-config
|
||||
|
||||
module.exports = {
|
||||
plugins: [
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
require('autoprefixer')
|
||||
]
|
||||
}
|
||||
10283
package-lock.json
generated
Normal file
10283
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
37
package.json
Normal file
37
package.json
Normal file
@@ -0,0 +1,37 @@
|
||||
{
|
||||
"name": "myapp",
|
||||
"version": "1.0.0",
|
||||
"description": "MyApp Pao descrizione",
|
||||
"productName": "MyApp Pao",
|
||||
"cordovaId": "org.cordova.quasar.app",
|
||||
"author": "paolo <paolo.arena77@gmail.com>",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "quasar dev -m pwa",
|
||||
"build": "quasar build -m pwa",
|
||||
"test": "echo \"No test specified\" && exit 0"
|
||||
},
|
||||
"dependencies": {
|
||||
"chart": "^0.1.2",
|
||||
"chart.js": "^2.7.2",
|
||||
"countup.js": "^1.9.3",
|
||||
"vivus": "^0.4.4",
|
||||
"vue-i18n": "^8.1.0",
|
||||
"vue-i18n-loader": "^1.0.0",
|
||||
"vuelidate": "^0.7.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"quasar-cli": "^0.17.0",
|
||||
"strip-ansi": "=3.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 8.9.0",
|
||||
"npm": ">= 5.6.0",
|
||||
"yarn": ">= 1.6.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie <= 10"
|
||||
]
|
||||
}
|
||||
141
quasar.conf.js
Normal file
141
quasar.conf.js
Normal file
@@ -0,0 +1,141 @@
|
||||
// Configuration for your app
|
||||
|
||||
module.exports = function (ctx) {
|
||||
return {
|
||||
// app plugins (/src/plugins)
|
||||
plugins: ['i18n', 'aggiuntivi'],
|
||||
css: [
|
||||
'app.styl'
|
||||
],
|
||||
extras: [
|
||||
ctx.theme.mat ? 'roboto-font' : null,
|
||||
'material-icons' // optional, you are not bound to it
|
||||
// 'ionicons',
|
||||
// 'mdi',
|
||||
// 'fontawesome'
|
||||
],
|
||||
supportIE: false,
|
||||
build: {
|
||||
scopeHoisting: true,
|
||||
// vueRouterMode: 'history',
|
||||
// vueCompiler: true,
|
||||
// gzip: true,
|
||||
// analyze: true,
|
||||
// extractCSS: false,
|
||||
extendWebpack(cfg) {
|
||||
}
|
||||
},
|
||||
devServer: {
|
||||
// https: true,
|
||||
// port: 8080,
|
||||
open: true // opens browser window automatically
|
||||
},
|
||||
framework: {
|
||||
components: [
|
||||
'QLayout',
|
||||
'QLayoutHeader',
|
||||
'QLayoutDrawer',
|
||||
'QPageContainer',
|
||||
'QPage',
|
||||
'QToolbar',
|
||||
'QToolbarTitle',
|
||||
'QBtn',
|
||||
'QIcon',
|
||||
'QList',
|
||||
'QListHeader',
|
||||
'QItem',
|
||||
'QItemMain',
|
||||
'QItemSide',
|
||||
'QCard',
|
||||
'QCardTitle',
|
||||
'QCardMain',
|
||||
'QCardMedia',
|
||||
'QCardSeparator',
|
||||
'QCardActions',
|
||||
'QField',
|
||||
'QSelect',
|
||||
],
|
||||
directives: [
|
||||
'Ripple'
|
||||
],
|
||||
// Quasar plugins
|
||||
plugins: [
|
||||
'Notify', 'ActionSheet'
|
||||
],
|
||||
// iconSet: ctx.theme.mat ? 'material-icons' : 'ionicons'
|
||||
i18n: 'it' // Quasar language
|
||||
},
|
||||
framework: 'all', // --- includes everything; for dev only!
|
||||
// animations: 'all' --- includes all animations
|
||||
animations: [],
|
||||
ssr: {
|
||||
pwa: false
|
||||
},
|
||||
pwa: {
|
||||
workboxPluginMode: 'InjectManifest',
|
||||
// workboxOptions: {},
|
||||
manifest: {
|
||||
name: 'My App',
|
||||
short_name: 'myapp',
|
||||
description: 'Descrizione APP!',
|
||||
display: 'standalone',
|
||||
orientation: 'portrait',
|
||||
background_color: '#ffffff',
|
||||
theme_color: '#027be3',
|
||||
icons: [
|
||||
{
|
||||
'src': 'statics/icons/icon-128x128.png',
|
||||
'sizes': '128x128',
|
||||
'type': 'image/png'
|
||||
},
|
||||
{
|
||||
'src': 'statics/icons/icon-192x192.png',
|
||||
'sizes': '192x192',
|
||||
'type': 'image/png'
|
||||
},
|
||||
{
|
||||
'src': 'statics/icons/icon-256x256.png',
|
||||
'sizes': '256x256',
|
||||
'type': 'image/png'
|
||||
},
|
||||
{
|
||||
'src': 'statics/icons/icon-384x384.png',
|
||||
'sizes': '384x384',
|
||||
'type': 'image/png'
|
||||
},
|
||||
{
|
||||
'src': 'statics/icons/icon-512x512.png',
|
||||
'sizes': '512x512',
|
||||
'type': 'image/png'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
cordova: {
|
||||
// id: 'org.cordova.quasar.app'
|
||||
},
|
||||
electron: {
|
||||
// bundler: 'builder', // or 'packager'
|
||||
extendWebpack(cfg) {
|
||||
// do something with Electron process Webpack cfg
|
||||
},
|
||||
packager: {
|
||||
// https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
|
||||
|
||||
// OS X / Mac App Store
|
||||
// appBundleId: '',
|
||||
// appCategoryType: '',
|
||||
// osxSign: '',
|
||||
// protocol: 'myapp://path',
|
||||
|
||||
// Window only
|
||||
// win32metadata: { ... }
|
||||
},
|
||||
builder: {
|
||||
// https://www.electron.build/configuration/configuration
|
||||
|
||||
// appId: 'quasar-app'
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
24
src-pwa/custom-service-worker.js
Normal file
24
src-pwa/custom-service-worker.js
Normal file
@@ -0,0 +1,24 @@
|
||||
/*
|
||||
* This file (which will be your service worker)
|
||||
* is picked up by the build system ONLY if
|
||||
* quasar.conf > pwa > workboxPluginMode is set to "InjectManifest"
|
||||
*/
|
||||
|
||||
self.addEventListener('install', function(event) {
|
||||
console.log('[Service Worker] Installing Service Worker ...', event);
|
||||
});
|
||||
|
||||
self.addEventListener('activate', function(event) {
|
||||
console.log('[Service Worker] Activating Service Worker ...', event);
|
||||
return self.clients.claim();
|
||||
});
|
||||
|
||||
self.addEventListener('fetch', function(event) {
|
||||
//console.log('[Service Worker] Fetching something ....', event);
|
||||
if (event.request.cache === 'only-if-cached' && event.request.mode !== 'same-origin') {
|
||||
console.log('SAME ORIGIN!', event);
|
||||
return;
|
||||
}
|
||||
event.respondWith(fetch(event.request));
|
||||
});
|
||||
|
||||
35
src-pwa/register-service-worker.js
Normal file
35
src-pwa/register-service-worker.js
Normal file
@@ -0,0 +1,35 @@
|
||||
/*
|
||||
* This file is picked up by the build system only
|
||||
* when building for PRODUCTION
|
||||
*/
|
||||
|
||||
import {register} from 'register-service-worker'
|
||||
|
||||
register(process.env.SERVICE_WORKER_FILE, {
|
||||
ready() {
|
||||
console.log('READY::: App is being served from cache by a service worker.')
|
||||
},
|
||||
registered(registration) { // registration -> a ServiceWorkerRegistration instance
|
||||
console.log('REGISTERED::: !!!')
|
||||
},
|
||||
cached(registration) { // registration -> a ServiceWorkerRegistration instance
|
||||
console.log('CACHED::: Content has been cached for offline use.')
|
||||
},
|
||||
updatefound(registration) { // registration -> a ServiceWorkerRegistration instance
|
||||
console.log('UPDATEFOUND::: New content is downloading.')
|
||||
},
|
||||
updated(registration) { // registration -> a ServiceWorkerRegistration instance
|
||||
console.log('New content is available; please refresh.')
|
||||
},
|
||||
offline() {
|
||||
console.log('No internet connection found. App is running in offline mode.')
|
||||
},
|
||||
error(err) {
|
||||
console.error('Error during service worker registration:', err)
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
// ServiceWorkerRegistration: https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration
|
||||
|
||||
|
||||
196
src/App.vue
Normal file
196
src/App.vue
Normal file
@@ -0,0 +1,196 @@
|
||||
<template>
|
||||
<div id="q-app" >
|
||||
<div v-if="getMobileMode">
|
||||
<div id="android-preview" class="platform-android mat-only">
|
||||
<iframe id="android-iframe" frameborder="0" src="https://quasar-admin.firebaseapp.com/android/#/"></iframe>
|
||||
</div>
|
||||
<div id="ios-preview" class="platform-ios ios-only">
|
||||
<iframe id="ios-iframe" frameborder="0" src="https://quasar-admin.firebaseapp.com/ios/#/"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<q-layout :style="{ backgroundColor: backgroundColor}" v-else>
|
||||
<toolbar slot="header"></toolbar>
|
||||
<div class="layout-view">
|
||||
<transition name="fade" mode="out-in">
|
||||
<router-view></router-view>
|
||||
</transition>
|
||||
</div>
|
||||
</q-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/javascript">
|
||||
import toolbar from './components/layout/toolbar/toolbar.vue'
|
||||
import drawer from './components/layout/drawer/drawer.vue'
|
||||
import contentHeader from './components/layout/content-header.vue'
|
||||
import { mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'app',
|
||||
data () {
|
||||
return {
|
||||
backgroundColor: 'whitesmoke'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters("glob", ['getLayoutNeeded', 'getMobileMode'])
|
||||
},
|
||||
components: {
|
||||
toolbar,
|
||||
drawer,
|
||||
contentHeader
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.fade-enter-active, .fade-enter{
|
||||
-webkit-animation: moveFromRight .5s both ease;
|
||||
animation: moveFromRight .5s both ease;
|
||||
}
|
||||
.fade-leave-to, .fade-leave-active {
|
||||
-webkit-animation: moveToLeft 1s both ease;
|
||||
animation: moveToLeft 1s both ease;
|
||||
}
|
||||
.layout-padding {
|
||||
padding: 1em 4em;
|
||||
}
|
||||
@media screen and (max-width: 600px){
|
||||
.layout-padding {
|
||||
padding: 1.5em .5em;
|
||||
}
|
||||
}
|
||||
.menu-enter-active, .scale-enter{
|
||||
-webkit-animation: moveFromLeftFade .9s ease both;
|
||||
animation: moveFromLeftFade .9s ease both;
|
||||
}
|
||||
.menu-leave-to, .scale-leave-active {
|
||||
-webkit-animation: moveToLeft .9s ease both;
|
||||
animation: moveToLeft .9s ease both;
|
||||
}
|
||||
|
||||
@-webkit-keyframes moveFromLeftFade {
|
||||
from { opacity: 0.3; -webkit-transform: translateX(-100%); }
|
||||
}
|
||||
@keyframes moveFromLeftFade {
|
||||
from { opacity: 0.3; -webkit-transform: translateX(-100%); transform: translateX(-100%); }
|
||||
}
|
||||
@-webkit-keyframes moveToRight {
|
||||
from { }
|
||||
to { -webkit-transform: translateX(100%); }
|
||||
}
|
||||
|
||||
@keyframes cartOut {
|
||||
from {
|
||||
transform: translate(0px, 0px);
|
||||
}
|
||||
to {
|
||||
transform: translate(1200px, 0px);
|
||||
animation-timing-function: ease-out;
|
||||
}
|
||||
|
||||
}
|
||||
@-webkit-keyframes moveToLeft {
|
||||
from { }
|
||||
to { opacity: .5; -webkit-transform: translateX(-100%); }
|
||||
}
|
||||
@keyframes moveToLeft {
|
||||
from { }
|
||||
to { opacity: .5; -webkit-transform: translateX(-100%); transform: translateX(-100%); }
|
||||
}
|
||||
|
||||
@-webkit-keyframes moveFromRight {
|
||||
from { opacity: .7; -webkit-transform: translateX(100%); }
|
||||
}
|
||||
@keyframes moveFromRight {
|
||||
from {opacity: .7; -webkit-transform: translateX(100%); transform: translateX(100%); }
|
||||
}
|
||||
|
||||
.drawer-closer .item-content {
|
||||
margin-left: 50px !important;
|
||||
}
|
||||
.drawer-content .list-label {
|
||||
line-height: 45px;
|
||||
}
|
||||
.drawer-content .item {
|
||||
height: 45px;
|
||||
}
|
||||
.router-link-active .item-primary{
|
||||
color: #027be3;
|
||||
}
|
||||
.q-picker-textfield .q-picker-textfield-label{
|
||||
color: inherit !important;
|
||||
}
|
||||
.label-success .q-picker-textfield-label {
|
||||
color: #4caf50 !important;
|
||||
}
|
||||
.label-error .q-picker-textfield-label {
|
||||
color: #f44336 !important;
|
||||
}
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
text-indent: 1px;
|
||||
text-overflow: '';
|
||||
}
|
||||
.label-success .q-picker-textfield:after, .label-error .q-picker-textfield:after{
|
||||
content: "" !important;
|
||||
}
|
||||
#android-preview {
|
||||
display: block;
|
||||
text-align: center;
|
||||
width: 467px;
|
||||
height: 800px;
|
||||
background: url('./statics/devices-sprite.jpg') 0 -800px no-repeat;
|
||||
background-size: 467px;
|
||||
margin: 5px auto 0;
|
||||
}
|
||||
#ios-preview {
|
||||
text-align: center;
|
||||
width: 467px;
|
||||
height: 800px;
|
||||
background: url('./statics/devices-sprite.jpg') center top no-repeat;
|
||||
background-size: 467px;
|
||||
margin: 5px auto 0;
|
||||
}
|
||||
|
||||
#android-preview iframe {
|
||||
margin-top: 64px;
|
||||
width: 357px;
|
||||
height: 590px;
|
||||
background: #fff;
|
||||
}
|
||||
#ios-preview iframe {
|
||||
margin-top: 64px;
|
||||
width: 320px;
|
||||
height: 590px;
|
||||
background: #fff;
|
||||
}
|
||||
canvas {
|
||||
width: 270px !important;
|
||||
}
|
||||
@media only screen and (min-width: 601px){
|
||||
.adv-form-one .timeline-badge {
|
||||
right: auto !important;
|
||||
left: auto !important;
|
||||
}
|
||||
.adv-form-one .timeline-content {
|
||||
margin-left: 3.9rem;
|
||||
}
|
||||
.adv-form-one .timeline-item {
|
||||
width: 100% !important;
|
||||
}
|
||||
.adv-form-one .timeline-title {
|
||||
text-align: inherit !important;
|
||||
margin-left: 3.9rem;
|
||||
}
|
||||
.timeline:before {
|
||||
left: 1.6rem;
|
||||
}
|
||||
}
|
||||
.adv-form-one .timeline-content .group .primary {
|
||||
display: none !important;
|
||||
}
|
||||
.underline {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
191
src/assets/quasar-logo-full.svg
Normal file
191
src/assets/quasar-logo-full.svg
Normal file
@@ -0,0 +1,191 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="67.407623mm"
|
||||
height="62.908276mm"
|
||||
viewBox="0 0 238.84591 222.90334"
|
||||
id="svg3570"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="quasar-logo-full.svg">
|
||||
<defs
|
||||
id="defs3572" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="1.979899"
|
||||
inkscape:cx="-39.753589"
|
||||
inkscape:cy="27.706388"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="g4895-4-4"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata3575">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-277.71988,-312.33911)">
|
||||
<g
|
||||
id="g4895-4-4"
|
||||
transform="translate(1419.0442,398.9018)">
|
||||
<g
|
||||
transform="translate(-29.620665,-4)"
|
||||
id="g4579-2-20">
|
||||
<g
|
||||
id="g4445-2-0"
|
||||
transform="translate(12.499948,7.809312)">
|
||||
<g
|
||||
inkscape:export-ydpi="44.860481"
|
||||
inkscape:export-xdpi="44.860481"
|
||||
inkscape:export-filename="/home/emanuele/Desktop/logo1.png"
|
||||
transform="translate(-712.85583,-503.26814)"
|
||||
id="g4561-6-7-0">
|
||||
<g
|
||||
transform="translate(16.233481,0)"
|
||||
style="font-style:normal;font-weight:normal;font-size:50.25774765px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#263238;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
id="flowRoot4513-6-6-08">
|
||||
<path
|
||||
d="m -402.73125,631.46823 q -0.6125,0.0438 -1.3125,0.0875 -0.65625,0 -1.4,0 l -9.31875,0 q -12.81875,0 -12.81875,-8.44375 l 0,-13.475 q 0,-8.26875 12.6,-8.26875 l 9.75625,0 q 12.6,0 12.6,8.26875 l 0,13.475 q 0,5.03125 -4.4625,7.04375 l 3.10625,2.14375 q 1.35625,0.83125 1.35625,1.70625 0,0.875 -0.7,1.3125 -0.65625,0.48125 -1.88125,0.48125 -0.30625,0 -0.7875,-0.13125 -0.4375,-0.0875 -1.05,-0.48125 l -5.6875,-3.71875 z m 5.38125,-21.74375 q 0,-4.76875 -7.9625,-4.76875 l -9.58125,0 q -7.9625,0 -7.9625,4.76875 l 0,13.3875 q 0,4.94375 8.3125,4.94375 l 8.88125,0 q 8.3125,0 8.3125,-4.94375 l 0,-13.3875 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3428" />
|
||||
<path
|
||||
d="m -368.0585,631.64323 q -11.2875,0 -11.2875,-6.9125 l 0,-12.73125 q 0,-1.8375 2.31875,-1.8375 2.31875,0 2.31875,1.8375 l 0,12.775 q 0,3.325 6.475,3.325 l 8.3125,0 q 6.475,0 6.475,-3.325 l 0,-12.775 q 0,-1.8375 2.31875,-1.8375 2.3625,0 2.3625,1.8375 l 0,12.73125 q 0,6.9125 -11.2875,6.9125 l -8.00625,0 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3430" />
|
||||
<path
|
||||
d="m -327.2833,631.64323 q -9.3625,0 -9.3625,-5.81875 l 0,-2.49375 q 0,-5.775 9.3625,-5.775 l 18.59375,0 0,-0.65625 q 0,-3.0625 -5.38125,-3.0625 l -6.16875,0 q -2.1875,0 -2.1875,-1.70625 0,-1.75 2.1875,-1.75 l 6.16875,0 q 9.93125,0 9.93125,6.51875 l 0,8.575 q 0,6.16875 -9.5375,6.16875 l -13.60625,0 z m 13.34375,-3.4125 q 5.25,0 5.25,-2.8875 l 0,-4.76875 -18.24375,0 q -5.11875,0 -5.11875,2.66875 l 0,2.275 q 0,2.7125 5.11875,2.7125 l 12.99375,0 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3432" />
|
||||
<path
|
||||
d="m -262.77031,626.74323 q 0,4.9 -9.975,4.9 l -17.0625,0 q -2.1875,0 -2.1875,-1.70625 0,-1.70625 2.1875,-1.70625 l 17.0625,0 q 5.38125,0 5.38125,-1.4875 l 0,-2.45 q 0,-1.4875 -5.38125,-1.4875 l -9.0125,0 q -9.975,0 -9.975,-4.76875 l 0,-2.05625 q 0,-5.6 10.28125,-5.6 l 5.99375,0 q 2.23125,0 2.23125,1.75 0,0.875 -0.6125,1.3125 -0.56875,0.39375 -1.61875,0.39375 l -5.99375,0 q -5.73125,0 -5.73125,2.14375 l 0,1.925 q 0,1.79375 5.6875,1.79375 l 9.0125,0 q 9.7125,0 9.7125,4.4625 l 0,2.58125 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3434" />
|
||||
<path
|
||||
d="m -241.91709,631.64323 q -9.3625,0 -9.3625,-5.81875 l 0,-2.49375 q 0,-5.775 9.3625,-5.775 l 18.59375,0 0,-0.65625 q 0,-3.0625 -5.38125,-3.0625 l -6.16875,0 q -2.1875,0 -2.1875,-1.70625 0,-1.75 2.1875,-1.75 l 6.16875,0 q 9.93125,0 9.93125,6.51875 l 0,8.575 q 0,6.16875 -9.5375,6.16875 l -13.60625,0 z m 13.34375,-3.4125 q 5.25,0 5.25,-2.8875 l 0,-4.76875 -18.24375,0 q -5.11875,0 -5.11875,2.66875 l 0,2.275 q 0,2.7125 5.11875,2.7125 l 12.99375,0 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3436" />
|
||||
<path
|
||||
d="m -205.62285,617.33698 q 0,-6.95625 11.2875,-6.95625 l 3.36875,0 q 2.23125,0 2.23125,1.79375 0,1.79375 -2.23125,1.79375 l -3.54375,0 q -6.475,0 -6.475,3.28125 l 0,12.775 q 0,1.8375 -2.31875,1.8375 -2.31875,0 -2.31875,-1.8375 l 0,-12.6875 z"
|
||||
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:43.75px;font-family:'Neuropol X';-inkscape-font-specification:'Neuropol X';text-align:start;letter-spacing:5px;word-spacing:0px;text-anchor:start;fill:#263238;fill-opacity:1"
|
||||
id="path3438" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
id="g5443-0-1-5-1-9"
|
||||
transform="matrix(0.55595317,0,0,0.55595317,-521.93484,-328.66104)"
|
||||
inkscape:export-filename="/home/emanuele/Desktop/logo1.png"
|
||||
inkscape:export-xdpi="44.860481"
|
||||
inkscape:export-ydpi="44.860481">
|
||||
<g
|
||||
inkscape:export-ydpi="3.4165223"
|
||||
inkscape:export-xdpi="3.4165223"
|
||||
transform="matrix(0.09527033,0,0,0.09527033,-1695.2716,706.62921)"
|
||||
id="g8856-6-1-1-9-0-1-9">
|
||||
<circle
|
||||
r="1485"
|
||||
cy="-1361.2571"
|
||||
cx="8317.3574"
|
||||
id="circle8858-1-3-7-6-5-3-0"
|
||||
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:50;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
inkscape:export-xdpi="10.031387"
|
||||
inkscape:export-ydpi="10.031387" />
|
||||
<path
|
||||
inkscape:export-ydpi="10.031387"
|
||||
inkscape:export-xdpi="10.031387"
|
||||
style="opacity:1;fill:#263238;fill-opacity:1;stroke:none;stroke-width:10;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 8560.3823,-1361.3029 a 242.947,242.947 0 0 1 -242.947,242.948 242.947,242.947 0 0 1 -242.947,-242.948 242.947,242.947 0 0 1 242.947,-242.946 242.947,242.947 0 0 1 242.947,242.946 z"
|
||||
id="path8860-5-4-8-2-9-0-9"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
id="path8862-5-5-9-1-3-6-3"
|
||||
d="m 9395.8755,-1984.028 a 1245.372,1245.372 0 0 0 -190.8415,-249.4971 l -280.8618,162.1556 c -87.542,-74.7796 -187.0349,-132.0588 -293.2407,-169.9527 -95.8868,97.1766 -172.0602,205.7604 -226.9672,323.8487 312.6411,-21.2772 635.5313,91.8725 935.2898,326.0721 l 176.7612,-102.0532 a 1245.372,1245.372 0 0 0 -120.1398,-290.5734 z"
|
||||
clip-path="none"
|
||||
mask="none"
|
||||
style="fill:#1976d2;fill-opacity:1"
|
||||
inkscape:connector-curvature="0"
|
||||
inkscape:transform-center-x="-514.04855"
|
||||
inkscape:transform-center-y="-444.04649" />
|
||||
<path
|
||||
inkscape:transform-center-y="265.80217"
|
||||
inkscape:transform-center-x="-689.63727"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#42a5f5;fill-opacity:1"
|
||||
mask="none"
|
||||
clip-path="none"
|
||||
d="m 9395.9474,-738.70387 a 1245.372,1245.372 0 0 0 120.6501,-290.02213 l -280.8618,-162.1557 c 20.99,-113.2034 20.8488,-228.0063 0.563,-338.9302 -132.1008,-34.4521 -264.2238,-46.1283 -393.9448,-34.635 174.7471,260.1165 238.2017,596.32248 185.2582,973.02076 l 176.7612,102.05309 a 1245.372,1245.372 0 0 0 191.5741,-249.33082 z"
|
||||
id="path8864-4-8-1-2-4-4-4" />
|
||||
<path
|
||||
id="path8866-7-5-5-0-6-4-7"
|
||||
d="m 8317.501,-115.97954 a 1245.372,1245.372 0 0 0 311.4916,-40.52501 l 0,-324.31131 c 108.5321,-38.42382 207.8837,-95.94755 293.8037,-168.97752 -36.214,-131.6287 -92.1636,-251.88868 -166.9776,-358.48372 -137.894,281.39369 -397.3296,504.44998 -750.0316,646.9487 l 0,204.10623 a 1245.372,1245.372 0 0 0 311.7139,41.24263 z"
|
||||
clip-path="none"
|
||||
mask="none"
|
||||
style="fill:#1976d2;fill-opacity:1"
|
||||
inkscape:connector-curvature="0"
|
||||
inkscape:transform-center-x="-117.49007"
|
||||
inkscape:transform-center-y="639.34029" />
|
||||
<path
|
||||
inkscape:transform-center-y="444.04652"
|
||||
inkscape:transform-center-x="514.04857"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#42a5f5;fill-opacity:1"
|
||||
mask="none"
|
||||
clip-path="none"
|
||||
d="m 7238.9827,-738.57936 a 1245.372,1245.372 0 0 0 190.8415,249.49714 l 280.8618,-162.15566 c 87.5421,74.77965 187.0349,132.05879 293.2407,169.95271 95.8868,-97.17659 172.0602,-205.76036 226.9672,-323.8487 -312.6411,21.27714 -635.5313,-91.87254 -935.2898,-326.07203 l -176.7612,102.0531 a 1245.372,1245.372 0 0 0 120.1398,290.57344 z"
|
||||
id="path8868-6-7-4-7-2-7-3" />
|
||||
<path
|
||||
id="path8870-5-3-9-3-5-5-1"
|
||||
d="m 7238.9108,-1983.9035 a 1245.372,1245.372 0 0 0 -120.6501,290.0221 l 280.8618,162.1557 c -20.99,113.2035 -20.8488,228.0063 -0.563,338.9302 132.1008,34.4521 264.2238,46.1283 393.9448,34.635 -174.7471,-260.1165 -238.2017,-596.3225 -185.2582,-973.0207 l -176.7612,-102.0532 a 1245.372,1245.372 0 0 0 -191.5741,249.3309 z"
|
||||
clip-path="none"
|
||||
mask="none"
|
||||
style="fill:#1976d2;fill-opacity:1"
|
||||
inkscape:connector-curvature="0"
|
||||
inkscape:transform-center-x="689.63729"
|
||||
inkscape:transform-center-y="-265.80221" />
|
||||
<path
|
||||
inkscape:transform-center-y="-639.34032"
|
||||
inkscape:transform-center-x="117.49005"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#42a5f5;fill-opacity:1"
|
||||
mask="none"
|
||||
clip-path="none"
|
||||
d="m 8317.3572,-2606.6279 a 1245.372,1245.372 0 0 0 -311.4915,40.525 l -1e-4,324.3113 c -108.5321,38.4239 -207.8837,95.9476 -293.8037,168.9776 36.214,131.6287 92.1637,251.8886 166.9776,358.4837 137.894,-281.3937 397.3296,-504.45 750.0316,-646.9487 l 1e-4,-204.1063 a 1245.372,1245.372 0 0 0 -311.714,-41.2426 z"
|
||||
id="path8872-6-3-2-1-3-3-7" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 13 KiB |
1
src/assets/sad.svg
Normal file
1
src/assets/sad.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.4 KiB |
17
src/cfg.js
Normal file
17
src/cfg.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
export const cfg = new Vue({
|
||||
state:{
|
||||
lang: 'it'
|
||||
},
|
||||
data: {
|
||||
cost: {
|
||||
MYAPPMOD_ATTUALE: 'freeplanet',
|
||||
//MYAPPMOD_ATTUALE: 'karpos',
|
||||
AA: ''
|
||||
}
|
||||
}
|
||||
});
|
||||
0
src/components/.gitkeep
Normal file
0
src/components/.gitkeep
Normal file
111
src/components/Header.vue
Normal file
111
src/components/Header.vue
Normal file
@@ -0,0 +1,111 @@
|
||||
<template>
|
||||
<div>
|
||||
<q-layout-header>
|
||||
<q-toolbar
|
||||
color="primary"
|
||||
:glossy="$q.theme === 'mat'"
|
||||
:inverted="$q.theme === 'ios'"
|
||||
>
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
round
|
||||
@click="leftDrawerOpen = !leftDrawerOpen"
|
||||
aria-label="Menu"
|
||||
>
|
||||
<q-icon name="menu"/>
|
||||
</q-btn>
|
||||
|
||||
|
||||
<q-toolbar-title>
|
||||
{{$t('msg.myAppName')}}
|
||||
<div slot="subtitle">{{$t('msg.myDescriz')}}</div>
|
||||
</q-toolbar-title>
|
||||
|
||||
<q-select
|
||||
stack-label=""
|
||||
:options="[
|
||||
{ label: 'Italian', value: 'it' },
|
||||
{ label: 'English (US)', value: 'en-us' },
|
||||
{ label: 'Spanish', value: 'es' },
|
||||
{ label: 'German', value: 'de' },
|
||||
|
||||
]"
|
||||
v-model="lang"
|
||||
/>
|
||||
|
||||
|
||||
<!--{{ $q.i18n.label.close }}-->
|
||||
|
||||
<p>{{ $t('msg.hello') }}</p>
|
||||
|
||||
</q-toolbar>
|
||||
|
||||
</q-layout-header>
|
||||
|
||||
<q-layout-drawer
|
||||
v-model="leftDrawerOpen"
|
||||
:content-class="$q.theme === 'mat' ? 'bg-grey-2' : null"
|
||||
>
|
||||
<q-list
|
||||
no-border
|
||||
link
|
||||
inset-delimiter
|
||||
>
|
||||
<q-list-header>Essential Links</q-list-header>
|
||||
<q-item @click.native="openURL('http://quasar-framework.org')">
|
||||
<q-item-side icon="school"/>
|
||||
<q-item-main label="Docs" sublabel="quasar-framework.org"/>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-layout-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {openURL} from 'quasar';
|
||||
|
||||
import {Quasar} from 'quasar';
|
||||
|
||||
export default {
|
||||
created() {
|
||||
//this.$store.dispatch('initStocks');
|
||||
},
|
||||
methods: {
|
||||
openURL,
|
||||
},
|
||||
data: function () {
|
||||
return {
|
||||
lang: this.$q.i18n.lang,
|
||||
leftDrawerOpen: this.$q.platform.is.desktop
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
lang(lang) {
|
||||
this.$i18n.locale = snakeToCamel(lang);
|
||||
console.log("LANG LOCALE = " + this.$i18n.locale);
|
||||
|
||||
// dynamic import, so loading on demand only
|
||||
import(`quasar-framework/i18n/${lang}`).then(lang => {
|
||||
//console.log("lang prima = " + this.$q.i18n.lang);
|
||||
this.$q.i18n.set(lang.default);
|
||||
var mylang = this.$q.i18n.lang;
|
||||
console.log("lang = " + this.$q.i18n.lang);
|
||||
//console.log("lang DOPO = " + this.$q.i18n.lang);
|
||||
import(`src/i18n`).then(function () {
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
// dynamic import, so loading on demand only
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function snakeToCamel(str) {
|
||||
return str.replace(/(-\w)/g, m => {
|
||||
return m[1].toUpperCase()
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
70
src/components/layout/content-header.vue
Normal file
70
src/components/layout/content-header.vue
Normal file
@@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<div class="content-header" v-if="!getIsLoginPage">
|
||||
<span id="content-header-title" class="vertical-bottom">{{routerTitle}}</span>
|
||||
<button class="bg-blue-grey-8 text-white " id="configurations">
|
||||
<i>settings</i>
|
||||
<q-popover ref="popover" anchor="top left" self="top right" class="bg-blue-grey-8 text-white">
|
||||
<div class="list highlight " >
|
||||
<div class="item">
|
||||
<div class="item-content has-secondary">Layout</div>
|
||||
<div class="item-secondary">
|
||||
<q-toggle
|
||||
class="green"
|
||||
v-model="getLayoutNeeded"
|
||||
@input="setLayoutNeeded(!getLayoutNeeded)"
|
||||
></q-toggle>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="item-content has-secondary">Menu Collapse</div>
|
||||
<div class="item-secondary">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-popover>
|
||||
</button>
|
||||
<hr>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
import { mapMutations, mapGetters } from 'vuex'
|
||||
export default {
|
||||
computed: {
|
||||
...mapGetters(['getLayoutNeeded', 'getIsLoginPage']),
|
||||
routerTitle () {
|
||||
return this.$route.meta.name
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setLayoutNeeded', 'setMenuCollapse'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.list {
|
||||
min-height: 120px;
|
||||
}
|
||||
#configurations {
|
||||
position: absolute;
|
||||
right: 65px;
|
||||
top: 7px;
|
||||
}
|
||||
.content-header {
|
||||
position: relative;
|
||||
padding: 1em 4em 0em 4em;
|
||||
}
|
||||
@media screen and (max-width: 600px){
|
||||
.content-header {
|
||||
padding: 1.5em .5em;
|
||||
}
|
||||
#configurations {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 12px;
|
||||
}
|
||||
}
|
||||
#content-header-title {
|
||||
font-size: 22px;
|
||||
font-weight: 300;
|
||||
}
|
||||
</style>
|
||||
125
src/components/layout/drawer/drawer.vue
Normal file
125
src/components/layout/drawer/drawer.vue
Normal file
@@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<q-drawer ref="leftDrawer" v-show="getLayoutNeeded">
|
||||
<div id="profile">
|
||||
<img :src="photo" style='height: 80px' class="inline-block">
|
||||
<!--img src="../img/avatar-1.svg" id="avatar" class="inline-block"-->
|
||||
<div id="user-name">
|
||||
<span class="text-white"> {{ name }} </span>
|
||||
<hr>
|
||||
<span class="text-white"> {{ email }} </span>
|
||||
<hr>
|
||||
</div>
|
||||
<div id="user-actions">
|
||||
<button class="bordered blue small" ><i>person</i></button>
|
||||
<button class="bordered blue small" ><i>lock</i></button>
|
||||
<button class="bordered blue small" @click='logOut'><i>exit_to_app</i></button>
|
||||
</div>
|
||||
</div>
|
||||
<menu-one :links="links"></menu-one>
|
||||
|
||||
<div class="fixed-bottom text-center light text-italic">
|
||||
Powered by
|
||||
<a href="https://vuejs.org/"><img src="../img/vue-logo.png" alt=""></a>
|
||||
<a href="http://quasar-framework.org/"><img src="../img/quasar-logo.png" alt=""></a>
|
||||
</div>
|
||||
</q-drawer>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
import { mapGetters } from 'vuex'
|
||||
import menuOne from './menuOne.vue'
|
||||
import menuTwo from './menuTwo.vue'
|
||||
//import firebase from 'firebase'
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
photo: '',
|
||||
userId: '',
|
||||
name: '',
|
||||
email: '',
|
||||
user: {},
|
||||
links: {
|
||||
Dashboard: {
|
||||
routes: [
|
||||
{ route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'Dashboard One' }
|
||||
],
|
||||
show: true
|
||||
},
|
||||
Forms: {
|
||||
routes: [
|
||||
{ route: '/form', faIcon: 'fa fa-search', materialIcon: 'search', name: 'Form find / edit' },
|
||||
{ route: '/embeeded', faIcon: 'fa fa-check', materialIcon: 'check', name: 'Embeeded validations' },
|
||||
{ route: '/advanced-form-one', faIcon: 'fa fa-hdd-o', materialIcon: 'filter_1', name: 'Adv. Form One' }
|
||||
],
|
||||
show: false
|
||||
},
|
||||
Pages: {
|
||||
routes: [
|
||||
{ route: '/login-one', faIcon: 'fa fa-unlock-alt', materialIcon: 'lock_open', name: 'Login One' },
|
||||
{ route: '/pricing', faIcon: 'fa fa-money', materialIcon: 'attach_money', name: 'Pricing' },
|
||||
{ route: '/drag-and-drop', faIcon: 'fa fa-arrows', materialIcon: 'move_to_inbox', name: 'Drag and Drop' },
|
||||
{ route: '/server-side-data-table', faIcon: 'fa fa-list-alt', materialIcon: 'list_compact', name: 'Server Side Data Table' }
|
||||
],
|
||||
show: false
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
var vm = this
|
||||
/*firebase.auth().onAuthStateChanged(function (user) {
|
||||
if (user) {
|
||||
vm.user = user
|
||||
vm.name = vm.user.displayName
|
||||
vm.email = vm.user.email
|
||||
vm.photo = vm.user.photoURL
|
||||
vm.userId = vm.user.uid
|
||||
}
|
||||
})*/
|
||||
},
|
||||
methods: {
|
||||
logOut () {
|
||||
//firebase.auth().signOut()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['getLayoutNeeded', 'getMenuCollapse'])
|
||||
},
|
||||
components: {
|
||||
menuOne,
|
||||
menuTwo
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.fixed-bottom {
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
||||
.fixed-bottom a img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
#avatar{
|
||||
padding: 20px;
|
||||
}
|
||||
#profile {
|
||||
height: 130px;
|
||||
background-color: #009688;
|
||||
}
|
||||
#user-name {
|
||||
left: 90px;
|
||||
bottom: 77px;
|
||||
position: relative;
|
||||
width: 159px;
|
||||
}
|
||||
#user-actions {
|
||||
left: 90px;
|
||||
bottom: 71px;
|
||||
position: relative;
|
||||
width: 171px;
|
||||
}
|
||||
#menu-collapse {
|
||||
margin-top: 5%;
|
||||
}
|
||||
</style>
|
||||
69
src/components/layout/drawer/menuOne.vue
Normal file
69
src/components/layout/drawer/menuOne.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<div class="list no-border platform-delimiter light-paragraph">
|
||||
<template v-for="(parent, index) in links">
|
||||
<div class="list-label cursor-pointer underline" @click="parent.show = !parent.show">{{replaceUnderlineToSpace(index)}}</div>
|
||||
<template v-for="child in parent.routes">
|
||||
<transition name="menu">
|
||||
<div v-show="parent.show">
|
||||
<router-link :to="child.route" exact tag="div" class="item item-link drawer-closer cursor-pointer" >
|
||||
<i :class="child.faIcon" class="item-primary"></i>
|
||||
<div class="item-content">{{child.name}}</div>
|
||||
</router-link>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
<hr>
|
||||
</template>
|
||||
<div class="list-label cursor-pointer">Quasar Ready UI</div>
|
||||
<a href="http://quasar-framework.org/quasar-play/android/index.html#/showcase" target="_blank"
|
||||
class="item item-link drawer-closer cursor-pointer text-black" >
|
||||
<i class="fa fa-puzzle-piece item-primary" ></i>
|
||||
<div class="item-content">Components (55+)</div>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['links'],
|
||||
watch: {
|
||||
'$route.path' () {
|
||||
Object.keys(this.links).forEach(parentName => { this.setParentVisibilityBasedOnRoute(this.links[parentName]) })
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentRoutePath () {
|
||||
return this.$route.path
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setParentVisibilityBasedOnRoute (parent) {
|
||||
parent.routes.forEach(item => {
|
||||
if (this.$route.path === item.route) {
|
||||
parent.show = true
|
||||
return
|
||||
}
|
||||
})
|
||||
},
|
||||
replaceUnderlineToSpace (text) {
|
||||
while (text.indexOf('_') !== -1) {
|
||||
text = text.replace('_', ' ')
|
||||
}
|
||||
return text
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.list-label:first-child{
|
||||
line-height: 50px;
|
||||
}
|
||||
.router-link-active {
|
||||
color: #027be3;
|
||||
background-color: #dadada !important;
|
||||
border-right: 2px solid #027be3;
|
||||
}
|
||||
.router-link-active .item-primary{
|
||||
color: #027be3;
|
||||
}
|
||||
</style>
|
||||
45
src/components/layout/drawer/menuTwo.vue
Normal file
45
src/components/layout/drawer/menuTwo.vue
Normal file
@@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div class="list no-border platform-delimiter light-paragraph">
|
||||
<template v-for="(parent, index) in links">
|
||||
<div class="list-label ">{{replaceUnderlineToSpace(index)}}</div>
|
||||
<template v-for="child in parent.routes">
|
||||
<q-drawer-link :icon="child.materialIcon" :to="{path: child.route, exact: true}">
|
||||
{{child.name}}
|
||||
</q-drawer-link>
|
||||
</template>
|
||||
</template>
|
||||
<div class="list-label cursor-pointer">Quasar Ready UI</div>
|
||||
<a href="http://quasar-framework.org/quasar-play/android/index.html#/showcase" target="_blank"
|
||||
class="item item-link drawer-closer cursor-pointer text-black" >
|
||||
<i class="fa fa-puzzle-piece item-primary" ></i>
|
||||
<div class="item-content">Components (55+)</div>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['links'],
|
||||
methods: {
|
||||
replaceUnderlineToSpace (text) {
|
||||
while (text.indexOf('_') !== -1) {
|
||||
text = text.replace('_', ' ')
|
||||
}
|
||||
return text
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.list-label:first-child{
|
||||
line-height: 50px;
|
||||
}
|
||||
.router-link-active {
|
||||
color: #027be3;
|
||||
background-color: #dadada !important;
|
||||
border-right: 2px solid #027be3;
|
||||
}
|
||||
.router-link-active .item-primary{
|
||||
color: #027be3;
|
||||
}
|
||||
</style>
|
||||
195
src/components/layout/img/avatar-1.svg
Normal file
195
src/components/layout/img/avatar-1.svg
Normal file
@@ -0,0 +1,195 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="56px" height="56px"
|
||||
viewBox="0 0 188.148 188.148" style="enable-background:new 0 0 188.148 188.148;" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<defs>
|
||||
<circle id="SVGID_1_" cx="94.074" cy="94.074" r="94.074"/>
|
||||
</defs>
|
||||
<use xlink:href="#SVGID_1_" style="overflow:visible;fill:#EB6D4A;"/>
|
||||
<clipPath id="SVGID_2_">
|
||||
<use xlink:href="#SVGID_1_" style="overflow:visible;"/>
|
||||
</clipPath>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#ECC19C;" d="M135.938,52.784V84.05c0,0.453-0.011,0.905-0.021,1.357
|
||||
c-0.02,0.936-0.072,1.871-0.154,2.796c-0.02,0.319-0.052,0.637-0.093,0.956c-0.134,1.326-0.318,2.632-0.555,3.928
|
||||
c-0.083,0.432-0.165,0.853-0.258,1.275c-0.01,0.092-0.03,0.175-0.051,0.257c-0.083,0.432-0.186,0.854-0.288,1.275
|
||||
c-0.041,0.226-0.103,0.452-0.154,0.679c-0.052,0.195-0.103,0.391-0.164,0.586c-0.217,0.843-0.463,1.666-0.721,2.488
|
||||
c-0.123,0.391-0.246,0.771-0.38,1.162c-0.011,0.041-0.031,0.082-0.041,0.123c-0.124,0.349-0.247,0.699-0.37,1.048
|
||||
c-0.041,0.103-0.082,0.205-0.124,0.319c-0.123,0.329-0.246,0.658-0.38,0.987c-0.154,0.401-0.318,0.792-0.483,1.183
|
||||
c-0.144,0.35-0.298,0.699-0.452,1.049c-0.02,0.062-0.052,0.113-0.072,0.174c-0.175,0.37-0.339,0.741-0.514,1.1
|
||||
c-0.175,0.38-0.36,0.761-0.556,1.142c-0.37,0.75-0.771,1.501-1.172,2.231c-0.185,0.329-0.37,0.658-0.556,0.987
|
||||
c-1.583,2.725-3.341,5.285-5.253,7.649c-0.258,0.339-0.524,0.668-0.802,0.987c-0.381,0.462-0.772,0.915-1.162,1.357
|
||||
c-0.35,0.391-0.699,0.781-1.059,1.162c-0.987,1.059-1.995,2.067-3.023,3.013c-0.205,0.206-0.422,0.391-0.638,0.586
|
||||
c-0.349,0.319-0.698,0.627-1.059,0.925c-0.277,0.247-0.565,0.483-0.854,0.72c-0.74,0.606-1.48,1.192-2.23,1.737
|
||||
c-0.309,0.237-0.628,0.463-0.946,0.679c-0.514,0.37-1.038,0.72-1.563,1.059c-0.288,0.195-0.586,0.38-0.885,0.555
|
||||
c-1.049,0.648-2.107,1.244-3.156,1.758c-0.257,0.133-0.514,0.257-0.771,0.38c-0.258,0.123-0.524,0.247-0.802,0.37
|
||||
c-0.34,0.154-0.679,0.298-1.018,0.432c-0.134,0.062-0.268,0.113-0.401,0.154c-0.4,0.165-0.812,0.319-1.213,0.452
|
||||
c-0.504,0.185-1.018,0.339-1.521,0.483c-0.35,0.103-0.709,0.195-1.059,0.277c-0.021,0.011-0.041,0.021-0.072,0.021
|
||||
c-0.35,0.082-0.699,0.165-1.049,0.226c-0.093,0.021-0.184,0.041-0.277,0.051c-0.288,0.051-0.576,0.103-0.864,0.134
|
||||
c-0.411,0.062-0.822,0.113-1.233,0.134c-0.143,0.02-0.277,0.031-0.422,0.031c-0.328,0.021-0.657,0.031-0.977,0.031h-0.03
|
||||
c-0.319,0-0.638-0.01-0.956-0.031c-0.124,0-0.247-0.01-0.371-0.031c-0.287-0.01-0.586-0.042-0.894-0.083
|
||||
c-0.062,0-0.134-0.01-0.195-0.02c-0.381-0.051-0.761-0.113-1.152-0.185c-0.328-0.051-0.657-0.124-0.997-0.206
|
||||
c-1.758-0.401-3.567-1.007-5.397-1.82c-1.563-0.689-3.146-1.521-4.719-2.488c-0.792-0.483-1.584-0.997-2.365-1.542
|
||||
c-0.391-0.278-0.781-0.555-1.172-0.843c-1.224-0.895-2.437-1.871-3.63-2.92c-0.328-0.298-0.657-0.596-0.986-0.905
|
||||
c-0.329-0.298-0.658-0.606-0.977-0.904c-0.803-0.771-1.584-1.573-2.345-2.406c-0.298-0.318-0.596-0.647-0.895-0.987
|
||||
c-0.822-0.925-1.624-1.881-2.385-2.879c-0.299-0.36-0.576-0.73-0.854-1.1c-1.038-1.377-2.025-2.817-2.951-4.308
|
||||
c-0.246-0.401-0.493-0.813-0.729-1.213c-0.288-0.483-0.565-0.976-0.843-1.47c-1.028-1.851-1.975-3.773-2.797-5.758
|
||||
c-0.123-0.288-0.247-0.576-0.35-0.863c-0.165-0.37-0.309-0.751-0.442-1.121c-0.205-0.545-0.4-1.09-0.586-1.635
|
||||
c-0.185-0.545-0.359-1.1-0.534-1.655c-0.165-0.535-0.319-1.069-0.463-1.614c-0.165-0.576-0.318-1.162-0.452-1.758
|
||||
c-0.011-0.062-0.031-0.123-0.041-0.185c-0.195-0.822-0.37-1.655-0.524-2.498c-0.206-1.111-0.37-2.242-0.494-3.383
|
||||
c-0.051-0.36-0.082-0.72-0.113-1.08c-0.041-0.38-0.071-0.751-0.092-1.131c-0.052-0.689-0.083-1.388-0.104-2.087
|
||||
c-0.01-0.453-0.021-0.905-0.021-1.357V52.784c0-23.102,18.723-41.834,41.825-41.855h0.041c3.188,0,6.292,0.359,9.273,1.028
|
||||
c2.725,0.617,5.347,1.501,7.835,2.622c3.393,1.522,6.549,3.475,9.387,5.809c2.385,1.954,4.555,4.154,6.446,6.58
|
||||
C132.607,34.083,135.938,43.038,135.938,52.784z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#ECC19C;" d="M148.613,200.741v0.01H39.538v-0.01c0-6.158,1.018-12.091,2.91-17.612
|
||||
c0.339-0.997,0.709-1.984,1.11-2.961v-0.01c0.4-0.977,0.822-1.933,1.274-2.879c1.8-3.794,4.041-7.341,6.642-10.59
|
||||
c0.658-0.812,1.326-1.604,2.016-2.365c0.339-0.391,0.699-0.771,1.059-1.151c0.36-0.37,0.72-0.74,1.09-1.11
|
||||
c1.841-1.84,3.814-3.526,5.892-5.079c1.038-0.771,2.087-1.491,3.177-2.19c1.09-0.689,2.2-1.347,3.331-1.964
|
||||
c0.021-0.02,0.041-0.02,0.041-0.02c0.442-0.236,0.874-0.493,1.306-0.761c0.854-0.514,1.696-1.069,2.499-1.665
|
||||
c0.411-0.288,0.802-0.586,1.192-0.905c0.925-0.74,1.819-1.532,2.673-2.365c0.277-0.277,0.556-0.555,0.833-0.843
|
||||
c0.575-0.597,1.12-1.224,1.645-1.861c0.258-0.308,0.515-0.627,0.751-0.946c0.247-0.318,0.483-0.647,0.72-0.977
|
||||
c1.83-2.55,3.3-5.356,4.38-8.349c1.306-3.64,2.015-7.557,2.015-11.649l7.948,0.041l8.173,0.041c0,4.04,0.689,7.916,1.964,11.515
|
||||
c1.06,3.002,2.529,5.809,4.329,8.359c1.871,2.652,4.102,5.017,6.631,7.042c0.381,0.309,0.761,0.607,1.142,0.884
|
||||
c0.37,0.278,0.75,0.545,1.141,0.802c0.083,0.062,0.154,0.113,0.237,0.165c0.37,0.247,0.74,0.494,1.131,0.72
|
||||
c0.421,0.257,0.854,0.514,1.285,0.751c0.071,0.02,0.134,0.051,0.185,0.093c0.905,0.504,1.8,1.028,2.674,1.573
|
||||
c0.421,0.257,0.843,0.524,1.254,0.823c0.854,0.555,1.687,1.141,2.498,1.758c0,0.011,0.011,0.011,0.011,0.011h0.01
|
||||
c2.077,1.552,4.041,3.248,5.881,5.079C142.496,172.015,148.613,185.648,148.613,200.741z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#C7D4E2;" d="M148.614,200.743H39.539c0-6.159,1.019-12.091,2.91-17.612
|
||||
c0.339-0.998,0.709-1.984,1.11-2.961c-0.011-0.011,0-0.011,0-0.011c0.391-0.977,0.822-1.933,1.274-2.878
|
||||
c1.8-3.794,4.041-7.341,6.642-10.59c0.658-0.813,1.327-1.604,2.016-2.365c0.339-0.391,0.699-0.771,1.059-1.151
|
||||
c0.36-0.37,0.72-0.74,1.09-1.11c1.841-1.84,3.814-3.527,5.892-5.079c1.038-0.771,2.087-1.491,3.177-2.19
|
||||
c1.09-0.699,2.2-1.357,3.331-1.974c0.021-0.02,0.041-0.01,0.041-0.01v-0.01c0.442-0.247,0.874-0.494,1.306-0.751
|
||||
c1.285-0.781,2.52-1.645,3.671-2.591c0.01,0.01,0.01,0.01,0.021,0.02c5.325,5.449,12.738,8.831,20.964,8.852h0.082
|
||||
c8.225,0,15.669-3.393,21.015-8.842l0.011-0.01c0.729,0.606,1.49,1.172,2.272,1.696c0.082,0.061,0.154,0.113,0.236,0.164
|
||||
c0.37,0.247,0.75,0.483,1.131,0.72c0.422,0.257,0.854,0.504,1.285,0.74c0.072,0.02,0.123,0.061,0.185,0.092
|
||||
c0.905,0.504,1.8,1.028,2.674,1.583c0.421,0.257,0.843,0.524,1.254,0.823c0.854,0.545,1.687,1.141,2.498,1.758h0.021
|
||||
c2.088,1.563,4.051,3.259,5.881,5.089C142.497,172.017,148.614,185.65,148.614,200.743z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#543E36;" d="M135.938,84.05c0,0.453-0.011,0.905-0.021,1.357
|
||||
c-0.02,0.936-0.072,1.871-0.154,2.796c-0.02,0.319-0.052,0.637-0.093,0.956c-0.134,1.326-0.318,2.632-0.555,3.928
|
||||
c-0.083,0.432-0.165,0.853-0.258,1.275c-0.01,0.092-0.03,0.175-0.051,0.257c-0.083,0.432-0.186,0.854-0.288,1.275
|
||||
c-0.052,0.247-0.113,0.483-0.186,0.72c-0.03,0.185-0.082,0.37-0.133,0.545c-0.217,0.843-0.463,1.666-0.721,2.488
|
||||
c-0.123,0.391-0.246,0.771-0.38,1.162c-0.011,0.041-0.031,0.082-0.041,0.123c-0.124,0.349-0.247,0.699-0.37,1.048
|
||||
c-0.041,0.103-0.082,0.205-0.124,0.319c-0.123,0.329-0.246,0.658-0.38,0.987c-0.154,0.401-0.318,0.792-0.483,1.183
|
||||
c-0.144,0.35-0.298,0.699-0.452,1.049c-0.02,0.062-0.052,0.113-0.072,0.174c-0.175,0.37-0.339,0.741-0.514,1.1
|
||||
c-0.175,0.38-0.36,0.761-0.556,1.142c-0.37,0.75-0.771,1.501-1.172,2.231c-0.185,0.329-0.37,0.658-0.556,0.987
|
||||
c-1.583,2.725-3.341,5.285-5.253,7.649c-0.258,0.339-0.524,0.668-0.802,0.987c-0.381,0.462-0.772,0.915-1.162,1.357
|
||||
c-0.35,0.391-0.699,0.781-1.059,1.162c-0.987,1.059-1.995,2.067-3.023,3.013c-0.205,0.206-0.422,0.391-0.638,0.586
|
||||
c-0.349,0.319-0.698,0.627-1.059,0.925c-0.277,0.247-0.565,0.483-0.854,0.72c-0.74,0.606-1.48,1.192-2.23,1.737
|
||||
c-0.309,0.237-0.628,0.463-0.946,0.679c-0.514,0.37-1.038,0.72-1.563,1.059c-0.288,0.195-0.586,0.38-0.885,0.555
|
||||
c-1.049,0.648-2.107,1.244-3.156,1.758c-0.257,0.133-0.514,0.257-0.771,0.38c-0.258,0.123-0.524,0.247-0.802,0.37
|
||||
c-0.34,0.154-0.679,0.298-1.018,0.432c-0.134,0.062-0.268,0.113-0.401,0.154c-0.4,0.165-0.812,0.319-1.213,0.452
|
||||
c-0.504,0.185-1.018,0.339-1.521,0.483c-0.35,0.103-0.709,0.195-1.059,0.277c-0.021,0.011-0.041,0.021-0.072,0.021
|
||||
c-0.35,0.082-0.699,0.165-1.049,0.226c-0.093,0.021-0.184,0.041-0.277,0.051c-0.288,0.051-0.576,0.103-0.864,0.134
|
||||
c-0.411,0.062-0.822,0.113-1.233,0.134c-0.143,0.02-0.277,0.031-0.422,0.031c-0.328,0.021-0.657,0.031-0.977,0.031h-0.03
|
||||
c-0.319,0-0.638-0.01-0.956-0.031c-0.124,0-0.247-0.01-0.371-0.031c-0.287-0.01-0.586-0.042-0.894-0.083
|
||||
c-0.062,0-0.134-0.01-0.195-0.02c-0.381-0.051-0.761-0.113-1.152-0.185c-0.328-0.051-0.657-0.124-0.997-0.206
|
||||
c-1.758-0.401-3.567-1.007-5.397-1.82c-1.563-0.689-3.146-1.521-4.719-2.488c-0.792-0.473-1.573-0.987-2.365-1.542
|
||||
c-0.391-0.278-0.781-0.555-1.172-0.843c-1.224-0.895-2.437-1.871-3.63-2.92c-0.328-0.298-0.657-0.596-0.986-0.905
|
||||
c-0.329-0.298-0.658-0.606-0.977-0.904c-0.803-0.771-1.584-1.573-2.345-2.406c-0.298-0.318-0.596-0.647-0.895-0.987
|
||||
c-0.822-0.925-1.624-1.881-2.385-2.879c-0.299-0.36-0.576-0.73-0.854-1.1c-1.038-1.377-2.025-2.817-2.951-4.308
|
||||
c-0.246-0.401-0.493-0.813-0.729-1.213c-0.288-0.483-0.565-0.976-0.843-1.47c-1.028-1.851-1.975-3.773-2.797-5.758
|
||||
c-0.123-0.288-0.247-0.576-0.35-0.863c-0.165-0.37-0.309-0.751-0.442-1.121c-0.205-0.545-0.4-1.09-0.586-1.635
|
||||
c-0.185-0.545-0.359-1.1-0.534-1.655c-0.165-0.535-0.319-1.069-0.463-1.614c-0.165-0.576-0.318-1.162-0.452-1.758
|
||||
c-0.011-0.062-0.031-0.123-0.041-0.185c-0.195-0.822-0.37-1.655-0.524-2.498c-0.206-1.111-0.37-2.242-0.494-3.383
|
||||
c-0.051-0.36-0.082-0.72-0.113-1.08c-0.041-0.38-0.071-0.751-0.092-1.131c-0.052-0.689-0.083-1.388-0.104-2.087
|
||||
c-0.01-0.453-0.021-0.905-0.021-1.357l6.684,13.14l11.484,5.007l13.581,1.224l10.076,0.915h0.062l9.428,0.854l21.005,1.892
|
||||
L135.938,84.05z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#543E36;" d="M127.023,26.968c-2.046,4.637-4.709,8.945-7.855,12.852
|
||||
c-0.185,0.227-0.37,0.453-0.565,0.679c-6.446,7.762-14.897,13.798-24.562,17.324c-2.54,0.936-5.161,1.696-7.855,2.262
|
||||
c-1.799,0.38-3.629,0.679-5.49,0.895c-2.139,0.236-4.318,0.36-6.528,0.36c-2.529,0-5.007-0.165-7.443-0.483
|
||||
c-2.386-0.298-4.72-0.74-7.002-1.336c-1.306-0.329-2.581-0.709-3.846-1.131c-1.244-0.411-2.457-0.864-3.66-1.357v-4.246
|
||||
c0-23.102,18.723-41.834,41.825-41.855h0.041c3.188,0,6.292,0.359,9.273,1.028c2.725,0.617,5.347,1.501,7.835,2.622
|
||||
c3.393,1.522,6.549,3.475,9.387,5.809C122.962,22.341,125.132,24.542,127.023,26.968z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#543E36;" d="M135.938,52.784v8.235c-7.136-5.521-13.047-12.502-17.314-20.48
|
||||
c-0.01-0.01-0.01-0.031-0.021-0.041c-4.194-7.834-6.796-16.625-7.412-25.92c3.393,1.522,6.549,3.475,9.387,5.809
|
||||
c2.385,1.954,4.555,4.154,6.446,6.58C132.607,34.083,135.938,43.038,135.938,52.784z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#543E36;" d="M57.12,56.013c-0.441,0.771-0.843,1.563-1.244,2.375
|
||||
c-0.153,0.318-0.308,0.658-0.462,0.987c-2.025,4.503-3.044,8.924-3.188,12.914c0,0.113-0.011,0.236-0.011,0.35V56.517
|
||||
c0-0.576,0.021-1.142,0.021-1.697C53.861,55.242,55.485,55.653,57.12,56.013z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#543E36;" d="M131.054,56.013c0.622,1.093,1.177,2.213,1.71,3.361
|
||||
c2.088,4.643,3.11,9.178,3.198,13.268V56.512c0-0.567-0.021-1.134-0.021-1.688C134.318,55.243,132.697,55.648,131.054,56.013z"/>
|
||||
<path style="clip-path:url(#SVGID_2_);fill:#1A1A1A;" d="M130.972,60.167c0-0.175-0.134-0.329-0.309-0.35
|
||||
c-1.48-0.226-8.143-1.142-15.309-1.142c-8.133,0-18.63,2.55-20.46,2.55H93.27c-0.854,0-3.588-0.555-7.084-1.141
|
||||
c-4.02-0.679-9.037-1.409-13.376-1.409c-5.243,0-10.22,0.494-13.088,0.843c-1.049,0.124-1.82,0.236-2.221,0.298
|
||||
c-0.175,0.021-0.309,0.175-0.309,0.35l-0.082,4.369c0,0.154,0.093,0.288,0.236,0.35l0.493,0.175
|
||||
c0.73,0.278,0.669,13.448,4.596,16.738c2.334,1.943,4.411,3.053,13.16,3.053c5.069,0,8.256-1.367,11.279-5.449
|
||||
c2.18-2.93,4.112-9.86,4.112-9.86c0.586-2.858,2.714-3.084,3.054-3.105c0.021,0,0.041,0,0.041,0c0.071,0,2.468,0.041,3.095,3.105
|
||||
c0,0,1.933,6.93,4.112,9.86c3.022,4.082,6.21,5.449,11.278,5.449c8.75,0,10.826-1.11,13.16-3.053
|
||||
c3.928-3.29,3.866-16.46,4.596-16.738l0.494-0.175c0.143-0.062,0.236-0.195,0.236-0.35L130.972,60.167z M86.875,75.753
|
||||
c-1.285,3.043-4.606,6.971-9.284,7.207c-14.034,0.709-14.682-3.208-15.587-6.313c-0.915-3.105-1.151-5.83-0.792-8.935
|
||||
c0.37-3.105,1.152-4.925,2.561-5.84c0.606-0.401,1.265-0.761,2.951-1.018c1.511-0.226,3.845-0.36,7.731-0.36
|
||||
c2.251,0,4.359,0.175,6.24,0.483c4.997,0.802,8.369,2.499,8.369,4.174C89.064,66.294,88.776,71.249,86.875,75.753z
|
||||
M126.159,76.647c-0.904,3.105-1.552,7.022-15.586,6.313c-4.678-0.236-7.999-4.164-9.284-7.207
|
||||
c-1.902-4.503-2.189-9.459-2.189-10.6c0-2.303,6.395-4.658,14.609-4.658c8.215,0,9.53,0.617,10.683,1.378
|
||||
c1.408,0.915,2.189,2.735,2.56,5.84C127.312,70.818,127.075,73.543,126.159,76.647z"/>
|
||||
<g style="clip-path:url(#SVGID_2_);">
|
||||
<path style="fill:#543E36;" d="M94.123,90.65l-0.011,10.138l-0.01,3.547v2.786l-0.011,9.253v0.01l-0.01-0.01h-0.011l-0.03-0.021
|
||||
L53.604,95.771c-0.011-0.062-0.031-0.123-0.041-0.185c-0.195-0.822-0.37-1.655-0.524-2.498c-0.206-1.111-0.37-2.242-0.494-3.383
|
||||
c-0.051-0.36-0.082-0.72-0.113-1.08c-0.041-0.38-0.071-0.751-0.092-1.131c-0.052-0.689-0.083-1.388-0.104-2.087
|
||||
c-0.01-0.453-0.021-0.905-0.021-1.357V71.764c0,0.175,0.011,0.35,0.011,0.524c0.082,2.971,0.555,6.241,1.47,9.582
|
||||
c0.71,2.57,1.594,4.945,2.622,7.063v0.01c2.694,5.604,6.303,9.407,9.623,10.024c0.206,0.031,0.422,0.051,0.628,0.072
|
||||
c1.285,0.144,2.632,0.226,4.02,0.226c5.243,0,9.901-4.215,12.831-5.922c0.021-0.01,0.041-0.021,0.062-0.031
|
||||
c0.154-0.093,0.309-0.185,0.442-0.278c0.041-0.031,0.082-0.051,0.123-0.072c2.468-1.409,6.025-2.303,9.994-2.313H94.123z"/>
|
||||
<path style="fill:#543E36;" d="M135.947,71.764l-0.01,12.286c0,3.085-0.288,6.107-0.822,9.038
|
||||
c-0.217,1.172-0.463,2.333-0.751,3.485l-9.49,13.705l-30.782,6.097h-0.01l-0.011,0.01v-0.01l-0.03-25.727h0.082
|
||||
c3.969,0.01,7.536,0.905,10.004,2.313c0.041,0.021,0.071,0.041,0.113,0.072c0.144,0.093,0.298,0.185,0.452,0.278
|
||||
c0.01,0.01,0.03,0.021,0.051,0.031c2.941,1.707,7.588,5.925,12.832,5.925c1.388,0,2.734-0.082,4.019-0.226
|
||||
c0.216-0.021,0.422-0.041,0.638-0.072c3.311-0.617,6.93-4.421,9.613-10.024v-0.01c1.027-2.118,1.912-4.493,2.621-7.063
|
||||
c0.926-3.393,1.409-6.703,1.471-9.716C135.947,72.021,135.947,71.897,135.947,71.764z"/>
|
||||
</g>
|
||||
<ellipse style="clip-path:url(#SVGID_2_);fill:#ECC19C;" cx="94.074" cy="103.955" rx="10.255" ry="3.17"/>
|
||||
<g style="clip-path:url(#SVGID_2_);">
|
||||
<path style="fill:#435363;" d="M64.131,155.174v56.558h-4.369v-53.37c0.586-0.473,1.172-0.936,1.769-1.378
|
||||
C62.384,156.347,63.247,155.75,64.131,155.174z"/>
|
||||
<polygon style="fill:#435363;" points="124.021,155.185 124.021,200.741 124.021,211.732 128.39,211.732 128.39,200.741
|
||||
128.39,158.372 "/>
|
||||
</g>
|
||||
<g style="clip-path:url(#SVGID_2_);">
|
||||
<g>
|
||||
<polygon style="fill:#141720;" points="82.113,151.713 94.074,166.049 106.036,151.713 "/>
|
||||
<path style="fill:#141720;" d="M94.074,225.437h-7.073l5.11-65.8c0.215,0.837,3.712,0.837,3.927,0l5.11,65.8H94.074z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path style="fill:#E7ECF2;" d="M94.07,151.638l-0.03,0.051l-0.011,0.021l-4.966,8.338l-4.637,7.772l-12.554-17.447
|
||||
c0.401-0.288,0.802-0.596,1.183-0.915c0.01,0.01,0.01,0.01,0.021,0.021c2.518-2.005,4.76-4.359,6.621-6.991l14.343,9.13
|
||||
L94.07,151.638z"/>
|
||||
<path style="fill:#E7ECF2;" d="M116.278,150.373l-12.554,17.447l-4.637-7.772l-4.977-8.338l-0.041-0.072l14.436-9.191
|
||||
c1.871,2.652,4.102,5.017,6.631,7.042C115.518,149.797,115.897,150.096,116.278,150.373z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 16 KiB |
BIN
src/components/layout/img/quasar-logo.png
Normal file
BIN
src/components/layout/img/quasar-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
src/components/layout/img/vue-logo.png
Normal file
BIN
src/components/layout/img/vue-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
81
src/components/layout/toolbar/messagePopover.vue
Normal file
81
src/components/layout/toolbar/messagePopover.vue
Normal file
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<button class="relative-position animate-bounce">
|
||||
<i class="fa fa-2x fa-envelope-o"></i>
|
||||
<span class="floating label bg-dark">5</span>
|
||||
<q-popover self="top right" >
|
||||
<div class="list striped">
|
||||
<p class="caption no-margin text-center text-white bg-teal">Messages from people</p>
|
||||
<div class="item item-link two-lines item-delimiter no-margin"
|
||||
v-for="post in filteredPosts"
|
||||
>
|
||||
<img class="item-primary" :src="randomAvatarUrl()">
|
||||
<div class="item-content has-secondary">
|
||||
<div>{{post.title}}</div>
|
||||
<div>{{randomDate()}}</div>
|
||||
</div>
|
||||
<span class="label bg-red text-white item-secondary no-margin">
|
||||
<i class="left-detail"></i> New
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-popover>
|
||||
</button>
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters, mapMutations } from 'vuex'
|
||||
export default {
|
||||
mounted () {
|
||||
if (this.getPosts.length < 1) {
|
||||
this.requestPosts()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['getPosts']),
|
||||
filteredPosts () {
|
||||
return this.getPosts.slice(0, 5)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setPosts']),
|
||||
randomDate () {
|
||||
return new Date((new Date()) - Math.floor(Math.random() * 10000000000))
|
||||
},
|
||||
randomAvatarUrl () {
|
||||
return `https://api.adorable.io/avatars/face/${this.randomEye()}/${this.randomNose()}/${this.randomMouth()}/${this.randomHexColor()}`
|
||||
},
|
||||
randomHexColor () {
|
||||
return Math.random().toString(16).slice(2, 8)
|
||||
},
|
||||
randomEye () {
|
||||
return this.randomArrayElement(['eyes1', 'eyes10', 'eyes2', 'eyes3', 'eyes4', 'eyes5', 'eyes6', 'eyes7', 'eyes9'])
|
||||
},
|
||||
randomNose () {
|
||||
return this.randomArrayElement(['nose2', 'nose3', 'nose4', 'nose5', 'nose6', 'nose7', 'nose8', 'nose9'])
|
||||
},
|
||||
randomMouth () {
|
||||
return this.randomArrayElement(['mouth1', 'mouth10', 'mouth11', 'mouth3', 'mouth5', 'mouth6', 'mouth7', 'mouth9'])
|
||||
},
|
||||
randomArrayElement (array) {
|
||||
return array[Math.floor((Math.random() * array.length))]
|
||||
},
|
||||
requestPosts () {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.list{
|
||||
max-width: 400px;
|
||||
}
|
||||
.item > img.item-primary:not(.thumbnail) {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
.item > img.item-primary {
|
||||
width: 48px;
|
||||
height: 46px;
|
||||
}
|
||||
.item > .item-secondary {
|
||||
width: 57px;
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
51
src/components/layout/toolbar/toolbar.vue
Normal file
51
src/components/layout/toolbar/toolbar.vue
Normal file
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<div class="toolbar" v-show="getLayoutNeeded">
|
||||
<q-ajax-bar color="#80cbc4"></q-ajax-bar>
|
||||
<router-link :to="'/'" v-if="$router.currentRoute.meta.backButton">
|
||||
<button>
|
||||
<i>arrow_back</i>
|
||||
</button>
|
||||
</router-link>
|
||||
<button class="hide-on-drawer-visible" @click="leftDrawer.open()" v-else >
|
||||
<i>menu</i>
|
||||
</button>
|
||||
<q-toolbar-title :padding="1">
|
||||
Quasar Admin App
|
||||
</q-toolbar-title>
|
||||
<div class="right-itens">
|
||||
<message-popover></message-popover>
|
||||
<a @click="setMobileMode(true)" class="text-white gt-sm inline">
|
||||
<i class="fa fa-3x fa-mobile"></i>
|
||||
</a>
|
||||
<a href="https://github.com/odranoelBR/vue-quasar-admin-example" class="text-white">
|
||||
<i class="fa fa-2x fa-github"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
import { mapMutations, mapGetters } from 'vuex'
|
||||
import messagePopover from './messagePopover.vue'
|
||||
export default {
|
||||
computed: {
|
||||
...mapGetters(['getLayoutNeeded']),
|
||||
leftDrawer () {
|
||||
return this.$parent.$children[1].$refs.leftDrawer
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setMobileMode'])
|
||||
},
|
||||
components: {
|
||||
messagePopover
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.toolbar{
|
||||
min-height: 60px;
|
||||
}
|
||||
.right-itens a, .right-itens button{
|
||||
margin-right: 10px;
|
||||
}
|
||||
</style>
|
||||
96
src/components/views/dashboard/one/cardChart.vue
Normal file
96
src/components/views/dashboard/one/cardChart.vue
Normal file
@@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<div class="card bg-white">
|
||||
<div class="card-title bg-teal text-white">
|
||||
{{cardTitle}}
|
||||
<div class=" float-right">
|
||||
<q-fab icon="keyboard_arrow_left" direction="left" classNames="primary">
|
||||
</q-fab>
|
||||
<button class="primary circular raised gt-sm inline" @click="toImage()">
|
||||
<i>portrait</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<canvas ref="chart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
/* eslint-disable */
|
||||
import Chart from 'chart.js'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
type: 'horizontalBar',
|
||||
chart: '',
|
||||
}
|
||||
},
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
cardTitle: {
|
||||
default () { return 'Graph'}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
data () {
|
||||
this.startChart()
|
||||
},
|
||||
type () {
|
||||
this.chart.destroy()
|
||||
this.startChart()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dataForChart () {
|
||||
return {
|
||||
labels: Object.keys(this.data),
|
||||
datasets: [{
|
||||
data: Object.values(this.data),
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)'
|
||||
]
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
startChart () {
|
||||
let axesStartFromZero = [{
|
||||
ticks: {
|
||||
beginAtZero:true
|
||||
}
|
||||
}]
|
||||
this.chart = new Chart(this.$refs.chart,
|
||||
{
|
||||
type: this.type,
|
||||
data: this.dataForChart,
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: axesStartFromZero,
|
||||
xAxes: axesStartFromZero
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
toImage () {
|
||||
window.open(this.chart.toBase64Image());
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
75
src/components/views/dashboard/one/cardTodo.vue
Normal file
75
src/components/views/dashboard/one/cardTodo.vue
Normal file
@@ -0,0 +1,75 @@
|
||||
<template>
|
||||
<div class="card bg-white">
|
||||
<div class="card-title bg-teal text-white">
|
||||
{{cardTitle}}
|
||||
<div class=" float-right">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="flex">
|
||||
<div class="list item-inset-delimiter auto">
|
||||
<q-infinite-scroll :handler="loadMore" :offset="7">
|
||||
<!-- Content, in this case some <p> tags -->
|
||||
<div class="item" v-for="(todo, index) in showingData">
|
||||
<div class="item-primary">{{index + 1}}</div>
|
||||
<div class="item-content has-secondary">
|
||||
<span v-show="todo.completed" class="completed-line">{{todo.title}}</span>
|
||||
<input v-show="!todo.completed" v-model.lazy="todo.title" class="fit" @change="changeTitle(todo)">
|
||||
</div>
|
||||
<q-toggle class="item-secondary"
|
||||
icon="done"
|
||||
@input="completeTodo(todo)"
|
||||
v-model="todo.completed"
|
||||
></q-toggle>
|
||||
</div>
|
||||
</q-infinite-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
/* eslint-disable */
|
||||
import Chart from 'chart.js'
|
||||
|
||||
export default {
|
||||
mounted () {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
todos: [],
|
||||
actualMaxPosition: 10
|
||||
}
|
||||
},
|
||||
props: ['cardTitle', 'api'],
|
||||
watch: {
|
||||
},
|
||||
computed: {
|
||||
showingData () {
|
||||
return this.todos.slice(0, this.actualMaxPosition)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadMore (index, done) {
|
||||
setTimeout(() => {
|
||||
this.actualMaxPosition += 9
|
||||
done()
|
||||
}, 1000)
|
||||
|
||||
},
|
||||
completeTodo (todo) {
|
||||
},
|
||||
changeTitle (todo) {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
input {
|
||||
padding: 7px 0;
|
||||
font-size: 16px;
|
||||
}
|
||||
.completed-line {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
</style>
|
||||
49
src/components/views/dashboard/one/cardTotal.vue
Normal file
49
src/components/views/dashboard/one/cardTotal.vue
Normal file
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<div class="card text-white" :class="backgroundColor">
|
||||
<div class="card-content ">
|
||||
<div class="row">
|
||||
<div class="width-1of3">
|
||||
<i>{{iconName}}</i>
|
||||
</div>
|
||||
<div class="width-2of3">
|
||||
<p class="text-italic ">{{title}}</p>
|
||||
<h5 ref="number">
|
||||
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/javascript">
|
||||
import CountUp from 'countup.js'
|
||||
export default {
|
||||
props: ['title', 'total', 'backgroundColor', 'iconName'],
|
||||
mounted () {
|
||||
this.countUp.start()
|
||||
},
|
||||
computed: {
|
||||
countUp () {
|
||||
return new CountUp(this.$refs.number, 0, this.total, 0, 2.5, this.options)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
total () {
|
||||
this.countUp.start()
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
options: {
|
||||
separator: '.'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
i {
|
||||
font-size: 54px;
|
||||
}
|
||||
</style>
|
||||
90
src/components/views/dashboard/one/dashboard.vue
Normal file
90
src/components/views/dashboard/one/dashboard.vue
Normal file
@@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<div class="layout-padding ">
|
||||
<div class="flex wrap gutter">
|
||||
<div class="width-1of3 sm-auto">
|
||||
<cardTotal
|
||||
title="Total Posts"
|
||||
background-color="bg-teal-9"
|
||||
icon-name="local_post_office"
|
||||
:total="totalPosts">
|
||||
</cardTotal>
|
||||
</div>
|
||||
<div class="width-1of3 sm-auto">
|
||||
<cardTotal
|
||||
title="Total comments"
|
||||
background-color="bg-teal-7"
|
||||
icon-name="comment"
|
||||
:total="totalComments">
|
||||
</cardTotal>
|
||||
</div>
|
||||
<div class="width-1of3 sm-auto">
|
||||
<cardTotal
|
||||
title="Static total"
|
||||
background-color="bg-teal-5"
|
||||
icon-name="repeat_one"
|
||||
:total="50004">
|
||||
</cardTotal>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex wrap gutter">
|
||||
<div class="width-1of2 lg-width-1of3 sm-auto">
|
||||
<card-chart
|
||||
card-title="Total Graph"
|
||||
:data="dataForGraph"
|
||||
></card-chart>
|
||||
</div>
|
||||
<div class="auto">
|
||||
<knob-statistics
|
||||
card-title="General statistics">
|
||||
</knob-statistics>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex wrap gutter">
|
||||
<div class="width-4of5 sm-width-1of1">
|
||||
<card-todo
|
||||
card-title="Generic todos"
|
||||
api="todos">
|
||||
</card-todo>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
import cardChart from './cardChart.vue'
|
||||
import cardTotal from './cardTotal.vue'
|
||||
import cardTodo from './cardTodo.vue'
|
||||
import knobStatistics from './knobStatistics.vue'
|
||||
import { mapMutations } from 'vuex'
|
||||
export default {
|
||||
name: 'Home',
|
||||
mounted () {
|
||||
// Axios.all not working
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
totalPosts: 0,
|
||||
totalComments: 0,
|
||||
totalTodos: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dataForGraph () {
|
||||
return {
|
||||
posts: this.totalPosts,
|
||||
todos: this.totalTodos,
|
||||
comments: this.totalComments
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setPosts'])
|
||||
},
|
||||
components: {
|
||||
cardTotal,
|
||||
cardChart,
|
||||
cardTodo,
|
||||
knobStatistics
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
41
src/components/views/dashboard/one/knobStatistics.vue
Normal file
41
src/components/views/dashboard/one/knobStatistics.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script type="text/javascript">
|
||||
/* eslint-disable */
|
||||
//import { Toast } from 'quasar'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
minExpenses: 0,
|
||||
minIncome: 0,
|
||||
maxIncome: 5000,
|
||||
currentIncome: 998,
|
||||
currentExpenses: 125,
|
||||
doubleRangeMinMax: {
|
||||
min: 0,
|
||||
max: 5000
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
currentIncome () {
|
||||
if (this.currentIncome < this.currentExpenses){
|
||||
this.currentExpenses = this.currentIncome
|
||||
//Toast.create.negative({html: `You're in financial trouble.`})
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
maxExpenses () {
|
||||
return this.currentIncome
|
||||
}
|
||||
|
||||
},
|
||||
props: ['cardTitle'],
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
</style>
|
||||
66
src/components/views/dashboard/one/tagKnob.vue
Normal file
66
src/components/views/dashboard/one/tagKnob.vue
Normal file
@@ -0,0 +1,66 @@
|
||||
<template>
|
||||
<div class="text-center">
|
||||
<span class="tag label text-white rotate rotate-270 shadow-2" :class="tagClasses">
|
||||
<q-knob
|
||||
class="rotate-90"
|
||||
v-model="value"
|
||||
:size="size"
|
||||
style="font-size: 1.9rem"
|
||||
color="#fff"
|
||||
:track-color="trackColor"
|
||||
:min="min"
|
||||
:max="max"
|
||||
readonly
|
||||
:placeholder="fullPlaceHolder"
|
||||
></q-knob>
|
||||
</span>
|
||||
<span class="title block" :style="{color: titleColor}">{{title}}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/javascript">
|
||||
export default {
|
||||
|
||||
props: {
|
||||
value: {
|
||||
required: true
|
||||
},
|
||||
size: {
|
||||
required: true
|
||||
},
|
||||
min: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
max: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
title: {},
|
||||
titleColor: {},
|
||||
tagClasses: {},
|
||||
trackColor: {},
|
||||
placeholderBefore: {}
|
||||
},
|
||||
computed: {
|
||||
fullPlaceHolder () {
|
||||
return this.placeholderBefore ? `${this.placeholderBefore}${this.value}` : this.value
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.label.tag{
|
||||
margin-left: 0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 0.8rem;
|
||||
}
|
||||
.title {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
112
src/components/views/login/login.vue
Normal file
112
src/components/views/login/login.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="card text-white text-center width-3of4 bg-width-2of5 gt-bg-width-1of4 sm-auto " id="login">
|
||||
<div class="card-title" :class="finalBgColor">
|
||||
<svg id="logo" viewBox="0 0 483 483"
|
||||
style="enable-background:new 0 0 460 460;"
|
||||
xml:space="preserve" width="128px" height="128px"
|
||||
v-html="logoMethod">
|
||||
</svg>
|
||||
<h4>{{logo}}</h4>
|
||||
</div>
|
||||
<div class="card-content bg-white ">
|
||||
<div class="stacked-label">
|
||||
<input required class="full-width" type="email" v-model="email">
|
||||
<label>Email</label>
|
||||
</div>
|
||||
<div class="stacked-label">
|
||||
<input required class="full-width" type="password" v-model="password">
|
||||
<label>Password</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-actions inline-block vertical-middle">
|
||||
<button class="teal fit " :class="buttonClass" @click="login()">Login</button>
|
||||
<button class="red fit" :class="buttonClass" @click="login()">Login Google</button>
|
||||
<button class="blue fit" :class="buttonClass" @click="login()">Login Facebook</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
/* eslint-disable */
|
||||
import {mapMutations} from 'vuex'
|
||||
import Vivus from 'vivus'
|
||||
import logoData from './logoData'
|
||||
import { Platform } from 'quasar'
|
||||
export default {
|
||||
mounted () {
|
||||
this.setLayoutNeeded(false)
|
||||
this.setIsLoginPage(true)
|
||||
this.startAnimation()
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.setLayoutNeeded(true)
|
||||
this.setIsLoginPage(false)
|
||||
},
|
||||
computed: {
|
||||
heightSize (){
|
||||
if (Platform.is.desktop) {
|
||||
return 'items-center'
|
||||
}
|
||||
return ''
|
||||
},
|
||||
finalBgColor () {
|
||||
return `bg-${this.bgColor}-${this.toneColor}`
|
||||
},
|
||||
logoMethod () {
|
||||
return logoData[this.logo]
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
logos: Object.keys(logoData),
|
||||
logo: 'Digitalizer',
|
||||
email: 'quasar@admin.com',
|
||||
password: '123456',
|
||||
bgColor: 'purple',
|
||||
toneColor: 10,
|
||||
colors: ['purple', 'blue', 'red', 'green', 'amber'],
|
||||
colorTones: ['2', '4', '6', '8', '10'],
|
||||
buttonClasses: ['normal','outline', 'clear', 'push', 'bordered', 'round'],
|
||||
buttonClass: 'normal',
|
||||
vivus: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setLayoutNeeded', 'setIsLoginPage']),
|
||||
login () {
|
||||
this.setLayoutNeeded(true)
|
||||
this.setIsLoginPage(false)
|
||||
this.$router.push('/')
|
||||
},
|
||||
startAnimation () {
|
||||
this.vivus = new Vivus('logo', {
|
||||
duration: 400,
|
||||
forceRender: false
|
||||
}, function(element) {
|
||||
for (let item of element.el.children[0].children) {
|
||||
item.setAttribute('style', 'fill:white')
|
||||
item.setAttribute('style', 'fill:white')
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.card {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.card-content {
|
||||
min-height: 160px;
|
||||
}
|
||||
button {
|
||||
margin-bottom: 4%;
|
||||
}
|
||||
h4 {
|
||||
font-weight: 300;
|
||||
}
|
||||
</style>
|
||||
90
src/components/views/login/logoData.js
Normal file
90
src/components/views/login/logoData.js
Normal file
@@ -0,0 +1,90 @@
|
||||
/* eslint-disable */
|
||||
export default {
|
||||
Digitalizer: `<g>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M259.476,280.364V247.5c0-12.958-10.542-23.5-23.5-23.5s-23.5,10.542-23.5,23.5v29.672 c0,35.757-13.173,70.087-37.094,96.665l-32.981,36.646c-2.771,3.079-2.521,7.821,0.558,10.593c3.078,2.771,7.82,2.521,10.592-0.558 l32.981-36.646c26.403-29.338,40.944-67.231,40.944-106.7V247.5c0-4.687,3.813-8.5,8.5-8.5s8.5,3.813,8.5,8.5v32.864 c0,44.003-16.301,86.167-45.901,118.727l-32.149,35.364c-2.786,3.064-2.56,7.809,0.505,10.595c1.437,1.307,3.242,1.95,5.042,1.95 c2.04,0,4.072-0.827,5.552-2.455l32.148-35.364C241.789,373.854,259.476,328.106,259.476,280.364z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M291.476,247.5c0-30.603-24.897-55.5-55.5-55.5s-55.5,24.897-55.5,55.5v29.672c0,27.839-10.256,54.566-28.879,75.258 l-23.447,26.053c-2.771,3.079-2.521,7.821,0.558,10.593c3.079,2.771,7.82,2.519,10.592-0.558l23.447-26.053 c21.106-23.451,32.73-53.742,32.73-85.293V247.5c0-22.332,18.168-40.5,40.5-40.5c22.332,0,40.5,18.168,40.5,40.5v32.864 c0,51.979-19.256,101.789-54.223,140.252l-27.125,29.839c-2.787,3.064-2.561,7.809,0.504,10.595c1.437,1.307,3.242,1.95,5.042,1.95 c2.04,0,4.072-0.827,5.552-2.455l27.126-29.839c37.481-41.23,58.123-94.622,58.123-150.342V247.5z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M323.476,247.5c0-48.248-39.252-87.5-87.5-87.5s-87.5,39.252-87.5,87.5v29.672c0,19.92-7.339,39.045-20.665,53.851 l-21.112,23.458c-2.771,3.079-2.521,7.821,0.558,10.593c3.078,2.771,7.821,2.519,10.592-0.558l21.112-23.458 c15.809-17.565,24.515-40.254,24.515-63.886V247.5c0-39.977,32.523-72.5,72.5-72.5s72.5,32.523,72.5,72.5v32.864 c0,59.958-22.212,117.412-62.545,161.777l-7.507,8.258c-2.786,3.065-2.56,7.809,0.505,10.595c1.437,1.306,3.243,1.95,5.042,1.95 c2.04,0,4.072-0.827,5.552-2.455l7.506-8.258c42.848-47.133,66.446-108.169,66.446-171.867V247.5z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M116.476,247.5c0,4.143,3.358,7.5,7.5,7.5s7.5-3.357,7.5-7.5c0-25.255,9.169-49.651,25.819-68.695 c16.495-18.867,39.134-31.205,63.746-34.741c4.1-0.589,6.946-4.391,6.357-8.49c-0.589-4.1-4.394-6.942-8.49-6.357 c-28.16,4.046-54.052,18.15-72.906,39.716C126.962,190.71,116.476,218.613,116.476,247.5z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M131.476,277.172c0-4.143-3.358-7.5-7.5-7.5s-7.5,3.357-7.5,7.5c0,12.002-4.421,23.523-12.449,32.443l-18.779,20.867 c-2.771,3.078-2.521,7.82,0.558,10.592c1.434,1.29,3.227,1.925,5.015,1.925c2.052,0,4.097-0.838,5.577-2.483l18.779-20.866 C125.687,307.971,131.476,292.886,131.476,277.172z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M340.755,344.123c-4.009-1.044-8.105,1.351-9.155,5.357c-2.769,10.579-6.213,21.096-10.24,31.258 c-1.526,3.851,0.359,8.21,4.21,9.735c0.907,0.359,1.841,0.529,2.761,0.529c2.985,0,5.808-1.795,6.975-4.739 c4.249-10.725,7.884-21.822,10.806-32.986C347.16,349.271,344.761,345.172,340.755,344.123z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M315.791,158.632c-3.081-2.771-7.823-2.517-10.592,0.563s-2.517,7.822,0.563,10.591 c22.061,19.832,34.713,48.157,34.713,77.714v32.864c0,12.473-0.86,25.042-2.557,37.359c-0.565,4.104,2.303,7.888,6.406,8.453 c0.347,0.048,0.692,0.071,1.033,0.071c3.688,0,6.903-2.722,7.42-6.478c1.79-12.993,2.698-26.251,2.698-39.406V247.5 C355.476,213.695,341.011,181.304,315.791,158.632z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M280.729,153.076c1.041,0.496,2.138,0.73,3.219,0.73c2.803,0,5.492-1.579,6.777-4.278c1.781-3.739,0.192-8.215-3.547-9.995 c-10.806-5.145-22.291-8.616-34.136-10.317c-4.106-0.585-7.901,2.258-8.49,6.357s2.257,7.901,6.357,8.49 C261.257,145.55,271.289,148.582,280.729,153.076z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M235.976,96c-2.806,0-5.644,0.078-8.437,0.232c-4.136,0.228-7.304,3.766-7.076,7.901c0.229,4.136,3.763,7.321,7.902,7.075 c2.519-0.139,5.079-0.209,7.61-0.209c75.266,0,136.5,61.233,136.5,136.5v32.864c0,4.143,3.358,7.5,7.5,7.5s7.5-3.357,7.5-7.5V247.5 C387.476,163.963,319.513,96,235.976,96z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M153.972,136.693c1.477,0,2.97-0.436,4.275-1.343c12.478-8.677,26.182-15.155,40.733-19.258 c3.987-1.124,6.308-5.268,5.184-9.254s-5.269-6.304-9.254-5.184c-16.16,4.556-31.376,11.749-45.226,21.379 c-3.401,2.365-4.241,7.039-1.876,10.439C149.265,135.57,151.599,136.693,153.972,136.693z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M99.476,277.172V247.5c0-34.89,13.213-68.118,37.205-93.565c2.841-3.014,2.702-7.76-0.312-10.602 s-7.761-2.701-10.602,0.312C99.14,171.886,84.476,208.77,84.476,247.5v29.672c0,4.083-1.504,8.002-4.234,11.035l-9.248,10.275 c-2.771,3.079-2.521,7.821,0.558,10.592c1.433,1.291,3.227,1.926,5.015,1.926c2.052,0,4.096-0.837,5.577-2.482l9.248-10.275 C96.605,292.449,99.476,284.966,99.476,277.172z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M409.951,189.104c-8.226-24.446-21.299-46.531-38.856-65.642c-2.803-3.05-7.547-3.252-10.597-0.449 c-3.05,2.803-3.251,7.547-0.449,10.598c16.127,17.554,28.134,37.834,35.686,60.276c1.054,3.133,3.976,5.11,7.107,5.11 c0.793,0,1.6-0.127,2.393-0.394C409.16,197.282,411.272,193.029,409.951,189.104z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M295.247,73.822c-3.917-1.341-8.183,0.748-9.524,4.668c-1.341,3.919,0.749,8.183,4.668,9.523 c16.538,5.659,32.065,13.857,46.15,24.369c1.347,1.005,2.92,1.489,4.48,1.489c2.286,0,4.544-1.041,6.017-3.015 c2.478-3.319,1.794-8.019-1.525-10.496C330.176,88.916,313.264,79.986,295.247,73.822z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M119.442,125.908C150.991,95.659,192.377,79,235.976,79c8.096,0,16.237,0.583,24.196,1.731 c4.103,0.598,7.903-2.252,8.495-6.352c0.592-4.1-2.251-7.902-6.351-8.494C253.648,64.635,244.786,64,235.976,64 c-47.487,0-92.56,18.141-126.915,51.081c-34.248,32.838-54.277,76.905-56.397,124.084c-0.186,4.138,3.018,7.644,7.155,7.829 c0.115,0.006,0.229,0.008,0.343,0.008c3.987,0,7.306-3.14,7.487-7.163C69.594,196.527,87.988,156.066,119.442,125.908z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M235.976,32c-16.772,0-33.485,1.944-49.674,5.778c-4.031,0.954-6.524,4.996-5.57,9.026c0.955,4.03,4.997,6.524,9.027,5.569 C204.817,48.809,220.366,47,235.976,47c54.996,0,106.332,21.911,144.55,61.695c1.473,1.533,3.439,2.305,5.41,2.305 c1.869,0,3.741-0.694,5.195-2.091c2.987-2.87,3.083-7.618,0.213-10.604c-19.913-20.729-43.304-37.036-69.522-48.465 C294.666,38.002,265.783,32,235.976,32z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M67.507,125.404c1.372,1.074,3.001,1.595,4.619,1.595c2.227,0,4.431-0.987,5.91-2.876 c21.375-27.302,49.515-48.717,81.377-61.932c3.826-1.587,5.642-5.975,4.055-9.801s-5.977-5.644-9.801-4.055 c-34.241,14.201-64.478,37.21-87.441,66.539C63.672,118.137,64.246,122.851,67.507,125.404z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M131.983,38.725c1.094,0,2.205-0.24,3.255-0.748C166.816,22.73,200.709,15,235.976,15c18.378,0,36.682,2.162,54.401,6.426 c4.025,0.966,8.077-1.51,9.046-5.537c0.969-4.027-1.51-8.078-5.538-9.047C275.019,2.302,255.535,0,235.976,0 c-37.544,0-73.631,8.232-107.259,24.469c-3.73,1.801-5.294,6.285-3.493,10.015C126.517,37.163,129.195,38.725,131.983,38.725z" />
|
||||
<path fill="none" stroke="#FFFFFF" stroke-width="6" d="M321.724,31.383c7.732,3.079,15.385,6.619,22.746,10.52c1.119,0.594,2.321,0.875,3.505,0.875 c2.688,0,5.287-1.449,6.633-3.99c1.939-3.66,0.545-8.199-3.115-10.139c-7.837-4.153-15.986-7.922-24.22-11.201 c-3.849-1.533-8.21,0.345-9.743,4.192C315.998,25.488,317.876,29.851,321.724,31.383z" />
|
||||
</svg>`,
|
||||
Keytronic:
|
||||
`<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M478.665,72c0-39.704-32.296-72-72-72c-19.704,0-38.496,8.184-52,22.288C341.161,8.184,322.369,0,302.665,0 c-39.704,0-72,32.296-72,72c0,24.752,12.456,47.36,33.376,60.688L275.353,144L134.665,284.688l-26.344-26.344 c-3.128-3.128-8.184-3.128-11.312,0l-32,32c-3.128,3.128-3.128,8.184,0,11.312L91.353,328l-12.688,12.688l-26.344-26.344 c-3.128-3.128-8.184-3.128-11.312,0l-33,33c-3.128,3.128-3.128,8.184,0,11.312L34.353,385L4.345,415.008 c-3.128,3.128-3.128,8.184,0,11.312l52,52c1.56,1.56,3.608,2.344,5.656,2.344s4.096-0.784,5.656-2.344l51.008-51.008 l26.344,26.344c3.128,3.128,8.184,3.128,11.312,0l40-40c3.128-3.128,3.128-8.184,0-11.312L169.977,376l168.688-168.688 l7.312,7.312C359.305,235.544,381.913,248,406.665,248c39.704,0,72-32.296,72-72c0-19.704-8.184-38.496-22.288-52 C470.481,110.496,478.665,91.704,478.665,72z M462.665,176c0,30.872-25.128,56-56,56c-19.488,0-37.272-9.944-47.584-26.6 c-0.328-0.52-0.712-1.008-1.152-1.448l-13.608-13.608c-3.128-3.128-8.184-3.128-11.312,0l-180,180 c-3.128,3.128-3.128,8.184,0,11.312L179.353,408l-28.688,28.688l-26.344-26.344c-3.128-3.128-8.184-3.128-11.312,0l-51.008,51.008 l-40.688-40.688l30.008-30.008c3.128-3.128,3.128-8.184,0-11.312L24.977,353l21.688-21.688l26.344,26.344 c3.128,3.128,8.184,3.128,11.312,0l24-24c3.128-3.128,3.128-8.184,0-11.312L81.977,296l20.688-20.688l26.344,26.344 c3.128,3.128,8.184,3.128,11.312,0l152-152c3.128-3.128,3.128-8.184,0-11.312l-17.608-17.608c-0.44-0.44-0.92-0.824-1.448-1.152 c-16.656-10.312-26.6-28.096-26.6-47.584c0-30.872,25.128-56,56-56c17.96,0,34.968,8.768,45.504,23.456c3,4.184,10,4.184,13,0 C371.697,24.768,388.705,16,406.665,16c30.872,0,56,25.128,56,56c0,17.96-8.768,34.968-23.456,45.504 c-2.096,1.504-3.336,3.92-3.336,6.496s1.24,5,3.336,6.496C453.897,141.032,462.665,158.04,462.665,176z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect fill="none" stroke-width="6" x="173.811" y="228.009" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -91.1265 252.0189)" width="169.678" height="16" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect fill="none" stroke-width="6" x="163.35" y="311.983" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -175.1045 217.2252)" width="22.624" height="16" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M406.665,40c-17.648,0-32,14.352-32,32s14.352,32,32,32s32-14.352,32-32S424.313,40,406.665,40z M406.665,88 c-8.824,0-16-7.176-16-16s7.176-16,16-16c8.824,0,16,7.176,16,16S415.489,88,406.665,88z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect fill="none" stroke-width="6" x="310.663" y="92.674" transform="matrix(0.7071 -0.7071 0.7071 0.7071 19.8046 255.7854)" width="16" height="22.624" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect fill="none" stroke-width="6" x="342.661" y="124.674" transform="matrix(0.7071 -0.7071 0.7071 0.7071 6.5493 287.7842)" width="16" height="22.624" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<rect fill="none" stroke-width="6" x="374.659" y="156.674" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.706 319.7831)" width="16" height="22.624" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M470.665,344h-14.032c-0.44-1.112-0.896-2.216-1.392-3.328l9.928-9.928c3.128-3.128,3.128-8.184,0-11.312l-33.936-33.936 c-3.128-3.128-8.184-3.128-11.312,0l-9.928,9.928c-1.112-0.496-2.216-0.952-3.328-1.392V280c0-4.424-3.576-8-8-8h-48 c-4.424,0-8,3.576-8,8v14.032c-1.112,0.44-2.216,0.896-3.328,1.392l-9.928-9.928c-3.128-3.128-8.184-3.128-11.312,0 l-33.936,33.936c-3.128,3.128-3.128,8.184,0,11.312l9.928,9.928c-0.496,1.112-0.952,2.216-1.392,3.328h-14.032 c-4.424,0-8,3.576-8,8v48c0,4.424,3.576,8,8,8h14.032c0.44,1.112,0.896,2.216,1.392,3.328l-9.928,9.928 c-3.128,3.128-3.128,8.184,0,11.312l33.936,33.936c3.128,3.128,8.184,3.128,11.312,0l9.928-9.928 c1.112,0.496,2.216,0.952,3.328,1.392V472c0,4.424,3.576,8,8,8h48c4.424,0,8-3.576,8-8v-14.032 c1.112-0.44,2.216-0.896,3.328-1.392l9.928,9.928c3.128,3.128,8.184,3.128,11.312,0l33.936-33.936 c3.128-3.128,3.128-8.184,0-11.312l-9.928-9.928c0.496-1.112,0.952-2.216,1.392-3.328h14.032c4.424,0,8-3.576,8-8v-48 C478.665,347.576,475.089,344,470.665,344z M462.665,392h-11.672c-3.496,0-6.576,2.264-7.632,5.592 c-1.216,3.864-2.856,7.8-4.88,11.672c-1.616,3.104-1.032,6.888,1.44,9.36l8.288,8.288l-22.624,22.624l-8.288-8.288 c-2.472-2.472-6.256-3.056-9.36-1.44c-3.872,2.024-7.808,3.664-11.672,4.88c-3.336,1.064-5.6,4.144-5.6,7.64V464h-32v-11.672 c0-3.496-2.264-6.576-5.592-7.632c-3.864-1.216-7.8-2.856-11.672-4.88c-3.104-1.616-6.88-1.032-9.36,1.44l-8.288,8.288 l-22.624-22.624l8.288-8.288c2.472-2.472,3.056-6.256,1.44-9.36c-2.024-3.872-3.664-7.808-4.88-11.672 c-1.064-3.336-4.144-5.6-7.64-5.6h-11.672v-32h11.672c3.496,0,6.576-2.264,7.632-5.592c1.216-3.864,2.856-7.8,4.88-11.672 c1.616-3.104,1.032-6.888-1.44-9.36l-8.288-8.288l22.624-22.624l8.288,8.288c2.48,2.48,6.256,3.048,9.36,1.44 c3.872-2.024,7.808-3.664,11.672-4.88c3.336-1.064,5.6-4.144,5.6-7.64V288h32v11.672c0,3.496,2.264,6.576,5.592,7.632 c3.864,1.216,7.8,2.856,11.672,4.88c3.104,1.608,6.888,1.04,9.36-1.44l8.288-8.288l22.624,22.624l-8.288,8.288 c-2.472,2.472-3.056,6.256-1.44,9.36c2.024,3.872,3.664,7.808,4.88,11.672c1.064,3.336,4.144,5.6,7.64,5.6h11.672V392z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M374.665,328c-26.472,0-48,21.528-48,48s21.528,48,48,48s48-21.528,48-48S401.137,328,374.665,328z M374.665,408 c-17.648,0-32-14.352-32-32s14.352-32,32-32s32,14.352,32,32S392.313,408,374.665,408z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M54.665,168h-16c0,13.232-10.768,24-24,24v16c13.232,0,24,10.768,24,24h16c0-13.232,10.768-24,24-24v-16 C65.433,192,54.665,181.232,54.665,168z M46.665,208.248c-2.336-3.144-5.104-5.912-8.248-8.248 c3.144-2.336,5.912-5.104,8.248-8.248c2.336,3.144,5.104,5.912,8.248,8.248C51.769,202.336,49.001,205.104,46.665,208.248z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M150.665,120h-16c0,13.232-10.768,24-24,24v16c13.232,0,24,10.768,24,24h16c0-13.232,10.768-24,24-24v-16 C161.433,144,150.665,133.232,150.665,120z M142.665,160.248c-2.336-3.144-5.104-5.912-8.248-8.248 c3.144-2.336,5.912-5.104,8.248-8.248c2.336,3.144,5.104,5.912,8.248,8.248C147.769,154.336,145.001,157.104,142.665,160.248z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path fill="none" stroke-width="6" d="M70.665,48h-16c0,13.232-10.768,24-24,24v16c13.232,0,24,10.768,24,24h16c0-13.232,10.768-24,24-24V72 C81.433,72,70.665,61.232,70.665,48z M62.665,88.248c-2.336-3.144-5.104-5.912-8.248-8.248c3.144-2.336,5.912-5.104,8.248-8.248 c2.336,3.144,5.104,5.912,8.248,8.248C67.769,82.336,65.001,85.104,62.665,88.248z" stroke="#FFFFFF"/>
|
||||
</g>
|
||||
</g>
|
||||
`,
|
||||
Molectron: `
|
||||
<path stroke="#FFFFFF" fill="none" stroke-width="6" d="m398.559,166.02c-8.85-3.404-18.292-6.493-28.22-9.265 2.563-9.984 4.609-19.706 6.087-29.073 7.689-48.757-0.808-82.959-23.925-96.306-6.72-3.88-14.443-5.848-22.954-5.848-26.882,0-60.85,19.965-95.118,53.681-7.486-7.352-15.006-14.105-22.502-20.167-38.379-31.038-72.25-40.781-95.365-27.434-14.856,8.577-23.891,26.093-26.126,50.652-0.376,4.125 2.664,7.773 6.789,8.148 4.138,0.382 7.772-2.664 8.148-6.789 1.238-13.594 5.484-31.398 18.688-39.021 17.11-9.881 45.699-0.365 78.434,26.106 7.143,5.776 14.314,12.217 21.461,19.233-14.373,15.293-28.676,32.894-42.41,52.347-24.16,2.199-47.172,5.888-68.291,10.948-3.698-14.376-6.238-28.093-7.491-40.827-0.405-4.122-4.059-7.134-8.198-6.729-4.122,0.405-7.135,4.076-6.729,8.198 1.326,13.474 4.008,27.966 7.917,43.133-9.596,2.706-18.73,5.712-27.311,9.012-46.072,17.72-71.443,42.18-71.443,68.873s25.371,51.153 71.441,68.872c8.85,3.404 18.292,6.493 28.22,9.265-2.563,9.984-4.609,19.706-6.087,29.073-7.689,48.757 0.808,82.959 23.925,96.306 6.72,3.88 14.443,5.848 22.954,5.848 26.573,0 60.071-19.516 93.938-52.531 7.255,7.086 14.54,13.609 21.803,19.482 27.161,21.966 52.059,33.266 72.489,33.265 8.438-0.001 16.119-1.93 22.876-5.831 23.117-13.347 31.614-47.549 23.925-96.306-1.477-9.366-3.523-19.087-6.086-29.07 15.439-4.252 29.64-9.26 42.218-14.96 3.773-1.71 5.445-6.154 3.735-9.927-1.71-3.773-6.155-5.446-9.927-3.735-11.912,5.398-25.377,10.15-40.042,14.192-6.063-20.261-14.137-41.412-23.976-62.808 10.281-22.122 18.685-44.004 24.943-64.936 55.665,15.586 88.651,40.202 88.651,63.801 0,15.247-13.296,27.827-24.45,35.694-3.385,2.388-4.193,7.067-1.806,10.452 2.388,3.386 7.067,4.193 10.452,1.806 20.153-14.215 30.804-30.797 30.804-47.952 0-26.693-25.371-51.153-71.441-68.872zm-69.013-125.491c5.844,7.10543e-15 11.044,1.291 15.454,3.838 17.112,9.88 23.166,39.396 16.607,80.979-1.405,8.907-3.35,18.159-5.789,27.669-21.207-5.028-44.299-8.68-68.532-10.835-13.596-19.242-27.866-36.839-42.375-52.253 2.655-2.618 5.312-5.158 7.964-7.602 29.252-26.953 56.48-41.796 76.671-41.796zm-95.096,60.152c11.317,12.062 22.5,25.517 33.323,40.102-10.769-0.587-21.712-0.891-32.773-0.891-11.431,0-22.738,0.321-33.855,0.947 10.808-14.56 22.006-28.07 33.305-40.158zm-.053,269.657c-11.718-12.42-23.296-26.341-34.486-41.466 11.514,0.674 23.234,1.02 35.089,1.02 11.419,0 22.732-0.333 33.871-0.969-11.18,15.064-22.777,29.01-34.474,41.415zm.603-55.446c-16.115,0-31.578-0.624-46.314-1.784-8.277-12.076-16.284-24.78-23.907-37.984-7.503-12.995-14.405-26.107-20.657-39.155 6.49-13.661 13.707-27.412 21.596-41.077 7.64-13.232 15.75-26.063 24.177-38.307 14.374-1.099 29.429-1.693 45.105-1.693 15.273,0 29.956,0.564 43.994,1.609 8.434,12.267 16.59,25.185 24.349,38.623 7.85,13.597 15.034,27.279 21.5,40.873-6.219,12.942-13.091,25.957-20.56,38.894-7.625,13.207-15.72,26.015-24.13,38.239-14.716,1.158-29.83,1.762-45.153,1.762zm-65.615-3.655c-18.453-2.132-35.582-5.129-51.205-8.81 4.744-15.789 10.758-32.16 17.929-48.79 4.898,9.688 10.128,19.373 15.679,28.987 5.668,9.818 11.549,19.371 17.597,28.613zm1.19-152.829c-6.111,9.318-12.078,18.991-17.847,28.984-5.933,10.276-11.499,20.61-16.677,30.928-7.543-17.318-13.858-34.376-18.788-50.749 16.203-3.859 34.042-6.983 53.312-9.163zm-155.575,76.484c0-23.472 32.634-47.951 87.757-63.55 6.235,20.802 14.601,42.62 24.805,64.647-9.813,21.362-17.865,42.477-23.913,62.705-55.663-15.587-88.649-40.203-88.649-63.802zm125.454,194.363c-5.844,0-11.044-1.291-15.454-3.838-17.112-9.88-23.166-39.396-16.607-80.979 1.405-8.907 3.35-18.159 5.789-27.669 20.518,4.865 42.8,8.441 66.173,10.619 13.951,19.807 28.618,37.883 43.53,53.648-2.254,2.201-4.509,4.348-6.76,6.423-29.252,26.954-56.48,41.796-76.671,41.796zm220.214-84.584c6.559,41.583 0.505,71.099-16.607,80.979-17.113,9.879-45.699,0.364-78.434-26.106-6.893-5.574-13.814-11.767-20.712-18.499 14.761-15.578 29.462-33.603 43.563-53.579 23.432-2.151 45.822-5.697 66.389-10.509 2.445,9.526 4.394,18.793 5.801,27.714zm-9.83-42.153c-16.064,3.733-33.311,6.67-51.339,8.745 6.085-9.283 12.027-18.918 17.773-28.871 5.517-9.556 10.713-19.161 15.579-28.757 7.195,16.66 13.228,33.063 17.987,48.883zm-17.918-84.145c-5.152-10.259-10.688-20.532-16.587-30.749-5.818-10.078-11.859-19.878-18.077-29.348 19.355,2.146 37.276,5.243 53.564,9.081-4.955,16.493-11.302,33.623-18.9,51.016z"/>
|
||||
<path stroke="#FFFFFF" fill="none" stroke-width="6" d="m235,197.392c-20.678,0-37.5,16.822-37.5,37.5s16.822,37.5 37.5,37.5 37.5-16.822 37.5-37.5-16.822-37.5-37.5-37.5zm0,60c-12.406,0-22.5-10.094-22.5-22.5s10.094-22.5 22.5-22.5 22.5,10.094 22.5,22.5-10.094,22.5-22.5,22.5z"/>
|
||||
`
|
||||
|
||||
}
|
||||
1
src/css/app.styl
Normal file
1
src/css/app.styl
Normal file
@@ -0,0 +1 @@
|
||||
// app global css
|
||||
25
src/css/themes/common.variables.styl
Normal file
25
src/css/themes/common.variables.styl
Normal file
@@ -0,0 +1,25 @@
|
||||
// App Shared Variables
|
||||
// --------------------------------------------------
|
||||
// To customize the look and feel of this app, you can override
|
||||
// the Stylus variables found in Quasar's source Stylus files. Setting
|
||||
// variables before Quasar's Stylus will use these variables rather than
|
||||
// Quasar's default Stylus variable values. Stylus variables specific
|
||||
// to the themes belong in either the variables.ios.styl or variables.mat.styl files.
|
||||
|
||||
// Check documentation for full list of Quasar variables
|
||||
|
||||
|
||||
// App Shared Color Variables
|
||||
// --------------------------------------------------
|
||||
// It's highly recommended to change the default colors
|
||||
// to match your app's branding.
|
||||
|
||||
$primary = #027be3
|
||||
$secondary = #26A69A
|
||||
$tertiary = #555
|
||||
|
||||
$neutral = #E0E1E2
|
||||
$positive = #21BA45
|
||||
$negative = #DB2828
|
||||
$info = #31CCEC
|
||||
$warning = #F2C037
|
||||
7
src/css/themes/variables.ios.styl
Normal file
7
src/css/themes/variables.ios.styl
Normal file
@@ -0,0 +1,7 @@
|
||||
// App Shared Variables
|
||||
// --------------------------------------------------
|
||||
// Shared Stylus variables go in the common.variables.styl file
|
||||
@import 'common.variables'
|
||||
|
||||
// iOS only Quasar variables overwrites
|
||||
// -----------------------------------------
|
||||
7
src/css/themes/variables.mat.styl
Normal file
7
src/css/themes/variables.mat.styl
Normal file
@@ -0,0 +1,7 @@
|
||||
// App Shared Variables
|
||||
// --------------------------------------------------
|
||||
// Shared Stylus variables go in the common.variables.styl file
|
||||
@import 'common.variables'
|
||||
|
||||
// Material only Quasar variables overwrites
|
||||
// -----------------------------------------
|
||||
19
src/i18n.js
Normal file
19
src/i18n.js
Normal file
@@ -0,0 +1,19 @@
|
||||
const messages = {
|
||||
enUs: {
|
||||
msg: {
|
||||
hello: 'Hello!',
|
||||
myAppName: 'FreePlanet',
|
||||
myDescriz: 'The first Free app for Everyone'
|
||||
|
||||
}
|
||||
},
|
||||
it: {
|
||||
msg: {
|
||||
hello: 'Buongiorno!',
|
||||
myAppName: 'FreePlanet',
|
||||
myDescriz: 'La prima App Libera e per Tutti'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
export default messages;
|
||||
23
src/index.template.html
Normal file
23
src/index.template.html
Normal file
@@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title><%= htmlWebpackPlugin.options.productName %></title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="description" content="<%= htmlWebpackPlugin.options.productDescription %>">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<meta name="msapplication-tap-highlight" content="no">
|
||||
<meta name="viewport"
|
||||
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (htmlWebpackPlugin.options.ctx.mode.cordova) { %>, viewport-fit=cover<% } %>">
|
||||
|
||||
<link rel="icon" href="statics/quasar-logo.png" type="image/x-icon">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="statics/icons/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="statics/icons/favicon-16x16.png">
|
||||
<script defer src="js/material.min.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<!-- DO NOT touch the following DIV -->
|
||||
<div id="q-app"></div>
|
||||
</body>
|
||||
</html>
|
||||
311
src/js/idb.js
Normal file
311
src/js/idb.js
Normal file
@@ -0,0 +1,311 @@
|
||||
'use strict';
|
||||
|
||||
(function() {
|
||||
function toArray(arr) {
|
||||
return Array.prototype.slice.call(arr);
|
||||
}
|
||||
|
||||
function promisifyRequest(request) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
request.onsuccess = function() {
|
||||
resolve(request.result);
|
||||
};
|
||||
|
||||
request.onerror = function() {
|
||||
reject(request.error);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function promisifyRequestCall(obj, method, args) {
|
||||
var request;
|
||||
var p = new Promise(function(resolve, reject) {
|
||||
request = obj[method].apply(obj, args);
|
||||
promisifyRequest(request).then(resolve, reject);
|
||||
});
|
||||
|
||||
p.request = request;
|
||||
return p;
|
||||
}
|
||||
|
||||
function promisifyCursorRequestCall(obj, method, args) {
|
||||
var p = promisifyRequestCall(obj, method, args);
|
||||
return p.then(function(value) {
|
||||
if (!value) return;
|
||||
return new Cursor(value, p.request);
|
||||
});
|
||||
}
|
||||
|
||||
function proxyProperties(ProxyClass, targetProp, properties) {
|
||||
properties.forEach(function(prop) {
|
||||
Object.defineProperty(ProxyClass.prototype, prop, {
|
||||
get: function() {
|
||||
return this[targetProp][prop];
|
||||
},
|
||||
set: function(val) {
|
||||
this[targetProp][prop] = val;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function proxyRequestMethods(ProxyClass, targetProp, Constructor, properties) {
|
||||
properties.forEach(function(prop) {
|
||||
if (!(prop in Constructor.prototype)) return;
|
||||
ProxyClass.prototype[prop] = function() {
|
||||
return promisifyRequestCall(this[targetProp], prop, arguments);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function proxyMethods(ProxyClass, targetProp, Constructor, properties) {
|
||||
properties.forEach(function(prop) {
|
||||
if (!(prop in Constructor.prototype)) return;
|
||||
ProxyClass.prototype[prop] = function() {
|
||||
return this[targetProp][prop].apply(this[targetProp], arguments);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function proxyCursorRequestMethods(ProxyClass, targetProp, Constructor, properties) {
|
||||
properties.forEach(function(prop) {
|
||||
if (!(prop in Constructor.prototype)) return;
|
||||
ProxyClass.prototype[prop] = function() {
|
||||
return promisifyCursorRequestCall(this[targetProp], prop, arguments);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function Index(index) {
|
||||
this._index = index;
|
||||
}
|
||||
|
||||
proxyProperties(Index, '_index', [
|
||||
'name',
|
||||
'keyPath',
|
||||
'multiEntry',
|
||||
'unique'
|
||||
]);
|
||||
|
||||
proxyRequestMethods(Index, '_index', IDBIndex, [
|
||||
'get',
|
||||
'getKey',
|
||||
'getAll',
|
||||
'getAllKeys',
|
||||
'count'
|
||||
]);
|
||||
|
||||
proxyCursorRequestMethods(Index, '_index', IDBIndex, [
|
||||
'openCursor',
|
||||
'openKeyCursor'
|
||||
]);
|
||||
|
||||
function Cursor(cursor, request) {
|
||||
this._cursor = cursor;
|
||||
this._request = request;
|
||||
}
|
||||
|
||||
proxyProperties(Cursor, '_cursor', [
|
||||
'direction',
|
||||
'key',
|
||||
'primaryKey',
|
||||
'value'
|
||||
]);
|
||||
|
||||
proxyRequestMethods(Cursor, '_cursor', IDBCursor, [
|
||||
'update',
|
||||
'delete'
|
||||
]);
|
||||
|
||||
// proxy 'next' methods
|
||||
['advance', 'continue', 'continuePrimaryKey'].forEach(function(methodName) {
|
||||
if (!(methodName in IDBCursor.prototype)) return;
|
||||
Cursor.prototype[methodName] = function() {
|
||||
var cursor = this;
|
||||
var args = arguments;
|
||||
return Promise.resolve().then(function() {
|
||||
cursor._cursor[methodName].apply(cursor._cursor, args);
|
||||
return promisifyRequest(cursor._request).then(function(value) {
|
||||
if (!value) return;
|
||||
return new Cursor(value, cursor._request);
|
||||
});
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
function ObjectStore(store) {
|
||||
this._store = store;
|
||||
}
|
||||
|
||||
ObjectStore.prototype.createIndex = function() {
|
||||
return new Index(this._store.createIndex.apply(this._store, arguments));
|
||||
};
|
||||
|
||||
ObjectStore.prototype.index = function() {
|
||||
return new Index(this._store.index.apply(this._store, arguments));
|
||||
};
|
||||
|
||||
proxyProperties(ObjectStore, '_store', [
|
||||
'name',
|
||||
'keyPath',
|
||||
'indexNames',
|
||||
'autoIncrement'
|
||||
]);
|
||||
|
||||
proxyRequestMethods(ObjectStore, '_store', IDBObjectStore, [
|
||||
'put',
|
||||
'add',
|
||||
'delete',
|
||||
'clear',
|
||||
'get',
|
||||
'getAll',
|
||||
'getKey',
|
||||
'getAllKeys',
|
||||
'count'
|
||||
]);
|
||||
|
||||
proxyCursorRequestMethods(ObjectStore, '_store', IDBObjectStore, [
|
||||
'openCursor',
|
||||
'openKeyCursor'
|
||||
]);
|
||||
|
||||
proxyMethods(ObjectStore, '_store', IDBObjectStore, [
|
||||
'deleteIndex'
|
||||
]);
|
||||
|
||||
function Transaction(idbTransaction) {
|
||||
this._tx = idbTransaction;
|
||||
this.complete = new Promise(function(resolve, reject) {
|
||||
idbTransaction.oncomplete = function() {
|
||||
resolve();
|
||||
};
|
||||
idbTransaction.onerror = function() {
|
||||
reject(idbTransaction.error);
|
||||
};
|
||||
idbTransaction.onabort = function() {
|
||||
reject(idbTransaction.error);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
Transaction.prototype.objectStore = function() {
|
||||
return new ObjectStore(this._tx.objectStore.apply(this._tx, arguments));
|
||||
};
|
||||
|
||||
proxyProperties(Transaction, '_tx', [
|
||||
'objectStoreNames',
|
||||
'mode'
|
||||
]);
|
||||
|
||||
proxyMethods(Transaction, '_tx', IDBTransaction, [
|
||||
'abort'
|
||||
]);
|
||||
|
||||
function UpgradeDB(db, oldVersion, transaction) {
|
||||
this._db = db;
|
||||
this.oldVersion = oldVersion;
|
||||
this.transaction = new Transaction(transaction);
|
||||
}
|
||||
|
||||
UpgradeDB.prototype.createObjectStore = function() {
|
||||
return new ObjectStore(this._db.createObjectStore.apply(this._db, arguments));
|
||||
};
|
||||
|
||||
proxyProperties(UpgradeDB, '_db', [
|
||||
'name',
|
||||
'version',
|
||||
'objectStoreNames'
|
||||
]);
|
||||
|
||||
proxyMethods(UpgradeDB, '_db', IDBDatabase, [
|
||||
'deleteObjectStore',
|
||||
'close'
|
||||
]);
|
||||
|
||||
function DB(db) {
|
||||
this._db = db;
|
||||
}
|
||||
|
||||
DB.prototype.transaction = function() {
|
||||
return new Transaction(this._db.transaction.apply(this._db, arguments));
|
||||
};
|
||||
|
||||
proxyProperties(DB, '_db', [
|
||||
'name',
|
||||
'version',
|
||||
'objectStoreNames'
|
||||
]);
|
||||
|
||||
proxyMethods(DB, '_db', IDBDatabase, [
|
||||
'close'
|
||||
]);
|
||||
|
||||
// Add cursor iterators
|
||||
// TODO: remove this once browsers do the right thing with promises
|
||||
['openCursor', 'openKeyCursor'].forEach(function(funcName) {
|
||||
[ObjectStore, Index].forEach(function(Constructor) {
|
||||
Constructor.prototype[funcName.replace('open', 'iterate')] = function() {
|
||||
var args = toArray(arguments);
|
||||
var callback = args[args.length - 1];
|
||||
var nativeObject = this._store || this._index;
|
||||
var request = nativeObject[funcName].apply(nativeObject, args.slice(0, -1));
|
||||
request.onsuccess = function() {
|
||||
callback(request.result);
|
||||
};
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
// polyfill getAll
|
||||
[Index, ObjectStore].forEach(function(Constructor) {
|
||||
if (Constructor.prototype.getAll) return;
|
||||
Constructor.prototype.getAll = function(query, count) {
|
||||
var instance = this;
|
||||
var items = [];
|
||||
|
||||
return new Promise(function(resolve) {
|
||||
instance.iterateCursor(query, function(cursor) {
|
||||
if (!cursor) {
|
||||
resolve(items);
|
||||
return;
|
||||
}
|
||||
items.push(cursor.value);
|
||||
|
||||
if (count !== undefined && items.length == count) {
|
||||
resolve(items);
|
||||
return;
|
||||
}
|
||||
cursor.continue();
|
||||
});
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
var exp = {
|
||||
open: function(name, version, upgradeCallback) {
|
||||
var p = promisifyRequestCall(indexedDB, 'open', [name, version]);
|
||||
var request = p.request;
|
||||
|
||||
request.onupgradeneeded = function(event) {
|
||||
if (upgradeCallback) {
|
||||
upgradeCallback(new UpgradeDB(request.result, event.oldVersion, request.transaction));
|
||||
}
|
||||
};
|
||||
|
||||
return p.then(function(db) {
|
||||
return new DB(db);
|
||||
});
|
||||
},
|
||||
delete: function(name) {
|
||||
return promisifyRequestCall(indexedDB, 'deleteDatabase', [name]);
|
||||
}
|
||||
};
|
||||
|
||||
if (typeof module !== 'undefined') {
|
||||
module.exports = exp;
|
||||
module.exports.default = module.exports;
|
||||
}
|
||||
else {
|
||||
self.idb = exp;
|
||||
}
|
||||
}());
|
||||
10
src/js/material.min.js
vendored
Normal file
10
src/js/material.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
26
src/layouts/MyLayout.vue
Normal file
26
src/layouts/MyLayout.vue
Normal file
@@ -0,0 +1,26 @@
|
||||
<template>
|
||||
<q-layout view="lHh Lpr lFf">
|
||||
<app-header></app-header>
|
||||
<q-page-container>
|
||||
<router-view/>
|
||||
</q-page-container>
|
||||
</q-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import Header from '../components/Header.vue';
|
||||
|
||||
export default {
|
||||
created() {
|
||||
},
|
||||
components: {
|
||||
appHeader: Header
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
22
src/pages/Error404.vue
Normal file
22
src/pages/Error404.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<div class="fixed-center text-center">
|
||||
<p>
|
||||
<img
|
||||
src="~assets/sad.svg"
|
||||
style="width:30vw;max-width:150px;"
|
||||
>
|
||||
</p>
|
||||
<p class="text-faded">Sorry, nothing here...<strong>(404)</strong></p>
|
||||
<q-btn
|
||||
color="secondary"
|
||||
style="width:200px;"
|
||||
@click="$router.push('/')"
|
||||
>Go back</q-btn>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Error404'
|
||||
}
|
||||
</script>
|
||||
173
src/pages/Index.vue
Normal file
173
src/pages/Index.vue
Normal file
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<q-page class="flex flex-center">
|
||||
<img alt="Quasar logo" src="~assets/quasar-logo-full.svg">
|
||||
|
||||
<q-btn round color="blue" icon="add" id="shareimagebutton" @click="openCreatePostModal">
|
||||
<q-spinner-facebook slot="loading"/>
|
||||
</q-btn>
|
||||
|
||||
<q-field
|
||||
icon="wifi"
|
||||
:count="10"
|
||||
helper="Some helper"
|
||||
>
|
||||
<br>Conta = {{ getConta }}
|
||||
</q-field>
|
||||
|
||||
<q-btn
|
||||
@click="showNotification"
|
||||
color="primary"
|
||||
label="Mostra notifica"
|
||||
/>
|
||||
|
||||
<q-card id="mycard" class="mycard" :style="mystilecard">
|
||||
<q-card-title>
|
||||
Card Title
|
||||
</q-card-title>
|
||||
<q-card-separator/>
|
||||
<q-card-main>
|
||||
Card Content
|
||||
</q-card-main>
|
||||
</q-card>
|
||||
|
||||
</q-page>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.mycard {
|
||||
visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
import {mapGetters, mapMutations} from 'vuex'
|
||||
import * as types from '../store/mutation-types'
|
||||
|
||||
import { Notify } from 'quasar'
|
||||
|
||||
let deferredPrompt = null;
|
||||
|
||||
export default {
|
||||
data: function () {
|
||||
return {
|
||||
text: '',
|
||||
visibile: false,
|
||||
cardvisible: 'hidden',
|
||||
displaycard: 'block',
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
deferredPrompt: function (){
|
||||
return deferredPrompt;
|
||||
},
|
||||
...mapGetters(['getConta']),
|
||||
mystilecard: function () {
|
||||
return {
|
||||
visibility: this.cardvisible,
|
||||
display: this.displaycard
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setConta']),
|
||||
showNotification () {
|
||||
this.$q.notify('Some other message')
|
||||
},
|
||||
initprompt() {
|
||||
window.addEventListener('beforeinstallprompt', function (event) {
|
||||
console.log('******************************** beforeinstallprompt fired');
|
||||
event.preventDefault();
|
||||
console.log('§§§§§§§§§§§§§§§§§§§§ IMPOSTA DEFERRED PROMPT !!!!!!!!!!!!!!!!! ');
|
||||
deferredPrompt = event;
|
||||
return false;
|
||||
});
|
||||
},
|
||||
test_fetch(){
|
||||
fetch('https:/httpbin.org/post', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type' : 'application/json',
|
||||
'Accept': 'application/json'
|
||||
},
|
||||
//mode: 'no-cors',
|
||||
mode: 'cors',
|
||||
body: JSON.stringify({message: 'Does this work?'})
|
||||
}).then(function(response) {
|
||||
console.log(response);
|
||||
if (response)
|
||||
return response.json();
|
||||
else
|
||||
return null;
|
||||
}).then(function (data) {
|
||||
console.log(data);
|
||||
}).catch(function (err) {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
test(){
|
||||
console.log("*** INIZIA IL TEST ")
|
||||
var primise = new Promise(function(resolve, reject) {
|
||||
setTimeout(function() {
|
||||
if (true)
|
||||
resolve('Questo viene eseguito alla FINE ')
|
||||
else
|
||||
reject({code:500, message: 'Errore Generico'});
|
||||
|
||||
}, 3000);
|
||||
});
|
||||
|
||||
promise.then(function(text) {
|
||||
console.log(text);
|
||||
}).then(function (newText) {
|
||||
console.log(newText);
|
||||
}).catch(function (err) {
|
||||
console.log(err.code, err.message);
|
||||
});
|
||||
|
||||
},
|
||||
openCreatePostModal() {
|
||||
console.log('APERTO ! openCreatePostModal');
|
||||
|
||||
this.setConta(this.getConta+1);
|
||||
|
||||
this.visibile = !this.visibile;
|
||||
|
||||
if (this.visibile) {
|
||||
this.displaycard = 'block';
|
||||
this.cardvisible = 'visible';
|
||||
} else {
|
||||
this.displaycard = 'block';
|
||||
this.cardvisible = 'hidden';
|
||||
}
|
||||
|
||||
event = deferredPrompt;
|
||||
|
||||
if (event) {
|
||||
console.log("+++++++++++++++++ FAI IL PROMPT DI EVENT !!!!!!!!!!!!!!!!!!!!! ")
|
||||
console.log("################# FAI IL PROMPT DI EVENT ################# ")
|
||||
event.prompt();
|
||||
|
||||
event.userChoice.then(function (choiceResult) {
|
||||
console.log(choiceResult.outcome);
|
||||
|
||||
if (choiceResult.outcome === 'dismissed') {
|
||||
console.log('User cancelled installation');
|
||||
} else {
|
||||
console.log('User added to home screen');
|
||||
}
|
||||
});
|
||||
|
||||
deferredPrompt = null;
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
///Notify.create('created...')
|
||||
console.log('created...');
|
||||
this.initprompt();
|
||||
//this.test();
|
||||
this.test_fetch();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
0
src/plugins/.gitkeep
Normal file
0
src/plugins/.gitkeep
Normal file
7
src/plugins/aggiuntivi.js
Normal file
7
src/plugins/aggiuntivi.js
Normal file
@@ -0,0 +1,7 @@
|
||||
// import something here
|
||||
import Vuelidate from 'vuelidate'
|
||||
|
||||
// leave the export, even if you don't use it
|
||||
export default ({ app, router, Vue }) => {
|
||||
Vue.use(Vuelidate);
|
||||
}
|
||||
17
src/plugins/i18n.js
Normal file
17
src/plugins/i18n.js
Normal file
@@ -0,0 +1,17 @@
|
||||
// src/plugins/i18n.js
|
||||
import VueI18n from 'vue-i18n';
|
||||
import messages from 'src/i18n';
|
||||
|
||||
export default ({ app, store, Vue }) => {
|
||||
Vue.use(VueI18n);
|
||||
Vue.config.lang = 'it';
|
||||
|
||||
console.log("PLUGINS INIT....");
|
||||
|
||||
// Set i18n instance on app
|
||||
app.i18n = new VueI18n({
|
||||
locale: 'it',
|
||||
fallbackLocale: 'it',
|
||||
messages
|
||||
})
|
||||
}
|
||||
25
src/router/index.js
Normal file
25
src/router/index.js
Normal file
@@ -0,0 +1,25 @@
|
||||
import Vue from 'vue'
|
||||
import VueRouter from 'vue-router'
|
||||
|
||||
import routes from './routes'
|
||||
|
||||
Vue.use(VueRouter);
|
||||
|
||||
/*
|
||||
* If not building with SSR mode, you can
|
||||
* directly export the Router instantiation
|
||||
*/
|
||||
|
||||
export default function (/* { store, ssrContext } */) {
|
||||
const Router = new VueRouter({
|
||||
scrollBehavior: () => ({ y: 0 }),
|
||||
routes,
|
||||
|
||||
// Leave these as is and change from quasar.conf.js instead!
|
||||
// quasar.conf.js -> build -> vueRouterMode
|
||||
mode: process.env.VUE_ROUTER_MODE,
|
||||
base: process.env.VUE_ROUTER_BASE
|
||||
})
|
||||
|
||||
return Router
|
||||
}
|
||||
29
src/router/routes.js
Normal file
29
src/router/routes.js
Normal file
@@ -0,0 +1,29 @@
|
||||
|
||||
import VueI18n from 'vue-i18n';
|
||||
import Vue from 'vue'
|
||||
Vue.use(VueI18n);
|
||||
|
||||
function load (component) {
|
||||
return () => import(`components/${component}.vue`)
|
||||
}
|
||||
|
||||
|
||||
const routes = [
|
||||
{ path: '/', component: load('views/dashboard/one/dashboard'), meta: { name: 'Dashboard One' } },
|
||||
{ path: '/prec', component: () => import('layouts/MyLayout.vue'),
|
||||
children: [
|
||||
{ path: '', component: () => import('pages/Index.vue') }
|
||||
]
|
||||
},
|
||||
{ path: '/login', component: () => load('views/login/login'), meta: { name: 'Login' } },
|
||||
]
|
||||
|
||||
// Always leave this as last one
|
||||
if (process.env.MODE !== 'ssr') {
|
||||
routes.push({
|
||||
path: '*',
|
||||
component: () => import('pages/Error404.vue')
|
||||
})
|
||||
}
|
||||
|
||||
export default routes
|
||||
BIN
src/statics/devices-sprite.jpg
Normal file
BIN
src/statics/devices-sprite.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
1
src/statics/firebaseui.css
Normal file
1
src/statics/firebaseui.css
Normal file
File diff suppressed because one or more lines are too long
BIN
src/statics/icons/apple-icon-152x152.png
Normal file
BIN
src/statics/icons/apple-icon-152x152.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
src/statics/icons/favicon-16x16.png
Normal file
BIN
src/statics/icons/favicon-16x16.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/statics/icons/favicon-32x32.png
Normal file
BIN
src/statics/icons/favicon-32x32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/statics/icons/icon-128x128.png
Normal file
BIN
src/statics/icons/icon-128x128.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
BIN
src/statics/icons/icon-192x192.png
Normal file
BIN
src/statics/icons/icon-192x192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
src/statics/icons/icon-256x256.png
Normal file
BIN
src/statics/icons/icon-256x256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
src/statics/icons/icon-384x384.png
Normal file
BIN
src/statics/icons/icon-384x384.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
src/statics/icons/icon-512x512.png
Normal file
BIN
src/statics/icons/icon-512x512.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
src/statics/icons/ms-icon-144x144.png
Normal file
BIN
src/statics/icons/ms-icon-144x144.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/statics/quasar-logo.png
Normal file
BIN
src/statics/quasar-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
23
src/store/index.js
Normal file
23
src/store/index.js
Normal file
@@ -0,0 +1,23 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
import example from './module-example/index'
|
||||
import glob from './modules/glob';
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
const debug = process.env.NODE_ENV !== 'production';
|
||||
|
||||
Vue.filter('time', timestamp => {
|
||||
return new Date(timestamp).toLocaleTimeString()
|
||||
});
|
||||
|
||||
export default new Vuex.Store({
|
||||
modules: {
|
||||
glob,
|
||||
example
|
||||
},
|
||||
|
||||
//strict: debug,
|
||||
//plugins: debug ? [createLogger()] : []
|
||||
});
|
||||
4
src/store/module-example/actions.js
Normal file
4
src/store/module-example/actions.js
Normal file
@@ -0,0 +1,4 @@
|
||||
/*
|
||||
export function someAction (context) {
|
||||
}
|
||||
*/
|
||||
4
src/store/module-example/getters.js
Normal file
4
src/store/module-example/getters.js
Normal file
@@ -0,0 +1,4 @@
|
||||
/*
|
||||
export function someGetter (state) {
|
||||
}
|
||||
*/
|
||||
12
src/store/module-example/index.js
Normal file
12
src/store/module-example/index.js
Normal file
@@ -0,0 +1,12 @@
|
||||
import state from './state'
|
||||
import * as getters from './getters'
|
||||
import * as mutations from './mutations'
|
||||
import * as actions from './actions'
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
getters,
|
||||
mutations,
|
||||
actions
|
||||
}
|
||||
4
src/store/module-example/mutations.js
Normal file
4
src/store/module-example/mutations.js
Normal file
@@ -0,0 +1,4 @@
|
||||
/*
|
||||
export function someMutation (state) {
|
||||
}
|
||||
*/
|
||||
3
src/store/module-example/state.js
Normal file
3
src/store/module-example/state.js
Normal file
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
//
|
||||
}
|
||||
80
src/store/modules/glob.js
Normal file
80
src/store/modules/glob.js
Normal file
@@ -0,0 +1,80 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
import * as types from '../mutation-types'
|
||||
|
||||
|
||||
export const state = {
|
||||
conta: 0,
|
||||
deferredPrompt: null,
|
||||
layoutNeeded: true,
|
||||
isLoginPage: false,
|
||||
mobileMode: false,
|
||||
menuCollapse: true,
|
||||
|
||||
posts: [],
|
||||
};
|
||||
|
||||
export const mutations = {
|
||||
setValue (state) {
|
||||
state.conta = value
|
||||
},
|
||||
setDefprompt (state, value) {
|
||||
state.deferredPrompt = value
|
||||
},
|
||||
setdefprompt (state, value) {
|
||||
state.deferredPrompt = value
|
||||
},
|
||||
setLayoutNeeded (state, value) {
|
||||
state.layoutNeeded = value
|
||||
},
|
||||
setIsLoginPage (state, value) {
|
||||
state.isLoginPage = value
|
||||
},
|
||||
setMobileMode (state, value) {
|
||||
state.mobileMode = value
|
||||
},
|
||||
setMenuCollapse (state, value) {
|
||||
state.menuCollapse = value
|
||||
},
|
||||
setPosts (state, posts) {
|
||||
state.posts = posts
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
export const getters = {
|
||||
getConta () {
|
||||
return state.conta
|
||||
},
|
||||
getDeferredPrompt() {
|
||||
return state.deferredPrompt
|
||||
},
|
||||
getLayoutNeeded () {
|
||||
return state.layoutNeeded
|
||||
},
|
||||
getIsLoginPage () {
|
||||
return state.isLoginPage
|
||||
},
|
||||
getMobileMode () {
|
||||
return state.mobileMode
|
||||
},
|
||||
getMenuCollapse () {
|
||||
return state.menuCollapse
|
||||
},
|
||||
getPosts () {
|
||||
return state.posts
|
||||
},
|
||||
|
||||
//evenOrsOdd: state => state.count % 2 === 0 ? 'even' : 'odd'
|
||||
};
|
||||
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
getters,
|
||||
mutations,
|
||||
};
|
||||
5
src/store/mutation-types.js
Normal file
5
src/store/mutation-types.js
Normal file
@@ -0,0 +1,5 @@
|
||||
export const SET_VALUE = 'SET_VALUE';
|
||||
export const SET_DEFFERED_PROMPT = 'defprompt';
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user