mirror of
https://github.com/jumpserver/lina.git
synced 2025-09-19 17:54:37 +00:00
perf: 优化应用树,统一 dropdown
This commit is contained in:
@@ -64,7 +64,6 @@ export default {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: {
|
||||
config: {
|
||||
@@ -211,7 +210,7 @@ export default {
|
||||
},
|
||||
generateTotalColumns() {
|
||||
const config = _.cloneDeep(this.config)
|
||||
const columns = []
|
||||
let columns = []
|
||||
for (let col of config.columns) {
|
||||
if (typeof col === 'object') {
|
||||
columns.push(col)
|
||||
@@ -220,6 +219,15 @@ export default {
|
||||
columns.push(col)
|
||||
}
|
||||
}
|
||||
columns = columns.filter(item => {
|
||||
let has = item.has
|
||||
if (has === undefined) {
|
||||
has = true
|
||||
} else if (typeof has === 'function') {
|
||||
has = has()
|
||||
}
|
||||
return has
|
||||
})
|
||||
// 第一次初始化时记录 totalColumns
|
||||
this.totalColumns = columns
|
||||
config.columns = columns
|
||||
|
@@ -33,7 +33,12 @@ export default {
|
||||
showOverflowTooltip: true,
|
||||
formatter: function(row, column, cellValue, index) {
|
||||
const route = { to: { name: 'AssetDetail', params: { id: cellValue }}}
|
||||
return <router-link{...{ attrs: route }} >{ row.attrs.asset_info.hostname }</router-link>
|
||||
const hostname = row.attrs['asset_info'].hostname
|
||||
if (vm.$hasPerm('assets.view_asset')) {
|
||||
return <router-link{...{ attrs: route }} >{ hostname }</router-link>
|
||||
} else {
|
||||
return hostname
|
||||
}
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
|
161
src/views/applications/const.js
Normal file
161
src/views/applications/const.js
Normal file
@@ -0,0 +1,161 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
import store from '@/store'
|
||||
export const CHROME = 'chrome'
|
||||
export const MYSQL_WORKBENCH = 'mysql_workbench'
|
||||
export const VMWARE_CLIENT = 'vmware_client'
|
||||
export const CUSTOM = 'custom'
|
||||
export const REMOTEAPP_CATEGORY = 'remote_app'
|
||||
|
||||
function hasLicence() {
|
||||
return store.getters.hasValidLicense
|
||||
}
|
||||
|
||||
export const REMOTE_APP = [
|
||||
{
|
||||
name: CHROME,
|
||||
title: i18n.t(`applications.applicationsType.${CHROME}`),
|
||||
type: 'primary',
|
||||
group: i18n.t('applications.RemoteApp'),
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: MYSQL_WORKBENCH,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL_WORKBENCH}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: VMWARE_CLIENT,
|
||||
title: i18n.t(`applications.applicationsType.${VMWARE_CLIENT}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: CUSTOM,
|
||||
title: i18n.t(`applications.applicationsType.${CUSTOM}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
}
|
||||
]
|
||||
|
||||
export const MYSQL = 'mysql'
|
||||
export const ORACLE = 'oracle'
|
||||
export const POSTGRESQL = 'postgresql'
|
||||
export const MARIADB = 'mariadb'
|
||||
export const DATABASE_CATEGORY = 'db'
|
||||
export const SQLSERVER = 'sqlserver'
|
||||
export const REDIS = 'redis'
|
||||
export const MONGODB = 'mongodb'
|
||||
|
||||
export const DATABASE = [
|
||||
{
|
||||
name: MYSQL,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.RDBProtocol')
|
||||
},
|
||||
{
|
||||
name: MARIADB,
|
||||
title: i18n.t(`applications.applicationsType.${MARIADB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true
|
||||
},
|
||||
{
|
||||
name: ORACLE,
|
||||
title: i18n.t(`applications.applicationsType.${ORACLE}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: POSTGRESQL,
|
||||
title: i18n.t(`applications.applicationsType.${POSTGRESQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: SQLSERVER,
|
||||
title: i18n.t(`applications.applicationsType.${SQLSERVER}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: REDIS,
|
||||
title: i18n.t(`applications.applicationsType.${REDIS}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.NoSQLProtocol')
|
||||
},
|
||||
{
|
||||
name: MONGODB,
|
||||
title: i18n.t(`applications.applicationsType.${MONGODB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY
|
||||
}
|
||||
]
|
||||
|
||||
export const AppPlanDatabase = [
|
||||
{
|
||||
name: MYSQL,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.RDBProtocol')
|
||||
},
|
||||
{
|
||||
name: ORACLE,
|
||||
title: i18n.t(`applications.applicationsType.${ORACLE}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: POSTGRESQL,
|
||||
title: i18n.t(`applications.applicationsType.${POSTGRESQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: MARIADB,
|
||||
title: i18n.t(`applications.applicationsType.${MARIADB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY
|
||||
},
|
||||
{
|
||||
name: SQLSERVER,
|
||||
title: i18n.t(`applications.applicationsType.${SQLSERVER}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
}
|
||||
]
|
||||
|
||||
export const KUBERNETES = 'k8s'
|
||||
export const CLOUD_CATEGORY = 'cloud'
|
||||
|
||||
export const CLOUD = [
|
||||
{
|
||||
name: KUBERNETES,
|
||||
title: i18n.t(`applications.applicationsType.${KUBERNETES}`),
|
||||
group: i18n.t('applications.Cloud'),
|
||||
type: 'primary',
|
||||
category: CLOUD_CATEGORY,
|
||||
has: true
|
||||
}
|
||||
]
|
||||
|
||||
export const ApplicationTypes = [
|
||||
...REMOTE_APP, ...DATABASE, ...CLOUD
|
||||
]
|
@@ -9,6 +9,8 @@
|
||||
|
||||
<script>
|
||||
import { GenericListTable } from '@/layout/components'
|
||||
import { ApplicationTypes } from '@/views/applications/const'
|
||||
import { AssetProtocols } from '@/views/assets/const'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@@ -75,81 +77,8 @@ export default {
|
||||
vm.$router.push({ name: 'SystemUserCreate', query: { protocol: option.title.toLowerCase() }})
|
||||
},
|
||||
dropdown: [
|
||||
{
|
||||
title: 'SSH',
|
||||
name: 'SSH',
|
||||
type: 'primary',
|
||||
group: this.$t('assets.HostProtocol'),
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'RDP',
|
||||
name: 'RDP',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'VNC',
|
||||
name: 'VNC',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'Telnet',
|
||||
name: 'Telnet',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
name: 'MySQL',
|
||||
title: 'MySQL',
|
||||
type: 'primary',
|
||||
has: true,
|
||||
group: this.$t('assets.RDBProtocol')
|
||||
},
|
||||
{
|
||||
name: 'MariaDB',
|
||||
title: 'MariaDB',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
name: 'PostgreSQL',
|
||||
title: 'PostgreSQL',
|
||||
type: 'primary',
|
||||
has: this.$store.getters.hasValidLicense
|
||||
},
|
||||
{
|
||||
name: 'Oracle',
|
||||
title: 'Oracle',
|
||||
type: 'primary',
|
||||
has: this.$store.getters.hasValidLicense
|
||||
},
|
||||
{
|
||||
name: 'SQLServer',
|
||||
title: 'SQLServer',
|
||||
type: 'primary',
|
||||
has: this.$store.getters.hasValidLicense
|
||||
},
|
||||
{
|
||||
name: 'Redis',
|
||||
title: 'Redis',
|
||||
type: 'primary',
|
||||
has: true,
|
||||
group: this.$t('assets.NoSQLProtocol')
|
||||
},
|
||||
{
|
||||
name: 'MongoDB',
|
||||
title: 'MongoDB',
|
||||
type: 'primary',
|
||||
has: this.$store.getters.hasValidLicense
|
||||
},
|
||||
{
|
||||
name: 'K8S',
|
||||
title: 'K8S',
|
||||
type: 'primary',
|
||||
group: this.$t('assets.OtherProtocol')
|
||||
}
|
||||
...AssetProtocols,
|
||||
...ApplicationTypes
|
||||
]
|
||||
}
|
||||
},
|
||||
|
30
src/views/assets/const.js
Normal file
30
src/views/assets/const.js
Normal file
@@ -0,0 +1,30 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
|
||||
export const AssetProtocols = [
|
||||
{
|
||||
title: 'SSH',
|
||||
name: 'SSH',
|
||||
type: 'primary',
|
||||
group: i18n.t('assets.HostProtocol'),
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'RDP',
|
||||
name: 'RDP',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'VNC',
|
||||
name: 'VNC',
|
||||
type: 'primary',
|
||||
has: true
|
||||
},
|
||||
{
|
||||
title: 'Telnet',
|
||||
name: 'Telnet',
|
||||
type: 'primary',
|
||||
has: true
|
||||
}
|
||||
]
|
||||
|
@@ -1,12 +1,17 @@
|
||||
<template>
|
||||
<GenericTreeListPage ref="TreeTablePage" :tree-setting="treeSetting" :header-actions="headerActions" :table-config="tableConfig" />
|
||||
<GenericTreeListPage
|
||||
ref="TreeTablePage"
|
||||
:tree-setting="treeSetting"
|
||||
:header-actions="headerActions"
|
||||
:table-config="tableConfig"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import GenericTreeListPage from '@/layout/components/GenericTreeListPage'
|
||||
import { setUrlParam } from '@/utils/common'
|
||||
import { DetailFormatter } from '@/components/TableFormatters'
|
||||
import { ApplicationTypes } from '@/views/perms/const'
|
||||
import { ApplicationTypes } from '@/views/applications/const'
|
||||
|
||||
export default {
|
||||
name: 'AssetAccountList',
|
||||
|
@@ -1,163 +0,0 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
import store from '@/store'
|
||||
export const CHROME = 'chrome'
|
||||
export const MYSQL_WORKBENCH = 'mysql_workbench'
|
||||
export const VMWARE_CLIENT = 'vmware_client'
|
||||
export const CUSTOM = 'custom'
|
||||
export const REMOTEAPP_CATEGORY = 'remote_app'
|
||||
|
||||
function hasLicence() {
|
||||
return store.getters.hasValidLicense
|
||||
}
|
||||
|
||||
export const REMOTE_APP = [
|
||||
{
|
||||
name: CHROME,
|
||||
title: i18n.t(`applications.applicationsType.${CHROME}`),
|
||||
type: 'primary',
|
||||
group: i18n.t('applications.RemoteApp'),
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: MYSQL_WORKBENCH,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL_WORKBENCH}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: VMWARE_CLIENT,
|
||||
title: i18n.t(`applications.applicationsType.${VMWARE_CLIENT}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: CUSTOM,
|
||||
title: i18n.t(`applications.applicationsType.${CUSTOM}`),
|
||||
type: 'primary',
|
||||
category: REMOTEAPP_CATEGORY,
|
||||
has: hasLicence
|
||||
}
|
||||
]
|
||||
|
||||
export const MYSQL = 'mysql'
|
||||
export const ORACLE = 'oracle'
|
||||
export const POSTGRESQL = 'postgresql'
|
||||
export const MARIADB = 'mariadb'
|
||||
export const DATABASE_CATEGORY = 'db'
|
||||
export const SQLSERVER = 'sqlserver'
|
||||
export const REDIS = 'redis'
|
||||
export const MONGODB = 'mongodb'
|
||||
|
||||
export const DATABASE = [
|
||||
{
|
||||
name: MYSQL,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.RDBProtocol')
|
||||
},
|
||||
{
|
||||
name: MARIADB,
|
||||
title: i18n.t(`applications.applicationsType.${MARIADB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true
|
||||
},
|
||||
{
|
||||
name: ORACLE,
|
||||
title: i18n.t(`applications.applicationsType.${ORACLE}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: POSTGRESQL,
|
||||
title: i18n.t(`applications.applicationsType.${POSTGRESQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: SQLSERVER,
|
||||
title: i18n.t(`applications.applicationsType.${SQLSERVER}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: REDIS,
|
||||
title: i18n.t(`applications.applicationsType.${REDIS}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.NoSQLProtocol')
|
||||
},
|
||||
{
|
||||
name: MONGODB,
|
||||
title: i18n.t(`applications.applicationsType.${MONGODB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
}
|
||||
]
|
||||
|
||||
export const AppPlanDatabase = [
|
||||
{
|
||||
name: MYSQL,
|
||||
title: i18n.t(`applications.applicationsType.${MYSQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: true,
|
||||
group: i18n.t('applications.RDBProtocol')
|
||||
},
|
||||
{
|
||||
name: ORACLE,
|
||||
title: i18n.t(`applications.applicationsType.${ORACLE}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: POSTGRESQL,
|
||||
title: i18n.t(`applications.applicationsType.${POSTGRESQL}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: MARIADB,
|
||||
title: i18n.t(`applications.applicationsType.${MARIADB}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
},
|
||||
{
|
||||
name: SQLSERVER,
|
||||
title: i18n.t(`applications.applicationsType.${SQLSERVER}`),
|
||||
type: 'primary',
|
||||
category: DATABASE_CATEGORY,
|
||||
has: hasLicence
|
||||
}
|
||||
]
|
||||
|
||||
export const KUBERNETES = 'k8s'
|
||||
export const CLOUD_CATEGORY = 'cloud'
|
||||
|
||||
export const CLOUD = [
|
||||
{
|
||||
name: KUBERNETES,
|
||||
title: i18n.t(`applications.applicationsType.${KUBERNETES}`),
|
||||
group: i18n.t('applications.Cloud'),
|
||||
type: 'primary',
|
||||
category: CLOUD_CATEGORY,
|
||||
has: true
|
||||
}
|
||||
]
|
||||
|
||||
export const ApplicationTypes = [
|
||||
...REMOTE_APP, ...DATABASE, ...CLOUD
|
||||
]
|
||||
|
@@ -87,7 +87,10 @@ export default {
|
||||
return row['org_roles_display']
|
||||
},
|
||||
filters: [],
|
||||
columnKey: 'org_roles'
|
||||
columnKey: 'org_roles',
|
||||
has: () => {
|
||||
return this.$store.getters.hasValidLicense
|
||||
}
|
||||
},
|
||||
mfa_enabled: {
|
||||
label: 'MFA',
|
||||
@@ -127,6 +130,7 @@ export default {
|
||||
},
|
||||
headerActions: {
|
||||
hasBulkDelete: hasDelete,
|
||||
canCreate: this.$hasPerm('users.add_user'),
|
||||
extraActions: [
|
||||
{
|
||||
name: this.$t('users.InviteUser'),
|
||||
|
Reference in New Issue
Block a user