@tplc/business 0.2.70 → 0.2.72

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 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.2.72](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.2.71...v0.2.72) (2025-01-06)
+
+### [0.2.71](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.2.70...v0.2.71) (2025-01-06)
+
 ### [0.2.70](http://gitlab888.30jia.com.cn/bhBank/zero-code-pro/compare/v0.2.56...v0.2.70) (2025-01-06)
 
 

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

@@ -1,8 +1,10 @@
 <script setup lang="ts">
 import { ref, useAttrs, watch, computed } from 'vue'
 import UWaterfall from 'uview-plus/components/u-waterfall/u-waterfall.vue'
+import ULazyLoad from 'uview-plus/components/u-lazy-load/u-lazy-load.vue'
 import { LcbProductProps } from './types'
 import { transformValueUnit } from '../../utils/transform'
+import { getPreviewImageUrl } from '../../utils/utils'
 
 const uWaterfallRef = ref()
 defineOptions({
@@ -43,6 +45,7 @@ const getData = async () => {
     list.value = []
   }
 }
+
 watch(() => props.items, getData, { immediate: true, deep: true })
 const renderList = computed(() => {
   return props.filterList ? props.items : list.value
@@ -137,14 +140,23 @@ const renderList = computed(() => {
                     ...item,
                   }"
                 />
+
                 <lcb-product-item
-                  v-else
                   v-bind="{ ...item, ...$props, ...attrs }"
                   layoutType="vertical"
                   tag-overflow-wrap
+                  v-else
                 >
                   <template #coverImg="{ value }">
-                    <image :src="value" class="w-full" mode="widthFix" />
+                    <u-lazy-load
+                      threshold="-450"
+                      :border-radius="imageRadius"
+                      :image="value"
+                      :is-effect="false"
+                      :loading-img="getPreviewImageUrl(value)"
+                      :index="index"
+                    />
+                    <!-- <wd-img :src="value" width="100%" lazyPlaceWidth="250" height="auto" mode="widthFix" /> -->
                   </template>
                 </lcb-product-item>
               </slot>
@@ -176,7 +188,14 @@ const renderList = computed(() => {
                   tag-overflow-wrap
                 >
                   <template #coverImg="{ value }">
-                    <image :src="value" class="w-full" mode="widthFix" />
+                    <u-lazy-load
+                      threshold="-450"
+                      :border-radius="imageRadius"
+                      :image="value"
+                      :index="index"
+                      :is-effect="false"
+                      :loading-img="getPreviewImageUrl(value)"
+                    />
                   </template>
                 </lcb-product-item>
               </slot>

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

@@ -96,9 +96,10 @@ const value = computed(() => {
     "
   >
     <!-- 图片 -->
-    <slot :value="value" v-if="prop === 'coverImg'" name="coverImg">
+    <block :value="value" v-if="prop === 'coverImg'">
       <view :class="`relative ${className}`" :style="style">
-        <wd-img :src="value" mode="aspectFill" width="100%" height="100%" />
+        <wd-img :src="value" mode="aspectFill" width="100%" height="100%" v-if="!$slots.coverImg" />
+        <slot name="coverImg" :value="value" v-else />
         <!-- imgBottomIcon -->
         <view class="absolute bottom-0 left-0 w-full" v-if="itemProps.imgBottomIcon">
           <wd-img
@@ -121,7 +122,7 @@ const value = computed(() => {
         </view>
         <slot></slot>
       </view>
-    </slot>
+    </block>
 
     <!-- 标题 -->
     <slot :value="value" v-if="prop === 'productName'" name="productName">

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

@@ -86,8 +86,6 @@ defineSlots<{
   coverImgSection(): any
   contentSection(): any
 }>()
-
-// console.log('attrs', attrs)
 </script>
 
 <template>

package/package.json

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

package/types/utils/utils.d.ts

@@ -5,3 +5,4 @@ export declare const getPageOptions: () => Record<string, any>
 /** 合并url参数 url = /pages/data/index?id=1&name=2   urlParams = id=1&name=2&type=1 */
 export declare const getFinalUrl: (url: string, urlParams?: string) => string
 export declare const onPageScrollSelector: (selector: string) => void
+export declare const getPreviewImageUrl: (url: string, width?: number) => string

package/utils/utils.ts

@@ -42,3 +42,12 @@ export const onPageScrollSelector = (selector: string) => {
     selector: `${prefix}${selector}`,
   })
 }
+
+export const getPreviewImageUrl = (url: string, width = 200) => {
+  const isctyun = url?.indexOf('.ctyun') >= 0
+  const sym = url?.indexOf('?') > 0 ? '&' : '?'
+  const suffix = isctyun
+    ? `${sym}x-amz-process=image/resize,w_${width},m_lfit`
+    : `${sym}x-oss-process=image/resize,m_mfit,w_${width}&imageView2/2/w/${width}`
+  return `${url}${width > 0 ? suffix : ''}`
+}