[add] components

This commit is contained in:
Andy Bunce 2021-01-14 23:24:01 +00:00
parent 55b3b91f81
commit 1304878a70
16 changed files with 340 additions and 113 deletions

View File

@ -1,3 +1,10 @@
# Data storage
`core.js` defines settings
## Vuex
state.js
## Localforage
localforage.config({
name: 'vuepoc'
});

View File

@ -39,7 +39,7 @@
<router-view name="helper" class="view ma-3"></router-view>
</v-navigation-drawer>
<v-app-bar app :clipped-left="$vuetify.breakpoint.lgAndUp"
<v-app-bar app :clipped-left="$vuetify.breakpoint.lgAndUp" :collapse-on-scroll="true"
color="blue darken-3" dense
dark >
<v-app-bar-nav-icon @click.stop="drawer = !drawer" ></v-app-bar-nav-icon>
@ -104,7 +104,7 @@
</v-list-item>
</v-list>
</v-menu>
</v-app-bar>
<v-main>
@ -115,7 +115,19 @@
<router-view class="view ma-3"></router-view>
</transition>
</v-main>
<v-btn
v-scroll="onScroll"
v-show="fab"
fab
dark
fixed
bottom
right
color="primary"
@click="toTop"
>
<v-icon>keyboard_arrow_up</v-icon>
</v-btn>
</v-app>
</template>
@ -134,6 +146,7 @@
drawer: true,
showNotifications: false,
mini: false,
fab: false,
alert: {show:false,msg:"Hello"},
frmfav: false,
@ -167,6 +180,7 @@
children: [
{href: '/database', text: 'Databases',icon: 'developer_mode' },
{href: '/files', text: 'File system',icon: 'folder' },
{href: '/components', text: 'Component library',icon: 'engineering' },
{href: '/documentation', text: 'Documentation',icon: 'library_books' },
{href: '/history/files',text: 'history',icon: 'history'}
]},
@ -270,7 +284,15 @@
showAlert(msg){
this.alert.msg=format(new Date())+" "+ msg
this.alert.show=true
}
},
onScroll (e) {
if (typeof window === 'undefined') return
const top = window.pageYOffset || e.target.scrollTop || 0
this.fab = top > 20
},
toTop () {
this.$vuetify.goTo(0)
}
},
watch: {
showNotifications: function (val) {

View File

@ -10,6 +10,7 @@ for vis-time-line http://visjs.org/docs/graph2d/
data(){
return {timeline:Object}
},
methods:{
select(properties){
this.$emit('select',properties.items);
@ -21,6 +22,7 @@ for vis-time-line http://visjs.org/docs/graph2d/
this.timeline.fit(true)
}
},
watch:{
items(newItems){
console.log("vis-time-line: new items:" + newItems.length)
@ -30,8 +32,8 @@ for vis-time-line http://visjs.org/docs/graph2d/
console.log("opts: ",newOpts)
}
},
mounted: function () {
var options = this.options;
var groups = this.groups;
var items = new vis.DataSet(this.items);

View File

@ -17,7 +17,8 @@ event fired cmd outline
'settings',
'minLines',
'completer',
'snippets'
'snippets',
'placeholder'
],
data () {
return {
@ -28,9 +29,9 @@ event fired cmd outline
themeDark: "chaos",
keybinding: "ace",
fontsize: 16,
enableSnippets:true,
enableBasicAutocompletion:true,
enableLiveAutocompletion:true
enableSnippets: true,
enableBasicAutocompletion: true,
enableLiveAutocompletion: true
},
annots:{
@ -98,10 +99,10 @@ event fired cmd outline
},
applySettings(aceSettings){
var theme=this.$vuetify.theme.dark?aceSettings.themeDark:aceSettings.theme;
this.editor.setTheme(`ace/theme/${theme}`)
this.editor.setTheme()
//this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`)
this.editor.setFontSize(parseInt(aceSettings.fontsize,10))
this.editor.setOption("placeholder", this.placeholder)
this.editor.setOptions({
enableSnippets : aceSettings.enableSnippets,
enableBasicAutocompletion : aceSettings.enableBasicAutocompletion,
@ -110,6 +111,7 @@ event fired cmd outline
useSoftTabs: true
});
}
},
@ -167,6 +169,9 @@ event fired cmd outline
this.$emit('token', token);
});
//this.editor.on("input", this.update);
//setTimeout(this.update, 100);
if(this.events){
this.events.$on('eventFired', (cmd) => {
if(cmd=="outline"){

View File

@ -1,5 +1,5 @@
<entity name="basex.database" xmlns="https://github.com/Quodatum/app-doc/entity">
<description>BaseX databases</description>
<description>A BaseX database of the running server. From db:list()</description>
<fields>
<field name="name" type="xs:string">

View File

@ -1,5 +1,5 @@
<entity name="basex.user" xmlns="https://github.com/Quodatum/app-doc/entity">
<description>BaseX users </description>
<description>BaseX user listed on the running server.</description>
<fields>
<field name="name" type="xs:string">

View File

@ -1,11 +1,12 @@
<entity name="dice.entity" xmlns="https://github.com/Quodatum/app-doc/entity">
<description>List of Entities i.e. things described in this framework
<description>List of Entities i.e. things described in this framework.
The name may be dot delimited to indicate the package structure.
</description>
<namespace prefix="ent"
uri="https://github.com/Quodatum/app-doc/entity" />
<fields>
<field name="name" type="xs:string">
<description>name</description>
<description>Unique name of the entitty e.g."dice.entity" </description>
<xpath>@name</xpath>
</field>
<field name="type" type="xs:string">

View File

@ -0,0 +1,24 @@
<entity name="quodatum.cmpx" xmlns="https://github.com/Quodatum/app-doc/entity">
<description>Cmpx library components </description>
<namespace prefix="cmpx" uri="urn:quodatum:qd-cmpx:component" />
<fields>
<field name="name" type="xs:string">
<description>name of component</description>
<xpath>@name</xpath>
</field>
<field name="type" type="xs:string">
<description>browser or ??</description>
<xpath>cmpx:type</xpath>
</field>
<field name="home" type="xs:string">
<description>url for component</description>
<xpath>cmpx:home</xpath>
</field>
<field name="description" type="xs:string">
<description>description of component</description>
<xpath>cmpx:description</xpath>
</field>
</fields>
<views iconclass="library_books"/>
<data type="element(cmpx:cmp)">collection('~qd-cmpx')/cmpx:cmp</data>
</entity>

View File

@ -0,0 +1,34 @@
<!DOCTYPE html>
<template id="components">
<v-container fluid>
<qd-table :headers="headers" data-uri="data/quodatum.cmpx" entity="quodatum.cmpx" item-key="name">
<template v-slot:title >AAA</template>
<template v-slot:item.home="{ item }" >
<a :href=" item.home" target="cmpx">
{{ item.home }}
</a>
</template>
<template slot="no-results">
No matching results.
</template>
<template slot="no-data">
No matching items.
</template>
</qd-table>
</v-container>
</template>
<script>{
data: function(){
return {
headers: [
{ text: 'name', value: 'name'},
{ text: 'type', value: 'type' },
{ text: 'home', value: 'home' },
{ text: 'description', value: 'description' }
]
}
}
}
</script>

View File

@ -157,7 +157,8 @@
<div style="height:200px" ref="ace" v-resize="onResize" >
<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>
:mode="item.mode" :wrap="wrap" :settings="aceSettings" v-on:annotation="annotation"
placeholder="Type.."></vue-ace>
</v-flex>
</div>
</v-card>

View File

@ -63,7 +63,7 @@
<v-card-text>
<v-flex xs12 style="height:200px" fill-height>
<vue-ace :content="xq" mode="xquery" wrap="true"
:settings="aceSettings" v-on:change-content="onChange"
:settings="aceSettings" v-on:change-content="onChange" placeholder="Type XQuery here then click run.."
></vue-ace>
</v-flex>
<vp-job v-if="showJob" :job="job" :waiting="waiting" :job-state="jobState" :elapsed="elapsed"></vp-job>
@ -74,7 +74,8 @@
<v-card-text v-if="showResult">
<v-flex xs12 style="height:200px" fill-height>
<vue-ace :content="result" mode="text" wrap="false" read-only="true" :settings="aceSettings"
<vue-ace :content="result" mode="text" wrap="false" read-only="true"
:settings="aceSettings"
></vue-ace>
</v-flex>
</v-card-text>
@ -90,7 +91,7 @@
data: function(){
return {
xq: '(: type your XQuery :)\n',
xq: null,
result: '',
done: false,
elapsed: null,
@ -212,6 +213,7 @@
},
computed: {
},
beforeRouteEnter (to, from, next) {
Settings.getItem('settings/ace')
.then( v =>{
@ -221,9 +223,15 @@
vm.aceSettings = v;
})})
},
beforeRouteLeave (to, from, next) {
localforage.setItem('eval/xq',this.xq);
next()
},
created:function(){
console.log("eval: creatd");
localforage.getItem('eval/xq').then((value) => { this.xq=value || this.xq});
localforage.getItem('eval/xq').then((value) => { this.xq= value || this.xq});
},
beforeDestroy:function(){
this.destroyed=true;

View File

@ -64,8 +64,8 @@
q: null,
headers: [
{ text: 'Id', value: 'id' },
{ text: 'Task', value: 'task' },
{ text: 'Created', value: 'created' },
{ text: 'Task', value: 'task' },
{ text: 'Summary', value: 'summary' },
{ text: 'Params', value: 'arity' }
]

View File

@ -36,28 +36,30 @@
</template>
<template v-slot:default="props">
<v-row align-content="start" >
<v-col
v-for="item in props.items"
:key="item.name" >
<v-row align-content="start" no-gutters >
<v-col v-for="item in props.items" :key="item.name"
class="ma-2" no-gutters >
<v-card :hover="true" active-class="default-class qd-active" max-width="20em" min-width="20em">
<v-card :to="{path:'entity/'+ item.name}" :hover="true"
active-class="default-class qd-active" max-width="20em" min-width="20em" height="15em">
<v-toolbar color="orange lighten-3" >
<v-toolbar color="blue-grey lighten-3" >
<v-toolbar-title>
<router-link :to="{path:'entity/'+ item.name}">
<v-avatar color="lime">
<v-avatar tile color="lime" >
<v-icon >{{ item.iconclass }}</v-icon>
</v-avatar> {{ item.name }}
</router-link>
</v-avatar> {{ item.name }}
</v-toolbar-title>
</v-card-title>
<v-spacer></v-spacer>
<v-badge >
<span slot="badge">{{ item.nfields }}</span>
</v-badge>
</v-toolbar>
<v-card-text xs1 >{{ item.description }}</<v-card-text>
<v-divider ></v-divider>
<v-card-actions >
<v-chip color="green" text-color="white">Fields: {{ item.nfields }}</v-chip>
<v-spacer></v-spacer>
<v-btn icon>Xml</v-btn>
<v-btn icon>Json</v-btn>
</v-card-actions>
</v-card>
</v-col>
</v-row>
@ -82,7 +84,7 @@
methods:{
getItems(){
this.loading=true
HTTP.get("data/entity",{params:{q:this.q}})
HTTP.get("data/entity",{params:{q:this.q, sort:'name'}})
.then(r=>{
this.loading=false
//console.log(r.data)

View File

@ -1,5 +1,5 @@
(: entity access maps
: auto generated from xml files in entities folder at: 2020-11-27T21:35:19.672Z
: auto generated from xml files in entities folder at: 2021-01-13T22:12:01.894Z
:)
module namespace entity = 'quodatum.models.generated';
@ -8,6 +8,7 @@ declare namespace ent='https://github.com/Quodatum/app-doc/entity';
declare namespace h='urn:quodatum:vue-poc.history';
declare namespace xqdoc='http://www.xqdoc.org/1.0';
declare namespace qns='https://github.com/Quodatum/namespaces';
declare namespace cmpx='urn:quodatum:qd-cmpx:component';
declare namespace t='https://github.com/Quodatum/task';
declare namespace c='http://www.w3.org/ns/xproc-step';
@ -734,6 +735,44 @@ hof:top-k-by(admin:logs(), string#1, 2)
"views": map{
'filter': 'name description'
}
},
"quodatum.cmpx": map{
"name": "quodatum.cmpx",
"description": "Cmpx library components ",
"access": map{
'description': function($_ as element(cmpx:cmp)) as xs:string { $_! cmpx:description },
'home': function($_ as element(cmpx:cmp)) as xs:string { $_! cmpx:home },
'name': function($_ as element(cmpx:cmp)) as xs:string { $_! @name },
'type': function($_ as element(cmpx:cmp)) as xs:string { $_! cmpx:type } },
"filter": function($item,$q) as xs:boolean{
some $e in ( ) satisfies
fn:contains($e,$q, 'http://www.w3.org/2005/xpath-functions/collation/html-ascii-case-insensitive')
},
"json": map{
"description": function($_ as element(cmpx:cmp)) as element(description)? {
(: xs:string :)
fn:data($_!cmpx:description)!element description { .}
},
"home": function($_ as element(cmpx:cmp)) as element(home)? {
(: xs:string :)
fn:data($_!cmpx:home)!element home { .}
},
"name": function($_ as element(cmpx:cmp)) as element(name)? {
(: xs:string :)
fn:data($_!@name)!element name { .}
},
"type": function($_ as element(cmpx:cmp)) as element(type)? {
(: xs:string :)
fn:data($_!cmpx:type)!element type { .}
} },
"data": function() as element(cmpx:cmp)*
{ collection('~qd-cmpx')/cmpx:cmp },
"views": map{
}
},
"quodatum.logfile": map{

View File

@ -16,8 +16,27 @@ const router = new VueRouter({
},
routes: [
{ path: '/', component: Home, meta:{title:"Home"} },
{ path: '/session', component: Session ,meta: {title:"Session"}},
{ path: '/about', component: { template: '<router-view/>' } ,children:[
{path: '', component: About, meta:{title:"About Vue-poc"} },
{path: 'package', component: Package, meta:{title:"Javascript components"} },
{path: 'routes', component: Routes, meta:{title:"Routes"} },
{path: 'routes2', name: 'routes', component: Routes2, meta:{title:"Routes2"} },
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
]},
{ path: '/components', component: Components,meta:{title:"Components"},props:{protocol:"xmldb"} },
{ path: '/database', component: Files,meta:{title:"Databases"},props:{protocol:"xmldb"} },
{ path: '/documentation', component: Documentation, meta:{title:"documentation"} },
{ path: '/documentation/xqdoc', component: Xqdocs, meta:{title:"XQdoc"} },
{ path: '/edit', name: "edit",component: Edit,meta:{title:"Ace editor"} },
{ path: '/eval', component: Eval, meta:{title:"Evaluate XQuery"} },
{ path: '/eval/:id', component: Evalid, props: true, meta:{title:"Run details"} },
{ path: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
{path: '/images', component: { template: '<router-view/>' },
children: [
{path: '', redirect: 'item' },
@ -31,8 +50,7 @@ const router = new VueRouter({
]},
{ path: '/documentation', component: Documentation, meta:{title:"documentation"} },
{ path: '/documentation/xqdoc', component: Xqdocs, meta:{title:"XQdoc"} },
{ path: '/logdate', component: Basexlogdate, meta:{title:"log files"} },
{ path: '/logdate/:date', component: Basexlogdate1, props:true, meta:{title:"log files"} },
@ -58,15 +76,13 @@ const router = new VueRouter({
]
}
]},
{ path: '/session', component: Session ,meta: {title:"Session"}},
{ path: '/select', component: Select, meta:{title:"Select"} },
{ path: '/search', component: Search, meta:{title:"Search"} },
{ path: '/tabs', name: "multi-edit", component: Tabs,meta:{title:"tab test"} },
{ path: '/edit', name: "edit",component: Edit,meta:{title:"Ace editor"} },
{ path: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
{ path: '/database', component: Files,meta:{title:"Databases"},props:{protocol:"xmldb"} },
{ path: '/login', component: Login,meta:{title:"login"} },
{ path: '/settings', component: { template: '<router-view/>' }
@ -89,10 +105,10 @@ const router = new VueRouter({
},
{ path: '/performance', component: { template: '<router-view/>' }
,children: [
{ path: 'ping', component: Ping, meta:{title:"Ping"} },
{ path: 'dicetest', component: Dicetest, meta:{title: "Dice test"} }
]
,children: [
{ path: 'ping', component: Ping, meta:{title:"Ping"} },
{ path: 'dicetest', component: Dicetest, meta:{title: "Dice test"} }
]
},
{ path: '/server', component: { template: '<router-view/>' }
@ -152,8 +168,7 @@ const router = new VueRouter({
{ path: '/transform', component: Transform, meta:{title:"XSLT2 Transform"} },
{ path: '/validate', component: Validate, meta:{title:"Validate"} },
{ path: '/eval', component: Eval, meta:{title:"Evaluate XQuery"} },
{ path: '/eval/:id', component: Evalid, props: true, meta:{title:"Run details"} },
{ path: '/logs', component: Log, meta:{title:"Server logs"} },
@ -170,13 +185,7 @@ const router = new VueRouter({
{ path: '/map', component: Leaflet,meta:{title:"map"} },
{ path: '/about', component: { template: '<router-view/>' } ,children:[
{path: '', component: About, meta:{title:"About Vue-poc"} },
{path: 'package', component: Package, meta:{title:"Javascript components"} },
{path: 'routes', component: Routes, meta:{title:"Routes"} },
{path: 'routes2', name: 'routes', component: Routes2, meta:{title:"Routes2"} },
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
]},
{ path: '*', component: Notfound, meta:{title:"Page not found"} }
],

View File

@ -1,4 +1,4 @@
// generated 2021-01-13T18:11:28.088Z
// generated 2021-01-14T23:08:56.115Z
// src: C:\Users\andy\git\vue-poc\src\vue-poc\imports.js
import { parseISO, formatDistanceToNow, format, roundToNearestMinutes, addSeconds } from 'https://cdn.jsdelivr.net/npm/date-fns@2.16.1/+esm';
@ -766,6 +766,7 @@ Vue.component('vis-time-line',{template:`
data(){
return {timeline:Object}
},
methods:{
select(properties){
this.$emit('select',properties.items);
@ -777,6 +778,7 @@ Vue.component('vis-time-line',{template:`
this.timeline.fit(true)
}
},
watch:{
items(newItems){
console.log("vis-time-line: new items:" + newItems.length)
@ -786,8 +788,8 @@ Vue.component('vis-time-line',{template:`
console.log("opts: ",newOpts)
}
},
mounted: function () {
var options = this.options;
var groups = this.groups;
var items = new vis.DataSet(this.items);
@ -1212,7 +1214,8 @@ Vue.component('vue-ace',{template:`
'settings',
'minLines',
'completer',
'snippets'
'snippets',
'placeholder'
],
data () {
return {
@ -1223,9 +1226,9 @@ Vue.component('vue-ace',{template:`
themeDark: "chaos",
keybinding: "ace",
fontsize: 16,
enableSnippets:true,
enableBasicAutocompletion:true,
enableLiveAutocompletion:true
enableSnippets: true,
enableBasicAutocompletion: true,
enableLiveAutocompletion: true
},
annots:{
@ -1293,10 +1296,10 @@ Vue.component('vue-ace',{template:`
},
applySettings(aceSettings){
var theme=this.$vuetify.theme.dark?aceSettings.themeDark:aceSettings.theme;
this.editor.setTheme(`ace/theme/${theme}`)
this.editor.setTheme()
//this.editor.setKeyboardHandler(`ace/keyboard//${aceSettings.keybinding}`)
this.editor.setFontSize(parseInt(aceSettings.fontsize,10))
this.editor.setOption("placeholder", this.placeholder)
this.editor.setOptions({
enableSnippets : aceSettings.enableSnippets,
enableBasicAutocompletion : aceSettings.enableBasicAutocompletion,
@ -1305,6 +1308,7 @@ Vue.component('vue-ace',{template:`
useSoftTabs: true
});
}
},
@ -1362,6 +1366,9 @@ Vue.component('vue-ace',{template:`
this.$emit('token', token);
});
//this.editor.on("input", this.update);
//setTimeout(this.update, 100);
if(this.events){
this.events.$on('eventFired', (cmd) => {
if(cmd=="outline"){
@ -2686,6 +2693,42 @@ const Log=Vue.extend({template:`
);
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/collection/components.vue
const Components=Vue.extend({template:`
<v-container fluid>
<qd-table :headers="headers" data-uri="data/quodatum.cmpx" entity="quodatum.cmpx" item-key="name">
<template v-slot:title>AAA</template>
<template v-slot:item.home="{ item }">
<a :href=" item.home" target="cmpx">
{{ item.home }}
</a>
</template>
<template slot="no-results">
No matching results.
</template>
<template slot="no-data">
No matching items.
</template>
</qd-table>
</v-container>
`,
data: function(){
return {
headers: [
{ text: 'name', value: 'name'},
{ text: 'type', value: 'type' },
{ text: 'home', value: 'home' },
{ text: 'description', value: 'description' }
]
}
}
}
);
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/collection/documentation.vue
const Documentation=Vue.extend({template:`
<v-container fluid>
@ -4014,7 +4057,7 @@ const Tabs=Vue.extend({template:`
<v-card>
<div style="height:200px" ref="ace" v-resize="onResize">
<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" placeholder="Type.."></vue-ace>
</v-flex>
</div>
</v-card>
@ -4246,7 +4289,7 @@ const Eval=Vue.extend({template:`
</v-toolbar>
<v-card-text>
<v-flex xs12 style="height:200px" fill-height>
<vue-ace :content="xq" mode="xquery" wrap="true" :settings="aceSettings" v-on:change-content="onChange"></vue-ace>
<vue-ace :content="xq" mode="xquery" wrap="true" :settings="aceSettings" v-on:change-content="onChange" placeholder="Type XQuery here then click run.."></vue-ace>
</v-flex>
<vp-job v-if="showJob" :job="job" :waiting="waiting" :job-state="jobState" :elapsed="elapsed"></vp-job>
</v-card-text>
@ -4270,7 +4313,7 @@ const Eval=Vue.extend({template:`
data: function(){
return {
xq: '(: type your XQuery :)\n',
xq: null,
result: '',
done: false,
elapsed: null,
@ -4392,6 +4435,7 @@ const Eval=Vue.extend({template:`
},
computed: {
},
beforeRouteEnter (to, from, next) {
Settings.getItem('settings/ace')
.then( v =>{
@ -4401,9 +4445,15 @@ const Eval=Vue.extend({template:`
vm.aceSettings = v;
})})
},
beforeRouteLeave (to, from, next) {
localforage.setItem('eval/xq',this.xq);
next()
},
created:function(){
console.log("eval: creatd");
localforage.getItem('eval/xq').then((value) => { this.xq=value || this.xq});
localforage.getItem('eval/xq').then((value) => { this.xq= value || this.xq});
},
beforeDestroy:function(){
this.destroyed=true;
@ -4652,8 +4702,8 @@ const Taskhistory=Vue.extend({template:`
q: null,
headers: [
{ text: 'Id', value: 'id' },
{ text: 'Task', value: 'task' },
{ text: 'Created', value: 'created' },
{ text: 'Task', value: 'task' },
{ text: 'Summary', value: 'summary' },
{ text: 'Params', value: 'arity' }
]
@ -6005,26 +6055,28 @@ const Entity=Vue.extend({template:`
</template>
<template v-slot:default="props">
<v-row align-content="start">
<v-col v-for="item in props.items" :key="item.name">
<v-row align-content="start" no-gutters>
<v-col v-for="item in props.items" :key="item.name" class="ma-2" no-gutters>
<v-card :hover="true" active-class="default-class qd-active" max-width="20em" min-width="20em">
<v-card :to="{path:'entity/'+ item.name}" :hover="true" active-class="default-class qd-active" max-width="20em" min-width="20em" height="15em">
<v-toolbar color="orange lighten-3">
<v-toolbar color="blue-grey lighten-3">
<v-toolbar-title>
<router-link :to="{path:'entity/'+ item.name}">
<v-avatar color="lime">
<v-avatar tile color="lime">
<v-icon>{{ item.iconclass }}</v-icon>
</v-avatar> {{ item.name }}
</router-link>
</v-avatar> {{ item.name }}
</v-toolbar-title>
<v-spacer></v-spacer>
<v-badge>
<span slot="badge">{{ item.nfields }}</span>
</v-badge>
</v-toolbar>
<v-card-text xs1>{{ item.description }}<!--<v-card-text-->
<v-divider></v-divider>
<v-card-actions>
<v-chip color="green" text-color="white">Fields: {{ item.nfields }}</v-chip>
<v-spacer></v-spacer>
<v-btn icon>Xml</v-btn>
<v-btn icon>Json</v-btn>
</v-card-actions>
</v-card-text></v-card>
</v-col>
</v-row>
@ -6048,7 +6100,7 @@ const Entity=Vue.extend({template:`
methods:{
getItems(){
this.loading=true
HTTP.get("data/entity",{params:{q:this.q}})
HTTP.get("data/entity",{params:{q:this.q, sort:'name'}})
.then(r=>{
this.loading=false
//console.log(r.data)
@ -8754,8 +8806,27 @@ const router = new VueRouter({
},
routes: [
{ path: '/', component: Home, meta:{title:"Home"} },
{ path: '/session', component: Session ,meta: {title:"Session"}},
{ path: '/about', component: { template: '<router-view/>' } ,children:[
{path: '', component: About, meta:{title:"About Vue-poc"} },
{path: 'package', component: Package, meta:{title:"Javascript components"} },
{path: 'routes', component: Routes, meta:{title:"Routes"} },
{path: 'routes2', name: 'routes', component: Routes2, meta:{title:"Routes2"} },
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
]},
{ path: '/components', component: Components,meta:{title:"Components"},props:{protocol:"xmldb"} },
{ path: '/database', component: Files,meta:{title:"Databases"},props:{protocol:"xmldb"} },
{ path: '/documentation', component: Documentation, meta:{title:"documentation"} },
{ path: '/documentation/xqdoc', component: Xqdocs, meta:{title:"XQdoc"} },
{ path: '/edit', name: "edit",component: Edit,meta:{title:"Ace editor"} },
{ path: '/eval', component: Eval, meta:{title:"Evaluate XQuery"} },
{ path: '/eval/:id', component: Evalid, props: true, meta:{title:"Run details"} },
{ path: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
{path: '/images', component: { template: '<router-view/>' },
children: [
{path: '', redirect: 'item' },
@ -8769,8 +8840,7 @@ const router = new VueRouter({
]},
{ path: '/documentation', component: Documentation, meta:{title:"documentation"} },
{ path: '/documentation/xqdoc', component: Xqdocs, meta:{title:"XQdoc"} },
{ path: '/logdate', component: Basexlogdate, meta:{title:"log files"} },
{ path: '/logdate/:date', component: Basexlogdate1, props:true, meta:{title:"log files"} },
@ -8796,15 +8866,13 @@ const router = new VueRouter({
]
}
]},
{ path: '/session', component: Session ,meta: {title:"Session"}},
{ path: '/select', component: Select, meta:{title:"Select"} },
{ path: '/search', component: Search, meta:{title:"Search"} },
{ path: '/tabs', name: "multi-edit", component: Tabs,meta:{title:"tab test"} },
{ path: '/edit', name: "edit",component: Edit,meta:{title:"Ace editor"} },
{ path: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
{ path: '/database', component: Files,meta:{title:"Databases"},props:{protocol:"xmldb"} },
{ path: '/login', component: Login,meta:{title:"login"} },
{ path: '/settings', component: { template: '<router-view/>' }
@ -8827,10 +8895,10 @@ const router = new VueRouter({
},
{ path: '/performance', component: { template: '<router-view/>' }
,children: [
{ path: 'ping', component: Ping, meta:{title:"Ping"} },
{ path: 'dicetest', component: Dicetest, meta:{title: "Dice test"} }
]
,children: [
{ path: 'ping', component: Ping, meta:{title:"Ping"} },
{ path: 'dicetest', component: Dicetest, meta:{title: "Dice test"} }
]
},
{ path: '/server', component: { template: '<router-view/>' }
@ -8890,8 +8958,7 @@ const router = new VueRouter({
{ path: '/transform', component: Transform, meta:{title:"XSLT2 Transform"} },
{ path: '/validate', component: Validate, meta:{title:"Validate"} },
{ path: '/eval', component: Eval, meta:{title:"Evaluate XQuery"} },
{ path: '/eval/:id', component: Evalid, props: true, meta:{title:"Run details"} },
{ path: '/logs', component: Log, meta:{title:"Server logs"} },
@ -8908,13 +8975,7 @@ const router = new VueRouter({
{ path: '/map', component: Leaflet,meta:{title:"map"} },
{ path: '/about', component: { template: '<router-view/>' } ,children:[
{path: '', component: About, meta:{title:"About Vue-poc"} },
{path: 'package', component: Package, meta:{title:"Javascript components"} },
{path: 'routes', component: Routes, meta:{title:"Routes"} },
{path: 'routes2', name: 'routes', component: Routes2, meta:{title:"Routes2"} },
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
]},
{ path: '*', component: Notfound, meta:{title:"Page not found"} }
],
@ -8974,7 +9035,7 @@ const Vuepoc=Vue.extend({template:`
<router-view name="helper" class="view ma-3"></router-view>
</v-navigation-drawer>
<v-app-bar app :clipped-left="$vuetify.breakpoint.lgAndUp" color="blue darken-3" dense dark>
<v-app-bar app :clipped-left="$vuetify.breakpoint.lgAndUp" :collapse-on-scroll="true" color="blue darken-3" dense dark>
<v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
<v-toolbar-title class="hidden-sm-and-down">
{{$route.meta.title}}</v-toolbar-title>
@ -9037,7 +9098,7 @@ const Vuepoc=Vue.extend({template:`
</v-list-item>
</v-list>
</v-menu>
</v-app-bar>
<v-main>
@ -9048,7 +9109,9 @@ const Vuepoc=Vue.extend({template:`
<router-view class="view ma-3"></router-view>
</transition>
</v-main>
<v-btn v-scroll="onScroll" v-show="fab" fab dark fixed bottom right color="primary" @click="toTop">
<v-icon>keyboard_arrow_up</v-icon>
</v-btn>
</v-app>
`,
@ -9066,6 +9129,7 @@ const Vuepoc=Vue.extend({template:`
drawer: true,
showNotifications: false,
mini: false,
fab: false,
alert: {show:false,msg:"Hello"},
frmfav: false,
@ -9099,6 +9163,7 @@ const Vuepoc=Vue.extend({template:`
children: [
{href: '/database', text: 'Databases',icon: 'developer_mode' },
{href: '/files', text: 'File system',icon: 'folder' },
{href: '/components', text: 'Component library',icon: 'engineering' },
{href: '/documentation', text: 'Documentation',icon: 'library_books' },
{href: '/history/files',text: 'history',icon: 'history'}
]},
@ -9202,7 +9267,15 @@ const Vuepoc=Vue.extend({template:`
showAlert(msg){
this.alert.msg=format(new Date())+" "+ msg
this.alert.show=true
}
},
onScroll (e) {
if (typeof window === 'undefined') return
const top = window.pageYOffset || e.target.scrollTop || 0
this.fab = top > 20
},
toTop () {
this.$vuetify.goTo(0)
}
},
watch: {
showNotifications: function (val) {