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

对接购物车列表

Browse Source
This commit is contained in:
cheng
2022-05-10 18:00:02 +08:00
parent f3c818f549
commit d0f069937b
14 changed files with 296 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/details/components/orderCount/index.tsx
+21 -17
View File
@@ -34,21 +34,25 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
]
const [selectIndex, setSelectIndex] = useState(0)
const selectProduct = (index:number) => {
console.log('number::',index)
setSelectIndex(() => index)
//重置数据
const newList = initList(list)
setList([...newList])
condition.current.code_or_name = null
setSearchShow(false)
}
//获取面料颜色列表
const {fetchData:colorFetchData, state: colorState} = GetColorList()
const [list, setList] = useState<any[]>([])
const [loading, setLoading] = useState(false)
const condition = useRef({physical_warehouse:adminUserInfo.physical_warehouse, sale_mode:selectIndex, product_id:0, code_or_name:null})
const condition = useRef({physical_warehouse:adminUserInfo?.physical_warehouse, sale_mode:selectIndex, product_id:0, code_or_name:null})
const getColorList = async () => {
setLoading(() => true)
console.log('数据:::',getFilterData(condition.current))
let {data} = await colorFetchData(getFilterData(condition.current))
const list = initList(data.list)
setList([...list])
let lists = initList(data.list)
setList([...lists])
setLoading(() => false)
}
const [showPopup, setShowPopup] = useState(false)
@@ -63,7 +67,6 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
setSelectIndex(0)
condition.current.code_or_name = null
setSearchShow(false)
condition.current.product_id = productId
getColorList()
}
@@ -138,6 +141,16 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
const {getSelfUserInfo} = UseLogin()
const {fetchData:addFetchData} = AddShoppingCartApi()
const addShopCart = async () => {
try {
await getSelfUserInfo()
} catch(msg) {
Taro.showToast({
icon:'none',
title:msg
})
return false
}
if(selectCount.sumCount == 0) {
Taro.showToast({
icon:'none',
@@ -145,7 +158,6 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
})
return false
}
await getSelfUserInfo()
const state = await addFetchData({
"sale_mode": selectIndex,
color_list: selectCount.color_list
@@ -165,7 +177,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
}
//显示金额
const priceFormat = useCallback((item) => {
const priceFormat = (item) => {
let price = 0
if(selectIndex == 0) {
price = formatMillionYuan(item.bulk_price, 100).num
@@ -175,15 +187,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
price = formatMillionYuan(item.weight_cut_price, 100).num
}
return <View className={styles.priceText}><Text>¥</Text>{Number(price) }<Text>{' /' + selectList[selectIndex].eunit}</Text></View>
}, [list, selectIndex])
//重置数据
useEffect(() => {
const newList = initList(list)
setList([...newList])
// condition.current.code_or_name = null
// setSearchShow(false)
}, [selectIndex])
}
//筛选数据
const searchInput = (e) => {
@@ -219,7 +223,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
<View className={styles.text} onClick={() => clearSearch()}>取消</View>
</View>}
<View className={styles.colorNum}>
<View className={styles.title}>颜色分类 (13)</View>
<View className={styles.title}>颜色分类 ({list.length})</View>
{!searchShow&&<View className={classnames('iconfont icon-sousuo', styles.miconfont)} onClick={() => changeSearchShow()}></View>}
</View>
src/pages/details/components/swiper/index.tsx
+2 -1
View File
@@ -1,3 +1,4 @@
import { formatImgUrl } from "@/common/fotmat"
import { Image, Swiper, SwiperItem, View } from "@tarojs/components"
import { useMemo, useRef, useState } from "react"
import styles from './index.module.scss'
@@ -27,7 +28,7 @@ export default ({list = []}: params) => {
{list.map((item) => {
return <SwiperItem key={item.id}>
<View className={styles.image_item} >
<Image mode="aspectFill" src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d'></Image>
<Image mode="aspectFill" src={formatImgUrl(item)}></Image>
</View>
</SwiperItem>
})}
src/pages/details/index.module.scss
+7 -1
View File
@@ -145,7 +145,13 @@
background-color: $color_main;
font-size: $font_size;
color: #fff;
position: relative;
.phoneBtn{
background-color: rgba(0, 0, 0, 0);
position: absolute;
width: 100%;
height: 100%;
}
}
}
}
src/pages/details/index.tsx
+36 -22
View File
@@ -1,6 +1,6 @@
import { Button, Image, RichText, ScrollView, Swiper, SwiperItem, Text, View } from '@tarojs/components'
import Taro, { useDidShow, useRouter, useShareAppMessage } from '@tarojs/taro';
import Taro, { useDidShow, usePullDownRefresh, useRouter, useShareAppMessage } from '@tarojs/taro';
import classnames from "classnames";
import DesSwiper from './components/swiper';
import OrderCount from './components/orderCount';
@@ -23,7 +23,8 @@ type params = {
style?: Object
}
export default (props:params) => {
const {checkLogin} = useLogin()
const {checkLogin, getPhoneNumber, userInfo} = useLogin()
useDidShow(() => {
checkLogin()
})
@@ -39,6 +40,7 @@ export default (props:params) => {
const getProductDetail = async () => {
let {data} = await fetchData({id: router.params.id})
setProductInfo(data)
Taro.stopPullDownRefresh()
}
//面料名称
@@ -46,27 +48,11 @@ export default (props:params) => {
return formatHashTag(productInfo.code, productInfo.name)
},[productInfo])
const list = [
{
title:'数据',
img:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d',
url:'',
id:1
},
{
title:'数据',
img:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d',
url:'',
id:2
}
]
const [showCart, setShowCart] = useState(false)
const [showOrderCount, setShowOrderCount] = useState(false)
const html = `<h1>这里是详情</h1>
<div style="font-size:13px">你好啊啊</div>
const html = `
<img style="width:100%" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic24.nipic.com%2F20121021%2F10910884_100200815001_2.jpg&refer=http%3A%2F%2Fpic24.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652257920&t=9353dda34f18ae2fe6803f3da35954bb">
`
@@ -99,14 +85,36 @@ export default (props:params) => {
return {
title: '自定义转发标题',
path: '/pages/details/index?id=10',
imageUrl: list[0].img
imageUrl: ''
}
})
//开始下单
const placeOrder = async (e:any) => {
try {
await getPhoneNumber(e.detail.code)
} catch(msg) {
Taro.showToast({
icon:"none",
title: msg
})
return false
}
setShowOrderCount(true)
}
//页面下拉刷新
usePullDownRefresh(() => {
getProductDetail()
})
return (
<View className={styles.main}>
<DesSwiper list={list}/>
<DesSwiper list={productInfo.texture_url||[]}/>
<View className={styles.product_header}>
<View className={styles.title}>
<View className={styles.name}>{productName}</View>
@@ -154,7 +162,13 @@ export default (props:params) => {
<View className={classnames('iconfont icon-gouwuche', styles.miconfont)}></View>
<View className={styles.text}>购物车</View>
</View>
<View className={styles.buy_btn} onClick={() => setShowOrderCount(true)}>开始下单</View>
{
!userInfo.adminUserInfo?.is_authorize_phone&&<View className={styles.buy_btn} >
<Button className={styles.phoneBtn} open-type="getPhoneNumber" onGetPhoneNumber={(e) => placeOrder(e)}></Button>
开始下单
</View>
|| <View className={styles.buy_btn} onClick={(e) => placeOrder(e)}>开始下单</View>
}
</View>
<OrderCount show={showOrderCount} onClose={() => setShowOrderCount(false)} title={productName} productId={productInfo.id}/>
<ShopCart show={showCart} onClose={() => setShowCart(false)}/>