@tplc/business 0.7.51 → 0.7.53

package/CHANGELOG.md

@@ -2,6 +2,54 @@
 
 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.7.53](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/compare/v0.7.51...v0.7.53) (2026-01-07)
+
+
+### 🚀 Chore | 构建/工程依赖/工具
+
+* **release:** 0.7.52 ([ee19331](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/ee193313d84f6116acdc38630ecc010fa29fcc37))
+
+
+### ✨ Features | 新功能
+
+* **lcb-wrapper-list:** implement pagination support with z-paging and enhance dynamic style handling in lcb-block ([f345e4e](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/f345e4e0d84231db8e72fd55fefebdf01eac3bd6))
+
+
+### 🐛 Bug Fixes | Bug 修复
+
+* **lcb-area:** set default value for compareValues function to prevent potential errors ([4e5e48a](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/4e5e48a373ba00e491c5cd002da5792e57006aec))
+* **lcb-area:** use nullish coalescing for default flex value in itemStylesCache ([421d71c](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/421d71c428f4a2f3db37169e9d5dd6ccdc1d6d07))
+
+
+### ♻️ Code Refactoring | 代码重构
+
+* **lcb-area, lcb-button:** optimize actionProps computation and streamline data source selection ([117ce0d](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/117ce0df62ee17b25a341c4dd3b51b90a0f78bd8))
+* **lcb-wrapper-list:** streamline pagination implementation and enhance style handling in lcb-block ([9bb70e5](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/9bb70e58d28cb5575760d6fad0da81dec229beab))
+
+### [0.7.52](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/compare/v0.7.48...v0.7.52) (2026-01-07)
+
+
+### ♻️ Code Refactoring | 代码重构
+
+* **lcb-area:** update comparison logic to use compareType prop for improved clarity ([525e606](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/525e606ba08288fc1f048a68208575214cf8f274))
+
+
+### ✨ Features | 新功能
+
+* **lcb-block:** add styleKey to dynamic options and update style handling for improved flexibility ([014469d](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/014469da25766f682cff0d63a932b82504f41d7d))
+
+
+### 🚀 Chore | 构建/工程依赖/工具
+
+* **release:** 0.7.49 ([173d24d](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/173d24dc7bcdc7c3112db232ac14c3509232cd89))
+* **release:** 0.7.50 ([c6f5712](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/c6f5712c7bf9558a6336a148f15a4ba225d11104))
+* **release:** 0.7.51 ([4acced8](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/4acced89cd89f3105b4797644ad7feefab55aa09))
+
+
+### 🐛 Bug Fixes | Bug 修复
+
+* **lcb-area:** set default value for compareValues function to prevent potential errors ([4e5e48a](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/commit/4e5e48a373ba00e491c5cd002da5792e57006aec))
+
 ### [0.7.51](https://gitlab888.30jia.com.cn/tourism-front/zero-code-pro/compare/v0.7.50...v0.7.51) (2026-01-06)
 
 

package/components/lcb-area/lcb-area.vue

@@ -31,7 +31,7 @@ import { LcbAreaProps } from './types'
 import { getFlexStyle, transformValueUnit } from '@tplc/business/utils/transform'
 import { get } from 'lodash-es'
 import { dynamicRequest } from '../../utils/request'
-import { getDynamicData } from '../../utils/utils'
+import { resolveActionProps, selectDynamicSource } from '../../utils/componentHelpers'
 import useDynamicData from '../../hooks/useDynamicData'
 defineOptions({
   name: 'LcbArea',
@@ -96,7 +96,7 @@ const itemStylesCache = computed(() => {
       return {
         ...commonItemStyle.value,
         gridColumn: colSpan && isGrid ? `span ${colSpan} / span ${colSpan}` : undefined,
-        flex: isFlex ? flex || 'auto' : undefined,
+        flex: isFlex ? (flex ?? 'auto') : undefined,
         flexShrink: isFlex ? flexShrink : undefined,
         width: flex ? '100%' : 'auto',
       }
@@ -121,24 +121,12 @@ const getData = async () => {
 
 /** 处理跳转链接中的动态参数 */
 const actionProps = computed(() => {
-  const jumpUrl = props.action?.jumpUrl
-  if (!jumpUrl) {
-    return props.action
-  }
-
-  // 优化: 提前返回,避免不必要的计算
-  if (props.dynamicActionKey) {
-    return get(innerDynamicData.value, props.dynamicActionKey)
-  }
-
-  // 优化: 只在 jumpUrl 存在时才调用 getDynamicData
-
-  return {
-    ...props.action,
-    jumpUrl: getDynamicData(jumpUrl, {
-      store: innerDynamicData.value,
-    }),
-  }
+  return resolveActionProps({
+    dynamicActionKey: props.dynamicActionKey,
+    action: props.action as any,
+    innerDynamicData: innerDynamicData.value,
+    templateStore: innerDynamicData.value,
+  })
 })
 
 // 优化: 移除 deep: true,只监听引用变化
@@ -176,7 +164,7 @@ const compareValues = (value = '', compareValue: string, compareType: string) =>
 
 // 优化: 缓存数据源
 const dependDataSource = computed(() => {
-  return props.keyFromUser ? userStore?.userInfo : innerDynamicData.value
+  return selectDynamicSource(props.keyFromUser, userStore?.userInfo, innerDynamicData.value)
 })
 
 const showArea = computed(() => {

package/components/lcb-block/lcb-block.vue

@@ -48,24 +48,14 @@ const innerBackgroundColor = computed(() => {
 })
 
 const getInnerStyle = computed(() => {
-  const innerStyle = props.dynamicStyleOptions?.reduce(
-    (acc, { styleKey }) => {
-      if (styleKey) {
-        const currentOptions = props.dynamicStyleOptions?.[styleKey]
-        const data = get(
-          currentOptions?.keyFrom === 'user' ? userStore?.userInfo : innerDynamicData.value,
-          currentOptions?.dynamicKey || '',
-        )
-        if (data) {
-          acc[styleKey] = data
-        }
-      }
-
-      return acc
-    },
-    {} as Record<string, string>,
-  )
-  return innerStyle
+  if (props.dynamicStyleOptions?.dynamicKey) {
+    const innerStyle = get(
+      props.dynamicStyleOptions?.keyFrom === 'user' ? userStore?.userInfo : innerDynamicData.value,
+      props.dynamicStyleOptions?.dynamicKey,
+    )
+    return innerStyle
+  }
+  return {}
 })
 
 // 缓存 padding 计算结果，减少 transformValueUnit 调用次数

package/components/lcb-block/types.ts

@@ -57,7 +57,7 @@ export interface LcbBlockProps {
     | 'bottom-right'
 
   // 动态样式集合
-  dynamicStyleOptions?: DynamicOptions[]
+  dynamicStyleOptions?: DynamicOptions
   dynamicBgImage?: string
 }
 export interface LcbBlockInnerProps extends LcbBlockProps {

package/components/lcb-button/lcb-button.vue

@@ -11,7 +11,11 @@
         @avatar="onAvatar"
         @click="handleClick"
         :customStyle="actionPaddingStyle"
-        :renderMode="!actionProps?.jumpType && mode !== 'image' ? 'noClick' : 'button'"
+        :renderMode="
+          !actionProps?.jumpType && (mode === 'image' ? !enablePreview : true)
+            ? 'noClick'
+            : 'button'
+        "
       >
         <view class="!flex items-center justify-center" :style="iconGapStyle">
           <wd-icon
@@ -63,6 +67,7 @@ import { computed } from 'vue'
 import useDynamicData from '../../hooks/useDynamicData'
 import { getFlexStyle, transformValueUnit } from '../../utils/transform'
 import { getDynamicData } from '../../utils/utils'
+import { resolveActionProps, selectDynamicSource } from '../../utils/componentHelpers'
 import { LcbButtonProps } from './types'
 defineOptions({
   name: 'LcbButton',
@@ -85,7 +90,7 @@ const { userStore, innerDynamicData } = useDynamicData()
 
 // 优化: 缓存 store 数据源
 const store = computed(() => {
-  return props.keyFromUser ? userStore?.userInfo : innerDynamicData.value
+  return selectDynamicSource(props.keyFromUser, userStore?.userInfo, innerDynamicData.value)
 })
 
 const dynamicValue = computed(() => {
@@ -122,25 +127,13 @@ const innerValue = computed(() => {
   })
 })
 
-/** 处理跳转链接中的动态参数 */
 const actionProps = computed(() => {
-  // 优化: 提前返回,避免不必要的计算
-  if (props.dynamicActionKey) {
-    return get(innerDynamicData.value, props.dynamicActionKey)
-  }
-
-  // 优化: 只在 jumpUrl 存在时才调用 getDynamicData
-  const jumpUrl = props.action?.jumpUrl
-  if (!jumpUrl) {
-    return props.action
-  }
-
-  return {
-    ...props.action,
-    jumpUrl: getDynamicData(jumpUrl, {
-      store: store.value,
-    }),
-  }
+  return resolveActionProps({
+    dynamicActionKey: props.dynamicActionKey,
+    action: props.action as any,
+    innerDynamicData: innerDynamicData.value,
+    templateStore: store.value,
+  })
 })
 
 const onAvatar = (headImgUrl) => {

package/components/lcb-calendar-search/lcb-calendar-search.vue

@@ -44,7 +44,14 @@
           v-bind="inputLink"
           custom-class="!w-full !truncate !pr-2"
           :customStyle="{
-            color: form.keywords ? 'var(--content-color)' : '#969696',
+            fontSize: placeholderFontSize ? `${placeholderFontSize}rpx` : undefined,
+            fontWeight: placeholderFontWeight,
+            fontFamily: placeholderFontFamily,
+            color: placeholderColor
+              ? placeholderColor
+              : form.keywords
+                ? 'var(--content-color)'
+                : '#969696',
           }"
           :url-params="urlParams"
         >

package/components/lcb-calendar-search/types.ts

@@ -8,4 +8,8 @@ export interface LcbCalendarSearchProps extends LcbBlockProps {
   icon?: string
   mode?: 'link' | 'search'
   inputLink?: LcbActionViewProps
+  placeholderColor?: string
+  placeholderFontSize?: number
+  placeholderFontWeight?: number
+  placeholderFontFamily?: string
 }

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

@@ -146,26 +146,6 @@ const coverImgWidth = computed(() => {
             mode="heightFix"
           />
         </view>
-        <!-- area -->
-        <!-- && itemProps.areaOnImg -->
-        <view
-          v-if="
-            itemProps.showArea &&
-            itemAttrs.cityArea &&
-            itemProps.areaOnImg &&
-            !itemProps.imgBottomIcon
-          "
-          class="flex absolute bottom-0 left-0 z-1 gap-1 p-1 w-full box-border text-white text-3.5 items-center text-shadow-xl"
-          :style="{
-            color: itemProps.areaColor,
-            fontSize: `${itemProps.areaFontSize}rpx`,
-          }"
-        >
-          <wd-icon name="location"></wd-icon>
-          <view class="line-clamp-1">
-            {{ itemAttrs.cityArea }}
-          </view>
-        </view>
         <slot></slot>
       </view>
     </block>

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

@@ -63,6 +63,9 @@ const props = withDefaults(defineProps<LcbProductItemProps>(), {
   itemContentPl: 0,
   itemGap: 10,
   titleOnImg: false,
+  areaOnImg: false,
+  addressOnImg: false,
+  priceOnImg: false,
 })
 const attrs = useAttrs() as Record<string, any>
 provide('lcb-product-item-props', props)
@@ -147,6 +150,48 @@ const titleOnImgTextStyle = computed(() => {
     ...(props.productNameStyle || {}),
   }
 })
+
+const blockedByImgBottomIcon = computed(() => !!(props.imgBottomIcon && props.imgBottomIconVisible))
+
+const titleOnImgVisible = computed(() => {
+  return (
+    !!props.titleOnImg &&
+    !!props.productNameVisible &&
+    !!props.productName &&
+    !blockedByImgBottomIcon.value
+  )
+})
+
+const areaOnImgVisible = computed(() => {
+  return !!(props.areaOnImg && props.showArea && attrs.cityArea && !blockedByImgBottomIcon.value)
+})
+
+const addressOnImgVisible = computed(() => {
+  return !!(
+    props.addressOnImg &&
+    props.addressIntroVisible &&
+    !!props.addressIntro &&
+    !blockedByImgBottomIcon.value
+  )
+})
+
+const priceOnImgVisible = computed(() => {
+  if (!props.priceOnImg || blockedByImgBottomIcon.value) return false
+
+  const hasScribePrice = props.scribePriceVisible && isNumber(props.scribePrice)
+  const hasPrice = props.priceVisible && isNumber(props.price)
+  const hasPriceTips = props.priceTipsVisible && !!props.priceTips
+  return !!(hasScribePrice || hasPrice || hasPriceTips)
+})
+
+const imgOverlayVisible = computed(() => {
+  return (
+    titleOnImgVisible.value ||
+    areaOnImgVisible.value ||
+    addressOnImgVisible.value ||
+    priceOnImgVisible.value
+  )
+})
 </script>
 
 <template>
@@ -169,28 +214,84 @@ const titleOnImgTextStyle = computed(() => {
         <template #default>
           <slot name="coverImgSection" />
           <view
-            v-if="
-              titleOnImg &&
-              productNameVisible &&
-              !!productName &&
-              !(imgBottomIcon && imgBottomIconVisible)
-            "
+            v-if="imgOverlayVisible"
             class="absolute left-0 w-full z-1 p-1 box-border text-white text-shadow-xl bottom-0"
             :style="titleOnImgMaskStyle"
           >
-            <slot name="productName" :value="productName">
+            <view class="flex flex-col gap-1 items-start">
+              <view v-if="titleOnImgVisible" class="w-full">
+                <slot name="productName" :value="productName">
+                  <view
+                    :class="[
+                      productNameClass,
+                      'inline text-[32rpx] font-bold',
+                      `line-clamp-${titleLineClamp}`,
+                      'whitespace-pre-wrap',
+                    ]"
+                    :style="titleOnImgTextStyle"
+                  >
+                    {{ productName }}
+                  </view>
+                </slot>
+              </view>
+
               <view
-                :class="[
-                  productNameClass,
-                  'inline text-[32rpx] font-bold',
-                  `line-clamp-${titleLineClamp}`,
-                  'whitespace-pre-wrap',
-                ]"
-                :style="titleOnImgTextStyle"
+                v-if="areaOnImgVisible || addressOnImgVisible"
+                class="flex gap-1 items-center w-full"
+                :style="{
+                  color: areaColor,
+                  fontSize: `${areaFontSize}rpx`,
+                }"
               >
-                {{ productName }}
+                <wd-icon name="location"></wd-icon>
+                <view class="line-clamp-1">
+                  {{ areaOnImgVisible ? attrs.cityArea : addressIntro }}
+                </view>
               </view>
-            </slot>
+
+              <view v-if="priceOnImgVisible" class="flex flex-col gap-1 items-start leading-none">
+                <view class="flex gap-1 justify-start w-full flex-wrap">
+                  <view
+                    class="flex gap-[2rpx] items-end line-through"
+                    v-if="scribePriceVisible && isNumber(scribePrice)"
+                  >
+                    <template
+                      v-for="propName in ['scribePriceUnit', 'scribePrice', 'scribePriceSuffix']"
+                      :key="propName"
+                    >
+                      <ItemValue :prop="propName" v-if="!!$slots?.[propName]">
+                        <template #scribePrice="{ value }">
+                          <slot name="scribePrice" :value="value" />
+                        </template>
+                        <template #scribePriceUnit="{ value }">
+                          <slot name="scribePriceUnit" :value="value" />
+                        </template>
+                        <template #scribePriceSuffix="{ value }">
+                          <slot name="scribePriceSuffix" :value="value" />
+                        </template>
+                      </ItemValue>
+                      <ItemValue :prop="propName" v-else />
+                    </template>
+                  </view>
+
+                  <view
+                    class="flex gap-[4rpx] items-end justify-start"
+                    v-if="priceVisible && isNumber(price)"
+                  >
+                    <ItemValue prop="pricePrefix" />
+                    <ItemValue prop="priceUnit" />
+                    <ItemValue prop="price" />
+                    <ItemValue prop="priceSuffix" />
+                  </view>
+                </view>
+                <ItemValue prop="priceTips" v-if="!!$slots?.priceTips">
+                  <template #priceTips="{ value }">
+                    <slot name="priceTips" :value="value" />
+                  </template>
+                </ItemValue>
+                <ItemValue prop="priceTips" v-else />
+              </view>
+            </view>
           </view>
         </template>
         <template #coverImg="{ value }">
@@ -205,28 +306,84 @@ const titleOnImgTextStyle = computed(() => {
         <template #default>
           <slot name="coverImgSection" />
           <view
-            v-if="
-              titleOnImg &&
-              productNameVisible &&
-              !!productName &&
-              !(imgBottomIcon && imgBottomIconVisible)
-            "
+            v-if="imgOverlayVisible"
             class="absolute left-0 w-full z-1 p-1 box-border text-white text-shadow-xl bottom-0"
             :style="titleOnImgMaskStyle"
           >
-            <slot name="productName" :value="productName">
+            <view class="flex flex-col gap-1 items-start">
+              <view v-if="titleOnImgVisible" class="w-full">
+                <slot name="productName" :value="productName">
+                  <view
+                    :class="[
+                      productNameClass,
+                      'inline text-[32rpx] font-bold',
+                      `line-clamp-${titleLineClamp}`,
+                      'whitespace-pre-wrap',
+                    ]"
+                    :style="titleOnImgTextStyle"
+                  >
+                    {{ productName }}
+                  </view>
+                </slot>
+              </view>
+
               <view
-                :class="[
-                  productNameClass,
-                  'inline text-[32rpx] font-bold',
-                  `line-clamp-${titleLineClamp}`,
-                  'whitespace-pre-wrap',
-                ]"
-                :style="titleOnImgTextStyle"
+                v-if="areaOnImgVisible || addressOnImgVisible"
+                class="flex gap-1 items-center w-full"
+                :style="{
+                  color: areaColor,
+                  fontSize: `${areaFontSize}rpx`,
+                }"
               >
-                {{ productName }}
+                <wd-icon name="location"></wd-icon>
+                <view class="line-clamp-1">
+                  {{ areaOnImgVisible ? attrs.cityArea : addressIntro }}
+                </view>
               </view>
-            </slot>
+
+              <view v-if="priceOnImgVisible" class="flex flex-col gap-1 items-start leading-none">
+                <view class="flex gap-1 justify-start w-full flex-wrap">
+                  <view
+                    class="flex gap-[2rpx] items-end line-through"
+                    v-if="scribePriceVisible && isNumber(scribePrice)"
+                  >
+                    <template
+                      v-for="propName in ['scribePriceUnit', 'scribePrice', 'scribePriceSuffix']"
+                      :key="propName"
+                    >
+                      <ItemValue :prop="propName" v-if="!!$slots?.[propName]">
+                        <template #scribePrice="{ value }">
+                          <slot name="scribePrice" :value="value" />
+                        </template>
+                        <template #scribePriceUnit="{ value }">
+                          <slot name="scribePriceUnit" :value="value" />
+                        </template>
+                        <template #scribePriceSuffix="{ value }">
+                          <slot name="scribePriceSuffix" :value="value" />
+                        </template>
+                      </ItemValue>
+                      <ItemValue :prop="propName" v-else />
+                    </template>
+                  </view>
+
+                  <view
+                    class="flex gap-[4rpx] items-end justify-start"
+                    v-if="priceVisible && isNumber(price)"
+                  >
+                    <ItemValue prop="pricePrefix" />
+                    <ItemValue prop="priceUnit" />
+                    <ItemValue prop="price" />
+                    <ItemValue prop="priceSuffix" />
+                  </view>
+                </view>
+                <ItemValue prop="priceTips" v-if="!!$slots?.priceTips">
+                  <template #priceTips="{ value }">
+                    <slot name="priceTips" :value="value" />
+                  </template>
+                </ItemValue>
+                <ItemValue prop="priceTips" v-else />
+              </view>
+            </view>
           </view>
         </template>
       </ItemValue>
@@ -274,7 +431,7 @@ const titleOnImgTextStyle = computed(() => {
             </ItemValue>
           </view>
 
-          <ItemValue prop="addressIntro" v-if="addressIntroVisible">
+          <ItemValue prop="addressIntro" v-if="addressIntroVisible && !addressOnImg">
             <!-- <template #addressIntro="{ value }"> -->
             <!-- <slot name="addressIntro" :value="value" /> -->
             <!-- </template> -->
@@ -311,6 +468,7 @@ const titleOnImgTextStyle = computed(() => {
         </view>
         <view class="flex-1"></view>
         <view
+          v-if="!priceOnImg"
           class="flex flex-col gap-1 items-end leading-none"
           :style="{
             marginTop: transformValueUnit(itemGap),
@@ -399,28 +557,84 @@ const titleOnImgTextStyle = computed(() => {
         <template #default>
           <slot name="coverImgSection" />
           <view
-            v-if="
-              titleOnImg &&
-              productNameVisible &&
-              !!productName &&
-              !(imgBottomIcon && imgBottomIconVisible)
-            "
+            v-if="imgOverlayVisible"
             class="absolute left-0 w-full z-1 p-1 box-border text-white text-shadow-xl bottom-0"
             :style="titleOnImgMaskStyle"
           >
-            <slot name="productName" :value="productName">
+            <view class="flex flex-col gap-1 items-start">
+              <view v-if="titleOnImgVisible" class="w-full">
+                <slot name="productName" :value="productName">
+                  <view
+                    :class="[
+                      productNameClass,
+                      'inline text-[32rpx] font-bold',
+                      `line-clamp-${titleLineClamp}`,
+                      'whitespace-pre-wrap',
+                    ]"
+                    :style="titleOnImgTextStyle"
+                  >
+                    {{ productName }}
+                  </view>
+                </slot>
+              </view>
+
               <view
-                :class="[
-                  productNameClass,
-                  'inline text-[32rpx] font-bold',
-                  `line-clamp-${titleLineClamp}`,
-                  'whitespace-pre-wrap',
-                ]"
-                :style="titleOnImgTextStyle"
+                v-if="areaOnImgVisible || addressOnImgVisible"
+                class="flex gap-1 items-center w-full"
+                :style="{
+                  color: areaColor,
+                  fontSize: `${areaFontSize}rpx`,
+                }"
               >
-                {{ productName }}
+                <wd-icon name="location"></wd-icon>
+                <view class="line-clamp-1">
+                  {{ areaOnImgVisible ? attrs.cityArea : addressIntro }}
+                </view>
+              </view>
+
+              <view v-if="priceOnImgVisible" class="flex flex-col gap-1 items-start leading-none">
+                <view class="flex gap-1 justify-start w-full flex-wrap">
+                  <view
+                    class="flex gap-[2rpx] items-end line-through"
+                    v-if="scribePriceVisible && isNumber(scribePrice)"
+                  >
+                    <template
+                      v-for="propName in ['scribePriceUnit', 'scribePrice', 'scribePriceSuffix']"
+                      :key="propName"
+                    >
+                      <ItemValue :prop="propName" v-if="!!$slots?.[propName]">
+                        <template #scribePrice="{ value }">
+                          <slot name="scribePrice" :value="value" />
+                        </template>
+                        <template #scribePriceUnit="{ value }">
+                          <slot name="scribePriceUnit" :value="value" />
+                        </template>
+                        <template #scribePriceSuffix="{ value }">
+                          <slot name="scribePriceSuffix" :value="value" />
+                        </template>
+                      </ItemValue>
+                      <ItemValue :prop="propName" v-else />
+                    </template>
+                  </view>
+
+                  <view
+                    class="flex gap-[4rpx] items-end justify-start"
+                    v-if="priceVisible && isNumber(price)"
+                  >
+                    <ItemValue prop="pricePrefix" />
+                    <ItemValue prop="priceUnit" />
+                    <ItemValue prop="price" />
+                    <ItemValue prop="priceSuffix" />
+                  </view>
+                </view>
+                <ItemValue prop="priceTips" v-if="!!$slots?.priceTips">
+                  <template #priceTips="{ value }">
+                    <slot name="priceTips" :value="value" />
+                  </template>
+                </ItemValue>
+                <ItemValue prop="priceTips" v-else />
               </view>
-            </slot>
+            </view>
           </view>
         </template>
         <template #coverImg="{ value }">
@@ -431,28 +645,84 @@ const titleOnImgTextStyle = computed(() => {
         <template #default>
           <slot name="coverImgSection" />
           <view
-            v-if="
-              titleOnImg &&
-              productNameVisible &&
-              !!productName &&
-              !(imgBottomIcon && imgBottomIconVisible)
-            "
+            v-if="imgOverlayVisible"
             class="absolute left-0 w-full z-1 p-1 box-border text-white text-shadow-xl bottom-0"
             :style="titleOnImgMaskStyle"
           >
-            <slot name="productName" :value="productName">
+            <view class="flex flex-col gap-1 items-start">
+              <view v-if="titleOnImgVisible" class="w-full">
+                <slot name="productName" :value="productName">
+                  <view
+                    :class="[
+                      productNameClass,
+                      'inline text-[32rpx] font-bold',
+                      `line-clamp-${titleLineClamp}`,
+                      'whitespace-pre-wrap',
+                    ]"
+                    :style="titleOnImgTextStyle"
+                  >
+                    {{ productName }}
+                  </view>
+                </slot>
+              </view>
+
               <view
-                :class="[
-                  productNameClass,
-                  'inline text-[32rpx] font-bold',
-                  `line-clamp-${titleLineClamp}`,
-                  'whitespace-pre-wrap',
-                ]"
-                :style="titleOnImgTextStyle"
+                v-if="areaOnImgVisible || addressOnImgVisible"
+                class="flex gap-1 items-center w-full"
+                :style="{
+                  color: areaColor,
+                  fontSize: `${areaFontSize}rpx`,
+                }"
               >
-                {{ productName }}
+                <wd-icon name="location"></wd-icon>
+                <view class="line-clamp-1">
+                  {{ areaOnImgVisible ? attrs.cityArea : addressIntro }}
+                </view>
               </view>
-            </slot>
+
+              <view v-if="priceOnImgVisible" class="flex flex-col gap-1 items-start leading-none">
+                <view class="flex gap-1 justify-start w-full flex-wrap">
+                  <view
+                    class="flex gap-[2rpx] items-end line-through"
+                    v-if="scribePriceVisible && isNumber(scribePrice)"
+                  >
+                    <template
+                      v-for="propName in ['scribePriceUnit', 'scribePrice', 'scribePriceSuffix']"
+                      :key="propName"
+                    >
+                      <ItemValue :prop="propName" v-if="!!$slots?.[propName]">
+                        <template #scribePrice="{ value }">
+                          <slot name="scribePrice" :value="value" />
+                        </template>
+                        <template #scribePriceUnit="{ value }">
+                          <slot name="scribePriceUnit" :value="value" />
+                        </template>
+                        <template #scribePriceSuffix="{ value }">
+                          <slot name="scribePriceSuffix" :value="value" />
+                        </template>
+                      </ItemValue>
+                      <ItemValue :prop="propName" v-else />
+                    </template>
+                  </view>
+
+                  <view
+                    class="flex gap-[4rpx] items-end justify-start"
+                    v-if="priceVisible && isNumber(price)"
+                  >
+                    <ItemValue prop="pricePrefix" />
+                    <ItemValue prop="priceUnit" />
+                    <ItemValue prop="price" />
+                    <ItemValue prop="priceSuffix" />
+                  </view>
+                </view>
+                <ItemValue prop="priceTips" v-if="!!$slots?.priceTips">
+                  <template #priceTips="{ value }">
+                    <slot name="priceTips" :value="value" />
+                  </template>
+                </ItemValue>
+                <ItemValue prop="priceTips" v-else />
+              </view>
+            </view>
           </view>
         </template>
       </ItemValue>
@@ -494,7 +764,7 @@ const titleOnImgTextStyle = computed(() => {
             </ItemValue>
           </view>
 
-          <ItemValue prop="addressIntro" v-if="addressIntroVisible">
+          <ItemValue prop="addressIntro" v-if="addressIntroVisible && !addressOnImg">
             <!-- <template #addressIntro="{ value }">
               <slot name="addressIntro" :value="value" />
             </template> -->
@@ -529,6 +799,7 @@ const titleOnImgTextStyle = computed(() => {
         </view>
         <view class="flex-1"></view>
         <view
+          v-if="!priceOnImg"
           class="flex flex-col gap-1 items-end leading-none"
           :style="{
             marginTop: transformValueUnit(itemGap),

package/components/lcb-product-item/types.ts

@@ -16,6 +16,8 @@ export interface LcbProductItemProps {
   tagType?: TagType
   tagContentColor?: string
   addressOnImg?: boolean
+  // 价格块显示在图片上（包含 price / scribePrice 及其相关字段）
+  priceOnImg?: boolean
   tagBgColor?: string
   tagPlain?: boolean
   tagMark?: boolean

package/components/lcb-wrapper-list/lcb-wrapper-list.vue

@@ -1,5 +1,27 @@
 <template>
-  <lcb-block v-bind="$props" :custom-style="listStyle" v-if="renderList.length">
+  <z-paging
+    ref="paging"
+    :auto="true"
+    v-model="renderList"
+    @query="queryList"
+    :fixed="false"
+    :default-page-size="props.pageProps?.pageLimit"
+    :use-page-scroll="props.pageProps?.pagingUsePageScroll"
+    :height="props.pageProps?.pagingUsePageScroll ? undefined : props.pageProps?.pagingHeight"
+    v-if="props.pageProps?.pagingEnabled"
+  >
+    <lcb-block v-bind="$props" :custom-style="listStyle">
+      <view
+        v-for="(item, index) in renderList"
+        :key="getItemKey(item, index)"
+        class="flex-shrink-0"
+        :style="itemStyle"
+      >
+        <slot :data="item" :list="list" />
+      </view>
+    </lcb-block>
+  </z-paging>
+  <lcb-block v-bind="$props" :custom-style="listStyle" v-else>
     <view
       v-for="(item, index) in renderList"
       :key="getItemKey(item, index)"
@@ -13,7 +35,8 @@
 
 <script setup lang="ts">
 import { transformValueUnit } from '@tplc/business/utils/transform'
-import { computed, watch, shallowRef } from 'vue'
+import { computed, watch, shallowRef, ref } from 'vue'
+import useZPaging from 'z-paging/components/z-paging/js/hooks/useZPaging'
 import useDynamicData from '../../hooks/useDynamicData'
 import { dynamicRequest } from '../../utils/request'
 import { LcbWrapperListProps } from './types'
@@ -28,10 +51,19 @@ defineOptions({
 const props = withDefaults(defineProps<LcbWrapperListProps>(), {
   display: 'flex',
   flexDirection: 'column',
+  pagingEnabled: false,
+  pageLimit: 10,
+  pagingUsePageScroll: true,
 })
 const { userStore, innerDynamicData } = useDynamicData()
 // 使用 shallowRef 优化大数组的响应式性能
 const renderList = shallowRef<unknown[]>([])
+const paging = ref()
+useZPaging(paging)
+const pageSearch = shallowRef<{ limit: number; page: number }>({
+  limit: props.pageLimit,
+  page: 1,
+})
 
 // 优化:检查是否需要转换,避免不必要的遍历
 const transformStringArrayToObjectArray = (data: unknown[]): unknown[] => {
@@ -47,10 +79,33 @@ const transformStringArrayToObjectArray = (data: unknown[]): unknown[] => {
   })
 }
 
+const queryList = async (page: number, limit: number) => {
+  pageSearch.value = { page, limit }
+  const data = await dynamicRequest(props.dataSource, innerDynamicData.value, userStore?.userInfo, {
+    pageSearch: pageSearch.value,
+  })
+  paging.value?.complete?.(data)
+}
+
 watch(
-  () => [props.dataSource, innerDynamicData.value, userStore?.userInfo] as const,
+  () =>
+    [
+      props.dataSource,
+      innerDynamicData.value,
+      userStore?.userInfo,
+      props.pageProps?.pagingEnabled,
+      props.pageProps?.pageLimit,
+    ] as const,
 
-  async ([dataSource, dynamicData, userInfo]) => {
+  async ([dataSource, dynamicData, userInfo, pagingEnabled, pageLimit = 10]) => {
+    if (pagingEnabled) {
+      pageSearch.value = {
+        limit: pageLimit,
+        page: 1,
+      }
+      paging.value?.reload?.()
+      return
+    }
     // 防止重复请求
     let data: unknown[] = []
     const result = await dynamicRequest(dataSource, dynamicData, userInfo)
@@ -81,11 +136,12 @@ const itemStyle = computed(() => {
 
 // 优化:减少对象创建,使用固定的样式对象
 const listStyle = computed(() => {
+  const gap = transformValueUnit(props.gap)
   return {
     width: '100%',
     display: props.display,
     'flex-direction': props.flexDirection,
-    gap: transformValueUnit(props.gap),
+    gap,
     'align-items': 'stretch',
     'grid-template-columns': `repeat(${props.gridColumns}, minmax(0, 1fr))`,
     'overflow-x': props.scrollX ? 'auto' : 'hidden',

package/components/lcb-wrapper-list/types.ts

@@ -11,4 +11,22 @@ export interface LcbWrapperListProps extends LcbBlockProps {
   scrollX?: boolean
   list?: LcbAreaProps[]
   childrenAutoWidth?: boolean
+  pageProps: {
+    /**
+     * 开启下拉刷新+上拉加载（基于 z-paging）
+     */
+    pagingEnabled?: boolean
+    /**
+     * 分页大小，对应 pageSearch.limit，默认 10
+     */
+    pageLimit?: number
+    /**
+     * z-paging 是否使用页面滚动模式，默认 true
+     */
+    pagingUsePageScroll?: boolean
+    /**
+     * 非页面滚动模式下的高度（pagingUsePageScroll=false 时生效）
+     */
+    pagingHeight?: string
+  }
 }

package/package.json

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

package/types/components/lcb-block/types.d.ts

@@ -54,7 +54,7 @@ export interface LcbBlockProps {
     | 'bottom-left'
     | 'bottom-center'
     | 'bottom-right'
-  dynamicStyleOptions?: DynamicOptions[]
+  dynamicStyleOptions?: DynamicOptions
   dynamicBgImage?: string
 }
 export interface LcbBlockInnerProps extends LcbBlockProps {

package/types/components/lcb-calendar-search/types.d.ts

@@ -6,4 +6,8 @@ export interface LcbCalendarSearchProps extends LcbBlockProps {
   icon?: string
   mode?: 'link' | 'search'
   inputLink?: LcbActionViewProps
+  placeholderColor?: string
+  placeholderFontSize?: number
+  placeholderFontWeight?: number
+  placeholderFontFamily?: string
 }

package/types/components/lcb-list/lcb-list.vue.d.ts

@@ -66,7 +66,7 @@ declare const __VLS_component: import('vue').DefineComponent<
       | 'bottom-left'
       | 'bottom-center'
       | 'bottom-right'
-    dynamicStyleOptions: import('../../action').DynamicOptions[]
+    dynamicStyleOptions: import('../../action').DynamicOptions
     dynamicBgImage: string
     gap: number
     imageWidth: number

package/types/components/lcb-product-item/lcb-product-item.vue.d.ts

@@ -120,6 +120,9 @@ declare const __VLS_component: import('vue').DefineComponent<
       itemContentPl: number
       itemGap: number
       titleOnImg: boolean
+      areaOnImg: boolean
+      addressOnImg: boolean
+      priceOnImg: boolean
     }
   >,
   {},
@@ -184,6 +187,9 @@ declare const __VLS_component: import('vue').DefineComponent<
           itemContentPl: number
           itemGap: number
           titleOnImg: boolean
+          areaOnImg: boolean
+          addressOnImg: boolean
+          priceOnImg: boolean
         }
       >
     >
@@ -204,8 +210,11 @@ declare const __VLS_component: import('vue').DefineComponent<
     itemContentPl: number
     priceUnit: any
     scribePriceUnit: any
+    areaOnImg: boolean
     tagOverflowWrap: boolean
     tagType: import('@tplc/wot/components/wd-tag/types').TagType
+    addressOnImg: boolean
+    priceOnImg: boolean
     tagPlain: boolean
     tagMark: boolean
     tagRound: boolean

package/types/components/lcb-product-item/types.d.ts

@@ -13,6 +13,7 @@ export interface LcbProductItemProps {
   tagType?: TagType
   tagContentColor?: string
   addressOnImg?: boolean
+  priceOnImg?: boolean
   tagBgColor?: string
   tagPlain?: boolean
   tagMark?: boolean

package/types/components/lcb-wrapper-list/lcb-wrapper-list.vue.d.ts

@@ -1,6 +1,7 @@
 import { LcbWrapperListProps } from './types'
 declare function __VLS_template(): {
   default?(_: { data: unknown; list: import('../lcb-area/types').LcbAreaProps[] | undefined }): any
+  default?(_: { data: unknown; list: import('../lcb-area/types').LcbAreaProps[] | undefined }): any
 }
 declare const __VLS_component: import('vue').DefineComponent<
   __VLS_WithDefaults<
@@ -8,6 +9,9 @@ declare const __VLS_component: import('vue').DefineComponent<
     {
       display: string
       flexDirection: string
+      pagingEnabled: boolean
+      pageLimit: number
+      pagingUsePageScroll: boolean
     }
   >,
   {},
@@ -26,6 +30,9 @@ declare const __VLS_component: import('vue').DefineComponent<
         {
           display: string
           flexDirection: string
+          pagingEnabled: boolean
+          pageLimit: number
+          pagingUsePageScroll: boolean
         }
       >
     >

package/types/components/lcb-wrapper-list/types.d.ts

@@ -11,4 +11,22 @@ export interface LcbWrapperListProps extends LcbBlockProps {
   scrollX?: boolean
   list?: LcbAreaProps[]
   childrenAutoWidth?: boolean
+  pageProps: {
+    /**
+     * 开启下拉刷新+上拉加载（基于 z-paging）
+     */
+    pagingEnabled?: boolean
+    /**
+     * 分页大小，对应 pageSearch.limit，默认 10
+     */
+    pageLimit?: number
+    /**
+     * z-paging 是否使用页面滚动模式，默认 true
+     */
+    pagingUsePageScroll?: boolean
+    /**
+     * 非页面滚动模式下的高度（pagingUsePageScroll=false 时生效）
+     */
+    pagingHeight?: string
+  }
 }

package/types/utils/componentHelpers.d.ts

@@ -0,0 +1,28 @@
+type AnyRecord = Record<string, any>
+/**
+ * 根据 keyFromUser 选择动态数据源
+ * - true: userStore.userInfo
+ * - false: innerDynamicData
+ */
+export declare function selectDynamicSource(
+  keyFromUser: boolean | undefined,
+  userInfo: AnyRecord | undefined,
+  innerDynamicData: AnyRecord | undefined,
+): AnyRecord | undefined
+/**
+ * 统一处理 actionProps：
+ * - dynamicActionKey 优先：从 innerDynamicData 取整段 action 配置
+ * - 否则对 action.jumpUrl 做动态参数替换（${xxx}）
+ */
+export declare function resolveActionProps({
+  dynamicActionKey,
+  action,
+  innerDynamicData,
+  templateStore,
+}: {
+  dynamicActionKey?: string
+  action?: AnyRecord
+  innerDynamicData?: AnyRecord
+  templateStore?: AnyRecord
+}): any
+export {}

package/types/utils/request.d.ts

@@ -3,4 +3,5 @@ export declare const dynamicRequest: (
   dataSource?: DataSource,
   pageInfo?: Record<string, any>,
   userInfo?: Record<string, any>,
+  extraParams?: Record<string, any>,
 ) => Promise<any>

package/utils/componentHelpers.ts

@@ -0,0 +1,50 @@
+import { get } from 'lodash-es'
+import { getDynamicData } from './utils'
+
+type AnyRecord = Record<string, any>
+
+/**
+ * 根据 keyFromUser 选择动态数据源
+ * - true: userStore.userInfo
+ * - false: innerDynamicData
+ */
+export function selectDynamicSource(
+  keyFromUser: boolean | undefined,
+  userInfo: AnyRecord | undefined,
+  innerDynamicData: AnyRecord | undefined,
+) {
+  return (keyFromUser ? userInfo : innerDynamicData) as AnyRecord | undefined
+}
+
+/**
+ * 统一处理 actionProps：
+ * - dynamicActionKey 优先：从 innerDynamicData 取整段 action 配置
+ * - 否则对 action.jumpUrl 做动态参数替换（${xxx}）
+ */
+export function resolveActionProps({
+  dynamicActionKey,
+  action,
+  innerDynamicData,
+  templateStore,
+}: {
+  dynamicActionKey?: string
+  action?: AnyRecord
+  innerDynamicData?: AnyRecord
+  templateStore?: AnyRecord
+}) {
+  if (dynamicActionKey) {
+    return get(innerDynamicData, dynamicActionKey)
+  }
+
+  const jumpUrl = action?.jumpUrl
+  if (!jumpUrl) {
+    return action
+  }
+
+  return {
+    ...action,
+    jumpUrl: getDynamicData(jumpUrl, {
+      store: templateStore,
+    }),
+  }
+}

package/utils/request.ts

@@ -5,12 +5,17 @@ export const dynamicRequest = async (
   dataSource?: DataSource,
   pageInfo?: Record<string, any>,
   userInfo?: Record<string, any>,
+  extraParams?: Record<string, any>,
 ) => {
   if (dataSource?.source === 'remote') {
     if (dataSource.requestInfo?.requestUrl) {
+      const baseParams = JSON.parse(dataSource.requestInfo.requestParams || '{}')
       const response = await uni.$lcb.http.post(
         dataSource.requestInfo.requestUrl,
-        JSON.parse(dataSource.requestInfo.requestParams || '{}'),
+        {
+          ...baseParams,
+          ...(extraParams || {}),
+        },
       )
       /** 如果依赖key存在，则取依赖key的值 */
       return response[dataSource?.dependKey || 'data'] as unknown