TRKJ/mayfly-go
2
0
Fork 0
mirror of https://gitee.com/dromara/mayfly-go synced 2025-11-03 07:50:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 小功能优化

Browse Source
This commit is contained in:
meilin.huang
2023-02-06 17:14:16 +08:00
parent ed3dbafc35
commit ba63736871
14 changed files with 856 additions and 792 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
mayfly_go_web/package.json
View File

@@ -13,7 +13,7 @@
"countup.js": "^2.0.7", "countup.js": "^2.0.7",
"cropperjs": "^1.5.11", "cropperjs": "^1.5.11",
"echarts": "^5.4.0", "echarts": "^5.4.0",
"element-plus": "^2.2.26", "element-plus": "^2.2.29",
"jsencrypt": "^3.2.1", "jsencrypt": "^3.2.1",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"mitt": "^3.0.0", "mitt": "^3.0.0",
@@ -44,10 +44,10 @@
"eslint": "^8.5.0", "eslint": "^8.5.0",
"eslint-plugin-vue": "^8.2.0", "eslint-plugin-vue": "^8.2.0",
"prettier": "^2.3.0", "prettier": "^2.3.0",
"sass": "^1.45.1", "sass": "^1.58.0",
"sass-loader": "^12.4.0", "sass-loader": "^13.2.0",
"typescript": "^4.7.4", "typescript": "^4.7.4",
"vite": "^4.0.4", "vite": "^4.1.1",
"vue-eslint-parser": "^8.0.1" "vue-eslint-parser": "^8.0.1"
}, },
"browserslist": [ "browserslist": [

12
mayfly_go_web/src/common/config.ts
View File

@@ -1,6 +1,14 @@
function getBaseApiUrl() {
let path = window.location.pathname;
if (path == '/') {
return window.location.host;
}
return window.location.host + path;
}
const config = { const config = {
baseApiUrl: `${(window as any).globalConfig.BaseApiUrl}/api`, baseApiUrl: `${(window as any).globalConfig.BaseApiUrl || location.protocol + '//' + getBaseApiUrl()}/api`,
baseWsUrl: `${(window as any).globalConfig.BaseWsUrl || `${location.protocol == 'https:' ? 'wss:' : 'ws:'}//${location.host}`}/api`, baseWsUrl: `${(window as any).globalConfig.BaseWsUrl || `${location.protocol == 'https:' ? 'wss:' : 'ws:'}//${getBaseApiUrl()}`}/api`,
// 系统版本 // 系统版本
version: 'v1.3.1' version: 'v1.3.1'

851
mayfly_go_web/src/views/ops/db/SqlExec.vue
View File

File diff suppressed because it is too large Load Diff

368
mayfly_go_web/src/views/ops/db/component/InstanceTree.vue
View File

@@ -1,163 +1,172 @@
<template> <template>
<div class="instances-box layout-aside"> <div class="instances-box layout-aside">
<el-row type="flex" justify="space-between"> <el-row type="flex" justify="space-between">
<el-col :span="24" :style="{maxHeight: instanceMenuMaxHeight,height: instanceMenuMaxHeight, overflow:'auto'}" class="el-scrollbar flex-auto"> <el-col :span="24"
<el-menu background-color="transparent" :collapse-transition="false"> :style="{ maxHeight: instanceMenuMaxHeight, height: instanceMenuMaxHeight, overflow: 'auto' }"
<!-- 第一级：tag --> class="el-scrollbar flex-auto">
<el-sub-menu v-for="tag of instances.tags" :index="tag.tagPath" :key="tag.tagPath"> <el-menu background-color="transparent" :collapse-transition="false">
<template #title> <!-- 第一级：tag -->
<el-icon><FolderOpened color="#e6a23c"/></el-icon> <el-sub-menu v-for="tag of instances.tags" :index="tag.tagPath" :key="tag.tagPath">
<span>{{ tag.tagPath }}</span> <template #title>
</template> <el-icon>
<!-- 第二级：数据库实例 --> <FolderOpened color="#e6a23c" />
<el-sub-menu v-for="inst in instances.tree[tag.tagId]" </el-icon>
:index="'instance-' + inst.id" <span>{{ tag.tagPath }}</span>
:key="'instance-' + inst.id" </template>
@click="changeInstance(inst)" <!-- 第二级：数据库实例 -->
> <el-sub-menu v-for="inst in instances.tree[tag.tagId]" :index="'instance-' + inst.id"
<template #title> :key="'instance-' + inst.id" @click="changeInstance(inst)">
<el-popover <template #title>
placement="right-start" <el-popover placement="right-start" title="数据库实例信息" trigger="hover" :width="210">
title="数据库实例信息" <template #reference>
trigger="hover" <span>&nbsp;&nbsp;<el-icon>
:width="210" <MostlyCloudy color="#409eff" />
> </el-icon>{{ inst.name }}</span>
<template #reference> </template>
<span>&nbsp;&nbsp;<el-icon><MostlyCloudy color="#409eff"/></el-icon>{{ inst.name }}</span> <template #default>
</template> <el-form class="instances-pop-form" label-width="55px" :size="'small'">
<template #default> <el-form-item label="类型:">{{ inst.type }}</el-form-item>
<el-form class="instances-pop-form" label-width="55px" :size="'small'"> <el-form-item label="链接:">{{ inst.host }}:{{ inst.port }}</el-form-item>
<el-form-item label="类型:">{{inst.type}}</el-form-item> <el-form-item label="用户:">{{ inst.username }}</el-form-item>
<el-form-item label="链接:">{{inst.host}}:{{inst.port}}</el-form-item> <el-form-item v-if="inst.remark" label="备注:">{{
<el-form-item label="用户:">{{inst.username}}</el-form-item> inst.remark
<el-form-item v-if="inst.remark" label="备注:">{{inst.remark}}</el-form-item> }}</el-form-item>
</el-form> </el-form>
</template> </template>
</el-popover> </el-popover>
</template> </template>
<!-- 第三级：数据库 --> <!-- 第三级：数据库 -->
<el-sub-menu v-for="schema in instances.dbs[inst.id]" <el-sub-menu v-for="schema in instances.dbs[inst.id]" :index="inst.id + schema"
:index="inst.id + schema" :key="inst.id + schema" :class="state.nowSchema === (inst.id + schema) && 'checked'"
:key="inst.id + schema" @click="changeSchema(inst, schema)">
:class="state.nowSchema === (inst.id+schema) && 'checked'" <template #title>
@click="changeSchema(inst, schema)" &nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
> <Coin color="#67c23a" />
<template #title> </el-icon>
&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Coin color="#67c23a"/></el-icon> <span class="checked-schema">{{ schema }}</span>
<span class="checked-schema">{{ schema }}</span> </template>
</template> <!-- 第四级 01：表 -->
<!-- 第四级 01：表 --> <el-sub-menu :index="inst.id + schema + '-table'">
<el-sub-menu :index="inst.id + schema + '-table'" > <template #title>
<template #title> <div style="width: 100%" @click="loadTableNames(inst, schema)">
<div style="width: 100%" @click="loadTableNames(inst, schema)"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Calendar color="#409eff"/></el-icon> <Calendar color="#409eff" />
<span>表</span> </el-icon>
<el-icon v-show="state.loading[inst.id + schema]" class="is-loading"><Loading /></el-icon> <span>表</span>
</div> <el-icon v-show="state.loading[inst.id + schema]" class="is-loading">
</template> <Loading />
<el-menu-item :index="inst.id + schema + '-tableSearch'" </el-icon>
:key="inst.id + schema + '-tableSearch'"> </div>
<template #title> </template>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <el-menu-item :index="inst.id + schema + '-tableSearch'"
<el-input size="small" placeholder="过滤表" clearable :key="inst.id + schema + '-tableSearch'">
@change="filterTableName(inst.id, schema)" <template #title>
@keyup="e => filterTableName(inst.id, schema, e)" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
v-model="state.filterParam[inst.id+schema]"/> <el-input size="small" placeholder="过滤表" clearable
</template> @change="filterTableName(inst.id, schema)"
</el-menu-item> @keyup="(e: any) => filterTableName(inst.id, schema, e)"
v-model="state.filterParam[inst.id + schema]" />
<template v-for="tb in instances.tables[inst.id+schema]" > </template>
<el-menu-item :index="inst.id + schema + tb.tableName" </el-menu-item>
:key="inst.id + schema + tb.tableName"
v-if="tb.show"
@click="loadTableData(inst, schema, tb.tableName)"
>
<template #title>
<div style="width: 100%" >
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Calendar color="#409eff"/></el-icon>
<span :title="tb.tableComment||''">{{tb.tableName}}</span>
</div>
</template>
</el-menu-item>
</template>
</el-sub-menu>
<!-- 第四级 02：sql -->
<el-sub-menu :index="inst.id + schema + '-sql'">
<template #title>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><List color="#f56c6c"/></el-icon>
<span>sql</span>
</template>
<template v-for="sql in instances.sqls[inst.id+schema]" > <template v-for="tb in instances.tables[inst.id + schema]">
<el-menu-item :index="inst.id + schema + sql.name" <el-menu-item :index="inst.id + schema + tb.tableName"
:key="inst.id + schema + sql.name" :key="inst.id + schema + tb.tableName" v-if="tb.show"
v-if="sql.show" @click="loadTableData(inst, schema, tb.tableName)">
@click="loadSql(inst, schema, sql.name)" <template #title>
> <div style="width: 100%">
<template #title> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
<div style="width: 100%" > <Calendar color="#409eff" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Calendar color="#409eff"/></el-icon> </el-icon>
<span>{{sql.name}}</span> <el-tooltip v-if="tb.tableComment" effect="customized"
</div> :content="tb.tableComment" placement="right">
</template> {{ tb.tableName }}
</el-menu-item> </el-tooltip>
</template> <span v-else>{{ tb.tableName }}</span>
</el-sub-menu> </div>
</el-sub-menu> </template>
</el-sub-menu> </el-menu-item>
</el-sub-menu> </template>
</el-menu> </el-sub-menu>
</el-col> <!-- 第四级 02：sql -->
</el-row> <el-sub-menu :index="inst.id + schema + '-sql'">
</div> <template #title>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
<List color="#f56c6c" />
</el-icon>
<span>sql</span>
</template>
<template v-for="sql in instances.sqls[inst.id + schema]">
<el-menu-item :index="inst.id + schema + sql.name"
:key="inst.id + schema + sql.name" v-if="sql.show"
@click="loadSql(inst, schema, sql.name)">
<template #title>
<div style="width: 100%">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
<Calendar color="#409eff" />
</el-icon>
<span>{{ sql.name }}</span>
</div>
</template>
</el-menu-item>
</template>
</el-sub-menu>
</el-sub-menu>
</el-sub-menu>
</el-sub-menu>
</el-menu>
</el-col>
</el-row>
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {onBeforeMount, reactive} from 'vue'; import { onBeforeMount, reactive } from 'vue';
const props = defineProps({ const props = defineProps({
instanceMenuMaxHeight: { instanceMenuMaxHeight: {
type: [Number, String], type: [Number, String],
}, },
instances: { instances: {
type: Object, required: true type: Object, required: true
}, },
}) })
const emits = defineEmits(['initLoadInstances','changeInstance','loadTableNames','loadTableData','changeSchema']) const emits = defineEmits(['initLoadInstances', 'changeInstance', 'loadTableNames', 'loadTableData', 'changeSchema'])
onBeforeMount(async ()=>{ onBeforeMount(async () => {
await initLoadInstances() await initLoadInstances()
}) })
const state = reactive({ const state = reactive({
nowSchema: '', nowSchema: '',
filterParam: {}, filterParam: {},
loading: {} loading: {}
}) })
/** /**
* 初始化加载实例数据 * 初始化加载实例数据
*/ */
const initLoadInstances = () => { const initLoadInstances = () => {
emits('initLoadInstances') emits('initLoadInstances')
} }
/** /**
* 改变选中的数据库实例 * 改变选中的数据库实例
* @param inst 选中的实例对象 * @param inst 选中的实例对象
*/ */
const changeInstance = (inst : any) => { const changeInstance = (inst: any) => {
emits('changeInstance', inst) emits('changeInstance', inst)
} }
/** /**
* 改变选中的数据库schema * 改变选中的数据库schema
* @param inst 选中的实例对象 * @param inst 选中的实例对象
* @param schema 选中的数据库schema * @param schema 选中的数据库schema
*/ */
const changeSchema = (inst : any, schema: string) => { const changeSchema = (inst: any, schema: string) => {
state.nowSchema = inst.id + schema state.nowSchema = inst.id + schema
emits('changeSchema', inst, schema) emits('changeSchema', inst, schema)
} }
/** /**
* 加载schema下所有表 * 加载schema下所有表
@@ -165,10 +174,10 @@ const changeSchema = (inst : any, schema: string) => {
* @param schema database名 * @param schema database名
*/ */
const loadTableNames = async (inst: any, schema: string) => { const loadTableNames = async (inst: any, schema: string) => {
state.loading[inst.id+schema] = true state.loading[inst.id + schema] = true
await emits('loadTableNames', inst, schema, ()=>{ await emits('loadTableNames', inst, schema, () => {
state.loading[inst.id+schema] = false state.loading[inst.id + schema] = false
}) })
} }
/** /**
* 加载选中表数据 * 加载选中表数据
@@ -177,60 +186,67 @@ const loadTableNames = async (inst: any, schema: string) => {
* @param tableName 表名 * @param tableName 表名
*/ */
const loadTableData = (inst: any, schema: string, tableName: string) => { const loadTableData = (inst: any, schema: string, tableName: string) => {
emits('loadTableData', inst, schema, tableName) emits('loadTableData', inst, schema, tableName)
} }
const filterTableName = (instId: number, schema: string, event?: any) => { const filterTableName = (instId: number, schema: string, event?: any) => {
if(event){ if (event) {
state.filterParam[instId+schema] = event.target.value state.filterParam[instId + schema] = event.target.value
} }
let param = state.filterParam[instId+schema] as string let param = state.filterParam[instId + schema] as string
param = param?.replace('/','\/') param = param?.replace('/', '\/')
const key = instId + schema; const key = instId + schema;
props.instances.tables[key].forEach((a:any) =>{ props.instances.tables[key].forEach((a: any) => {
a.show = param?eval('/'+param.split('').join('[_\w]*')+'[_\w]*/ig').test(a.tableName):true a.show = param ? eval('/' + param.split('').join('[_\w]*') + '[_\w]*/ig').test(a.tableName) : true
}) })
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.instances-box { .instances-box {
.el-menu{ .el-menu {
width: 275px; width: 100%;
} }
.el-sub-menu{
.checked{ .el-sub-menu {
.checked-schema{ .checked {
color: var(--el-color-primary); .checked-schema {
} color: var(--el-color-primary);
}
}
}
.el-sub-menu__title {
padding-left: 0 !important;
height: 30px !important;
line-height: 30px !important;
}
.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-sub-menu__title {
padding-right: 10px;
}
.el-menu-item {
padding-left: 0 !important;
height: 20px !important;
line-height: 20px !important;
}
.el-icon {
margin: 0;
}
.el-sub-menu__icon-arrow {
top: inherit;
right: 10px;
} }
}
.el-sub-menu__title{
padding-left: 0 !important;
height: 30px !important;
line-height: 30px !important;
}
.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-sub-menu__title{
padding-right: 10px;
}
.el-menu-item{
padding-left: 0 !important;
height: 20px !important;
line-height: 20px !important;
}
.el-icon{
margin: 0;
}
.el-sub-menu__icon-arrow{
top:inherit;
right: 10px;
}
} }
.instances-pop-form{
.el-form-item{ .instances-pop-form {
margin-bottom: unset; .el-form-item {
} margin-bottom: unset;
}
} }
</style> </style>

334
mayfly_go_web/src/views/ops/mongo/MongoInstanceTree.vue
View File

@@ -1,152 +1,153 @@
<template> <template>
<div class="instances-box layout-aside"> <div class="instances-box layout-aside">
<el-row type="flex" justify="space-between"> <el-row type="flex" justify="space-between">
<el-col :span="24" :style="{ <el-col :span="24" :style="{
maxHeight: state.instanceMenuMaxHeight, maxHeight: state.instanceMenuMaxHeight,
height: state.instanceMenuMaxHeight, height: state.instanceMenuMaxHeight,
overflow:'auto' overflow: 'auto'
}" class="el-scrollbar flex-auto"> }" class="el-scrollbar flex-auto">
<el-menu background-color="transparent" :collapse-transition="false"> <el-menu background-color="transparent" :collapse-transition="false">
<!-- 第一级：tag --> <!-- 第一级：tag -->
<el-sub-menu v-for="tag of instances.tags" :index="tag.tagPath" :key="tag.tagPath"> <el-sub-menu v-for="tag of instances.tags" :index="tag.tagPath" :key="tag.tagPath">
<template #title> <template #title>
<el-icon><FolderOpened color="#e6a23c"/></el-icon> <el-icon>
<span>{{ tag.tagPath }}</span> <FolderOpened color="#e6a23c" />
</template> </el-icon>
<!-- 第二级：数据库实例 --> <span>{{ tag.tagPath }}</span>
<el-sub-menu v-for="inst in instances.tree[tag.tagId]" </template>
:index="'mongo-instance-' + inst.id" <!-- 第二级：数据库实例 -->
:key="'mongo-instance-' + inst.id" <el-sub-menu v-for="inst in instances.tree[tag.tagId]" :index="'mongo-instance-' + inst.id"
@click.prevent="changeInstance(inst)" :key="'mongo-instance-' + inst.id" @click.prevent="changeInstance(inst)">
> <template #title>
<template #title> <el-popover placement="right-start" title="mongo数据库实例信息" trigger="hover" :width="210">
<el-popover <template #reference>
placement="right-start" <span>&nbsp;&nbsp;<el-icon>
title="mongo数据库实例信息" <MostlyCloudy color="#409eff" />
trigger="hover" </el-icon>{{ inst.name }}</span>
:width="210" </template>
> <template #default>
<template #reference> <el-form class="instances-pop-form" label-width="55px" :size="'small'">
<span>&nbsp;&nbsp;<el-icon><MostlyCloudy color="#409eff"/></el-icon>{{ inst.name }}</span> <el-form-item label="名称:">{{ inst.name }}</el-form-item>
</template> <el-form-item label="链接:">{{ inst.uri }}</el-form-item>
<template #default> </el-form>
<el-form class="instances-pop-form" label-width="55px" :size="'small'"> </template>
<el-form-item label="名称:">{{inst.name}}</el-form-item> </el-popover>
<el-form-item label="链接:">{{inst.uri}}</el-form-item> </template>
</el-form> <!-- 第三级：数据库 -->
</template> <el-sub-menu v-for="db in instances.dbs[inst.id]" :index="inst.id + db.Name"
</el-popover> :key="inst.id + db.Name" :class="state.nowSchema === (inst.id + db.Name) && 'checked'"
</template> @click.prevent="changeSchema(inst, db.Name)">
<!-- 第三级：数据库 --> <template #title>
<el-sub-menu v-for="db in instances.dbs[inst.id]" &nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
:index="inst.id + db.Name" <Coin color="#67c23a" />
:key="inst.id + db.Name" </el-icon>
:class="state.nowSchema === (inst.id+db.Name) && 'checked'" <span class="checked-schema">
@click.prevent="changeSchema(inst, db.Name)" {{ db.Name }}
> <span style="color: #8492a6;font-size: 13px">[{{
<template #title> formatByteSize(db.SizeOnDisk)
&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Coin color="#67c23a"/></el-icon> }}]</span>
<span class="checked-schema"> </span>
{{ db.Name }} </template>
<span style="color: #8492a6;font-size: 13px">[{{formatByteSize(db.SizeOnDisk)}}]</span> <!-- 第四级 01：表 -->
</span> <el-sub-menu :index="inst.id + db.Name + '-table'">
</template> <template #title>
<!-- 第四级 01：表 --> <div style="width: 100%" @click="loadTableNames(inst, db.Name)">
<el-sub-menu :index="inst.id + db.Name + '-table'" > &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
<template #title> <Calendar color="#409eff" />
<div style="width: 100%" @click="loadTableNames(inst, db.Name)"> </el-icon>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Calendar color="#409eff"/></el-icon> <span>集合</span>
<span>集合</span> <el-icon v-show="state.loading[inst.id + db.Name]" class="is-loading">
<el-icon v-show="state.loading[inst.id + db.Name]" class="is-loading"><Loading /></el-icon> <Loading />
</div> </el-icon>
</template> </div>
<el-menu-item :index="inst.id + db.Name + '-tableSearch'" </template>
:key="inst.id + db.Name + '-tableSearch'"> <el-menu-item :index="inst.id + db.Name + '-tableSearch'"
<template #title> :key="inst.id + db.Name + '-tableSearch'">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <template #title>
<el-input size="small" placeholder="过滤" clearable &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
@change="filterTableName(inst.id, db.Name)" <el-input size="small" placeholder="过滤" clearable
@keyup="e => filterTableName(inst.id, db.Name, e)" @change="filterTableName(inst.id, db.Name)"
v-model="state.filterParam[inst.id+db.Name]"/> @keyup="(e: any) => filterTableName(inst.id, db.Name, e)"
</template> v-model="state.filterParam[inst.id + db.Name]" />
</el-menu-item> </template>
</el-menu-item>
<template v-for="tb in instances.tables[inst.id+db.Name]" >
<el-menu-item :index="inst.id + db.Name + tb.tableName" <template v-for="tb in instances.tables[inst.id + db.Name]">
:key="inst.id + db.Name + tb.tableName" <el-menu-item :index="inst.id + db.Name + tb.tableName"
v-if="tb.show" :key="inst.id + db.Name + tb.tableName" v-if="tb.show"
@click="loadTableData(inst, db.Name, tb.tableName)" @click="loadTableData(inst, db.Name, tb.tableName)">
> <template #title>
<template #title> <div style="width: 100%">
<div style="width: 100%" > &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-icon><Calendar color="#409eff"/></el-icon> <Calendar color="#409eff" />
<span :title="tb.tableComment||''">{{tb.tableName}}</span> </el-icon>
</div> <span :title="tb.tableComment || ''">{{ tb.tableName }}</span>
</template> </div>
</el-menu-item> </template>
</template> </el-menu-item>
</el-sub-menu> </template>
</el-sub-menu> </el-sub-menu>
</el-sub-menu> </el-sub-menu>
</el-sub-menu> </el-sub-menu>
</el-menu> </el-sub-menu>
</el-col> </el-menu>
</el-row> </el-col>
</div> </el-row>
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {onBeforeMount, reactive} from 'vue'; import { onBeforeMount, reactive } from 'vue';
import {formatByteSize} from '@/common/utils/format'; import { formatByteSize } from '@/common/utils/format';
const props = defineProps({ const props = defineProps({
instances: { instances: {
type: Object, required: true type: Object, required: true
}, },
}) })
const emits = defineEmits(['initLoadInstances','changeInstance','loadTableNames','loadTableData','changeSchema']) const emits = defineEmits(['initLoadInstances', 'changeInstance', 'loadTableNames', 'loadTableData', 'changeSchema'])
onBeforeMount(async ()=>{ onBeforeMount(async () => {
await initLoadInstances() await initLoadInstances()
setHeight() setHeight()
}) })
const setHeight = () => { const setHeight = () => {
state.instanceMenuMaxHeight = window.innerHeight - 140 + 'px'; state.instanceMenuMaxHeight = window.innerHeight - 140 + 'px';
} }
const state = reactive({ const state = reactive({
instanceMenuMaxHeight: '800px', instanceMenuMaxHeight: '800px',
nowSchema: '', nowSchema: '',
filterParam: {}, filterParam: {},
loading: {}, loading: {},
}) })
/** /**
* 初始化加载实例数据 * 初始化加载实例数据
*/ */
const initLoadInstances = () => { const initLoadInstances = () => {
emits('initLoadInstances') emits('initLoadInstances')
} }
/** /**
* 改变选中的数据库实例 * 改变选中的数据库实例
* @param inst 选中的实例对象 * @param inst 选中的实例对象
*/ */
const changeInstance = (inst : any) => { const changeInstance = (inst: any) => {
emits('changeInstance', inst) emits('changeInstance', inst)
} }
/** /**
* 改变选中的数据库schema * 改变选中的数据库schema
* @param inst 选中的实例对象 * @param inst 选中的实例对象
* @param schema 选中的数据库schema * @param schema 选中的数据库schema
*/ */
const changeSchema = (inst : any, schema: string) => { const changeSchema = (inst: any, schema: string) => {
state.nowSchema = inst.id + schema state.nowSchema = inst.id + schema
emits('changeSchema', inst, schema) emits('changeSchema', inst, schema)
} }
/** /**
* 加载schema下所有表 * 加载schema下所有表
@@ -154,10 +155,10 @@ const changeSchema = (inst : any, schema: string) => {
* @param schema database名 * @param schema database名
*/ */
const loadTableNames = async (inst: any, schema: string) => { const loadTableNames = async (inst: any, schema: string) => {
state.loading[inst.id+schema] = true state.loading[inst.id + schema] = true
await emits('loadTableNames', inst, schema, ()=>{ await emits('loadTableNames', inst, schema, () => {
state.loading[inst.id+schema] = false state.loading[inst.id + schema] = false
}) })
} }
/** /**
* 加载选中表数据 * 加载选中表数据
@@ -166,60 +167,67 @@ const loadTableNames = async (inst: any, schema: string) => {
* @param tableName 表名 * @param tableName 表名
*/ */
const loadTableData = (inst: any, schema: string, tableName: string) => { const loadTableData = (inst: any, schema: string, tableName: string) => {
emits('loadTableData', inst, schema, tableName) emits('loadTableData', inst, schema, tableName)
} }
const filterTableName = (instId: number, schema: string, event?: any) => { const filterTableName = (instId: number, schema: string, event?: any) => {
if(event){ if (event) {
state.filterParam[instId+schema] = event.target.value state.filterParam[instId + schema] = event.target.value
} }
let param = state.filterParam[instId+schema] as string let param = state.filterParam[instId + schema] as string
param = param?.replace('/','\/') param = param?.replace('/', '\/')
const key = instId + schema; const key = instId + schema;
props.instances.tables[key].forEach((a:any) =>{ props.instances.tables[key].forEach((a: any) => {
a.show = param?eval('/'+param.split('').join('[_\w]*')+'[_\w]*/ig').test(a.tableName):true a.show = param ? eval('/' + param.split('').join('[_\w]*') + '[_\w]*/ig').test(a.tableName) : true
}) })
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.instances-box { .instances-box {
.el-menu{ .el-menu {
width: 275px; width: 100%;
} }
.el-sub-menu{
.checked{ .el-sub-menu {
.checked-schema{ .checked {
color: var(--el-color-primary); .checked-schema {
} color: var(--el-color-primary);
}
}
}
.el-sub-menu__title {
padding-left: 0 !important;
height: 30px !important;
line-height: 30px !important;
}
.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-sub-menu__title {
padding-right: 10px;
}
.el-menu-item {
padding-left: 0 !important;
height: 20px !important;
line-height: 20px !important;
}
.el-icon {
margin: 0;
}
.el-sub-menu__icon-arrow {
top: inherit;
right: 10px;
} }
}
.el-sub-menu__title{
padding-left: 0 !important;
height: 30px !important;
line-height: 30px !important;
}
.el-menu--vertical:not(.el-menu--collapse):not(.el-menu--popup-container) .el-sub-menu__title{
padding-right: 10px;
}
.el-menu-item{
padding-left: 0 !important;
height: 20px !important;
line-height: 20px !important;
}
.el-icon{
margin: 0;
}
.el-sub-menu__icon-arrow{
top:inherit;
right: 10px;
}
} }
.instances-pop-form{
.el-form-item{ .instances-pop-form {
margin-bottom: unset; .el-form-item {
} margin-bottom: unset;
}
} }
</style> </style>

1
mayfly_go_web/src/views/ops/redis/ListValue.vue
View File

@@ -122,7 +122,6 @@ const cancel = () => {
watch(props, async (newValue: any) => { watch(props, async (newValue: any) => {
state.dialogVisible = newValue.visible; state.dialogVisible = newValue.visible;
state.key = newValue.key;
state.redisId = newValue.redisId; state.redisId = newValue.redisId;
state.db = newValue.db; state.db = newValue.db;
state.key = newValue.keyInfo; state.key = newValue.keyInfo;

1
mayfly_go_web/src/views/ops/redis/SetValue.vue
View File

@@ -106,7 +106,6 @@ const cancel = () => {
watch(props, async (newValue: any) => { watch(props, async (newValue: any) => {
state.dialogVisible = newValue.visible; state.dialogVisible = newValue.visible;
state.key = newValue.key;
state.redisId = newValue.redisId; state.redisId = newValue.redisId;
state.db = newValue.db; state.db = newValue.db;
state.key = newValue.keyInfo; state.key = newValue.keyInfo;

1
mayfly_go_web/src/views/ops/redis/StringValue.vue
View File

@@ -120,7 +120,6 @@ watch(
watch(props, async (newValue: any) => { watch(props, async (newValue: any) => {
state.dialogVisible = newValue.visible; state.dialogVisible = newValue.visible;
state.key = newValue.key;
state.redisId = newValue.redisId; state.redisId = newValue.redisId;
state.db = newValue.db; state.db = newValue.db;
state.key = newValue.keyInfo; state.key = newValue.keyInfo;

50
mayfly_go_web/yarn.lock
View File

@@ -772,10 +772,10 @@ echarts@^5.4.0:
tslib "2.3.0" tslib "2.3.0"
zrender "5.4.0" zrender "5.4.0"
element-plus@^2.2.26: element-plus@^2.2.29:
version "2.2.26" version "2.2.29"
resolved "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.26.tgz#5e46aa5d8127786bb158713957f8a253b35bf019" resolved "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.29.tgz#7dd72f9cafdc102ae3f9e4efe612e403ef713a74"
integrity sha512-O/rdY5m9DkclpVg8r3GynyqCunm7MxSR142xSsjrZA77bi7bcwA3SIy6SPEDqHi5R4KqgkGYgKSp4Q4e3irbYg== integrity sha512-g4dcrURrKkR5uUX8n5RVnnqGnimoki9HfqS4yHHG6XwCHBkZGozdq4x+478BzeWUe31h++BO+7dakSx4VnM8RQ==
dependencies: dependencies:
"@ctrl/tinycolor" "^3.4.1" "@ctrl/tinycolor" "^3.4.1"
"@element-plus/icons-vue" "^2.0.6" "@element-plus/icons-vue" "^2.0.6"
@@ -800,7 +800,7 @@ enquirer@^2.3.5:
dependencies: dependencies:
ansi-colors "^4.1.1" ansi-colors "^4.1.1"
esbuild@^0.16.3: esbuild@^0.16.14:
version "0.16.17" version "0.16.17"
resolved "https://registry.npmmirror.com/esbuild/-/esbuild-0.16.17.tgz#fc2c3914c57ee750635fee71b89f615f25065259" resolved "https://registry.npmmirror.com/esbuild/-/esbuild-0.16.17.tgz#fc2c3914c57ee750635fee71b89f615f25065259"
integrity sha512-G8LEkV0XzDMNwXKgM0Jwu3nY3lSTwSGY6XbxM9cr9+s0T/qSV1q1JVPBGzm3dcjhCic9+emZDmMffkwgPeOeLg== integrity sha512-G8LEkV0XzDMNwXKgM0Jwu3nY3lSTwSGY6XbxM9cr9+s0T/qSV1q1JVPBGzm3dcjhCic9+emZDmMffkwgPeOeLg==
@@ -1451,7 +1451,7 @@ postcss@^8.1.10:
picocolors "^1.0.0" picocolors "^1.0.0"
source-map-js "^1.0.1" source-map-js "^1.0.1"
postcss@^8.4.20: postcss@^8.4.21:
version "8.4.21" version "8.4.21"
resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4" resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg== integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
@@ -1533,10 +1533,10 @@ rimraf@^3.0.2:
dependencies: dependencies:
glob "^7.1.3" glob "^7.1.3"
rollup@^3.7.0: rollup@^3.10.0:
version "3.10.0" version "3.12.1"
resolved "https://registry.npmmirror.com/rollup/-/rollup-3.10.0.tgz#6eb19196d8b3b375ca651cb78261faac48e24cd6" resolved "https://registry.npmmirror.com/rollup/-/rollup-3.12.1.tgz#2975b97713e4af98c15e7024b88292d7fddb3853"
integrity sha512-JmRYz44NjC1MjVF2VKxc0M1a97vn+cDxeqWmnwyAF4FvpjK8YFdHpaqvQB+3IxCvX05vJxKZkoMDU8TShhmJVA== integrity sha512-t9elERrz2i4UU9z7AwISj3CQcXP39cWxgRWLdf4Tm6aKm1eYrqHIgjzXBgb67GNY1sZckTFFi0oMozh3/S++Ig==
optionalDependencies: optionalDependencies:
fsevents "~2.3.2" fsevents "~2.3.2"
@@ -1547,18 +1547,18 @@ run-parallel@^1.1.9:
dependencies: dependencies:
queue-microtask "^1.2.2" queue-microtask "^1.2.2"
sass-loader@^12.4.0: sass-loader@^13.2.0:
version "12.4.0" version "13.2.0"
resolved "https://registry.npmmirror.com/sass-loader/download/sass-loader-12.4.0.tgz" resolved "https://registry.npmmirror.com/sass-loader/-/sass-loader-13.2.0.tgz#80195050f58c9aac63b792fa52acb6f5e0f6bdc3"
integrity sha512-7xN+8khDIzym1oL9XyS6zP6Ges+Bo2B2xbPrjdMHEYyV3AQYhd/wXeru++3ODHF0zMjYmVadblSKrPrjEkL8mg== integrity sha512-JWEp48djQA4nbZxmgC02/Wh0eroSUutulROUusYJO9P9zltRbNN80JCBHqRGzjd4cmZCa/r88xgfkjGD0TXsHg==
dependencies: dependencies:
klona "^2.0.4" klona "^2.0.4"
neo-async "^2.6.2" neo-async "^2.6.2"
sass@^1.45.1: sass@^1.58.0:
version "1.48.0" version "1.58.0"
resolved "https://registry.npmmirror.com/sass/download/sass-1.48.0.tgz" resolved "https://registry.npmmirror.com/sass/-/sass-1.58.0.tgz#ee8aea3ad5ea5c485c26b3096e2df6087d0bb1cc"
integrity sha512-hQi5g4DcfjcipotoHZ80l7GNJHGqQS5LwMBjVYB/TaT0vcSSpbgM8Ad7cgfsB2M0MinbkEQQPO9+sjjSiwxqmw== integrity sha512-PiMJcP33DdKtZ/1jSjjqVIKihoDc6yWmYr9K/4r3fVVIEDAluD0q7XZiRKrNJcPK3qkLRF/79DND1H5q1LBjgg==
dependencies: dependencies:
chokidar ">=3.0.0 <4.0.0" chokidar ">=3.0.0 <4.0.0"
immutable "^4.0.0" immutable "^4.0.0"
@@ -1724,15 +1724,15 @@ v8-compile-cache@^2.0.3:
resolved "https://registry.nlark.com/v8-compile-cache/download/v8-compile-cache-2.3.0.tgz" resolved "https://registry.nlark.com/v8-compile-cache/download/v8-compile-cache-2.3.0.tgz"
integrity sha1-LeGWGMZtwkfc+2+ZM4A12CRaLO4= integrity sha1-LeGWGMZtwkfc+2+ZM4A12CRaLO4=
vite@^4.0.4: vite@^4.1.1:
version "4.0.4" version "4.1.1"
resolved "https://registry.npmmirror.com/vite/-/vite-4.0.4.tgz#4612ce0b47bbb233a887a54a4ae0c6e240a0da31" resolved "https://registry.npmmirror.com/vite/-/vite-4.1.1.tgz#3b18b81a4e85ce3df5cbdbf4c687d93ebf402e6b"
integrity sha512-xevPU7M8FU0i/80DMR+YhgrzR5KS2ORy1B4xcX/cXLsvnUWvfHuqMmVU6N0YiJ4JWGRJJsLCgjEzKjG9/GKoSw== integrity sha512-LM9WWea8vsxhr782r9ntg+bhSFS06FJgCvvB0+8hf8UWtvaiDagKYWXndjfX6kGl74keHJUcpzrQliDXZlF5yg==
dependencies: dependencies:
esbuild "^0.16.3" esbuild "^0.16.14"
postcss "^8.4.20" postcss "^8.4.21"
resolve "^1.22.1" resolve "^1.22.1"
rollup "^3.7.0" rollup "^3.10.0"
optionalDependencies: optionalDependencies:
fsevents "~2.3.2" fsevents "~2.3.2"

2
server/config.yml
View File

@@ -21,7 +21,7 @@ mysql:
host: localhost:3306 host: localhost:3306
username: root username: root
password: 111049 password: 111049
db-name: mayfly-go db-name: mayfly_go
config: charset=utf8&loc=Local&parseTime=true config: charset=utf8&loc=Local&parseTime=true
max-idle-conns: 5 max-idle-conns: 5
# 若同时部署多台机器，则需要配置redis信息用于缓存权限码、验证码、公私钥等 # 若同时部署多台机器，则需要配置redis信息用于缓存权限码、验证码、公私钥等

2
server/go.mod
View File

@@ -1,6 +1,6 @@
module mayfly-go module mayfly-go
go 1.19 go 1.20
require ( require (
github.com/gin-gonic/gin v1.8.2 github.com/gin-gonic/gin v1.8.2

1
server/initialize/router.go
View File

@@ -74,7 +74,6 @@ func InitRouter() *gin.Engine {
sys_router.Init(api) sys_router.Init(api)
// project_router.Init(api)
tag_router.Init(api) tag_router.Init(api)
machine_router.Init(api) machine_router.Init(api)
db_router.Init(api) db_router.Init(api)

2
server/internal/db/application/db.go
View File

@@ -461,7 +461,7 @@ func valueConvert(data []byte, colType *sql.ColumnType) interface{} {
return intV return intV
} }
} }
if strings.Contains(colScanType, "float") { if strings.Contains(colScanType, "float") || strings.Contains(colDatabaseTypeName, "decimal") {
floatV, _ := strconv.ParseFloat(stringV, 64) floatV, _ := strconv.ParseFloat(stringV, 64)
return floatV return floatV
} }

15
server/pkg/starter/gorm.go
View File

@@ -1,8 +1,11 @@
package starter package starter
import ( import (
"log"
"mayfly-go/pkg/config" "mayfly-go/pkg/config"
"mayfly-go/pkg/global" "mayfly-go/pkg/global"
"os"
"time"
"gorm.io/driver/mysql" "gorm.io/driver/mysql"
"gorm.io/gorm" "gorm.io/gorm"
@@ -30,10 +33,20 @@ func gormMysql() *gorm.DB {
SkipInitializeWithVersion: false, // 根据版本自动配置 SkipInitializeWithVersion: false, // 根据版本自动配置
} }
gormLogger := logger.New(
log.New(os.Stdout, "\r\n", log.LstdFlags), // io writer（日志输出的目标，前缀和日志包含的内容——译者注）
logger.Config{
SlowThreshold: time.Second, // 慢 SQL 阈值
LogLevel: logger.Error, // 日志级别, 改为logger.Info即可显示sql语句
IgnoreRecordNotFoundError: true, // 忽略ErrRecordNotFound（记录未找到）错误
Colorful: true, // 禁用彩色打印
},
)
ormConfig := &gorm.Config{NamingStrategy: schema.NamingStrategy{ ormConfig := &gorm.Config{NamingStrategy: schema.NamingStrategy{
TablePrefix: "t_", TablePrefix: "t_",
SingularTable: true, SingularTable: true,
}, Logger: logger.Default.LogMode(logger.Error)} // 改为logger.Info即可显示sql语句 }, Logger: gormLogger}
if db, err := gorm.Open(mysql.New(mysqlConfig), ormConfig); err != nil { if db, err := gorm.Open(mysql.New(mysqlConfig), ormConfig); err != nil {
global.Log.Panicf("连接mysql失败! [%s]", err.Error()) global.Log.Panicf("连接mysql失败! [%s]", err.Error())