apb/vue-poc
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

vuetify 0.16.5 + settings

Browse source
This commit is contained in:
Andy Bunce 2017-10-11 22:25:57 +01:00
parent e8d00c7d19
commit 91db93633d
7 changed files with 86 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/vue-poc/components/vue-ace.vue
View file

@ -45,9 +45,12 @@ ace editor for vue.js
var session=this.editor.getSession() var session=this.editor.getSession()
session.setUseWrapMode(value) session.setUseWrapMode(value)
}, },
'setting' (value) { "settings":{
console.log("--settings--",value) handler:function(vnew,vold){
this.applySettings(value) this.applySettings(vnew)
// alert("setting")
},
deep:true
} }
}, },
methods:{ methods:{

29
src/vue-poc/core.js
View file

@ -50,29 +50,26 @@ var settings = {
debug: false, debug: false,
getItem (key) { getItem (key) {
if (this.debug) console.log('getItem',key); if (this.debug) console.log('getItem',key);
return new Promise((resolve, reject) => { return localforage.getItem(key)
localforage.getItem(key) .then(value => {
.then((value) => { console.log('GET setting', key,value);
//console.log('GET setting', key,value); return value;
resolve(value)
}).catch((err) => { }).catch(err => {
console.log('GET failed'); console.log('GET failed');
reject(err)
});
}); });
}, },
setItem (key,value) { setItem (key,value) {
if (this.debug) console.log('setItem',key,value); if (this.debug) console.log('setItem',key,value);
return new Promise((resolve, reject) => { return localforage.setItem(key, value)
localforage.setItem(key, value) .then(value => {
.then((value) => { console.log('SET ',key, value);
//console.log('SET ',key, value); return value
return new Promise((resolve, reject) => {resolve(value);})
}).catch((err) => { }).catch(err => {
console.log('set failed'); console.log('set failed');
return new Promise((resolve, reject) => {reject(err);})
}); });
})
}, },
keys(){ keys(){
return localforage.keys() // returns array of keys return localforage.keys() // returns array of keys

27
src/vue-poc/features/settings/acesettings.vue
View file

@ -96,7 +96,7 @@
<script>{ <script>{
data () { data () {
return { return {
xace: { ace: {
enableSnippets: true, enableSnippets: true,
enableBasicAutocompletion: true, enableBasicAutocompletion: true,
enableLiveAutocompletion: true, enableLiveAutocompletion: true,
@ -104,7 +104,6 @@
keybinding: "ace", keybinding: "ace",
fontsize: "14" fontsize: "14"
}, },
ace: {},
keybindings:[ 'ace', 'vim', 'emacs', 'textarea', 'sublime' ], keybindings:[ 'ace', 'vim', 'emacs', 'textarea', 'sublime' ],
themes: [ "github", "chaos","tomorrow"] themes: [ "github", "chaos","tomorrow"]
} }
@ -115,24 +114,22 @@
return obj; return obj;
} }
}, },
beforeRouteEnter (to, from, next) { beforeRouteLeave (to, from, next) {
settings.getItem('settings/ace') settings.setItem('settings/ace',this.ace)
.then(v=>{ .then(v=>{
next(vm => { vm.ace = v?v:vm.xace; }) next()
}) })
}, },
mounted: function () { mounted: function () {
// console.log(this.ace,this.xace)
// this.extend(this.storeace,this.storeace);
// console.log("$$$",this.ace) // console.log("$$$",this.ace)
}, settings.getItem('settings/ace')
watch: {"ace":{ .then( v =>{
handler:function(v){ //alert("db\n"+JSON.stringify(v))
settings.setItem('settings/ace',this.ace) this.ace = Object.assign({}, this.ace, v)
}, //alert("op\n"+JSON.stringify(this.ace))
deep:true })
}
} }
} }

2
src/vue-poc/features/settings/settings.vue
View file

@ -24,7 +24,7 @@
</v-card-text> </v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn @click="wipe" error>Wipe</v-btn></v-card-actions> <v-btn @click="wipe" color="error">Wipe</v-btn></v-card-actions>
</v-card> </v-card>
</v-container> </v-container>
</template> </template>

89
src/vue-poc/static/app-gen.js
View file

@ -1,4 +1,4 @@
// generated 2017-10-09T10:18:05.74+01:00 // generated 2017-10-11T22:21:45.072+01:00
Vue.component('qd-confirm',{template:` Vue.component('qd-confirm',{template:`
<v-dialog v-model="value"> <v-dialog v-model="value">
<v-card> <v-card>
@ -203,9 +203,12 @@
var session=this.editor.getSession() var session=this.editor.getSession()
session.setUseWrapMode(value) session.setUseWrapMode(value)
}, },
'setting' (value) { "settings":{
console.log("--settings--",value) handler:function(vnew,vold){
this.applySettings(value) this.applySettings(vnew)
// alert("setting")
},
deep:true
} }
}, },
methods:{ methods:{
@ -385,8 +388,8 @@ Vue.filter('round', function(value, decimals) {
const Log=Vue.extend({template:` const Log=Vue.extend({template:`
<v-container fluid=""> <v-container fluid="">
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-btn light="" icon="" :loading="loading" @click="getItems()" :disabled="loading"> <v-btn icon="" :loading="loading" @click="getItems()" :disabled="loading">
<v-icon>refresh</v-icon> <v-icon>refresh</v-icon>
</v-btn> </v-btn>
<v-spacer></v-spacer> <v-spacer></v-spacer>
@ -1771,7 +1774,7 @@ people
); );
const Job=Vue.extend({template:` const Job=Vue.extend({template:`
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-btn icon="" to="./"><v-icon>arrow_back</v-icon></v-btn> <v-btn icon="" to="./"><v-icon>arrow_back</v-icon></v-btn>
<v-toolbar-title>{{ job }}</v-toolbar-title> <v-toolbar-title>{{ job }}</v-toolbar-title>
@ -1790,7 +1793,7 @@ people
<v-chip class="green white--text"> <v-chip class="green white--text">
<v-avatar><v-icon>timer</v-icon></v-avatar> <v-avatar><v-icon>timer</v-icon></v-avatar>
{{ jobstate.duration }}</v-chip> {{ jobstate.duration }}</v-chip>
<v-btn light="" icon="" :loading="loading" @click="getJob()" :disabled="loading || finished"> <v-btn icon="" :loading="loading" @click="getJob()" :disabled="loading || finished">
<v-icon>refresh</v-icon> <v-icon>refresh</v-icon>
</v-btn> </v-btn>
</v-toolbar> </v-toolbar>
@ -1849,14 +1852,14 @@ people
); );
const Jobs=Vue.extend({template:` const Jobs=Vue.extend({template:`
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-btn @click="stop()" :disabled="noSelection">Stop</v-btn> <v-btn @click="stop()" :disabled="noSelection">Stop</v-btn>
<v-text-field append-icon="search" label="Filter jobs" single-line="" hide-details="" v-model="search"></v-text-field> <v-text-field append-icon="search" label="Filter jobs" single-line="" hide-details="" v-model="search"></v-text-field>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn light="" icon="" :loading="loading" @click="getJobs()" @dblclick="autorefresh = !autorefresh" :disabled="loading"> <v-btn icon="" :loading="loading" @click="getJobs()" @dblclick="autorefresh = !autorefresh" :disabled="loading">
<v-icon>{{ autorefresh?'refresh':'arrow_downward' }}</v-icon> <v-icon>{{ autorefresh?'refresh':'arrow_downward' }}</v-icon>
</v-btn> </v-btn>
</v-toolbar> </v-toolbar>
@ -2025,7 +2028,7 @@ people
const Ping=Vue.extend({template:` const Ping=Vue.extend({template:`
<v-container fluid=""> <v-container fluid="">
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-toolbar-title>Simple performance measure</v-toolbar-title> <v-toolbar-title>Simple performance measure</v-toolbar-title>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn @click="reset()">Reset</v-btn> <v-btn @click="reset()">Reset</v-btn>
@ -2259,7 +2262,7 @@ people
const Repo=Vue.extend({template:` const Repo=Vue.extend({template:`
<v-container fluid=""> <v-container fluid="">
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-text-field append-icon="search" label="Filter repo" single-line="" hide-details="" v-model="search"></v-text-field> <v-text-field append-icon="search" label="Filter repo" single-line="" hide-details="" v-model="search"></v-text-field>
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-toolbar> </v-toolbar>
@ -2609,7 +2612,7 @@ people
data () { data () {
return { return {
xace: { ace: {
enableSnippets: true, enableSnippets: true,
enableBasicAutocompletion: true, enableBasicAutocompletion: true,
enableLiveAutocompletion: true, enableLiveAutocompletion: true,
@ -2617,7 +2620,6 @@ people
keybinding: "ace", keybinding: "ace",
fontsize: "14" fontsize: "14"
}, },
ace: {},
keybindings:[ 'ace', 'vim', 'emacs', 'textarea', 'sublime' ], keybindings:[ 'ace', 'vim', 'emacs', 'textarea', 'sublime' ],
themes: [ "github", "chaos","tomorrow"] themes: [ "github", "chaos","tomorrow"]
} }
@ -2628,24 +2630,22 @@ people
return obj; return obj;
} }
}, },
beforeRouteEnter (to, from, next) { beforeRouteLeave (to, from, next) {
settings.getItem('settings/ace') settings.setItem('settings/ace',this.ace)
.then(v=>{ .then(v=>{
next(vm => { vm.ace = v?v:vm.xace; }) next()
}) })
}, },
mounted: function () { mounted: function () {
// console.log(this.ace,this.xace)
// this.extend(this.storeace,this.storeace);
// console.log("$$$",this.ace) // console.log("$$$",this.ace)
}, settings.getItem('settings/ace')
watch: {"ace":{ .then( v =>{
handler:function(v){ //alert("db\n"+JSON.stringify(v))
settings.setItem('settings/ace',this.ace) this.ace = Object.assign({}, this.ace, v)
}, //alert("op\n"+JSON.stringify(this.ace))
deep:true })
}
} }
} }
@ -2676,7 +2676,7 @@ people
</v-card-text> </v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn @click="wipe" error="">Wipe</v-btn></v-card-actions> <v-btn @click="wipe" color="error">Wipe</v-btn></v-card-actions>
</v-card> </v-card>
</v-container> </v-container>
`, `,
@ -3160,7 +3160,7 @@ created(){
const Users=Vue.extend({template:` const Users=Vue.extend({template:`
<v-container fluid=""> <v-container fluid="">
<v-card> <v-card>
<v-toolbar light=""> <v-toolbar>
<v-text-field append-icon="search" label="Filter user" single-line="" hide-details="" v-model="search"></v-text-field> <v-text-field append-icon="search" label="Filter user" single-line="" hide-details="" v-model="search"></v-text-field>
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-toolbar> </v-toolbar>
@ -3406,7 +3406,7 @@ router.beforeEach((to, from, next) => {
</v-card-text> </v-card-text>
</v-card> </v-card>
</v-navigation-drawer> </v-navigation-drawer>
<v-navigation-drawer persistent="" app="" :mini-variant.sync="mini" v-model="drawer" :disable-route-watcher="true"> <v-navigation-drawer persistent="" app="" :mini-variant.sync="mini" v-model="drawer" :disable-route-watcher="true" :enable-resize-watcher="true">
<v-list class="pa-0"> <v-list class="pa-0">
<v-list-tile avatar="" tag="div"> <v-list-tile avatar="" tag="div">
@ -3666,29 +3666,26 @@ var settings = {
debug: false, debug: false,
getItem (key) { getItem (key) {
if (this.debug) console.log('getItem',key); if (this.debug) console.log('getItem',key);
return new Promise((resolve, reject) => { return localforage.getItem(key)
localforage.getItem(key) .then(value => {
.then((value) => { console.log('GET setting', key,value);
//console.log('GET setting', key,value); return value;
resolve(value)
}).catch((err) => { }).catch(err => {
console.log('GET failed'); console.log('GET failed');
reject(err)
});
}); });
}, },
setItem (key,value) { setItem (key,value) {
if (this.debug) console.log('setItem',key,value); if (this.debug) console.log('setItem',key,value);
return new Promise((resolve, reject) => { return localforage.setItem(key, value)
localforage.setItem(key, value) .then(value => {
.then((value) => { console.log('SET ',key, value);
//console.log('SET ',key, value); return value
return new Promise((resolve, reject) => {resolve(value);})
}).catch((err) => { }).catch(err => {
console.log('set failed'); console.log('set failed');
return new Promise((resolve, reject) => {reject(err);})
}); });
})
}, },
keys(){ keys(){
return localforage.keys() // returns array of keys return localforage.keys() // returns array of keys

4
src/vue-poc/static/app.html
View file

@ -9,7 +9,7 @@
<title>Vue Router Test</title> <title>Vue Router Test</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic"> <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic">
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
<link href="https://unpkg.com/vuetify@0.16.4/dist/vuetify.min.css" rel="stylesheet" type="text/css"> <link href="https://unpkg.com/vuetify@0.16.5/dist/vuetify.min.css" rel="stylesheet" type="text/css">
<link href="https://unpkg.com/vue-multiselect@2.0.0-beta.15/dist/vue-multiselect.min.css" rel="stylesheet" type="text/css"> <link href="https://unpkg.com/vue-multiselect@2.0.0-beta.15/dist/vue-multiselect.min.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css"
integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ=="
@ -40,7 +40,7 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/2.7.0/vue-router.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/2.7.0/vue-router.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.16.1/axios.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.16.1/axios.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.4.0/qs.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.4.0/qs.js"></script>
<script src="https://unpkg.com/vuetify@0.16.4/dist/vuetify.min.js"></script> <script src="https://unpkg.com/vuetify@0.16.5/dist/vuetify.min.js"></script>
<script src="https://unpkg.com/vue-multiselect@2.0.0-beta.15/dist/vue-multiselect.min.js"></script> <script src="https://unpkg.com/vue-multiselect@2.0.0-beta.15/dist/vue-multiselect.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.7/ace.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.7/ace.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.7/ext-language_tools.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.7/ext-language_tools.js"></script>

2
src/vue-poc/vue-poc.vue
View file

@ -21,7 +21,7 @@
</v-card> </v-card>
</v-navigation-drawer> </v-navigation-drawer>
<v-navigation-drawer persistent app :mini-variant.sync="mini" v-model="drawer" <v-navigation-drawer persistent app :mini-variant.sync="mini" v-model="drawer"
:disable-route-watcher="true" > :disable-route-watcher="true" :enable-resize-watcher="true">
<v-list class="pa-0"> <v-list class="pa-0">
<v-list-tile avatar tag="div"> <v-list-tile avatar tag="div">