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

🦄 refactor:订单列表对接100%

Browse Source
This commit is contained in:
Haiyi 2022-09-14 11:57:35 +08:00
parent afaad76fe3
commit a208802231
16 changed files with 878 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/api/order.ts
View File

@ -1,4 +1,6 @@
import { useRequest } from "@/use/useHttp"
import { CAP_HTML_TO_IMAGE_BASE_URL } from '@/common/constant'
export const mpenumsaleorderstatus = () => {
return useRequest({
url: `/v1/mp/enum/sale/order/status`,
@ -12,7 +14,7 @@ export const mpenumsaleorderstatus = () => {
*/
export const OrderListApi = () => {
return useRequest({
url: `/v1/mp/saleOrder/list`,
url: `/v2/mp/saleOrder/list`,
method: "get",
})
}
@ -48,3 +50,62 @@ export const mpenumsaleUserlist = () => {
method: "get"
})
}
//订单详情
export const mpsaleOrder = () => {
return useRequest({
url: `/v2/mp/saleOrder`,
method: "get"
})
}
//取消订单
export const mpsaleOrdercancel = () => {
return useRequest({
url: `/v1/mp/saleOrder/cancel`,
method: "put",
})
}
//再次购买
export const mpshoppingCartproductColorlist = () => {
return useRequest({
url: `/v1/mp/shoppingCart/productColor/list`,
method: "post",
})
}
//获取账期付款
export const orderPaymentorderPaymentMethodInfo = () => {
return useRequest({
url: `/v1/mp/orderPayment/orderPaymentMethodInfo`,
method: "get",
})
}
//预收单获取接口信息
export const orderPaymentpreCollectOrderorderPaymentMethodInfo = () => {
return useRequest({
url: `/v1/mp/orderPayment/preCollectOrder/orderPaymentMethodInfo`,
method: "get",
})
}
//确认交易
export const orderPaymentorderPaymentSubmission = () => {
return useRequest({
url: `/v1/mp/orderPayment/orderPaymentSubmission`,
method: "put",
})
}
//订单预支付提交
export const orderPaymentpreCollectOrderorderPaymentSubmission = () => {
return useRequest({
url: `/v1/mp/orderPayment/preCollectOrder/orderPaymentSubmission`,
method: "put",
})
}
/**
* 获取在线支付二维码
*/
export const GetPayCode = () => {
return useRequest({
url: `/xima-caphtml/caphtml`,
base_url: CAP_HTML_TO_IMAGE_BASE_URL,
method: 'post',
})
}

2
src/components/BottomBtns/index.module.scss
View File

@ -44,5 +44,7 @@
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #4581FF;
text-align: center;
line-height: 72px;
}
}

12
src/components/BottomBtns/index.tsx
View File

@ -8,9 +8,9 @@ interface prosObj {
status?: Number,
payment_method?: Number
}
cancle?: () => void,
nextBuy?: () => void,
toPay?: () => void,
cancle?: (any) => void,
nextBuy?: (any) => void,
toPay?: (any) => void,
}
export default memo((props: prosObj) => {
@ -67,13 +67,13 @@ export default memo((props: prosObj) => {
return (
<View className={style.flexBox}>
{
showCancel && <View className={style.cancle} onClick={() => cancle?.()}>取消订单</View>
showCancel && <View className={style.cancle} onClick={(e) => cancle?.(e)}>取消订单</View>
}
{
showBuy && <View className={style.nextBuy} onClick={() => nextBuy?.()}>再次购买</View>
showBuy && <View className={style.nextBuy} onClick={(e) => nextBuy?.(e)}>再次购买</View>
}
{
canBuy && <View className={style.toBuy} onClick={() => toPay?.()}>去付款</View>
canBuy && <View className={style.toBuy} onClick={(e) => toPay?.(e)}>去付款</View>
}
</View>

16
src/components/shoppingCart/index.module.scss
View File

@ -116,11 +116,21 @@
}
}
.kongOne {
height: 100px;
}
}
.kongOne {
height: 200px;
}
.loading_more {
height: 300px;
padding-bottom: 200px;
display: flex;
align-items: center;
width: 100%;
justify-content: center;
}
.posBox {
width: 100%;

36
src/components/shoppingCart/index.tsx
View File

@ -7,6 +7,7 @@ import Popup from '@/components/popup'
import Goods from "@/components/goodsItem"
import BottomCustomer from "@/components/BottomCustomer"
import VirtualList from '@tarojs/components/virtual-list'
import DotLoading from "@/components/dotLoading"
interface prosObj {
showPopup?: false | true,
@ -125,21 +126,30 @@ export default memo(forwardRef((props: prosObj, ref) => {
<View className={styles.searchBox}>
<Search placeholder='请输入搜索布料' showBtn={false} changeOnSearch={getSearchData} debounceTime={300} />
</View>
<View className={styles.scrollviewBig}>
<VirtualList
className={styles.scrollview}
height={300} /* 列表的高度 */
width='100%' /* 列表的宽度 */
itemData={goodList} /* 渲染列表的数据 */
itemCount={goodList.length + 0} /* 渲染列表的长度 */
itemSize={100} /* 列表单项的高度 */
overscanCount={1}>
{rows}
</VirtualList>
<View className={styles.kongOne}></View>
</View>
{
goodList.length > 0 && <>
<View className={styles.scrollviewBig}>
<VirtualList
className={styles.scrollview}
height={300} /* 列表的高度 */
width='100%' /* 列表的宽度 */
itemData={goodList} /* 渲染列表的数据 */
itemCount={goodList.length + 0} /* 渲染列表的长度 */
itemSize={100} /* 列表单项的高度 */
overscanCount={1}>
{rows}
</VirtualList>
</View>
<View className={styles.kongOne}></View>
</>
}
{
goodList.length === 0 && <>
<View className={styles.loading_more}>加载中<DotLoading /></View>
</>
}
<View className={styles.posBox}>
<BottomCustomer clientName={clientName} clientId={clientId} isDisabled={selectTotal > 0 && clientName !== '' ? false : true} handSure={() => { handSure() }}></BottomCustomer>
</View>

2
src/custom-tab-bar/index.module.scss
View File

@ -8,7 +8,7 @@
flex-flow: row nowrap;
padding-bottom: env(safe-area-inset-bottom);
background-color: #fff;
z-index: 9999;
z-index: 98;
box-shadow: 0 11px 7px 8px #c2c2c2;
&-line {
position: absolute;

2
src/pages/index/index.tsx
View File

@ -98,7 +98,7 @@ export default () => {
return it
})
setTypeList([...typeList])
setGoodlist([])
}
const [goodList, setGoodlist] = useState<any[]>([])
const { fetchData: colorlistFetch } = mpproductcolorlist()

172
src/pages/order/components/PayPopup/index.module.scss Normal file
View File

@ -0,0 +1,172 @@
.popupBox {
position: relative;
z-index: 99999;
background: #f7f7f7;
bottom: 0;
.contBox {
width: 670px;
padding-bottom: 30px;
// height: 739px;
background: #FFFFFF;
margin-top: 32px;
margin-left: 40px;
overflow: hidden;
.topMoney {
font-size: 48px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #337FFF;
width: 100%;
text-align: center;
margin-bottom: 60px;
}
.itemMoney {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 32px;
.leftFont {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
margin-left: 40px;
}
.rightFont {
margin-right: 40px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.line {
width: 590px;
height: 1px;
background: #000000;
opacity: 0.1;
margin-left: 40px;
margin-bottom: 32px;
}
.itemBox {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 64px;
.leftItem {
margin-left: 40px;
display: flex;
align-items: center;
.leftCrile {
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: #4a7fff;
.lujing {
color: #FFFFFF;
font-size: 35px;
}
}
.rightLeft {
margin-left: 30px;
.title {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.nums {
font-size: 22px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
}
.checkYuan {
width: 40px;
height: 40px;
border: 2px solid #D5D5D5;
margin-right: 40px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
.gou {
font-size: 20px;
color: #FFFFFF;
}
}
.activeChecked {
background: #337fff;
width: 40px;
height: 40px;
border: 2px solid #337fff;
margin-right: 40px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
.gou {
font-size: 20px;
color: #FFFFFF;
}
}
.chakanquanbukehu {
margin-right: 40px;
color: #000000;
font-size: 50px;
}
}
}
}
.sure {
margin-top: 35px;
margin-left: 40px;
width: 670px;
height: 80px;
background: #337FFF;
border-radius: 44px;
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
text-align: center;
line-height: 80px;
}
.pic {
width: 702px;
height: 1500px;
border-radius: 16px;
border: 1px solid #f7f7f7;
}

174
src/pages/order/components/PayPopup/index.tsx Normal file
View File

@ -0,0 +1,174 @@
import { ScrollView, View, Image } from '@tarojs/components'
import { memo, useCallback, useEffect, useMemo, useState, useRef } from 'react'
import styles from './index.module.scss'
import classnames from 'classnames'
import BottomBtns from '@/components/BottomBtns'
import { formatPriceDiv, formatImgUrl } from '@/common/fotmat'
import Taro from '@tarojs/taro'
import Popup from '@/components/popup'
import useCheckAuthorize from '@/use/useCheckAuthorize'
import { alert } from '@/common/common'
interface Props {
showPopup: true | false,
popupClose?: () => void,
obj: {
wait_pay_amount?: number | string,
actual_amount?: number | string,
total_sale_price?: number | string,
should_collect_order_id?: number | string,
pre_collect_order_id?: number | string,
status?: number | string,
},
showSide?: boolean,
list?: any[],
clickItem?: (any) => void,
handsurePay?: (any) => void,
title: string,
picUrl?: string
}
export default memo((props: Props) => {
const {
showSide = true,
showPopup = false,
popupClose,
obj = {
wait_pay_amount: '',
actual_amount: '',
total_sale_price: ''
},
clickItem,
handsurePay,
list = [],
title = '待支付款项',
picUrl = ''
} = props
const fileData = useRef({
filePath: '',
base64: '',
})
//预览图片
const showImage = () => {
const time = new Date().valueOf()
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(picUrl) || []
let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format
fileData.current.filePath = filePath
fileData.current.base64 = bodyData
const save = Taro.getFileSystemManager()
save.writeFile({
filePath: fileData.current.filePath,
data: fileData.current.base64,
encoding: 'base64',
})
Taro.previewImage({
current: fileData.current.filePath, // 当前显示
urls: [fileData.current.filePath], // 需要预览的图片http链接列表
})
}
//检查是否开启保存图片权限
const { check } = useCheckAuthorize({ scope: 'scope.writePhotosAlbum', msg: '您没授权，无法保存图片' })
const saveImageCheck = async () => {
const res = await check()
res && saveImage()
}
//保存图片
const saveImage = () => {
alert.loading('正在保存图片')
Taro.saveImageToPhotosAlbum({
filePath: fileData.current.filePath,
success: function () {
alert.success('图片保存成功')
},
fail: function (err) {
console.log('err::', err)
},
})
}
return (
<View className={styles.popupBox}>
<Popup show={showPopup} title={title} onClose={() => popupClose?.()}>
{
showSide &&
<View className={styles.contBox}>
<View className={styles.topMoney}>
￥{formatPriceDiv(obj.wait_pay_amount)}
</View>
<View className={styles.itemMoney}>
<View className={styles.leftFont}>
订单金额
</View>
<View className={styles.rightFont}>
￥{formatPriceDiv(obj.total_sale_price)}
</View>
</View>
<View className={styles.itemMoney}>
<View className={styles.leftFont}>
已付金额
</View>
<View className={styles.rightFont}>
￥{formatPriceDiv(obj.actual_amount)}
</View>
</View>
<View className={styles.line}></View>
{
list.map((item, index) => {
return (
<View className={styles.itemBox} key={index} onClick={() => clickItem?.(item)}>
<View className={styles.leftItem}>
<View className={styles.leftCrile}>
<View className={classnames('iconfont', item.iconfont, styles.lujing)}></View>
</View>
<View className={styles.rightLeft}>
<View className={styles.title}>{item.name}</View>
{
item.fonts && <View className={styles.nums}>{item.fonts}{
item.money !== "" ? "￥" : ""
}{item.money}</View>
}
</View>
</View>
{
item.name !== '扫码支付' &&
<View className={item.checked ? styles.activeChecked : styles.checkYuan}>
<View className={classnames('iconfont', 'icon-lujing', styles.gou)}></View>
</View>
}
{
item.name === '扫码支付' &&
<View className={classnames('iconfont', 'icon-chakanquanbukehu', styles.chakanquanbukehu)}></View>
}
</View>
)
})
}
</View>
}
{
showSide && <View className={styles.sure} onClick={() => handsurePay?.(props?.obj)}>确认交易</View>
}
{
!showSide &&
<ScrollView enhanced scrollY style={{ height: '700rpx', marginLeft: '24rpx' }}>
<View className={styles.pic}>
<Image lazyLoad mode='widthFix' style={{ width: '100%', height: '100%' }} src={picUrl} onClick={() => showImage()}></Image>
</View>
</ScrollView>
}
{
!showSide && <View className={styles.sure} onClick={() => saveImageCheck()}>保存图片</View>
}
</Popup >
</View >
)
})

9
src/pages/order/components/itemList/index.module.scss
View File

@ -2,7 +2,7 @@
margin-top: 38px;
overflow: hidden;
width: 702px;
height: 536px;
height: 560px;
background: #FFFFFF;
border-radius: 16px;
margin-left: 24px;
@ -14,11 +14,13 @@
margin-top: 24px;
.orderNo {
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
margin-left: 32px;
}
.status {
@ -93,6 +95,11 @@
align-items: center;
.productName {
width: 285px;
height: 34px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-right: 8px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;

71
src/pages/order/components/itemList/index.tsx
View File

@ -3,73 +3,78 @@ import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import styles from './index.module.scss'
import classnames from 'classnames'
import BottomBtns from '@/components/BottomBtns'
import { formatPriceDiv } from '@/common/fotmat'
import Taro from '@tarojs/taro'
interface propsObj {
obj: object
obj: any,
cancle?: (arg: any, obj: any) => void,
nextBuy?: (arg: any, obj: any) => void,
toPay?: (arg: any, obj: any) => void
}
export default memo((props: propsObj) => {
const {
obj = {}
} = props
const cancle = (item) => {
}
const nextBuy = (item) => {
const navTo = (e) => {
Taro.navigateTo({
url: '/pages/orderDetails/index?id=' + props?.obj?.id
})
}
const toPay = (item) => {
}
return (
<View className={styles.itemBox}>
<View className={styles.itemBox} onClick={(e) => navTo(e)}>
<View className={styles.topItem}>
<View className={styles.orderNo}>单号：XS-LY-2208220092</View>
<View className={styles.status}>待接单</View>
<View className={styles.orderNo}>单号：{props?.obj?.order_no}</View>
<View className={styles.status}>{props?.obj?.status_name}</View>
</View>
<View className={styles.pussName}>钟雨乔JENNIEEEEE</View>
<View className={styles.pussName}>{props?.obj?.purchaser_name}</View>
<View className={styles.line}></View>
<View className={styles.contBox}>
<View className={styles.leftCont}>
<View className={styles.leftContNums}>颜色 (1)</View>
<View className={styles.leftCont} style={{ backgroundColor: `rgb(${props?.obj?.product_list[0]?.product_colors[0]?.rgb?.r} ${props?.obj?.product_list[0]?.product_colors[0]?.rgb?.g} ${props?.obj?.product_list[0]?.product_colors[0]?.rgb?.b})` }}>
<View className={styles.leftContNums}>颜色 ({props?.obj?.total_colors})</View>
</View>
<View className={styles.rightCont}>
<View className={styles.rightTop}>
<View className={styles.productBox}>
<View className={styles.productName}>9265# 26S全棉双卫衣</View>
<View className={styles.productMode}>大货</View>
<View className={styles.productName}>{props?.obj?.product_list[0]?.code} {props?.obj?.product_list[0]?.name}</View>
<View className={styles.productMode}>{props?.obj?.sale_mode === 0 ? '大货' : props?.obj?.sale_mode === 1 ? '剪版' : '散剪'}</View>
</View>
<View className={styles.shipMode}>物流</View>
<View className={styles.shipMode}>{props?.obj?.shipment_mode_name}</View>
</View>
<View className={styles.colorsBox}>
<View className={styles.colorNameOne}>051# 花灰白</View>
<View className={styles.colorName}>x5m</View>
<View className={styles.colorNameTwo}>¥ 37.50/kg</View>
<View className={styles.colorNameOne}>{props?.obj?.product_list[0]?.product_colors[0]?.code} {props?.obj?.product_list[0]?.product_colors[0]?.name}</View>
<View className={styles.colorName}>x{props?.obj?.sale_mode === 0 ? props?.obj?.product_list[0]?.product_colors[0]?.roll : props?.obj?.product_list[0]?.product_colors[0]?.length / 100} {props?.obj?.sale_mode === 0 ? '条' : 'm'}</View>
<View className={styles.colorNameTwo}>¥ {props?.obj?.product_list[0]?.product_colors[0]?.sale_price / 100}/kg</View>
</View>
{
props?.obj?.product_list[0]?.product_colors?.length > 1 && <>
<View className={styles.colorsBox}>
<View className={styles.colorNameOne}>{props?.obj?.product_list[0]?.product_colors[1]?.code} {props?.obj?.product_list[0]?.product_colors[1]?.name}</View>
<View className={styles.colorName}>x{props?.obj?.sale_mode === 0 ? props?.obj?.product_list[0]?.product_colors[1]?.roll : props?.obj?.product_list[0]?.product_colors[1]?.length / 100} {props?.obj?.sale_mode === 0 ? '条' : 'm'}</View>
<View className={styles.colorNameTwo}>¥ {props?.obj?.product_list[0]?.product_colors[1]?.sale_price / 100}/kg</View>
</View>
</>
}
</View>
</View>
<View className={styles.lineOne}></View>
<View className={styles.bottomMsg}>
<View className={styles.msgLeft}>布料信息：</View>
<View className={styles.msgRight}>2 种面料，4 种颜色，共 5 米</View>
<View className={styles.msgRight}>{props?.obj?.total_fabrics} 种面料，{props?.obj?.total_colors} 种颜色，共 {props?.obj?.sale_mode === 0 ? props?.obj?.total_number : props?.obj?.total_number / 100} {props?.obj?.sale_mode === 0 ? '条' : 'm'}</View>
</View>
<View className={styles.bottomMsg}>
<View className={styles.msgLeft}>预估金额：</View>
<View className={styles.msgRightOne}>¥3564.00</View>
<View className={styles.msgRightOne}>¥{formatPriceDiv(props?.obj?.estimate_amount)}</View>
</View>
<View className={styles.bottomBox}>
<BottomBtns
obj={obj}
cancle={() => cancle(obj)}
nextBuy={() => nextBuy(obj)}
toPay={() => toPay(obj)}
obj={props?.obj}
cancle={(e) => props?.cancle?.(e, props?.obj)}
nextBuy={(e) => props?.nextBuy?.(e, props?.obj)}
toPay={(e) => props?.toPay?.(e, props?.obj)}
></BottomBtns>
</View>
</View >
</View>
)
})

9
src/pages/order/index.module.scss
View File

@ -34,6 +34,8 @@
}
.popupBox {
padding-bottom: calc($customTabBarHeight + env(safe-area-inset-bottom));
.topBox {
display: flex;
padding-left: 48px;
@ -193,7 +195,7 @@
height: 160px;
background: #FFFFFF;
position: fixed;
bottom: 0;
bottom: calc($customTabBarHeight + env(safe-area-inset-bottom));
z-index: 99;
display: flex;
padding-top: 16px;
@ -241,6 +243,11 @@
line-height: 80px;
}
}
// .areaBox {
// height: calc($customTabBarHeight + env(safe-area-inset-bottom));
// width: 100%;
// }
}

360
src/pages/order/index.tsx
View File

@ -8,8 +8,19 @@ import styles from "./index.module.scss"
import classnames from "classnames";
import Popup from '@/components/popup'
import InfiniteScroll from '@/components/infiniteScroll'
import Taro, { useDidShow } from '@tarojs/taro'
import Taro, { faceVerifyForPay, useDidShow } from '@tarojs/taro'
import ItemList from './components/itemList'
import {
mpsaleOrdercancel,
mpshoppingCartproductColorlist,
orderPaymentorderPaymentMethodInfo,
orderPaymentpreCollectOrderorderPaymentMethodInfo,
orderPaymentorderPaymentSubmission,
orderPaymentpreCollectOrderorderPaymentSubmission,
GetPayCode
} from '@/api/order'
import PayPopup from './components/PayPopup'
import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/fotmat'
export default () => {
//页码和页数
@ -227,6 +238,331 @@ export default () => {
useEffect(() => {
getOrderStatusList()
}, [])
const { fetchData: cancelFetch } = mpsaleOrdercancel()
//取消订单
const cancle = async (e, item) => {
e.stopPropagation();
Taro.showModal({
content: "确定要取消吗？",
confirmText: "确认",
cancelText: "取消",
success: async function (res) {
if (res.confirm) {
Taro.showLoading({
title: '请稍等...',
mask: true
})
const res = await cancelFetch({ id: item.id })
if (res.msg === 'success') {
Taro.showToast({
title: '取消成功'
})
Taro.hideLoading()
getOrderList()
} else {
Taro.showToast({
title: res.msg,
icon: 'error'
})
}
}
}
})
}
//再次购买
const { fetchData: buyFetch } = mpshoppingCartproductColorlist()
const nextBuy = async (e, item) => {
e.stopPropagation();
Taro.showLoading({
title: '请稍等...',
mask: true
})
let arr: any = []
item.product_list.forEach(item => {
item.product_colors.forEach(it => {
arr.push({
length: it.length,
roll: it.roll,
product_color_id: it.id
})
})
})
let query = {
purchaser_id: item.purchaser_id,
sale_mode: item.sale_mode,
color_list: arr
}
const res = await buyFetch(query)
if (res.msg === 'success') {
Taro.showToast({
title: '加入购物车成功!'
})
Taro.hideLoading()
getOrderList()
} else {
Taro.showToast({
title: res.msg,
icon: 'error'
})
}
}
//去支付逻辑
const { fetchData: infoOneFetch } = orderPaymentorderPaymentMethodInfo()
const { fetchData: infoTwoFetch } = orderPaymentpreCollectOrderorderPaymentMethodInfo()
const [itemObj, setItemObj] = useState<any>({})
const [payList, setPayList] = useState<any[]>([
{
id: 2,
iconfont: "icon-xianxiahuizong",
name: "预存款",
fonts: "可用额度 ",
money: "",
isCheck: false,
},
{
id: 5,
iconfont: "icon-xianxiahuizong",
name: "货到付款",
fonts: "发货后3天内付款",
isCheck: false,
money: "",
},
{
id: 3,
iconfont: "icon-xianxiahuizong",
name: "x天账期",
fonts: "可用额度 ",
money: "",
isCheck: false,
},
{
iconfont: "icon-saomiao",
name: "扫码支付",
},
])
const toPay = async (e, item) => {
e.stopPropagation();
setItemObj(item)
if (item.status !== 10) {
let res = await infoOneFetch({ id: item.should_collect_order_id })
payList.map((item) => {
if (item.id === 3) {
item.name = `${res.data.account_period}天账期`;
item.fonts = `可用额度${formatPriceDiv(
res.data.account_period_credit_available_line
).toLocaleString()}`;
}
if (item.id === 2) {
item.fonts = `可用额度${formatPriceDiv(
res.data.advance_deposit_balance
).toLocaleString()}`;
}
return item;
});
setPayList([...payList])
if (item.is_shipper_picks_up) {
const obj = payList.filter((item) => {
return item.id === 6;
});
console.log(obj, "456456");
if (obj.length === 0) {
payList.unshift({
id: 6,
iconfont: "icon-xianxiahuizong",
name: "货主自提",
fonts: "",
money: "",
isCheck: false,
});
setPayList([...payList])
}
}
} else {
let res = await infoTwoFetch({ id: item.pre_collect_order_id })
const arr: any = [];
arr.push(
{
id: 2,
iconfont: "icon-xianxiahuizong",
name: "预存款",
fonts: `可用额度${formatPriceDiv(
res.data.advance_deposit_balance
).toLocaleString()}`,
money: "",
isCheck: false,
},
{
iconfont: "icon-saomiao",
name: "扫码支付",
}
);
if (item.is_shipper_picks_up) {
const obj = arr.filter((item) => {
return item.id === 6;
});
if (obj.length === 0) {
arr.unshift({
id: 6,
iconfont: "icon-xianxiahuizong",
name: "货主自提",
fonts: "",
money: "",
isCheck: false,
});
}
}
setPayList([...arr])
}
setShowSide(true)
setShowPay(true)
}
//选择支付方式
const clickItem = (item) => {
if (item.name === '扫码支付') { handScanpay() }
payList.map(it => {
if (item.id === it.id) {
it.checked = true
} else {
it.checked = false
}
return it
})
setPayList([...payList])
}
//扫码支付
const [showSide, setShowSide] = useState(true)
const [title, setTitle] = useState('')
const [picUrl, setPicUrl] = useState('')
const { fetchData: payFetch } = GetPayCode()
const handScanpay = async () => {
const list: any = [];
itemObj.product_list.forEach((item) => {
item.product_colors.forEach((it) => {
list.push({
product_code: item.code,
product_name: item.name,
product_color_code: it.product_color_code,
product_color_name: it.product_color_name,
num: it.roll.toString(),
weight: formatWeightDiv(it.actual_weight).toString(),
sale_price: (it.sale_price / 100).toString(),
total_price:
it.actual_amount !== 0
? (it.actual_amount / 100).toString()
: (it.estimate_amount / 100).toString(),
length: (it.length / 100).toString(),
weight_error: formatWeightDiv(it.weight_error).toString(),
});
});
});
const query = {
list: list,
title: "面料销售电子确认单",
show_qrcode: true,
show_barcode: true,
show_wait_pay_amount: true,
order_type: itemObj.sale_mode_name,
shipment_mode: itemObj.shipment_mode_name,
company: itemObj.title_purchaser_name,
sale_user: itemObj.sale_user_name,
order_created_time: formatDateTime(itemObj.create_time),
order_no: itemObj.order_no,
target_user_name: itemObj.target_user_name,
target_address: itemObj.address_detail,
target_description: itemObj.remark,
pay_account: itemObj.transfer_remittance_account,
bank_account_name: itemObj.account_name,
bank_name: itemObj.bank_of_deposit,
pay_type: itemObj.settle_mode_name,
client: itemObj.purchaser_name,
phone: itemObj.target_user_phone,
order_total_length: (itemObj.total_number / 100).toString(),
order_total_price: (
itemObj.bill_total_sale_price / 100
).toString(),
total_weight_error_discount: (
itemObj.total_weight_error_discount / 100
).toString(),
order_total_num: itemObj.total_number.toString(),
qrcode: "",
order_total_weight: (itemObj.total_weight / 1000).toString(),
estimate_amount: (itemObj.estimate_amount / 100).toString(),
total_sale_price: (itemObj.total_sale_price / 100).toString(),
show_total_sale_price: true,
show_total_weight_error_discount: true,
actual_amount: (itemObj.payment_amount / 100).toString(),
wait_pay_amount: (itemObj.wait_pay_amount / 100).toString(),
order_total_weight_error: (
itemObj.total_weight_error / 1000
).toString(),
};
const res = await payFetch(query)
if (res.data) {
console.log(res.data.base64)
setShowSide(false)
setTitle('查看销售码单')
setPicUrl(res.data.base64)
}
}
//确认交易
const { fetchData: payOneFetch } = orderPaymentorderPaymentSubmission()
const { fetchData: payTwoFetch } = orderPaymentpreCollectOrderorderPaymentSubmission()
const handsurePay = (obj) => {
let arr: any = []
// if (obj.status !== 10) {
arr = payList.filter(item => {
return item.checked
})
if (!arr.length) {
Taro.showToast({
title: '请选择后再提交',
icon: 'error'
})
return false
}
Taro.showModal({
content: "确定交易吗？",
confirmText: "确认",
cancelText: "取消",
success: async function (res) {
if (res.confirm) {
Taro.showLoading({
title: '请稍等...',
mask: true
})
const restult = await obj.status !== 10 ? payOneFetch({ id: Number(obj.should_collect_order_id), payment_method: Number(arr[0]?.id) }) : payTwoFetch({ id: Number(obj.pre_collect_order_id), payment_method: Number(arr[0]?.id) })
if (restult?.msg === 'success') {
Taro.showToast({
title: '交易成功'
})
Taro.hideLoading()
setShowPay(false)
getOrderList()
} else {
Taro.showToast({
title: restult?.msg,
icon: 'error'
})
}
}
}
})
// }
}
//显示支付
const [showPay, setShowPay] = useState(false)
return (
<View>
<View style={{ background: '#FFFFFF', paddingLeft: '20rpx', paddingBottom: '20rpx', position: 'sticky', top: '0', zIndex: '99' }}>
@ -250,7 +586,13 @@ export default () => {
{orderData?.list?.map((item, index) => {
return (
<View key={item.id} className={styles.order_item_con}>
<ItemList obj={item} key={index}></ItemList>
<ItemList
obj={item}
key={index}
cancle={(e, item) => cancle(e, item)}
nextBuy={(e, item) => nextBuy(e, item)}
toPay={(e, item) => toPay(e, item)}
></ItemList>
</View>
)
})}
@ -314,8 +656,20 @@ export default () => {
<Button className={styles.resetBox} onClick={() => { handReset() }}> 重置</Button >
<Button className={classnames(isDisabled ? styles.button : styles.activeButton)} disabled={isDisabled} onClick={() => { handSure?.() }}> 确认</Button >
</View>
{/* <View className={styles.areaBox}></View> */}
</View>
</Popup>
</View>
<PayPopup
list={payList}
obj={itemObj}
showPopup={showPay}
popupClose={() => setShowPay(false)}
clickItem={(item) => clickItem(item)}
handsurePay={(obj) => handsurePay(obj)}
showSide={showSide}
title={title}
picUrl={picUrl}
></PayPopup>
</View >
)
}

4
src/pages/searchPage/index.module.scss
View File

@ -1,3 +1,7 @@
page {
background: #ffff;
}
.main {
background: #ffff;

15
src/styles/iconfont.scss
View File

@ -1,9 +1,9 @@
/* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
@font-face {
font-family: 'iconfont'; /* Project id 3619513 */
src: url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.woff2?t=1662609560991') format('woff2'),
url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.woff?t=1662609560991') format('woff'),
url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.ttf?t=1662609560991') format('truetype');
font-family: 'iconfont';
/* Project id 3619513 */
src: url('iconfont.ttf?t=1663065236955') format('truetype');
}
.iconfont {
@ -14,6 +14,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-lujing:before {
content: "\e63e";
}
.icon-yewuyuanqizi:before {
content: "\e639";
}
@ -228,5 +232,4 @@
.icon-gouwu:before {
content: "\e607";
}
}

BIN
src/styles/iconfont.ttf
View File

Binary file not shown.