✨ feat(ID1000835):【临】补充原单价、优惠价的价格显示；
This commit is contained in:
Haiyi
@@ -1,133 +1,142 @@
|
||||
.goodsBox {
|
||||
display: flex;
|
||||
margin-bottom: 32px;
|
||||
|
||||
// justify-content: space-between;
|
||||
.pic {
|
||||
width: 118px;
|
||||
height: 118px;
|
||||
border-radius: 8px;
|
||||
margin-right: 32px;
|
||||
}
|
||||
|
||||
.rightGoodbox {
|
||||
padding-bottom: 31px;
|
||||
border-bottom: 1px solid #efefef;
|
||||
display: flex;
|
||||
margin-bottom: 32px;
|
||||
justify-content: space-between;
|
||||
// margin-right: 32px;
|
||||
width: 538px;
|
||||
|
||||
// justify-content: space-between;
|
||||
.pic {
|
||||
width: 118px;
|
||||
height: 118px;
|
||||
border-radius: 8px;
|
||||
margin-right: 32px;
|
||||
.leftFontsbox {
|
||||
.title {
|
||||
width: 260px;
|
||||
height: 34px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-bottom: 8px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
background: 0, 124, 247;
|
||||
}
|
||||
|
||||
.productName {
|
||||
width: 260px;
|
||||
height: 30px;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-bottom: 16px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.productNums {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.productName {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.rightGoodbox {
|
||||
padding-bottom: 31px;
|
||||
border-bottom: 1px solid #efefef;
|
||||
.rightFontsbox {
|
||||
.moneyFlex {
|
||||
margin-bottom: 14px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// margin-right: 32px;
|
||||
width: 538px;
|
||||
justify-content: flex-end;
|
||||
.lastBox {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
text-decoration: line-through;
|
||||
color: #7f7f7f;
|
||||
}
|
||||
.money {
|
||||
margin-left: 15px;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #f41a39;
|
||||
}
|
||||
}
|
||||
|
||||
.leftFontsbox {
|
||||
.title {
|
||||
width: 260px;
|
||||
height: 34px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-bottom: 8px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
background: 0, 124, 247;
|
||||
}
|
||||
.inputBox {
|
||||
width: 189px;
|
||||
height: 64px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #979797;
|
||||
display: flex;
|
||||
|
||||
.productName {
|
||||
width: 260px;
|
||||
height: 30px;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-bottom: 16px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.reduceBox {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.productNums {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.productName {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
height: 40px;
|
||||
}
|
||||
.reduce {
|
||||
width: 20px;
|
||||
height: 3px;
|
||||
background: #000000;
|
||||
border-radius: 1px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
.rightFontsbox {
|
||||
.money {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #F41A39;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.inputBox {
|
||||
width: 189px;
|
||||
height: 64px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #979797;
|
||||
display: flex;
|
||||
|
||||
.reduceBox {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.reduce {
|
||||
width: 20px;
|
||||
height: 3px;
|
||||
background: #000000;
|
||||
border-radius: 1px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
.numsBox {
|
||||
width: 61px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.addBox {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
line-height: 64px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
color: #000;
|
||||
font-size: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.addtine {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #000;
|
||||
font-size: 35px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #979797;
|
||||
float: right;
|
||||
}
|
||||
.numsBox {
|
||||
width: 61px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.addBox {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
line-height: 64px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
color: #000;
|
||||
font-size: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.addtine {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #000;
|
||||
font-size: 35px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #979797;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,6 +25,9 @@ interface props {
|
||||
buyNums?: number | string
|
||||
id?: number
|
||||
weight_error?: number | string
|
||||
last_bulk_price?: number
|
||||
last_length_cut_price?: number
|
||||
last_weight_cut_price?: number
|
||||
}
|
||||
goodList?: any[]
|
||||
onBlur?: (a: any, c: any) => void
|
||||
@@ -85,7 +88,12 @@ const GoodsItem = (props: props) => {
|
||||
}
|
||||
</View>
|
||||
<View className={styles.rightFontsbox}>
|
||||
<View className={styles.money}>¥{props?.modeFont === 0 ? Number(props.value?.bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.length_cut_price) / 100 : Number(props.value?.weight_cut_price) / 100}{props.modeFont != 1 ? '/Kg' : '/m'}</View>
|
||||
<View className={styles.moneyFlex}>
|
||||
{
|
||||
props?.modeFont === 0 && props.value?.last_bulk_price !== props.value?.bulk_price && <View className={styles.lastBox}>¥{props?.modeFont === 0 ? Number(props.value?.last_bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.last_length_cut_price) / 100 : Number(props.value?.last_weight_cut_price) / 100} {props.modeFont as any != 1 ? '/Kg' : '/m'}</View>
|
||||
}
|
||||
<View className={styles.money}>¥{props?.modeFont === 0 ? Number(props.value?.bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.length_cut_price) / 100 : Number(props.value?.weight_cut_price) / 100}{props.modeFont != 1 ? '/Kg' : '/m'}</View>
|
||||
</View>
|
||||
{
|
||||
props.value.showInput && <View className={styles.inputBox}>
|
||||
<View className={styles.reduceBox} onClick={() => { props.clickReduce?.(props.value) }}>
|
||||
|
||||
Reference in New Issue
Block a user