hanyixuanten/cloud-mail
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: optimize button event handling

Browse Source
This commit is contained in:
aslost
2026-08-15 23:41:34 +08:00
parent cb07b18944
commit a42f0cc93d
9 changed files with 89 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mail-vue/src/layout/account/index.vue
+9 -3
View File
@@ -77,7 +77,7 @@
</el-scrollbar>
<el-dialog v-model="showAdd" :title="$t('addAccount')">
<div class="container">
<el-input v-model="addForm.email" ref="addRef" type="text" :placeholder="$t('emailAccount')" autocomplete="off">
<el-input v-model="addForm.email" ref="addRef" type="text" :placeholder="$t('emailAccount')" autocomplete="off" @keyup.enter="submit">
<template #append>
<div @click.stop="openSelect">
<el-select
@@ -116,7 +116,7 @@
</el-dialog>
<el-dialog v-model="setNameShow" :title="$t('changeUserName')">
<div class="container">
<el-input v-model="accountName" type="text" :placeholder="$t('username')" autocomplete="off">
<el-input v-model="accountName" type="text" :placeholder="$t('username')" autocomplete="off" @keyup.enter="setName">
</el-input>
<el-button class="btn" type="primary" @click="setName" :loading="setNameLoading"
>{{ $t('save') }}
@@ -229,6 +229,8 @@ function getSkeletonRows() {
function setName() {
if (setNameLoading.value) return
let name = accountName.value
if (name === account.name) {
@@ -427,6 +429,8 @@ function getAccountList() {
function submit() {
if (addLoading.value) return
if (!addForm.email) {
ElMessage({
message: t('emptyEmailMsg'),
@@ -482,7 +486,6 @@ function submit() {
addLoading.value = true
accountAdd(addForm.email + addForm.suffix, verifyToken).then(account => {
addLoading.value = false
showAdd.value = false
addForm.email = ''
accounts.push(account)
verifyToken = ''
@@ -494,6 +497,9 @@ function submit() {
})
verifyShow.value = false
userStore.refreshUserInfo()
nextTick(() => {
addRef.value.focus()
})
}).catch(res => {
if (res.code === 400) {
verifyToken = ''
mail-vue/src/views/all-email/index.vue
+6 -4
View File
@@ -62,10 +62,10 @@
<el-dialog v-model="showBathDelete" :title="$t('clearEmail')" width="335"
@closed="closedClear">
<div class="clear-email">
<el-input v-model="clearParams.sendName" :placeholder="$t('sender')"/>
<el-input v-model="clearParams.subject" :placeholder="$t('subject')"/>
<el-input v-model="clearParams.sendEmail" :placeholder="$t('sendEmailAddress')"/>
<el-input v-model="clearParams.toEmail" :placeholder="$t('toEmail')"/>
<el-input v-model="clearParams.sendName" :placeholder="$t('sender')" @keyup.enter="batchDelete"/>
<el-input v-model="clearParams.subject" :placeholder="$t('subject')" @keyup.enter="batchDelete"/>
<el-input v-model="clearParams.sendEmail" :placeholder="$t('sendEmailAddress')" @keyup.enter="batchDelete"/>
<el-input v-model="clearParams.toEmail" :placeholder="$t('toEmail')" @keyup.enter="batchDelete"/>
<el-date-picker popper-class="my-date-picker"
v-model="clearTime"
type="daterange"
@@ -193,6 +193,8 @@ function openBathDelete() {
function batchDelete() {
if (clearLoading.value) return
if (clearTime.value) {
clearParams.startTime = toUtc(clearTime.value[0]).format("YYYY-MM-DD HH:mm:ss")
clearParams.endTime = toUtc(clearTime.value[1]).add(1, 'day').format("YYYY-MM-DD HH:mm:ss")
mail-vue/src/views/content/index.vue
+11
View File
@@ -112,12 +112,23 @@ onMounted(() => {
email.unread = EmailUnreadEnum.READ;
emailRead([email.emailId]);
}
window.addEventListener('keydown', handleKeyDown);
})
onUnmounted(() => {
emailStore.contentData.showUnread = false;
window.removeEventListener('keydown', handleKeyDown);
})
function handleKeyDown(event) {
if (event.key !== 'Escape') return;
if (showPreview.value) return;
if (document.querySelector('.el-message-box')) return;
const writeBox = document.querySelector('.write-box');
if (writeBox && writeBox.offsetParent !== null) return;
handleBack();
}
function openReply() {
uiStore.writerRef.openReply(email)
}
mail-vue/src/views/login/index.vue
+17 -10
View File
@@ -15,7 +15,7 @@
<span class="form-desc" v-else>{{ $t('regTitle') }}</span>
<div v-show="show === 'login'">
<el-input :class="!hideLoginDomain ? 'email-input' : ''" v-model="form.email"
type="text" :placeholder="$t('emailAccount')" autocomplete="off">
type="text" :placeholder="$t('emailAccount')" autocomplete="off" @keyup.enter="submit">
<template #append v-if="!hideLoginDomain">
<div @click.stop="openSelect">
<el-select
@@ -39,7 +39,7 @@
</div>
</template>
</el-input>
<el-input v-model="form.password" :placeholder="$t('password')" type="password" autocomplete="off">
<el-input v-model="form.password" :placeholder="$t('password')" type="password" autocomplete="off" @keyup.enter="submit">
</el-input>
<el-button class="btn" type="primary" @click="submit" :loading="loginLoading"
>{{ $t('loginBtn') }}
@@ -50,7 +50,7 @@
</div>
<div v-show="show !== 'login'">
<el-input :class="!hideLoginDomain ? 'email-input' : ''" v-model="registerForm.email" type="text" :placeholder="$t('emailAccount')"
autocomplete="off">
autocomplete="off" @keyup.enter="submitRegister">
<template #append v-if="!hideLoginDomain">
<div @click.stop="openSelect">
<el-select
@@ -74,13 +74,13 @@
</div>
</template>
</el-input>
<el-input v-model="registerForm.password" :placeholder="$t('password')" type="password" autocomplete="off"/>
<el-input v-model="registerForm.password" :placeholder="$t('password')" type="password" autocomplete="off" @keyup.enter="submitRegister"/>
<el-input v-model="registerForm.confirmPassword" :placeholder="$t('confirmPwd')" type="password"
autocomplete="off"/>
autocomplete="off" @keyup.enter="submitRegister"/>
<el-input v-if="settingStore.settings.regKey === 0" v-model="registerForm.code" :placeholder="$t('regKey')"
type="text" autocomplete="off"/>
type="text" autocomplete="off" @keyup.enter="submitRegister"/>
<el-input v-if="settingStore.settings.regKey === 2" v-model="registerForm.code"
:placeholder="$t('regKeyOptional')" type="text" autocomplete="off"/>
:placeholder="$t('regKeyOptional')" type="text" autocomplete="off" @keyup.enter="submitRegister"/>
<div v-show="verifyShow"
class="register-turnstile"
:data-sitekey="settingStore.settings.siteKey"
@@ -108,7 +108,7 @@
</div>
<el-dialog class="bind-dialog" v-model="showBindForm" title="注册邮箱" >
<div class="bind-container">
<el-input :class="!hideLoginDomain ? 'email-input' : ''" v-model="bindForm.email" type="text" :placeholder="$t('emailAccount')" autocomplete="off">
<el-input :class="!hideLoginDomain ? 'email-input' : ''" v-model="bindForm.email" type="text" :placeholder="$t('emailAccount')" autocomplete="off" @keyup.enter="bind">
<template #append v-if="!hideLoginDomain">
<div @click.stop="openSelect">
<el-select
@@ -132,9 +132,9 @@
</template>
</el-input>
<el-input v-if="settingStore.settings.regKey === 0" v-model="bindForm.code" :placeholder="$t('regKey')"
type="text" autocomplete="off"/>
type="text" autocomplete="off" @keyup.enter="bind"/>
<el-input v-if="settingStore.settings.regKey === 2" v-model="bindForm.code"
:placeholder="$t('regKeyOptional')" type="text" autocomplete="off"/>
:placeholder="$t('regKeyOptional')" type="text" autocomplete="off" @keyup.enter="bind"/>
<el-button class="btn" type="primary" @click="bind" :loading="bindLoading"
>绑定
</el-button>
@@ -306,6 +306,8 @@ async function linuxDoGetUser() {
function bind() {
if (bindLoading.value) return
if (!bindForm.email) {
ElMessage({
message: t('emptyEmailMsg'),
@@ -363,6 +365,8 @@ function bind() {
const submit = () => {
if (loginLoading.value) return
if (!form.email) {
ElMessage({
message: t('emptyEmailMsg'),
@@ -433,6 +437,8 @@ function refreshWebsiteConfig() {
function submitRegister() {
if (registerLoading.value) return
if (!registerForm.email) {
ElMessage({
message: t('emptyEmailMsg'),
@@ -742,6 +748,7 @@ function submitRegister() {
width: 100px;
opacity: 0;
pointer-events: none;
visibility: hidden;
}
.custom-style {
mail-vue/src/views/reg-key/index.vue
+4 -2
View File
@@ -62,7 +62,7 @@
</el-scrollbar>
<el-dialog v-model="showAdd" :title="$t('addRegKey')">
<div class="container">
<el-input v-model="addForm.code" :placeholder="$t('regKey')">
<el-input v-model="addForm.code" :placeholder="$t('regKey')" @keyup.enter="submit">
<template #suffix>
<Icon @click.stop="genCode" class="gen-code" icon="bitcoin-icons:refresh-filled" width="24" height="24"/>
</template>
@@ -75,7 +75,7 @@
type="date"
:placeholder="$t('validUntil')"
/>
<el-input-number v-model="addForm.count" :min="1" :max="99999"/>
<el-input-number v-model="addForm.count" :min="1" :max="99999" @keyup.enter="submit"/>
<el-button class="btn" type="primary" @click="submit" :loading="addLoading"
>{{ $t('add') }}
</el-button>
@@ -308,6 +308,8 @@ function clearNotUse() {
function submit() {
if (addLoading.value) return
if (!addForm.code) {
ElMessage({
message: $('emptyRegKeyMsg'),
mail-vue/src/views/role/index.vue
+3 -2
View File
@@ -68,9 +68,9 @@
</template>
<div class="dialog-box">
<el-input class="dialog-input" v-model="form.name" type="text" :maxlength="12" :placeholder="$t('roleName')"
autocomplete="off"/>
autocomplete="off" @keyup.enter="roleFormClick"/>
<el-input class="dialog-input" v-model="form.description" :maxlength="30" type="text"
:placeholder="$t('description')" autocomplete="off"/>
:placeholder="$t('description')" autocomplete="off" @keyup.enter="roleFormClick"/>
<el-input-tag class="dialog-input" tag-type="warning" v-model="form.banEmail"
@add-tag="banEmailAddTag" type="text" :placeholder="$t('emailInterception')" autocomplete="off"/>
<el-select
@@ -233,6 +233,7 @@ function banEmailAddTag(val) {
function roleFormClick() {
if (permLoading.value) return
if (dialogType.type === 'add') {
addRole()
} else {
mail-vue/src/views/setting/index.vue
+4 -2
View File
@@ -53,8 +53,8 @@
</div>
<el-dialog v-model="pwdShow" :title="$t('changePassword')" width="340">
<div class="update-pwd">
<el-input type="password" :placeholder="$t('newPassword')" v-model="form.password" autocomplete="off"/>
<el-input type="password" :placeholder="$t('confirmPassword')" v-model="form.newPwd" autocomplete="off"/>
<el-input type="password" :placeholder="$t('newPassword')" v-model="form.password" autocomplete="off" @keyup.enter="submitPwd"/>
<el-input type="password" :placeholder="$t('confirmPassword')" v-model="form.newPwd" autocomplete="off" @keyup.enter="submitPwd"/>
<el-button type="primary" :loading="setPwdLoading" @click="submitPwd">{{$t('save')}}</el-button>
</div>
</el-dialog>
@@ -160,6 +160,8 @@ const deleteConfirm = () => {
function submitPwd() {
if (setPwdLoading.value) return
if (!form.password) {
ElMessage({
message: t('emptyPwdMsg'),
mail-vue/src/views/sys-setting/index.vue
+27 -25
View File
@@ -453,13 +453,13 @@
<!-- Dialogs remain the same -->
<el-dialog v-model="editTitleShow" :title="$t('changeTitle')" width="340" @closed="editTitle = setting.title">
<form>
<el-input type="text" :placeholder="$t('websiteTitle')" v-model="editTitle"/>
<form @submit.prevent>
<el-input type="text" :placeholder="$t('websiteTitle')" v-model="editTitle" @keyup.enter="saveTitle"/>
<el-button type="primary" :loading="settingLoading" @click="saveTitle">{{ $t('save') }}</el-button>
</form>
</el-dialog>
<el-dialog v-model="resendTokenFormShow" :title="$t('resendToken')" width="340" @closed="cleanResendTokenForm">
<form>
<form @submit.prevent>
<el-select style="margin-bottom: 15px" v-model="resendTokenForm.domain" placeholder="Select">
<el-option
v-for="item in settingStore.domainList"
@@ -468,22 +468,22 @@
:value="item"
/>
</el-select>
<el-input type="text" :placeholder="$t('addResendTokenDesc')" v-model="resendTokenForm.token"/>
<el-input type="text" :placeholder="$t('addResendTokenDesc')" v-model="resendTokenForm.token" @keyup.enter="saveResendToken"/>
<el-button type="primary" :loading="settingLoading" @click="saveResendToken">{{ $t('save') }}</el-button>
</form>
</el-dialog>
<el-dialog v-model="r2DomainShow" :title="$t('addOsDomain')" width="340"
@closed="r2DomainInput = setting.r2Domain">
<form>
<el-input type="text" :placeholder="$t('domainDesc')" v-model="r2DomainInput"/>
<form @submit.prevent>
<el-input type="text" :placeholder="$t('domainDesc')" v-model="r2DomainInput" @keyup.enter="saveR2domain"/>
<el-button type="primary" :loading="settingLoading" @click="saveR2domain">{{ $t('save') }}</el-button>
</form>
</el-dialog>
<el-dialog v-model="turnstileShow" :title="$t('addTurnstileSecret')" width="340"
@closed="turnstileForm.secretKey = '';turnstileForm.siteKey = ''">
<form>
<el-input type="text" placeholder="Site Key" v-model="turnstileForm.siteKey"/>
<el-input type="text" style="margin-top: 15px" placeholder="Secret Key" v-model="turnstileForm.secretKey"/>
<form @submit.prevent>
<el-input type="text" placeholder="Site Key" v-model="turnstileForm.siteKey" @keyup.enter="saveTurnstileKey"/>
<el-input type="text" style="margin-top: 15px" placeholder="Secret Key" v-model="turnstileForm.secretKey" @keyup.enter="saveTurnstileKey"/>
<el-button type="primary" :loading="settingLoading" @click="saveTurnstileKey">{{ $t('save') }}</el-button>
</form>
</el-dialog>
@@ -504,7 +504,7 @@
</span>
</template>
<el-input :placeholder="$t('backgroundUrlDesc')" v-model="backgroundUrl" v-if="!localUpShow"
class="background-url"/>
class="background-url" @keyup.enter="saveBackground"/>
<el-image
v-if="localUpShow"
:preview-src-list="[backgroundImage]"
@@ -536,10 +536,10 @@
</div>
</template>
<div class="forward-set-body">
<el-input :placeholder="setting.tgBotToken || $t('tgBotToken')" v-model="tgBotToken"></el-input>
<el-input :placeholder="setting.tgBotToken || $t('tgBotToken')" v-model="tgBotToken" @keyup.enter="tgBotSave"></el-input>
<el-input-tag tag-type="warning" :placeholder="$t('toBotTokenDesc')" v-model="tgChatId"
@add-tag="addChatTag"></el-input-tag>
<el-input tag-type="warning" :placeholder="$t('customDomainDesc')" v-model="customDomain" ></el-input>
<el-input tag-type="warning" :placeholder="$t('customDomainDesc')" v-model="customDomain" @keyup.enter="tgBotSave"></el-input>
<div class="tg-msg-label">
<span>{{t('from')}}</span>
<el-select v-model="tgMsgFrom" >
@@ -648,23 +648,23 @@
</el-dialog>
<el-dialog v-model="regVerifyCountShow" :title="$t('rulesVerifyTitle',{count: regVerifyCount})"
@closed="regVerifyCount = setting.regVerifyCount">
<form>
<el-input-number type="text" v-model="regVerifyCount" :min="1">
<form @submit.prevent>
<el-input-number type="text" v-model="regVerifyCount" :min="1" @keyup.enter="saveRegVerifyCount">
</el-input-number>
<el-button type="primary" :loading="settingLoading" @click="saveRegVerifyCount">{{ $t('save') }}</el-button>
</form>
</el-dialog>
<el-dialog v-model="addVerifyCountShow" :title="$t('rulesVerifyTitle',{count: addVerifyCount})"
@closed="addVerifyCount = setting.addVerifyCount">
<form>
<el-input-number type="text" v-model="addVerifyCount" :min="1"/>
<form @submit.prevent>
<el-input-number type="text" v-model="addVerifyCount" :min="1" @keyup.enter="saveAddVerifyCount"/>
<el-button type="primary" :loading="settingLoading" @click="saveAddVerifyCount">{{ $t('save') }}</el-button>
</form>
</el-dialog>
<el-dialog top="5vh" v-model="noticePopupShow" :title="$t('noticePopup')" class="notice-popup"
@closed="resetNoticeForm">
<form>
<el-input v-model="noticeForm.noticeTitle" :placeholder="t('titleDesc')"/>
<form @submit.prevent>
<el-input v-model="noticeForm.noticeTitle" :placeholder="t('titleDesc')" @keyup.enter="saveNoticePopup"/>
<div class="notice-line-item">
<el-select v-model="noticeForm.noticeType">
<template #prefix>
@@ -735,13 +735,13 @@
</template>
</el-dialog>
<el-dialog v-model="addS3Show" :title="t('s3Configuration')" width="340" @closed="resetAddS3Form">
<form>
<el-input class="dialog-input" type="text" placeholder="Bucket" v-model="s3.bucket"/>
<el-input class="dialog-input" type="text" placeholder="Endpoint" v-model="s3.endpoint"/>
<el-input class="dialog-input" type="text" placeholder="Region" v-model="s3.region"/>
<form @submit.prevent>
<el-input class="dialog-input" type="text" placeholder="Bucket" v-model="s3.bucket" @keyup.enter="saveS3"/>
<el-input class="dialog-input" type="text" placeholder="Endpoint" v-model="s3.endpoint" @keyup.enter="saveS3"/>
<el-input class="dialog-input" type="text" placeholder="Region" v-model="s3.region" @keyup.enter="saveS3"/>
<el-input class="dialog-input" type="text" :placeholder="setting.s3AccessKey || 'Access Key'"
v-model="s3.s3AccessKey"/>
<el-input style="margin-bottom: 10px" type="text" :placeholder="setting.s3SecretKey || 'Secret Key'" v-model="s3.s3SecretKey"/>
v-model="s3.s3AccessKey" @keyup.enter="saveS3"/>
<el-input style="margin-bottom: 10px" type="text" :placeholder="setting.s3SecretKey || 'Secret Key'" v-model="s3.s3SecretKey" @keyup.enter="saveS3"/>
<div class="force-path-style">
<div class="force-path-style-left">
<span>ForcePathStyle</span>
@@ -761,7 +761,7 @@
<el-dialog v-model="emailPrefixShow" :title="t('emailPrefix')" @closed="resetEmailPrefix" >
<div class="email-prefix">
<div>{{ t('atLeast') }}</div>
<el-input-number v-model="minEmailPrefix" :min="1" :max="20" style="width: 150px" >
<el-input-number v-model="minEmailPrefix" :min="1" :max="20" style="width: 150px" @keyup.enter="saveEmailPrefix" >
<template #suffix>
<span>{{ t('character') }}</span>
</template>
@@ -1353,6 +1353,8 @@ function saveTurnstileKey() {
async function saveBackground() {
if (settingLoading.value) return
let image = ''
if (localUpShow.value) {
mail-vue/src/views/user/index.vue
+8 -3
View File
@@ -135,7 +135,7 @@
</el-scrollbar>
<el-dialog class="dialog" v-model="setPwdShow" :title="$t('changePassword')" @closed="resetUserForm">
<div class="dialog-box">
<el-input v-model="userForm.password" type="password" :placeholder="$t('newPassword')" autocomplete="off">
<el-input v-model="userForm.password" type="password" :placeholder="$t('newPassword')" autocomplete="off" @keyup.enter="updatePwd">
</el-input>
<el-button class="btn" type="primary" :loading="settingLoading" @click="updatePwd"
>{{ $t('save') }}
@@ -155,7 +155,7 @@
</el-dialog>
<el-dialog v-model="showAdd" :title="$t('addUser')" @closed="resetAddForm">
<div class="container">
<el-input v-model="addForm.email" type="text" :placeholder="$t('emailAccount')" autocomplete="off">
<el-input v-model="addForm.email" type="text" :placeholder="$t('emailAccount')" autocomplete="off" @keyup.enter="submit">
<template #append>
<div @click.stop="openSelect">
<el-select
@@ -178,7 +178,7 @@
</div>
</template>
</el-input>
<el-input type="password" v-model="addForm.password" :placeholder="$t('password')"/>
<el-input type="password" v-model="addForm.password" :placeholder="$t('password')" @keyup.enter="submit"/>
<el-select v-model="addForm.type" :placeholder="$t('perm')">
<el-option v-for="item in roleList" :label="item.name" :value="item.roleId" :key="item.roleId"/>
</el-select>
@@ -693,6 +693,8 @@ function openAdd() {
function submit() {
if (addLoading.value) return
if (!addForm.email) {
ElMessage({
message: t('emptyEmailMsg'),
@@ -895,6 +897,7 @@ function httpSetStatus(user) {
}
function setType() {
if (settingLoading.value) return
settingLoading.value = true
userSetType({type: userForm.type, userId: userForm.userId}).then(() => {
chooseUser.type = userForm.type
@@ -923,6 +926,8 @@ function search() {
function updatePwd() {
if (settingLoading.value) return
if (!userForm.password) {
ElMessage({
message: t('emptyPwdMsg'),