Skip to content

Commit 0542b39

Browse files
authored
pref: Optimize the button style for database connection information (#7341)
1 parent 013cf21 commit 0542b39

File tree

4 files changed

+40
-31
lines changed

4 files changed

+40
-31
lines changed

frontend/src/components/copy-button/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<el-button v-if="type == 'icon'" link @click="copyText(content)" icon="DocumentCopy" class="ml-1.5"></el-button>
3-
<el-button type="primary" @click="copyText(content)" v-else>{{ $t('commons.button.copy') }}</el-button>
3+
<el-button @click="copyText(content)" v-else>{{ $t('commons.button.copy') }}</el-button>
44
</template>
55

66
<script lang="ts" setup>

frontend/src/views/database/mysql/conn/index.vue

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -80,16 +80,19 @@
8080
:rules="Rules.paramComplexity"
8181
prop="password"
8282
>
83-
<el-input type="password" show-password clearable v-model="form.password">
84-
<template #suffix>
85-
<CopyButton type="icon" :content="form.password" class="w-30" />
86-
</template>
87-
<template #append>
88-
<el-button @click="random">
89-
{{ $t('commons.button.random') }}
90-
</el-button>
91-
</template>
92-
</el-input>
83+
<el-input
84+
style="width: calc(100% - 147px)"
85+
type="password"
86+
show-password
87+
clearable
88+
v-model="form.password"
89+
/>
90+
<el-button-group>
91+
<CopyButton :content="form.password" />
92+
<el-button @click="random">
93+
{{ $t('commons.button.random') }}
94+
</el-button>
95+
</el-button-group>
9396
</el-form-item>
9497
</div>
9598

frontend/src/views/database/postgresql/conn/index.vue

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -81,16 +81,19 @@
8181
:rules="Rules.paramComplexity"
8282
prop="password"
8383
>
84-
<el-input type="password" show-password clearable v-model="form.password">
85-
<template #suffix>
86-
<CopyButton type="icon" :content="form.password" class="w-30" />
87-
</template>
88-
<template #append>
89-
<el-button @click="random">
90-
{{ $t('commons.button.random') }}
91-
</el-button>
92-
</template>
93-
</el-input>
84+
<el-input
85+
style="width: calc(100% - 147px)"
86+
type="password"
87+
show-password
88+
clearable
89+
v-model="form.password"
90+
/>
91+
<el-button-group>
92+
<CopyButton :content="form.password" />
93+
<el-button @click="random">
94+
{{ $t('commons.button.random') }}
95+
</el-button>
96+
</el-button-group>
9497
</el-form-item>
9598
</div>
9699
<div v-if="form.from !== 'local'">

frontend/src/views/database/redis/conn/index.vue

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -67,16 +67,19 @@
6767

6868
<el-divider border-style="dashed" />
6969
<el-form-item :label="$t('commons.login.password')" v-if="form.from === 'local'" prop="password">
70-
<el-input type="password" show-password clearable v-model="form.password">
71-
<template #suffix>
72-
<CopyButton type="icon" :content="form.password" class="w-30" />
73-
</template>
74-
<template #append>
75-
<el-button @click="random">
76-
{{ $t('commons.button.random') }}
77-
</el-button>
78-
</template>
79-
</el-input>
70+
<el-input
71+
style="width: calc(100% - 147px)"
72+
type="password"
73+
show-password
74+
clearable
75+
v-model="form.password"
76+
/>
77+
<el-button-group>
78+
<CopyButton :content="form.password" />
79+
<el-button @click="random">
80+
{{ $t('commons.button.random') }}
81+
</el-button>
82+
</el-button-group>
8083
</el-form-item>
8184

8285
<div v-if="form.from !== 'local'">

0 commit comments

Comments
 (0)