byzer-org#94 schema

src/components/AddSchedule/ScheduleForm.vue

@@ -155,7 +155,8 @@ import ExecuteTime from './ExecuteTime.vue'
   mixins: [ExecuteTime],
   computed: {
     ...mapState({
-      lang: state => state.global.lang
+      lang: state => state.global.lang,
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
     })
   },
   methods: {
@@ -250,6 +251,9 @@ export default class Addschedule extends Vue {
   }
 
   async querySchedules () {
+    if (!this.is_scheduler_enabled) {
+      return
+    }
     try {
       this.loadingScheduleList = true
       const res = await this.getSchedulesList()

src/components/EditTask/index.vue

@@ -114,6 +114,9 @@ vuex.registerModule(['modals', 'EditTaskModal'], store)
       taskInfo: state => state.taskInfo,
       form: state => state.form,
       callback: state => state.callback
+    }),
+    ...mapState({
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
     })
   },
   methods: {
@@ -170,6 +173,9 @@ export default class EditTask extends Vue {
   }
 
   async querySchedules () {
+    if (!this.is_scheduler_enabled) {
+      return
+    }
     try {
       this.loadingScheduleList = true
       const res = await this.getSchedulesList()

src/components/Header/HeaderMenu.vue

@@ -19,7 +19,7 @@
         <span>{{$t('menu.jobs')}}</span>
       </template>
     </el-menu-item>
-    <el-menu-item index="schedules">
+    <el-menu-item v-if="is_scheduler_enabled" index="schedules">
       <template slot="title">
         <svg-icon class="menu-icon font-24" icon-class="nav_process_24"></svg-icon>
         <span>{{$t('menu.schedules')}}</span>
@@ -42,7 +42,8 @@ export default {
   },
   computed: {
     ...mapState({
-      isTrial: state => state.global.is_trial
+      isTrial: state => state.global.is_trial,
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
     }),
     activeIndex () {
       return this.$route.meta.menuIndex

src/page/Dag/index.vue

@@ -20,10 +20,15 @@ import { Graph } from '@antv/x6'
 import GraphNode from '../../components/GraphNode'
 import '@antv/x6-vue-shape'
 import { GridLayout } from '@antv/layout'
-import { mapActions } from 'vuex'
+import { mapActions, mapState } from 'vuex'
 import { GRAPH_EDGE_ATTRS, GRAPH_NODE_ATTRS } from '../../config'
 
 @Component({
+  computed: {
+    ...mapState({
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
+    })
+  },
   methods: {
     ...mapActions({
       getSchedulesList: 'GET_SCHEDULE_LIST'
@@ -73,6 +78,9 @@ export default class DAG extends Vue {
   }
 
   async queryData () {
+    if (!this.is_scheduler_enabled) {
+      return
+    }
     try {
       const res = await this.getSchedulesList()
       if (res && res.data) {

src/page/IframeImage/index.vue

@@ -1,22 +1,36 @@
 <template>
   <div class="cell-result-page">
-    <iframe
-      class="result-html"
-      ref="htmlDom"
-      sandbox="allow-scripts"
-      style="width: 100%; height: 100%;"
-      :srcDoc="detailContent"
-      frameBorder="0"
-      scrolling="yes"
-      v-if="detailType === 'html'"
-    />
-    <img v-else ref="jobImage" id="jobImage" :src="`data:image/png;base64,${detailContent}`" alt="">
+    <section v-if="detailType === 'html'" style="width: 100%; height: 100%;">
+      <iframe
+        class="result-html"
+        ref="htmlDom"
+        sandbox="allow-scripts"
+        style="width: 100%; height: 100%;"
+        v-for="(detail, index) in detailContent"
+        :key="index"
+        :srcDoc="detail"
+        frameBorder="0"
+        scrolling="yes"
+      />
+    </section>
+    <section v-else style="width: 100%; height: 100%;">
+      <img
+        ref="jobImage"
+        id="jobImage"
+        class="html"
+        v-for="(detail, index) in detailContent"
+        :key="index"
+        :src="`data:image/png;base64,${detail}`"
+        alt=""
+      >
+    </section>
   </div>
 </template>
 <script>
 import Vue from 'vue'
 import { Component } from 'vue-property-decorator'
 import { mapActions } from 'vuex'
+import { hasOwnProperty } from '../../util'
 
 @Component({
   methods: {
@@ -28,7 +42,7 @@ import { mapActions } from 'vuex'
 export default class IframePage extends Vue {
   excuteResult = ''
   detailType = 'html'
-  detailContent = ''
+  detailContent = []
 
   created () {
     this.getStatus(this.$route.params.id)
@@ -43,15 +57,24 @@ export default class IframePage extends Vue {
       const { status, result } = res.data
       if (status === '1') {
         let parsedResult =result && result ? JSON.parse(result) : ''
-        const length = parsedResult.length
+        const schema = (parsedResult.schema?.fields || [])
+        const dataList = (parsedResult.data || []).map(item => {
+          schema.forEach(s => {
+            if (!Object.prototype.hasOwnProperty.call(item, s.name)) {
+              item[s.name] = ''
+            }
+          })
+          return item
+        })
         this.detailType = 'table'
-        if (length === 1) {
-          const details = parsedResult[0]
-          if (Object.prototype.hasOwnProperty.call(details, 'mime') && Object.prototype.hasOwnProperty.call(details, 'content')) {
-            this.detailType = details.mime
-            this.detailContent = details.content
-          }
-        } 
+        const isIframeOrImage = dataList.some(i => hasOwnProperty(i, 'mime') && hasOwnProperty(i,'content'))
+        if (isIframeOrImage) {
+          this.detailType = dataList[0].mime
+          this.detailContent = []
+          dataList.forEach(item => {
+            this.detailContent.push(item.content)
+          })
+        }
       }
     } catch (err) {
       console.log(err)

src/page/Schedules/Schedules/index.vue

@@ -167,11 +167,16 @@
 <script>
 import Vue from 'vue'
 import { Component, Watch } from 'vue-property-decorator'
-import { mapActions } from 'vuex'
+import { mapActions, mapState } from 'vuex'
 import { debounce, cloneDeep } from 'lodash'
 import moment from 'moment'
 
 @Component({
+  computed: {
+    ...mapState({
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
+    })
+  },
   methods: {
     ...mapActions({
       getSchedulesList: 'GET_SCHEDULE_LIST',
@@ -250,6 +255,9 @@ export default class Schedules extends Vue {
   }
 
   async querySchedules () {
+    if (!this.is_scheduler_enabled) {
+      return
+    }
     this.startLoading()
     try {
       const res = await this.getSchedulesList()

src/page/Workspace/Notebook/CellList/index.vue

@@ -56,7 +56,7 @@
           @runAll="handleRunAll"
           @operateDemoSuccess="handleOperateDemoSuccess"
         />
-        <div class="btn">
+        <div class="btn" v-if="is_scheduler_enabled">
           <span v-if="added" class="add-to-schedule" @click="viewDAG">
             <i class="el-ksd-icon-confirm_22"></i>
             {{ $t('schedules.addedToSchedule') }}
@@ -209,7 +209,8 @@ export default {
       userInfo: state => state.user.userInfo,
       activeNotebook: state => state.notebook.activeNotebook,
       mode: state => state.notebook.activeNotebook.mode,
-      openedNotebookList: state => state.notebook.openedNotebooks
+      openedNotebookList: state => state.notebook.openedNotebooks,
+      is_scheduler_enabled: state => state.global.is_scheduler_enabled
     }),
     ...mapState('DAGViewModal', {
       taskInfo: state => state.taskInfo
@@ -332,6 +333,9 @@ export default {
       this.selectCellStatus = 'NEW'
     },
     async checkNotebook () {
+      if (!this.is_scheduler_enabled) {
+        return
+      }
       const params = formatGetParams({
         entity_type: 'notebook',
         entity_id: this.activeNotebookId

src/page/Workspace/Notebook/ExcuteResult/index.vue

@@ -11,13 +11,23 @@
             class="html"
             scrolling="yes"
             ref="htmlDom"
-            :srcDoc="detailContent"
+            v-for="(detail, index) in detailContent"
+            :key="index"
+            :srcDoc="detail"
             onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight + 20 + "px";}(this));'
             style="height:200px;border:none;overflow:hidden;">
           </iframe>
         </div>
         <div class="wrapper not-table" v-if="detailType === 'image'">
-          <img ref="jobImage" id="jobImage" class="html" :src="`data:image/png;base64,${detailContent}`" alt="">
+          <img
+            ref="jobImage"
+            id="jobImage"
+            class="html"
+            v-for="(detail, index) in detailContent"
+            :key="index"
+            :src="`data:image/png;base64,${detail}`"
+            alt=""
+          >
         </div>
         <div class="table wrapper" v-else-if="detailType === 'table'">
           <template v-if="tableList.length">
@@ -100,6 +110,7 @@ import { Watch, Component } from 'vue-property-decorator'
 import { saveAs } from 'file-saver'
 import { Parser } from 'json2csv'
 import moment from 'moment'
+import { hasOwnProperty } from '../../../../util'
 
 @Component({
   props: ['result', 'status', 'innerMaxHeight']
@@ -119,7 +130,7 @@ export default class ExcuteResult extends Vue {
   showDetail = false
   root_cause = ''
   detailType = 'table'
-  detailContent = ''
+  detailContent = []
 
   get headerList () {
     let keys = []
@@ -152,16 +163,25 @@ export default class ExcuteResult extends Vue {
       this.excuteSuccess = this.result.status === '1'
       if (this.result.status !== '0') {
         let parsedResult = this.result && this.result.result ? JSON.parse(this.result.result) : ''
-        const length = parsedResult.length
+        const schema = (parsedResult.schema?.fields || [])
+        const dataList = (parsedResult.data || []).map(item => {
+          schema.forEach(s => {
+            if (!Object.prototype.hasOwnProperty.call(item, s.name)) {
+              item[s.name] = null
+            }
+          })
+          return item
+        })
         this.detailType = 'table'
-        if (length === 1) {
-          const details = parsedResult[0]
-          if (Object.prototype.hasOwnProperty.call(details, 'mime') && Object.prototype.hasOwnProperty.call(details, 'content')) {
-            this.detailType = details.mime
-            this.detailContent = details.content
-          }
+        const isIframeOrImage = dataList.some(i => hasOwnProperty(i, 'mime') && hasOwnProperty(i,'content'))
+        if (isIframeOrImage) {
+          this.detailType = dataList[0].mime
+          this.detailContent = []
+          dataList.forEach(item => {
+            this.detailContent.push(item.content)
+          })
         }
-        this.tableList = parsedResult
+        this.tableList = dataList
         this.pageInfo.page = 1
         this.getRenderList()
       }
@@ -239,7 +259,7 @@ export default class ExcuteResult extends Vue {
       .html {
         display: block;
         width: 90%;
-        margin: 0 auto;
+        margin: 10px auto;
         height: auto;
         box-shadow: 1px 1px 4px rgba(63, 89, 128, 0.16);
         border-top: 1px solid $--border-color-light;

src/page/Workspace/Wrapper/index.vue

@@ -427,9 +427,9 @@ export default {
         const temp = _.cloneDeep(this.notebookTab)
         if (!tabClicked) {
           const { id, type, commit_id = ''} = activeNotebook
+          activeNotebook['uniq'] = `${type}_${id}${commit_id && `_${commit_id}`}`
           const newNotebook = {
-            ...activeNotebook,
-            uniq: `${type}_${id}${commit_id && `_${commit_id}`}`
+            ...activeNotebook
           }
           temp.unshift(newNotebook)
         }

src/router/beforeEach.js

@@ -6,8 +6,8 @@ import store, { actionsTypes } from '../store'
 export default async function beforeEach (to, from, next) {
   try {
     const res = await store.dispatch(actionsTypes.GET_ENV)
-    const is_trial = res.data.is_trial
-    store.commit('SET_CURRENT_ENV', is_trial)
+    store.commit('SET_CURRENT_ENV', res.data.is_trial)
+    store.commit('SET_SCHEDULE_ENABLE', res.data.is_scheduler_enabled)
     document.title = 'Byzer Notebook'
   } catch (e) {
     console.log(e)

src/store/module/global.js

@@ -5,12 +5,16 @@ import { getGlobalLang } from '../../util'
 export default {
   state: {
     is_trial: true,
+    is_scheduler_enabled: false,
     lang: getGlobalLang()
   },
   mutations: {
     [types.SET_CURRENT_ENV]: (state, data) => {
       state.is_trial = data
     },
+    [types.SET_SCHEDULE_ENABLE]: (state, data) => {
+      state.is_scheduler_enabled = data
+    },
     [types.CHANGE_LANG]: (state, data) => {
       state.lang = data
       localStorage.setItem('lang', data)

src/store/type.js

@@ -96,6 +96,7 @@ export const CLEAR_USER_INFO = 'CLEAR_USER_INFO'
 // global
 export const GET_ENV = 'GET_ENV'
 export const SET_CURRENT_ENV = 'SET_CURRENT_ENV'
+export const SET_SCHEDULE_ENABLE = 'SET_SCHEDULE_ENABLE'
 
 // data catalog
 export const GET_DB_LIST = 'GET_DB_LIST'