电子商城测试版v4
This commit is contained in:
@@ -26,6 +26,7 @@ export default ({show = false, onClose}: param) => {
|
||||
{value:2,title:'散剪', unit:'米', eunit:'kg', step:1, digits:2, minNum:5, maxNum:100000, defaultNum:10},
|
||||
]
|
||||
|
||||
//切换面料类型
|
||||
const [selectIndex, setSelectIndex] = useState(0)
|
||||
const selectProduct = (index:number) => {
|
||||
setSelectIndex(index)
|
||||
@@ -42,12 +43,12 @@ export default ({show = false, onClose}: param) => {
|
||||
const resetList = () => {
|
||||
list?.map(item => {
|
||||
if(selectIndex == item.sale_mode || selectIndex == -1) {
|
||||
item.select = true
|
||||
checkboxData[item.id] = true
|
||||
} else {
|
||||
item.select = false
|
||||
checkboxData[item.id] = false
|
||||
}
|
||||
})
|
||||
setList([...list])
|
||||
setCheckboxData(() => ({...checkboxData}))
|
||||
}
|
||||
|
||||
//获取数据
|
||||
@@ -58,25 +59,21 @@ export default ({show = false, onClose}: param) => {
|
||||
const {data} = await fetchData()
|
||||
let color_list = data.color_list||[]
|
||||
initList(color_list)
|
||||
setList(color_list)
|
||||
setLoading(false)
|
||||
}
|
||||
|
||||
//初始化勾选数据
|
||||
const [selectData, setSelectData] = useState<{id: number, checked: true|false}[]>([])
|
||||
const initSelectData = (data:{id:number}[] = []) => {
|
||||
let res = data?.map(item => {
|
||||
return {id: item.id, checked: true}
|
||||
})
|
||||
setSelectData(() => res)
|
||||
}
|
||||
|
||||
//初始化全部数据
|
||||
//初始化全部数据默认勾选
|
||||
const [checkboxData, setCheckboxData] = useState<{[index:number]:true|false}>({})
|
||||
const initStatus = useRef(false)
|
||||
const initList = (color_list) => {
|
||||
color_list?.map(item => {
|
||||
if(selectIndex == item.sale_mode) item.select = true
|
||||
item.count = formatCount(item)
|
||||
})
|
||||
setList(color_list)
|
||||
if(initStatus.current) {
|
||||
color_list?.map(item => {
|
||||
if(selectIndex == item.sale_mode) checkboxData[item.id] = true
|
||||
})
|
||||
initStatus.current = false
|
||||
}
|
||||
setCheckboxData(() => checkboxData)
|
||||
}
|
||||
|
||||
//显示是展示数据
|
||||
@@ -86,6 +83,7 @@ export default ({show = false, onClose}: param) => {
|
||||
setSelectIndex(0)
|
||||
} else {
|
||||
setLoading(true)
|
||||
initStatus.current = true
|
||||
getShoppingCart()
|
||||
}
|
||||
}, [show])
|
||||
@@ -106,17 +104,17 @@ export default ({show = false, onClose}: param) => {
|
||||
const selectAll = () => {
|
||||
list.map(item => {
|
||||
if(selectIndex == item.sale_mode || selectIndex == -1)
|
||||
item.select = !selectStatus
|
||||
checkboxData[item.id] = !selectStatus
|
||||
})
|
||||
setSelectStatus(!selectStatus)
|
||||
setList([...list])
|
||||
setCheckboxData(() => ({...checkboxData}))
|
||||
}
|
||||
|
||||
//checkbox选中回调
|
||||
const selectCallBack = (item) => {
|
||||
item.select = true
|
||||
checkboxData[item.id] = true
|
||||
checkSelect()
|
||||
setList([...list])
|
||||
setCheckboxData(() => ({...checkboxData}))
|
||||
}
|
||||
|
||||
//checkbox选中判断是否全部选中，全部选中后是全选，否则反选
|
||||
@@ -126,7 +124,7 @@ export default ({show = false, onClose}: param) => {
|
||||
list?.map(item => {
|
||||
if(selectIndex == -1 || selectIndex == item.sale_mode) {
|
||||
list_count ++
|
||||
if(item.select) select_count++
|
||||
if(checkboxData[item.id]) select_count++
|
||||
}
|
||||
})
|
||||
setSelectStatus(select_count == list_count)
|
||||
@@ -134,9 +132,9 @@ export default ({show = false, onClose}: param) => {
|
||||
|
||||
//checkbox关闭回调
|
||||
const colseCallBack = (item) => {
|
||||
item.select = false
|
||||
checkboxData[item.id] = false
|
||||
checkSelect()
|
||||
setList([...list])
|
||||
setCheckboxData(() => ({...checkboxData}))
|
||||
}
|
||||
|
||||
//popup关闭
|
||||
@@ -182,7 +180,7 @@ export default ({show = false, onClose}: param) => {
|
||||
selectIds.current = []
|
||||
list?.map(item => {
|
||||
if(selectIndex == -1 || selectIndex == item.sale_mode) {
|
||||
item.select&&selectIds.current.push(item.id)
|
||||
checkboxData[item.id]&&selectIds.current.push(item.id)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -210,7 +208,7 @@ export default ({show = false, onClose}: param) => {
|
||||
let color_count = 0 //颜色数量
|
||||
let all_count = 0 //总数量
|
||||
list.map(item => {
|
||||
if(item.select) {
|
||||
if(checkboxData[item.id]) {
|
||||
estimate_amount += item.estimate_amount
|
||||
product_list.add(item.product_id)
|
||||
color_count++
|
||||
@@ -219,7 +217,7 @@ export default ({show = false, onClose}: param) => {
|
||||
})
|
||||
let all_count_text = selectIndex == 0?all_count + '条': (all_count/100) + '米'
|
||||
return {price: Number(formatPriceDiv(estimate_amount)).toFixed(2), countText: `已选${product_list.size}种面料，${color_count}个颜色，共${all_count_text}`, color_count}
|
||||
},[list])
|
||||
},[list, checkboxData])
|
||||
|
||||
|
||||
//去结算
|
||||
@@ -293,7 +291,7 @@ export default ({show = false, onClose}: param) => {
|
||||
{list?.map((item, index) => {
|
||||
return <View key={index} className={classnames(styles.product_item, (selectIndex!=-1&&selectIndex!= item.sale_mode)&&styles.no_product_item_select)}>
|
||||
<View className={styles.checkbox}>
|
||||
<MCheckbox disabled={selectIndex!=-1&&selectIndex!=item.sale_mode} status={item.select} onSelect={() => selectCallBack(item)} onClose={() => colseCallBack(item)}/>
|
||||
<MCheckbox disabled={selectIndex!=-1&&selectIndex!=item.sale_mode} status={!!checkboxData[item.id]} onSelect={() => selectCallBack(item)} onClose={() => colseCallBack(item)}/>
|
||||
</View>
|
||||
<View className={styles.img}>
|
||||
<Image mode="aspectFill" src={formatImgUrl(item.texture_url)}/>
|
||||
@@ -309,7 +307,7 @@ export default ({show = false, onClose}: param) => {
|
||||
<View className={styles.btn_count}>
|
||||
<Counter
|
||||
onBlue={(e) => getInputValue(e, item)}
|
||||
defaultNum={item.count}
|
||||
defaultNum={formatCount(item)}
|
||||
step={selectList[selectIndex].step}
|
||||
digits={selectList[selectIndex].digits}
|
||||
onClickBtn={(e) => getInputValue(e, item)}
|
||||
|
||||
Reference in New Issue
Block a user