chore: 优化系统配置

This commit is contained in:
2025-02-26 21:25:49 +08:00
parent dc6e0a4ff6
commit fbec732107
4 changed files with 131 additions and 69 deletions

View File

@@ -9,25 +9,56 @@
:layout="width >= 500 ? 'horizontal' : 'vertical'" :layout="width >= 500 ? 'horizontal' : 'vertical'"
:disabled="!isUpdate" :disabled="!isUpdate"
scroll-to-first-error scroll-to-first-error
class="form"
> >
<a-form-item field="MAIL_PROTOCOL" :label="mailConfig.MAIL_PROTOCOL.name" hide-asterisk> <a-form-item
field="MAIL_PROTOCOL"
:label="mailConfig.MAIL_PROTOCOL.name"
:help="mailConfig.MAIL_PROTOCOL.description"
hide-asterisk
>
<a-select v-model.trim="form.MAIL_PROTOCOL"> <a-select v-model.trim="form.MAIL_PROTOCOL">
<a-option label="SMTP" value="smtp" /> <a-option label="SMTP" value="smtp" />
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item field="MAIL_HOST" :label="mailConfig.MAIL_HOST.name" hide-asterisk> <a-form-item
<a-input v-model.trim="form.MAIL_HOST" class="input-width" /> field="MAIL_HOST"
:label="mailConfig.MAIL_HOST.name"
:help="mailConfig.MAIL_HOST.description"
hide-asterisk
>
<a-input v-model.trim="form.MAIL_HOST" />
</a-form-item> </a-form-item>
<a-form-item field="MAIL_PORT" :label="mailConfig.MAIL_PORT.name" hide-asterisk> <a-form-item
<a-input-number v-model="form.MAIL_PORT" class="input-width" :min="0" /> field="MAIL_PORT"
:label="mailConfig.MAIL_PORT.name"
:help="mailConfig.MAIL_PORT.description"
hide-asterisk
>
<a-input-number v-model="form.MAIL_PORT" :min="0" />
</a-form-item> </a-form-item>
<a-form-item field="MAIL_USERNAME" :label="mailConfig.MAIL_USERNAME.name" hide-asterisk> <a-form-item
<a-input v-model.trim="form.MAIL_USERNAME" class="input-width" /> field="MAIL_USERNAME"
:label="mailConfig.MAIL_USERNAME.name"
:help="mailConfig.MAIL_USERNAME.description"
hide-asterisk
>
<a-input v-model.trim="form.MAIL_USERNAME" />
</a-form-item> </a-form-item>
<a-form-item field="MAIL_PASSWORD" :label="mailConfig.MAIL_PASSWORD?.name" hide-asterisk> <a-form-item
<a-input-password v-model.trim="form.MAIL_PASSWORD" class="input-width" /> field="MAIL_PASSWORD"
:label="mailConfig.MAIL_PASSWORD?.name"
:help="mailConfig.MAIL_PASSWORD.description"
hide-asterisk
>
<a-input-password v-model.trim="form.MAIL_PASSWORD" />
</a-form-item> </a-form-item>
<a-form-item field="MAIL_SSL_ENABLED" :label="mailConfig.MAIL_SSL_ENABLED?.name" hide-asterisk> <a-form-item
field="MAIL_SSL_ENABLED"
:label="mailConfig.MAIL_SSL_ENABLED?.name"
:help="mailConfig.MAIL_SSL_ENABLED.description"
hide-asterisk
>
<a-switch <a-switch
v-model="form.MAIL_SSL_ENABLED" v-model="form.MAIL_SSL_ENABLED"
type="round" type="round"
@@ -39,10 +70,13 @@
</a-switch> </a-switch>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
v-if="form.MAIL_SSL_ENABLED === '1'" field="MAIL_SSL_PORT" :label="mailConfig.MAIL_SSL_PORT.name" v-if="form.MAIL_SSL_ENABLED === '1'"
field="MAIL_SSL_PORT"
:label="mailConfig.MAIL_SSL_PORT.name"
:help="mailConfig.MAIL_SSL_PORT.description"
hide-asterisk hide-asterisk
> >
<a-input-number v-model="form.MAIL_SSL_PORT" class="input-width" :min="0" /> <a-input-number v-model="form.MAIL_SSL_PORT" :min="0" />
</a-form-item> </a-form-item>
<a-space style="margin-bottom: 16px"> <a-space style="margin-bottom: 16px">
<a-button v-if="!isUpdate" v-permission="['system:config:update']" type="primary" @click="onUpdate"> <a-button v-if="!isUpdate" v-permission="['system:config:update']" type="primary" @click="onUpdate">
@@ -186,7 +220,8 @@ onMounted(() => {
margin-bottom: 5px; margin-bottom: 5px;
} }
.input-width, :deep(.arco-select-view-single) { :deep(.form .arco-input-wrapper),
:deep(.arco-select-view-single) {
width: 220px; width: 220px;
} }
</style> </style>

View File

@@ -9,35 +9,49 @@
:layout="width >= 500 ? 'horizontal' : 'vertical'" :layout="width >= 500 ? 'horizontal' : 'vertical'"
:disabled="!isUpdate" :disabled="!isUpdate"
scroll-to-first-error scroll-to-first-error
class="form"
> >
<a-form-item <a-form-item
field="PASSWORD_ERROR_LOCK_COUNT" :label="securityConfig.PASSWORD_ERROR_LOCK_COUNT.name" field="PASSWORD_ERROR_LOCK_COUNT"
:help="securityConfig.PASSWORD_ERROR_LOCK_COUNT.description" hide-asterisk :label="securityConfig.PASSWORD_ERROR_LOCK_COUNT.name"
:help="securityConfig.PASSWORD_ERROR_LOCK_COUNT.description"
hide-asterisk
> >
<a-input-number <a-input-number
v-model="form.PASSWORD_ERROR_LOCK_COUNT" class="input-width" :default-value="0" :precision="0" v-model="form.PASSWORD_ERROR_LOCK_COUNT"
:min="0" :max="10" :default-value="0"
:precision="0"
:min="0"
:max="10"
> >
<template #append></template> <template #append></template>
</a-input-number> </a-input-number>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
field="PASSWORD_ERROR_LOCK_MINUTES" :label="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.name" field="PASSWORD_ERROR_LOCK_MINUTES"
:help="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.description" hide-asterisk :label="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.name"
:help="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.description"
hide-asterisk
> >
<a-input-number <a-input-number
v-model="form.PASSWORD_ERROR_LOCK_MINUTES" class="input-width" :precision="0" :min="1" v-model="form.PASSWORD_ERROR_LOCK_MINUTES"
:precision="0"
:min="1"
:max="1440" :max="1440"
> >
<template #append>分钟</template> <template #append>分钟</template>
</a-input-number> </a-input-number>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
field="PASSWORD_EXPIRATION_DAYS" :label="securityConfig.PASSWORD_EXPIRATION_DAYS.name" field="PASSWORD_EXPIRATION_DAYS"
:help="securityConfig.PASSWORD_EXPIRATION_DAYS.description" hide-asterisk :label="securityConfig.PASSWORD_EXPIRATION_DAYS.name"
:help="securityConfig.PASSWORD_EXPIRATION_DAYS.description"
hide-asterisk
> >
<a-input-number <a-input-number
v-model="form.PASSWORD_EXPIRATION_DAYS" class="input-width" :precision="0" :min="0" v-model="form.PASSWORD_EXPIRATION_DAYS"
:precision="0"
:min="0"
:max="999" :max="999"
> >
<template #append></template> <template #append></template>
@@ -45,43 +59,62 @@
</a-form-item> </a-form-item>
<a-form-item <a-form-item
:label="securityConfig.PASSWORD_EXPIRATION_WARNING_DAYS.name" :label="securityConfig.PASSWORD_EXPIRATION_WARNING_DAYS.name"
field="PASSWORD_EXPIRATION_WARNING_DAYS" :help="securityConfig.PASSWORD_EXPIRATION_WARNING_DAYS.description" field="PASSWORD_EXPIRATION_WARNING_DAYS"
:help="securityConfig.PASSWORD_EXPIRATION_WARNING_DAYS.description"
hide-asterisk hide-asterisk
> >
<a-input-number <a-input-number
v-model="form.PASSWORD_EXPIRATION_WARNING_DAYS" class="input-width" :precision="0" :min="0" v-model="form.PASSWORD_EXPIRATION_WARNING_DAYS"
:precision="0"
:min="0"
:max="998" :max="998"
> >
<template #append></template> <template #append></template>
</a-input-number> </a-input-number>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
field="PASSWORD_REPETITION_TIMES" :label="securityConfig.PASSWORD_REPETITION_TIMES.name" field="PASSWORD_REPETITION_TIMES"
:help="securityConfig.PASSWORD_REPETITION_TIMES.description" hide-asterisk :label="securityConfig.PASSWORD_REPETITION_TIMES.name"
:help="securityConfig.PASSWORD_REPETITION_TIMES.description"
hide-asterisk
> >
<a-input-number <a-input-number
v-model="form.PASSWORD_REPETITION_TIMES" class="input-width" :precision="0" :min="3" v-model="form.PASSWORD_REPETITION_TIMES"
:precision="0"
:min="3"
:max="32" :max="32"
> >
<template #append></template> <template #append></template>
</a-input-number> </a-input-number>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
field="PASSWORD_MIN_LENGTH" :label="securityConfig.PASSWORD_MIN_LENGTH.name" field="PASSWORD_MIN_LENGTH"
:help="securityConfig.PASSWORD_MIN_LENGTH.description" hide-asterisk :label="securityConfig.PASSWORD_MIN_LENGTH.name"
:help="securityConfig.PASSWORD_MIN_LENGTH.description"
hide-asterisk
> >
<a-input-number v-model="form.PASSWORD_MIN_LENGTH" class="input-width" :precision="0" :min="8" :max="32" /> <a-input-number
v-model="form.PASSWORD_MIN_LENGTH"
:precision="0"
:min="8"
:max="32"
/>
</a-form-item> </a-form-item>
<a-form-item <a-form-item
field="PASSWORD_ALLOW_CONTAIN_USERNAME" field="PASSWORD_ALLOW_CONTAIN_USERNAME"
:label="securityConfig.PASSWORD_ALLOW_CONTAIN_USERNAME.name" :label="securityConfig.PASSWORD_ALLOW_CONTAIN_USERNAME.name"
:help="securityConfig.PASSWORD_ALLOW_CONTAIN_USERNAME.description"
> >
<a-switch v-model="form.PASSWORD_ALLOW_CONTAIN_USERNAME" type="round" :checked-value="1" :unchecked-value="0"> <a-switch v-model="form.PASSWORD_ALLOW_CONTAIN_USERNAME" type="round" :checked-value="1" :unchecked-value="0">
<template #checked></template> <template #checked></template>
<template #unchecked></template> <template #unchecked></template>
</a-switch> </a-switch>
</a-form-item> </a-form-item>
<a-form-item field="PASSWORD_REQUIRE_SYMBOLS" :label="securityConfig.PASSWORD_REQUIRE_SYMBOLS.name"> <a-form-item
field="PASSWORD_REQUIRE_SYMBOLS"
:label="securityConfig.PASSWORD_REQUIRE_SYMBOLS.name"
:help="securityConfig.PASSWORD_REQUIRE_SYMBOLS.description"
>
<a-switch v-model="form.PASSWORD_REQUIRE_SYMBOLS" type="round" :checked-value="1" :unchecked-value="0"> <a-switch v-model="form.PASSWORD_REQUIRE_SYMBOLS" type="round" :checked-value="1" :unchecked-value="0">
<template #checked></template> <template #checked></template>
<template #unchecked></template> <template #unchecked></template>
@@ -138,7 +171,7 @@ const rules: FormInstance['rules'] = {
{ {
validator: (value, callback) => { validator: (value, callback) => {
if (form.PASSWORD_EXPIRATION_DAYS > 0 && value >= form.PASSWORD_EXPIRATION_DAYS) { if (form.PASSWORD_EXPIRATION_DAYS > 0 && value >= form.PASSWORD_EXPIRATION_DAYS) {
callback('密码到期前的提示时间应小于密码有效期') callback('密码到期提醒时间应小于密码有效期')
} else { } else {
callback() callback()
} }
@@ -238,7 +271,7 @@ onMounted(() => {
margin-bottom: 5px; margin-bottom: 5px;
} }
.input-width { :deep(.form .arco-input-wrapper) {
width: 200px; width: 200px;
} }
</style> </style>

View File

@@ -72,24 +72,23 @@
</a-upload> </a-upload>
</template> </template>
</a-form-item> </a-form-item>
<a-form-item class="input-item" field="SITE_TITLE" :label="siteConfig.SITE_TITLE.name"> <a-form-item class="input-item" field="SITE_TITLE" :label="siteConfig.SITE_TITLE.name" :help="siteConfig.SITE_TITLE.description">
<a-input v-model.trim="form.SITE_TITLE" class="input-width" placeholder="请输入系统标题" :max-length="18" show-word-limit /> <a-input v-model.trim="form.SITE_TITLE" placeholder="请输入系统名称" :max-length="18" show-word-limit />
</a-form-item> </a-form-item>
<a-form-item class="input-item" field="SITE_DESCRIPTION" :label="siteConfig.SITE_DESCRIPTION.name"> <a-form-item class="input-item" field="SITE_DESCRIPTION" :label="siteConfig.SITE_DESCRIPTION.name" :help="siteConfig.SITE_DESCRIPTION.description">
<a-textarea <a-textarea
v-model.trim="form.SITE_DESCRIPTION" v-model.trim="form.SITE_DESCRIPTION"
class="input-width"
placeholder="请输入系统描述" placeholder="请输入系统描述"
:auto-size="{ minRows: 1, maxRows: 3 }" :auto-size="{ minRows: 1, maxRows: 3 }"
/> />
</a-form-item> </a-form-item>
<a-form-item class="input-item" field="SITE_COPYRIGHT" :label="siteConfig.SITE_COPYRIGHT.name"> <a-form-item class="input-item" field="SITE_COPYRIGHT" :label="siteConfig.SITE_COPYRIGHT.name" :help="siteConfig.SITE_COPYRIGHT.description">
<a-input v-model.trim="form.SITE_COPYRIGHT" class="input-width" placeholder="请输入版权信息" /> <a-input v-model.trim="form.SITE_COPYRIGHT" placeholder="请输入版权声明" />
</a-form-item> </a-form-item>
<a-form-item field="SITE_BEIAN" :label="siteConfig.SITE_BEIAN.name"> <a-form-item field="SITE_BEIAN" :label="siteConfig.SITE_BEIAN.name" :help="siteConfig.SITE_BEIAN.description">
<a-input v-model.trim="form.SITE_BEIAN" class="input-width" placeholder="请输入备案号" :max-length="30" show-word-limit /> <a-input v-model.trim="form.SITE_BEIAN" placeholder="请输入备案号" :max-length="30" show-word-limit />
</a-form-item> </a-form-item>
<a-space style="margin-bottom: 16px"> <a-space style="margin-top: 16px">
<a-button v-if="!isUpdate" v-permission="['system:config:update']" type="primary" @click="onUpdate"> <a-button v-if="!isUpdate" v-permission="['system:config:update']" type="primary" @click="onUpdate">
<template #icon> <template #icon>
<icon-edit /> <icon-edit />
@@ -144,9 +143,9 @@ const [form] = useResetReactive({
SITE_COPYRIGHT: '', SITE_COPYRIGHT: '',
}) })
const rules: FormInstance['rules'] = { const rules: FormInstance['rules'] = {
SITE_TITLE: [{ required: true, message: '请输入系统标题' }], SITE_TITLE: [{ required: true, message: '请输入系统名称' }],
SITE_DESCRIPTION: [{ required: true, message: '请输入系统描述' }], SITE_DESCRIPTION: [{ required: true, message: '请输入系统描述' }],
SITE_COPYRIGHT: [{ required: true, message: '请输入版权信息' }], SITE_COPYRIGHT: [{ required: true, message: '请输入版权声明' }],
} }
const siteConfig = ref<SiteConfig>({ const siteConfig = ref<SiteConfig>({
@@ -313,7 +312,8 @@ onMounted(() => {
line-height: 46px; line-height: 46px;
} }
.input-width { :deep(.form .arco-input-wrapper),
:deep(.form .arco-textarea-wrapper) {
width: 500px; width: 500px;
} }
@@ -327,9 +327,8 @@ onMounted(() => {
} }
// responsive // responsive
.mobile { :deep(.mobile .form .arco-input-wrapper),
.input-width { :deep(.mobile .form .arco-textarea-wrapper) {
width: 100%; width: 100%;
}
} }
</style> </style>

View File

@@ -1,21 +1,16 @@
<template> <template>
<div class="gi_table_page"> <div class="gi_table_page">
<!-- <a-row justify="space-between" align="center" class="header page_header">
<a-space wrap>
<div class="title">系统配置</div>
</a-space>
</a-row> -->
<a-tabs v-model:active-key="activeKey" type="card-gutter" size="large" @change="change"> <a-tabs v-model:active-key="activeKey" type="card-gutter" size="large" @change="change">
<a-tab-pane key="1"> <a-tab-pane key="site">
<template #title><icon-settings /> 基础配置</template> <template #title><icon-apps /> 网站配置</template>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2"> <a-tab-pane key="security">
<template #title><icon-safe /> 安全配置</template> <template #title><icon-safe /> 安全配置</template>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="3"> <a-tab-pane key="mail">
<template #title><icon-email /> 邮件配置</template> <template #title><icon-email /> 邮件配置</template>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="4"> <a-tab-pane key="login">
<template #title><icon-lock /> 登录配置</template> <template #title><icon-lock /> 登录配置</template>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
@@ -27,7 +22,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import BasicSetting from './components/BasicSetting.vue' import SiteSetting from './components/SiteSetting.vue'
import SecuritySetting from './components/SecuritySetting.vue' import SecuritySetting from './components/SecuritySetting.vue'
import MailSetting from './components/MailSetting.vue' import MailSetting from './components/MailSetting.vue'
import LoginSetting from './components/LoginSetting.vue' import LoginSetting from './components/LoginSetting.vue'
@@ -35,27 +30,27 @@ import LoginSetting from './components/LoginSetting.vue'
defineOptions({ name: 'SystemConfig' }) defineOptions({ name: 'SystemConfig' })
const PanMap: Record<string, Component> = { const PanMap: Record<string, Component> = {
1: BasicSetting, site: SiteSetting,
2: SecuritySetting, security: SecuritySetting,
3: MailSetting, mail: MailSetting,
4: LoginSetting, login: LoginSetting,
} }
const route = useRoute() const route = useRoute()
const router = useRouter() const router = useRouter()
const activeKey = ref('1') const activeKey = ref('site')
watch( watch(
() => route.query, () => route.query,
() => { () => {
if (route.query.tabKey) { if (route.query.tab) {
activeKey.value = String(route.query.tabKey) activeKey.value = String(route.query.tab)
} }
}, },
{ immediate: true }, { immediate: true },
) )
const change = (key: string | number) => { const change = (key: string | number) => {
activeKey.value = key as string activeKey.value = key as string
router.replace({ path: route.path, query: { tabKey: key } }) router.replace({ path: route.path, query: { tab: key } })
} }
</script> </script>