@ -42,14 +42,12 @@
max - width : 140 px ;
text - overflow : ellipsis ;
"
> { { tab . name } } < / s p a n
>
> { { tab . name } } < / span >
< v -icon icon :small ="true" @click ="removeTab(index)" >
mdi - close
< / v - i c o n >
< / v - t a b >
<!-- < v -tabs -items v-model ="activeTab" > - - >
< v -tabs -items :value ="activeTab" >
< v -tab -item
v - for = "(tab, index) in tabs"
@ -65,14 +63,13 @@
: reverse - transition = "false"
>
< div v-if ="tab._nodes.type === 'table'" style="height: 100%" >
<!-- < sqlLogAndOutput :hide ="hideLogWindows" > -- >
< TableView
: ref = "'tabs' + index"
: is - active = "
activeTab ===
` ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
} || $ { tab . name } `
` ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
} || $ { tab . name } `
"
: tab - id = " ` ${ pid } || ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
@ -80,18 +77,15 @@
: hide - log - windows . sync = "hideLogWindows"
: nodes = "tab._nodes"
/ >
<!-- < / sqlLogAndOutput > -- >
< / div >
< div v -else -if = " tab._nodes.type = = = ' view ' " style = "height: 100%" >
<!-- < sqlLogAndOutput > -- >
<!-- < ViewTab :ref ="'tabs'+index" :nodes ="tab._nodes" / > -- >
< TableView
: ref = "'tabs' + index"
: is - active = "
activeTab ===
` ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
} || $ { tab . name } `
` ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
} || $ { tab . name } `
"
: tab - id = " ` ${ pid } || ${ ( tab . _nodes && tab . _nodes ) . type || '' } || ${
( tab . _nodes && tab . _nodes . dbAlias ) || ''
@ -247,22 +241,83 @@
< h1 > { { tab . _nodes } } < / h1 >
< / div >
< / v - t a b - i t e m >
<!-- < / v - t a b s - i t e m s > - - >
< / v - t a b s - i t e m s >
<!-- tooltip : Add new table -- >
< x -icon
v - if = "_isUIAllowed('addTable')"
: tooltip = "$t('tooltip.addTable')"
icon - class = "add-btn"
: color = "['white', 'grey lighten-2']"
@ click = "dialogCreateTableShowMethod"
>
mdi - plus - box
< / x - i c o n >
< v -spacer / >
<!-- Add / Import -- >
< v -menu offset -y v-if ="_isUIAllowed('addOrImport')" >
< template # activator = "{ on }" >
< v -btn
color = "primary"
style = "height: 100%; padding: 5px;"
v - on = "on"
>
< x -icon
icon - class = "add-btn"
: color = "['white', 'grey lighten-2']"
>
mdi - plus - box
< / x - i c o n >
< span class = "flex-grow-1 caption font-weight-bold text-capitalize mx-2" >
<!-- TODO : i18n -- >
Add / Import
< / span >
< v -spacer / >
< / v - b t n >
< / template >
< v -list class = "addOrImport" >
< v -list -item
v - if = "_isUIAllowed('addTable')"
v - t = "['a:table:import-from-excel']"
@ click = "dialogCreateTableShowMethod"
>
< v -list -item -title >
< v -icon small >
mdi - table
< / v - i c o n >
< span class = "caption" >
<!-- Add new table -- >
{ { $t ( 'tooltip.addTable' ) } }
< / span >
< / v - l i s t - i t e m - t i t l e >
< / v - l i s t - i t e m >
< v -divider / >
< v -subheader class = "caption" >
QUICK IMPORT FROM
< / v - s u b h e a d e r >
< v -list -item
v - if = "_isUIAllowed('csvQuickImport')"
v - t = "['a:actions:import-csv']"
@ click = "onImportFromExcelOrCSV('csv')"
>
< v -list -item -title >
< v -icon small >
mdi - file - document - outline
< / v - i c o n >
< span class = "caption" >
<!-- TODO : i18n -- >
CSV file
< / span >
< / v - l i s t - i t e m - t i t l e >
< / v - l i s t - i t e m >
< v -list -item
v - if = "_isUIAllowed('excelQuickImport')"
v - t = "['a:actions:import-excel']"
@ click = "onImportFromExcelOrCSV('excel')"
>
< v -list -item -title >
< v -icon small >
mdi - file - excel
< / v - i c o n >
< span class = "caption" >
<!-- TODO : i18n -- >
Microsoft Excel
< / span >
< / v - l i s t - i t e m - t i t l e >
< / v - l i s t - i t e m >
< / v - l i s t >
< / v - m e n u >
< / v - t a b s >
<!-- Create Empty Table -- >
< dlg -table -create
v - if = "dialogCreateTableShow"
v - model = "dialogCreateTableShow"
@ -271,39 +326,46 @@
dialogCreateTableShow = false ;
"
/ >
<!-- < screensaver v -if = " showScreensaver & & ! ( $ store.state.project.projectInfo & & $ store.state.project.projectInfo.ncMin ) " class = "screensaver" / > -- >
<!-- Import From Excel / CSV -- >
< quick -import
ref = "quickImport"
v - model = "quickImportModal"
: quick - import - type = "quickImportType"
hide - label
@ closeModal = "quickImportModal = false"
/ >
< / v - c o n t a i n e r >
< / template >
< script >
import { mapGetters , mapMutations } from "vuex" ;
import treeViewIcons from "../helpers/treeViewIcons" ;
import TableView from "./project/table" ;
import FunctionTab from "./project/function" ;
import ProcedureTab from "./project/procedure" ;
import SequenceTab from "./project/sequence" ;
import SeedTab from "./project/seed" ;
import SqlClientTab from "./project/sqlClient" ;
import ApisTab from "./project/apis" ;
import ApiClientTab from "./project/apiClientOld" ;
import sqlLogAndOutput from "./project/sqlLogAndOutput" ;
import graphqlClient from "./project/graphqlClient" ;
import xTerm from "./xTerm" ;
import { mapGetters , mapMutations } from 'vuex'
import treeViewIcons from '../helpers/treeViewIcons'
import TableView from './project/table'
import FunctionTab from './project/function'
import ProcedureTab from './project/procedure'
import SequenceTab from './project/sequence'
import SeedTab from './project/seed'
import SqlClientTab from './project/sqlClient'
import ApisTab from './project/apis'
import ApiClientTab from './project/apiClientOld'
import sqlLogAndOutput from './project/sqlLogAndOutput'
import graphqlClient from './project/graphqlClient'
import xTerm from './xTerm'
import ApiClientSwaggerTab from "./project/apiClientSwagger" ;
import XcMeta from "./project/settings/xcMeta" ;
import XcInfo from "./project/xcInfo" ;
import SwaggerClient from "@/components/project/swaggerClient" ;
import DlgTableCreate from "@/components/utils/dlgTableCreate" ;
import AppStore from "@/components/project/appStore" ;
import AuthTab from "@/components/authTab" ;
import CronJobs from "@/components/project/cronJobs" ;
import DisableOrEnableModels from "@/components/project/projectMetadata/disableOrEnableModels" ;
import ProjectSettings from "@/components/project/projectSettings" ;
import GrpcClient from "@/components/project/grpcClient" ;
import GlobalAcl from "@/components/globalAcl" ;
import AuditTab from "~/components/project/auditTab" ;
import ApiClientSwaggerTab from './project/apiClientSwagger'
import XcMeta from './project/settings/xcMeta'
import XcInfo from './project/xcInfo'
import SwaggerClient from '@/components/project/swaggerClient'
import DlgTableCreate from '@/components/utils/dlgTableCreate'
import AppStore from '@/components/project/appStore'
import AuthTab from '@/components/authTab'
import CronJobs from '@/components/project/cronJobs'
import DisableOrEnableModels from '@/components/project/projectMetadata/disableOrEnableModels'
import ProjectSettings from '@/components/project/projectSettings'
import GrpcClient from '@/components/project/grpcClient'
import GlobalAcl from '@/components/globalAcl'
import AuditTab from '~/components/project/auditTab'
import QuickImport from '@/components/import/quickImport'
export default {
components : {
@ -334,147 +396,159 @@ export default {
sqlLogAndOutput ,
xTerm ,
graphqlClient ,
QuickImport
} ,
data ( ) {
return {
dragOver : false ,
dialogCreateTableShow : false ,
test : "" ,
test : '' ,
treeViewIcons ,
hideLogWindows : false ,
showScreensaver : false ,
} ;
quickImportModal : false ,
quickImportType : ''
}
} ,
methods : {
dialogCreateTableShowMethod ( ) {
this . dialogCreateTableShow = true ;
this . $e ( "c:table:create:navbar" ) ;
this . dialogCreateTableShow = true
this . $e ( 'c:table:create:navbar' )
} ,
checkInactiveState ( ) {
let position = 0 ;
let idleTime = 0 ;
let position = 0
let idleTime = 0
/ / I n c r e m e n t t h e i d l e t i m e c o u n t e r e v e r y m i n u t e .
let idleInterval = setInterval ( timerIncrement , 1000 ) ;
let idleInterval = setInterval ( timerIncrement , 1000 )
const self = this ;
const self = this
/ / Z e r o t h e i d l e t i m e r o n m o u s e m o v e m e n t .
document . addEventListener ( "mousemove" , ( e ) => {
self . showScreensaver = false ;
idleTime = 0 ;
clearInterval ( idleInterval ) ;
idleInterval = setInterval ( timerIncrement , 1000 ) ;
} ) ;
document . addEventListener ( "keypress" , ( e ) => {
self . showScreensaver = false ;
idleTime = 0 ;
clearInterval ( idleInterval ) ;
idleInterval = setInterval ( timerIncrement , 1000 ) ;
} ) ;
document . addEventListener ( 'mousemove' , ( e ) => {
self . showScreensaver = false
idleTime = 0
clearInterval ( idleInterval )
idleInterval = setInterval ( timerIncrement , 1000 )
} )
document . addEventListener ( 'keypress' , ( e ) => {
self . showScreensaver = false
idleTime = 0
clearInterval ( idleInterval )
idleInterval = setInterval ( timerIncrement , 1000 )
} )
function timerIncrement ( ) {
idleTime = idleTime + 1 ;
idleTime = idleTime + 1
if ( idleTime > 120 ) {
const title = document . title ;
const title = document . title
function scrolltitle ( ) {
document . title = title + Array ( position ) . fill ( " ." ) . join ( "" ) ;
position = ++ position % 3 ;
document . title = title + Array ( position ) . fill ( ' .' ) . join ( '' )
position = ++ position % 3
if ( self . showScreensaver ) {
window . setTimeout ( scrolltitle , 400 ) ;
window . setTimeout ( scrolltitle , 400 )
} else {
document . title = title ;
document . title = title
}
}
self . showScreensaver = self . $store . state . windows . screensaver ;
scrolltitle ( ) ;
clearInterval ( idleInterval ) ;
self . showScreensaver = self . $store . state . windows . screensaver
scrolltitle ( )
clearInterval ( idleInterval )
}
}
} ,
async handleKeyDown ( event ) {
const activeTabEleKey = ` tabs ${ this . activeTab } ` ;
let isHandled = false ;
const activeTabEleKey = ` tabs ${ this . activeTab } `
let isHandled = false
if (
this . $refs [ activeTabEleKey ] &&
this . $refs [ activeTabEleKey ] [ 0 ] &&
this . $refs [ activeTabEleKey ] [ 0 ] . handleKeyDown
) {
isHandled = await this . $refs [ activeTabEleKey ] [ 0 ] . handleKeyDown ( event ) ;
isHandled = await this . $refs [ activeTabEleKey ] [ 0 ] . handleKeyDown ( event )
}
if ( ! isHandled ) {
switch (
[ this . _isMac ? event . metaKey : event . ctrlKey , event . key ] . join ( "_" )
[ this . _isMac ? event . metaKey : event . ctrlKey , event . key ] . join ( '_' )
) {
case "true_w" :
this . removeTab ( this . activeTab ) ;
event . preventDefault ( ) ;
event . stopPropagation ( ) ;
break ;
case 'true_w' :
this . removeTab ( this . activeTab )
event . preventDefault ( )
event . stopPropagation ( )
break
}
}
} ,
... mapMutations ( {
setActiveTab : "tabs/active" ,
removeTab : "tabs/remove" ,
updateActiveTabx : "tabs/activeTabCtx" ,
setActiveTab : 'tabs/active' ,
removeTab : 'tabs/remove' ,
updateActiveTabx : 'tabs/activeTabCtx'
} ) ,
tabActivated ( tab ) { } ,
onImportFromExcelOrCSV ( quickImportType ) {
this . quickImportModal = true
this . quickImportType = quickImportType
}
} ,
computed : {
... mapGetters ( { tabs : "tabs/list" , activeTabCtx : "tabs/activeTabCtx" } ) ,
... mapGetters ( { tabs : 'tabs/list' , activeTabCtx : 'tabs/activeTabCtx' } ) ,
pid ( ) {
return this . $route . params . project _id ;
return this . $route . params . project _id
} ,
activeTab : {
set ( tab ) {
if ( ! tab ) {
return this . $router . push ( {
query : { } ,
} ) ;
query : { }
} )
}
const [ type , dbalias , name ] = tab . split ( "||" ) ;
const [ type , dbalias , name ] = tab . split ( '||' )
this . $router . push ( {
query : {
... this . $route . query ,
type ,
dbalias ,
name ,
} ,
} ) ;
name
}
} )
} ,
get ( ) {
return [
this . $route . query . type ,
this . $route . query . dbalias ,
this . $route . query . name ,
] . join ( "||" ) ;
} ,
} ,
this . $route . query . name
] . join ( '||' )
}
}
} ,
beforeCreated ( ) { } ,
watch : { } ,
created ( ) {
document . addEventListener ( "keydown" , this . handleKeyDown ) ;
document . addEventListener ( 'keydown' , this . handleKeyDown )
/ * *
* Listening for tab change so that we can hide / show projectlogs based on tab
* /
} ,
mounted ( ) { } ,
mounted ( ) {
if ( this . $route && this . $route . query && this . $route . query . excelUrl ) {
this . quickImportModal = true
}
} ,
beforeDestroy ( ) { } ,
destroyed ( ) {
document . removeEventListener ( "keydown" , this . handleKeyDown ) ;
document . removeEventListener ( 'keydown' , this . handleKeyDown )
} ,
directives : { } ,
validate ( { params } ) {
return true ;
return true
} ,
head ( ) {
return { } ;
return { }
} ,
props : { } ,
} ;
props : { }
}
< / script >
< style scoped >
@ -544,6 +618,14 @@ export default {
font - weight : bold ;
}
. addOrImport {
min - width : 200 px ;
}
. addOrImport . v - list - item {
min - height : 35 px ;
}
/deep/ . add - btn {
margin - left : 5 px ;
}
@ -562,6 +644,7 @@ export default {
*
* @ author Naveen MR < oof1lab @ gmail.com >
* @ author Pranav C Balan < pranavxc @ gmail.com >
* @ author Wing - Kam Wong < wingkwong .code @ gmail.com >
*
* @ license GNU AGPL version 3 or any later version
*
աɨռɢӄաօռɢ
2 years ago
committed by
GitHub