xuan/TestEShopDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ feat(完成自定义码单对接):

Browse Source
This commit is contained in:
czm 2022-12-30 14:13:39 +08:00
parent 477bb27b91
commit c5cbf0d196
8 changed files with 44 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/pages/codeSetting/components/colorSetting/productBlock/index.module.scss
View File

@ -35,9 +35,12 @@
}
}
.product_list__item--con {
transition: height 0.3s ease-in-out;
// transition: height 0.3s ease-in-out;
overflow: hidden;
}
.product_list__item--con_close {
height: 0px !important;
}
.open_up_icon {
transform: rotate(180deg);
}

2
src/pages/codeSetting/components/colorSetting/productBlock/index.tsx
View File

@ -66,7 +66,7 @@ const Index = memo((props: IndexParam) => {
<IconFont name="icon-rukou" size={35} />
</View>
</View>
<View style={{ height: upStatus ? '0rpx' : `${194 * productInfo?.product_color_details?.length}rpx` }} className={classNames(styles['product_list__item--con'])}>
<View className={classNames(styles['product_list__item--con'], upStatus && styles['product_list__item--con_close'])}>
{productInfo?.product_color_details?.map(citem => <View key={citem?.product_color_id}><ProductItem codeItem={citem} /></View>)}
</View>
<View className={styles.up_btn} onClick={() => setStatus(!upStatus)}>{upStatus ? '查看更多' : '收起'}<View className={classNames(styles.up_icon, upStatus ? styles.open_up_icon : styles.close_up_icon)}><IconFont name="icon-shangla" size={35} /></View></View>

6
src/pages/codeSetting/components/productItem/index.module.scss
View File

@ -19,6 +19,12 @@
flex: 1;
font-size: 28px;
align-items: center;
text {
&:nth-child(1) {
max-width: 350px;
@include common_ellipsis();
}
}
}
.number {
justify-self: self-end;

5
src/pages/codeSetting/components/productSetting/productBlock/index.module.scss
View File

@ -23,9 +23,12 @@
}
}
.product_list__item--con {
transition: height 0.3s ease-in-out;
// transition: height 0.3s ease-in-out;
overflow: hidden;
}
.product_list__item--con_close {
height: 0px !important;
}
.open_up_icon {
transform: rotate(180deg);
}

2
src/pages/codeSetting/components/productSetting/productBlock/index.tsx
View File

@ -107,7 +107,7 @@ const Index = memo((props: IndexParam) => {
<Text className={styles.mode_status}>{sale_mode_name}</Text>
</View>
<SettingNumber sale_mode={productInfo?.sale_mode} onNumber={getNumber} defaultValue={defaultNum} />
<View style={{ height: upStatus ? '0rpx' : `${194 * productInfo?.product_color_details?.length}rpx` }} className={classNames(styles['product_list__item--con'])}>
<View className={classNames(styles['product_list__item--con'], upStatus && styles['product_list__item--con_close'])}>
{productInfo?.product_color_details?.map(citem => <View key={citem?.product_color_id}><ProductItem codeItem={citem} /></View>)}
</View>
<View className={styles.up_btn} onClick={() => setStatus(!upStatus)}>{upStatus ? '查看更多' : '收起'}<View className={classNames(styles.up_icon, upStatus ? styles.open_up_icon : styles.close_up_icon)}><IconFont name="icon-shangla" size={35} /></View></View>

2
src/pages/codeSetting/components/wholeOrderSetting/index.tsx
View File

@ -79,7 +79,7 @@ export default memo((props: Parma) => {
<SettingNumber sale_mode={orderData?.sale_mode} onNumber={getNumber} defaultValue={defaultNum} />
<View className={styles.product_list}>
{productList?.map((item) => {
return <ProductBlock key={item.id} productInfo={item} sale_mode_name={orderData?.sale_mode_name} />
return <ProductBlock key={item.product_id} productInfo={item} sale_mode_name={orderData?.sale_mode_name} />
})}
</View>
</>

6
src/pages/codeSetting/components/wholeOrderSetting/productBlock/index.module.scss
View File

@ -24,9 +24,11 @@
}
}
.product_list__item--con {
transition: height 0.3s ease-in-out;
// transition: height 3s ease-in-out;
overflow: hidden;
max-height: 5000px;
}
.product_list__item--con_close {
height: 0px !important;
}
.open_up_icon {
transform: rotate(180deg);

26
src/pages/codeSetting/components/wholeOrderSetting/productBlock/index.tsx
View File

@ -1,5 +1,6 @@
import { CustomWrapper, Text, View } from '@tarojs/components'
import { memo, useCallback, useContext, useState } from 'react'
import Taro from '@tarojs/taro'
import { memo, useCallback, useContext, useEffect, useState } from 'react'
import classNames from 'classnames'
import ProductItem from '../../productItem'
import styles from './index.module.scss'
@ -45,6 +46,23 @@ const Index = memo((props: IndexParam) => {
const onConfirm = (item) => {
props.onChange?.(item)
}
// const [height, setHeight] = useState('0rpx')
// useEffect(() => {
// setTimeout(() => {
// Taro.nextTick(() => {
// const query = Taro.createSelectorQuery()
// query
// .select(`.product_list__item__con_${productInfo.}`)
// .boundingClientRect((rect) => {
// const clientHeight = rect.height
// setHeight(Taro.pxTransform(clientHeight))
// })
// .exec()
// })
// }, 100)
// }, [productInfo])
return <>
<View key={productInfo.product_id} className={styles.product_list__item}>
<View className={styles['product_list__item--title']} onClick={onUpdate}>
@ -52,8 +70,10 @@ const Index = memo((props: IndexParam) => {
<IconFont name="icon-shuru" size={50} />
<Text className={styles.mode_status}>{sale_mode_name}</Text>
</View>
<View style={{ height: upStatus ? '0rpx' : `${194 * productInfo?.product_color_details?.length}rpx` }} className={classNames(styles['product_list__item--con'])}>
{productInfo?.product_color_details?.map(citem => <View key={citem?.product_color_id}><ProductItem codeItem={citem} /></View>)}
<View className={classNames(styles['product_list__item--con'], upStatus && styles['product_list__item--con_close'])}>
<View className={`product_list__item__con_${productInfo.product_id}`}>
{productInfo?.product_color_details?.map(citem => <View key={citem?.product_color_id}><ProductItem codeItem={citem} /></View>)}
</View>
</View>
<View className={styles.up_btn} onClick={() => setStatus(!upStatus)}>{upStatus ? '查看更多' : '收起'}<View className={classNames(styles.up_icon, upStatus ? styles.open_up_icon : styles.close_up_icon)}><IconFont name="icon-shangla" size={35} /></View></View>
</View>