@done-coding/admin-core 0.27.0 → 0.27.1-alpha.0

package/es/index.mjs

@@ -31,7 +31,8 @@ import { default as default32 } from "./components/misc/TriggerAutoImport.vue.mj
 import { default as default33 } from "./components/display/WatchSize.vue.mjs";
 import { APP_API_LIST_MODEL_KEY_CONFIG } from "./config/list-model.mjs";
 import { APP_GLOBAL_IMAGE_PREVIEW_KEY, APP_GLOBAL_VIDEO_PREVIEW_KEY, GLOBAL_MODAL_REMOTE_KEY } from "./components/modal/modal-global-keys.mjs";
-import { APP_LAYOUT_APP_STORE_KEY, APP_LAYOUT_BRIDGE_KEY, APP_LAYOUT_USER_STORE_KEY, APP_PAGE_CONTENT_INSET, APP_PAGE_LIST_DETAIL_CONTEXT, BODY_CONTENT_VIEWPORT_HEIGHT, BODY_CONTENT_VIEWPORT_INSET, BODY_CONTENT_VIEWPORT_RECT, CORE_BRIDGE_KEY, FORM_NEST_REGISTRY_KEY, NEST_LAYOUT_SCALE_KEY, SCOPE_VIEWPORT_MAX_HEIGHT, TABS_MAIN_VISUAL_LEVEL, getModalShelfInjectionKey } from "./inject/key.mjs";
+import { APP_LAYOUT_APP_STORE_KEY, APP_LAYOUT_BRIDGE_KEY, APP_LAYOUT_USER_STORE_KEY, APP_PAGE_CONTENT_INSET, APP_PAGE_LIST_DETAIL_CONTEXT, BODY_CONTENT_VIEWPORT_HEIGHT, BODY_CONTENT_VIEWPORT_INSET, BODY_CONTENT_VIEWPORT_RECT, CORE_BRIDGE_KEY, FORM_NEST_REGISTRY_KEY, FORM_VALIDATE_ERROR_KEYS, NEST_LAYOUT_SCALE_KEY, SCOPE_VIEWPORT_MAX_HEIGHT, TABS_MAIN_VISUAL_LEVEL, getModalShelfInjectionKey } from "./inject/key.mjs";
+import { APP_PAGE_LIST_LAYOUT_RECOMMENDED } from "./components/app-layout/app-page-recommended.mjs";
 import { APP_PAGE_SLOT_Z_INDEX, computeAppPageContentInset, computeAppPageReducedViewportHeight, computeAppPageReducedViewportWidth, computeAppPageSlotShimStyles, computeAppPageSlotStyles } from "./components/app-layout/app-page-geometry.mjs";
 import { default as default34 } from "./components/display/ActionConfirm.vue.mjs";
 import { default as default35 } from "./components/app-layout/AppAside.vue.mjs";
@@ -48,42 +49,45 @@ import { default as default45 } from "./components/misc/AutoRefresh.vue.mjs";
 import { default as default46 } from "./components/misc/AutoRefreshGroup.vue.mjs";
 import { BADGE_MASK_KINDS } from "./bridge/badge.mjs";
 import { default as default47 } from "./components/display/BadgeMark.vue.mjs";
+import { COLLAPSED_CLASS, swiftFormItemDivider, swiftFormItemGroup } from "./components/form/group.mjs";
 import { CORE_VIEWPORT_DECOR_ZINDEX_ABOVE, CORE_VIEWPORT_DECOR_ZINDEX_BELOW } from "./components/app-layout/viewport.mjs";
 import { default as default48, default as default49 } from "./components/modal/ModalConfirm.vue.mjs";
 import { DC_SLOT_ATTR, SlotRegion, parseSlotRegion } from "./config/slot-region.mjs";
 import { default as default50 } from "./components/data-view/DataGridView.vue.mjs";
+import { default as default51 } from "./components/display/DragFloat.vue.mjs";
 import { EXPORT_MAX_LIMIT, OPERATE_COLUMN_PROP, exportCSV, pickExportColumns } from "./utils/export.mjs";
 import { FORM_CONFIG_SELECT_ALL_VALUE, getConfirmPasswordRule, passwordRule, setFormComponentType } from "./helpers/form.mjs";
-import { FORM_ITEM_CHANGE_LOADING, NEST_LAYOUT_TIERS, ceilToTier, generateFormData, getBlurSubmit, getChangeSubmit, getDatePickerShortcuts, getEnterSubmit, getPlaceholder, getVModelSugar, parseFormData, resolveFormLayout, resolveLayoutSpan, setInputComponent, setSelectComponent, stringifyFormData, swiftFormItemConfig } from "./components/form/utils.mjs";
-import { default as default51 } from "./components/form/FormActiveFilter.vue.mjs";
-import { default as default52 } from "./components/form/FormItemNestForm.vue.mjs";
-import { default as default53 } from "./components/form/FormItemNestFormList.vue.mjs";
-import { default as default54 } from "./components/form/FormMain.vue.mjs";
-import { default as default55 } from "./components/form/FormSearch.vue.mjs";
-import { default as default56 } from "./components/form/FormShadowCloneDispatch.vue.mjs";
-import { default as default57 } from "./components/form/FormSortSwitch.vue.mjs";
-import { default as default58 } from "./components/form/FormSortSwitchGroup.vue.mjs";
-import { default as default59 } from "./components/form/FormSubmitPanel.vue.mjs";
-import { default as default60 } from "./components/form/FormUpload.vue.mjs";
-import { default as default61 } from "./components/form/FormUploadAudio.vue.mjs";
-import { default as default62 } from "./components/form/FormUploadImage.vue.mjs";
-import { default as default63 } from "./components/form/FormUploadVideo.vue.mjs";
-import { default as default64 } from "./components/form/FormVerifyImage.vue.mjs";
-import { default as default65 } from "./components/data-view/InfiniteListView.vue.mjs";
-import { default as default66, default as default67 } from "./components/list-layout/ListLayout.vue.mjs";
-import { default as default68 } from "./components/modal/ModalVideoPreview.vue.mjs";
-import { default as default69 } from "./components/panel/PanelEditSwitch.vue.mjs";
-import { default as default70 } from "./components/panel/PanelItem.vue.mjs";
-import { default as default71 } from "./components/panel/PanelItemNestForm.vue.mjs";
-import { default as default72 } from "./components/panel/PanelMain.vue.mjs";
+import { FORM_ITEM_CHANGE_LOADING, NEST_LAYOUT_TIERS, ceilToTier, checkFormItemIsIgnore, generateFormData, getBlurSubmit, getChangeSubmit, getDatePickerShortcuts, getEnterSubmit, getPlaceholder, getVModelSugar, parseFormData, patchFormData, resolveFormLayout, resolveLayoutSpan, setInputComponent, setSelectComponent, stringifyFormData, swiftFormItemConfig } from "./components/form/utils.mjs";
+import { default as default52 } from "./components/form/FormActiveFilter.vue.mjs";
+import { default as default53 } from "./components/form/FormItemNestForm.vue.mjs";
+import { default as default54 } from "./components/form/FormItemNestFormList.vue.mjs";
+import { default as default55 } from "./components/form/FormMain.vue.mjs";
+import { default as default56 } from "./components/form/FormSearch.vue.mjs";
+import { default as default57 } from "./components/form/FormShadowCloneDispatch.vue.mjs";
+import { default as default58 } from "./components/form/FormSortSwitch.vue.mjs";
+import { default as default59 } from "./components/form/FormSortSwitchGroup.vue.mjs";
+import { default as default60 } from "./components/form/FormSubmitPanel.vue.mjs";
+import { default as default61 } from "./components/form/FormUpload.vue.mjs";
+import { default as default62 } from "./components/form/FormUploadAudio.vue.mjs";
+import { default as default63 } from "./components/form/FormUploadImage.vue.mjs";
+import { default as default64 } from "./components/form/FormUploadVideo.vue.mjs";
+import { default as default65 } from "./components/form/FormVerifyImage.vue.mjs";
+import { GAP_SCALE_RUNG, gapScaleBase, gapScaleValue } from "./utils/gap-scale.mjs";
+import { default as default66 } from "./components/data-view/InfiniteListView.vue.mjs";
+import { default as default67, default as default68 } from "./components/list-layout/ListLayout.vue.mjs";
+import { default as default69 } from "./components/modal/ModalVideoPreview.vue.mjs";
+import { default as default70 } from "./components/panel/PanelEditSwitch.vue.mjs";
+import { default as default71 } from "./components/panel/PanelItem.vue.mjs";
+import { default as default72 } from "./components/panel/PanelItemNestForm.vue.mjs";
+import { default as default73 } from "./components/panel/PanelMain.vue.mjs";
 import { ROUTE_MODULE_LEVEL, TabsMainReplaceQueryKey } from "./config/route.mjs";
-import { default as default73 } from "./components/slot-layout/SlotLayoutFlowAside.vue.mjs";
+import { default as default74 } from "./components/slot-layout/SlotLayoutFlowAside.vue.mjs";
 import { TABLE_COLUMN_KEY_OPERATE, TABLE_COLUMN_KEY_SELECTION } from "./components/table/constants.mjs";
-import { default as default74 } from "./components/table/TableMain.vue.mjs";
-import { default as default75 } from "./components/table/TableSkeleton.vue.mjs";
-import { default as default76 } from "./components/table/TableToolbar.vue.mjs";
-import { default as default77 } from "./components/modal/VideoPreviewTrigger.vue.mjs";
-import { default as default78 } from "./components/view-layout/ViewLayout.vue.mjs";
+import { default as default75 } from "./components/table/TableMain.vue.mjs";
+import { default as default76 } from "./components/table/TableSkeleton.vue.mjs";
+import { default as default77 } from "./components/table/TableToolbar.vue.mjs";
+import { default as default78 } from "./components/modal/VideoPreviewTrigger.vue.mjs";
+import { default as default79 } from "./components/view-layout/ViewLayout.vue.mjs";
 import { buildRhythmCss, useCoreThemeApply } from "./hooks/use-theme-apply.mjs";
 import { checkLogin } from "./router/guard/login.mjs";
 import { checkPermission } from "./router/guard/permission.mjs";
@@ -96,15 +100,16 @@ import { createRoutePermissionStore } from "./store/router-permission.mjs";
 import { createStorageWithNamespace } from "./bridge/storage.mjs";
 import { createUseState } from "./bridge/state.mjs";
 import { createUserStore } from "./store/user.mjs";
-import { domClosestScrollableAncestor, domClosestStickyScrollport } from "./utils/dom.mjs";
+import { domClosestScrollableAncestor, domClosestStickyScrollport, domScrollIntoViewport } from "./utils/dom.mjs";
 import { flatRouteMetaResolveRaw, getRoutePermissionKey } from "./utils/router.mjs";
+import { getFormAiSchema, resolveFormAiFormDescription } from "./components/form/ai-schema.mjs";
 import { getId } from "./utils/id.mjs";
 import { nestFormItem } from "./components/form/nest-form-item.mjs";
 import { nestFormItemList } from "./components/form/nest-form-item-list.mjs";
 import { nestPanelForm } from "./components/panel/nest-panel-form.mjs";
 import { nestPanelItem } from "./components/panel/nest-panel-item.mjs";
 import { resolveBreakpointByWidth, resolveRootEl, useCustomBreakpoint } from "./hooks/use-custom-breakpoint.mjs";
-import { themeScaleDerive, themeScaleMix, themeScaleParseHex, themeScaleToRgba } from "./utils/theme-scale.mjs";
+import { themeScaleDerive, themeScaleIsNearBlack, themeScaleMix, themeScalePageColor, themeScaleParseHex, themeScaleSurfaceColor, themeScaleToRgba } from "./utils/theme-scale.mjs";
 import { timeCountDown } from "./utils/time.mjs";
 import { useActivated, useActivatedEvent, useActivatedExec } from "./hooks/activated.mjs";
 import { useBreakpoint } from "./hooks/use-breakpoint.mjs";
@@ -127,6 +132,7 @@ export {
   APP_LAYOUT_USER_STORE_KEY,
   APP_PAGE_CONTENT_INSET,
   APP_PAGE_LIST_DETAIL_CONTEXT,
+  APP_PAGE_LIST_LAYOUT_RECOMMENDED,
   APP_PAGE_SLOT_Z_INDEX,
   default2 as ActionBtn,
   default3 as ActionBtnGroup,
@@ -150,6 +156,7 @@ export {
   BODY_CONTENT_VIEWPORT_RECT,
   default47 as BadgeMark,
   default5 as BooleanTag,
+  COLLAPSED_CLASS,
   CORE_BRIDGE_KEY,
   CORE_VIEWPORT_DECOR_ZINDEX_ABOVE,
   CORE_VIEWPORT_DECOR_ZINDEX_BELOW,
@@ -157,40 +164,43 @@ export {
   DC_SLOT_ATTR,
   default50 as DataGridView,
   default6 as DetailModal,
+  default51 as DragFloat,
   EXPORT_MAX_LIMIT,
   FORM_CONFIG_SELECT_ALL_VALUE,
   FORM_ITEM_CHANGE_LOADING,
   FORM_NEST_REGISTRY_KEY,
-  default51 as FormActiveFilter,
+  FORM_VALIDATE_ERROR_KEYS,
+  default52 as FormActiveFilter,
   default8 as FormInput,
   default9 as FormInputShadowClone,
-  default52 as FormItemNestForm,
-  default53 as FormItemNestFormList,
-  default54 as FormMain,
+  default53 as FormItemNestForm,
+  default54 as FormItemNestFormList,
+  default55 as FormMain,
   default10 as FormModal,
   default12 as FormRadioGroup,
-  default55 as FormSearch,
+  default56 as FormSearch,
   default13 as FormSelect,
   default14 as FormSelectShadowClone,
-  default56 as FormShadowCloneDispatch,
-  default57 as FormSortSwitch,
-  default58 as FormSortSwitchGroup,
+  default57 as FormShadowCloneDispatch,
+  default58 as FormSortSwitch,
+  default59 as FormSortSwitchGroup,
   default15 as FormSubmitBtn,
-  default59 as FormSubmitPanel,
+  default60 as FormSubmitPanel,
   default16 as FormTree,
-  default60 as FormUpload,
-  default61 as FormUploadAudio,
-  default62 as FormUploadImage,
-  default63 as FormUploadVideo,
+  default61 as FormUpload,
+  default62 as FormUploadAudio,
+  default63 as FormUploadImage,
+  default64 as FormUploadVideo,
   default17 as FormVerifyCode,
-  default64 as FormVerifyImage,
+  default65 as FormVerifyImage,
+  GAP_SCALE_RUNG,
   GLOBAL_MODAL_REMOTE_KEY,
   default18 as HeightProvider,
   default19 as IconHammer,
   default20 as ImagePreviewTrigger,
-  default65 as InfiniteListView,
-  default66 as ListLayout,
-  default67 as ListPage,
+  default66 as InfiniteListView,
+  default67 as ListLayout,
+  default68 as ListPage,
   default21 as MenuItemSub,
   default22 as MenuTree,
   default49 as ModalConfirm,
@@ -199,37 +209,38 @@ export {
   default23 as ModalImagePreview,
   default24 as ModalPorter,
   default25 as ModalShelf,
-  default68 as ModalVideoPreview,
+  default69 as ModalVideoPreview,
   NEST_LAYOUT_SCALE_KEY,
   NEST_LAYOUT_TIERS,
   OPERATE_COLUMN_PROP,
-  default69 as PanelEditSwitch,
-  default70 as PanelItem,
-  default71 as PanelItemNestForm,
+  default70 as PanelEditSwitch,
+  default71 as PanelItem,
+  default72 as PanelItemNestForm,
   default26 as PanelItemNestPanel,
-  default72 as PanelMain,
+  default73 as PanelMain,
   ROUTE_MODULE_LEVEL,
   SCOPE_VIEWPORT_MAX_HEIGHT,
   default27 as SelectModule,
   default28 as ShadowClone,
-  default73 as SlotLayoutFlowAside,
+  default74 as SlotLayoutFlowAside,
   default29 as SlotLayoutTemplate,
   SlotRegion,
   TABLE_COLUMN_KEY_OPERATE,
   TABLE_COLUMN_KEY_SELECTION,
   TABS_MAIN_VISUAL_LEVEL,
   default30 as TableEmpty,
-  default74 as TableMain,
-  default75 as TableSkeleton,
-  default76 as TableToolbar,
+  default75 as TableMain,
+  default76 as TableSkeleton,
+  default77 as TableToolbar,
   default31 as TabsMain,
   TabsMainReplaceQueryKey,
   default32 as TriggerAutoImport,
-  default77 as VideoPreviewTrigger,
-  default78 as ViewLayout,
+  default78 as VideoPreviewTrigger,
+  default79 as ViewLayout,
   default33 as WatchSize,
   buildRhythmCss,
   ceilToTier,
+  checkFormItemIsIgnore,
   checkLogin,
   checkPermission,
   computeAppPageContentInset,
@@ -250,15 +261,19 @@ export {
   createUserStore,
   domClosestScrollableAncestor,
   domClosestStickyScrollport,
+  domScrollIntoViewport,
   exportCSV,
   fetchListAll,
   flatRouteMetaResolveRaw,
+  gapScaleBase,
+  gapScaleValue,
   generateFormData,
   getBlurSubmit,
   getChangeSubmit,
   getConfirmPasswordRule,
   getDatePickerShortcuts,
   getEnterSubmit,
+  getFormAiSchema,
   getId,
   getModalShelfInjectionKey,
   getPlaceholder,
@@ -271,8 +286,10 @@ export {
   parseFormData,
   parseSlotRegion,
   passwordRule,
+  patchFormData,
   pickExportColumns,
   resolveBreakpointByWidth,
+  resolveFormAiFormDescription,
   resolveFormLayout,
   resolveLayoutSpan,
   resolveRootEl,
@@ -281,9 +298,14 @@ export {
   setSelectComponent,
   stringifyFormData,
   swiftFormItemConfig,
+  swiftFormItemDivider,
+  swiftFormItemGroup,
   themeScaleDerive,
+  themeScaleIsNearBlack,
   themeScaleMix,
+  themeScalePageColor,
   themeScaleParseHex,
+  themeScaleSurfaceColor,
   themeScaleToRgba,
   timeCountDown,
   useActivated,

package/es/inject/key.mjs

@@ -35,6 +35,9 @@ const APP_LAYOUT_BRIDGE_KEY = Symbol.for(
 const CORE_BRIDGE_KEY = Symbol.for(
   nsKey("CORE_BRIDGE_KEY")
 );
+const FORM_VALIDATE_ERROR_KEYS = Symbol.for(
+  nsKey("FORM_VALIDATE_ERROR_KEYS")
+);
 const FORM_NEST_REGISTRY_KEY = Symbol.for(
   nsKey("FORM_NEST_REGISTRY")
 );
@@ -55,6 +58,7 @@ export {
   BODY_CONTENT_VIEWPORT_RECT,
   CORE_BRIDGE_KEY,
   FORM_NEST_REGISTRY_KEY,
+  FORM_VALIDATE_ERROR_KEYS,
   NEST_LAYOUT_SCALE_KEY,
   SCOPE_VIEWPORT_MAX_HEIGHT,
   TABS_MAIN_VISUAL_LEVEL,

package/es/store/app.mjs

@@ -1,6 +1,7 @@
 import { defineStore } from "pinia";
 import { useRoute } from "vue-router";
 import { computed, ref } from "vue";
+import { gapScaleValue } from "../utils/gap-scale.mjs";
 function createAppStore(deps) {
   const { bridge } = deps;
   const storeSetup = () => {
@@ -59,7 +60,7 @@ function createAppStore(deps) {
     const bodyShimPadding = computed(
       () => {
         var _a;
-        return ((_a = pageLayout.value) == null ? void 0 : _a.bodyShimPadding) ?? bridge.APP_LAYOUT_BODY_CONFIG.shimPadding;
+        return ((_a = pageLayout.value) == null ? void 0 : _a.bodyShimPadding) ?? bridge.APP_LAYOUT_BODY_CONFIG.shimPadding ?? 0;
       }
     );
     const viewportConfigEffective = computed(
@@ -78,8 +79,22 @@ function createAppStore(deps) {
       var _a;
       return ((_a = pageLayout.value) == null ? void 0 : _a.noAnimation) ?? false;
     });
-    const gapV = computed(() => bridge.APP_LAYOUT_GAP_CONFIG.size);
+    const gapV = computed(
+      () => gapScaleValue(
+        bridge.APP_LAYOUT_GAP_CONFIG.size,
+        "module",
+        bridge.themeDensity.value
+      )
+    );
+    const outerV = computed(
+      () => gapScaleValue(
+        bridge.APP_LAYOUT_GAP_CONFIG.size,
+        "outer",
+        bridge.themeDensity.value
+      )
+    );
     const gpx = computed(() => `${gapV.value}px`);
+    const outerPx = computed(() => `${outerV.value}px`);
     const headerStyle = computed(() => {
       const cfg = bridge.APP_LAYOUT_HEADER_CONFIG;
       return {
@@ -97,6 +112,9 @@ function createAppStore(deps) {
     const contentRowTop = computed(
       () => hasHeader.value ? `calc(${viewportPadding.value.top} + ${gpx.value} + ${headerStyle.value.height} + ${gpx.value})` : `calc(${viewportPadding.value.top} + ${gpx.value})`
     );
+    const contentTop = computed(
+      () => hasHeader.value ? `calc(${viewportPadding.value.top} + ${gpx.value} + ${headerStyle.value.height} + ${outerPx.value})` : `calc(${viewportPadding.value.top} + ${outerPx.value})`
+    );
     const footerStyle = computed(() => {
       const cfg = bridge.APP_LAYOUT_FOOTER_CONFIG;
       return {
@@ -143,34 +161,50 @@ function createAppStore(deps) {
     });
     const bodyStyle = computed(() => {
       return {
-        // 内容左让位：外框左 + 外缝；有 sidebar 再加 sidebar 宽 + 内缝。
-        paddingLeft: showSidebar.value ? `calc(${viewportPadding.value.left} + ${gpx.value} + ${sidebarStyle.value.width} + ${gpx.value})` : `calc(${viewportPadding.value.left} + ${gpx.value})`,
-        // 顶让位 = 内容行顶（与 sidebar/aside 同行）。
-        paddingTop: contentRowTop.value,
-        // 右让位（对称左）：外框右 + 外缝；有 aside 再加 aside 宽 + 内缝。
-        paddingRight: showAside.value ? `calc(${viewportPadding.value.right} + ${gpx.value} + ${asideStyle.value.width} + ${gpx.value})` : `calc(${viewportPadding.value.right} + ${gpx.value})`,
-        // 底让位：外框下 + 外缝（footer 在流内，其底悬浮由此承担）。
-        paddingBottom: `calc(${viewportPadding.value.bottom} + ${gpx.value})`,
-        backgroundColor: theme.value.bodyColor
+        // 🔴 内容四边一律让**外圈档**（huhyx7）：内容 ↔ chrome、内容 ↔ viewport 边
+        // 都是「内容对外」的那一档，比 chrome 模块彼此的 ×1 多一档。
+        // 它同时**接替了已废弃的 shimPadding** —— 此前这段留白由
+        // `gap + shimPadding` 两处各给一半，同一段空白两个来源正是要消除的冗余。
+        // 内容左让位：外框左 + 外圈；有 sidebar 再加 sidebar 宽（sidebar 自身左边已让模块档）。
+        paddingLeft: showSidebar.value ? `calc(${viewportPadding.value.left} + ${gpx.value} + ${sidebarStyle.value.width} + ${outerPx.value})` : `calc(${viewportPadding.value.left} + ${outerPx.value})`,
+        // 顶让位 = 内容行顶（与 sidebar/aside 同行，但内容对 header 让外圈档）。
+        paddingTop: contentTop.value,
+        // 右让位（对称左）：外框右 + 外圈；有 aside 再加 aside 宽。
+        paddingRight: showAside.value ? `calc(${viewportPadding.value.right} + ${gpx.value} + ${asideStyle.value.width} + ${outerPx.value})` : `calc(${viewportPadding.value.right} + ${outerPx.value})`,
+        // 底让位：外框下 + 外圈（footer 在流内，其底悬浮由此承担）。
+        paddingBottom: `calc(${viewportPadding.value.bottom} + ${outerPx.value})`,
+        // 底色：**缺省不铺**（akw76r）——.app-body 是容器，容器一律透明，布局底由全局
+        // html 一处铺（use-theme-apply 的 :root{} 挂 background: var(--el-bg-color-page)），
+        // 一路透到这里。gap 缝与 header 上方滚动遮挡条露出的都是那一层。
+        // 🔴 [MUST NOT] 回补「与全局底同色」的缺省——那是把一个会变的值复制到第二处，
+        // 换底 / 换主题即成实色补丁（不报错、不红、只是变丑）。要改底色改主题 bodyColor。
+        // cfg.background 仍是逃生口：显式给值即在本层铺一块面（色 / 渐变 / 背景图皆可）。
+        // [MUST] 用 `background` 而非 `backgroundColor`：口子要容得下 image / gradient。
+        ...bridge.APP_LAYOUT_BODY_CONFIG.background === void 0 ? {} : { background: bridge.APP_LAYOUT_BODY_CONFIG.background }
       };
     });
     const contentViewportInset = computed(() => {
       const g = gapV.value;
+      const o = outerV.value;
       const vpCfg = bridge.APP_LAYOUT_VIEWPORT_CONFIG;
       const asideEffWidth = showAside.value && !bridge.layout.asideCollapsed.value ? bridge.APP_LAYOUT_ASIDE_CONFIG.width : 0;
       return {
-        top: hasHeader.value ? vpCfg.paddingTop + g + headerHeight.value + g : vpCfg.paddingTop + g,
-        bottom: hasFooter.value ? vpCfg.paddingBottom + g + footerHeight.value + g : vpCfg.paddingBottom + g,
-        left: showSidebar.value ? vpCfg.paddingLeft + g + sidebarWidth.value + g : vpCfg.paddingLeft + g,
-        right: showAside.value ? vpCfg.paddingRight + g + asideEffWidth + g : vpCfg.paddingRight + g
+        top: hasHeader.value ? vpCfg.paddingTop + g + headerHeight.value + o : vpCfg.paddingTop + o,
+        bottom: hasFooter.value ? vpCfg.paddingBottom + g + footerHeight.value + o : vpCfg.paddingBottom + o,
+        left: showSidebar.value ? vpCfg.paddingLeft + g + sidebarWidth.value + o : vpCfg.paddingLeft + o,
+        right: showAside.value ? vpCfg.paddingRight + g + asideEffWidth + o : vpCfg.paddingRight + o
       };
     });
     const bodyShimStyle = computed(() => {
       const headerSub = hasHeader.value ? ` - ${headerStyle.value.height} - ${gpx.value}` : "";
       const footerSub = hasFooter.value ? ` - ${footerStyle.value.height} - ${gpx.value}` : "";
       return {
-        minHeight: `calc(100vh - ${viewportPadding.value.top} - ${viewportPadding.value.bottom} - ${gpx.value} - ${gpx.value}${headerSub}${footerSub})`,
-        padding: `${bodyShimPadding.value}px`
+        // 上下两处从 gap 改**外圈档**：与 bodyStyle 的 paddingTop/Bottom 逐项同式
+        // （内容对外恒让外圈），[MUST] 一起改，否则可用高与实际内容盒对不上。
+        minHeight: `calc(100vh - ${viewportPadding.value.top} - ${viewportPadding.value.bottom} - ${outerPx.value} - ${outerPx.value}${headerSub}${footerSub})`
+        // 🔴 **不铺 padding**（huhyx7 A 条）：四周留白已由 bodyStyle 的外圈档给过，
+        // 这里再铺一层就是同一段空白两个来源 —— 那正是本批要消除的冗余。
+        // 原 `shimPadding` 已废弃（见 APP_LAYOUT_BODY_CONFIG.shimPadding 的 @deprecated）。
       };
     });
     const changeSidebarCollapseStatus = (status) => {