mirror of
https://gitee.com/dromara/mayfly-go
synced 2025-11-03 16:00:25 +08:00
refactor: dialect使用方式调整
This commit is contained in:
@@ -1,17 +1,22 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="layout-search-dialog">
|
<div class="layout-search-dialog">
|
||||||
<el-dialog v-model="state.isShowSearch" width="300px" destroy-on-close :modal="false" fullscreen :show-close="false">
|
<el-dialog v-model="state.isShowSearch" width="300px" destroy-on-close :modal="false" fullscreen :show-close="false">
|
||||||
<el-autocomplete v-model="state.menuQuery" :fetch-suggestions="menuSearch" placeholder="菜单搜索"
|
<el-autocomplete
|
||||||
prefix-icon="el-icon-search" ref="layoutMenuAutocompleteRef" @select="onHandleSelect" @blur="onSearchBlur">
|
v-model="state.menuQuery"
|
||||||
|
:fetch-suggestions="menuSearch"
|
||||||
|
placeholder="菜单搜索"
|
||||||
|
prefix-icon="el-icon-search"
|
||||||
|
ref="layoutMenuAutocompleteRef"
|
||||||
|
@select="onHandleSelect"
|
||||||
|
@blur="onSearchBlur"
|
||||||
|
>
|
||||||
<template #prefix>
|
<template #prefix>
|
||||||
<el-icon class="el-input__icon">
|
<el-icon class="el-input__icon">
|
||||||
<search />
|
<search />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
</template>
|
</template>
|
||||||
<template #default="{ item }">
|
<template #default="{ item }">
|
||||||
<div>
|
<div><SvgIcon :name="item.meta.icon" class="mr5" />{{ item.meta.title }}</div>
|
||||||
<SvgIcon :name="item.meta.icon" class="mr5" />{{ item.meta.title }}
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
</el-autocomplete>
|
</el-autocomplete>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
@@ -23,7 +28,7 @@ import { reactive, ref, nextTick } from 'vue';
|
|||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { useRoutesList } from '@/store/routesList';
|
import { useRoutesList } from '@/store/routesList';
|
||||||
|
|
||||||
const layoutMenuAutocompleteRef: any = ref(null);;
|
const layoutMenuAutocompleteRef: any = ref(null);
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const state: any = reactive({
|
const state: any = reactive({
|
||||||
isShowSearch: false,
|
isShowSearch: false,
|
||||||
@@ -54,8 +59,7 @@ const menuSearch = (queryString: any, cb: any) => {
|
|||||||
const createFilter = (queryString: any) => {
|
const createFilter = (queryString: any) => {
|
||||||
return (restaurant: any) => {
|
return (restaurant: any) => {
|
||||||
return (
|
return (
|
||||||
restaurant.path.toLowerCase().indexOf(queryString.toLowerCase()) > -1 ||
|
restaurant.path.toLowerCase().indexOf(queryString.toLowerCase()) > -1 || restaurant.meta.title.toLowerCase().indexOf(queryString.toLowerCase()) > -1
|
||||||
restaurant.meta.title.toLowerCase().indexOf(queryString.toLowerCase()) > -1
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
@@ -97,7 +101,7 @@ const onSearchBlur = () => {
|
|||||||
closeSearch();
|
closeSearch();
|
||||||
};
|
};
|
||||||
|
|
||||||
defineExpose({openSearch})
|
defineExpose({ openSearch });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|||||||
@@ -9,10 +9,14 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item prop="type" label="类型" required>
|
<el-form-item prop="type" label="类型" required>
|
||||||
<el-select @change="changeDbType" style="width: 100%" v-model="form.type" placeholder="请选择数据库类型">
|
<el-select @change="changeDbType" style="width: 100%" v-model="form.type" placeholder="请选择数据库类型">
|
||||||
<el-option v-for="dt in dbTypes" :key="dt.type" :value="dt.type" :label="dt.label">
|
<el-option v-for="(dbTypeAndDialect, key) in getDbDialectMap()" :key="key" :value="dbTypeAndDialect[0]">
|
||||||
<SvgIcon :name="getDbDialect(dt.type).getInfo().icon" :size="18" />
|
<SvgIcon :name="dbTypeAndDialect[1].getInfo().icon" :size="18" />
|
||||||
{{ dt.label }}
|
{{ dbTypeAndDialect[1].getInfo().name }}
|
||||||
</el-option>
|
</el-option>
|
||||||
|
|
||||||
|
<template #prefix>
|
||||||
|
<SvgIcon :name="getDbDialect(form.type).getInfo().icon" :size="18" />
|
||||||
|
</template>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.type !== DbType.sqlite" prop="host" label="host" required>
|
<el-form-item v-if="form.type !== DbType.sqlite" prop="host" label="host" required>
|
||||||
@@ -95,7 +99,7 @@ import { ElMessage } from 'element-plus';
|
|||||||
import { notBlank } from '@/common/assert';
|
import { notBlank } from '@/common/assert';
|
||||||
import { RsaEncrypt } from '@/common/rsa';
|
import { RsaEncrypt } from '@/common/rsa';
|
||||||
import SshTunnelSelect from '../component/SshTunnelSelect.vue';
|
import SshTunnelSelect from '../component/SshTunnelSelect.vue';
|
||||||
import { DbType, getDbDialect } from './dialect';
|
import { DbType, getDbDialect, getDbDialectMap } from './dialect';
|
||||||
import SvgIcon from '@/components/svgIcon/index.vue';
|
import SvgIcon from '@/components/svgIcon/index.vue';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@@ -153,37 +157,6 @@ const rules = {
|
|||||||
|
|
||||||
const dbForm: any = ref(null);
|
const dbForm: any = ref(null);
|
||||||
|
|
||||||
const dbTypes = [
|
|
||||||
{
|
|
||||||
type: 'mysql',
|
|
||||||
label: 'MySQL',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'mariadb',
|
|
||||||
label: 'MariaDB',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'postgres',
|
|
||||||
label: 'PostgreSQL',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'dm',
|
|
||||||
label: 'DM',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'oracle',
|
|
||||||
label: 'Oracle',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'sqlite',
|
|
||||||
label: 'Sqlite',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'mssql',
|
|
||||||
label: 'MSSQL',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
dialogVisible: false,
|
dialogVisible: false,
|
||||||
tabActiveName: 'basic',
|
tabActiveName: 'basic',
|
||||||
@@ -222,7 +195,7 @@ watch(props, (newValue: any) => {
|
|||||||
state.form = { ...newValue.data };
|
state.form = { ...newValue.data };
|
||||||
state.oldUserName = state.form.username;
|
state.oldUserName = state.form.username;
|
||||||
} else {
|
} else {
|
||||||
state.form = { port: null } as any;
|
state.form = { port: null, type: DbType.mysql } as any;
|
||||||
state.oldUserName = null;
|
state.oldUserName = null;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -366,6 +366,7 @@ class DMDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
dmDialectInfo = {
|
dmDialectInfo = {
|
||||||
|
name: 'DM',
|
||||||
icon: 'iconfont icon-db-dm',
|
icon: 'iconfont icon-db-dm',
|
||||||
defaultPort: 5236,
|
defaultPort: 5236,
|
||||||
formatSqlDialect: 'plsql',
|
formatSqlDialect: 'plsql',
|
||||||
|
|||||||
@@ -81,6 +81,11 @@ export const ColumnTypeSubscript = {
|
|||||||
|
|
||||||
// 数据库基础信息
|
// 数据库基础信息
|
||||||
export interface DialectInfo {
|
export interface DialectInfo {
|
||||||
|
/**
|
||||||
|
* 数据库类型label
|
||||||
|
*/
|
||||||
|
name: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 图标
|
* 图标
|
||||||
*/
|
*/
|
||||||
@@ -200,33 +205,28 @@ export interface DbDialect {
|
|||||||
}
|
}
|
||||||
|
|
||||||
let mysqlDialect = new MysqlDialect();
|
let mysqlDialect = new MysqlDialect();
|
||||||
let mariadbDialect = new MariadbDialect();
|
|
||||||
let postgresDialect = new PostgresqlDialect();
|
|
||||||
let dmDialect = new DMDialect();
|
|
||||||
let oracleDialect = new OracleDialect();
|
|
||||||
let sqliteDialect = new SqliteDialect();
|
|
||||||
let mssqlDialect = new MssqlDialect();
|
|
||||||
|
|
||||||
export const getDbDialect = (dbType: string | undefined): DbDialect => {
|
let dbType2DialectMap: Map<string, DbDialect> = new Map();
|
||||||
if (!dbType) {
|
|
||||||
return mysqlDialect;
|
export const registerDbDialect = (dbType: string, dd: DbDialect) => {
|
||||||
}
|
dbType2DialectMap.set(dbType, dd);
|
||||||
switch (dbType) {
|
|
||||||
case DbType.mysql:
|
|
||||||
return mysqlDialect;
|
|
||||||
case DbType.mariadb:
|
|
||||||
return mariadbDialect;
|
|
||||||
case DbType.postgresql:
|
|
||||||
return postgresDialect;
|
|
||||||
case DbType.dm:
|
|
||||||
return dmDialect;
|
|
||||||
case DbType.oracle:
|
|
||||||
return oracleDialect;
|
|
||||||
case DbType.sqlite:
|
|
||||||
return sqliteDialect;
|
|
||||||
case DbType.mssql:
|
|
||||||
return mssqlDialect;
|
|
||||||
default:
|
|
||||||
throw new Error('不支持的数据库');
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const getDbDialectMap = () => {
|
||||||
|
return dbType2DialectMap;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const getDbDialect = (dbType: string): DbDialect => {
|
||||||
|
return dbType2DialectMap.get(dbType) || mysqlDialect;
|
||||||
|
};
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
console.log('init register db dialect');
|
||||||
|
registerDbDialect(DbType.mysql, mysqlDialect);
|
||||||
|
registerDbDialect(DbType.mariadb, new MariadbDialect());
|
||||||
|
registerDbDialect(DbType.postgresql, new PostgresqlDialect());
|
||||||
|
registerDbDialect(DbType.dm, new DMDialect());
|
||||||
|
registerDbDialect(DbType.oracle, new OracleDialect());
|
||||||
|
registerDbDialect(DbType.sqlite, new SqliteDialect());
|
||||||
|
registerDbDialect(DbType.mssql, new MssqlDialect());
|
||||||
|
})();
|
||||||
|
|||||||
@@ -12,6 +12,7 @@ class MariadbDialect extends MysqlDialect implements DbDialect {
|
|||||||
|
|
||||||
mariadbDialectInfo = {} as DialectInfo;
|
mariadbDialectInfo = {} as DialectInfo;
|
||||||
Object.assign(mariadbDialectInfo, super.getInfo());
|
Object.assign(mariadbDialectInfo, super.getInfo());
|
||||||
|
mariadbDialectInfo.name = 'MariaDB';
|
||||||
mariadbDialectInfo.icon = 'iconfont icon-mariadb';
|
mariadbDialectInfo.icon = 'iconfont icon-mariadb';
|
||||||
return mariadbDialectInfo;
|
return mariadbDialectInfo;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -107,6 +107,7 @@ class MssqlDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
mssqlDialectInfo = {
|
mssqlDialectInfo = {
|
||||||
|
name: 'MSSQL',
|
||||||
icon: 'iconfont icon-MSSQLNATIVE',
|
icon: 'iconfont icon-MSSQLNATIVE',
|
||||||
defaultPort: 1433,
|
defaultPort: 1433,
|
||||||
formatSqlDialect: 'transactsql',
|
formatSqlDialect: 'transactsql',
|
||||||
|
|||||||
@@ -104,6 +104,7 @@ class MysqlDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
mysqlDialectInfo = {
|
mysqlDialectInfo = {
|
||||||
|
name: 'MySQL',
|
||||||
icon: 'iconfont icon-op-mysql',
|
icon: 'iconfont icon-op-mysql',
|
||||||
defaultPort: 3306,
|
defaultPort: 3306,
|
||||||
formatSqlDialect: 'mysql',
|
formatSqlDialect: 'mysql',
|
||||||
|
|||||||
@@ -154,6 +154,7 @@ class OracleDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
oracleDialectInfo = {
|
oracleDialectInfo = {
|
||||||
|
name: 'Oracle',
|
||||||
icon: 'iconfont icon-oracle',
|
icon: 'iconfont icon-oracle',
|
||||||
defaultPort: 1521,
|
defaultPort: 1521,
|
||||||
formatSqlDialect: 'plsql',
|
formatSqlDialect: 'plsql',
|
||||||
|
|||||||
@@ -123,6 +123,7 @@ class PostgresqlDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
pgDialectInfo = {
|
pgDialectInfo = {
|
||||||
|
name: 'PostgreSQL',
|
||||||
icon: 'iconfont icon-op-postgres',
|
icon: 'iconfont icon-op-postgres',
|
||||||
defaultPort: 5432,
|
defaultPort: 5432,
|
||||||
formatSqlDialect: 'postgresql',
|
formatSqlDialect: 'postgresql',
|
||||||
|
|||||||
@@ -123,6 +123,7 @@ class SqliteDialect implements DbDialect {
|
|||||||
};
|
};
|
||||||
|
|
||||||
sqliteDialectInfo = {
|
sqliteDialectInfo = {
|
||||||
|
name: 'Sqlite',
|
||||||
icon: 'iconfont icon-sqlite',
|
icon: 'iconfont icon-sqlite',
|
||||||
defaultPort: 0,
|
defaultPort: 0,
|
||||||
formatSqlDialect: 'sql',
|
formatSqlDialect: 'sql',
|
||||||
|
|||||||
@@ -93,7 +93,10 @@ func (me *MachineInfo) IfUseSshTunnelChangeIpPort() error {
|
|||||||
func GetSshClient(m *MachineInfo, jumpClient *ssh.Client) (*ssh.Client, error) {
|
func GetSshClient(m *MachineInfo, jumpClient *ssh.Client) (*ssh.Client, error) {
|
||||||
// 递归一直取到底层没有跳板机的机器信息
|
// 递归一直取到底层没有跳板机的机器信息
|
||||||
if m.SshTunnelMachine != nil {
|
if m.SshTunnelMachine != nil {
|
||||||
jumpClient, _ = GetSshClient(m.SshTunnelMachine, jumpClient)
|
jumpClient, err := GetSshClient(m.SshTunnelMachine, jumpClient)
|
||||||
|
if err != nil {
|
||||||
|
return nil, err
|
||||||
|
}
|
||||||
// 新建一个没有跳板机的机器信息
|
// 新建一个没有跳板机的机器信息
|
||||||
m1 := &MachineInfo{
|
m1 := &MachineInfo{
|
||||||
Ip: m.Ip,
|
Ip: m.Ip,
|
||||||
|
|||||||
Reference in New Issue
Block a user