job page

src/vue-poc/features/collection/collections.xqm

@@ -23,7 +23,6 @@ function vue-api:history( )
 {
  let $entity:=$entity:list("filehistory")
   let $items:= $entity("data")()
-  let $d:=trace($items,"66666")
  return dice:response($items,$entity,web:dice())
 };
 

src/vue-poc/features/collection/files.vue

@@ -139,8 +139,7 @@
       .then(r=>{
         var job=r.data.job
         console.log(r.data)
-         alert("job: "+job)
+         this.$router.push({ name: 'jobShow', params: {job:job }})
-         this.$router.push({ path: 'jobs', params: {job:job }})
       })
     }
   

src/vue-poc/features/home.vue

@@ -28,6 +28,9 @@
 	links
 </p>
 <ul>
+
+<li><router-link :to="{path:'files', query:{url:'/vue-poc/features/images/'}}">vue-poc image tasks</router-link></li>
+<li><router-link :to="{path:'database', query:{url:'/vue-poc/'}}">vue-poc db</router-link></li>
 	<li><a href="/doc/#/data/app/vue-poc" target="new">doc</a></li>
 	<li><a href="/dba" target="new">DBA app</a></li>
 	<li><a href="/vue-poc/ui/database?url=%2Fvue-poc%2F" target="new">db</a></li>

src/vue-poc/features/job/job.vue

@@ -3,20 +3,34 @@
   <v-card >
    <v-toolbar light>
       <v-btn icon to="./"><v-icon>arrow_back</v-icon></v-btn>
-    
+      <v-toolbar-title>{{ job }}</v-toolbar-title>
     
      <v-btn  
       @click="stop()"
-      :disabled="noSelection"
+      :disabled="finished"
     >Stop</v-btn>
-    
+     <v-btn  
+      @click="getResult()"
+      :disabled="result || !finished"
+    >Result</v-btn>
+    <v-chip class="orange white--text">{{  jobstate.state }}</v-chip>
+     <v-chip class="primary white--text">
+     <v-avatar>
+        <v-icon>account_circle</v-icon>
+      </v-avatar>
+     {{  jobstate.user }}</v-chip>
+      <v-chip class="primary white--text">{{  jobstate.duration }}</v-chip>
       <v-spacer></v-spacer>
-      <v-btn light icon  :loading="loading"   @click="getJob()"  :disabled="loading">
+      <v-btn light icon  :loading="loading"   @click="getJob()"  :disabled="loading || finished">
          <v-icon>refresh</v-icon>
     </v-btn>
      
     </v-toolbar>
-  <v-card-text>Job: {{ job }}
+    <v-card-text v-if="result">
+     {{ result }}
+  </v-card-text>
+  <v-card-text>
+     <code>{{ jobstate.text }}</code>
   </v-card-text>
  </v-card>
 </template>
@@ -25,9 +39,8 @@
   props: ['job'],
   data:  function(){
     return {
-      jobstate:null,
+      jobstate:{state:"?",user:"?",duration:"?"},
-      selected:[],
+      result:null,
-      search:"",
       loading:false
       }
   },
@@ -38,25 +51,28 @@
 	    .then(r=>{
 	       this.loading=false
 	       this.jobstate=r.data
-	       setTimeout(()=>{ this.getJob() }, 10000);
+	       if(!this.jobstate.id) this.jobstate={state:"cached", text:"Job not found"}
+	       if(!this.finished)setTimeout(()=>{ this.getJob() }, 10000);
 	    })
 	   
+    },
+    getResult(){
+      HTTP.post("eval/result/"+this.job)
+      .then(r=>{
+        this.result=r.data.result
+    })
     },
     stop(){
-      var s=this.selected.map((j)=>{return j.id}).join(",")
+      alert("todo stop" + this.job)
-      console.log("AAA",this.selected)
-      alert(s)
     }
   },
   computed: {
-    // a computed getter
+    finished(){
-    noSelection: function () {
+      return this.jobstate.state == 'cached'
-      // `this` points to the vm instance
+      }
-      return this.selected.length==0
-    }
   },
   created(){
-   //this.getJob()
+    this.getJob()
   }
 }
 </script>

src/vue-poc/static/app-gen.js

@@ -1,4 +1,4 @@
-// generated 2017-08-19T22:16:40.597+01:00
+// generated 2017-08-20T13:42:15.528+01:00
 
Vue.component('qd-link',{template:` 
  <a :href="href" :target="href"> {{href}}<v-icon>link</v-icon></a>
  `,
@@ -390,8 +390,7 @@ v0.0.3 </v-card-title> </v-card> </v-flex> <v-flex xs4="">
       .then(r=>{
         var job=r.data.job
         console.log(r.data)
-         alert("job: "+job)
+         this.$router.push({ name: 'jobShow', params: {job:job }})
-         this.$router.push({ path: 'jobs', params: {job:job }})
       })
     }
   
@@ -913,6 +912,9 @@ v0.0.3 </v-card-title> </v-card> </v-flex> <v-flex xs4="">
 	links
 </p>
 <ul>
+
+<li><router-link :to="{path:'files', query:{url:'/vue-poc/features/images/'}}">vue-poc image tasks</router-link></li>
+<li><router-link :to="{path:'database', query:{url:'/vue-poc/'}}">vue-poc db</router-link></li>
 	<li><a href="/doc/#/data/app/vue-poc" target="new">doc</a></li>
 	<li><a href="/dba" target="new">DBA app</a></li>
 	<li><a href="/vue-poc/ui/database?url=%2Fvue-poc%2F" target="new">db</a></li>
@@ -1212,17 +1214,28 @@ body
   <v-card>
    <v-toolbar light="">
       <v-btn icon="" to="./"><v-icon>arrow_back</v-icon></v-btn>
+      <v-toolbar-title>{{ job }}</v-toolbar-title>
     
-    
+     <v-btn @click="stop()" :disabled="finished">Stop</v-btn>
-     <v-btn @click="stop()" :disabled="noSelection">Stop</v-btn>
+     <v-btn @click="getResult()" :disabled="result || !finished">Result</v-btn>
-    
+    <v-chip class="orange white--text">{{  jobstate.state }}</v-chip>
+     <v-chip class="primary white--text">
+     <v-avatar>
+        <v-icon>account_circle</v-icon>
+      </v-avatar>
+     {{  jobstate.user }}</v-chip>
+      <v-chip class="primary white--text">{{  jobstate.duration }}</v-chip>
       <v-spacer></v-spacer>
-      <v-btn light="" icon="" :loading="loading" @click="getJob()" :disabled="loading">
+      <v-btn light="" icon="" :loading="loading" @click="getJob()" :disabled="loading || finished">
          <v-icon>refresh</v-icon>
     </v-btn>
      
     </v-toolbar>
-  <v-card-text>Job: {{ job }}
+    <v-card-text v-if="result">
+     {{ result }}
+  </v-card-text>
+  <v-card-text>
+     <code>{{ jobstate.text }}</code>
   </v-card-text>
  </v-card>
  `,
@@ -1230,9 +1243,8 @@ body
   props: ['job'],
   data:  function(){
     return {
-      jobstate:null,
+      jobstate:{state:"?",user:"?",duration:"?"},
-      selected:[],
+      result:null,
-      search:"",
       loading:false
       }
   },
@@ -1243,25 +1255,28 @@ body
 	    .then(r=>{
 	       this.loading=false
 	       this.jobstate=r.data
-	       setTimeout(()=>{ this.getJob() }, 10000);
+	       if(!this.jobstate.id) this.jobstate={state:"cached", text:"Job not found"}
+	       if(!this.finished)setTimeout(()=>{ this.getJob() }, 10000);
 	    })
 	   
+    },
+    getResult(){
+      HTTP.post("eval/result/"+this.job)
+      .then(r=>{
+        this.result=r.data.result
+    })
     },
     stop(){
-      var s=this.selected.map((j)=>{return j.id}).join(",")
+      alert("todo stop" + this.job)
-      console.log("AAA",this.selected)
-      alert(s)
     }
   },
   computed: {
-    // a computed getter
+    finished(){
-    noSelection: function () {
+      return this.jobstate.state == 'cached'
-      // `this` points to the vm instance
+      }
-      return this.selected.length==0
-    }
   },
   created(){
-   //this.getJob()
+    this.getJob()
   }
 }