Altra conversione in Typescript (3).

primo test semplice...
This commit is contained in:
paolo
2018-11-03 01:23:39 +01:00
parent 444dfc3384
commit 5b56636ba2
9 changed files with 5231 additions and 976 deletions

View File

@@ -1,10 +1,6 @@
{
"name": "quasar-typescript",
"name": "vue-order-admin",
"version": "0.1.0",
"description": "",
"productName": "Quasar TypeScript",
"cordovaId": "org.cordova.quasar.app",
"author": "Kevin Marrec",
"private": true,
"scripts": {
"lint": "tslint --project tsconfig.json",
@@ -24,35 +20,49 @@
"deploy:ssr": "now dist/ssr-mat"
},
"dependencies": {
"@types/js-cookie": "^2.1.0",
"@types/node": "^10.12.2",
"@types/nprogress": "^0.0.29",
"@types/webpack-env": "^1.13.6",
"axios": "^0.18.0",
"bcryptjs": "^2.4.3",
"dotenv": "^6.1.0",
"element-ui": "^2.3.6",
"js-cookie": "^2.2.0",
"normalize.css": "^8.0.0",
"npm": "^6.4.1",
"nprogress": "^0.2.0",
"register-service-worker": "^1.0.0",
"vee-validate": "^2.1.2",
"vue": "^2.5.17",
"vue-class-component": "^6.0.0",
"vue-i18n": "^8.1.0",
"vue-property-decorator": "^7.2.0",
"vuelidate": "^0.7.4",
"vue-property-decorator": "^7.0.0",
"vue-router": "^3.0.1",
"vue-svgicon": "^3.1.0",
"vuex": "^3.0.1",
"vuex-class": "^0.3.1",
"vuex-module-decorators": "^0.9.0"
"vuex-module-decorators": "^0.4.3",
"webpack": "^4.17.2"
},
"devDependencies": {
"@types/jest": "^23.3.4",
"@types/node": "^10.11.5",
"@vue/test-utils": "^1.0.0-beta.25",
"babel-core": "^7.0.0-bridge.0",
"codecov": "^3.1.0",
"jest": "^23.6.0",
"jest-serializer-vue": "^2.0.2",
"now": "^11.4.6",
"pug": "^2.0.3",
"pug-plain-loader": "^1.0.0",
"@types/jest": "^23.1.4",
"@vue/cli-plugin-babel": "^3.0.1",
"@vue/cli-plugin-e2e-cypress": "^3.0.1",
"@vue/cli-plugin-pwa": "^3.0.1",
"@vue/cli-plugin-typescript": "^3.0.1",
"@vue/cli-plugin-unit-jest": "^3.0.1",
"@vue/cli-service": "^3.0.1",
"@vue/test-utils": "^1.0.0-beta.20",
"babel-core": "7.0.0-bridge.0",
"eslint": "^5.5.0",
"jest": "^23.5.0",
"node-sass": "^4.9.0",
"quasar-cli": "^0.17.20",
"sass-loader": "^7.0.1",
"strip-ansi": "=3.0.1",
"ts-jest": "^23.10.4",
"ts-loader": "^5.2.1",
"tslint": "^5.11.0",
"tslint-config-standard": "^8.0.1",
"typescript": "^3.1.1",
"vue-jest": "^2.6.0"
"ts-jest": "^23.0.0",
"typescript": "^3.0.0",
"vue-cli-plugin-element-ui": "^1.1.2",
"vue-template-compiler": "^2.5.17"
},
"engines": {
"node": ">= 8.9.0",

View File

@@ -1,18 +0,0 @@
<template lang="pug">
.fixed-center.text-center
img(src="~assets/sad.svg", style="width:30vw;max-width:150px;")
p.q-mt-sm.text-faded
| {{ $t('pages.errors.e404.message') }} #[strong (404)]
q-btn(
color="secondary"
style="width:200px;"
@click="$router.push('/')"
) {{ $t('pages.errors.e404.back') }}
</template>
<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'
@Component
export default class Error404 extends Vue {}
</script>

View File

@@ -11,7 +11,7 @@
:count="10"
helper="Some helper"
>
<br>Conta = {{ getConta }}
<br>Conta = {{ conta }}
</q-field>
<!--<q-btn
@@ -39,61 +39,58 @@
}
</style>
<script>
import {mapGetters, mapActions} from 'vuex'
import * as types from '../store/mutation-types'
<script lang="ts">
import { Component, Vue, Watch, Prop } from 'vue-property-decorator'
import { GlobModule } from '@/store/modules/glob'
import HelloWorld from '@/components/HelloWorld.ts';
//import { Notify } from 'quasar'
import {Notify} from 'quasar'
@Component({})
export default class Login extends Vue {
text = ''
visibile = false
cardvisible = 'hidden'
displaycard = 'block'
let deferredPrompt = null;
export default {
data: function () {
return {
text: '',
visibile: false,
cardvisible: 'hidden',
displaycard: 'block',
constructor() {
super()
console.log('created...')
this.initprompt()
}
},
computed: {
deferredPrompt: function () {
return deferredPrompt;
},
...mapGetters("glob", ['getConta']),
mystilecard: function () {
mystilecard() {
return {
visibility: this.cardvisible,
display: this.displaycard
}
}
},
methods: {
showNotification() {
this.$q.notify('Some other message')
},
...mapActions("glob", {
impostaconta: types.SET_VALUE,
'setLayoutNeeded': types.SET_LAYOUT_NEEDED,
'setIsLoginPage': types.SET_LOGIN_PAGE
}),
initprompt() {
window.addEventListener('beforeinstallprompt', function (event) {
console.log('******************************** beforeinstallprompt fired');
event.preventDefault();
console.log('§§§§§§§§§§§§§§§§§§§§ IMPOSTA DEFERRED PROMPT !!!!!!!!!!!!!!!!! ');
deferredPrompt = event;
return false;
});
},
start_app() {
if (!window.Promise) {
window.Promise = Promise;
get conta() {
return GlobModule.conta
}
set conta(valore) {
GlobModule.setConta(valore)
}
mounted() {
console.log("mounted")
}
showNotification() {
this.$q.notify('Some other message')
}
initprompt() {
window.addEventListener('beforeinstallprompt', function (event) {
console.log('******************************** beforeinstallprompt fired')
event.preventDefault()
console.log('§§§§§§§§§§§§§§§§§§§§ IMPOSTA DEFERRED PROMPT !!!!!!!!!!!!!!!!! ')
return false
})
}
},
test_fetch() {
fetch('https:/httpbin.org/post', {
method: 'POST',
@@ -105,81 +102,33 @@
mode: 'cors',
body: JSON.stringify({ message: 'Does this work?' })
}).then(function (response) {
console.log(response);
console.log(response)
if (response)
return response.json();
return response.json()
else
return null;
return null
}).then(function (data) {
console.log(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'});
console.log(err)
})
}
}, 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');
console.log('APERTO ! openCreatePostModal')
this.impostaconta(this.getConta + 1);
this.conta = this.conta + 1
this.visibile = !this.visibile;
this.visibile = !this.visibile
if (this.visibile) {
this.displaycard = 'block';
this.cardvisible = 'visible';
this.displaycard = 'block'
this.cardvisible = 'visible'
} else {
this.displaycard = 'block';
this.cardvisible = 'hidden';
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.start_app();
//this.test();
//this.test_fetch();
}
}
</script>

View File

@@ -29,13 +29,4 @@ const routes: RouteConfig[] = [
}*/
]
// Always leave this as last one
if (process.env.MODE !== 'ssr') {
routes.push({
name: 'pages.errors.e404',
path: '*',
component: () => import('@/pages/Error404.vue')
})
}
export default routes

View File

@@ -1,13 +1,13 @@
import Vue from 'vue';
import Vuex from 'vuex';
import Vue from 'vue'
import Vuex from 'vuex'
import { IUserState } from '@/types';
import { IUserState } from '@/types'
Vue.use(Vuex);
Vue.use(Vuex)
export interface IRootState {
user: IUserState;
role: IRootState;
user: IUserState
role: IRootState
}
export default new Vuex.Store<IRootState>({});
export default new Vuex.Store<IRootState>({})

View File

@@ -1,59 +1,62 @@
/*
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);
import { Module, VuexModule, Mutation, MutationAction, Action, getModule } from 'vuex-module-decorators'
import * as types from '../mutation-types'
import * as types from '@/store/mutation-types'
export const state = {
conta: 0,
deferredPrompt: null,
isLoginPage: false,
layoutNeeded: true,
mobileMode: false,
menuCollapse: true,
posts: [{title:'titolo 1'}, {title:'titolo 2'}],
import store from '@/store'
};
Vue.use(Vuex)
export const getters = {
getConta: state => state.conta,
getDeferredPrompt: state => state.deferredPrompt,
getIsLoginPage: state => state.isLoginPage,
getLayoutNeeded: state => state.layoutNeeded,
getMobileMode: state => state.mobileMode,
getMenuCollapse: state => state.menuCollapse,
getPosts: state => state.posts,
};
export const mutations = {
[types.SET_VALUE]: (state, payload) => { state.conta = payload; },
[types.SET_DEFFERED_PROMPT]: (state, payload) => { state.deferredPrompt = payload; },
[types.SET_LOGIN_PAGE]: (state, payload) => { state.isLoginPage = payload; },
[types.SET_LAYOUT_NEEDED]: (state, payload) => { state.layoutNeeded = payload; },
[types.SET_MOBILE_MODE]: (state, payload) => { state.mobileMode = payload; },
[types.SET_MENU_COLLAPSED]: (state, payload) => { state.menuCollapse = payload; },
[types.SET_POSTS]: (state, payload) => { state.posts = payload; },
};
export const actions = {
[types.SET_VALUE]: ({commit}, payload) => { commit(types.SET_VALUE, payload) },
[types.SET_DEFFERED_PROMPT]: ({commit}, payload) => { commit(types.SET_DEFFERED_PROMPT, payload) },
[types.SET_LOGIN_PAGE]: ({commit}, payload) => { commit(types.SET_LOGIN_PAGE, payload) },
[types.SET_LAYOUT_NEEDED]: ({commit}, payload) => { commit(types.SET_LAYOUT_NEEDED, payload) },
[types.SET_MOBILE_MODE]: ({commit}, payload) => { commit(types.SET_MOBILE_MODE, payload) },
[types.SET_MENU_COLLAPSED]: ({commit}, payload) => { commit(types.SET_MENU_COLLAPSED, payload) },
[types.SET_POSTS]: ({commit}, payload) => { commit(types.SET_POSTS, payload) },
};
export default {
namespaced: true,
state,
getters,
mutations,
actions
export interface IGlob {
conta: number
isLoginPage: boolean
layoutNeeded: boolean
mobileMode: boolean
menuCollapse: boolean
posts: string[]
}
*/
@Module({ dynamic: true, store, name: 'glob' })
class Glob extends VuexModule { // Non occorrono i getters, basta questi qui:
conta = 0
isLoginPage = false
layoutNeeded = true
mobileMode = false
menuCollapse = true
posts = []
getConta() {
return this.conta
}
getIsLoginPage() {
return this.isLoginPage
}
getLayoutNeeded() {
return this.layoutNeeded
}
getMobileMode() {
return this.mobileMode
}
getMenuCollapse() {
return this.menuCollapse
}
getPosts() {
return this.posts
}
@MutationAction({ mutate: ['conta'] })
async setConta(num: number) {
return { conta: num }
}
}
export const GlobModule = getModule(Glob.prototype)

View File

@@ -23,7 +23,7 @@ export const ErroriMongoDb = {
Vue.use(Vuex)
@Module({ dynamic: true, store, name: 'user' })
class User extends VuexModule {
class User extends VuexModule implements IUserState { // Non occorrono i getters, basta questi qui:
_id: IUserState['_id'] = ''
email: IUserState['email'] = ''
username: IUserState['username'] = ''
@@ -47,7 +47,7 @@ class User extends VuexModule {
sendRequest (url: string, method: string, mydata: any) {
console.log('LANG ' + this.getlang())
const mytok: string = this.getTok()
let mytok: string = this.getTok()
const authHeader = new Headers()
authHeader.append('content-type', 'application/json')

View File

@@ -11,18 +11,11 @@
<!--Prova URL : {{env('PROVA_PAOLO')}}-->
<q-field
:error="$v.form.email.$error"
:error-label="`${errorMsg('email', $v.form.email)}`"
>
<q-input
v-validate="'required|email'"
v-model="form.email"
:value="form.email"
@change="val => { form.email = val }"
:before="[{icon: 'mail', handler () {}}]"
@blur="$v.form.email.$touch"
:error="$v.form.email.$error"
:float-label="$t('reg.email')"
/>
</q-field>
</q-page>
@@ -31,8 +24,7 @@
<script lang="ts">
import { Component, Vue, Watch } from 'vue-property-decorator';
import { UserModule } from '@/store/modules/user';
import { UserModule } from '@/store/modules/useraa';
@Component({})

5722
yarn.lock

File diff suppressed because it is too large Load Diff