@done-coding/admin-core 0.29.0 → 0.29.1-alpha.0

package/es/components/data-view/use-masonry.mjs

@@ -0,0 +1,65 @@
+import { ref, watch, nextTick, onScopeDispose } from "vue";
+const MASONRY_ROW_UNIT = 4;
+const useDataViewMasonry = (options) => {
+  const masonrySpans = ref([]);
+  const masonryContainerStyle = ref(void 0);
+  const hasRO = typeof ResizeObserver !== "undefined";
+  let observer;
+  const measureAll = () => {
+    if (!options.enabled()) return;
+    const el = options.container();
+    if (!el) return;
+    const gap = options.gap();
+    const items = Array.from(el.children);
+    const next = items.map((item) => {
+      if (item.dataset.masonrySkip !== void 0) return void 0;
+      const h = item.getBoundingClientRect().height;
+      if (!h) return void 0;
+      return Math.ceil((h + gap) / MASONRY_ROW_UNIT);
+    });
+    const same = next.length === masonrySpans.value.length && next.every((v, i) => v === masonrySpans.value[i]);
+    if (!same) masonrySpans.value = next;
+    if (observer) items.forEach((item) => observer == null ? void 0 : observer.observe(item));
+  };
+  const start = () => {
+    masonryContainerStyle.value = {
+      gridAutoRows: `${MASONRY_ROW_UNIT}px`,
+      // 行距由跨度里的 gap 分量承担，[MUST NOT] 再叠 row-gap（会双倍）
+      rowGap: "0px"
+    };
+    if (hasRO && !observer) {
+      observer = new ResizeObserver(() => measureAll());
+    }
+    nextTick(measureAll);
+  };
+  const stop = () => {
+    observer == null ? void 0 : observer.disconnect();
+    observer = void 0;
+    masonryContainerStyle.value = void 0;
+    masonrySpans.value = [];
+  };
+  watch(
+    () => options.enabled(),
+    (on) => on ? start() : stop(),
+    { immediate: true }
+  );
+  watch(
+    () => options.data(),
+    () => {
+      if (options.enabled()) nextTick(measureAll);
+    }
+  );
+  watch(
+    () => options.container(),
+    (el) => {
+      if (el && observer) observer.observe(el);
+      if (el) nextTick(measureAll);
+    },
+    { immediate: true }
+  );
+  onScopeDispose(stop);
+  return { masonrySpans, masonryContainerStyle };
+};
+export {
+  useDataViewMasonry
+};

package/es/components/display/BadgeMark.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./BadgeMark.vue2.mjs";
 /* empty css                */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const BadgeMark = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-18853ddc"]]);
+const BadgeMark = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9eb89306"]]);
 export {
   BadgeMark as default
 };

package/es/components/display/BadgeMark.vue2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, computed, useTemplateRef, openBlock, createBlock, unref, normalizeProps, createSlots, withCtx, renderSlot, createVNode, resolveDynamicComponent } from "vue";
+import { defineComponent, computed, useTemplateRef, openBlock, createBlock, unref, normalizeProps, createSlots, withCtx, renderSlot, createVNode, normalizeStyle, resolveDynamicComponent } from "vue";
 import { ElBadge, ElTooltip, ElIcon } from "element-plus";
 import { useBadgeHit, badgeResolveDisplay } from "./use-badge.mjs";
 import { useBadgeMask } from "./use-badge-mask.mjs";
@@ -16,6 +16,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       var _a;
       return badgeResolveDisplay((_a = hit.value) == null ? void 0 : _a.entry);
     });
+    const iconStyle = computed(() => {
+      var _a;
+      const scale = (_a = resolved.value) == null ? void 0 : _a.iconScale;
+      return scale === void 0 ? void 0 : { fontSize: `${scale}em` };
+    });
     const badgeRef = useTemplateRef("badgeRef");
     useBadgeMask(
       () => {
@@ -53,12 +58,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               placement: "top"
             }, {
               default: withCtx(() => [
-                createVNode(unref(ElIcon), { class: "badge-mark__icon" }, {
+                createVNode(unref(ElIcon), {
+                  class: "badge-mark__icon",
+                  style: normalizeStyle(iconStyle.value)
+                }, {
                   default: withCtx(() => [
                     (openBlock(), createBlock(resolveDynamicComponent(resolved.value.icon)))
                   ]),
                   _: 1
-                })
+                }, 8, ["style"])
               ]),
               _: 1
             }, 8, ["content"])

package/es/components/display/HeightProvider.vue.mjs

@@ -10,12 +10,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const reserve = ref(0);
+    const headerReserve = ref(0);
+    const footerReserve = ref(0);
+    const reserve = computed(() => headerReserve.value + footerReserve.value);
     const available = computed(
       () => Math.max(props.viewportHeight - reserve.value, props.minHeight)
     );
     const onHeaderHeightChange = (height) => {
-      reserve.value = height;
+      headerReserve.value = height;
+    };
+    const onFooterHeightChange = (height) => {
+      footerReserve.value = height;
     };
     const defaultSlotProps = computed(
       () => {
@@ -38,7 +43,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           _: 3
         })) : createCommentVNode("", true),
-        renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(defaultSlotProps.value)))
+        renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(defaultSlotProps.value))),
+        _ctx.$slots.footer ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 1,
+          onHeightChange: onFooterHeightChange
+        }, {
+          default: withCtx(() => [
+            renderSlot(_ctx.$slots, "footer")
+          ]),
+          _: 3
+        })) : createCommentVNode("", true)
       ], 64);
     };
   }

package/es/components/display/use-badge.mjs

@@ -1,19 +1,27 @@
 import { inject, computed, onScopeDispose, markRaw, ref } from "vue";
-import { Lock, Warning } from "@element-plus/icons-vue";
-import _sfc_main from "../icon/IconHammer.vue.mjs";
+import { Lock, Warning, Calendar, MoonNight, Opportunity, RefreshRight, Sunny } from "@element-plus/icons-vue";
 import { CORE_BRIDGE_KEY } from "../../inject/key.mjs";
 const BADGE_BUILTIN_PRESET = {
-  new: { text: "新", type: "success" },
-  updated: { text: "更新", type: "primary" },
-  beta: { text: "内测", type: "warning" },
-  // 锤子走 core 自带（EP 无锤子，其 Tools 是扳手+齿轮、被读成「设置」）
-  wip: { text: "开发中", type: "info", icon: markRaw(_sfc_main) },
-  // 待下线：danger（红）——「要迁走」是需要用户采取行动的信号，强度高于 beta 的
-  // 「谨慎用」。与 count 的红撞色顾虑较弱：一个 key 只能挂一条 entry，同一位置不会
-  // 同时出现数字标与文字标，且形态（数字 vs 三字）扫视即可分。
+  // 上新：整圆 + 放射（团）。[MUST NOT] 改回 `Star` —— wip 的 MoonNight 自带小星星，
+  // 两者在 12px 下会互相干扰；`Sunny` 是「团」、`MoonNight` 是「钩」，小尺寸才拉得开。
+  new: { text: "新上线", type: "success", icon: markRaw(Sunny) },
+  // 更新：闭合环 + 箭头（七档里唯一的环）
+  updated: { text: "已更新", type: "primary", icon: markRaw(RefreshRight) },
+  // 内测：钟形灯泡（还在试）。[MUST NOT] 改回 `Aim` —— 靶心是同心圆，会与 `Sunny` 撞成两个团。
+  beta: { text: "内测中", type: "warning", icon: markRaw(Opportunity) },
+  // 开发中：月牙（甲方 2026-09-18 指定 MoonNight，替下自绘的 IconHammer）。
+  // 视觉重量比其余几档满 ⇒ 逐档缩到 0.8。
+  wip: {
+    text: "开发中",
+    type: "info",
+    icon: markRaw(MoonNight),
+    iconScale: 0.8
+  },
+  // 规划中：方框 + 顶部两耳（排期表）。与 wip 同为 info 档，靠形状区分（实测可辨）。
+  planned: { text: "规划中", type: "info", icon: markRaw(Calendar) },
+  // 待下线：三角
   deprecated: { text: "待下线", type: "danger", icon: markRaw(Warning) },
-  // 未开通：warning（橙）——与 beta 同档。EP 只有五档语义色而内置标已六个，必然有撞；
-  // 选 warning 因语义最近（都是「有条件可用」），文案完全不同足以区分。
+  // 未开通：拱 + 方体
   locked: { text: "未开通", type: "warning", icon: markRaw(Lock) }
 };
 const BADGE_TICK_INTERVAL = 6e4;
@@ -77,7 +85,8 @@ function badgeResolveDisplay(entry) {
     value: preset.text,
     type: preset.type,
     icon: preset.icon,
-    label: preset.text
+    label: preset.text,
+    iconScale: preset.iconScale
   };
 }
 export {

package/es/components/form/use-upload-state.mjs

@@ -10,6 +10,10 @@ const uploadFileFromUrl = (url) => {
   }
   return { uid: ++uploadUidSeed, name: name || url, url, status: "success" };
 };
+const uploadFinalUrlOf = (file) => {
+  const url = file.response ?? file.url ?? void 0;
+  return url && !url.startsWith("blob:") ? url : void 0;
+};
 function useUploadState(modelValue, options) {
   const {
     maxCount,
@@ -39,17 +43,34 @@ function useUploadState(modelValue, options) {
     uploadingCount.value -= 1;
     if (uploadingCount.value === 0) applyLoading();
   };
+  const alignFileList = (value) => {
+    const urls = urlsOf(value);
+    const current = fileList.value;
+    const pending = current.filter((file) => !uploadFinalUrlOf(file));
+    const settled = /* @__PURE__ */ new Map();
+    current.forEach((file) => {
+      const url = uploadFinalUrlOf(file);
+      if (!url) return;
+      const queue = settled.get(url);
+      if (queue) queue.push(file);
+      else settled.set(url, [file]);
+    });
+    const next = [
+      ...urls.map((url) => {
+        var _a;
+        return ((_a = settled.get(url)) == null ? void 0 : _a.shift()) ?? uploadFileFromUrl(url);
+      }),
+      ...pending
+    ];
+    if (next.length === current.length && next.every((file, index) => file === current[index])) {
+      return;
+    }
+    fileList.value = next;
+  };
   watch(
-    modelValue,
-    (value) => {
-      const urls = urlsOf(value);
-      if (urls.length === 0) {
-        fileList.value = [];
-      } else if (fileList.value.length === 0) {
-        fileList.value = urls.map(uploadFileFromUrl);
-      }
-    },
-    { immediate: true }
+    [modelValue, fileList, uploadingCount],
+    () => alignFileList(modelValue.value),
+    { immediate: true, flush: "post" }
   );
   const handleUpload = async (options2) => {
     beginUpload();
@@ -84,7 +105,8 @@ function useUploadState(modelValue, options) {
     }
   };
   const handleRemove = (file) => {
-    const url = file.response ?? file.url;
+    fileList.value = fileList.value.filter((item) => item !== file);
+    const url = uploadFinalUrlOf(file);
     if (url) {
       modelValue.value = urlsOf(modelValue.value).filter(
         (item) => item !== url

package/es/components/page-layout/AppPageDetail.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./AppPageDetail.vue2.mjs";
 /* empty css                    */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const AppPageDetail = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4426d26a"]]);
+const AppPageDetail = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1b784d3a"]]);
 export {
   AppPageDetail as default
 };

package/es/components/page-layout/AppPageDetail.vue2.mjs

@@ -59,7 +59,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }, {
         default: withCtx(() => [
           ctxFinal.value.id !== void 0 && !__props.detailApi && titleOf() ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(titleOf()), 1)) : createCommentVNode("", true),
-          ctxFinal.value.id !== void 0 && __props.detailApi ? (openBlock(), createBlock(unref(ViewLayout), mergeProps({ key: 1 }, __props.viewLayoutProps, {
+          ctxFinal.value.id !== void 0 && __props.detailApi ? (openBlock(), createBlock(unref(ViewLayout), mergeProps({
+            key: 1,
+            fillHeight: !!_ctx.$slots.detailBottom
+          }, __props.viewLayoutProps, {
             api: __props.detailApi,
             params: detailParams.value,
             refreshToken: ctxFinal.value.id
@@ -75,8 +78,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 createTextVNode(toDisplayString(titleOf(data)), 1)
               ]),
               key: "0"
+            } : void 0,
+            _ctx.$slots.detailBottom ? {
+              name: "bottom",
+              fn: withCtx(({ data, loading, fetchSeq }) => [
+                renderSlot(_ctx.$slots, "detailBottom", normalizeProps(guardReactiveProps(detailScope(data, loading, fetchSeq))), void 0, true)
+              ]),
+              key: "1"
             } : void 0
-          ]), 1040, ["api", "params", "refreshToken"])) : ctxFinal.value.id !== void 0 ? renderSlot(_ctx.$slots, "detail", normalizeProps(mergeProps({ key: 2 }, detailScope())), void 0, true) : renderSlot(_ctx.$slots, "empty", {
+          ]), 1040, ["fillHeight", "api", "params", "refreshToken"])) : ctxFinal.value.id !== void 0 ? renderSlot(_ctx.$slots, "detail", normalizeProps(mergeProps({ key: 2 }, detailScope())), void 0, true) : renderSlot(_ctx.$slots, "empty", {
             key: 3,
             listEmpty: __props.listEmpty
           }, () => [

package/es/components/page-layout/AppPageListDetailLayout.vue.mjs

@@ -121,33 +121,40 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           key: "1"
         } : void 0,
+        _ctx.$slots.detailBottom ? {
+          name: "detailBottom",
+          fn: withCtx((scope) => [
+            renderSlot(_ctx.$slots, "detailBottom", mergeProps(scope, { resolvedMode: resolvedMode.value }))
+          ]),
+          key: "2"
+        } : void 0,
         _ctx.$slots.empty ? {
           name: "empty",
           fn: withCtx((scope) => [
             renderSlot(_ctx.$slots, "empty", mergeProps(scope, { resolvedMode: resolvedMode.value }))
           ]),
-          key: "2"
+          key: "3"
         } : void 0,
         _ctx.$slots.right ? {
           name: "right",
           fn: withCtx(() => [
             renderSlot(_ctx.$slots, "right")
           ]),
-          key: "3"
+          key: "4"
         } : void 0,
         _ctx.$slots.top ? {
           name: "top",
           fn: withCtx(() => [
             renderSlot(_ctx.$slots, "top")
           ]),
-          key: "4"
+          key: "5"
         } : void 0,
         _ctx.$slots.bottom ? {
           name: "bottom",
           fn: withCtx(() => [
             renderSlot(_ctx.$slots, "bottom")
           ]),
-          key: "5"
+          key: "6"
         } : void 0
       ]), 1064, ["listProps", "ctx", "listEmpty", "listWidth", "sheetLayerType", "sheetSize", "detailApi", "detailTitle", "viewLayoutProps"]);
     };

package/es/components/page-layout/AppPageListDetailSheet.vue.mjs

@@ -62,12 +62,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ]),
                   key: "0"
                 } : void 0,
+                _ctx.$slots.detailBottom ? {
+                  name: "detailBottom",
+                  fn: withCtx((scope) => [
+                    renderSlot(_ctx.$slots, "detailBottom", normalizeProps(guardReactiveProps(scope)))
+                  ]),
+                  key: "1"
+                } : void 0,
                 _ctx.$slots.empty ? {
                   name: "empty",
                   fn: withCtx((scope) => [
                     renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(scope)))
                   ]),
-                  key: "1"
+                  key: "2"
                 } : void 0
               ]), 1032, ["ctx", "listEmpty", "detailApi", "viewLayoutProps"])
             ]),

package/es/components/page-layout/AppPageListDetailSplit.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./AppPageListDetailSplit.vue2.mjs";
 /* empty css                             */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const AppPageListDetailSplit = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e97ba16e"]]);
+const AppPageListDetailSplit = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7aa91bcb"]]);
 export {
   AppPageListDetailSplit as default
 };

package/es/components/page-layout/AppPageListDetailSplit.vue2.mjs

@@ -51,12 +51,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ]),
               key: "0"
             } : void 0,
+            _ctx.$slots.detailBottom ? {
+              name: "detailBottom",
+              fn: withCtx((scope) => [
+                renderSlot(_ctx.$slots, "detailBottom", normalizeProps(guardReactiveProps(scope)), void 0, true)
+              ]),
+              key: "1"
+            } : void 0,
             _ctx.$slots.empty ? {
               name: "empty",
               fn: withCtx((scope) => [
                 renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(scope)), void 0, true)
               ]),
-              key: "1"
+              key: "2"
             } : void 0
           ]), 1032, ["ctx", "listEmpty", "detailApi", "detailTitle", "viewLayoutProps"])
         ]),

package/es/components/table/TableMain.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./TableMain.vue2.mjs";
 /* empty css                */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const TableMain = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-431aac71"]]);
+const TableMain = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f5764fe4"]]);
 export {
   TableMain as default
 };

package/es/components/table/TableMain.vue2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, useCssVars, unref, useModel, useAttrs, ref, computed, markRaw, shallowRef, watch, onMounted, onActivated, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, createVNode, mergeProps, createCommentVNode, resolveDynamicComponent, Fragment, renderList, createSlots, renderSlot, createTextVNode, toDisplayString, normalizeProps, guardReactiveProps, withDirectives, vShow, mergeModels } from "vue";
+import { defineComponent, useCssVars, unref, useModel, computed, useAttrs, ref, markRaw, shallowRef, watch, onMounted, onActivated, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, createVNode, mergeProps, createCommentVNode, resolveDynamicComponent, Fragment, renderList, createSlots, renderSlot, createTextVNode, toDisplayString, normalizeProps, guardReactiveProps, withDirectives, vShow, mergeModels } from "vue";
 import { useActiveRecord, activeRecordValueOf } from "../../hooks/use-active-record.mjs";
 import _cloneDeep from "lodash/cloneDeep";
 import _omit from "lodash/omit";
@@ -21,6 +21,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TableMain",
   props: /* @__PURE__ */ mergeModels({
     surface: { type: Boolean, default: void 0 },
+    itemCard: { type: Boolean, default: void 0 },
     showPager: { type: Boolean, default: true },
     initialSearch: { type: Boolean, default: true },
     showSwitchView: { type: Boolean },
@@ -61,14 +62,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: /* @__PURE__ */ mergeModels(["pageChange", "pageSizeChange", "dataChange", "loadingChange", "pageInfoChange"], ["update:activeId", "update:activeData", "update:isAutoRefresh", "update:refreshInterval", "update:customView"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     useCssVars((_ctx) => ({
-      "v02eff1c8": unref(surfacePadCss),
-      "v75a7164e": unref(fillMinHeightCss)
+      "v5308fe58": unref(surfacePadCss),
+      "v418a0592": unref(fillMinHeightCss)
     }));
     const props = __props;
     const emits = __emit;
     const activeId = useModel(__props, "activeId");
     const activeData = useModel(__props, "activeData");
-    const { surfaceActive, surfacePad, surfacePadCss } = useSurface(() => props);
+    const itemCardFinal = computed(() => props.itemCard ?? customView.value);
+    const { surfaceActive, surfaceBgActive, surfacePad, surfacePadCss } = useSurface(() => ({ ...props, itemCard: itemCardFinal.value }));
     const isAutoRefresh = useModel(__props, "isAutoRefresh");
     const refreshInterval = useModel(__props, "refreshInterval");
     const customView = useModel(__props, "customView");
@@ -371,7 +373,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["dc-table-main table-main", {
           "table-main_fill": unref(fillActive),
-          "table-main_surface": unref(surfaceActive)
+          "table-main_surface": unref(surfaceActive),
+          "table-main_surface-bg": unref(surfaceBgActive)
         }])
       }, [
         __props.showToolbar ? (openBlock(), createBlock(unref(_sfc_main$1), {

package/es/components/view-layout/ViewLayout.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./ViewLayout.vue2.mjs";
 /* empty css                 */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const ViewLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e7dc3f12"]]);
+const ViewLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3c6fd3fe"]]);
 export {
   ViewLayout as default
 };

package/es/components/view-layout/ViewLayout.vue2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, shallowRef, ref, useModel, computed, inject, watch, provide, useSlots, withDirectives, openBlock, createElementBlock, unref, createBlock, withCtx, createElementVNode, normalizeStyle, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, vShow, Fragment, mergeModels } from "vue";
+import { defineComponent, useCssVars, shallowRef, ref, useModel, computed, inject, watch, provide, useSlots, withDirectives, openBlock, createElementBlock, unref, createBlock, createSlots, withCtx, createElementVNode, normalizeStyle, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, vShow, Fragment, mergeModels } from "vue";
 import { vLoading } from "element-plus";
 import AutoRefreshGroup from "../misc/AutoRefreshGroup.vue.mjs";
 import _sfc_main$1 from "../display/HeightProvider.vue.mjs";
@@ -6,8 +6,9 @@ import _sfc_main$2 from "../display/ActionBtnGroup.vue.mjs";
 import { useContextDefaults } from "../../hooks/use-context-defaults.mjs";
 import ViewLayoutNavigation from "./ViewLayoutNavigation.vue.mjs";
 import { useChannelViewportHeight } from "../../hooks/use-channel-viewport-height.mjs";
-import { APP_PAGE_LIST_DETAIL_CONTEXT, SCOPE_VIEWPORT_MAX_HEIGHT } from "../../inject/key.mjs";
+import { APP_PAGE_LIST_DETAIL_CONTEXT, APP_LAYOUT_BRIDGE_KEY, SCOPE_VIEWPORT_MAX_HEIGHT } from "../../inject/key.mjs";
 import { useActivated } from "../../hooks/activated.mjs";
+import { gapScaleValue } from "../../utils/gap-scale.mjs";
 import { SlotRegion } from "../../config/slot-region.mjs";
 const _hoisted_1 = { class: "dc-view-layout view-layout" };
 const _hoisted_2 = { class: "view-layout-toolbar" };
@@ -17,14 +18,20 @@ const _hoisted_4 = {
   class: "dc-view-layout__header view-layout-header"
 };
 const _hoisted_5 = { class: "view-layout-toolbar__right" };
-const _hoisted_6 = { class: "view-layout-toolbar" };
-const _hoisted_7 = { class: "view-layout-toolbar__left" };
-const _hoisted_8 = {
+const _hoisted_6 = { class: "dc-view-layout__bottom" };
+const _hoisted_7 = { class: "view-layout-toolbar" };
+const _hoisted_8 = { class: "view-layout-toolbar__left" };
+const _hoisted_9 = {
   key: 0,
   class: "dc-view-layout__header view-layout-header"
 };
-const _hoisted_9 = { class: "view-layout-toolbar__right" };
-const _hoisted_10 = { class: "view-layout-content" };
+const _hoisted_10 = { class: "view-layout-toolbar__right" };
+const _hoisted_11 = { class: "view-layout-content" };
+const _hoisted_12 = {
+  key: 0,
+  class: "dc-view-layout__bottom"
+};
+const DEFAULT_GAP_BASE = 8;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ViewLayout",
   props: /* @__PURE__ */ mergeModels({
@@ -36,6 +43,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     channel: {},
     parentChannel: {},
     minHeight: { default: 100 },
+    fillHeight: { type: Boolean },
     showAutoRefresh: { type: Boolean, default: true },
     showRefresh: { type: Boolean, default: true },
     title: {},
@@ -48,6 +56,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }),
   emits: ["update:isAutoRefresh"],
   setup(__props) {
+    useCssVars((_ctx) => ({
+      "v72fb5e44": gapUnitPx.value,
+      "v7243a29e": padLeftPx.value
+    }));
     const props = __props;
     const { ctxRefine } = useContextDefaults({
       getProps: () => props,
@@ -88,6 +100,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       refreshList: listDetailCtx == null ? void 0 : listDetailCtx.refreshList
     }));
     const hasHeader = computed(() => !!slots.header || !!props.title);
+    const hasBottom = computed(() => !!slots.bottom);
     const hasToolbarContent = computed(
       () => {
         var _a, _b;
@@ -104,10 +117,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         if (token !== void 0) fetch();
       }
     );
-    const heightProviderViewportHeight = computed(() => viewportHeightFinal.value);
-    const contentStyle = (available) => ({
-      maxHeight: `${available}px`
-    });
+    const layoutBridge = inject(APP_LAYOUT_BRIDGE_KEY, void 0);
+    const gapUnit = computed(
+      () => gapScaleValue(
+        (layoutBridge == null ? void 0 : layoutBridge.APP_LAYOUT_GAP_CONFIG.size) ?? DEFAULT_GAP_BASE,
+        "module",
+        layoutBridge == null ? void 0 : layoutBridge.themeDensity.value
+      )
+    );
+    const gapUnitPx = computed(() => `${gapUnit.value}px`);
+    const padLeftPx = computed(() => `${gapUnit.value * 2}px`);
+    const contentPaddingVertical = computed(() => gapUnit.value * 2);
+    const heightProviderViewportHeight = computed(
+      () => Math.max(viewportHeightFinal.value - contentPaddingVertical.value, 0)
+    );
+    const contentStyle = (available) => {
+      const box = `${available + contentPaddingVertical.value}px`;
+      return props.fillHeight ? { maxHeight: box, minHeight: box } : { maxHeight: box };
+    };
     const childViewportHeightChange = ref(0);
     const onChildViewportHeightChange = (value) => {
       childViewportHeightChange.value = value;
@@ -132,7 +159,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           viewportHeight: heightProviderViewportHeight.value,
           minHeight: __props.minHeight,
           onChildViewportHeightChange
-        }, {
+        }, createSlots({
           header: withCtx(() => [
             withDirectives(createElementVNode("div", _hoisted_2, [
               createElementVNode("div", _hoisted_3, [
@@ -187,11 +214,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               }, void 0, true)
             ], 4)
           ]),
-          _: 3
-        }, 8, ["viewportHeight", "minHeight"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-          withDirectives(createElementVNode("div", _hoisted_6, [
-            createElementVNode("div", _hoisted_7, [
-              hasHeader.value ? (openBlock(), createElementBlock("div", _hoisted_8, [
+          _: 2
+        }, [
+          hasBottom.value ? {
+            name: "footer",
+            fn: withCtx(() => [
+              createElementVNode("div", _hoisted_6, [
+                renderSlot(_ctx.$slots, "bottom", {
+                  data: data.value,
+                  loading: loading.value,
+                  fetchSeq: fetchSeq.value
+                }, void 0, true)
+              ])
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["viewportHeight", "minHeight"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          withDirectives(createElementVNode("div", _hoisted_7, [
+            createElementVNode("div", _hoisted_8, [
+              hasHeader.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
                 renderSlot(_ctx.$slots, "header", {
                   data: data.value,
                   loading: loading.value
@@ -205,7 +246,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 "default-size": "small"
               }, null, 8, ["configs", "ctx"])
             ]),
-            createElementVNode("div", _hoisted_9, [
+            createElementVNode("div", _hoisted_10, [
               showNavigationFinal.value ? (openBlock(), createBlock(ViewLayoutNavigation, {
                 key: 0,
                 ctx: unref(listDetailCtx)
@@ -227,7 +268,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ], 512), [
             [vShow, hasToolbarContent.value || hasHeader.value]
           ]),
-          createElementVNode("div", _hoisted_10, [
+          createElementVNode("div", _hoisted_11, [
             renderSlot(_ctx.$slots, "default", {
               data: data.value,
               loading: loading.value,
@@ -235,7 +276,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               viewportHeight: void 0,
               fetchSeq: fetchSeq.value
             }, void 0, true)
-          ])
+          ]),
+          hasBottom.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
+            renderSlot(_ctx.$slots, "bottom", {
+              data: data.value,
+              loading: loading.value,
+              fetchSeq: fetchSeq.value
+            }, void 0, true)
+          ])) : createCommentVNode("", true)
         ], 64))
       ])), [
         [unref(vLoading), showLoadingMask.value]

package/es/hooks/use-surface.mjs

@@ -20,7 +20,10 @@ const useSurface = (getProps) => {
     ) : 0
   );
   const surfacePadCss = computed(() => `${surfacePad.value}px`);
-  return { surfaceActive, surfacePad, surfacePadCss };
+  const surfaceBgActive = computed(
+    () => surfaceActive.value && !getProps().itemCard
+  );
+  return { surfaceActive, surfaceBgActive, surfacePad, surfacePadCss };
 };
 export {
   useSurface