mirror of
				https://gitee.com/dromara/mayfly-go
				synced 2025-11-04 08:20:25 +08:00 
			
		
		
		
	feat: 小功能优化
This commit is contained in:
		@@ -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": [
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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'
 | 
				
			||||||
 
 | 
				
			|||||||
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							@@ -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>  <el-icon>
 | 
				
			||||||
                    :width="210"
 | 
					                                                <MostlyCloudy color="#409eff" />
 | 
				
			||||||
                >
 | 
					                                            </el-icon>{{ inst.name }}</span>
 | 
				
			||||||
                  <template #reference>
 | 
					                                    </template>
 | 
				
			||||||
                    <span>  <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)"
 | 
					                                        <el-icon>
 | 
				
			||||||
              >
 | 
					                                        <Coin color="#67c23a" />
 | 
				
			||||||
                <template #title>
 | 
					                                    </el-icon>
 | 
				
			||||||
                      <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)">
 | 
					                                                  <el-icon>
 | 
				
			||||||
                            <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>
 | 
				
			||||||
                              
 | 
					                                    <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)"
 | 
					                                                    
 | 
				
			||||||
                                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>
 | 
				
			||||||
 | 
					                                    </el-menu-item>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                  <template v-for="tb in instances.tables[inst.id+schema]" >
 | 
					                                    <template v-for="tb in instances.tables[inst.id + schema]">
 | 
				
			||||||
                    <el-menu-item :index="inst.id + schema + tb.tableName"
 | 
					                                        <el-menu-item :index="inst.id + schema + tb.tableName"
 | 
				
			||||||
                                  :key="inst.id + schema + tb.tableName"
 | 
					                                            :key="inst.id + schema + tb.tableName" v-if="tb.show"
 | 
				
			||||||
                                  v-if="tb.show"
 | 
					                                            @click="loadTableData(inst, schema, tb.tableName)">
 | 
				
			||||||
                                  @click="loadTableData(inst, schema, tb.tableName)"
 | 
					                                            <template #title>
 | 
				
			||||||
                    >
 | 
					                                                <div style="width: 100%">
 | 
				
			||||||
                      <template #title>
 | 
					                                                           <el-icon>
 | 
				
			||||||
                        <div style="width: 100%" >
 | 
					                                                        <Calendar color="#409eff" />
 | 
				
			||||||
                                 <el-icon><Calendar color="#409eff"/></el-icon>
 | 
					                                                    </el-icon>
 | 
				
			||||||
                          <span :title="tb.tableComment||''">{{tb.tableName}}</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>
 | 
				
			||||||
                <!-- 第四级 02:sql -->
 | 
					                                            </template>
 | 
				
			||||||
                <el-sub-menu :index="inst.id + schema + '-sql'">
 | 
					                                        </el-menu-item>
 | 
				
			||||||
                  <template #title>
 | 
					                                    </template>
 | 
				
			||||||
                          <el-icon><List color="#f56c6c"/></el-icon>
 | 
					                                </el-sub-menu>
 | 
				
			||||||
                    <span>sql</span>
 | 
					                                <!-- 第四级 02:sql -->
 | 
				
			||||||
                  </template>
 | 
					                                <el-sub-menu :index="inst.id + schema + '-sql'">
 | 
				
			||||||
 | 
					                                    <template #title>
 | 
				
			||||||
 | 
					                                              <el-icon>
 | 
				
			||||||
 | 
					                                            <List color="#f56c6c" />
 | 
				
			||||||
 | 
					                                        </el-icon>
 | 
				
			||||||
 | 
					                                        <span>sql</span>
 | 
				
			||||||
 | 
					                                    </template>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                  <template v-for="sql in instances.sqls[inst.id+schema]" >
 | 
					                                    <template v-for="sql in instances.sqls[inst.id + schema]">
 | 
				
			||||||
                    <el-menu-item :index="inst.id + schema + sql.name"
 | 
					                                        <el-menu-item :index="inst.id + schema + sql.name"
 | 
				
			||||||
                                  :key="inst.id + schema + sql.name"
 | 
					                                            :key="inst.id + schema + sql.name" v-if="sql.show"
 | 
				
			||||||
                                  v-if="sql.show"
 | 
					                                            @click="loadSql(inst, schema, sql.name)">
 | 
				
			||||||
                                  @click="loadSql(inst, schema, sql.name)"
 | 
					                                            <template #title>
 | 
				
			||||||
                    >
 | 
					                                                <div style="width: 100%">
 | 
				
			||||||
                      <template #title>
 | 
					                                                           <el-icon>
 | 
				
			||||||
                        <div style="width: 100%" >
 | 
					                                                        <Calendar color="#409eff" />
 | 
				
			||||||
                                 <el-icon><Calendar color="#409eff"/></el-icon>
 | 
					                                                    </el-icon>
 | 
				
			||||||
                          <span>{{sql.name}}</span>
 | 
					                                                    <span>{{ sql.name }}</span>
 | 
				
			||||||
                        </div>
 | 
					                                                </div>
 | 
				
			||||||
                      </template>
 | 
					                                            </template>
 | 
				
			||||||
                    </el-menu-item>
 | 
					                                        </el-menu-item>
 | 
				
			||||||
                  </template>
 | 
					                                    </template>
 | 
				
			||||||
                </el-sub-menu>
 | 
					                                </el-sub-menu>
 | 
				
			||||||
              </el-sub-menu>
 | 
					                            </el-sub-menu>
 | 
				
			||||||
            </el-sub-menu>
 | 
					                        </el-sub-menu>
 | 
				
			||||||
          </el-sub-menu>
 | 
					                    </el-sub-menu>
 | 
				
			||||||
        </el-menu>
 | 
					                </el-menu>
 | 
				
			||||||
      </el-col>
 | 
					            </el-col>
 | 
				
			||||||
    </el-row>
 | 
					        </el-row>
 | 
				
			||||||
  </div>
 | 
					    </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>
 | 
				
			||||||
@@ -1,127 +1,128 @@
 | 
				
			|||||||
<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>  <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>  <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]" 
 | 
					                                        <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)
 | 
				
			||||||
                      <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'" >
 | 
					                                                  <el-icon>
 | 
				
			||||||
                  <template #title>
 | 
					                                                <Calendar color="#409eff" />
 | 
				
			||||||
                    <div style="width: 100%" @click="loadTableNames(inst, db.Name)">
 | 
					                                            </el-icon>
 | 
				
			||||||
                            <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'">
 | 
				
			||||||
                              
 | 
					                                        <template #title>
 | 
				
			||||||
                      <el-input size="small" placeholder="过滤" clearable
 | 
					                                                    
 | 
				
			||||||
                                @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]" >
 | 
					                                    <template v-for="tb in instances.tables[inst.id + db.Name]">
 | 
				
			||||||
                    <el-menu-item :index="inst.id + db.Name + tb.tableName"
 | 
					                                        <el-menu-item :index="inst.id + db.Name + tb.tableName"
 | 
				
			||||||
                                  :key="inst.id + db.Name + tb.tableName"
 | 
					                                            :key="inst.id + db.Name + tb.tableName" v-if="tb.show"
 | 
				
			||||||
                                  v-if="tb.show"
 | 
					                                            @click="loadTableData(inst, db.Name, tb.tableName)">
 | 
				
			||||||
                                  @click="loadTableData(inst, db.Name, tb.tableName)"
 | 
					                                            <template #title>
 | 
				
			||||||
                    >
 | 
					                                                <div style="width: 100%">
 | 
				
			||||||
                      <template #title>
 | 
					                                                           <el-icon>
 | 
				
			||||||
                        <div style="width: 100%" >
 | 
					                                                        <Calendar color="#409eff" />
 | 
				
			||||||
                                 <el-icon><Calendar color="#409eff"/></el-icon>
 | 
					                                                    </el-icon>
 | 
				
			||||||
                          <span :title="tb.tableComment||''">{{tb.tableName}}</span>
 | 
					                                                    <span :title="tb.tableComment || ''">{{ tb.tableName }}</span>
 | 
				
			||||||
                        </div>
 | 
					                                                </div>
 | 
				
			||||||
                      </template>
 | 
					                                            </template>
 | 
				
			||||||
                    </el-menu-item>
 | 
					                                        </el-menu-item>
 | 
				
			||||||
                  </template>
 | 
					                                    </template>
 | 
				
			||||||
                </el-sub-menu>
 | 
					                                </el-sub-menu>
 | 
				
			||||||
              </el-sub-menu>
 | 
					                            </el-sub-menu>
 | 
				
			||||||
            </el-sub-menu>
 | 
					                        </el-sub-menu>
 | 
				
			||||||
          </el-sub-menu>
 | 
					                    </el-sub-menu>
 | 
				
			||||||
        </el-menu>
 | 
					                </el-menu>
 | 
				
			||||||
      </el-col>
 | 
					            </el-col>
 | 
				
			||||||
    </el-row>
 | 
					        </el-row>
 | 
				
			||||||
  </div>
 | 
					    </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: {},
 | 
				
			||||||
 | 
					
 | 
				
			||||||
})
 | 
					})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -129,24 +130,24 @@ const state = reactive({
 | 
				
			|||||||
 * 初始化加载实例数据
 | 
					 * 初始化加载实例数据
 | 
				
			||||||
 */
 | 
					 */
 | 
				
			||||||
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>
 | 
				
			||||||
@@ -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;
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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;
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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;
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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信息用于缓存权限码、验证码、公私钥等
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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)
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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())
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user