From fbec7321079717cda709230e1be145131e922466 Mon Sep 17 00:00:00 2001
From: Charles7c <charles7c@126.com>
Date: Wed, 26 Feb 2025 21:25:49 +0800
Subject: [PATCH] =?UTF-8?q?chore:=20=E4=BC=98=E5=8C=96=E7=B3=BB=E7=BB=9F?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/config/components/MailSetting.vue  | 61 +++++++++++----
 .../config/components/SecuritySetting.vue     | 75 +++++++++++++------
 .../{BasicSetting.vue => SiteSetting.vue}     | 31 ++++----
 src/views/system/config/index.vue             | 33 ++++----
 4 files changed, 131 insertions(+), 69 deletions(-)
 rename src/views/system/config/components/{BasicSetting.vue => SiteSetting.vue} (90%)

diff --git a/src/views/system/config/components/MailSetting.vue b/src/views/system/config/components/MailSetting.vue
index bb7fd88..b7b5abd 100644
--- a/src/views/system/config/components/MailSetting.vue
+++ b/src/views/system/config/components/MailSetting.vue
@@ -9,25 +9,56 @@
       :layout="width >= 500 ? 'horizontal' : 'vertical'"
       :disabled="!isUpdate"
       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-option label="SMTP" value="smtp" />
         </a-select>
       </a-form-item>
-      <a-form-item field="MAIL_HOST" :label="mailConfig.MAIL_HOST.name" hide-asterisk>
-        <a-input v-model.trim="form.MAIL_HOST" class="input-width" />
+      <a-form-item
+        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 field="MAIL_PORT" :label="mailConfig.MAIL_PORT.name" hide-asterisk>
-        <a-input-number v-model="form.MAIL_PORT" class="input-width" :min="0" />
+      <a-form-item
+        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 field="MAIL_USERNAME" :label="mailConfig.MAIL_USERNAME.name" hide-asterisk>
-        <a-input v-model.trim="form.MAIL_USERNAME" class="input-width" />
+      <a-form-item
+        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 field="MAIL_PASSWORD" :label="mailConfig.MAIL_PASSWORD?.name" hide-asterisk>
-        <a-input-password v-model.trim="form.MAIL_PASSWORD" class="input-width" />
+      <a-form-item
+        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 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
           v-model="form.MAIL_SSL_ENABLED"
           type="round"
@@ -39,10 +70,13 @@
         </a-switch>
       </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
       >
-        <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-space style="margin-bottom: 16px">
         <a-button v-if="!isUpdate" v-permission="['system:config:update']" type="primary" @click="onUpdate">
@@ -186,7 +220,8 @@ onMounted(() => {
   margin-bottom: 5px;
 }
 
-.input-width, :deep(.arco-select-view-single) {
+:deep(.form .arco-input-wrapper),
+:deep(.arco-select-view-single) {
   width: 220px;
 }
 </style>
diff --git a/src/views/system/config/components/SecuritySetting.vue b/src/views/system/config/components/SecuritySetting.vue
index 3c8e1f6..6892751 100644
--- a/src/views/system/config/components/SecuritySetting.vue
+++ b/src/views/system/config/components/SecuritySetting.vue
@@ -9,35 +9,49 @@
       :layout="width >= 500 ? 'horizontal' : 'vertical'"
       :disabled="!isUpdate"
       scroll-to-first-error
+      class="form"
     >
       <a-form-item
-        field="PASSWORD_ERROR_LOCK_COUNT" :label="securityConfig.PASSWORD_ERROR_LOCK_COUNT.name"
-        :help="securityConfig.PASSWORD_ERROR_LOCK_COUNT.description" hide-asterisk
+        field="PASSWORD_ERROR_LOCK_COUNT"
+        :label="securityConfig.PASSWORD_ERROR_LOCK_COUNT.name"
+        :help="securityConfig.PASSWORD_ERROR_LOCK_COUNT.description"
+        hide-asterisk
       >
         <a-input-number
-          v-model="form.PASSWORD_ERROR_LOCK_COUNT" class="input-width" :default-value="0" :precision="0"
-          :min="0" :max="10"
+          v-model="form.PASSWORD_ERROR_LOCK_COUNT"
+          :default-value="0"
+          :precision="0"
+          :min="0"
+          :max="10"
         >
           <template #append>次</template>
         </a-input-number>
       </a-form-item>
       <a-form-item
-        field="PASSWORD_ERROR_LOCK_MINUTES" :label="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.name"
-        :help="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.description" hide-asterisk
+        field="PASSWORD_ERROR_LOCK_MINUTES"
+        :label="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.name"
+        :help="securityConfig.PASSWORD_ERROR_LOCK_MINUTES.description"
+        hide-asterisk
       >
         <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"
         >
           <template #append>分钟</template>
         </a-input-number>
       </a-form-item>
       <a-form-item
-        field="PASSWORD_EXPIRATION_DAYS" :label="securityConfig.PASSWORD_EXPIRATION_DAYS.name"
-        :help="securityConfig.PASSWORD_EXPIRATION_DAYS.description" hide-asterisk
+        field="PASSWORD_EXPIRATION_DAYS"
+        :label="securityConfig.PASSWORD_EXPIRATION_DAYS.name"
+        :help="securityConfig.PASSWORD_EXPIRATION_DAYS.description"
+        hide-asterisk
       >
         <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"
         >
           <template #append>天</template>
@@ -45,43 +59,62 @@
       </a-form-item>
       <a-form-item
         :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
       >
         <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"
         >
           <template #append>天</template>
         </a-input-number>
       </a-form-item>
       <a-form-item
-        field="PASSWORD_REPETITION_TIMES" :label="securityConfig.PASSWORD_REPETITION_TIMES.name"
-        :help="securityConfig.PASSWORD_REPETITION_TIMES.description" hide-asterisk
+        field="PASSWORD_REPETITION_TIMES"
+        :label="securityConfig.PASSWORD_REPETITION_TIMES.name"
+        :help="securityConfig.PASSWORD_REPETITION_TIMES.description"
+        hide-asterisk
       >
         <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"
         >
           <template #append>次</template>
         </a-input-number>
       </a-form-item>
       <a-form-item
-        field="PASSWORD_MIN_LENGTH" :label="securityConfig.PASSWORD_MIN_LENGTH.name"
-        :help="securityConfig.PASSWORD_MIN_LENGTH.description" hide-asterisk
+        field="PASSWORD_MIN_LENGTH"
+        :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
         field="PASSWORD_ALLOW_CONTAIN_USERNAME"
         :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">
           <template #checked>是</template>
           <template #unchecked>否</template>
         </a-switch>
       </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">
           <template #checked>是</template>
           <template #unchecked>否</template>
@@ -138,7 +171,7 @@ const rules: FormInstance['rules'] = {
     {
       validator: (value, callback) => {
         if (form.PASSWORD_EXPIRATION_DAYS > 0 && value >= form.PASSWORD_EXPIRATION_DAYS) {
-          callback('密码到期前的提示时间应小于密码有效期')
+          callback('密码到期提醒时间应小于密码有效期')
         } else {
           callback()
         }
@@ -238,7 +271,7 @@ onMounted(() => {
   margin-bottom: 5px;
 }
 
-.input-width {
+:deep(.form .arco-input-wrapper) {
   width: 200px;
 }
 </style>
diff --git a/src/views/system/config/components/BasicSetting.vue b/src/views/system/config/components/SiteSetting.vue
similarity index 90%
rename from src/views/system/config/components/BasicSetting.vue
rename to src/views/system/config/components/SiteSetting.vue
index 6e3ec5e..317deb5 100644
--- a/src/views/system/config/components/BasicSetting.vue
+++ b/src/views/system/config/components/SiteSetting.vue
@@ -72,24 +72,23 @@
           </a-upload>
         </template>
       </a-form-item>
-      <a-form-item class="input-item" field="SITE_TITLE" :label="siteConfig.SITE_TITLE.name">
-        <a-input v-model.trim="form.SITE_TITLE" class="input-width" placeholder="请输入系统标题" :max-length="18" show-word-limit />
+      <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" placeholder="请输入系统名称" :max-length="18" show-word-limit />
       </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
           v-model.trim="form.SITE_DESCRIPTION"
-          class="input-width"
           placeholder="请输入系统描述"
           :auto-size="{ minRows: 1, maxRows: 3 }"
         />
       </a-form-item>
-      <a-form-item class="input-item" field="SITE_COPYRIGHT" :label="siteConfig.SITE_COPYRIGHT.name">
-        <a-input v-model.trim="form.SITE_COPYRIGHT" class="input-width" placeholder="请输入版权信息" />
+      <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" placeholder="请输入版权声明" />
       </a-form-item>
-      <a-form-item field="SITE_BEIAN" :label="siteConfig.SITE_BEIAN.name">
-        <a-input v-model.trim="form.SITE_BEIAN" class="input-width" placeholder="请输入备案号" :max-length="30" show-word-limit />
+      <a-form-item field="SITE_BEIAN" :label="siteConfig.SITE_BEIAN.name" :help="siteConfig.SITE_BEIAN.description">
+        <a-input v-model.trim="form.SITE_BEIAN" placeholder="请输入备案号" :max-length="30" show-word-limit />
       </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">
           <template #icon>
             <icon-edit />
@@ -144,9 +143,9 @@ const [form] = useResetReactive({
   SITE_COPYRIGHT: '',
 })
 const rules: FormInstance['rules'] = {
-  SITE_TITLE: [{ required: true, message: '请输入系统标题' }],
+  SITE_TITLE: [{ required: true, message: '请输入系统名称' }],
   SITE_DESCRIPTION: [{ required: true, message: '请输入系统描述' }],
-  SITE_COPYRIGHT: [{ required: true, message: '请输入版权信息' }],
+  SITE_COPYRIGHT: [{ required: true, message: '请输入版权声明' }],
 }
 
 const siteConfig = ref<SiteConfig>({
@@ -313,7 +312,8 @@ onMounted(() => {
   line-height: 46px;
 }
 
-.input-width {
+:deep(.form .arco-input-wrapper),
+:deep(.form .arco-textarea-wrapper) {
   width: 500px;
 }
 
@@ -327,9 +327,8 @@ onMounted(() => {
 }
 
 // responsive
-.mobile {
-  .input-width {
-    width: 100%;
-  }
+:deep(.mobile .form .arco-input-wrapper),
+:deep(.mobile .form .arco-textarea-wrapper) {
+  width: 100%;
 }
 </style>
diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue
index 4cd8889..ae28dfa 100644
--- a/src/views/system/config/index.vue
+++ b/src/views/system/config/index.vue
@@ -1,21 +1,16 @@
 <template>
   <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-tab-pane key="1">
-        <template #title><icon-settings /> 基础配置</template>
+      <a-tab-pane key="site">
+        <template #title><icon-apps /> 网站配置</template>
       </a-tab-pane>
-      <a-tab-pane key="2">
+      <a-tab-pane key="security">
         <template #title><icon-safe /> 安全配置</template>
       </a-tab-pane>
-      <a-tab-pane key="3">
+      <a-tab-pane key="mail">
         <template #title><icon-email /> 邮件配置</template>
       </a-tab-pane>
-      <a-tab-pane key="4">
+      <a-tab-pane key="login">
         <template #title><icon-lock /> 登录配置</template>
       </a-tab-pane>
     </a-tabs>
@@ -27,7 +22,7 @@
 
 <script setup lang="ts">
 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 MailSetting from './components/MailSetting.vue'
 import LoginSetting from './components/LoginSetting.vue'
@@ -35,27 +30,27 @@ import LoginSetting from './components/LoginSetting.vue'
 defineOptions({ name: 'SystemConfig' })
 
 const PanMap: Record<string, Component> = {
-  1: BasicSetting,
-  2: SecuritySetting,
-  3: MailSetting,
-  4: LoginSetting,
+  site: SiteSetting,
+  security: SecuritySetting,
+  mail: MailSetting,
+  login: LoginSetting,
 }
 
 const route = useRoute()
 const router = useRouter()
-const activeKey = ref('1')
+const activeKey = ref('site')
 watch(
   () => route.query,
   () => {
-    if (route.query.tabKey) {
-      activeKey.value = String(route.query.tabKey)
+    if (route.query.tab) {
+      activeKey.value = String(route.query.tab)
     }
   },
   { immediate: true },
 )
 const change = (key: string | number) => {
   activeKey.value = key as string
-  router.replace({ path: route.path, query: { tabKey: key } })
+  router.replace({ path: route.path, query: { tab: key } })
 }
 </script>