mirror of
https://gitee.com/dromara/mayfly-go
synced 2025-11-03 07:50:25 +08:00
refactor: code optimization
This commit is contained in:
@@ -56,11 +56,11 @@
|
||||
"autoprefixer": "^10.4.21",
|
||||
"code-inspector-plugin": "^0.20.9",
|
||||
"dotenv": "^16.3.1",
|
||||
"eslint": "^9.24.0",
|
||||
"eslint": "^9.25.1",
|
||||
"eslint-plugin-vue": "^10.0.0",
|
||||
"postcss": "^8.5.3",
|
||||
"prettier": "^3.5.3",
|
||||
"sass": "^1.86.3",
|
||||
"sass": "^1.87.0",
|
||||
"tailwindcss": "^4.1.4",
|
||||
"typescript": "^5.8.2",
|
||||
"vite": "^6.3.2",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-config-provider :size="getGlobalComponentSize" :locale="getGlobalI18n">
|
||||
<div class="!h-full">
|
||||
<div class="h-full">
|
||||
<el-watermark
|
||||
:zIndex="10000000"
|
||||
:width="210"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<el-container class="layout-container flex-center">
|
||||
<Header />
|
||||
<el-container class="layout-mian-height-50">
|
||||
<el-container class="h-[calc(100vh-50px)]">
|
||||
<Aside />
|
||||
<div class="flex-center layout-backtop">
|
||||
<TagsView v-if="themeConfig.isTagsview" />
|
||||
|
||||
@@ -5,10 +5,8 @@
|
||||
<Aside />
|
||||
<el-container class="flex-center layout-backtop">
|
||||
<Header v-if="isFixedHeader" />
|
||||
<!-- <el-scrollbar> -->
|
||||
<Header v-if="!isFixedHeader" />
|
||||
<Main />
|
||||
<!-- </el-scrollbar> -->
|
||||
</el-container>
|
||||
</div>
|
||||
<el-backtop target=".layout-backtop .el-scrollbar__wrap"></el-backtop>
|
||||
|
||||
@@ -3,10 +3,8 @@
|
||||
<Aside />
|
||||
<el-container class="flex-center layout-backtop">
|
||||
<Header v-if="isFixedHeader" />
|
||||
<!-- <el-scrollbar view-class="!h-full" ref="layoutDefaultsScrollbarRef"> -->
|
||||
<Header v-if="!isFixedHeader" />
|
||||
<Main />
|
||||
<!-- </el-scrollbar> -->
|
||||
</el-container>
|
||||
<el-backtop target=".layout-backtop .el-scrollbar__wrap"></el-backtop>
|
||||
</el-container>
|
||||
|
||||
@@ -34,13 +34,14 @@ body,
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
background-color: var(--bg-main-color);
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
// overflow: hidden;
|
||||
// position: relative;
|
||||
}
|
||||
|
||||
/* 主布局样式
|
||||
------------------------------- */
|
||||
.layout-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@@ -102,10 +103,6 @@ body,
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.layout-mian-height-50 {
|
||||
height: calc(100vh - 50px);
|
||||
}
|
||||
|
||||
.layout-columns-warp {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
@@ -259,16 +256,6 @@ body,
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 元素无法被选择 */
|
||||
.none-select {
|
||||
moz-user-select: -moz-none;
|
||||
-moz-user-select: none;
|
||||
-o-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* custom card */
|
||||
.card {
|
||||
|
||||
@@ -7,13 +7,13 @@
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button v-auth="'authcert:save'" @click="edit(scope.row, scope.$index)" type="primary" icon="edit" link></el-button>
|
||||
<el-button class="ml-0.5" v-auth="'authcert:del'" type="danger" @click="deleteRow(scope.$index)" icon="delete" link></el-button>
|
||||
<el-button class="!ml-0.5" v-auth="'authcert:del'" type="danger" @click="deleteRow(scope.$index)" icon="delete" link></el-button>
|
||||
|
||||
<el-button
|
||||
:title="$t('ac.testConn')"
|
||||
:loading="props.testConnBtnLoading && scope.$index == state.idx"
|
||||
:disabled="props.testConnBtnLoading"
|
||||
class="ml-0.5"
|
||||
class="!ml-0.5"
|
||||
type="success"
|
||||
@click="testConn(scope.row, scope.$index)"
|
||||
icon="Link"
|
||||
|
||||
@@ -22,8 +22,8 @@
|
||||
<span
|
||||
:id="node.key"
|
||||
@dblclick="treeNodeDblclick(data, node)"
|
||||
class="node-container flex items-center w-full cursor-pointer none-select"
|
||||
:class="data.type.nodeDblclickFunc ? 'none-select' : ''"
|
||||
class="node-container flex items-center w-full cursor-pointer select-none"
|
||||
:class="data.type.nodeDblclickFunc ? 'select-none' : ''"
|
||||
>
|
||||
<span v-if="data.type.value == TagTreeNode.TagPath">
|
||||
<tag-info :tag-path="data.label" />
|
||||
|
||||
@@ -324,7 +324,7 @@ const columns = [
|
||||
TableColumn.new('fs', 'machine.fs').isSlot().setAddWidth(25),
|
||||
TableColumn.new('remark', 'common.remark'),
|
||||
TableColumn.new('code', 'common.code'),
|
||||
TableColumn.new('action', 'common.operation').isSlot().setMinWidth(258).fixedRight().alignCenter(),
|
||||
TableColumn.new('action', 'common.operation').isSlot().setMinWidth(258).fixedRight().alignCenter().noShowOverflowTooltip(),
|
||||
];
|
||||
|
||||
// 该用户拥有的的操作列按钮权限,使用v-if进行判断,v-auth对el-dropdown-item无效
|
||||
|
||||
@@ -1,17 +1,19 @@
|
||||
<template>
|
||||
<div class="tag-tree-list card">
|
||||
<div class="tag-tree-list card h-full flex">
|
||||
<Splitpanes class="default-theme">
|
||||
<Pane size="30" min-size="25" max-size="35">
|
||||
<div class="card !p-1 !mb-1 !mr-1">
|
||||
<el-input v-model="filterTag" clearable :placeholder="$t('tag.nameFilterPlaceholder')" style="width: 200px; margin-right: 10px" />
|
||||
<el-button
|
||||
v-if="useUserInfo().userInfo.username == 'admin'"
|
||||
v-auth="'tag:save'"
|
||||
type="primary"
|
||||
icon="plus"
|
||||
@click="showSaveTagDialog(null)"
|
||||
></el-button>
|
||||
<div class="float-right">
|
||||
<Pane size="30" min-size="25" max-size="35" class="flex flex-col flex-1">
|
||||
<div class="card !p-1 !mb-1 !mr-1 flex justify-between">
|
||||
<div class="mb-1">
|
||||
<el-input v-model="filterTag" clearable :placeholder="$t('tag.nameFilterPlaceholder')" class="mr-2 !w-[200px]" />
|
||||
<el-button
|
||||
v-if="useUserInfo().userInfo.username == 'admin'"
|
||||
v-auth="'tag:save'"
|
||||
type="primary"
|
||||
icon="plus"
|
||||
@click="showSaveTagDialog(null)"
|
||||
></el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('tag.tagTips1') }}
|
||||
@@ -19,11 +21,7 @@
|
||||
{{ $t('tag.tagTips2') }} <br />
|
||||
{{ $t('tag.tagTips3') }}
|
||||
</template>
|
||||
<span>
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</span>
|
||||
<SvgIcon name="question-filled" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
@@ -67,8 +65,8 @@
|
||||
</Pane>
|
||||
|
||||
<Pane min-size="40" size="70">
|
||||
<div class="ml-2">
|
||||
<el-tabs @tab-change="tabChange" v-model="state.activeTabName" v-if="currentTag">
|
||||
<div class="ml-2 h-full">
|
||||
<el-tabs class="h-full" @tab-change="tabChange" v-model="state.activeTabName" v-if="currentTag">
|
||||
<el-tab-pane :label="$t('common.detail')" :name="TagDetail">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item :label="$t('common.type')">
|
||||
@@ -91,6 +89,7 @@
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane
|
||||
class="h-full"
|
||||
:disabled="currentTag.type != TagResourceTypeEnum.Tag.value"
|
||||
:label="`${$t('tag.machine')} (${resourceCount.machine || 0})`"
|
||||
:name="MachineTag"
|
||||
@@ -99,6 +98,7 @@
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane
|
||||
class="h-full"
|
||||
:disabled="currentTag.type != TagResourceTypeEnum.Tag.value"
|
||||
:label="`${$t('tag.db')} (${resourceCount.db || 0})`"
|
||||
:name="DbTag"
|
||||
@@ -107,6 +107,7 @@
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane
|
||||
class="h-full"
|
||||
:disabled="currentTag.type != TagResourceTypeEnum.Tag.value"
|
||||
:label="`Redis (${resourceCount.redis || 0})`"
|
||||
:name="RedisTag"
|
||||
@@ -115,6 +116,7 @@
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane
|
||||
class="h-full"
|
||||
:disabled="currentTag.type != TagResourceTypeEnum.Tag.value"
|
||||
:label="`Mongo (${resourceCount.mongo || 0})`"
|
||||
:name="MongoTag"
|
||||
@@ -490,17 +492,10 @@ const removeDeafultExpandId = (id: any) => {
|
||||
<style lang="scss">
|
||||
.tag-tree-list {
|
||||
.tag-tree-data {
|
||||
height: calc(100vh - 202px);
|
||||
|
||||
.el-tree-node__content {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
display: inline-block;
|
||||
min-width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,24 +1,23 @@
|
||||
<template>
|
||||
<div class="card system-resouce-list">
|
||||
<div class="card system-resource-list h-full flex">
|
||||
<Splitpanes class="default-theme">
|
||||
<Pane size="25" min-size="20" max-size="30">
|
||||
<div class="card !p-1 mr-1">
|
||||
<el-input v-model="filterResource" clearable :placeholder="$t('system.menu.filterPlaceholder')" style="width: 200px; margin-right: 10px" />
|
||||
<el-button v-auth="perms.addResource" type="primary" icon="plus" @click="addResource(false)"></el-button>
|
||||
<Pane size="30" min-size="25" max-size="35" class="flex flex-col flex-1">
|
||||
<div class="card !p-1 mr-1 flex justify-between">
|
||||
<div class="mb-1">
|
||||
<el-input v-model="filterResource" clearable :placeholder="$t('system.menu.filterPlaceholder')" class="mr-2 !w-[200px]" />
|
||||
<el-button v-auth="perms.addResource" type="primary" icon="plus" @click="addResource(false)"></el-button>
|
||||
</div>
|
||||
|
||||
<div class="float-right">
|
||||
<div>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> {{ $t('system.menu.opTips') }} </template>
|
||||
<span>
|
||||
<SvgIcon name="question-filled" />
|
||||
</span>
|
||||
<SvgIcon name="question-filled" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<el-scrollbar class="tree-data">
|
||||
<el-scrollbar>
|
||||
<el-tree
|
||||
ref="resourceTreeRef"
|
||||
class="none-select"
|
||||
:indent="24"
|
||||
node-key="id"
|
||||
:props="props"
|
||||
@@ -62,7 +61,7 @@
|
||||
</el-scrollbar>
|
||||
</Pane>
|
||||
|
||||
<Pane min-size="40">
|
||||
<Pane min-size="40" size="70">
|
||||
<div class="ml-2">
|
||||
<el-tabs v-model="state.activeTabName" @tab-click="onTabClick" v-if="currentResource">
|
||||
<el-tab-pane :label="$t('common.detail')" :name="ResourceDetail">
|
||||
@@ -437,29 +436,10 @@ const removeDeafultExpandId = (id: any) => {
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.system-resouce-list {
|
||||
.system-resource-list {
|
||||
.el-tree-node__content {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.tree-data {
|
||||
height: calc(100vh - 202px);
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
display: inline-block;
|
||||
min-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.none-select {
|
||||
moz-user-select: -moz-none;
|
||||
-moz-user-select: none;
|
||||
-o-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user