[mod] svg view start
This commit is contained in:
parent
1304878a70
commit
d94be79344
|
|
@ -154,15 +154,15 @@
|
|||
{href: '/',text: 'Dashboard', icon: 'home' },
|
||||
{
|
||||
icon: 'input',
|
||||
text: 'Actions' ,
|
||||
text: 'Action' ,
|
||||
model: false,
|
||||
children: [
|
||||
{href: '/eval',text: 'Query',icon: 'play_circle_outline'},
|
||||
|
||||
{href: '/edit',text: 'Edit',icon: 'mode_edit'},
|
||||
{href: '/tabs',text: 'Tabs',icon: 'switch_camera'},
|
||||
{href: '/validate',text: 'Validate',icon: 'playlist_add_check'},
|
||||
{href: '/transform',text: 'XSLT Transform',icon: 'forward'}
|
||||
{href: '/action/eval',text: 'Query',icon: 'play_circle_outline'},
|
||||
{href: '/action/edit',text: 'Edit',icon: 'mode_edit'},
|
||||
{href: '/action/tabs',text: 'Tabs',icon: 'switch_camera'},
|
||||
{href: '/action/validate',text: 'Validate',icon: 'playlist_add_check'},
|
||||
{href: '/action/transform',text: 'XSLT Transform',icon: 'forward'},
|
||||
{href: '/view/svg',text: 'SVG test',icon: 'preview'}
|
||||
]},
|
||||
|
||||
{
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
var el=this.$refs["auto"];
|
||||
var e=el;
|
||||
// console.log("top",e.offsetTop,e.getBoundingClientRect().top,window.innerHeight);
|
||||
var h=window.innerHeight - e.getBoundingClientRect().top -10;
|
||||
var h=window.innerHeight - e.getBoundingClientRect().top -20;
|
||||
h=Math.max(1,h) ;
|
||||
// console.log("h",h)
|
||||
e.style.height=h +"px";
|
||||
|
|
|
|||
|
|
@ -1,19 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
A form to manage parameters for query
|
||||
including submit form function via POST
|
||||
<vp-paramform v-if="!loading" ref="params" :endpoint="endpoint"></vp-paramform>
|
||||
@param endpoint
|
||||
to submit form function via POST
|
||||
this.$refs.params.submit()
|
||||
-->
|
||||
<template id="vp-paramform">
|
||||
<v-card >
|
||||
<v-toolbar color="blue lighten-3" dense>
|
||||
<v-card-title >{{ description }}</v-card-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn @click="clear()" id="btn-clear"
|
||||
>Clear</v-btn>
|
||||
<v-btn @click="reset()"
|
||||
>Reset</v-btn>
|
||||
<v-btn @click="zlog()"
|
||||
>console</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-menu offset-y>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-btn v-bind="attrs" v-on="on" icon>
|
||||
<v-icon>more_vert</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list>
|
||||
<v-list-item @click="reset()">
|
||||
<v-list-item-title>Set default values</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-list-item @click="clear()">
|
||||
<v-list-item-title>Clear all</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-divider ></v-divider>
|
||||
<v-list-item @click="zlog()">
|
||||
<v-list-item-title>Console test</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
</v-toolbar>
|
||||
<v-card-text>
|
||||
<v-form ref="form" v-model="valid" lazy-validation>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,101 @@
|
|||
<!DOCTYPE html>
|
||||
<template id="viewsvg" >
|
||||
<v-card >
|
||||
<v-toolbar dense class="lime darken-1">
|
||||
<v-card-title >SVG</v-card-title>
|
||||
<v-toolbar-items>
|
||||
<v-combobox v-model="url"
|
||||
:items="svgs"
|
||||
label="Select svg" prefix="webfile" single-line clearable open-on-clear></v-combobox>
|
||||
</v-toolbar-items>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items>
|
||||
<v-btn @click="view.reset()">Reset</v-btn>
|
||||
<v-btn @click="size()">Size</v-btn>
|
||||
<v-btn @click="load()">set</v-btn>
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
<v-card-text>
|
||||
<qd-autoheight>
|
||||
<div ref="svgcanvas" style="width:100%;height:100%;background-color:yellow;"></div>
|
||||
</qd-autoheight>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</template>
|
||||
|
||||
<script>{
|
||||
data: function() {
|
||||
return {
|
||||
canvasd3:null,
|
||||
view:null,
|
||||
url:"/vue-poc/ui/resources/svg/butterfly.svg",
|
||||
|
||||
svgs:["/vue-poc/ui/resources/svg/butterfly.svg",
|
||||
"/vue-poc/ui/resources/svg/tiger.svg",
|
||||
"/static/xqdoc/dba/imports.svg"]
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
size(){
|
||||
this.view.width(200).height(200).render();
|
||||
},
|
||||
|
||||
load(){
|
||||
var that=this;
|
||||
d3.xml(this.url,
|
||||
function(error, xml) {
|
||||
if (error) {
|
||||
//alert("load err");
|
||||
throw error;
|
||||
}
|
||||
var d=d3.select(xml.documentElement)
|
||||
that.view.setItem(d);
|
||||
});
|
||||
},
|
||||
|
||||
onResize(){
|
||||
var el=this.$refs["panel"];
|
||||
|
||||
//console.log("top",e.offsetTop)
|
||||
var h=Math.max(1,window.innerHeight - el.offsetTop -10);
|
||||
var w=Math.max(1,window.innerWidth- el.offsetLeft )
|
||||
console.log("resize:",w,h)
|
||||
el.style.height=h +"px";
|
||||
if(this.view ){
|
||||
this.view.height(h-20);
|
||||
this.view.render();
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
watch:{
|
||||
url(v){
|
||||
this.$router.push({ query: { url: this.url }})
|
||||
},
|
||||
$route(vnew,vold){
|
||||
//console.log("ROUTE",vnew,vold)
|
||||
var url=this.$route.query.url
|
||||
this.url=url?url:"/vue-poc/ui/resources/svg/butterfly.svg";
|
||||
if(vnew.query.url != vold.query.url) this.load()
|
||||
}
|
||||
},
|
||||
|
||||
mounted: function() {
|
||||
var url=this.$route.query.url
|
||||
this.url=url?url:"/vue-poc/ui/resources/svg/butterfly.svg";
|
||||
this.canvasd3 = d3.select(this.$refs.svgcanvas);
|
||||
/** RUN SCRIPT **/
|
||||
var canvasWidth = 800;
|
||||
|
||||
var canvas = d3.demo.canvas().width(canvasWidth).height(400);
|
||||
this.view=canvas;
|
||||
this.canvasd3.call(canvas);
|
||||
|
||||
this.load();
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
|
@ -5,6 +5,7 @@
|
|||
<v-card>
|
||||
<v-card-title>File transfers</v-card-title>
|
||||
<v-card-text>
|
||||
<p>Currently files are saved to <code>db:option('dbpath') || '/.vue-poc'</code></p>
|
||||
<v-file-input v-model="file" label="File input"></v-file-input>
|
||||
<v-btn @click="post()" :disabled="!file">submit</v-btn>
|
||||
</v-card-text>
|
||||
|
|
@ -20,9 +21,6 @@
|
|||
}
|
||||
},
|
||||
methods:{
|
||||
upit:function(s){
|
||||
this.snack=true;
|
||||
},
|
||||
post(){
|
||||
let rawData = {
|
||||
name: this.name,
|
||||
|
|
@ -30,15 +28,16 @@
|
|||
dob: this.dob
|
||||
}
|
||||
rawData = JSON.stringify(rawData)
|
||||
|
||||
this.snack = false
|
||||
let formData = new FormData()
|
||||
formData.append('avatar', this.file, this.file.name)
|
||||
formData.append('data', rawData)
|
||||
let response = HTTP.post('upload2', formData, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}).then(r=>{
|
||||
console.log("upload: ",r)
|
||||
this.snack=true;
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,14 +13,13 @@ declare variable $_:DBA-DIRECTORY := (
|
|||
)
|
||||
);
|
||||
(:~
|
||||
: sample form i/p
|
||||
: save upload to filesystem
|
||||
:)
|
||||
declare %updating
|
||||
%rest:POST %rest:path("/vue-poc/api/upload2")
|
||||
%rest:form-param("data", "{ $data }")
|
||||
%rest:form-param("avatar", "{ $file }")
|
||||
%output:method("text")
|
||||
function _:upload($data, $file)
|
||||
function _:upload( $file)
|
||||
{
|
||||
for $name in map:keys($file)
|
||||
let $content := $file($name)
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
"description": "App framework experiments, Frontend vuetify, backend: basex",
|
||||
"dependencies": {
|
||||
"ace-builds": "1.4.12",
|
||||
"vuetify": "2.3.16",
|
||||
"vuetify": "2.4.3",
|
||||
"vue": "2.6.11",
|
||||
"vuex": "3.1.0",
|
||||
"vue-router": "3.1.6",
|
||||
"vuex": "3.6.0",
|
||||
"vue-router": "3.4.9",
|
||||
"vue-treeselect": "0.0.29",
|
||||
"google-material": "0.0.0",
|
||||
"js-beautify": "1.9.0",
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
"localforage": "1.7.1",
|
||||
"momentjs": "2.24.0",
|
||||
"date-fns": "2.16.1",
|
||||
"@koumoul/vjsf": "1.14.0",
|
||||
"@koumoul/vjsf": "1.16.0",
|
||||
"prism": "1.15.0",
|
||||
"vue-prism-component": "1.1.1",
|
||||
"vis-timeline-graph2d": "4.20.1",
|
||||
|
|
|
|||
|
|
@ -25,17 +25,22 @@ const router = new VueRouter({
|
|||
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
|
||||
]},
|
||||
|
||||
{ path: '/action', component: { template: '<router-view/>' } ,children:[
|
||||
{ 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: 'tabs', name: "multi-edit", component: Tabs,meta:{title:"tab test"} },
|
||||
{ path: 'transform', component: Transform, meta:{title:"XSLT2 Transform"} },
|
||||
{ path: 'validate', component: Validate, meta:{title:"Validate"} },
|
||||
|
||||
]},
|
||||
{ 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: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
|
||||
|
||||
{path: '/images', component: { template: '<router-view/>' },
|
||||
children: [
|
||||
|
|
@ -79,7 +84,7 @@ 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"} },
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -164,14 +169,9 @@ const router = new VueRouter({
|
|||
|
||||
{ path: '/puzzle', component: Puzzle, meta:{title:"Jigsaw"} },
|
||||
{ path: '/html', component: Testhtml, meta:{title:"HTML test"} },
|
||||
|
||||
{ path: '/transform', component: Transform, meta:{title:"XSLT2 Transform"} },
|
||||
{ path: '/validate', component: Validate, meta:{title:"Validate"} },
|
||||
|
||||
|
||||
|
||||
|
||||
{ path: '/logs', component: Log, meta:{title:"Server logs"} },
|
||||
|
||||
{ path: '/map', component: Leaflet,meta:{title:"map"} },
|
||||
{ path: '/tasks', component: { template: '<router-view/>' } , children:[
|
||||
{ path: '', component: Tasks, meta:{title:"Runnable tasks"} },
|
||||
{ path: 'vuecompile', component: Vuecompile, meta:{title:"vue compile"} },
|
||||
|
|
@ -181,19 +181,20 @@ const router = new VueRouter({
|
|||
{path: "run", component: Runtask, props: true, meta:{title:"Run task"} },
|
||||
]}
|
||||
]},
|
||||
|
||||
|
||||
{ path: '/map', component: Leaflet,meta:{title:"map"} },
|
||||
|
||||
|
||||
{ path: '/view', component: { template: '<router-view/>' } , children:[
|
||||
{ path: 'svg', component: Viewsvg, meta:{title:"SVG test"} }
|
||||
]},
|
||||
|
||||
{ path: '*', component: Notfound, meta:{title:"Page not found"} }
|
||||
],
|
||||
});
|
||||
|
||||
router.afterEach(function(route) {
|
||||
document.title = (route.meta.title?route.meta.title:"") + " VUE-Poc";
|
||||
});
|
||||
|
||||
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
//console.log("before: ",to)
|
||||
if (to.matched.some(record => record.meta.requiresAuth)) {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// generated 2021-01-14T23:08:56.115Z
|
||||
// generated 2021-01-27T22:20:43.86Z
|
||||
|
||||
// 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';
|
||||
|
|
@ -19,7 +19,7 @@ Vue.component('qd-autoheight',{template:`
|
|||
var el=this.$refs["auto"];
|
||||
var e=el;
|
||||
// console.log("top",e.offsetTop,e.getBoundingClientRect().top,window.innerHeight);
|
||||
var h=window.innerHeight - e.getBoundingClientRect().top -10;
|
||||
var h=window.innerHeight - e.getBoundingClientRect().top -20;
|
||||
h=Math.max(1,h) ;
|
||||
// console.log("h",h)
|
||||
e.style.height=h +"px";
|
||||
|
|
@ -1006,10 +1006,26 @@ Vue.component('vp-paramform',{template:`
|
|||
<v-card>
|
||||
<v-toolbar color="blue lighten-3" dense>
|
||||
<v-card-title>{{ description }}</v-card-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn @click="clear()" id="btn-clear">Clear</v-btn>
|
||||
<v-btn @click="reset()">Reset</v-btn>
|
||||
<v-btn @click="zlog()">console</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-menu offset-y>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-btn v-bind="attrs" v-on="on" icon>
|
||||
<v-icon>more_vert</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list>
|
||||
<v-list-item @click="reset()">
|
||||
<v-list-item-title>Set default values</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-list-item @click="clear()">
|
||||
<v-list-item-title>Clear all</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<v-list-item @click="zlog()">
|
||||
<v-list-item-title>Console test</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
</v-toolbar>
|
||||
<v-card-text>
|
||||
<v-form ref="form" v-model="valid" lazy-validation>
|
||||
|
|
@ -3588,6 +3604,106 @@ created:function(){
|
|||
this.load()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
);
|
||||
|
||||
// src: file:///C:/Users/andy/git/vue-poc/src/vue-poc/features/components/viewsvg.vue
|
||||
const Viewsvg=Vue.extend({template:`
|
||||
<v-card>
|
||||
<v-toolbar dense class="lime darken-1">
|
||||
<v-card-title>SVG</v-card-title>
|
||||
<v-toolbar-items>
|
||||
<v-combobox v-model="url" :items="svgs" label="Select svg" prefix="webfile" single-line clearable open-on-clear></v-combobox>
|
||||
</v-toolbar-items>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items>
|
||||
<v-btn @click="view.reset()">Reset</v-btn>
|
||||
<v-btn @click="size()">Size</v-btn>
|
||||
<v-btn @click="load()">set</v-btn>
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
<v-card-text>
|
||||
<qd-autoheight>
|
||||
<div ref="svgcanvas" style="width:100%;height:100%;background-color:yellow;"></div>
|
||||
</qd-autoheight>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
`,
|
||||
|
||||
data: function() {
|
||||
return {
|
||||
canvasd3:null,
|
||||
view:null,
|
||||
url:"/vue-poc/ui/resources/svg/butterfly.svg",
|
||||
|
||||
svgs:["/vue-poc/ui/resources/svg/butterfly.svg",
|
||||
"/vue-poc/ui/resources/svg/tiger.svg",
|
||||
"/static/xqdoc/dba/imports.svg"]
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
size(){
|
||||
this.view.width(200).height(200).render();
|
||||
},
|
||||
|
||||
load(){
|
||||
var that=this;
|
||||
d3.xml(this.url,
|
||||
function(error, xml) {
|
||||
if (error) {
|
||||
//alert("load err");
|
||||
throw error;
|
||||
}
|
||||
var d=d3.select(xml.documentElement)
|
||||
that.view.setItem(d);
|
||||
});
|
||||
},
|
||||
|
||||
onResize(){
|
||||
var el=this.$refs["panel"];
|
||||
|
||||
//console.log("top",e.offsetTop)
|
||||
var h=Math.max(1,window.innerHeight - el.offsetTop -10);
|
||||
var w=Math.max(1,window.innerWidth- el.offsetLeft )
|
||||
console.log("resize:",w,h)
|
||||
el.style.height=h +"px";
|
||||
if(this.view ){
|
||||
this.view.height(h-20);
|
||||
this.view.render();
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
watch:{
|
||||
url(v){
|
||||
this.$router.push({ query: { url: this.url }})
|
||||
},
|
||||
$route(vnew,vold){
|
||||
//console.log("ROUTE",vnew,vold)
|
||||
var url=this.$route.query.url
|
||||
this.url=url?url:"/vue-poc/ui/resources/svg/butterfly.svg";
|
||||
if(vnew.query.url != vold.query.url) this.load()
|
||||
}
|
||||
},
|
||||
|
||||
mounted: function() {
|
||||
var url=this.$route.query.url
|
||||
this.url=url?url:"/vue-poc/ui/resources/svg/butterfly.svg";
|
||||
this.canvasd3 = d3.select(this.$refs.svgcanvas);
|
||||
/** RUN SCRIPT **/
|
||||
var canvasWidth = 800;
|
||||
|
||||
var canvas = d3.demo.canvas().width(canvasWidth).height(400);
|
||||
this.view=canvas;
|
||||
this.canvasd3.call(canvas);
|
||||
|
||||
this.load();
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
);
|
||||
|
|
@ -7537,6 +7653,7 @@ const Upload=Vue.extend({template:`
|
|||
<v-card>
|
||||
<v-card-title>File transfers</v-card-title>
|
||||
<v-card-text>
|
||||
<p>Currently files are saved to <code>db:option('dbpath') || '/.vue-poc'</code></p>
|
||||
<v-file-input v-model="file" label="File input"></v-file-input>
|
||||
<v-btn @click="post()" :disabled="!file">submit</v-btn>
|
||||
</v-card-text>
|
||||
|
|
@ -7551,9 +7668,6 @@ const Upload=Vue.extend({template:`
|
|||
}
|
||||
},
|
||||
methods:{
|
||||
upit:function(s){
|
||||
this.snack=true;
|
||||
},
|
||||
post(){
|
||||
let rawData = {
|
||||
name: this.name,
|
||||
|
|
@ -7561,15 +7675,16 @@ const Upload=Vue.extend({template:`
|
|||
dob: this.dob
|
||||
}
|
||||
rawData = JSON.stringify(rawData)
|
||||
|
||||
this.snack = false
|
||||
let formData = new FormData()
|
||||
formData.append('avatar', this.file, this.file.name)
|
||||
formData.append('data', rawData)
|
||||
let response = HTTP.post('upload2', formData, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}).then(r=>{
|
||||
console.log("upload: ",r)
|
||||
this.snack=true;
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -8815,17 +8930,22 @@ const router = new VueRouter({
|
|||
{path: 'vue-cmps', component: VueComps, meta:{title:"Vue components"} },
|
||||
]},
|
||||
|
||||
{ path: '/action', component: { template: '<router-view/>' } ,children:[
|
||||
{ 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: 'tabs', name: "multi-edit", component: Tabs,meta:{title:"tab test"} },
|
||||
{ path: 'transform', component: Transform, meta:{title:"XSLT2 Transform"} },
|
||||
{ path: 'validate', component: Validate, meta:{title:"Validate"} },
|
||||
|
||||
]},
|
||||
{ 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: '/files', component: Files,meta:{title:"File system"},props:{protocol:"webfile"} },
|
||||
|
||||
{path: '/images', component: { template: '<router-view/>' },
|
||||
children: [
|
||||
|
|
@ -8869,7 +8989,7 @@ 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"} },
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -8954,14 +9074,9 @@ const router = new VueRouter({
|
|||
|
||||
{ path: '/puzzle', component: Puzzle, meta:{title:"Jigsaw"} },
|
||||
{ path: '/html', component: Testhtml, meta:{title:"HTML test"} },
|
||||
|
||||
{ path: '/transform', component: Transform, meta:{title:"XSLT2 Transform"} },
|
||||
{ path: '/validate', component: Validate, meta:{title:"Validate"} },
|
||||
|
||||
|
||||
|
||||
|
||||
{ path: '/logs', component: Log, meta:{title:"Server logs"} },
|
||||
|
||||
{ path: '/map', component: Leaflet,meta:{title:"map"} },
|
||||
{ path: '/tasks', component: { template: '<router-view/>' } , children:[
|
||||
{ path: '', component: Tasks, meta:{title:"Runnable tasks"} },
|
||||
{ path: 'vuecompile', component: Vuecompile, meta:{title:"vue compile"} },
|
||||
|
|
@ -8971,19 +9086,20 @@ const router = new VueRouter({
|
|||
{path: "run", component: Runtask, props: true, meta:{title:"Run task"} },
|
||||
]}
|
||||
]},
|
||||
|
||||
|
||||
{ path: '/map', component: Leaflet,meta:{title:"map"} },
|
||||
|
||||
|
||||
{ path: '/view', component: { template: '<router-view/>' } , children:[
|
||||
{ path: 'svg', component: Viewsvg, meta:{title:"SVG test"} }
|
||||
]},
|
||||
|
||||
{ path: '*', component: Notfound, meta:{title:"Page not found"} }
|
||||
],
|
||||
});
|
||||
|
||||
router.afterEach(function(route) {
|
||||
document.title = (route.meta.title?route.meta.title:"") + " VUE-Poc";
|
||||
});
|
||||
|
||||
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
//console.log("before: ",to)
|
||||
if (to.matched.some(record => record.meta.requiresAuth)) {
|
||||
|
|
@ -9137,15 +9253,15 @@ const Vuepoc=Vue.extend({template:`
|
|||
{href: '/',text: 'Dashboard', icon: 'home' },
|
||||
{
|
||||
icon: 'input',
|
||||
text: 'Actions' ,
|
||||
text: 'Action' ,
|
||||
model: false,
|
||||
children: [
|
||||
{href: '/eval',text: 'Query',icon: 'play_circle_outline'},
|
||||
|
||||
{href: '/edit',text: 'Edit',icon: 'mode_edit'},
|
||||
{href: '/tabs',text: 'Tabs',icon: 'switch_camera'},
|
||||
{href: '/validate',text: 'Validate',icon: 'playlist_add_check'},
|
||||
{href: '/transform',text: 'XSLT Transform',icon: 'forward'}
|
||||
{href: '/action/eval',text: 'Query',icon: 'play_circle_outline'},
|
||||
{href: '/action/edit',text: 'Edit',icon: 'mode_edit'},
|
||||
{href: '/action/tabs',text: 'Tabs',icon: 'switch_camera'},
|
||||
{href: '/action/validate',text: 'Validate',icon: 'playlist_add_check'},
|
||||
{href: '/action/transform',text: 'XSLT Transform',icon: 'forward'},
|
||||
{href: '/view/svg',text: 'SVG test',icon: 'preview'}
|
||||
]},
|
||||
|
||||
{
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<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="//cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" >
|
||||
<link rel="stylesheet" href="//unpkg.com/vuetify@2.4.2/dist/vuetify.min.css" type="text/css"/>
|
||||
<link rel="stylesheet" href="//unpkg.com/vuetify@2.4.3/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="/vue-poc/ui/prism/prism.css" type="text/css"/>
|
||||
<link rel="stylesheet" href="//unpkg.com/leaflet@1.6.0/dist/leaflet.css"/>
|
||||
|
|
@ -35,15 +35,15 @@
|
|||
</div>
|
||||
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/vue/2.6.11/vue.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vue-router@3.1.6/dist/vue-router.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vue-router@3.4.9/dist/vue-router.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/axios/0.21.1/axios.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vuex@3.1.0/dist/vuex.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vuex@3.6.0/dist/vuex.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@2.4.2/dist/vuetify.min.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vuetify@2.4.3/dist/vuetify.min.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ace.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ext-language_tools.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ext-linking.js" crossorigin="anonymous" charset="utf-8"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.js" crossorigin="anonymous"></script>
|
||||
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/js-beautify/1.9.0/beautify.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/js-beautify/1.9.0/beautify-css.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/js-beautify/1.9.0/beautify-html.js" crossorigin="anonymous"></script>
|
||||
|
|
@ -61,9 +61,10 @@
|
|||
<script src="//unpkg.com/leaflet@1.6.0/dist/leaflet.js" crossorigin="anonymous"></script>
|
||||
<script src="//unpkg.com/vue2-leaflet@2.5.2/dist/vue2-leaflet.min.js" crossorigin="anonymous"></script>
|
||||
|
||||
<script src="//cdn.jsdelivr.net/npm/@koumoul/vjsf@1.14.0/dist/main.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdn.jsdelivr.net/npm/@koumoul/vjsf@1.16.0/dist/main.js" crossorigin="anonymous"></script>
|
||||
|
||||
<script src="//unpkg.com/vue-native-websocket@2.0.8/dist/build.js" crossorigin="anonymous"></script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.js" crossorigin="anonymous"></script>
|
||||
<script src="/vue-poc/ui/svg/d3-svg.js"></script>
|
||||
<script src="/vue-poc/ui/state.js"></script>
|
||||
<script src="/vue-poc/ui/app-gen.js" type="module" ></script>
|
||||
|
|
|
|||
|
|
@ -53,12 +53,12 @@ const store = new Vuex.Store({
|
|||
Object.assign(state, JSON.parse(s))
|
||||
);
|
||||
}
|
||||
console.log("initialiseStore: ",s)
|
||||
//console.log("initialiseStore: ",s)
|
||||
}
|
||||
}
|
||||
})
|
||||
store.subscribe((mutation, state) => {
|
||||
// Store the state object as a JSON string
|
||||
localStorage.setItem('store', JSON.stringify(state));
|
||||
console.log("store subscribe")
|
||||
//console.log("store subscribe")
|
||||
});
|
||||
Loading…
Reference in New Issue