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

vuetify 1.5.0

Browse source
This commit is contained in:
Andy Bunce 2019-02-06 11:10:03 +00:00
parent ab8bfccecb
commit c5e27fffa0
19 changed files with 308 additions and 213 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/vue-poc/app.vue
View file

@ -157,6 +157,7 @@
{href: '/namespace', text: 'Namespaces',icon: 'label' }, {href: '/namespace', text: 'Namespaces',icon: 'label' },
{href: '/entity', text: 'Entities',icon: 'redeem' }, {href: '/entity', text: 'Entities',icon: 'redeem' },
]}, ]},
{ {
icon: 'cast_connected', icon: 'cast_connected',
text: 'Server' , text: 'Server' ,
@ -172,6 +173,7 @@
{href: '/server/dicetest',text: 'Dice performance',icon: 'update'}, {href: '/server/dicetest',text: 'Dice performance',icon: 'update'},
{href: '/server/settings',text: 'Server settings',icon: 'settings_applications'} {href: '/server/settings',text: 'Server settings',icon: 'settings_applications'}
]}, ]},
{ {
icon: 'camera_roll', icon: 'camera_roll',
text: 'Images' , text: 'Images' ,
@ -185,6 +187,7 @@
{href: '/map',text: 'Map',icon: 'place'}, {href: '/map',text: 'Map',icon: 'place'},
{href: '/images/report',text: 'Reports',icon: 'report'} {href: '/images/report',text: 'Reports',icon: 'report'}
]}, ]},
{ {
icon: 'format_list_bulleted', icon: 'format_list_bulleted',
text: 'Forms' , text: 'Forms' ,

10
src/vue-poc/components/EditTabs.js
View file

@ -1,11 +1,11 @@
//Manage array of text sources used for:edit tabs //Manage array of text sources used for:edit tabs
// item{ // item{
// name: // name: file name
// contentType: "text/xml", // contentType: "text/xml",
// mode: "xml", // mode: "xml",
// text: // text:
// id: ids have the form "Tn" // id: ids have the form "Tn"
// url: path to save to // uri: path to save to
// requires: Settings,HTTP // requires: Settings,HTTP
// //
const GEditTabs={ const GEditTabs={
@ -20,20 +20,22 @@ const GEditTabs={
}, },
methods: { methods: {
// add tab return index
addItem(tab){ addItem(tab){
//console.log("new: ",tab); //console.log("new: ",tab);
var def={name: "AA"+this.nextId, var def={name: "AA"+this.nextId,
contentType: "text/xml", contentType: "text/xml",
mode: "xml", mode: "xml",
text: "<foo>" +this.nextId +"</foo>", text: "<foo>" +this.nextId +"</foo>",
url: null uri: null
}; };
var etab = Object.assign(def,tab); var etab = Object.assign(def,tab);
etab.id= "T" + this.nextId etab.id= "T" + this.nextId
this.items.push (etab); this.items.push (etab);
this.length++ this.length++
this.nextId++; this.nextId++;
return etab; var ind=this.items.indexOf(etab)
return ind;
}, },
closeItem(item){ closeItem(item){

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

@ -34,16 +34,27 @@ const MimeTypes=new function(){
"format": formatdom "format": formatdom
}, },
"css": { "css": {
"format": formatcss "format": formatcss,
"icon": "school"
},
"xquery": {
"icon": "spa"
} }
}; };
// return [{name:.. mode:..}..]
this.list=function(){ this.list=function(){
var that=this var that=this
var h= Object.keys(this.contentType).map( var h= Object.keys(this.contentType).map(
function(k){ return {name: k, mode: that.contentType[k].mode}} function(k){ return {name: k, mode: that.contentType[k].mode}}
) )
return h return h
} };
this.icon=function(mode){
var i= this.mode[mode] && this.mode[mode].icon
return i || "insert_drive_file"
};
this.install=function(Vue){ this.install=function(Vue){
Object.defineProperty(Vue.prototype, '$MimeTypes', { Object.defineProperty(Vue.prototype, '$MimeTypes', {
get () { return MimeTypes } get () { return MimeTypes }

7
src/vue-poc/components/qd-tablist.vue
View file

@ -1,6 +1,9 @@
<!DOCTYPE html> <!DOCTYPE html>
<!-- <!--
Show tab editor for tab list. Show tab editor for tab list.
props
'edittabs' object
'current' integer current index 0 based
--> -->
<template id="qd-tablist"> <template id="qd-tablist">
<v-menu left bottom :close-on-content-click="false" > <v-menu left bottom :close-on-content-click="false" >
@ -30,12 +33,12 @@
avatar dense ripple avatar dense ripple
@click="setItem(index)" :inactive="index == current" @click="setItem(index)" :inactive="index == current"
> >
<v-list-tile-avatar> <v-list-tile-avatar :title="edittabs.items[index].contentType">
<v-icon v-if="index == current">check_circle</v-icon> <v-icon v-if="index == current">check_circle</v-icon>
<v-icon v-else>insert_drive_file</v-icon> <v-icon v-else>insert_drive_file</v-icon>
</v-list-tile-avatar> </v-list-tile-avatar>
<v-list-tile-content> <v-list-tile-content :title="edittabs.items[index].url">
<v-list-tile-title>{{ edittabs.items[index].name }}</v-list-tile-title> <v-list-tile-title>{{ edittabs.items[index].name }}</v-list-tile-title>
</v-list-tile-content> </v-list-tile-content>

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

@ -74,11 +74,11 @@ sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat.`}, ut aliquip ex ea commodo consequat.`},
{name:"Shopping.xq", id:"2", mode: "xquery" ,dirty: false, {name:"shopping.xq", id:"2", mode: "xquery" ,dirty: false,
text:`let $a:=1 to 5 text:`let $a:=1 to 5
return $a `}, return $a `},
{name:"videos.xml", id:"3", mode:"xml",dirty: false, location: "xmldb:/vue-poc/aaa/bca/videos.xml", {name:"videos.xml", id:"3", mode:"xml",dirty: false, uri: "xmldb:/vue-poc/aaa/bca/videos.xml",
text:`<foo version="1.0"> text:`<foo version="1.0">
<node>hello</node> <node>hello</node>
</foo>`} </foo>`}

41
src/vue-poc/features/edit/tabs.vue
View file

@ -115,12 +115,13 @@
v-for="item in EditTabs.items" v-for="item in EditTabs.items"
:key="item.id" :key="item.id"
ripple ripple
:title="item.uri"
style="text-transform: none;text-align:left" style="text-transform: none;text-align:left"
> >
<v-avatar > <v-avatar >
<v-icon size="16px">insert_drive_file</v-icon> <v-icon :title="item.mode" >{{ $MimeTypes.icon(item.mode) }}</v-icon>
</v-avatar> </v-avatar>
<span >{{ (item.dirty?"*":"") }}</span> <span >{{ (item.dirty?"*":"") }}</span>
<span >{{ item.name }}</span> <span >{{ item.name }}</span>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn icon @click.stop="tabClose(item)"> <v-btn icon @click.stop="tabClose(item)">
@ -131,22 +132,21 @@
</v-toolbar> </v-toolbar>
<v-tabs-items v-model="curIndex"> <v-tabs-items v-model="curIndex">
<v-tab-item <v-tab-item
v-for="item in EditTabs.items" v-for="item in EditTabs.items"
:key="item.id" :key="item.id"
> >
<v-card >
<v-card > <div style="height:200px" ref="ace" v-resize="onResize" >
<div style="height:200px" ref="ace" v-resize="onResize" > <v-flex xs12 fill-height >
<v-flex xs12 fill-height > <vue-ace :content="item.text" v-on:change-content="changeContent" :events="events"
<vue-ace :content="item.text" v-on:change-content="changeContent" :events="events" :mode="item.mode" :wrap="wrap" :settings="aceSettings" v-on:annotation="annotation"></vue-ace>
:mode="item.mode" :wrap="wrap" :settings="aceSettings" v-on:annotation="annotation"></vue-ace> </v-flex>
</v-flex> </div>
</div> </v-card>
</v-card> </v-tab-item>
</v-tab-item> </v-tabs-items>
</v-tabs-items>
</div> </div>
</template> </template>
@ -171,8 +171,7 @@
methods:{ methods:{
add(){ add(){
var a=this.EditTabs.addItem({text:"hi "+ new Date()}) this.curIndex=this.EditTabs.addItem({text:"hi "+ new Date()})
this.curIndex=this.EditTabs.items.indexOf(a)
}, },
tabClose(item,index){ tabClose(item,index){
@ -230,7 +229,7 @@
var d=this.active.mode; var d=this.active.mode;
var f=this.$MimeTypes.mode[d]; var f=this.$MimeTypes.mode[d];
var f=f && f.validate; var f=f && f.validate;
alert("no validate yet"); this.curIndex=this.EditTabs.addItem({text:"validate: todo\n "+ this.curIndex +"\n" + new Date()})
}, },

5
src/vue-poc/features/images/images.vue
View file

@ -60,8 +60,9 @@
v-for="image in images" v-for="image in images"
:key="image.name" :key="image.name"
> >
<v-card flat tile > <v-card tile :elevation="2" :hover="true" color="grey lighten-3" >
<div :style="style(image)" v-bind:class="{ selcard: image.selected}" <div :style="style(image)" v-bind:class="{ selcard: image.selected}"
@dblclick="go(image)" @click.prevent.stop="image.selected =! image.selected "> @dblclick="go(image)" @click.prevent.stop="image.selected =! image.selected ">
<span v-if="image.keywords >0 ">#{{image.keywords}}</span> <span v-if="image.keywords >0 ">#{{image.keywords}}</span>
<v-avatar icon small v-if="image.geo"> <v-avatar icon small v-if="image.geo">

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

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<template id="login"> <template id="login">
<v-layout> <v-layout>
<v-flex xs12 sm6 offset-sm3> <v-flex >
<v-card > <v-card >
<v-card-title class="red"> <v-card-title class="red">
@ -9,42 +9,41 @@
</v-card-title> </v-card-title>
<v-card-actions> <v-card-actions>
<v-text-field <v-form v-model="valid" ref="form">
name="input-name" <v-text-field
label="User name" label="Enter your user id "
hint="Enter your name" v-model="name"
v-model="name" :rules="nameRules"
required required
></v-text-field> ></v-text-field>
</v-card-actions> <v-text-field
label="Enter your password"
<v-card-actions> v-model="password"
<v-text-field min="8"
name="input-password" :append-icon="hidepass ? 'visibility' : 'visibility_off'"
label="Password" @click:append="() => hidepass = !hidepass"
hint="Enter your password" :type="hidepass ? 'password' : 'text'"
v-model="password" :rules="passwordRules"
:append-icon="hidepass ? 'visibility' : 'visibility_off'" counter
@click:append="() => (hidepass = !hidepass)" required
:type="hidepass ? 'password' : 'text'" ></v-text-field>
required <v-switch
></v-text-field> label="Remember me" v-model="remember">
</v-card-actions> </v-switch>
<v-layout justify-space-between>
<v-spacer></v-spacer>
<v-btn @click="submit" :class=" { 'blue darken-4 white--text' : valid, disabled: !valid }">Login</v-btn>
</v-layout>
</v-form>
</v-card-actions>
<v-card-actions>
<a href="">Forgot Password</a>
<v-alert color="error" v-bind:value="showMessage"> <v-alert color="error" v-bind:value="showMessage">
{{message}} {{message}}
</v-alert> </v-alert>
<v-card-actions>
<v-switch
label="Remember me" v-model="remember">
</v-switch>
</v-card-actions> </v-card-actions>
<v-card-actions >
<v-spacer></v-spacer>
<v-btn color="primary" @click="go()">Login</v-btn>
</v-card-actions>
</v-card> </v-card>
</v-flex> </v-flex>
</v-layout> </v-layout>
@ -53,9 +52,16 @@
<script>{ <script>{
data () { data () {
return { return {
hidepass: true, valid: false,
name:'',
password: '', password: '',
passwordRules: [
(v) => !!v || 'Password is required',
],
name: '',
nameRules: [
(v) => !!v || 'Name is required'
],
hidepass: true,
remember: false, remember: false,
redirect: this.$route.query.redirect, redirect: this.$route.query.redirect,
message:"", message:"",
@ -63,6 +69,14 @@
} }
}, },
methods:{ methods:{
submit () {
if (this.$refs.form.validate()) {
this.go()
}
},
clear () {
this.$refs.form.reset()
},
go () { go () {
this.hidepass=true this.hidepass=true
this.showMessage=false this.showMessage=false

27
src/vue-poc/features/model/documentation.vue
View file

@ -1,8 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<template id="documentation"> <template id="documentation">
<v-container fluid> <v-container fluid>
<h1>TODO</h1> <v-toolbar dense >
<a href="/vue-poc/api/xqdoc" target="doc">list</a> <v-toolbar-title>documentation</v-toolbar-title>
<v-spacer></v-spacer>
<a href="/vue-poc/api/xqdocjob" target="doc">json</a>
</v-toolbar>
<v-container fluid grid-list-md>
<v-layout row wrap >
<v-flex height="80px"
xs2
v-for="item in items"
:key="item.id"
>
<v-card :hover="true" >
<v-card-title>{{ item.id }}</v-card-title>
<v-card-text>{{ item.name }}</v-card-text>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-container> </v-container>
</template> </template>
@ -15,9 +34,9 @@
}, },
methods:{ methods:{
get() { get() {
HTTP.get('xqdoc') HTTP.get('xqdocjob')
.then((res) => { .then((res) => {
this.items = res.data.items; this.items = res.data;
console.log("items",this.items) console.log("items",this.items)
}); });
}, },

4
src/vue-poc/features/model/xqdocs.xqm
View file

@ -5,7 +5,7 @@ module namespace j = 'quodatum.test.xqdoc';
: job list : job list
:) :)
declare declare
%rest:GET %rest:path("/vue-poc/api/xqdoc") %rest:GET %rest:path("/vue-poc/api/xqdocjob")
%output:method("json") %output:method("json")
function j:list() function j:list()
as element(json) as element(json)
@ -24,7 +24,7 @@ as element(json)
: job info : job info
:) :)
declare declare
%rest:GET %rest:path("/vue-poc/api/xqdoc/{$job}") %rest:GET %rest:path("/vue-poc/api/xqdocjob/{$job}")
%output:method("json") %output:method("json")
function j:job($job) function j:job($job)
as element(json) as element(json)

10
src/vue-poc/features/server/dicetest.vue
View file

@ -11,9 +11,12 @@
<v-card-text> <v-card-text>
<p>Read json data for 1st page for entity.</p> <p>Read json data for 1st page for entity.</p>
<v-flex xs12 sm6> <v-flex xs12 sm6>
<v-text-field v-model="url" <v-combobox
label="url" v-model="url"
></v-text-field> :items="urls"
label="Select target"
></v-combobox>
</v-flex> </v-flex>
<table class="v-table"> <table class="v-table">
@ -82,6 +85,7 @@
getValues: new perfStat(), getValues: new perfStat(),
repeat: {get:false}, repeat: {get:false},
url: "data/entity", url: "data/entity",
urls: ["data/entity","data/taskhistory"],
counter: 0, counter: 0,
result: null result: null
} }

20
src/vue-poc/features/server/ping.vue
View file

@ -29,7 +29,7 @@
<tr> <tr>
<td> <td>
<v-btn @click="get()" > <v-btn @click="get()" >
Read <v-icon right>compare_arrows</v-icon> Read Db<v-icon right>compare_arrows</v-icon>
</v-btn> </v-btn>
</td> </td>
@ -62,7 +62,7 @@
<tr> <tr>
<td> <td>
<v-btn @click="update()" > <v-btn @click="update()" >
Write <v-icon right>compare_arrows</v-icon> Write Db<v-icon right>compare_arrows</v-icon>
</v-btn> </v-btn>
</td> </td>
@ -103,9 +103,11 @@
<script>{ <script>{
data: function(){ data: function(){
return { return {
nothingValues: new perfStat(),
staticValues: new perfStat(),
getValues: new perfStat(), getValues: new perfStat(),
postValues: new perfStat(), postValues: new perfStat(),
repeat: {get:false,post:false}, repeat: {get: false, post: false, staticx: false, nothing: false},
counter: "(unread)" counter: "(unread)"
} }
}, },
@ -136,6 +138,18 @@
} }
}) })
}, },
nothing () {
var _start = performance.now();
HTTP.post("nothing",axios_json)
.then(r=>{
var elapsed=Math.floor(performance.now() - _start);
this.counter=r.data
Object.assign(this.nothingValues,this.nothingValues.log(elapsed))
if(this.repeat.nothing){
this.nothing(); //does this leak??
}
})
},
gchange(v){ gchange(v){
if(v)this.get() if(v)this.get()
}, },

13
src/vue-poc/features/server/ping.xqm
View file

@ -1,6 +1,6 @@
module namespace ping = 'quodatum.test.ping'; module namespace ping = 'quodatum.test.ping';
declare variable $ping:db as xs:string:="vue-poc"; declare variable $ping:db as xs:string:="vue-poc";
declare variable $ping:state as element(state):=db:open($ping:db,"/state.xml")/state; declare %basex:lazy variable $ping:state as element(state):=db:open($ping:db,"/state.xml")/state;
(:~ (:~
: ping incr counter : ping incr counter
@ -23,4 +23,15 @@ declare
function ping:dostate() function ping:dostate()
{ {
$ping:state/ping $ping:state/ping
};
(:~
: ping fastest no work
:)
declare
%output:method("text")
%rest:GET %rest:path("/vue-poc/api/nodb")
function ping:nodb()
{
"ok"
}; };

5
src/vue-poc/features/settings/keys.vue
View file

@ -31,7 +31,7 @@
</v-expansion-panel> </v-expansion-panel>
</v-card-text> </v-card-text>
</v-card> </v-card>
<v-snackbar v-model="true" >Settings are currently only stored locally in the browser, using <code>localstorage</code></v-snackbar> <v-snackbar :value="true" >Settings are currently only stored locally in the browser, using <code>localstorage</code></v-snackbar>
</v-container> </v-container>
</template> </template>
@ -43,7 +43,7 @@
}, },
methods:{ methods:{
wipe(){ wipe(){
if(confirm("wipe localstorage? ")) Settings.clear(); if(confirm("wipe localstorage? ")) Settings.clear();
}, },
showKey(){ showKey(){
@ -65,6 +65,7 @@
console.log("settings") console.log("settings")
Settings.keys() Settings.keys()
.then( v =>{ .then( v =>{
console.log("keys: ",v)
this.keys=v this.keys=v
}) })

2
src/vue-poc/features/tasks/rxq-tasks.xqm
View file

@ -41,7 +41,7 @@ function vue-rest:task($task)
}; };
(:~ (:~
: task run : Run the named task and log history
:) :)
declare declare
%rest:POST %rest:path("/vue-poc/api/tasks/{$task}") %rest:POST %rest:path("/vue-poc/api/tasks/{$task}")

47
src/vue-poc/features/tasks/taskdef.xml
View file

@ -1,43 +1,36 @@
<tasks> <tasks>
<task name="model" url="model.build/tx-model.xq"> <task name="model" url="model.build/tx-model.xq">
<title>Generate model.gen.xqm</title> <title>Generate model.gen.xqm</title>
<description> Generate <description>
<code>model.gen.xqm</code></description> Generate
<code>model.gen.xqm</code>
</description>
</task> </task>
<task name="import" url="task/tx-dbimport.xq"> <task name="import" url="task/tx-dbimport.xq">
<title>Load files into database</title> <title>Load files into database</title>
<description>Load files into database</description> <description>Load files into database</description>
</task>
<task name="xqdoc" url="xqdoc/tx-xqdoc.xq">
<title>XQdoc</title>
<description>Generate documentation for folder</description>
</task> </task>
<task name="xqdoc2" url="xqdoc/tx-xqdoc2.xq"> <task name="xqdoc2" url="xqdoc/tx-xqdoc2.xq">
<title>XQdoc 2</title> <title>XQdoc 2</title>
<description>Generate xquery documentation for folder. Using standard task.</description> <description>Generate xquery documentation for folder. Using standard
</task> task.</description>
</task>
<task name="xqdoc-rest" url="xqdoc/tx-xqrest.xq">
<title>XQdoc rest</title> <task name="xqdoc-rest2" url="xqdoc/tx-xqrest2.xq">
<description>XQdoc...</description> <title>XQdoc rest2</title>
</task> <description>XQdoc.2..</description>
</task>
<task name="xqdoc-rest2" url="xqdoc/tx-xqrest2.xq">
<title>XQdoc rest2</title>
<description>XQdoc.2..</description>
</task>
<task name="vuecompile"> <task name="vuecompile">
<title>vue compile</title> <title>vue compile</title>
<description>compile</description> <description>compile</description>
</task> </task>
<task name="newapp" url="task/tx-newapp.xq"> <task name="newapp" url="task/tx-newapp.xq">
<title>application template</title> <title>application template</title>
<description>application template</description> <description>application template</description>
<params> <params>
<param name="appname">Name for new application</param> <param name="appname">Name for new application</param>
</params> </params>

39
src/vue-poc/features/tasks/xqdoc/tx-xqdoc.xq
View file

@ -1,39 +0,0 @@
(:~
: Generate html for for XQuery sources
: @return info about the run (json format)
:)
import module namespace fw="quodatum:file.walker";
import module namespace xqd = 'quodatum:build.xqdoc' at "../../../lib/xqdoc/xqdoc-proj.xqm";
declare namespace c="http://www.w3.org/ns/xproc-step";
(:~ URL of the root folder to document
: @default C:/Users/andy/git/vue-poc/src/vue-poc
:)
declare variable $efolder as xs:anyURI external
:=xs:anyURI("C:/Users/andy/git/vue-poc/src/vue-poc");
(:~ URL of the schema to use
: @default C:/tmp/xqdoc/
:)
declare variable $target as xs:anyURI external
:=xs:anyURI("C:/tmp/xqdoc/");
declare variable $state as element(state):=db:open("vue-poc","/state.xml")/state;
let $project:=tokenize($efolder,"[/\\]")[last()]=>trace("xqdoc: ")
let $files:= fw:directory-list($efolder,map{"include-filter":".*\.xqm"})
let $id:=$state/last-id
let $opts:=map{
"project": $project,
"id": $id/string()
}
let $op:=xqd:save-xq($files,$target,$opts)
let $result:=<json type="object">
<extra>hello</extra>
<msg> {$target}, {count($files//c:file)} files processed.</msg>
<id>{$id/string()}</id>
</json>
return (
update:output($result),
replace value of node $id with 1+$state/last-id
)

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

@ -1,4 +1,4 @@
// generated 2019-01-23T22:04:55.22Z // generated 2019-02-05T23:14:56.207Z
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/components/qd-autoheight.vue // src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/components/qd-autoheight.vue
Vue.component('qd-autoheight',{template:` Vue.component('qd-autoheight',{template:`
@ -475,12 +475,12 @@ Vue.component('qd-tablist',{template:`
<v-card-text> <v-card-text>
<v-list style="height: 300px; overflow-y: auto;"> <v-list style="height: 300px; overflow-y: auto;">
<v-list-tile v-for="index in edittabs.sorted(q)" :key="index" avatar dense ripple @click="setItem(index)" :inactive="index == current"> <v-list-tile v-for="index in edittabs.sorted(q)" :key="index" avatar dense ripple @click="setItem(index)" :inactive="index == current">
<v-list-tile-avatar> <v-list-tile-avatar :title="edittabs.items[index].contentType">
<v-icon v-if="index == current">check_circle</v-icon> <v-icon v-if="index == current">check_circle</v-icon>
<v-icon v-else>insert_drive_file</v-icon> <v-icon v-else>insert_drive_file</v-icon>
</v-list-tile-avatar> </v-list-tile-avatar>
<v-list-tile-content> <v-list-tile-content :title="edittabs.items[index].url">
<v-list-tile-title>{{ edittabs.items[index].name }}</v-list-tile-title> <v-list-tile-title>{{ edittabs.items[index].name }}</v-list-tile-title>
</v-list-tile-content> </v-list-tile-content>
@ -1135,7 +1135,6 @@ const AceExtras={
caption: "archive:create#2", caption: "archive:create#2",
snippet: "archive:create(${1:entries}, ${2:contents})", snippet: "archive:create(${1:entries}, ${2:contents})",
score: 100, score: 100,
content: "this is a test completer",
meta: "archive", meta: "archive",
completer: this completer: this
}, { }, {
@ -1193,12 +1192,12 @@ Vue.use(Auth);
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/components/EditTabs.js // src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/components/EditTabs.js
//Manage array of text sources used for:edit tabs //Manage array of text sources used for:edit tabs
// item{ // item{
// name: // name: file name
// contentType: "text/xml", // contentType: "text/xml",
// mode: "xml", // mode: "xml",
// text: // text:
// id: ids have the form "Tn" // id: ids have the form "Tn"
// url: path to save to // uri: path to save to
// requires: Settings,HTTP // requires: Settings,HTTP
// //
const GEditTabs={ const GEditTabs={
@ -1213,20 +1212,22 @@ const GEditTabs={
}, },
methods: { methods: {
// add tab return index
addItem(tab){ addItem(tab){
//console.log("new: ",tab); //console.log("new: ",tab);
var def={name: "AA"+this.nextId, var def={name: "AA"+this.nextId,
contentType: "text/xml", contentType: "text/xml",
mode: "xml", mode: "xml",
text: "<foo>" +this.nextId +"</foo>", text: "<foo>" +this.nextId +"</foo>",
url: null uri: null
}; };
var etab = Object.assign(def,tab); var etab = Object.assign(def,tab);
etab.id= "T" + this.nextId etab.id= "T" + this.nextId
this.items.push (etab); this.items.push (etab);
this.length++ this.length++
this.nextId++; this.nextId++;
return etab; var ind=this.items.indexOf(etab)
return ind;
}, },
closeItem(item){ closeItem(item){
@ -1422,16 +1423,27 @@ const MimeTypes=new function(){
"format": formatdom "format": formatdom
}, },
"css": { "css": {
"format": formatcss "format": formatcss,
"icon": "school"
},
"xquery": {
"icon": "spa"
} }
}; };
// return [{name:.. mode:..}..]
this.list=function(){ this.list=function(){
var that=this var that=this
var h= Object.keys(this.contentType).map( var h= Object.keys(this.contentType).map(
function(k){ return {name: k, mode: that.contentType[k].mode}} function(k){ return {name: k, mode: that.contentType[k].mode}}
) )
return h return h
} };
this.icon=function(mode){
var i= this.mode[mode] && this.mode[mode].icon
return i || "insert_drive_file"
};
this.install=function(Vue){ this.install=function(Vue){
Object.defineProperty(Vue.prototype, '$MimeTypes', { Object.defineProperty(Vue.prototype, '$MimeTypes', {
get () { return MimeTypes } get () { return MimeTypes }
@ -2752,11 +2764,11 @@ const Tabs=Vue.extend({template:`
<qd-tablist v-if="EditTabs" :edittabs="EditTabs" :current="curIndex" @selected="setItem">tab list</qd-tablist> <qd-tablist v-if="EditTabs" :edittabs="EditTabs" :current="curIndex" @selected="setItem">tab list</qd-tablist>
<v-tabs v-model="curIndex" slot="extension"> <v-tabs v-model="curIndex" slot="extension">
<v-tab v-for="item in EditTabs.items" :key="item.id" ripple style="text-transform: none;text-align:left"> <v-tab v-for="item in EditTabs.items" :key="item.id" ripple :title="item.uri" style="text-transform: none;text-align:left">
<v-avatar> <v-avatar>
<v-icon size="16px">insert_drive_file</v-icon> <v-icon :title="item.mode">{{ $MimeTypes.icon(item.mode) }}</v-icon>
</v-avatar> </v-avatar>
<span>{{ (item.dirty?"*":"") }}</span> <span>{{ (item.dirty?"*":"") }}</span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn icon @click.stop="tabClose(item)"> <v-btn icon @click.stop="tabClose(item)">
@ -2767,18 +2779,17 @@ const Tabs=Vue.extend({template:`
</v-toolbar> </v-toolbar>
<v-tabs-items v-model="curIndex"> <v-tabs-items v-model="curIndex">
<v-tab-item v-for="item in EditTabs.items" :key="item.id"> <v-tab-item v-for="item in EditTabs.items" :key="item.id">
<v-card>
<v-card> <div style="height:200px" ref="ace" v-resize="onResize">
<div style="height:200px" ref="ace" v-resize="onResize"> <v-flex xs12 fill-height>
<v-flex xs12 fill-height> <vue-ace :content="item.text" v-on:change-content="changeContent" :events="events" :mode="item.mode" :wrap="wrap" :settings="aceSettings" v-on:annotation="annotation"></vue-ace>
<vue-ace :content="item.text" v-on:change-content="changeContent" :events="events" :mode="item.mode" :wrap="wrap" :settings="aceSettings" v-on:annotation="annotation"></vue-ace> </v-flex>
</v-flex> </div>
</div> </v-card>
</v-card> </v-tab-item>
</v-tab-item> </v-tabs-items>
</v-tabs-items>
</div> </div>
`, `,
@ -2802,8 +2813,7 @@ const Tabs=Vue.extend({template:`
methods:{ methods:{
add(){ add(){
var a=this.EditTabs.addItem({text:"hi "+ new Date()}) this.curIndex=this.EditTabs.addItem({text:"hi "+ new Date()})
this.curIndex=this.EditTabs.items.indexOf(a)
}, },
tabClose(item,index){ tabClose(item,index){
@ -2861,7 +2871,7 @@ const Tabs=Vue.extend({template:`
var d=this.active.mode; var d=this.active.mode;
var f=this.$MimeTypes.mode[d]; var f=this.$MimeTypes.mode[d];
var f=f && f.validate; var f=f && f.validate;
alert("no validate yet"); this.curIndex=this.EditTabs.addItem({text:"validate: todo\n "+ this.curIndex +"\n" + new Date()})
}, },
@ -3797,7 +3807,7 @@ const Images=Vue.extend({template:`
<v-container v-if="!busy" fluid grid-list-md> <v-container v-if="!busy" fluid grid-list-md>
<v-layout row wrap v-touch="{ left: () => pageNext(), right: () => pageBack()}"> <v-layout row wrap v-touch="{ left: () => pageNext(), right: () => pageBack()}">
<v-flex height="80px" xs2 v-for="image in images" :key="image.name"> <v-flex height="80px" xs2 v-for="image in images" :key="image.name">
<v-card flat tile> <v-card tile :elevation="2" :hover="true" color="grey lighten-3">
<div :style="style(image)" v-bind:class="{ selcard: image.selected}" @dblclick="go(image)" @click.prevent.stop="image.selected =! image.selected "> <div :style="style(image)" v-bind:class="{ selcard: image.selected}" @dblclick="go(image)" @click.prevent.stop="image.selected =! image.selected ">
<span v-if="image.keywords >0 ">#{{image.keywords}}</span> <span v-if="image.keywords >0 ">#{{image.keywords}}</span>
<v-avatar icon small v-if="image.geo"> <v-avatar icon small v-if="image.geo">
@ -4512,7 +4522,7 @@ const Jobs=Vue.extend({template:`
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/login/login.vue // src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/login/login.vue
const Login=Vue.extend({template:` const Login=Vue.extend({template:`
<v-layout> <v-layout>
<v-flex xs12 sm6 offset-sm3> <v-flex>
<v-card> <v-card>
<v-card-title class="red"> <v-card-title class="red">
@ -4520,26 +4530,25 @@ const Login=Vue.extend({template:`
</v-card-title> </v-card-title>
<v-card-actions> <v-card-actions>
<v-text-field name="input-name" label="User name" hint="Enter your name" v-model="name" required></v-text-field> <v-form v-model="valid" ref="form">
</v-card-actions> <v-text-field label="Enter your user id " v-model="name" :rules="nameRules" required></v-text-field>
<v-text-field label="Enter your password" v-model="password" min="8" :append-icon="hidepass ? 'visibility' : 'visibility_off'" @click:append="() => hidepass = !hidepass" :type="hidepass ? 'password' : 'text'" :rules="passwordRules" counter required></v-text-field>
<v-card-actions> <v-switch label="Remember me" v-model="remember">
<v-text-field name="input-password" label="Password" hint="Enter your password" v-model="password" :append-icon="hidepass ? 'visibility' : 'visibility_off'" @click:append="() => (hidepass = !hidepass)" :type="hidepass ? 'password' : 'text'" required></v-text-field> </v-switch>
</v-card-actions> <v-layout justify-space-between>
<v-spacer></v-spacer>
<v-btn @click="submit" :class=" { 'blue darken-4 white--text' : valid, disabled: !valid }">Login</v-btn>
</v-layout>
</v-form>
</v-card-actions>
<v-card-actions>
<a href>Forgot Password</a>
<v-alert color="error" v-bind:value="showMessage"> <v-alert color="error" v-bind:value="showMessage">
{{message}} {{message}}
</v-alert> </v-alert>
<v-card-actions>
<v-switch label="Remember me" v-model="remember">
</v-switch>
</v-card-actions> </v-card-actions>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary" @click="go()">Login</v-btn>
</v-card-actions>
</v-card> </v-card>
</v-flex> </v-flex>
</v-layout> </v-layout>
@ -4547,9 +4556,16 @@ const Login=Vue.extend({template:`
data () { data () {
return { return {
hidepass: true, valid: false,
name:'',
password: '', password: '',
passwordRules: [
(v) => !!v || 'Password is required',
],
name: '',
nameRules: [
(v) => !!v || 'Name is required'
],
hidepass: true,
remember: false, remember: false,
redirect: this.$route.query.redirect, redirect: this.$route.query.redirect,
message:"", message:"",
@ -4557,6 +4573,14 @@ const Login=Vue.extend({template:`
} }
}, },
methods:{ methods:{
submit () {
if (this.$refs.form.validate()) {
this.go()
}
},
clear () {
this.$refs.form.reset()
},
go () { go () {
this.hidepass=true this.hidepass=true
this.showMessage=false this.showMessage=false
@ -4621,8 +4645,23 @@ const Leaflet=Vue.extend({template:`
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/model/documentation.vue // src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/model/documentation.vue
const Documentation=Vue.extend({template:` const Documentation=Vue.extend({template:`
<v-container fluid> <v-container fluid>
<h1>TODO</h1> <v-toolbar dense>
<a href="/vue-poc/api/xqdoc" target="doc">list</a> <v-toolbar-title>documentation</v-toolbar-title>
<v-spacer></v-spacer>
<a href="/vue-poc/api/xqdocjob" target="doc">list</a>
</v-toolbar>
<v-container fluid grid-list-md>
<v-layout row wrap>
<v-flex height="80px" xs2 v-for="item in items" :key="item.id">
<v-card :hover="true">
<v-card-title>{{ item.id }}</v-card-title>
<v-card-text>{{ item.name }}</v-card-text>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-container> </v-container>
`, `,
@ -4634,9 +4673,9 @@ const Documentation=Vue.extend({template:`
}, },
methods:{ methods:{
get() { get() {
HTTP.get('xqdoc') HTTP.get('xqdocjob')
.then((res) => { .then((res) => {
this.items = res.data.items; this.items = res.data;
console.log("items",this.items) console.log("items",this.items)
}); });
}, },
@ -5555,7 +5594,8 @@ const Dicetest=Vue.extend({template:`
<v-card-text> <v-card-text>
<p>Read json data for 1st page for entity.</p> <p>Read json data for 1st page for entity.</p>
<v-flex xs12 sm6> <v-flex xs12 sm6>
<v-text-field v-model="url" label="url"></v-text-field> <v-combobox v-model="url" :items="urls" label="Select target"></v-combobox>
</v-flex> </v-flex>
<table class="v-table"> <table class="v-table">
@ -5623,6 +5663,7 @@ const Dicetest=Vue.extend({template:`
getValues: new perfStat(), getValues: new perfStat(),
repeat: {get:false}, repeat: {get:false},
url: "data/entity", url: "data/entity",
urls: ["data/entity","data/taskhistory"],
counter: 0, counter: 0,
result: null result: null
} }
@ -5697,7 +5738,7 @@ const Ping=Vue.extend({template:`
<tr> <tr>
<td> <td>
<v-btn @click="get()"> <v-btn @click="get()">
Read <v-icon right>compare_arrows</v-icon> Read Db<v-icon right>compare_arrows</v-icon>
</v-btn> </v-btn>
</td> </td>
@ -5730,7 +5771,7 @@ const Ping=Vue.extend({template:`
<tr> <tr>
<td> <td>
<v-btn @click="update()"> <v-btn @click="update()">
Write <v-icon right>compare_arrows</v-icon> Write Db<v-icon right>compare_arrows</v-icon>
</v-btn> </v-btn>
</td> </td>
@ -5770,9 +5811,11 @@ const Ping=Vue.extend({template:`
data: function(){ data: function(){
return { return {
nothingValues: new perfStat(),
staticValues: new perfStat(),
getValues: new perfStat(), getValues: new perfStat(),
postValues: new perfStat(), postValues: new perfStat(),
repeat: {get:false,post:false}, repeat: {get: false, post: false, staticx: false, nothing: false},
counter: "(unread)" counter: "(unread)"
} }
}, },
@ -5803,6 +5846,18 @@ const Ping=Vue.extend({template:`
} }
}) })
}, },
nothing () {
var _start = performance.now();
HTTP.post("nothing",axios_json)
.then(r=>{
var elapsed=Math.floor(performance.now() - _start);
this.counter=r.data
Object.assign(this.nothingValues,this.nothingValues.log(elapsed))
if(this.repeat.nothing){
this.nothing(); //does this leak??
}
})
},
gchange(v){ gchange(v){
if(v)this.get() if(v)this.get()
}, },
@ -6078,7 +6133,7 @@ const Keys=Vue.extend({template:`
</v-expansion-panel> </v-expansion-panel>
</v-card-text> </v-card-text>
</v-card> </v-card>
<v-snackbar v-model="true">Settings are currently only stored locally in the browser, using <code>localstorage</code></v-snackbar> <v-snackbar :value="true">Settings are currently only stored locally in the browser, using <code>localstorage</code></v-snackbar>
</v-container> </v-container>
`, `,
@ -6089,7 +6144,7 @@ const Keys=Vue.extend({template:`
}, },
methods:{ methods:{
wipe(){ wipe(){
if(confirm("wipe localstorage? ")) Settings.clear(); if(confirm("wipe localstorage? ")) Settings.clear();
}, },
showKey(){ showKey(){
@ -6111,6 +6166,7 @@ const Keys=Vue.extend({template:`
console.log("settings") console.log("settings")
Settings.keys() Settings.keys()
.then( v =>{ .then( v =>{
console.log("keys: ",v)
this.keys=v this.keys=v
}) })
@ -7377,6 +7433,7 @@ const Vuepoc=Vue.extend({template:`
{href: '/namespace', text: 'Namespaces',icon: 'label' }, {href: '/namespace', text: 'Namespaces',icon: 'label' },
{href: '/entity', text: 'Entities',icon: 'redeem' }, {href: '/entity', text: 'Entities',icon: 'redeem' },
]}, ]},
{ {
icon: 'cast_connected', icon: 'cast_connected',
text: 'Server' , text: 'Server' ,
@ -7392,6 +7449,7 @@ const Vuepoc=Vue.extend({template:`
{href: '/server/dicetest',text: 'Dice performance',icon: 'update'}, {href: '/server/dicetest',text: 'Dice performance',icon: 'update'},
{href: '/server/settings',text: 'Server settings',icon: 'settings_applications'} {href: '/server/settings',text: 'Server settings',icon: 'settings_applications'}
]}, ]},
{ {
icon: 'camera_roll', icon: 'camera_roll',
text: 'Images' , text: 'Images' ,
@ -7405,6 +7463,7 @@ const Vuepoc=Vue.extend({template:`
{href: '/map',text: 'Map',icon: 'place'}, {href: '/map',text: 'Map',icon: 'place'},
{href: '/images/report',text: 'Reports',icon: 'report'} {href: '/images/report',text: 'Reports',icon: 'report'}
]}, ]},
{ {
icon: 'format_list_bulleted', icon: 'format_list_bulleted',
text: 'Forms' , text: 'Forms' ,
@ -7604,11 +7663,11 @@ sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat.`}, ut aliquip ex ea commodo consequat.`},
{name:"Shopping.xq", id:"2", mode: "xquery" ,dirty: false, {name:"shopping.xq", id:"2", mode: "xquery" ,dirty: false,
text:`let $a:=1 to 5 text:`let $a:=1 to 5
return $a `}, return $a `},
{name:"videos.xml", id:"3", mode:"xml",dirty: false, location: "xmldb:/vue-poc/aaa/bca/videos.xml", {name:"videos.xml", id:"3", mode:"xml",dirty: false, uri: "xmldb:/vue-poc/aaa/bca/videos.xml",
text:`<foo version="1.0"> text:`<foo version="1.0">
<node>hello</node> <node>hello</node>
</foo>`} </foo>`}

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

@ -10,7 +10,7 @@
<link rel="shortcut icon" href="/vue-poc/ui/icon.png"/> <link rel="shortcut icon" href="/vue-poc/ui/icon.png"/>
<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 rel="stylesheet" href="//unpkg.com/vuetify@1.4.3/dist/vuetify.min.css" type="text/css"/> <link rel="stylesheet" href="//unpkg.com/vuetify@1.5.0/dist/vuetify.min.css" type="text/css"/>
<link rel="stylesheet" href="//unpkg.com/@riophae/vue-treeselect@0.0.29/dist/vue-treeselect.min.css"/> <link rel="stylesheet" href="//unpkg.com/@riophae/vue-treeselect@0.0.29/dist/vue-treeselect.min.css"/>
<link rel="stylesheet" href="/vue-poc/ui/prism/prism.css" rel="stylesheet" type="text/css"/> <link rel="stylesheet" href="/vue-poc/ui/prism/prism.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="//unpkg.com/leaflet@1.0.3/dist/leaflet.css"/> <link rel="stylesheet" href="//unpkg.com/leaflet@1.0.3/dist/leaflet.css"/>
@ -21,7 +21,7 @@
<body> <body>
<div id="app"> <div id="app">
<h3><code>vue-poc</code> <small>(v0.3.151)</small> </h3> <h3><code>vue-poc</code> <small>(v0.3.152)</small> </h3>
<div class="spinner"> <div class="spinner">
<div class="rect1"></div> <div class="rect1"></div>
@ -37,7 +37,7 @@
<script src="//cdnjs.cloudflare.com/ajax/libs/vue-router/3.0.1/vue-router.js" crossorigin="anonymous"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/vue-router/3.0.1/vue-router.js" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js" crossorigin="anonymous"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/qs/6.4.0/qs.js" crossorigin="anonymous" ></script> <script src="//cdnjs.cloudflare.com/ajax/libs/qs/6.4.0/qs.js" crossorigin="anonymous" ></script>
<script src="//unpkg.com/vuetify@1.4.3/dist/vuetify.min.js" crossorigin="anonymous"></script> <script src="//unpkg.com/vuetify@1.5.0/dist/vuetify.min.js" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ace.js" crossorigin="anonymous"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ace.js" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ext-language_tools.js" crossorigin="anonymous"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ext-language_tools.js" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ext-linking.js" crossorigin="anonymous" charset="utf-8"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ext-linking.js" crossorigin="anonymous" charset="utf-8"></script>