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

vuetify 0.15.2

Browse source
This commit is contained in:
Andy Bunce 2017-09-04 12:27:36 +01:00
parent f2d20c204f
commit 91cc5b40cc
7 changed files with 87 additions and 59 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/vue-poc/components/core.js
View file

@ -2,11 +2,25 @@
localforage.config({ localforage.config({
name: 'vuepoc' name: 'vuepoc'
}); });
const HTTP = axios.create({ const HTTP = axios.create({
baseURL: "/vue-poc/api/", baseURL: "/vue-poc/api/",
headers: { headers: {
'X-Custom-Header': 'vue-poc', 'X-Custom-Header': 'vue-poc',
accept: 'application/json' accept: 'application/json'
},
paramsSerializer: function(params) {
return Qs.stringify(params)
}
});
const HTTPNE = axios.create({
baseURL: "/vue-poc/api/",
headers: {
'X-Custom-Header': 'vue-poc',
accept: 'application/json'
},
paramsSerializer: function(params) {
return Qs.stringify(params)
} }
}); });
const axios_json={ headers: {accept: 'application/json'}}; const axios_json={ headers: {accept: 'application/json'}};
@ -291,6 +305,7 @@ const app = new Vue({
}, },
(error) =>{ (error) =>{
// interupt restxq single // interupt restxq single
console.log("$$$$$$$$$$$",error)
if(460 != error.response.status)this.showAlert("http error:\n"+error.response.data) if(460 != error.response.status)this.showAlert("http error:\n"+error.response.data)
return Promise.reject(error); return Promise.reject(error);
}); });

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

@ -46,8 +46,8 @@ ace editor for vue.js
session.setUseWrapMode(value) session.setUseWrapMode(value)
}, },
'settings' (value) { 'settings' (value) {
//console.log("--settings--",value) console.log("--settings--",value)
this.applySettings() this.applySettings(value)
} }
}, },
methods:{ methods:{
@ -68,9 +68,8 @@ ace editor for vue.js
}]); }]);
}, },
applySettings(){ applySettings(aceSettings){
const aceSettings=this.settings console.log("apply: ",aceSettings)
//console.log("font: ",aceSettings.fontsize)
this.editor.setTheme(`ace/theme/${aceSettings.theme}`) this.editor.setTheme(`ace/theme/${aceSettings.theme}`)
//this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`) //this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`)
this.editor.setFontSize(parseInt(aceSettings.fontsize,10)) this.editor.setFontSize(parseInt(aceSettings.fontsize,10))
@ -88,12 +87,10 @@ ace editor for vue.js
const mode = this.mode || 'text' const mode = this.mode || 'text'
const wrap = this.wrap || false const wrap = this.wrap || false
const aceSettings=this.settings
console.log("QA: ",this.settings.theme)
const readOnly = this.readOnly || false const readOnly = this.readOnly || false
ace.config.set("workerPath", "/vue-poc/ui/ace-workers") ace.config.set("workerPath", "/vue-poc/ui/ace-workers")
this.editor = window.ace.edit(this.$el) this.editor = window.ace.edit(this.$el)
this.applySettings(this.aceSettings)
this.editor.$blockScrolling = Infinity this.editor.$blockScrolling = Infinity
this.editor.setValue(this.content, 1) this.editor.setValue(this.content, 1)
this.editor.setOptions({ readOnly:this.readOnly }) this.editor.setOptions({ readOnly:this.readOnly })
@ -112,7 +109,7 @@ ace editor for vue.js
}) })
this.editor.on('change', () => { this.editor.on('change', () => {
this.beforeContent = this.editor.getValue() this.beforeContent = this.editor.getValue()
this.$emit('change-content', this.editor.getValue()) this.$emit('change-content', this.beforeContent)
}); });
this.editor.getSession().on("changeAnnotation", ()=>{ this.editor.getSession().on("changeAnnotation", ()=>{

7
src/vue-poc/features/edit/edit.vue
View file

@ -208,13 +208,12 @@ v-on:annotation="annotation"></vue-ace>
}, },
save(){ save(){
alert("TODO save: "+this.url); alert("TODO save: "+this.url);
var data=Qs.stringify( var data= {
{
protocol:this.protocol, protocol:this.protocol,
url: this.url, //gave the values directly for testing url: this.url, //gave the values directly for testing
data: this.contentA data: this.contentA
}) }
HTTP.post("edit", data,{ HTTP.post("edit", Qs.stringify(data),{
headers: { "Content-Type": "application/x-www-form-urlencoded"} headers: { "Content-Type": "application/x-www-form-urlencoded"}
}).then(r=>{ }).then(r=>{
alert("AAA") alert("AAA")

24
src/vue-poc/features/eval/eval.vue
View file

@ -55,13 +55,11 @@
</v-card-actions> </v-card-actions>
<v-card-text v-if="showError"> <v-card-text v-if="showError">
<v-alert error > <v-alert error v-model="showError">Error </v-alert>
{{result}}
</v-alert>
</v-card-text> </v-card-text>
<v-card-text v-if="showResult"> <v-card-text v-if="showResult">
<v-flex xs12 style="height:200px" fill-height> <v-flex xs12 style="height:200px" fill-height>
<vue-ace :content="result" mode="text" wrap="false" read-only="true" <vue-ace :content="result" mode="text" wrap="false" read-only="true" :settings="aceSettings"
></vue-ace> ></vue-ace>
</v-flex> </v-flex>
</v-card-text> </v-card-text>
@ -96,7 +94,7 @@
run(){ run(){
this.awaitResult(false) this.awaitResult(false)
this.start = performance.now(); this.start = performance.now();
HTTP.post("eval/execute",Qs.stringify({xq:this.xq})) HTTPNE.post("eval/execute",Qs.stringify({xq:this.xq}))
.then(r=>{ .then(r=>{
this.elapsed=Math.floor(performance.now() - this.start); this.elapsed=Math.floor(performance.now() - this.start);
this.result=r.data.result this.result=r.data.result
@ -111,10 +109,9 @@
localforage.setItem('eval/xq', this.xq) localforage.setItem('eval/xq', this.xq)
}, },
submit(){ submit(){
var data={xq:this.xq} this.showError=this.showResult=this.show=false
this.showResult=this.show=false
this.start = performance.now(); this.start = performance.now();
HTTP.post("eval/submit",Qs.stringify(data)) HTTPNE.post("eval/submit",Qs.stringify({xq:this.xq}))
.then(r=>{ .then(r=>{
this.elapsed=Math.floor(performance.now() - this.start); this.elapsed=Math.floor(performance.now() - this.start);
this.jobId=r.data.job this.jobId=r.data.job
@ -123,6 +120,7 @@
}) })
.catch(r=> { .catch(r=> {
alert("catch")
console.log("error",r) console.log("error",r)
this.jobId=r.response.job this.jobId=r.response.job
this.showError=true; this.showError=true;
@ -145,10 +143,16 @@
}, },
getResult(){ getResult(){
this.awaitResult(true) this.awaitResult(true)
HTTP.post("eval/result/"+this.jobId) HTTPNE.post("eval/result/"+this.jobId)
.then(r=>{ .then(r=>{
this.result=r.data.result+" " this.result=r.data.result+" "
}) }).catch(r=> {
// alert("catch")
console.log("error",r)
this.result=r.response.data
this.showError=true;
});
}, },
hitme(){ hitme(){
this.showResult=true this.showResult=true

7
src/vue-poc/features/login/login.vue
View file

@ -54,13 +54,12 @@
go () { go () {
this.hidepass=true this.hidepass=true
this.showMessage=false this.showMessage=false
var data=Qs.stringify( var data={
{
username: this.name, //gave the values directly for testing username: this.name, //gave the values directly for testing
password: this.password, password: this.password,
redirect: this.redirect redirect: this.redirect
}) }
HTTP.post("login-check", data) HTTP.post("login-check",Qs.stringify( data))
.then(r=>{ .then(r=>{
console.log("login",r.data) console.log("login",r.data)
if(r.data.status){ if(r.data.status){

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

@ -1,4 +1,4 @@
// generated 2017-09-03T23:24:46.005+01:00 // generated 2017-09-04T12:26:20.994+01:00
Vue.component('qd-fullscreen',{template:` Vue.component('qd-fullscreen',{template:`
<a @click="toggle()" href="javascript:void(0);" title="Fullscreen toggle"> <a @click="toggle()" href="javascript:void(0);" title="Fullscreen toggle">
<v-icon>{{ fullscreenIcon }}</v-icon> <v-icon>{{ fullscreenIcon }}</v-icon>
@ -182,8 +182,8 @@
session.setUseWrapMode(value) session.setUseWrapMode(value)
}, },
'settings' (value) { 'settings' (value) {
//console.log("--settings--",value) console.log("--settings--",value)
this.applySettings() this.applySettings(value)
} }
}, },
methods:{ methods:{
@ -204,9 +204,8 @@
}]); }]);
}, },
applySettings(){ applySettings(aceSettings){
const aceSettings=this.settings console.log("apply: ",aceSettings)
//console.log("font: ",aceSettings.fontsize)
this.editor.setTheme(`ace/theme/${aceSettings.theme}`) this.editor.setTheme(`ace/theme/${aceSettings.theme}`)
//this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`) //this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`)
this.editor.setFontSize(parseInt(aceSettings.fontsize,10)) this.editor.setFontSize(parseInt(aceSettings.fontsize,10))
@ -224,12 +223,10 @@
const mode = this.mode || 'text' const mode = this.mode || 'text'
const wrap = this.wrap || false const wrap = this.wrap || false
const aceSettings=this.settings
console.log("QA: ",this.settings.theme)
const readOnly = this.readOnly || false const readOnly = this.readOnly || false
ace.config.set("workerPath", "/vue-poc/ui/ace-workers") ace.config.set("workerPath", "/vue-poc/ui/ace-workers")
this.editor = window.ace.edit(this.$el) this.editor = window.ace.edit(this.$el)
this.applySettings(this.aceSettings)
this.editor.$blockScrolling = Infinity this.editor.$blockScrolling = Infinity
this.editor.setValue(this.content, 1) this.editor.setValue(this.content, 1)
this.editor.setOptions({ readOnly:this.readOnly }) this.editor.setOptions({ readOnly:this.readOnly })
@ -248,7 +245,7 @@
}) })
this.editor.on('change', () => { this.editor.on('change', () => {
this.beforeContent = this.editor.getValue() this.beforeContent = this.editor.getValue()
this.$emit('change-content', this.editor.getValue()) this.$emit('change-content', this.beforeContent)
}); });
this.editor.getSession().on("changeAnnotation", ()=>{ this.editor.getSession().on("changeAnnotation", ()=>{
@ -850,13 +847,12 @@ Vue.filter('round', function(value, decimals) {
}, },
save(){ save(){
alert("TODO save: "+this.url); alert("TODO save: "+this.url);
var data=Qs.stringify( var data= {
{
protocol:this.protocol, protocol:this.protocol,
url: this.url, //gave the values directly for testing url: this.url, //gave the values directly for testing
data: this.contentA data: this.contentA
}) }
HTTP.post("edit", data,{ HTTP.post("edit", Qs.stringify(data),{
headers: { "Content-Type": "application/x-www-form-urlencoded"} headers: { "Content-Type": "application/x-www-form-urlencoded"}
}).then(r=>{ }).then(r=>{
alert("AAA") alert("AAA")
@ -989,13 +985,11 @@ Vue.filter('round', function(value, decimals) {
</v-card-actions> </v-card-actions>
<v-card-text v-if="showError"> <v-card-text v-if="showError">
<v-alert error=""> <v-alert error="" v-model="showError">Error </v-alert>
{{result}}
</v-alert>
</v-card-text> </v-card-text>
<v-card-text v-if="showResult"> <v-card-text v-if="showResult">
<v-flex xs12="" style="height:200px" fill-height=""> <v-flex xs12="" style="height:200px" fill-height="">
<vue-ace :content="result" mode="text" wrap="false" read-only="true"></vue-ace> <vue-ace :content="result" mode="text" wrap="false" read-only="true" :settings="aceSettings"></vue-ace>
</v-flex> </v-flex>
</v-card-text> </v-card-text>
</v-card> </v-card>
@ -1028,7 +1022,7 @@ Vue.filter('round', function(value, decimals) {
run(){ run(){
this.awaitResult(false) this.awaitResult(false)
this.start = performance.now(); this.start = performance.now();
HTTP.post("eval/execute",Qs.stringify({xq:this.xq})) HTTPNE.post("eval/execute",Qs.stringify({xq:this.xq}))
.then(r=>{ .then(r=>{
this.elapsed=Math.floor(performance.now() - this.start); this.elapsed=Math.floor(performance.now() - this.start);
this.result=r.data.result this.result=r.data.result
@ -1043,10 +1037,9 @@ Vue.filter('round', function(value, decimals) {
localforage.setItem('eval/xq', this.xq) localforage.setItem('eval/xq', this.xq)
}, },
submit(){ submit(){
var data={xq:this.xq} this.showError=this.showResult=this.show=false
this.showResult=this.show=false
this.start = performance.now(); this.start = performance.now();
HTTP.post("eval/submit",Qs.stringify(data)) HTTPNE.post("eval/submit",Qs.stringify({xq:this.xq}))
.then(r=>{ .then(r=>{
this.elapsed=Math.floor(performance.now() - this.start); this.elapsed=Math.floor(performance.now() - this.start);
this.jobId=r.data.job this.jobId=r.data.job
@ -1055,6 +1048,7 @@ Vue.filter('round', function(value, decimals) {
}) })
.catch(r=> { .catch(r=> {
alert("catch")
console.log("error",r) console.log("error",r)
this.jobId=r.response.job this.jobId=r.response.job
this.showError=true; this.showError=true;
@ -1077,10 +1071,16 @@ Vue.filter('round', function(value, decimals) {
}, },
getResult(){ getResult(){
this.awaitResult(true) this.awaitResult(true)
HTTP.post("eval/result/"+this.jobId) HTTPNE.post("eval/result/"+this.jobId)
.then(r=>{ .then(r=>{
this.result=r.data.result+" " this.result=r.data.result+" "
}) }).catch(r=> {
// alert("catch")
console.log("error",r)
this.result=r.response.data
this.showError=true;
});
}, },
hitme(){ hitme(){
this.showResult=true this.showResult=true
@ -1810,13 +1810,12 @@ body
go () { go () {
this.hidepass=true this.hidepass=true
this.showMessage=false this.showMessage=false
var data=Qs.stringify( var data={
{
username: this.name, //gave the values directly for testing username: this.name, //gave the values directly for testing
password: this.password, password: this.password,
redirect: this.redirect redirect: this.redirect
}) }
HTTP.post("login-check", data) HTTP.post("login-check",Qs.stringify( data))
.then(r=>{ .then(r=>{
console.log("login",r.data) console.log("login",r.data)
if(r.data.status){ if(r.data.status){
@ -3060,11 +3059,25 @@ users todo
localforage.config({ localforage.config({
name: 'vuepoc' name: 'vuepoc'
}); });
const HTTP = axios.create({ const HTTP = axios.create({
baseURL: "/vue-poc/api/", baseURL: "/vue-poc/api/",
headers: { headers: {
'X-Custom-Header': 'vue-poc', 'X-Custom-Header': 'vue-poc',
accept: 'application/json' accept: 'application/json'
},
paramsSerializer: function(params) {
return Qs.stringify(params)
}
});
const HTTPNE = axios.create({
baseURL: "/vue-poc/api/",
headers: {
'X-Custom-Header': 'vue-poc',
accept: 'application/json'
},
paramsSerializer: function(params) {
return Qs.stringify(params)
} }
}); });
const axios_json={ headers: {accept: 'application/json'}}; const axios_json={ headers: {accept: 'application/json'}};
@ -3349,6 +3362,7 @@ const app = new Vue({
}, },
(error) =>{ (error) =>{
// interupt restxq single // interupt restxq single
console.log("$$$$$$$$$$$",error)
if(460 != error.response.status)this.showAlert("http error:\n"+error.response.data) if(460 != error.response.status)this.showAlert("http error:\n"+error.response.data)
return Promise.reject(error); return Promise.reject(error);
}); });

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.15.1/dist/vuetify.min.css" rel="stylesheet" type="text/css"> <link href="https://unpkg.com/vuetify@0.15.2/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 href="/vue-poc/ui/app.css" rel="stylesheet" type="text/css"> <link href="/vue-poc/ui/app.css" rel="stylesheet" type="text/css">
@ -19,7 +19,7 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/2.5.3/vue-router.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/2.5.3/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.15.1/dist/vuetify.min.js"></script> <script src="https://unpkg.com/vuetify@0.15.2/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>