@tplc/business 0.4.107 → 0.4.109

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.4.109](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.4.108...v0.4.109) (2025-05-11)
+
+### [0.4.108](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.4.107...v0.4.108) (2025-05-10)
+
+
+### ✨ Features | 新功能
+
+* 对比修改 ([2decf5d](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/commit/2decf5d485bd6d9c197d1d9fd2566bbcb29d9ffb))
+* 暂时提交骨架屏 ([4314836](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/commit/43148361462a43b75f4f80806b6021d979b398d5))
+
+
+### 🐛 Bug Fixes | Bug 修复
+
+* nav 判断 ([6fd5aa6](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/commit/6fd5aa6e27722e1a17ebd637cf4b1c29d0599eab))
+
 ### [0.4.107](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.4.106...v0.4.107) (2025-05-09)
 
 ### [0.4.106](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.4.105...v0.4.106) (2025-05-09)

package/components/lcb-product/components/ProductSkeleton/index.vue

@@ -0,0 +1,54 @@
+<template>
+  <template v-if="loading">
+    <view v-if="listType === 'list'" class="flex flex-col gap-3">
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+    </view>
+    <!-- horizontal -->
+    <view
+      v-else-if="listType === 'horizontal'"
+      class="flex flex-row gap-3 overflow-x-auto whitespace-nowrap"
+    >
+      <SkeletonItem :layout-type="layoutType" :custom-class="`!w-45% flex-shrink-0`" />
+      <SkeletonItem :layout-type="layoutType" :custom-class="`!w-45% flex-shrink-0`" />
+      <SkeletonItem :layout-type="layoutType" :custom-class="`!w-45% flex-shrink-0`" />
+    </view>
+    <!-- grid -->
+    <view v-else-if="listType === 'grid'" class="grid grid-cols-2 gap-3">
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+    </view>
+    <!-- waterfall -->
+    <view v-else-if="listType === 'waterfall'" class="grid grid-cols-2 gap-3">
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+      <SkeletonItem :layout-type="layoutType" />
+    </view>
+  </template>
+  <slot v-else />
+</template>
+
+<script setup lang="ts">
+import { LcbProductProps } from '../../types'
+import { defineProps } from 'vue'
+import SkeletonItem from '../SKeletonItem/index.vue'
+defineOptions({
+  name: 'ProductSkeleton',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    layoutType: 'vertical',
+    styleIsolation: 'shared',
+  },
+})
+withDefaults(defineProps<LcbProductProps & { loading?: boolean }>(), {})
+</script>
+
+<style lang="scss" scoped>
+.lcb-product-skeleton {
+  width: 100%;
+}
+</style>

package/components/lcb-product/components/SKeletonItem/index.vue

@@ -0,0 +1,38 @@
+<template>
+  <!-- vertical -->
+  <view v-if="layoutType === 'vertical'" :class="customClass" class="w-full">
+    <wd-skeleton :row-col="verticalRowCol" animation="gradient" />
+  </view>
+  <!-- horizontal -->
+  <view v-else class="flex flex-row w-fuull" :class="customClass">
+    <wd-skeleton :row-col="[{ size: '80px', type: 'rect' }]" animation="gradient" />
+    <wd-skeleton
+      animation="gradient"
+      :custom-style="{ width: '100%', marginLeft: '24rpx' }"
+      :row-col="[1, { width: '80%' }, [{ width: '40%' }, { width: '20%' }]]"
+    />
+  </view>
+</template>
+
+<script setup lang="ts">
+import { LcbProductProps } from '../../types'
+import { defineProps } from 'vue'
+
+defineOptions({
+  name: 'SkeletonItem',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    layoutType: 'vertical',
+    styleIsolation: 'shared',
+  },
+})
+const props = defineProps<LcbProductProps>()
+const verticalRowCol = [
+  { height: '171px' },
+  1,
+  { width: '80%' },
+  { width: '60%' },
+  [{ width: '30%' }, { width: '10%', marginLeft: '41px' }],
+]
+</script>

package/components/lcb-product/lcb-product.vue

@@ -1,13 +1,14 @@
 <script setup lang="ts">
 import { isH5 } from '@tplc/wot/components/common/util'
 import UWaterfall from 'uview-plus/components/u-waterfall/u-waterfall.vue'
-import { ref, useAttrs, watch, watchEffect } from 'vue'
+import { computed, ref, useAttrs, watch, watchEffect } from 'vue'
 import useSyncForm from '../../hooks/useSyncForm'
 import { transformValueUnit } from '../../utils/transform'
 import { calculateImageHeight } from '../../utils/utils'
 import UnconditionedLayout from '../lcb-list/components/UnconditionedLayout/index.vue'
 import { LcbProductProps } from './types'
 import isEqual from 'lodash-es/isEqual'
+import ProductSkeleton from './components/ProductSkeleton/index.vue'
 
 const uWaterfallRef = ref()
 defineOptions({
@@ -32,6 +33,7 @@ const props = withDefaults(defineProps<LcbProductProps>(), {
   gap: 16,
 })
 const { form } = useSyncForm(props.dynamicScope)
+const loading = ref(false)
 const renderList = ref<Record<string, any>[]>([])
 const screenWidth = isH5 ? window.innerWidth : uni.getWindowInfo().screenWidth
 watchEffect(() => {
@@ -43,39 +45,48 @@ defineSlots<{
 }>()
 const getData = async () => {
   /** 如果是list里面嵌套就不处理 */
-  if (props.filterList) return
-  if (props.listType === 'waterfall') {
-    renderList.value = []
-    uWaterfallRef.value?.clear?.()
+  if (props.filterList) {
+    loading.value = false
+    return
   }
-  let requestParams = {}
+  loading.value = true
   try {
-    requestParams = JSON.parse(props.requestParams ?? '{}')
+    if (props.listType === 'waterfall') {
+      renderList.value = []
+      uWaterfallRef.value?.clear?.()
+    }
+    let requestParams = {}
+    try {
+      requestParams = JSON.parse(props.requestParams ?? '{}')
+    } catch (error) {
+      console.error(error)
+    }
+    /** 如果是列表模式 */
+    if (props.items?.length && props.sourceMode === 1) {
+      const { data } = await uni.$lcb.http.post('/productInfo/filteredPage', {
+        productIdList: props.items.map((item) => item.productId),
+        productType: props.items[0].productType,
+        listType: props.listType,
+        sortType: props.sortType,
+        ...requestParams,
+      })
+      renderList.value = data as Record<string, any>[]
+      /** 如果是请求模式 */
+    } else if (props.requestUrl && props.sourceMode === 2) {
+      const { data } = await uni.$lcb.http.post(props.requestUrl, {
+        listType: props.listType,
+        ...requestParams,
+        ...form.value,
+      })
+      renderList.value = data as Record<string, any>[]
+    } else {
+      renderList.value = []
+      uWaterfallRef.value?.clear?.()
+    }
   } catch (error) {
     console.error(error)
   }
-  /** 如果是列表模式 */
-  if (props.items?.length && props.sourceMode === 1) {
-    const { data } = await uni.$lcb.http.post('/productInfo/filteredPage', {
-      productIdList: props.items.map((item) => item.productId),
-      productType: props.items[0].productType,
-      listType: props.listType,
-      sortType: props.sortType,
-      ...requestParams,
-    })
-    renderList.value = data as Record<string, any>[]
-    /** 如果是请求模式 */
-  } else if (props.requestUrl && props.sourceMode === 2) {
-    const { data } = await uni.$lcb.http.post(props.requestUrl, {
-      listType: props.listType,
-      ...requestParams,
-      ...form.value,
-    })
-    renderList.value = data as Record<string, any>[]
-  } else {
-    renderList.value = []
-    uWaterfallRef.value?.clear?.()
-  }
+  loading.value = false
 }
 watch(
   () => form!.value,
@@ -138,122 +149,59 @@ defineExpose({
     }
   },
 })
+const blockProps = computed(() => {
+  const {
+    paddingHorizontal,
+    paddingVertical,
+    paddingLeft,
+    paddingRight,
+    paddingTop,
+    paddingBottom,
+    marginHorizontal,
+    ...reset
+  } = props
+  return [
+    {
+      paddingHorizontal,
+      paddingVertical,
+      paddingLeft,
+      paddingRight,
+      paddingTop,
+      paddingBottom,
+      marginHorizontal,
+    },
+    reset,
+  ]
+})
 </script>
 
 <template>
-  <lcb-block
-    v-bind="{
-      ...$props,
-      shadowColor: blockShadowColor,
-      shadowSize: blockShadowSize,
-      blurSize: blockBlurSize,
-    }"
-    :custom-class="`${listType == 'horizontal' ? '!gap-0 h-fit overflow-x-auto whitespace-nowrap flex items-stretch w-full' : ''}`"
-  >
-    <!-- 单列 -->
-    <view
-      class="flex flex-col"
-      v-if="listType === 'list'"
-      :style="{
-        width: itemWidth ? `${itemWidth}rpx` : '100%',
-        gap: gap ? `${gap}rpx` : undefined,
-      }"
-    >
-      <block v-for="(item, index) in renderList" :key="`${item?.productId}:${index}`">
-        <UnconditionedLayout
-          v-if="item.productType === 'noProductOption'"
-          v-bind="{ ...item, ...$props, ...attrs }"
-        />
-        <lcb-action-view v-bind="item.link" render-mode="view" v-else>
-          <slot name="item" :item="item">
-            <lcb-absolute-config-layout
-              v-if="renderItemAbsoluteConfigLayout"
-              :blocks="renderItemAbsoluteConfigLayout?.blocks"
-              :canvas="renderItemAbsoluteConfigLayout?.canvas"
-              :dataset="{
-                ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
-                ...item,
-              }"
-            />
-            <lcb-product-item
-              v-else
-              v-bind="{ ...item, ...$props, ...attrs }"
-              :layoutType="layoutType"
-              :coverImgStyle="{
-                width: layoutType === 'vertical' ? '100%' : transformValueUnit(imageWidth),
-                height: layoutType === 'vertical' ? transformValueUnit(imageHeight) : undefined,
-                minHeight: layoutType !== 'vertical' ? transformValueUnit(imageHeight) : undefined,
-                borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
-                ...($props?.coverImgStyle ?? {}),
-              }"
-            ></lcb-product-item>
-          </slot>
-        </lcb-action-view>
-      </block>
-    </view>
-    <!-- 双列 -->
-    <view
-      class="grid grid-cols-2 box-border"
-      v-else-if="listType === 'grid'"
-      :style="{
-        width: itemWidth ? `${itemWidth}rpx` : '100%',
-        gap: gap ? `${gap}rpx` : undefined,
-      }"
-    >
-      <lcb-action-view
-        v-for="(item, index) in renderList"
-        :key="`${item?.productId}:${index}`"
-        v-bind="item.link"
-        render-mode="view"
-        custom-class="h-full rounded-md overflow-hidden"
+  <lcb-block v-bind="loading ? blockProps[0] : {}">
+    <ProductSkeleton :loading="loading" v-bind="$props">
+      <lcb-block
+        v-bind="{
+          ...$props,
+          shadowColor: blockShadowColor,
+          shadowSize: blockShadowSize,
+          blurSize: blockBlurSize,
+        }"
+        :custom-class="`${listType == 'horizontal' ? '!gap-0 h-fit overflow-x-auto whitespace-nowrap flex items-stretch w-full' : ''}`"
       >
-        <slot name="item" :item="item">
-          <lcb-absolute-config-layout
-            v-if="renderItemAbsoluteConfigLayout"
-            :blocks="renderItemAbsoluteConfigLayout?.blocks"
-            :canvas="renderItemAbsoluteConfigLayout?.canvas"
-            :dataset="{
-              ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
-              ...item,
-            }"
-          />
-          <lcb-product-item
-            v-else
-            v-bind="{ ...item, ...$props, ...attrs }"
-            layoutType="vertical"
-            className="h-full"
-            :coverImgStyle="{
-              width: '100%',
-              height: transformValueUnit(imageHeight),
-              borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
-              ...(attrs?.coverImgStyle ?? {}),
-            }"
-          ></lcb-product-item>
-        </slot>
-      </lcb-action-view>
-    </view>
-
-    <view
-      class="lcb-product-waterfall !py-1"
-      v-else-if="listType === 'waterfall'"
-      :style="{
-        width: itemWidth ? `${itemWidth}rpx` : '100%',
-      }"
-    >
-      <u-waterfall :addTime="0" :modelValue="renderList" ref="uWaterfallRef" custom-class="!gap-20">
-        <template #left="{ leftList: list }">
-          <view
-            class="flex flex-col gap-3"
-            :style="{
-              marginRight: `${gap / 2}rpx`,
-            }"
-          >
-            <lcb-action-view
-              v-for="(item, index) in list"
-              :key="`${item?.productId}:${index}`"
-              v-bind="item.link"
-              render-mode="view"
-            >
+        <!-- 单列 -->
+        <view
+          class="flex flex-col"
+          v-if="listType === 'list'"
+          :style="{
+            width: itemWidth ? `${itemWidth}rpx` : '100%',
+            gap: gap ? `${gap}rpx` : undefined,
+          }"
+        >
+          <block v-for="(item, index) in renderList" :key="`${item?.productId}:${index}`">
+            <UnconditionedLayout
+              v-if="item.productType === 'noProductOption'"
+              v-bind="{ ...item, ...$props, ...attrs }"
+            />
+            <lcb-action-view v-bind="item.link" render-mode="view" v-else>
               <slot name="item" :item="item">
                 <lcb-absolute-config-layout
                   v-if="renderItemAbsoluteConfigLayout"
@@ -264,44 +212,192 @@ defineExpose({
                     ...item,
                   }"
                 />
-
                 <lcb-product-item
-                  v-bind="{ ...item, ...$props, ...attrs }"
-                  layoutType="vertical"
                   v-else
-                >
-                  <template #coverImg="{ value }">
-                    <wd-img
-                      :src="value"
-                      width="100%"
-                      mode="aspectFill"
-                      :lazyPlaceWidth="columnWidth"
-                      :height="
-                        calculateImageHeight(
-                          screenWidth,
-                          item.coverImgProps?.[0]?.height,
-                          item.coverImgProps?.[0]?.width,
-                        )
-                      "
-                    />
-                  </template>
-                </lcb-product-item>
+                  v-bind="{ ...item, ...$props, ...attrs }"
+                  :layoutType="layoutType"
+                  :coverImgStyle="{
+                    width: layoutType === 'vertical' ? '100%' : transformValueUnit(imageWidth),
+                    height: layoutType === 'vertical' ? transformValueUnit(imageHeight) : undefined,
+                    minHeight:
+                      layoutType !== 'vertical' ? transformValueUnit(imageHeight) : undefined,
+                    borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
+                    ...($props?.coverImgStyle ?? {}),
+                  }"
+                ></lcb-product-item>
               </slot>
             </lcb-action-view>
-          </view>
-        </template>
-        <template #right="{ rightList: list }">
-          <view
-            class="flex flex-col gap-3"
-            :style="{
-              marginLeft: `${gap / 2}rpx`,
-            }"
+          </block>
+        </view>
+        <!-- 双列 -->
+        <view
+          class="grid grid-cols-2 box-border"
+          v-else-if="listType === 'grid'"
+          :style="{
+            width: itemWidth ? `${itemWidth}rpx` : '100%',
+            gap: gap ? `${gap}rpx` : undefined,
+          }"
+        >
+          <lcb-action-view
+            v-for="(item, index) in renderList"
+            :key="`${item?.productId}:${index}`"
+            v-bind="item.link"
+            render-mode="view"
+            custom-class="h-full rounded-md overflow-hidden"
+          >
+            <slot name="item" :item="item">
+              <lcb-absolute-config-layout
+                v-if="renderItemAbsoluteConfigLayout"
+                :blocks="renderItemAbsoluteConfigLayout?.blocks"
+                :canvas="renderItemAbsoluteConfigLayout?.canvas"
+                :dataset="{
+                  ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
+                  ...item,
+                }"
+              />
+              <lcb-product-item
+                v-else
+                v-bind="{ ...item, ...$props, ...attrs }"
+                layoutType="vertical"
+                className="h-full"
+                :coverImgStyle="{
+                  width: '100%',
+                  height: transformValueUnit(imageHeight),
+                  borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
+                  ...(attrs?.coverImgStyle ?? {}),
+                }"
+              ></lcb-product-item>
+            </slot>
+          </lcb-action-view>
+        </view>
+
+        <view
+          class="lcb-product-waterfall !py-1"
+          v-else-if="listType === 'waterfall'"
+          :style="{
+            width: itemWidth ? `${itemWidth}rpx` : '100%',
+          }"
+        >
+          <u-waterfall
+            :addTime="0"
+            :modelValue="renderList"
+            ref="uWaterfallRef"
+            custom-class="!gap-20"
+          >
+            <template #left="{ leftList: list }">
+              <view
+                class="flex flex-col gap-3"
+                :style="{
+                  marginRight: `${gap / 2}rpx`,
+                }"
+              >
+                <lcb-action-view
+                  v-for="(item, index) in list"
+                  :key="`${item?.productId}:${index}`"
+                  v-bind="item.link"
+                  render-mode="view"
+                >
+                  <slot name="item" :item="item">
+                    <lcb-absolute-config-layout
+                      v-if="renderItemAbsoluteConfigLayout"
+                      :blocks="renderItemAbsoluteConfigLayout?.blocks"
+                      :canvas="renderItemAbsoluteConfigLayout?.canvas"
+                      :dataset="{
+                        ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
+                        ...item,
+                      }"
+                    />
+
+                    <lcb-product-item
+                      v-bind="{ ...item, ...$props, ...attrs }"
+                      layoutType="vertical"
+                      v-else
+                    >
+                      <template #coverImg="{ value }">
+                        <wd-img
+                          :src="value"
+                          width="100%"
+                          mode="aspectFill"
+                          :lazyPlaceWidth="columnWidth"
+                          :height="
+                            calculateImageHeight(
+                              screenWidth,
+                              item.coverImgProps?.[0]?.height,
+                              item.coverImgProps?.[0]?.width,
+                            )
+                          "
+                        />
+                      </template>
+                    </lcb-product-item>
+                  </slot>
+                </lcb-action-view>
+              </view>
+            </template>
+            <template #right="{ rightList: list }">
+              <view
+                class="flex flex-col gap-3"
+                :style="{
+                  marginLeft: `${gap / 2}rpx`,
+                }"
+              >
+                <lcb-action-view
+                  v-for="(item, index) in list"
+                  :key="`${item?.productId}:${index}`"
+                  v-bind="item.link"
+                  render-mode="view"
+                >
+                  <slot name="item" :item="item">
+                    <lcb-absolute-config-layout
+                      v-if="renderItemAbsoluteConfigLayout"
+                      :blocks="renderItemAbsoluteConfigLayout?.blocks"
+                      :canvas="renderItemAbsoluteConfigLayout?.canvas"
+                      :dataset="{
+                        ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
+                        ...item,
+                      }"
+                    />
+                    <lcb-product-item
+                      v-else
+                      v-bind="{ ...item, ...$props, ...attrs }"
+                      layoutType="vertical"
+                    >
+                      <template #coverImg="{ value }">
+                        <wd-img
+                          :src="value"
+                          width="100%"
+                          :lazyPlaceWidth="columnWidth"
+                          mode="aspectFill"
+                          :height="
+                            calculateImageHeight(
+                              screenWidth,
+                              item.coverImgProps?.[0]?.height,
+                              item.coverImgProps?.[0]?.width,
+                            )
+                          "
+                        />
+                      </template>
+                    </lcb-product-item>
+                  </slot>
+                </lcb-action-view>
+              </view>
+            </template>
+          </u-waterfall>
+        </view>
+        <!-- 单列滚动 -->
+        <template v-else-if="listType == 'horizontal'">
+          <lcb-action-view
+            v-for="(item, index) in renderList"
+            :key="`${item?.productId}:${index}`"
+            custom-class="flex-shrink-0 w-fit !h-auto"
+            v-bind="item.link"
+            render-mode="view"
           >
-            <lcb-action-view
-              v-for="(item, index) in list"
-              :key="`${item?.productId}:${index}`"
-              v-bind="item.link"
-              render-mode="view"
+            <view
+              :style="{
+                width: `${itemWidth}rpx`,
+                marginLeft: index === 0 ? 0 : `${gap}rpx`,
+              }"
+              class="h-full"
             >
               <slot name="item" :item="item">
                 <lcb-absolute-config-layout
@@ -315,73 +411,23 @@ defineExpose({
                 />
                 <lcb-product-item
                   v-else
+                  className="h-full"
                   v-bind="{ ...item, ...$props, ...attrs }"
-                  layoutType="vertical"
-                >
-                  <template #coverImg="{ value }">
-                    <wd-img
-                      :src="value"
-                      width="100%"
-                      :lazyPlaceWidth="columnWidth"
-                      mode="aspectFill"
-                      :height="
-                        calculateImageHeight(
-                          screenWidth,
-                          item.coverImgProps?.[0]?.height,
-                          item.coverImgProps?.[0]?.width,
-                        )
-                      "
-                    />
-                  </template>
-                </lcb-product-item>
+                  :coverImgStyle="{
+                    width: layoutType === 'vertical' ? '100%' : transformValueUnit(imageWidth),
+                    height: layoutType === 'vertical' ? transformValueUnit(imageHeight) : undefined,
+                    minHeight:
+                      layoutType !== 'vertical' ? transformValueUnit(imageHeight) : undefined,
+                    borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
+                    ...(attrs?.coverImgStyle ?? {}),
+                  }"
+                ></lcb-product-item>
               </slot>
-            </lcb-action-view>
-          </view>
+            </view>
+          </lcb-action-view>
         </template>
-      </u-waterfall>
-    </view>
-    <!-- 单列滚动 -->
-    <template v-else-if="listType == 'horizontal'">
-      <lcb-action-view
-        v-for="(item, index) in renderList"
-        :key="`${item?.productId}:${index}`"
-        custom-class="flex-shrink-0 w-fit !h-auto"
-        v-bind="item.link"
-        render-mode="view"
-      >
-        <view
-          :style="{
-            width: `${itemWidth}rpx`,
-            marginLeft: index === 0 ? 0 : `${gap}rpx`,
-          }"
-          class="h-full"
-        >
-          <slot name="item" :item="item">
-            <lcb-absolute-config-layout
-              v-if="renderItemAbsoluteConfigLayout"
-              :blocks="renderItemAbsoluteConfigLayout?.blocks"
-              :canvas="renderItemAbsoluteConfigLayout?.canvas"
-              :dataset="{
-                ...(renderItemAbsoluteConfigLayout?.dataset ?? {}),
-                ...item,
-              }"
-            />
-            <lcb-product-item
-              v-else
-              className="h-full"
-              v-bind="{ ...item, ...$props, ...attrs }"
-              :coverImgStyle="{
-                width: layoutType === 'vertical' ? '100%' : transformValueUnit(imageWidth),
-                height: layoutType === 'vertical' ? transformValueUnit(imageHeight) : undefined,
-                minHeight: layoutType !== 'vertical' ? transformValueUnit(imageHeight) : undefined,
-                borderRadius: imageRadius ? transformValueUnit(imageRadius) : undefined,
-                ...(attrs?.coverImgStyle ?? {}),
-              }"
-            ></lcb-product-item>
-          </slot>
-        </view>
-      </lcb-action-view>
-    </template>
+      </lcb-block>
+    </ProductSkeleton>
   </lcb-block>
 </template>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tplc/business",
-  "version": "0.4.107",
+  "version": "0.4.109",
   "keywords": [
     "业务组件"
   ],

package/types/components/lcb-product/components/ProductSkeleton/index.vue.d.ts

@@ -0,0 +1,70 @@
+import { LcbProductProps } from '../../types'
+declare function __VLS_template(): {
+  default?(_: {}): any
+}
+declare const __VLS_component: import('vue').DefineComponent<
+  __VLS_WithDefaults<
+    __VLS_TypePropsToOption<
+      LcbProductProps & {
+        loading?: boolean
+      }
+    >,
+    {}
+  >,
+  {},
+  unknown,
+  {},
+  {},
+  import('vue').ComponentOptionsMixin,
+  import('vue').ComponentOptionsMixin,
+  {},
+  string,
+  import('vue').PublicProps,
+  Readonly<
+    import('vue').ExtractPropTypes<
+      __VLS_WithDefaults<
+        __VLS_TypePropsToOption<
+          LcbProductProps & {
+            loading?: boolean
+          }
+        >,
+        {}
+      >
+    >
+  >,
+  {},
+  {}
+>
+declare const _default: __VLS_WithTemplateSlots<
+  typeof __VLS_component,
+  ReturnType<typeof __VLS_template>
+>
+export default _default
+type __VLS_WithDefaults<P, D> = {
+  [K in keyof Pick<P, keyof P>]: K extends keyof D
+    ? __VLS_Prettify<
+        P[K] & {
+          default: D[K]
+        }
+      >
+    : P[K]
+}
+type __VLS_Prettify<T> = {
+  [K in keyof T]: T[K]
+} & {}
+type __VLS_WithTemplateSlots<T, S> = T & {
+  new (): {
+    $slots: S
+  }
+}
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T
+type __VLS_TypePropsToOption<T> = {
+  [K in keyof T]-?: {} extends Pick<T, K>
+    ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>
+      }
+    : {
+        type: import('vue').PropType<T[K]>
+        required: true
+      }
+}

package/types/components/lcb-product/components/SKeletonItem/index.vue.d.ts

@@ -0,0 +1,28 @@
+import { LcbProductProps } from '../../types'
+declare const _default: import('vue').DefineComponent<
+  __VLS_TypePropsToOption<LcbProductProps>,
+  {},
+  unknown,
+  {},
+  {},
+  import('vue').ComponentOptionsMixin,
+  import('vue').ComponentOptionsMixin,
+  {},
+  string,
+  import('vue').PublicProps,
+  Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToOption<LcbProductProps>>>,
+  {},
+  {}
+>
+export default _default
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T
+type __VLS_TypePropsToOption<T> = {
+  [K in keyof T]-?: {} extends Pick<T, K>
+    ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>
+      }
+    : {
+        type: import('vue').PropType<T[K]>
+        required: true
+      }
+}