1
0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-31 22:18:07 +08:00

fix: 两步验证样式调整 (#827)

This commit is contained in:
ssongliu 2023-04-28 15:58:19 +08:00 committed by GitHub
parent 18e171446e
commit c424e22924
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 29 deletions

View File

@ -891,10 +891,6 @@ const message = {
mfaHelper1: 'Download a MFA verification mobile app e.g.:',
mfaHelper2: 'Scan the following QR code using the mobile app to obtain the 6-digit verification code',
mfaHelper3: 'Enter six digits from the app',
mfaSecret: 'Secret',
mfaTypeOption: 'Select the method of obtaining the secret',
qrCode: 'QR code',
manualInput: 'Manual input',
mfaCode: 'Code',
sslDisable: 'Disable',
sslDisableHelper:

View File

@ -928,10 +928,6 @@ const message = {
mfaHelper1: '下载两步验证手机应用 :',
mfaHelper2: '使用手机应用扫描以下二维码获取 6 位验证码',
mfaHelper3: '输入手机应用上的 6 位数字',
mfaSecret: '验证密钥',
mfaTypeOption: '选择获取密钥方式',
qrCode: '二维码',
manualInput: '手动输入',
mfaCode: '验证码',
sslDisable: '禁用',
sslDisableHelper: '禁用 https 服务需要重启面板才能生效是否继续',

View File

@ -22,28 +22,23 @@
<li>Authenticator</li>
</ul>
</el-form-item>
<el-form-item :label="$t('setting.mfaTypeOption')">
<el-radio-group v-model="mode" @change="form.secret = ''">
<el-radio label="scan">{{ $t('setting.qrCode') }}</el-radio>
<el-radio label="input">{{ $t('setting.manualInput') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item :label="$t('setting.mfaHelper2')" v-if="mode === 'scan'">
<el-form-item :label="$t('setting.mfaHelper2')">
<el-image style="width: 120px; height: 120px" :src="qrImage" />
<span class="input-help">
<span style="float: left">{{ $t('setting.secret') }}: {{ form.secret }}</span>
<div style="float: left; margin-top: 2px">
<el-icon
color="#409EFC"
style="cursor: pointer; margin-left: 10px"
:size="18"
@click="onCopy()"
>
<DocumentCopy />
</el-icon>
</div>
</span>
</el-form-item>
<el-form-item
:label="$t('setting.mfaSecret')"
v-if="mode === 'input'"
prop="secret"
:rules="Rules.requiredInput"
>
<el-input v-model="form.secret"></el-input>
</el-form-item>
<el-form-item
:label="mode === 'scan' ? $t('setting.mfaHelper3') : $t('setting.mfaCode')"
prop="code"
:rules="Rules.requiredInput"
>
<el-form-item :label="$t('setting.mfaCode')" prop="code" :rules="Rules.requiredInput">
<el-input v-model="form.code"></el-input>
</el-form-item>
</el-col>
@ -70,7 +65,6 @@ import { FormInstance } from 'element-plus';
const loading = ref();
const qrImage = ref();
const mode = ref('scan');
const drawerVisiable = ref();
const formRef = ref();
@ -85,6 +79,16 @@ const acceptParams = (): void => {
drawerVisiable.value = true;
};
const onCopy = () => {
let input = document.createElement('input');
input.value = form.secret;
document.body.appendChild(input);
input.select();
document.execCommand('Copy');
document.body.removeChild(input);
MsgSuccess(i18n.global.t('commons.msg.copySuccess'));
};
const loadMfaCode = async () => {
const res = await getMFA();
form.secret = res.data.secret;