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-30 20:32:47 +08:00
parent b93b59332b
commit 55cbaac8f5
14 changed files with 239 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/details/index.tsx
+2 -2
View File
@@ -8,7 +8,7 @@ import ShopCart from '@/components/shopCart';
import Preview,{colorItem} from './components/preview';
import styles from './index.module.scss'
import { useEffect, useMemo, useState } from 'react';
import {formatHashTag} from '@/common/fotmat'
import {formatHashTag, formatImgUrl} from '@/common/fotmat'
import useManualPullDownRefresh from '@/use/useManualPullDownRefresh';
import { goLink } from '@/common/common';
import useUserInfo from '@/use/useUserInfo';
@@ -147,7 +147,7 @@ export default (props:params) => {
{productInfo?.product_color_list?.map(item => {
return <View className={styles.item} onClick={() => getColorItem(item)}>
<View className={styles.item_color}>
<Image src={item.texture_url}></Image>
<Image src={formatImgUrl(item.texture_url)}></Image>
</View>
<View className={styles.item_name}>{item.code}</View>
</View>
src/pages/order/components/payment/index.tsx
+16 -7
View File
@@ -1,5 +1,5 @@
import { Text, View } from "@tarojs/components";
import { memo, useEffect, useState } from "react";
import { memo, useEffect, useMemo, useState } from "react";
import AmountShow from "../amountShow";
import classnames from "classnames";
import styles from './index.module.scss'
@@ -15,7 +15,8 @@ import {alert} from "@/common/common"
type Param = {
show?: true|false,
onClose?: () => void,
orderId?: number //应付单id
orderId?: number, //应付单id
onSubmitSuccess?: () => void //支付成功
}
type PayInfo = {
@@ -23,7 +24,7 @@ type PayInfo = {
}
type PayStatus = 0|1|2|3|4|null //0:预存款， 1:账期，2：线下汇款， 3：扫码支付, 4:货到付款
export default memo(({show = false, onClose, orderId = 0}:Param) => {
export default memo(({show = false, onClose, orderId = 0, onSubmitSuccess}:Param) => {
//提交参数
const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({
@@ -78,11 +79,19 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
let res = await submitFetchData(submitData)
if(res.success) {
alert.success('支付成功')
onSubmitSuccess?.()
} else {
alert.none(res.msg)
}
}
const advance_payment = useMemo(() => {
const price = formatPriceDiv(payInfo?.should_collect_money - payInfo?.amount_paid)
return (
<View className={styles.payment_list_item_left_price}>{(payInfo?.advance_deposit_balance < price)&&'余额不足，' }剩余 ¥{payInfo?.advance_deposit_balance}</View>
)
}, [payInfo])
return (
<View className={styles.payment_main}>
<Popup show={show} showTitle={false} onClose={onClose} >
@@ -90,7 +99,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
<View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
<View className={styles.title}>订单支付</View>
<View className={styles.amount}>
<AmountShow status={2} number={formatPriceDiv(payInfo?.amount)}/>
<AmountShow status={2} number={formatPriceDiv(payInfo?.should_collect_money - payInfo?.amount_paid)}/>
</View>
<View className={styles.payment_list}>
<View className={styles.payment_list_top_border}></View>
@@ -99,11 +108,11 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
<View className={styles.payment_list_title_price}>
<View className={styles.payment_list_title_price_item}>
<Text>订单金额</Text>
<Text>¥6,001.00</Text>
<Text>¥{formatPriceDiv(payInfo?.should_collect_money)}</Text>
</View>
<View className={styles.payment_list_title_price_item}>
<Text>已付金额</Text>
<Text>¥1,801.00</Text>
<Text>¥{formatPriceDiv(payInfo?.amount_paid)}</Text>
</View>
</View>
</View>
@@ -114,7 +123,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
<View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
<View className={styles.payment_list_item_left_text}>预存款</View>
</View>
<View className={styles.payment_list_item_left_price}>金额不足，剩余 ¥{payInfo?.advance_deposit_balance}</View>
{advance_payment}
</View>
<MCheckbox status={submitData.payment_method == 0} onSelect={() => advanceSelectData(0)} onClose={() => advanceSelectData(null)}/>
</View>
src/pages/order/components/remark/index.tsx
+1 -1
View File
@@ -27,7 +27,7 @@ export default ({onBlur, onSave}:Param) => {
}
return (
<View className={styles.order_popup}>
<View className={styles.order_popup_title}>添加备注</View>
<View className={styles.order_popup_title}>编辑备注</View>
<View className={styles.order_popup_input}>
<Textarea placeholder="请添加备注" maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e)} onBlur={(e) => onBlur?.(e)}></Textarea>
<View className={styles.descDataNum}>{descData.number}/{descData.count}</View>
src/pages/order/index.module.scss
+1
View File
@@ -52,6 +52,7 @@
color: $color_font_two;
margin-right: 10px;
flex:1;
word-break:break-all;
}
.order_desc_text_hint{
text-align: right;
src/pages/order/index.tsx
+12 -1
View File
@@ -151,6 +151,17 @@ import styles from './index.module.scss'
getSaleOrderPreView()
})
//支付成功
const onPaySuccess = useCallback(() => {
getSaleOrderPreView()
closePayShow()
}, [orderDetail])
//关闭支付弹窗
const closePayShow = useCallback(() => {
setPayMentShow(() => false)
}, [orderDetail])
return (
<View className={styles.order_main}>
{/* <View className={styles.weight_memo_con}>
@@ -191,7 +202,7 @@ import styles from './index.module.scss'
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
<Remark onSave={(e) => getRemark(e)}/>
</Popup>
<Payment show={payMentShow} onClose={() => setPayMentShow(false)} orderId={orderDetail?.should_collect_order_id}/>
<Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderId={orderDetail?.should_collect_order_id}/>
<View className="common_safe_area_y"></View>
</View>
)
src/pages/orderList/components/orderStatusList/index.module.scss
+18
View File
@@ -0,0 +1,18 @@
.order_status_list{
font-size: $font_size;
color: #9E9E9E;
margin-top: 20px;
.order_status_item{
padding: 20px;
box-sizing: border-box;
}
.selected{
font-weight: 700;
color: #000;
border-bottom: 4px solid #707070;
}
.order_list_scroll{
white-space: nowrap;
display: flex;
}
}
src/pages/orderList/components/orderStatusList/index.tsx
+46
View File
@@ -0,0 +1,46 @@
import { ScrollView, View } from "@tarojs/components"
import { memo, useEffect, useState } from "react"
import styles from './index.module.scss'
import classnames from "classnames";
type Param = {
list: {id: number, name: string}[],
defaultId?: number|null,
onSelect?: (val: number) => void
}
export default memo(({list = [], defaultId = null, onSelect}: Param) => {
const [selectInfo, setSelectInfo] = useState({
selected: -1, //当前选中的id
tabId: '', //需要滚动到的id
})
useEffect(() => {
if(defaultId) {
const index = list?.findIndex(item => {
console.log(item.id, defaultId)
return item.id == defaultId
})
if(index !== -1) {
const num = index > 0?( index - 1) : 0
setSelectInfo((e) => ({...e, tabId:list[num].id.toString()}))
}
}
}, [defaultId])
const clickEvent = ({item, index}: {item:any, index:number}) => {
const num = index > 0?( index - 1) : 0
setSelectInfo((e) => ({...e, tabId:list[num].id.toString(), selected: item.id}))
onSelect?.(item.id)
}
return (
<View className={styles.order_status_list}>
<ScrollView scrollX scrollIntoView={`tabs_${selectInfo.tabId}`} scrollWithAnimation={true}>
<View className={styles.order_list_scroll}>
{list.map((item, index) => {
return <View key={item.id} id={`tabs_${item.id}`} onClick={() => clickEvent({item, index})} className={classnames(styles.order_status_item, (selectInfo.selected==item.id)&&styles.selected)}>{item.name}</View>
})}
</View>
</ScrollView>
</View>
)
})
src/pages/orderList/index.tsx
+5 -12
View File
@@ -3,14 +3,13 @@ import useLogin from "@/use/useLogin"
import { Image, ScrollView, Text, View } from "@tarojs/components"
import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro"
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
import {ORDER_STATUS} from '@/common/enum'
import styles from './index.module.scss'
import classnames from "classnames";
import Order from "./components/order"
import InfiniteScroll from "@/components/infiniteScroll"
import {GetOrderStatusListApi, GetOrderListApi} from '@/api/order'
import { dataLoadingStatus, getFilterData } from "@/common/util"
import Tabs from "@/components/tabs"
import OrderStatusList from "./components/orderStatusList"
export default () => {
const {checkLogin} = useLogin()
@@ -44,6 +43,7 @@ export default () => {
const getOrderList = async () => {
let res = await listFetchData(getFilterData(searchField))
setOrderData({list: res.data.list, total: res.data.total})
setRefresherTriggeredStatus(() => false)
}
@@ -91,24 +91,17 @@ export default () => {
const getRefresherRefresh = async () => {
pageNum.current.size = 1
setRefresherTriggeredStatus(true)
setSearchField((val) => ({...val, size:10}))
}
return (
<View className={styles.order_list_main}>
<View className={styles.title}>
<Search placeIcon="out" placeholder="搜索商品/名称/颜色/订单号" showBtn={true} changeOnSearch={getSearchData} debounceTime={300}/>
<View className={styles.order_status_list}>
<ScrollView scrollX >
<View className={styles.order_list_scroll}>
{statusList.map(item => {
return <View key={item.id} onClick={() => changeStatus(item.id)} className={classnames(styles.order_status_item, (searchField.status==item.id)&&styles.selected)}>{item.name}</View>
})}
</View>
</ScrollView>
</View>
<OrderStatusList list={statusList} onSelect={changeStatus} defaultId={1}/>
</View>
<View className={styles.order_list}>
<InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={true} selfOnRefresherRefresh={getRefresherRefresh}>
<InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={true} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={getRefresherRefresh}>
{orderData?.list.map(item => {
return <View key={item.id} className={styles.order_item_con}> <Order value={item} onClickBtn={clickOrderBtn}/></View>
})}