gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

NEZ-3133 fix: Batch edit endpoint页面，Label key提示信息有遮挡

Browse Source
This commit is contained in:
zhangyu
2023-08-24 16:40:33 +08:00
parent f4263d82ed
commit 2d3ea18dac
3 changed files with 57 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
nezha-fronted/src/assets/css/common.scss
View File

@@ -740,3 +740,6 @@ i.nz-icon-override{
color: $--color-primary; color: $--color-primary;
margin-left: 10px; margin-left: 10px;
} }
.el-form-item__error {
padding-top: 0;
}

37
nezha-fronted/src/components/common/login.vue
View File

@@ -86,25 +86,37 @@
:show-close="true" width="620px" class="nz-dialog" > :show-close="true" width="620px" class="nz-dialog" >
<div v-my-loading="dialogLoading"> <div v-my-loading="dialogLoading">
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang=== 'en'">
1 Download your preferred authenticator app to your phone (any will work). If you don't 1. Download your preferred authenticator app to your phone (any will work). If you don't
have a preferred app, we recommend using <span @click="jumpDlw" class="verify-link">Google Authenticator.</span> have a preferred app, we recommend using <span @click="jumpDlw" class="verify-link">Google Authenticator.</span>
</div> </div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-else-if="lang=== 'zh'">
2 Use your app to take a photo of the QR code. 1. 将您喜欢的验证器应用程序下载到您的手机上（任何应用程序都可以）。
如果您没有首选应用程序，我们建议您使用 <span @click="jumpDlw" class="verify-link">Google Authenticator.</span>
</div>
<div class="login-dialog-title" v-if="lang=== 'en'">
2. Use your app to take a photo of the QR code.
</div>
<div class="login-dialog-title" v-else-if="lang=== 'zh'">
2. 使用您的应用程序为二维码拍照。
</div> </div>
<div class="qrCode-box"> <div class="qrCode-box">
<div id="qrCode" ref="qrCodeDiv" class="qrCode-content"></div> <div id="qrCode" ref="qrCodeDiv" class="qrCode-content"></div>
<div class="qrCode-text"> <div class="qrCode-text">
<div>Type this code down if you can't take a photo.</div> <div v-if="lang=== 'en'">Type this code down if you can't take a photo.</div>
<div v-else-if="lang=== 'zh'">如果你不能拍照，请键入此代码。</div>
<div class="qrCode-authKey">{{authKey}}</div> <div class="qrCode-authKey">{{authKey}}</div>
</div> </div>
</div> </div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang=== 'en'">
3. Enter the 6-digit code provided by your app and then verify. 3. Enter the 6-digit code provided by your app and then verify.
</div> </div>
<div class="enter-code">Enter Code</div> <div class="login-dialog-title" v-else-if="lang=== 'zh'">
3. 输入应用程序提供的6位数代码，然后进行验证。
</div>
<div class="enter-code" v-if="lang=== 'en'">Enter Code</div>
<div class="enter-code" v-else-if="lang=== 'zh'">输入代码</div>
<el-input v-model="bindAuthCode" size="small" style="width: 50%" @keydown.enter="bindCode"></el-input> <el-input v-model="bindAuthCode" size="small" style="width: 50%" @keydown.enter="bindCode"></el-input>
</div> </div>
<div slot="footer" class="footer"> <div slot="footer" class="footer">
@@ -120,10 +132,14 @@
:show-close="true" width="620px" class="nz-dialog" > :show-close="true" width="620px" class="nz-dialog" >
<div> <div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang=== 'en'">
Should you ever lose your phone or access to your one time password secret, each of these recovery codes can be used one time each to regain access to your account. Should you ever lose your phone or access to your one time password secret, each of these recovery codes can be used one time each to regain access to your account.
Please save them in a safe place, or you will lose access to your account. Please save them in a safe place, or you will lose access to your account.
</div> </div>
<div class="login-dialog-title" v-else-if="lang=== 'zh'">
如果您丢失了您的手机或一次性密码密码，每个恢复代码都可以使用一次，以重新访问您的帐户。
请将它们保存在安全的地方，否则您将无法访问您的帐户。
</div>
<div class="login-dialog-title2" > <div class="login-dialog-title2" >
<div class="login-dialog-recover"> <div class="login-dialog-recover">
<div v-for="(item, index) in recoveryCode" :key="index" style="color: #999999;"> <div v-for="(item, index) in recoveryCode" :key="index" style="color: #999999;">
@@ -142,9 +158,12 @@
</el-dialog> </el-dialog>
<el-dialog :modal-append-to-body='false' :fullscreen="dialogQrType === 'all'" :show-close="true" :visible.sync="qrCodeShow" @close="closeQrCode" :title="'QR code'" class="nz-dialog overview" width="650px"> <el-dialog :modal-append-to-body='false' :fullscreen="dialogQrType === 'all'" :show-close="true" :visible.sync="qrCodeShow" @close="closeQrCode" :title="'QR code'" class="nz-dialog overview" width="650px">
<div slot="title"> <div slot="title">
<span class="el-dialog__header-title"> <span class="el-dialog__header-title" v-if="lang=== 'en'">
QR code QR code
</span> </span>
<span class="el-dialog__header-title" v-else-if="lang=== 'zh'">
二维码
</span>
<div style="float: right; margin-right: 25px"> <div style="float: right; margin-right: 25px">
<el-button-group> <el-button-group>
<el-button class="top-tool-btn" :class="{active: dialogQrType == 'item' }" size="small" @click="dialogQrType = 'item'"><i class="nz-icon nz-icon-dangemoshi"/></el-button> <el-button class="top-tool-btn" :class="{active: dialogQrType == 'item' }" size="small" @click="dialogQrType = 'item'"><i class="nz-icon nz-icon-dangemoshi"/></el-button>

33
nezha-fronted/src/components/page/config/profile.vue
View File

@@ -76,25 +76,37 @@
:show-close="true" width="620px" class="nz-dialog" @closed="closeDialog"> :show-close="true" width="620px" class="nz-dialog" @closed="closeDialog">
<div v-my-loading="dialogLoading"> <div v-my-loading="dialogLoading">
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang === 'en'">
1 Download your preferred authenticator app to your phone (any will work). If you don't 1. Download your preferred authenticator app to your phone (any will work). If you don't
have a preferred app, we recommend using <span @click="jumpDlw" class="verify-link">Google Authenticator.</span> have a preferred app, we recommend using <span @click="jumpDlw" class="verify-link">Google Authenticator.</span>
</div> </div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-else-if="lang=== 'zh'">
2 Use your app to take a photo of the QR code. 1. 将您喜欢的验证器应用程序下载到您的手机上（任何应用程序都可以）。
如果您没有首选应用程序，我们建议您使用 <span @click="jumpDlw" class="verify-link">Google Authenticator.</span>
</div>
<div class="login-dialog-title" v-if="lang=== 'en'">
2. Use your app to take a photo of the QR code.
</div>
<div class="login-dialog-title" v-else-if="lang=== 'zh'">
2. 使用您的应用程序为二维码拍照。
</div> </div>
<div class="qrCode-box"> <div class="qrCode-box">
<div id="qrCode" ref="qrCodeDiv" class="qrCode-content"></div> <div id="qrCode" ref="qrCodeDiv" class="qrCode-content"></div>
<div class="qrCode-text"> <div class="qrCode-text">
<div>Type this code down if you can't take a photo.</div> <div v-if="lang=== 'en'">Type this code down if you can't take a photo.</div>
<div v-else-if="lang=== 'zh'">如果你不能拍照，请键入此代码。</div>
<div class="qrCode-authKey">{{authKey}}</div> <div class="qrCode-authKey">{{authKey}}</div>
</div> </div>
</div> </div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang=== 'en'">
3. Enter the 6-digit code provided by your app and then verify. 3. Enter the 6-digit code provided by your app and then verify.
</div> </div>
<div class="enter-code">Enter Code</div> <div class="login-dialog-title" v-else-if="lang=== 'zh'">
3. 输入应用程序提供的6位数代码，然后进行验证。
</div>
<div class="enter-code" v-if="lang=== 'en'">Enter Code</div>
<div class="enter-code" v-else-if="lang=== 'zh'">输入代码</div>
<el-input v-model="bindAuthCode" size="small" style="width: 50%" @keydown.enter="bindCode"></el-input> <el-input v-model="bindAuthCode" size="small" style="width: 50%" @keydown.enter="bindCode"></el-input>
</div> </div>
<div slot="footer" class="footer"> <div slot="footer" class="footer">
@@ -108,10 +120,14 @@
</el-dialog> </el-dialog>
<el-dialog :visible.sync="fileShow" :title="$t('login.verifyDialogTitle')" :modal-append-to-body='false' :show-close="true" width="620px" class="nz-dialog" @closed="fileClosed"> <el-dialog :visible.sync="fileShow" :title="$t('login.verifyDialogTitle')" :modal-append-to-body='false' :show-close="true" width="620px" class="nz-dialog" @closed="fileClosed">
<div> <div>
<div class="login-dialog-title"> <div class="login-dialog-title" v-if="lang=== 'en'">
Should you ever lose your phone or access to your one time password secret, each of these recovery codes can be used one time each to regain access to your account. Should you ever lose your phone or access to your one time password secret, each of these recovery codes can be used one time each to regain access to your account.
Please save them in a safe place, or you will lose access to your account. Please save them in a safe place, or you will lose access to your account.
</div> </div>
<div class="login-dialog-title" v-else-if="lang=== 'zh'">
如果您丢失了您的手机或一次性密码密码，每个恢复代码都可以使用一次，以重新访问您的帐户。
请将它们保存在安全的地方，否则您将无法访问您的帐户。
</div>
<div class="login-dialog-title2"> <div class="login-dialog-title2">
<div class="login-dialog-recover"> <div class="login-dialog-recover">
<div v-for="(item, index) in recoveryCode" :key="index"> <div v-for="(item, index) in recoveryCode" :key="index">
@@ -214,6 +230,7 @@ export default {
], ],
// 后台数据 // 后台数据
userList: {}, userList: {},
lang: this.$store.getters.getLanguage || 'en',
// 头像 name // 头像 name
profileName: '', profileName: '',
rules: { rules: {