feat: add collapsed item support in configuration UI and update localization for more settings

Author: Soulter

astrbot/core/config/default.py

@@ -3487,11 +3487,13 @@ class ChatProviderTemplate(TypedDict):
                     "provider_tts_settings.dual_output": {
                         "description": "开启 TTS 时同时输出语音和文字内容",
                         "type": "bool",
+                        "collapsed": True,
                     },
                     "provider_settings.reachability_check": {
                         "description": "提供商可达性检测",
                         "type": "bool",
                         "hint": "/provider 命令列出模型时是否并发检测连通性。开启后会主动调用模型测试连通性，可能产生额外 token 消耗。",
+                        "collapsed": True,
                     },
                     "provider_settings.max_quoted_fallback_images": {
                         "description": "引用图片回退解析上限",
@@ -3500,6 +3502,7 @@ class ChatProviderTemplate(TypedDict):
                         "condition": {
                             "provider_settings.agent_runner_type": "local",
                         },
+                        "collapsed": True,
                     },
                     "provider_settings.quoted_message_parser.max_component_chain_depth": {
                         "description": "引用解析组件链深度",
@@ -3508,6 +3511,7 @@ class ChatProviderTemplate(TypedDict):
                         "condition": {
                             "provider_settings.agent_runner_type": "local",
                         },
+                        "collapsed": True,
                     },
                     "provider_settings.quoted_message_parser.max_forward_node_depth": {
                         "description": "引用解析转发节点深度",
@@ -3516,6 +3520,7 @@ class ChatProviderTemplate(TypedDict):
                         "condition": {
                             "provider_settings.agent_runner_type": "local",
                         },
+                        "collapsed": True,
                     },
                     "provider_settings.quoted_message_parser.max_forward_fetch": {
                         "description": "引用解析转发拉取上限",
@@ -3524,6 +3529,7 @@ class ChatProviderTemplate(TypedDict):
                         "condition": {
                             "provider_settings.agent_runner_type": "local",
                         },
+                        "collapsed": True,
                     },
                     "provider_settings.quoted_message_parser.warn_on_action_failure": {
                         "description": "引用解析 action 失败告警",
@@ -3532,6 +3538,7 @@ class ChatProviderTemplate(TypedDict):
                         "condition": {
                             "provider_settings.agent_runner_type": "local",
                         },
+                        "collapsed": True,
                     },
                 },
                 "condition": {

dashboard/src/components/shared/AstrBotConfigV4.vue

@@ -29,6 +29,7 @@ const props = defineProps({
 
 const { t } = useI18n()
 const { tm, getRaw } = useModuleI18n('features/config-metadata')
+const { tm: tmConfig } = useModuleI18n('features/config')
 
 const hintMarkdown = new MarkdownIt({
   linkify: true,
@@ -69,6 +70,7 @@ const getTranslatedLabels = (itemMeta) => {
 }
 
 const dialog = ref(false)
+const showCollapsedItems = ref(false)
 const currentEditingKey = ref('')
 const currentEditingLanguage = ref('json')
 const currentEditingTheme = ref('vs-light')
@@ -152,6 +154,36 @@ function shouldShowItem(itemMeta, itemKey) {
   return searchableText.includes(keyword)
 }
 
+function getVisibleItemEntries(collapsed = false) {
+  const sectionItems = props.metadata?.[props.metadataKey]?.items || {}
+  return Object.entries(sectionItems).filter(([itemKey, itemMeta]) => {
+    const isCollapsed = Boolean(itemMeta?.collapsed)
+    return isCollapsed === collapsed && shouldShowItem(itemMeta, itemKey)
+  })
+}
+
+function hasCollapsedItems() {
+  return getVisibleItemEntries(true).length > 0
+}
+
+function hasVisibleEntriesAfter(entries, currentIndex) {
+  return currentIndex < entries.length - 1
+}
+
+function areCollapsedItemsVisible() {
+  if (!hasCollapsedItems()) {
+    return false
+  }
+  if (String(props.searchKeyword || '').trim()) {
+    return true
+  }
+  return showCollapsedItems.value
+}
+
+function toggleCollapsedItems() {
+  showCollapsedItems.value = !showCollapsedItems.value
+}
+
 // 检查最外层的 object 是否应该显示
 function shouldShowSection() {
   const sectionMeta = props.metadata[props.metadataKey]
@@ -222,72 +254,153 @@ function getSpecialSubtype(value) {
 
     <!-- Object Type Configuration with JSON Selector Support -->
     <div v-if="metadata[metadataKey]?.type === 'object'" class="object-config">
-      <div v-for="(itemMeta, itemKey, index) in metadata[metadataKey].items" :key="itemKey" class="config-item">
-        <!-- Check if itemKey is a JSON selector -->
-        <template v-if="shouldShowItem(itemMeta, itemKey)">
-          <!-- JSON Selector Property -->
-          <v-row v-if="!itemMeta?.invisible" class="config-row">
-            <v-col cols="12" sm="6" class="property-info">
-              <v-list-item density="compact">
-                <v-list-item-title class="property-name">
-                  {{ translateIfKey(itemMeta?.description) || itemKey }}
-                  <span class="property-key">({{ itemKey }})</span>
-                </v-list-item-title>
-
-                <v-list-item-subtitle class="property-hint">
-                  <span v-if="itemMeta?.obvious_hint && itemMeta?.hint" class="important-hint">‼️</span>
-                  <span v-html="renderHint(itemMeta?.hint)"></span>
-                </v-list-item-subtitle>
-              </v-list-item>
-            </v-col>
-            <v-col cols="12" sm="6" class="config-input">
-              <TemplateListEditor
-                v-if="itemMeta?.type === 'template_list'"
-                v-model="createSelectorModel(itemKey).value"
-                :templates="itemMeta?.templates || {}"
-                class="config-field"
-              />
-              <ConfigItemRenderer
-                v-else
-                v-model="createSelectorModel(itemKey).value"
-                :item-meta="itemMeta || null"
-                :show-fullscreen-btn="!!itemMeta?.editor_mode"
-                @open-fullscreen="openEditorDialog(itemKey, iterable, itemMeta?.editor_theme, itemMeta?.editor_language)"
-              />
-            </v-col>
-          </v-row>
-
-          <!-- Plugin Set Selector 全宽显示区域 -->
-          <v-row v-if="!itemMeta?.invisible && itemMeta?._special === 'select_plugin_set'"
-            class="plugin-set-display-row">
-            <v-col cols="12" class="plugin-set-display">
-              <div v-if="createSelectorModel(itemKey).value && createSelectorModel(itemKey).value.length > 0"
-                class="selected-plugins-full-width">
-                <div class="plugins-header">
-                  <small class="text-grey">{{ t('core.shared.pluginSetSelector.selectedPluginsLabel') }}</small>
-                </div>
-                <div class="d-flex flex-wrap ga-2 mt-2">
-                  <v-chip v-for="plugin in (createSelectorModel(itemKey).value || [])" :key="plugin" size="small" label
-                    color="primary" variant="outlined">
-                    {{ plugin === '*' ? t('core.shared.pluginSetSelector.allPluginsLabel') : plugin }}
-                  </v-chip>
-                </div>
+      <div
+        v-for="([itemKey, itemMeta], index) in getVisibleItemEntries(false)"
+        :key="itemKey"
+        class="config-item"
+      >
+        <v-row v-if="!itemMeta?.invisible" class="config-row">
+          <v-col cols="12" sm="6" class="property-info">
+            <v-list-item density="compact">
+              <v-list-item-title class="property-name">
+                {{ translateIfKey(itemMeta?.description) || itemKey }}
+                <span class="property-key">({{ itemKey }})</span>
+              </v-list-item-title>
+
+              <v-list-item-subtitle class="property-hint">
+                <span v-if="itemMeta?.obvious_hint && itemMeta?.hint" class="important-hint">‼️</span>
+                <span v-html="renderHint(itemMeta?.hint)"></span>
+              </v-list-item-subtitle>
+            </v-list-item>
+          </v-col>
+          <v-col cols="12" sm="6" class="config-input">
+            <TemplateListEditor
+              v-if="itemMeta?.type === 'template_list'"
+              v-model="createSelectorModel(itemKey).value"
+              :templates="itemMeta?.templates || {}"
+              class="config-field"
+            />
+            <ConfigItemRenderer
+              v-else
+              v-model="createSelectorModel(itemKey).value"
+              :item-meta="itemMeta || null"
+              :show-fullscreen-btn="!!itemMeta?.editor_mode"
+              @open-fullscreen="openEditorDialog(itemKey, iterable, itemMeta?.editor_theme, itemMeta?.editor_language)"
+            />
+          </v-col>
+        </v-row>
+
+        <v-row v-if="!itemMeta?.invisible && itemMeta?._special === 'select_plugin_set'"
+          class="plugin-set-display-row">
+          <v-col cols="12" class="plugin-set-display">
+            <div v-if="createSelectorModel(itemKey).value && createSelectorModel(itemKey).value.length > 0"
+              class="selected-plugins-full-width">
+              <div class="plugins-header">
+                <small class="text-grey">{{ t('core.shared.pluginSetSelector.selectedPluginsLabel') }}</small>
+              </div>
+              <div class="d-flex flex-wrap ga-2 mt-2">
+                <v-chip v-for="plugin in (createSelectorModel(itemKey).value || [])" :key="plugin" size="small" label
+                  color="primary" variant="outlined">
+                  {{ plugin === '*' ? t('core.shared.pluginSetSelector.allPluginsLabel') : plugin }}
+                </v-chip>
               </div>
-            </v-col>
-          </v-row>
+            </div>
+          </v-col>
+        </v-row>
+
+        <v-row
+          v-if="!itemMeta?.invisible && itemMeta?._special === 'select_persona' && itemKey === 'provider_settings.default_personality'"
+          class="persona-preview-row"
+        >
+          <v-col cols="12" class="persona-preview-display">
+            <PersonaQuickPreview :model-value="createSelectorModel(itemKey).value" />
+          </v-col>
+        </v-row>
 
-          <!-- Default Persona Quick Preview 全宽显示区域 -->
-          <v-row
-            v-if="!itemMeta?.invisible && itemMeta?._special === 'select_persona' && itemKey === 'provider_settings.default_personality'"
-            class="persona-preview-row"
-          >
-            <v-col cols="12" class="persona-preview-display">
-              <PersonaQuickPreview :model-value="createSelectorModel(itemKey).value" />
-            </v-col>
-          </v-row>
-        </template>
         <v-divider class="config-divider"
-          v-if="shouldShowItem(itemMeta, itemKey) && hasVisibleItemsAfter(metadata[metadataKey].items, index)"></v-divider>
+          v-if="hasVisibleEntriesAfter(getVisibleItemEntries(false), index)"></v-divider>
+      </div>
+
+      <div v-if="hasCollapsedItems()" class="collapsed-config-section">
+        <div class="collapsed-config-toggle-row">
+          <span
+            class="collapsed-config-toggle"
+            @click="toggleCollapsedItems"
+          >
+            {{ tmConfig('sections.moreConfig') }}
+            <v-icon end size="18">
+              {{ areCollapsedItemsVisible() ? 'mdi-chevron-up' : 'mdi-chevron-down' }}
+            </v-icon>
+          </span>
+        </div>
+        <div v-if="areCollapsedItemsVisible()">
+            <div
+              v-for="([itemKey, itemMeta], index) in getVisibleItemEntries(true)"
+              :key="itemKey"
+              class="config-item"
+            >
+              <v-row v-if="!itemMeta?.invisible" class="config-row">
+                <v-col cols="12" sm="6" class="property-info">
+                  <v-list-item density="compact">
+                    <v-list-item-title class="property-name">
+                      {{ translateIfKey(itemMeta?.description) || itemKey }}
+                      <span class="property-key">({{ itemKey }})</span>
+                    </v-list-item-title>
+
+                    <v-list-item-subtitle class="property-hint">
+                      <span v-if="itemMeta?.obvious_hint && itemMeta?.hint" class="important-hint">‼️</span>
+                      <span v-html="renderHint(itemMeta?.hint)"></span>
+                    </v-list-item-subtitle>
+                  </v-list-item>
+                </v-col>
+                <v-col cols="12" sm="6" class="config-input">
+                  <TemplateListEditor
+                    v-if="itemMeta?.type === 'template_list'"
+                    v-model="createSelectorModel(itemKey).value"
+                    :templates="itemMeta?.templates || {}"
+                    class="config-field"
+                  />
+                  <ConfigItemRenderer
+                    v-else
+                    v-model="createSelectorModel(itemKey).value"
+                    :item-meta="itemMeta || null"
+                    :show-fullscreen-btn="!!itemMeta?.editor_mode"
+                    @open-fullscreen="openEditorDialog(itemKey, iterable, itemMeta?.editor_theme, itemMeta?.editor_language)"
+                  />
+                </v-col>
+              </v-row>
+
+              <v-row v-if="!itemMeta?.invisible && itemMeta?._special === 'select_plugin_set'"
+                class="plugin-set-display-row">
+                <v-col cols="12" class="plugin-set-display">
+                  <div v-if="createSelectorModel(itemKey).value && createSelectorModel(itemKey).value.length > 0"
+                    class="selected-plugins-full-width">
+                    <div class="plugins-header">
+                      <small class="text-grey">{{ t('core.shared.pluginSetSelector.selectedPluginsLabel') }}</small>
+                    </div>
+                    <div class="d-flex flex-wrap ga-2 mt-2">
+                      <v-chip v-for="plugin in (createSelectorModel(itemKey).value || [])" :key="plugin" size="small" label
+                        color="primary" variant="outlined">
+                        {{ plugin === '*' ? t('core.shared.pluginSetSelector.allPluginsLabel') : plugin }}
+                      </v-chip>
+                    </div>
+                  </div>
+                </v-col>
+              </v-row>
+
+              <v-row
+                v-if="!itemMeta?.invisible && itemMeta?._special === 'select_persona' && itemKey === 'provider_settings.default_personality'"
+                class="persona-preview-row"
+              >
+                <v-col cols="12" class="persona-preview-display">
+                  <PersonaQuickPreview :model-value="createSelectorModel(itemKey).value" />
+                </v-col>
+              </v-row>
+
+              <v-divider class="config-divider"
+                v-if="hasVisibleEntriesAfter(getVisibleItemEntries(true), index)"></v-divider>
+            </div>
+        </div>
       </div>
 
     </div>
@@ -460,6 +573,21 @@ function getSpecialSubtype(value) {
   padding: 12px;
 }
 
+.collapsed-config-section {
+  width: 100%;
+}
+
+.collapsed-config-toggle-row {
+  padding: 8px 8px 4px;
+}
+
+.collapsed-config-toggle {
+  min-height: auto;
+  cursor: pointer;
+  margin-left: 16px;
+  font-size: 0.875rem;
+}
+
 .plugins-header {
   margin-bottom: 4px;
 }

dashboard/src/i18n/locales/en-US/features/config.json

@@ -42,7 +42,8 @@
     "advanced": "Advanced Settings",
     "security": "Security Settings",
     "appearance": "Appearance Settings",
-    "notification": "Notification Settings"
+    "notification": "Notification Settings",
+    "moreConfig": "More Settings"
   },
   "general": {
     "botName": "Bot Name",

dashboard/src/i18n/locales/ru-RU/features/config.json

@@ -42,7 +42,8 @@
         "advanced": "Расширенные",
         "security": "Безопасность",
         "appearance": "Внешний вид",
-        "notification": "Уведомления"
+        "notification": "Уведомления",
+        "moreConfig": "Дополнительные настройки"
     },
     "general": {
         "botName": "Имя бота",

dashboard/src/i18n/locales/zh-CN/features/config.json

@@ -42,7 +42,8 @@
     "advanced": "高级设置",
     "security": "安全设置",
     "appearance": "外观设置",
-    "notification": "通知设置"
+    "notification": "通知设置",
+    "moreConfig": "更多配置"
   },
   "general": {
     "botName": "机器人名称",