cb-biz-ui 1.5.4 → 1.5.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -25,9 +25,8 @@
|
|
|
25
25
|
<view class="goods-card_info">
|
|
26
26
|
<view class="goods-card_info_title">
|
|
27
27
|
<ui-overflow-hidden size="24rpx">
|
|
28
|
-
<text class="text" :style="{ fontSize: textFontSize.title }"
|
|
29
|
-
|
|
30
|
-
}}
|
|
28
|
+
<text class="text" :style="{ fontSize: textFontSize.title }"
|
|
29
|
+
>{{ entity.name }}
|
|
31
30
|
</text>
|
|
32
31
|
</ui-overflow-hidden>
|
|
33
32
|
</view>
|
|
@@ -66,11 +65,28 @@
|
|
|
66
65
|
</ui-tag>
|
|
67
66
|
</view>
|
|
68
67
|
</view>
|
|
68
|
+
<view class="rebate-box" v-if="entity.skuCommonExt.enableRebate">
|
|
69
|
+
<view class="rebate-box_title"> 购买返利 </view>
|
|
70
|
+
<view class="rebate-box_content">
|
|
71
|
+
<text class="rebate-box_content_text"
|
|
72
|
+
>约¥{{ entity.skuCommonExt.rebateVal }}</text
|
|
73
|
+
>
|
|
74
|
+
<view class="rebate-box_content_icon">
|
|
75
|
+
(
|
|
76
|
+
<text class="rebate-box_content_icon_text">111</text>
|
|
77
|
+
<image
|
|
78
|
+
class="rebate-icon"
|
|
79
|
+
src="https://edu-cdn.yunzhuxue.com/edub1429d21xcfds/img/cd9fd828b1b047aa8ac91f020b8452e9@.png@.webp"
|
|
80
|
+
/>
|
|
81
|
+
)
|
|
82
|
+
</view>
|
|
83
|
+
</view>
|
|
84
|
+
</view>
|
|
69
85
|
<view class="goods-card_info_sales-volume">
|
|
70
86
|
<text
|
|
71
87
|
class="goods-card_info_sales-volume_text"
|
|
72
88
|
:style="{ fontSize: textFontSize.salesVolume }"
|
|
73
|
-
|
|
89
|
+
>销量{{ ` ` }}{{ entity.saleCnt || 0 }}
|
|
74
90
|
</text>
|
|
75
91
|
</view>
|
|
76
92
|
<view class="goods-card_info_price">
|
|
@@ -78,14 +94,14 @@
|
|
|
78
94
|
class="goods-card_info_price_preferential-price"
|
|
79
95
|
:style="{ fontSize: textFontSize.preferentialPrice }"
|
|
80
96
|
>
|
|
81
|
-
¥{{ price }}/{{ entity?.unitTitle ||
|
|
97
|
+
¥{{ price }}/{{ entity?.unitTitle || '件' }}
|
|
82
98
|
</text>
|
|
83
99
|
<text
|
|
84
100
|
class="goods-card_info_price_price"
|
|
85
101
|
v-if="entity.hasDiscount"
|
|
86
102
|
:style="{ fontSize: textFontSize.price }"
|
|
87
103
|
>
|
|
88
|
-
¥{{ entity.marketPriceShow }}/{{ entity.unitTitle ||
|
|
104
|
+
¥{{ entity.marketPriceShow }}/{{ entity.unitTitle || '件' }}
|
|
89
105
|
</text>
|
|
90
106
|
</view>
|
|
91
107
|
<view class="goods-card_info_status" v-if="errStatusText">
|
|
@@ -149,8 +165,8 @@
|
|
|
149
165
|
</template>
|
|
150
166
|
|
|
151
167
|
<script setup lang="ts">
|
|
152
|
-
import { onMounted, reactive, computed } from
|
|
153
|
-
import type { GoodsDataType, changeValueType } from
|
|
168
|
+
import { onMounted, reactive, computed } from 'vue';
|
|
169
|
+
import type { GoodsDataType, changeValueType } from '../interface/types';
|
|
154
170
|
|
|
155
171
|
interface IProps {
|
|
156
172
|
entity: GoodsDataType;
|
|
@@ -161,19 +177,19 @@ interface IProps {
|
|
|
161
177
|
goodMin?: number;
|
|
162
178
|
imagePlaceholder?: string;
|
|
163
179
|
imageMode?:
|
|
164
|
-
|
|
|
165
|
-
|
|
|
166
|
-
|
|
|
167
|
-
|
|
|
168
|
-
|
|
|
169
|
-
|
|
|
170
|
-
|
|
|
171
|
-
|
|
|
172
|
-
|
|
|
173
|
-
|
|
|
174
|
-
|
|
|
175
|
-
|
|
|
176
|
-
|
|
|
180
|
+
| 'scaleToFill'
|
|
181
|
+
| 'aspectFit'
|
|
182
|
+
| 'aspectFill'
|
|
183
|
+
| 'widthFix'
|
|
184
|
+
| 'top'
|
|
185
|
+
| 'bottom'
|
|
186
|
+
| 'center'
|
|
187
|
+
| 'left'
|
|
188
|
+
| 'right'
|
|
189
|
+
| 'top left'
|
|
190
|
+
| 'top right'
|
|
191
|
+
| 'bottom left'
|
|
192
|
+
| 'bottom right';
|
|
177
193
|
textFontSize?: {
|
|
178
194
|
title: string;
|
|
179
195
|
tag: string;
|
|
@@ -186,35 +202,35 @@ interface IProps {
|
|
|
186
202
|
}
|
|
187
203
|
|
|
188
204
|
const props = withDefaults(defineProps<IProps>(), {
|
|
189
|
-
imgWidth:
|
|
190
|
-
imgHeight:
|
|
205
|
+
imgWidth: '225rpx',
|
|
206
|
+
imgHeight: '225rpx',
|
|
191
207
|
goodMin: 0,
|
|
192
208
|
goodsCount: 0,
|
|
193
209
|
bezier: true,
|
|
194
210
|
imagePlaceholder:
|
|
195
|
-
|
|
196
|
-
imageMode:
|
|
211
|
+
'https://shop-cdn.cbyzx.com/shop23n05y18abcd/img/3544375090854cd099d72edb09dce492.png',
|
|
212
|
+
imageMode: 'aspectFill',
|
|
197
213
|
textFontSize: {
|
|
198
|
-
title:
|
|
199
|
-
tag:
|
|
200
|
-
salesVolume:
|
|
201
|
-
preferentialPrice:
|
|
202
|
-
price:
|
|
203
|
-
numberBoxBg:
|
|
214
|
+
title: '24rpx',
|
|
215
|
+
tag: '18rpx',
|
|
216
|
+
salesVolume: '20rpx',
|
|
217
|
+
preferentialPrice: '24rpx',
|
|
218
|
+
price: '20rpx',
|
|
219
|
+
numberBoxBg: '#fff'
|
|
204
220
|
},
|
|
205
221
|
entity: {
|
|
206
|
-
goodSrc:
|
|
207
|
-
title:
|
|
222
|
+
goodSrc: '',
|
|
223
|
+
title: '',
|
|
208
224
|
preferentialPrice: 0,
|
|
209
225
|
status: 0,
|
|
210
|
-
unit:
|
|
226
|
+
unit: '份'
|
|
211
227
|
},
|
|
212
228
|
addBtnBgColor: 'rgba(255, 82, 79, 1)'
|
|
213
229
|
});
|
|
214
230
|
|
|
215
231
|
const emit = defineEmits<{
|
|
216
|
-
(e:
|
|
217
|
-
(e:
|
|
232
|
+
(e: 'countChange', value: changeValueType, entity: GoodsDataType): void;
|
|
233
|
+
(e: 'handleClick', entity: GoodsDataType): void;
|
|
218
234
|
}>();
|
|
219
235
|
|
|
220
236
|
const price = computed(() => {
|
|
@@ -224,12 +240,12 @@ const price = computed(() => {
|
|
|
224
240
|
});
|
|
225
241
|
const errStatusText = computed(() => {
|
|
226
242
|
if (props.entity.saleStatus === 20) {
|
|
227
|
-
return
|
|
243
|
+
return '已失效';
|
|
228
244
|
}
|
|
229
245
|
if (!props.entity.existInventory) {
|
|
230
|
-
return
|
|
246
|
+
return '无货';
|
|
231
247
|
}
|
|
232
|
-
return
|
|
248
|
+
return '';
|
|
233
249
|
});
|
|
234
250
|
|
|
235
251
|
const state = reactive({
|
|
@@ -247,13 +263,13 @@ const change = (val: changeValueType) => {
|
|
|
247
263
|
// if (val > props.entity.inventoryCapacity) {
|
|
248
264
|
// triggerMax();
|
|
249
265
|
// }
|
|
250
|
-
emit(
|
|
266
|
+
emit('countChange', val, props.entity);
|
|
251
267
|
};
|
|
252
268
|
|
|
253
269
|
const triggerMax = () => {
|
|
254
270
|
uni.showModal({
|
|
255
|
-
title:
|
|
256
|
-
content:
|
|
271
|
+
title: '提示',
|
|
272
|
+
content: '库存不足,最大库存为' + props.entity.inventoryCapacity,
|
|
257
273
|
showCancel: false
|
|
258
274
|
});
|
|
259
275
|
};
|
|
@@ -265,7 +281,7 @@ const load = () => {
|
|
|
265
281
|
};
|
|
266
282
|
|
|
267
283
|
const itemTap = () => {
|
|
268
|
-
emit(
|
|
284
|
+
emit('handleClick', props.entity);
|
|
269
285
|
};
|
|
270
286
|
|
|
271
287
|
onMounted(() => {
|
|
@@ -275,7 +291,7 @@ onMounted(() => {
|
|
|
275
291
|
const addClick = () => {
|
|
276
292
|
change({
|
|
277
293
|
value: props.goodsCount + 1,
|
|
278
|
-
type:
|
|
294
|
+
type: 'plus',
|
|
279
295
|
index: 0,
|
|
280
296
|
custom: {}
|
|
281
297
|
});
|
|
@@ -17,6 +17,12 @@
|
|
|
17
17
|
<view class="off-shelf" v-if="data.saleStatus === 20">
|
|
18
18
|
<text class="text">已下架</text>
|
|
19
19
|
</view>
|
|
20
|
+
<view
|
|
21
|
+
class="rebate"
|
|
22
|
+
v-if="data.saleStatus == 10 && data.skuCommonExt.enableRebate"
|
|
23
|
+
>
|
|
24
|
+
<text class="text">购后返利:¥{{ data.skuCommonExt.rebateVal }}</text>
|
|
25
|
+
</view>
|
|
20
26
|
</view>
|
|
21
27
|
<view class="text-box">
|
|
22
28
|
<view class="header">
|
|
@@ -60,6 +66,11 @@ interface dataType {
|
|
|
60
66
|
marketPriceShow: string; // 市场价
|
|
61
67
|
saleCnt: number; // 销量
|
|
62
68
|
distributionCommissionRate: string; // 佣金率
|
|
69
|
+
skuCommonExt: {
|
|
70
|
+
rebateVal: number;
|
|
71
|
+
enableRebate: boolean;
|
|
72
|
+
rebateType: string;
|
|
73
|
+
};
|
|
63
74
|
}
|
|
64
75
|
interface IProps {
|
|
65
76
|
data: dataType;
|
|
@@ -31,7 +31,16 @@ export interface GoodsDataType {
|
|
|
31
31
|
marketPriceShow: string;
|
|
32
32
|
existInventory: boolean; // 是否有库存
|
|
33
33
|
saleCnt: number; // 销量
|
|
34
|
-
purchaseLimitNum: number // 限购数量
|
|
34
|
+
purchaseLimitNum: number; // 限购数量
|
|
35
|
+
skuCommonExt: {
|
|
36
|
+
distributionCommissionRate: string; // 分销佣金比例
|
|
37
|
+
enableDistribution: number; // 是否开启分销
|
|
38
|
+
enableRebate: boolean; // 是否开启购后返利
|
|
39
|
+
rebateContractId: number; // 返利合同id
|
|
40
|
+
rebateContractSnapshotId: number; // 返利合同快照id
|
|
41
|
+
rebateType: string; // 返利类型
|
|
42
|
+
rebateVal: string; // 返利金额
|
|
43
|
+
};
|
|
35
44
|
}
|
|
36
45
|
export interface changeValueType {
|
|
37
46
|
value: number;
|
|
@@ -58,7 +67,7 @@ export interface skuInfoType {
|
|
|
58
67
|
/**是否无限库存 */
|
|
59
68
|
unlimitedInventory: boolean;
|
|
60
69
|
existInventory: boolean; // 是否有库存
|
|
61
|
-
purchaseLimitNum: number // 是否限购 -1 不限购
|
|
70
|
+
purchaseLimitNum: number; // 是否限购 -1 不限购
|
|
62
71
|
}
|
|
63
72
|
export interface cartItemListType {
|
|
64
73
|
/** 买家id */
|
package/libs/css/goods-card.scss
CHANGED
|
@@ -50,6 +50,7 @@
|
|
|
50
50
|
display: flex;
|
|
51
51
|
align-items: center;
|
|
52
52
|
line-height: 1;
|
|
53
|
+
margin-top: 10rpx;
|
|
53
54
|
|
|
54
55
|
.tag-box {
|
|
55
56
|
display: flex;
|
|
@@ -66,6 +67,45 @@
|
|
|
66
67
|
}
|
|
67
68
|
}
|
|
68
69
|
|
|
70
|
+
.rebate-box {
|
|
71
|
+
display: flex;
|
|
72
|
+
align-items: center;
|
|
73
|
+
font-size: 18rpx;
|
|
74
|
+
border: 1px solid rgba(255, 82, 79, 1);
|
|
75
|
+
border-radius: 10rpx;
|
|
76
|
+
overflow: hidden;
|
|
77
|
+
margin-top: 10rpx;
|
|
78
|
+
|
|
79
|
+
.rebate-box_title {
|
|
80
|
+
font-size: 20rpx;
|
|
81
|
+
color: rgb(1, 1, 1);
|
|
82
|
+
background-color: rgba(255, 82, 79, 1);
|
|
83
|
+
padding: 0 15rpx;
|
|
84
|
+
height: 100%;
|
|
85
|
+
display: flex;
|
|
86
|
+
align-items: center;
|
|
87
|
+
color: #fff;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.rebate-box_content {
|
|
91
|
+
display: flex;
|
|
92
|
+
align-items: center;
|
|
93
|
+
padding: 6rpx 10rpx;
|
|
94
|
+
color: rgba(255, 82, 79, 1);
|
|
95
|
+
|
|
96
|
+
.rebate-box_content_icon {
|
|
97
|
+
display: flex;
|
|
98
|
+
align-items: center;
|
|
99
|
+
color: rgba(102, 102, 102, 1);
|
|
100
|
+
|
|
101
|
+
.rebate-icon {
|
|
102
|
+
width: 30rpx;
|
|
103
|
+
height: 30rpx;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
69
109
|
.goods-card_info_sales-volume {
|
|
70
110
|
width: 100%;
|
|
71
111
|
display: flex;
|
|
@@ -152,4 +192,4 @@
|
|
|
152
192
|
z-index: 21;
|
|
153
193
|
}
|
|
154
194
|
}
|
|
155
|
-
}
|
|
195
|
+
}
|
|
@@ -33,6 +33,24 @@
|
|
|
33
33
|
font-size: 26rpx;
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
|
+
|
|
37
|
+
.rebate {
|
|
38
|
+
position: absolute;
|
|
39
|
+
left: 0;
|
|
40
|
+
right: 0;
|
|
41
|
+
bottom: 0;
|
|
42
|
+
background: rgba(49, 48, 48, 0.73);
|
|
43
|
+
display: flex;
|
|
44
|
+
align-items: center;
|
|
45
|
+
justify-content: center;
|
|
46
|
+
padding: 10rpx 0;
|
|
47
|
+
font-size: 20rpx;
|
|
48
|
+
box-sizing: border-box;
|
|
49
|
+
.text {
|
|
50
|
+
color: #bfbfbf;
|
|
51
|
+
font-size: 20rpx;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
36
54
|
}
|
|
37
55
|
|
|
38
56
|
.text-box {
|
|
@@ -77,22 +95,28 @@
|
|
|
77
95
|
align-items: center;
|
|
78
96
|
font-size: 26rpx;
|
|
79
97
|
width: 100%;
|
|
98
|
+
|
|
80
99
|
.money {
|
|
81
100
|
width: 150rpx;
|
|
82
101
|
font-weight: bold;
|
|
102
|
+
|
|
83
103
|
.symbol {
|
|
84
104
|
font-size: 20rpx;
|
|
85
105
|
}
|
|
106
|
+
|
|
86
107
|
.value {
|
|
87
108
|
color: #FF0000;
|
|
88
109
|
}
|
|
89
110
|
}
|
|
90
|
-
|
|
111
|
+
|
|
112
|
+
.rate {
|
|
91
113
|
display: flex;
|
|
92
114
|
align-items: center;
|
|
115
|
+
|
|
93
116
|
.label {
|
|
94
117
|
color: #666666;
|
|
95
118
|
}
|
|
119
|
+
|
|
96
120
|
.value {
|
|
97
121
|
color: #FF0000;
|
|
98
122
|
}
|
|
@@ -100,4 +124,4 @@
|
|
|
100
124
|
}
|
|
101
125
|
}
|
|
102
126
|
}
|
|
103
|
-
}
|
|
127
|
+
}
|