yudao
/
mall-uniapp
mirror of https://gitee.com/yudaocode/yudao-mall-uniapp.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

sync：商品列表瀑布流问题修改 c2cd0156f3

pull/142/MERGE
YunaiV 2025-04-27 13:03:50 +08:00
parent 352a61c8f5
commit 796f3e9eba
3 changed files with 101 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
App.vue
View File

@ -5,14 +5,18 @@
onLaunch(() => { onLaunch(() => {
// 延时隐藏原生导航栏 // 延时隐藏原生导航栏
setTimeout(() => { setTimeout(() => {
uni.hideTabBar(); try {
uni.hideNavigationBar();
} catch (error) {
// 忽略该 error，不一定存在
}
}, 200); }, 200);
// 加载Shopro底层依赖 // 加载Shopro底层依赖
ShoproInit(); ShoproInit();
}); });
onShow((options) => { onShow(() => {
// #ifdef APP-PLUS // #ifdef APP-PLUS
// 获取urlSchemes参数 // 获取urlSchemes参数
const args = plus.runtime.arguments; const args = plus.runtime.arguments;
@ -24,11 +28,6 @@
success: (res) => {}, success: (res) => {},
}); });
// #endif // #endif
// #ifdef MP-WEIXIN
// 确认收货回调结果
console.log(options, 'options');
// #endif
}); });
</script> </script>

8
pages/goods/list.vue
View File

@ -187,15 +187,15 @@
// 处理双列布局 leftGoodsList + rightGoodsList // 处理双列布局 leftGoodsList + rightGoodsList
function mountMasonry(height = 0, where = 'left') { function mountMasonry(height = 0, where = 'left') {
if (!state.pagination.list[count]) {
return;
}
if (where === 'left') { if (where === 'left') {
leftHeight += height; leftHeight += height;
} else { } else {
rightHeight += height; rightHeight += height;
} }
if (!state.pagination.list[count]) {
return;
}
if (leftHeight <= rightHeight) { if (leftHeight <= rightHeight) {
state.leftGoodsList.push(state.pagination.list[count]); state.leftGoodsList.push(state.pagination.list[count]);
} else { } else {

107
sheep/components/s-goods-column/s-goods-column.vue
View File

@ -40,14 +40,21 @@
:style="[{ color: goodsFields.price.color }]" :style="[{ color: goodsFields.price.color }]"
> >
<!-- 活动价格 --> <!-- 活动价格 -->
<view class="ss-flex" v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"> <view
class="ss-flex"
v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"
>
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img" class="point-img"
></image> ></image>
<text class="point-text ss-m-r-16"> <text class="point-text ss-m-r-16">
{{ data.point }} {{ data.point }}
{{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }} {{
!data.pointPrice || data.pointPrice === 0
? ''
: `+${priceUnit}${fen2yuan(data.pointPrice)}`
}}
</text> </text>
</view> </view>
<template v-else> <template v-else>
@ -100,14 +107,21 @@
:style="[{ color: goodsFields.price.color }]" :style="[{ color: goodsFields.price.color }]"
> >
<!-- 活动价格 --> <!-- 活动价格 -->
<view class="ss-flex" v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"> <view
class="ss-flex"
v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"
>
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img" class="point-img"
></image> ></image>
<text class="point-text ss-m-r-16"> <text class="point-text ss-m-r-16">
{{ data.point }} {{ data.point }}
{{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }} {{
!data.pointPrice || data.pointPrice === 0
? ''
: `+${priceUnit}${fen2yuan(data.pointPrice)}`
}}
</text> </text>
</view> </view>
<template v-else> <template v-else>
@ -126,7 +140,19 @@
<view v-if="tagStyle.show" class="tag-icon-box"> <view v-if="tagStyle.show" class="tag-icon-box">
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)" /> <image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)" />
</view> </view>
<image class="md-img-box" :src="sheep.$url.cdn(data.image || data.picUrl)" mode="widthFix" /> <image
v-if="data.image_wh"
class="md-img-box"
:src="sheep.$url.cdn(data.image || data.picUrl)"
mode="widthFix"
/>
<image
v-else
class="md-img-box"
:src="sheep.$url.cdn(data.image || data.picUrl)"
:style="[{ height: defaultImgWidth * 2 + 'rpx' }]"
mode="aspectFill"
/>
<view <view
class="md-goods-content ss-flex-col ss-row-around ss-p-b-20 ss-p-t-20 ss-p-x-16" class="md-goods-content ss-flex-col ss-row-around ss-p-b-20 ss-p-t-20 ss-p-x-16"
:id="elId" :id="elId"
@ -174,14 +200,21 @@
:style="[{ color: goodsFields.price.color }]" :style="[{ color: goodsFields.price.color }]"
> >
<!-- 活动价格 --> <!-- 活动价格 -->
<view class="ss-flex" v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"> <view
class="ss-flex"
v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"
>
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img" class="point-img"
></image> ></image>
<text class="point-text ss-m-r-16"> <text class="point-text ss-m-r-16">
{{ data.point }} {{ data.point }}
{{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }} {{
!data.pointPrice || data.pointPrice === 0
? ''
: `+${priceUnit}${fen2yuan(data.pointPrice)}`
}}
</text> </text>
</view> </view>
<template v-else> <template v-else>
@ -275,14 +308,23 @@
<view v-if="goodsFields.price?.show" class="ss-flex ss-col-bottom font-OPPOSANS"> <view v-if="goodsFields.price?.show" class="ss-flex ss-col-bottom font-OPPOSANS">
<view class="sl-goods-price ss-m-r-12" :style="[{ color: goodsFields.price.color }]"> <view class="sl-goods-price ss-m-r-12" :style="[{ color: goodsFields.price.color }]">
<!-- 活动价格 --> <!-- 活动价格 -->
<view class="ss-flex" v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"> <view
class="ss-flex"
v-if="
data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type
"
>
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img" class="point-img"
></image> ></image>
<text class="point-text ss-m-r-16"> <text class="point-text ss-m-r-16">
{{ data.point }} {{ data.point }}
{{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }} {{
!data.pointPrice || data.pointPrice === 0
? ''
: `+${priceUnit}${fen2yuan(data.pointPrice)}`
}}
</text> </text>
</view> </view>
<template v-else> <template v-else>
@ -369,14 +411,23 @@
<view v-if="goodsFields.price?.show" class="ss-flex ss-col-bottom font-OPPOSANS"> <view v-if="goodsFields.price?.show" class="ss-flex ss-col-bottom font-OPPOSANS">
<view class="sl-goods-price ss-m-r-12" :style="[{ color: goodsFields.price.color }]"> <view class="sl-goods-price ss-m-r-12" :style="[{ color: goodsFields.price.color }]">
<!-- 活动价格 --> <!-- 活动价格 -->
<view class="ss-flex" v-if="data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type"> <view
class="ss-flex"
v-if="
data.activityType && data.activityType === PromotionActivityTypeEnum.POINT.type
"
>
<image <image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')" :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img" class="point-img"
></image> ></image>
<text class="ss-m-r-16"> <text class="ss-m-r-16">
{{ data.point }} {{ data.point }}
{{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }} {{
!data.pointPrice || data.pointPrice === 0
? ''
: `+${priceUnit}${fen2yuan(data.pointPrice)}`
}}
</text> </text>
</view> </view>
<template v-else> <template v-else>
@ -441,7 +492,7 @@
* @event {Function()} click - 点击卡片 * @event {Function()} click - 点击卡片
* *
*/ */
import { computed, getCurrentInstance, nextTick, onMounted } from 'vue'; import { computed, ref, reactive, getCurrentInstance, nextTick, onMounted } from 'vue';
import sheep from '@/sheep'; import sheep from '@/sheep';
import { import {
fen2yuan, fen2yuan,
@ -453,6 +504,10 @@
import { isArray } from 'lodash-es'; import { isArray } from 'lodash-es';
import { PromotionActivityTypeEnum } from '@/sheep/util/const'; import { PromotionActivityTypeEnum } from '@/sheep/util/const';
// 数据
const state = reactive({});
let defaultImgWidth = ref(0);
// 接收参数 // 接收参数
const props = defineProps({ const props = defineProps({
goodsFields: { goodsFields: {
@ -550,6 +605,10 @@
type: Boolean, type: Boolean,
default: false, default: false,
}, },
imgHeight: {
type: String,
default: '',
},
}); });
// 优惠文案 // 优惠文案
@ -578,14 +637,25 @@
const salesAndStock = computed(() => { const salesAndStock = computed(() => {
let text = []; let text = [];
if (props.goodsFields.salesCount?.show) { if (props.goodsFields.salesCount?.show) {
if (props.data.activityType && props.data.activityType === PromotionActivityTypeEnum.POINT.type) { if (
text.push(formatExchange(props.data.sales_show_type, (props.data.pointTotalStock || 0) - (props.data.pointStock || 0))); props.data.activityType &&
props.data.activityType === PromotionActivityTypeEnum.POINT.type
) {
text.push(
formatExchange(
props.data.sales_show_type,
(props.data.pointTotalStock || 0) - (props.data.pointStock || 0),
),
);
} else { } else {
text.push(formatSales(props.data.sales_show_type, props.data.salesCount)); text.push(formatSales(props.data.sales_show_type, props.data.salesCount));
} }
} }
if (props.goodsFields.stock?.show) { if (props.goodsFields.stock?.show) {
if (props.data.activityType && props.data.activityType === PromotionActivityTypeEnum.POINT.type) { if (
props.data.activityType &&
props.data.activityType === PromotionActivityTypeEnum.POINT.type
) {
text.push(formatStock(props.data.stock_show_type, props.data.pointTotalStock)); text.push(formatStock(props.data.stock_show_type, props.data.pointTotalStock));
} else { } else {
text.push(formatStock(props.data.stock_show_type, props.data.stock)); text.push(formatStock(props.data.stock_show_type, props.data.stock));
@ -613,14 +683,19 @@
scrollOffset: true, scrollOffset: true,
}); });
view.exec((data) => { view.exec((data) => {
console.log(data, 'data');
let totalHeight = 0; let totalHeight = 0;
const goodsPriceCard = data[0]; const goodsPriceCard = data[0];
defaultImgWidth.value = data[0].width;
if (props.data.image_wh) { if (props.data.image_wh) {
totalHeight = totalHeight =
(goodsPriceCard.width / props.data.image_wh.w) * props.data.image_wh.h + (goodsPriceCard.width / props.data.image_wh.w) * props.data.image_wh.h +
goodsPriceCard.height; goodsPriceCard.height;
console.log(totalHeight, 'totalHeight');
} else { } else {
totalHeight = goodsPriceCard.width; totalHeight = goodsPriceCard.width + goodsPriceCard.height;
console.log(totalHeight, 'totalHeight2');
} }
emits('getHeight', totalHeight); emits('getHeight', totalHeight);
}); });