klinsmaya/SQLBot
1
0
Fork 0
mirror of https://gh-proxy.org/https://github.com/klinsmaya/SQLBot.git synced 2026-11-08 17:26:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(Workspace): When adding the Member-hover menu option, add the background hover interaction

Browse Source
This commit is contained in:
dataeaseShu
2025-08-14 17:05:24 +08:00
parent 2585526e3f
commit 7f8a0e7381
8 changed files with 123 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/assets/svg/icon_new-chat_outlined.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="17" height="16" viewBox="0 0 17 16" xmlns="http://www.w3.org/2000/svg">
<path d="M8.66663 1C12.5326 1 15.6666 4.13401 15.6666 8C15.6666 11.866 12.5326 15 8.66663 15H2.33329C1.9651 15 1.66663 14.7015 1.66663 14.3333V8C1.66663 4.13401 4.80063 1 8.66663 1ZM2.99996 13.6667H8.66663C11.7962 13.6667 14.3333 11.1296 14.3333 7.99998C14.3333 4.87037 11.7962 2.33332 8.66663 2.33332C5.53701 2.33332 2.99996 4.87037 2.99996 7.99998V13.6667Z" fill="white"/>
<path d="M8.33329 5C8.1492 5 7.99996 5.14924 7.99996 5.33333V7.33333H5.99996C5.81586 7.33333 5.66663 7.48257 5.66663 7.66667V8.33333C5.66663 8.51743 5.81586 8.66667 5.99996 8.66667H7.99996V10.6667C7.99996 10.8508 8.1492 11 8.33329 11H8.99996C9.18405 11 9.33329 10.8508 9.33329 10.6667V8.66667H11.3333C11.5174 8.66667 11.6666 8.51743 11.6666 8.33333V7.66667C11.6666 7.48257 11.5174 7.33333 11.3333 7.33333H9.33329V5.33333C9.33329 5.14924 9.18405 5 8.99996 5H8.33329Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 935 B

frontend/src/style.less
+2
View File
@@ -26,6 +26,8 @@
--ed-border-radius-base: 6px !important;
--ed-border-color: #d9dcdf !important;
--ed-color-primary-light-7: #d2f1e9 !important;
--ed-border-color: #d9dcdf !important;
--ed-border-radius-base: 6px !important;
}
a {
frontend/src/views/ds/Card.vue
+2 -2
View File
@@ -2,7 +2,7 @@
import delIcon from '@/assets/svg/icon_delete.svg'
import icon_more_outlined from '@/assets/svg/icon_more_outlined.svg'
import icon_form_outlined from '@/assets/svg/icon_form_outlined.svg'
import icon_chat_outlined from '@/assets/svg/icon_chat_outlined.svg'
import icon_chat_outlined from '@/assets/svg/icon_new-chat_outlined.svg'
import { computed, ref, unref } from 'vue'
import { ClickOutside as vClickOutside } from 'element-plus-secondary'
import { dsTypeWithImg } from './js/ds-type'
@@ -93,7 +93,7 @@ const onClickOutside = () => {
<div click.stop class="methods">
<el-button v-if="false" @click="runSQL">test</el-button>
<el-button type="primary" style="margin-right: 8px" @click.stop="handleQuestion">
<el-icon style="margin-right: 2px" size="12">
<el-icon style="margin-right: 4px" size="16">
<icon_chat_outlined></icon_chat_outlined>
</el-icon>
{{ $t('datasource.open_query') }}
frontend/src/views/system/appearance/LoginPreview.vue
+1 -1
View File
@@ -288,7 +288,7 @@ onMounted(() => {
padding-top: 12px;
box-shadow: 0px 4px 15px rgba(31, 35, 41, 0.08);
border: 1px solid #dee0e3;
border-radius: 2px;
border-radius: 12px;
.login-form-item {
margin-top: 15px;
frontend/src/views/system/appearance/Person.vue
+1
View File
@@ -129,6 +129,7 @@ const account = computed(() => userStore.getAccount)
position: absolute;
bottom: 44px;
pointer-events: none;
border-radius: 6px;
&::after {
content: '';
frontend/src/views/system/appearance/index.vue
+1 -1
View File
@@ -766,7 +766,7 @@ onUnmounted(() => {
align-items: center;
justify-content: center;
background: #ffffff;
border: 1px solid #bbbfc4;
border: 1px solid var(--ed-border-color);
border-radius: 6px;
.is-active {
frontend/src/views/system/permission/SelectPermission.vue
+66 -21
View File
@@ -7,7 +7,7 @@
v-model="search"
:validate-event="false"
:placeholder="$t('datasource.search')"
style="width: 364px"
style="width: 364px; margin-left: 16px"
clearable
>
<template #prefix>
@@ -20,6 +20,7 @@
<el-checkbox
v-model="checkAll"
class="mb-8"
style="margin-left: 16px"
:indeterminate="isIndeterminate"
@change="handleCheckAllChange"
>
@@ -35,6 +36,7 @@
:key="space.id"
:label="space.name"
:value="space"
class="hover-bg"
>
<div class="flex">
<el-icon size="28">
@@ -52,7 +54,7 @@
</div>
</div>
<div class="p-16 w-full">
<div class="flex-between mb-16">
<div class="flex-between mb-16" style="margin: 0 16px">
<span class="lighter">
{{ $t('workspace.selected_2_people', { msg: checkTableList.length }) }}
</span>
@@ -61,7 +63,12 @@
{{ $t('workspace.clear') }}
</el-button>
</div>
<div v-for="ele in checkTableList" :key="ele.name" class="flex-between">
<div
v-for="ele in checkTableList"
:key="ele.name"
style="margin: 0 16px; position: relative"
class="flex-between align-center hover-bg_select"
>
<div class="flex align-center ellipsis" style="width: 100%">
<el-icon size="28">
<avatar_personal></avatar_personal>
@@ -176,16 +183,54 @@ defineExpose({
</script>
<style lang="less">
.select-user_permission {
.lighter-bold {
margin-bottom: 16px;
font-weight: 500;
font-size: 16px;
line-height: 24px;
}
.mb-8 {
margin-bottom: 8px;
}
.ed-checkbox {
margin-right: 0;
position: relative;
}
.hover-bg,
.hover-bg_select {
&:hover {
&::after {
content: '';
height: 44px;
width: calc(100% + 34px);
background: #1f23291a;
position: absolute;
border-radius: 6px;
top: 50%;
transform: translateY(-50%);
left: -8px;
z-index: 1;
}
}
}
.hover-bg_select {
&:hover {
&::after {
width: calc(100% + 16px);
}
}
}
.mt-16 {
margin-top: 16px;
}
.p-16 {
padding: 16px;
padding: 16px 0;
}
.lighter {
@@ -194,11 +239,8 @@ defineExpose({
line-height: 22px;
}
.lighter-bold {
font-weight: 500;
font-size: 16px;
line-height: 24px;
margin-bottom: 16px;
.checkbox-group-block {
margin: 0 16px;
}
.checkbox-group-block {
@@ -217,12 +259,25 @@ defineExpose({
}
}
.close-btn {
position: relative;
z-index: 10;
height: 24px;
line-height: 24px;
&:hover,
&:active,
&:focus {
background: #1f23291a !important;
}
}
.border {
border: 1px solid #dee0e3;
}
.w-full {
width: 100%;
height: 100%;
width: 50%;
overflow-y: auto;
.flex-between {
@@ -230,14 +285,6 @@ defineExpose({
}
}
.close-btn {
&:hover,
&:active,
&:focus {
background: #1f23291a !important;
}
}
.mt-8 {
margin-top: 8px;
}
@@ -263,13 +310,11 @@ defineExpose({
.flex {
display: flex;
}
.ed-checkbox {
margin-right: 0 !important;
}
.border-r {
border-right: 1px solid #dee0e3;
width: 50%;
overflow: hidden;
}
}
</style>
frontend/src/views/system/workspace/AuthorizedWorkspaceDialog.vue
+46 -4
View File
@@ -17,7 +17,7 @@
v-model="search"
:validate-event="false"
:placeholder="$t('datasource.search')"
style="width: 364px"
style="width: 364px; margin-left: 16px"
clearable
>
<template #prefix>
@@ -30,6 +30,7 @@
<el-checkbox
v-model="checkAll"
class="mb-8"
style="margin-left: 16px"
:indeterminate="isIndeterminate"
@change="handleCheckAllChange"
>
@@ -45,6 +46,7 @@
:key="space.id"
:label="space.name"
:value="space"
class="hover-bg"
>
<div class="flex">
<el-icon size="28">
@@ -62,7 +64,7 @@
</div>
</div>
<div class="p-16 w-full">
<div class="flex-between mb-16">
<div class="flex-between mb-16" style="margin: 0 16px">
<span class="lighter">
{{ $t('workspace.selected_2_people', { msg: checkTableList.length }) }}
</span>
@@ -71,7 +73,12 @@
{{ $t('workspace.clear') }}
</el-button>
</div>
<div v-for="ele in checkTableList" :key="ele.name" class="flex-between align-center">
<div
v-for="ele in checkTableList"
:key="ele.name"
style="margin: 0 16px; position: relative"
class="flex-between align-center hover-bg_select"
>
<div
:title="`${ele.name}(${ele.account})`"
class="flex align-center ellipsis"
@@ -214,6 +221,33 @@ defineExpose({
.ed-checkbox {
margin-right: 0;
position: relative;
}
.hover-bg,
.hover-bg_select {
&:hover {
&::after {
content: '';
height: 44px;
width: calc(100% + 34px);
background: #1f23291a;
position: absolute;
border-radius: 6px;
top: 50%;
transform: translateY(-50%);
left: -8px;
z-index: 1;
}
}
}
.hover-bg_select {
&:hover {
&::after {
width: calc(100% + 16px);
}
}
}
.mt-16 {
@@ -221,7 +255,7 @@ defineExpose({
}
.p-16 {
padding: 16px;
padding: 16px 0;
}
.lighter {
@@ -230,6 +264,10 @@ defineExpose({
line-height: 22px;
}
.checkbox-group-block {
margin: 0 16px;
}
.checkbox-group-block {
.ed-checkbox,
.ed-checkbox__label,
@@ -247,6 +285,10 @@ defineExpose({
}
.close-btn {
position: relative;
z-index: 10;
height: 24px;
line-height: 24px;
&:hover,
&:active,
&:focus {