<script lang="ts" setup>
|
import { onMounted, reactive, toRefs } from 'vue';
|
|
import { useMessage } from '@jnpf/hooks';
|
|
import { getSysConfig, update } from '#/api/system/sysConfig';
|
import { $t } from '#/locales';
|
import { useBaseStore } from '#/store';
|
|
interface State {
|
baseForm: any;
|
activeKey: number;
|
btnLoading: boolean;
|
singleLoginOptions: any[];
|
lockTypeOptions: any[];
|
}
|
|
defineOptions({ name: 'SysConfigStrategy' });
|
|
const state = reactive<State>({
|
baseForm: {},
|
activeKey: 1,
|
btnLoading: false,
|
singleLoginOptions: [
|
{ fullName: '单一登录', id: 1 },
|
{ fullName: '同时登录', id: 2 },
|
],
|
lockTypeOptions: [
|
{ fullName: '账号锁定', id: 1 },
|
{ fullName: '延时登录', id: 2 },
|
],
|
});
|
const { baseForm, activeKey, btnLoading, singleLoginOptions, lockTypeOptions } = toRefs(state);
|
const { createConfirm, createMessage } = useMessage();
|
const baseStore = useBaseStore();
|
|
function initData() {
|
getSysConfig().then((res) => {
|
state.baseForm = res.data;
|
state.baseForm.lockType = state.baseForm.lockType ? state.baseForm.lockType : 1;
|
state.baseForm.lockTime = state.baseForm.lockTime ? state.baseForm.lockTime : 10;
|
});
|
}
|
function handleSubmit() {
|
if (!state.baseForm.newUserDefaultPassword) {
|
return createMessage.error('新用户默认密码不能为空');
|
}
|
createConfirm({
|
iconType: 'warning',
|
title: $t('common.tipTitle'),
|
content: '您确定要保存，是否继续?',
|
onOk: () => {
|
state.btnLoading = true;
|
update(state.baseForm)
|
.then((res) => {
|
createMessage.success(res.msg);
|
state.btnLoading = false;
|
const sysConfigInfo = {
|
newUserDefaultPassword: state.baseForm.newUserDefaultPassword,
|
};
|
baseStore.setSysConfig(sysConfigInfo);
|
initData();
|
})
|
.catch(() => {
|
state.btnLoading = false;
|
});
|
},
|
});
|
}
|
function onNumberChange(val, key) {
|
if (val) return;
|
if (key === 'verificationCodeNumber') return (state.baseForm[key] = 3);
|
state.baseForm[key] = 1;
|
}
|
|
onMounted(() => {
|
initData();
|
});
|
</script>
|
<template>
|
<div class="jnpf-content-wrapper">
|
<div class="jnpf-content-wrapper-center bg-white">
|
<a-form :colon="false" label-align="right" :label-col="{ style: { width: '140px' } }" class="h-full">
|
<a-tabs class="jnpf-content-wrapper-tabs tabs-contain" v-model:active-key="activeKey">
|
<a-tab-pane :key="1" tab="登录策略" class="p-[30px]">
|
<a-row>
|
<a-col :span="10">
|
<a-form-item label="登录方式">
|
<jnpf-select v-model:value="baseForm.singleLogin" placeholder="请选择" :options="singleLoginOptions" />
|
</a-form-item>
|
<a-form-item label="超时登出">
|
<a-input-number
|
v-model:value="baseForm.tokenTimeout"
|
:min="1"
|
:precision="0"
|
addon-after="分钟"
|
@change="onNumberChange($event, 'tokenTimeout')" />
|
</a-form-item>
|
<a-form-item label="密码错误次数">
|
<a-input-number
|
v-model:value="baseForm.passwordErrorsNumber"
|
:min="1"
|
:precision="0"
|
addon-after="次"
|
@change="onNumberChange($event, 'passwordErrorsNumber')" />
|
</a-form-item>
|
</a-col>
|
<a-col :span="24" class="common-tip mb-[10px] ml-[140px] mt-[-10px]">输入密码错误将用户锁定，设置3以下值表示不启动该功能</a-col>
|
<a-col :span="10">
|
<a-form-item label=" " class="mb-[10px]">
|
<jnpf-radio v-model:value="baseForm.lockType" :options="lockTypeOptions" />
|
<div class="mt-[10px]">
|
<a-form-item label="延迟时间" v-if="baseForm.lockType === 2" class="!mb-[6px]">
|
<a-input-number
|
v-model:value="baseForm.lockTime"
|
:min="1"
|
:precision="0"
|
addon-after="分钟"
|
@change="onNumberChange($event, 'lockTime')" />
|
</a-form-item>
|
</div>
|
</a-form-item>
|
<a-form-item label="登录验证码">
|
<jnpf-switch v-model:value="baseForm.enableVerificationCode" />
|
</a-form-item>
|
<a-form-item label="验证码位数" v-if="baseForm.enableVerificationCode">
|
<a-input-number
|
v-model:value="baseForm.verificationCodeNumber"
|
:min="3"
|
:max="6"
|
:precision="0"
|
addon-after="位"
|
@change="onNumberChange($event, 'verificationCodeNumber')" />
|
</a-form-item>
|
<a-form-item label="登录提示语">
|
<jnpf-switch v-model:value="baseForm.lastLoginTimeSwitch" />
|
</a-form-item>
|
<a-form-item v-if="baseForm.lastLoginTimeSwitch" label=" ">
|
<a-card size="small" class="w-[300px]" :body-style="{ padding: '0px 20px' }">
|
<template #title>
|
<span>上次登录信息提示</span>
|
</template>
|
<template #extra>
|
<i class="icon-ym icon-ym-nav-close card-extra"></i>
|
</template>
|
<div class="card-item">
|
<p>时间：2018-10-17 12:40</p>
|
<p>地点：上海市</p>
|
<p>IP：255.255.0.0</p>
|
</div>
|
</a-card>
|
</a-form-item>
|
<a-form-item label="白名单验证">
|
<jnpf-switch v-model:value="baseForm.whitelistSwitch" />
|
</a-form-item>
|
<a-form-item label="白名单设置" v-if="baseForm.whitelistSwitch">
|
<a-textarea v-model:value="baseForm.whiteListIp" :auto-size="{ minRows: 3, maxRows: 10 }" placeholder="允许访问IP" />
|
<div class="common-tip mt-[10px]">多个IP设置，用英文符号隔开，如192.168.0.1,192.168.0.2</div>
|
</a-form-item>
|
<a-form-item label=" ">
|
<a-button type="primary" @click.prevent="handleSubmit" :loading="btnLoading">保存</a-button>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
</a-tab-pane>
|
<a-tab-pane :key="2" tab="密码策略" class="p-[30px]">
|
<a-row>
|
<a-col :span="10">
|
<a-form-item label="密码定期更新">
|
<jnpf-switch v-model:value="baseForm.passwordIsUpdatedRegularly" />
|
</a-form-item>
|
<template v-if="baseForm.passwordIsUpdatedRegularly">
|
<a-form-item label="更新周期">
|
<a-input-number
|
v-model:value="baseForm.updateCycle"
|
:min="1"
|
:precision="0"
|
addon-after="天"
|
@change="onNumberChange($event, 'updateCycle')" />
|
</a-form-item>
|
<a-form-item label="提前">
|
<a-input-number
|
v-model:value="baseForm.updateInAdvance"
|
:min="1"
|
:precision="0"
|
addon-after="天提醒更新"
|
@change="onNumberChange($event, 'updateInAdvance')" />
|
</a-form-item>
|
</template>
|
<a-form-item label="密码强度限制">
|
<jnpf-switch v-model:value="baseForm.passwordStrengthLimit" />
|
</a-form-item>
|
<a-form-item label=" " v-if="baseForm.passwordStrengthLimit">
|
<div class="flex">
|
<JnpfCheckboxSingle class="checkbox mr-[20px]" label="最小长度" v-model:value="baseForm.passwordLengthMin" />
|
<a-input-number
|
v-model:value="baseForm.passwordLengthMinNumber"
|
:min="1"
|
:precision="0"
|
@change="onNumberChange($event, 'passwordLengthMinNumber')" /><br />
|
</div>
|
<JnpfCheckboxSingle class="checkbox" label="包含数字" v-model:value="baseForm.containsNumbers" /><br />
|
<JnpfCheckboxSingle class="checkbox" label="包含小写字母" v-model:value="baseForm.includeLowercaseLetters" /><br />
|
<JnpfCheckboxSingle class="checkbox" label="包含大写字母" v-model:value="baseForm.includeUppercaseLetters" /><br />
|
<JnpfCheckboxSingle class="checkbox" label="包含字符" v-model:value="baseForm.containsCharacters" />
|
</a-form-item>
|
<a-form-item label="禁用旧密码">
|
<jnpf-switch v-model:value="baseForm.disableOldPassword" />
|
</a-form-item>
|
<a-form-item label="禁用个数" v-if="baseForm.disableOldPassword">
|
<a-input-number
|
v-model:value="baseForm.disableTheNumberOfOldPasswords"
|
:min="1"
|
:precision="0"
|
addon-after="个"
|
@change="onNumberChange($event, 'disableTheNumberOfOldPasswords')" />
|
</a-form-item>
|
<a-form-item label="修改初始密码提醒">
|
<jnpf-switch v-model:value="baseForm.mandatoryModificationOfInitialPassword" />
|
</a-form-item>
|
<a-form-item required>
|
<template #label>新用户默认密码<BasicHelp text="修改后，新的默认密码仅针对后续新建的用户有效" /></template>
|
<a-input v-model:value="baseForm.newUserDefaultPassword" placeholder="请输入" />
|
</a-form-item>
|
<a-form-item label=" ">
|
<a-button type="primary" @click.prevent="handleSubmit" :loading="btnLoading">保存</a-button>
|
</a-form-item>
|
</a-col>
|
</a-row>
|
</a-tab-pane>
|
</a-tabs>
|
</a-form>
|
</div>
|
</div>
|
</template>
|
<style lang="scss" scoped>
|
.common-tip {
|
font-size: 14px;
|
line-height: 1;
|
color: var(--text-color-secondary);
|
}
|
|
.card-extra {
|
float: right;
|
padding: 8px 0;
|
font-size: 12px;
|
}
|
|
.card-item {
|
p {
|
line-height: 32px;
|
}
|
}
|
|
.checkbox {
|
flex-shrink: 0;
|
line-height: 32px;
|
}
|
</style>
|
