979 lines
31 KiB
TypeScript
979 lines
31 KiB
TypeScript
import { View } from '@tarojs/components'
|
||
import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro'
|
||
import type { ReactNode } from 'react'
|
||
import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||
import classnames from 'classnames'
|
||
import OfflinePay from '../order/components/offlinePay'
|
||
import PayPopup from '../order/components/PayPopup'
|
||
import styles from './index.module.scss'
|
||
import AdvanceOrderState from './components/advanceOrderState'
|
||
import AddressDetailBox from './components/addressDetailBox'
|
||
import BottomApply from './components/BottomApply'
|
||
import OrderState from './components/orderState'
|
||
import Remark from '@/components/textareaEnhance'
|
||
import Popup from '@/components/popup'
|
||
import BottomBtns from '@/components/BottomBtns'
|
||
import { debounce } from '@/common/util'
|
||
import {
|
||
GetPayCode,
|
||
MpSaleOrder,
|
||
MpSaleOrderAddress,
|
||
MpSaleOrderCancel,
|
||
MpSaleOrderPut,
|
||
MpSaleOrderReceive,
|
||
MpSaleOrderShipmentMode,
|
||
MpShoppingCartProductColorList,
|
||
OrderPaymentOrderPaymentMethodInfo,
|
||
OrderPaymentOrderPaymentSubmission,
|
||
OrderPaymentPreCollectOrderOrderPaymentMethodInfo,
|
||
OrderPaymentPreCollectOrderOrderPaymentSubmission,
|
||
} from '@/api/order'
|
||
import { alert, goLink } from '@/common/common'
|
||
import { formatDateTime, formatHashTag, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/format'
|
||
import IconFont from '@/components/iconfont/iconfont'
|
||
import { IMG_CND_Prefix, PAY_H5_CODE_URL } from '@/common/constant'
|
||
import SaleCodeList from '@/components/SaleCodeList'
|
||
import LabAndImg from '@/components/LabAndImg'
|
||
import Tag from '@/components/tag'
|
||
|
||
// 卡片盒子元素
|
||
interface Obs {
|
||
title?: string
|
||
modeName?: string
|
||
showMode?: boolean
|
||
children?: ReactNode
|
||
clickNode?: () => void
|
||
}
|
||
|
||
const DefaultBox = (props: Obs) => {
|
||
const {
|
||
title = '标题',
|
||
modeName = '大货',
|
||
showMode = false,
|
||
children,
|
||
clickNode,
|
||
} = props
|
||
|
||
return (
|
||
<View className={styles.defaltBox}>
|
||
<View className={styles.titleBox}>
|
||
<View className={styles.title}>{title}</View>
|
||
{
|
||
showMode && <View className={styles.modeName} onClick={() => clickNode?.()}>{modeName}</View>
|
||
}
|
||
</View>
|
||
<View className={styles.modeLine}></View>
|
||
{children}
|
||
</View>
|
||
)
|
||
}
|
||
const DefaultBoxWithMemo = memo(DefaultBox)
|
||
|
||
// 产品商品元素
|
||
interface PropGoods {
|
||
// item?: {
|
||
// code?: string | number
|
||
// }
|
||
list: any[]
|
||
obj: {
|
||
sale_mode?: number | string
|
||
}
|
||
}
|
||
const GoodsItem = (porps: PropGoods) => {
|
||
const { list = [], obj = {} } = porps
|
||
const labAndImgObj = useCallback((item) => {
|
||
return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
|
||
}, [])
|
||
return (
|
||
<>
|
||
{
|
||
list.map((item, index) => {
|
||
return (
|
||
<View className={styles.goodsBox} key={index}>
|
||
<View className={styles.goodsProduct}>{item.code}# {item.name}</View>
|
||
<View className={styles.goodsLine}></View>
|
||
{
|
||
item.product_colors.map((it, inx) => {
|
||
return (
|
||
<View className={styles.itemGoods} key={inx}>
|
||
<View className={styles.itemPic}>
|
||
<LabAndImg value={labAndImgObj(it)} />
|
||
</View>
|
||
{/* <View className={styles.itemPic} style={{ backgroundColor: `rgb(${it?.rgb?.r} ${it?.rgb?.g} ${it?.rgb?.b})` }}></View> */}
|
||
<View className={styles.itemRight}>
|
||
<View className={styles.item_right_top}>
|
||
<View className={styles.itemName}>{formatHashTag(it.code, it.name)}</View>
|
||
<View className={styles.itemNums}>x{obj?.sale_mode === 0 ? it.roll : it.length / 100}{obj?.sale_mode === 0 ? '条' : 'm'}</View>
|
||
</View>
|
||
<View className={styles.item_right_Bottom}>
|
||
<View className={styles.flexBox}>
|
||
<View className={styles.itemMoney}>¥{formatPriceDiv(it.sale_price)}/{obj?.sale_mode === 1 ? 'm' : 'kg'}</View>
|
||
{
|
||
obj?.sale_mode === 0 && it?.sale_price !== it?.standard_sale_price && <View className={styles.lastBox}>¥{it?.standard_sale_price / 100}/{obj?.sale_mode === 1 ? 'm' : 'kg'}</View>
|
||
}
|
||
</View>
|
||
<View className={styles.itemMoneyOne}>¥{formatPriceDiv(it.total_sale_price)}</View>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
)
|
||
})
|
||
}
|
||
</View>
|
||
)
|
||
})
|
||
}
|
||
</>
|
||
|
||
)
|
||
}
|
||
const GoodsItemWithMemo = memo(GoodsItem)
|
||
|
||
const OrderDetails = () => {
|
||
const router = useRouter()
|
||
// useEffect(() => {
|
||
// getDetail()
|
||
// }, [])
|
||
|
||
// 收货方法,1:自提，2物流
|
||
const [receivingStatus, setReceivingStatus] = useState(null)
|
||
// 切换自提或者物流
|
||
const { fetchData: selectFetch } = MpSaleOrderShipmentMode()
|
||
const onReceivingStatus = debounce(async(e, value) => {
|
||
if (infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5 || infoObj.status === 3 || infoObj.status === 11) {
|
||
alert.error('不允许更改')
|
||
return false
|
||
}
|
||
e.stopPropagation()
|
||
if (receivingStatus === value) {
|
||
alert.error('不能选择相同的方式')
|
||
return false
|
||
}
|
||
Taro.showLoading({
|
||
title: '请稍等...',
|
||
mask: true,
|
||
})
|
||
const res = await selectFetch({ id: Number(infoObj.id), shipment_mode: value })
|
||
if (res.msg === 'success') {
|
||
Taro.hideLoading()
|
||
Taro.showToast({
|
||
title: '成功',
|
||
icon: 'success',
|
||
})
|
||
setReceivingStatus(value)
|
||
getDetail()
|
||
}
|
||
else {
|
||
if (res.data.code == 70029) {
|
||
Taro.hideLoading()
|
||
Taro.showToast({
|
||
title: res.msg,
|
||
icon: 'error',
|
||
})
|
||
}
|
||
else {
|
||
Taro.hideLoading()
|
||
Taro.showToast({
|
||
title: '请先去新增地址',
|
||
icon: 'error',
|
||
})
|
||
}
|
||
}
|
||
}, 300)
|
||
|
||
const { fetchData: infoFetch } = MpSaleOrder()
|
||
const [infoObj, setInfoObj] = useState<any>({})
|
||
// 获取订单详情
|
||
const getDetail = async() => {
|
||
Taro.showLoading({
|
||
title: '加载中...',
|
||
mask: true,
|
||
})
|
||
const res = await infoFetch({ id: router.params.id })
|
||
|
||
orderMsg.map((it) => {
|
||
if (it.leftTitle === '订单编号：') {
|
||
it.rightTitle = res.data.order_no
|
||
}
|
||
if (it.leftTitle === '创建时间：') {
|
||
it.rightTitle = formatDateTime(res.data.create_time)
|
||
}
|
||
if (it.leftTitle === '发货时间：') {
|
||
it.rightTitle = formatDateTime(res.data.delivery_time)
|
||
}
|
||
if (it.leftTitle === '业务员：') {
|
||
it.rightTitle = res.data.sale_user_name
|
||
}
|
||
if (res.data.change_time !== '') {
|
||
if (it.leftTitle === '编辑时间：') {
|
||
it.rightTitle = formatDateTime(res.data.change_time)
|
||
}
|
||
}
|
||
else {
|
||
if (it.leftTitle === '编辑时间：') {
|
||
it.showFont = false
|
||
}
|
||
}
|
||
})
|
||
res.data.picUrl = res.data.delivery_appendix_url?.map((item) => {
|
||
item = IMG_CND_Prefix + item
|
||
return item
|
||
})
|
||
res.data.logistics_details?.map((item) => {
|
||
if (item.status == '待收货') {
|
||
item.delivery_appendix_url = res.data.delivery_appendix_url?.map((item) => {
|
||
item = IMG_CND_Prefix + item
|
||
return item
|
||
})
|
||
}
|
||
return item
|
||
})
|
||
setInfoObj(res.data)
|
||
setOrderMsg([...orderMsg])
|
||
setReceivingStatus(res.data.shipment_mode)
|
||
// 小程序提供的api，通知页面停止下拉刷新效果
|
||
Taro.stopPullDownRefresh()
|
||
Taro.hideLoading()
|
||
}
|
||
// 复制功能
|
||
const clipboardData = () => {
|
||
Taro.setClipboardData({
|
||
data: infoObj?.order_no || '',
|
||
success(res) {
|
||
Taro.showToast({
|
||
icon: 'none',
|
||
title: '复制成功',
|
||
})
|
||
},
|
||
})
|
||
}
|
||
|
||
// useEffect(() => {
|
||
// setReceivingStatus(receivingStatus)
|
||
// }, [receivingStatus])
|
||
// 订单信息文字数组
|
||
const [orderMsg, setOrderMsg] = useState<any[]>([
|
||
{
|
||
leftTitle: '订单编号：',
|
||
rightTitle: '------',
|
||
showBtn: true,
|
||
showFont: true,
|
||
},
|
||
{
|
||
leftTitle: '创建时间：',
|
||
rightTitle: '------',
|
||
showFont: true,
|
||
},
|
||
{
|
||
leftTitle: '发货时间：',
|
||
rightTitle: '------',
|
||
showFont: true,
|
||
},
|
||
{
|
||
leftTitle: '业务员：',
|
||
rightTitle: '------',
|
||
showFont: true,
|
||
},
|
||
{
|
||
leftTitle: '编辑时间：',
|
||
rightTitle: '------',
|
||
showFont: true,
|
||
|
||
},
|
||
])
|
||
|
||
// 备注操作
|
||
const [showDesc, setShowDesc] = useState(false)
|
||
const { fetchData: remarkFetch } = MpSaleOrderPut()
|
||
const getRemark = async() => {
|
||
const res = await remarkFetch({ remark: infoObj.remark, id: Number(router.params.id) })
|
||
if (res.msg === 'success') {
|
||
Taro.showToast({
|
||
title: '成功',
|
||
icon: 'success',
|
||
})
|
||
setShowDesc(false)
|
||
getDetail()
|
||
}
|
||
}
|
||
|
||
// 更多按钮查看操作
|
||
const [showMore, setShowMore] = useState(false)
|
||
|
||
// 刷新页面
|
||
const refresh = useCallback(() => {
|
||
alert.loading('刷新中')
|
||
getDetail()
|
||
}, [])
|
||
|
||
const { fetchData: cancelFetch } = MpSaleOrderCancel()
|
||
// 取消订单
|
||
const cancle = async(e, item) => {
|
||
e.stopPropagation()
|
||
Taro.showModal({
|
||
content: '确定要取消吗？',
|
||
confirmText: '确认',
|
||
cancelText: '取消',
|
||
async success(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()
|
||
getDetail()
|
||
}
|
||
else {
|
||
Taro.showToast({
|
||
title: res.msg,
|
||
icon: 'error',
|
||
})
|
||
}
|
||
}
|
||
},
|
||
})
|
||
}
|
||
// 再次购买
|
||
const { fetchData: buyFetch } = MpShoppingCartProductColorList()
|
||
const nextBuy = async(e, item) => {
|
||
e.stopPropagation()
|
||
Taro.showLoading({
|
||
title: '请稍等...',
|
||
mask: true,
|
||
})
|
||
const 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,
|
||
})
|
||
})
|
||
})
|
||
const 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()
|
||
getDetail()
|
||
}
|
||
else {
|
||
Taro.showToast({
|
||
title: res.msg,
|
||
icon: 'error',
|
||
})
|
||
}
|
||
}
|
||
|
||
// 扫码支付
|
||
const [showSide, setShowSide] = useState(true)
|
||
const [title, setTitle] = useState('')
|
||
const [picUrl, setPicUrl] = useState('')
|
||
|
||
// 显示支付
|
||
const [showPay, setShowPay] = useState(false)
|
||
// 去支付逻辑
|
||
const { fetchData: infoOneFetch } = OrderPaymentOrderPaymentMethodInfo()
|
||
const { fetchData: infoTwoFetch } = OrderPaymentPreCollectOrderOrderPaymentMethodInfo()
|
||
const [payList, setPayList] = useState<any[]>([
|
||
{
|
||
id: 2,
|
||
iconfont: 'icon-yufukuan1',
|
||
name: '预存款',
|
||
fonts: '可用额度 ',
|
||
money: '',
|
||
isCheck: false,
|
||
},
|
||
{
|
||
id: 5,
|
||
iconfont: 'icon-xianxiahuizong',
|
||
name: '货到付款',
|
||
fonts: '发货后3天内付款',
|
||
isCheck: false,
|
||
money: '',
|
||
color: '#ffffff',
|
||
},
|
||
{
|
||
id: 3,
|
||
iconfont: 'icon-a-0tianzhangqi',
|
||
name: 'x天账期',
|
||
fonts: '可用额度 ',
|
||
money: '',
|
||
isCheck: false,
|
||
},
|
||
{
|
||
iconfont: 'icon-yue',
|
||
name: '线下汇款',
|
||
},
|
||
{
|
||
iconfont: 'icon-saomiao',
|
||
name: '扫码支付',
|
||
color: '#ffffff',
|
||
},
|
||
])
|
||
const toPay = async(e, item) => {
|
||
e.stopPropagation()
|
||
|
||
if (item.status !== 10) {
|
||
const res = await infoOneFetch({ id: item.should_collect_order_id })
|
||
setmd5Key(res.data.md5_key)
|
||
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-huozhuziti',
|
||
name: '货主自提',
|
||
color: '#ffffff',
|
||
fonts: '',
|
||
money: '',
|
||
isCheck: false,
|
||
})
|
||
setPayList([...payList])
|
||
}
|
||
}
|
||
}
|
||
else {
|
||
const res = await infoTwoFetch({ id: item.pre_collect_order_id })
|
||
setmd5Key(res.data.md5_key)
|
||
const arr: any = []
|
||
arr.push(
|
||
{
|
||
id: 2,
|
||
iconfont: 'icon-yufukuan1',
|
||
name: '预存款',
|
||
fonts: `可用额度${formatPriceDiv(
|
||
res.data.advance_deposit_balance,
|
||
).toLocaleString()}`,
|
||
money: '',
|
||
isCheck: false,
|
||
},
|
||
{
|
||
iconfont: 'icon-yue',
|
||
name: '线下汇款',
|
||
},
|
||
{
|
||
iconfont: 'icon-saomiao',
|
||
name: '扫码支付',
|
||
color: '#ffffff',
|
||
},
|
||
)
|
||
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-huozhuziti',
|
||
name: '货主自提',
|
||
fonts: '',
|
||
money: '',
|
||
isCheck: false,
|
||
color: '#ffffff',
|
||
})
|
||
}
|
||
}
|
||
setPayList([...arr])
|
||
}
|
||
setShowSide(true)
|
||
setTitle('待支付款项')
|
||
setShowPay(true)
|
||
}
|
||
|
||
useDidShow(() => {
|
||
getDetail()
|
||
})
|
||
// 页面下拉刷新
|
||
usePullDownRefresh(() => {
|
||
getDetail()
|
||
})
|
||
|
||
const [md5Key, setmd5Key] = useState('')
|
||
|
||
const { fetchData: payFetch } = GetPayCode()
|
||
const handScanpay = async() => {
|
||
const list: any = []
|
||
infoObj.product_list.forEach((item) => {
|
||
item.product_colors.forEach((it) => {
|
||
list.push({
|
||
product_code: item.code,
|
||
product_name: item.name,
|
||
product_color_code: formatRemoveHashTag(it.code),
|
||
product_color_name: it.name,
|
||
num: it.roll.toString(),
|
||
weight: formatWeightDiv(it.actual_weight).toString(),
|
||
sale_price: (it.sale_price / 100).toString(),
|
||
total_price:
|
||
it.total_sale_price !== 0
|
||
? (it.total_sale_price / 100).toString()
|
||
: (it.estimate_amount / 100).toString(),
|
||
length: (it.length / 100).toString(),
|
||
weight_error: formatWeightDiv(it.weight_error).toString(),
|
||
})
|
||
})
|
||
})
|
||
const query = {
|
||
list,
|
||
title: '面料销售电子确认单',
|
||
show_qrcode: true,
|
||
show_barcode: true,
|
||
order_type: infoObj.sale_mode_name,
|
||
shipment_mode: infoObj.shipment_mode_name,
|
||
company: infoObj.title_purchaser_name,
|
||
sale_user: infoObj.sale_user_name,
|
||
order_created_time: formatDateTime(infoObj.create_time),
|
||
order_no: infoObj.order_no,
|
||
target_user_name: infoObj.target_user_name,
|
||
target_address: infoObj.address_detail,
|
||
target_description: infoObj.remark,
|
||
pay_account: infoObj.transfer_remittance_account,
|
||
bank_account_name: infoObj.account_name,
|
||
bank_name: infoObj.bank_of_deposit,
|
||
pay_type: infoObj.settle_mode_name,
|
||
client: infoObj.purchaser_name,
|
||
phone: infoObj.target_user_phone,
|
||
order_total_length: (infoObj.total_number / 100).toString(),
|
||
order_total_price: (
|
||
infoObj.bill_total_sale_price / 100
|
||
).toString(),
|
||
total_weight_error_discount: (
|
||
infoObj.total_weight_error_discount / 100
|
||
).toString(),
|
||
order_total_num: infoObj.total_number.toString(),
|
||
qrcode: `${PAY_H5_CODE_URL}?key=${md5Key}`,
|
||
order_total_weight: (infoObj.total_weight / 1000).toString(),
|
||
estimate_amount: (infoObj.estimate_amount / 100).toString(),
|
||
total_sale_price: (infoObj.total_sale_price / 100).toString(),
|
||
actual_amount: (infoObj.actual_amount / 100).toString(),
|
||
wait_pay_amount: (infoObj.wait_pay_amount / 100).toString(),
|
||
order_total_weight_error: (
|
||
infoObj.total_weight_error / 1000
|
||
).toString(),
|
||
show_sale_price: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_total_price: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_estimate_amount: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_total_sale_price: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_total_weight_error_discount: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_actual_amount: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_wait_pay_amount: infoObj?.sale_mode === 0 && infoObj?.is_display_price ? true : !!((infoObj?.sale_mode === 1 || infoObj?.sale_mode === 2)),
|
||
show_tips: true,
|
||
tips: `请核对本单后验收， <b>如发现质量问题，请于收到货之日起3天内与平台客服联系协商解决，</b>逾期不作处理即表示购方默认对货物无异议；<b>购方确认无任何问题方可裁剪/加工，一经裁剪，缩水等工艺，平台概不负责；</b>
|
||
看布购货，请先试缩水，并注意分缸裁布！如需撞色拼接，请先试色牢度。非质量问题，恕不退换，谢谢合作！`,
|
||
}
|
||
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: '取消',
|
||
async success(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)
|
||
getDetail()
|
||
}
|
||
else {
|
||
Taro.hideLoading()
|
||
Taro.showToast({
|
||
title: restult?.msg,
|
||
icon: 'error',
|
||
})
|
||
}
|
||
}
|
||
},
|
||
})
|
||
|
||
// }
|
||
}
|
||
|
||
// 显示线下汇款
|
||
const [showOffline, setShowOffline] = useState(false)
|
||
// 选择地址
|
||
const handSelect = (obj) => {
|
||
if (receivingStatus === 1 || (infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5 || infoObj.status === 11 || infoObj.status === 3)) {
|
||
alert.error('不允许更改')
|
||
return false
|
||
}
|
||
Taro.navigateTo({
|
||
url: `/pages/addressManager/index?orderId=${obj.id}&purchaser_id=${obj.purchaser_id}`,
|
||
})
|
||
}
|
||
|
||
// 是否显示按钮
|
||
const showBtn = useMemo(() => {
|
||
if ((infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5 || infoObj.status === 11 || infoObj.status === 3)) {
|
||
return false
|
||
}
|
||
else {
|
||
return true
|
||
}
|
||
}, [infoObj])
|
||
|
||
const showWhatFont = useMemo(() => {
|
||
if (infoObj.shipment_mode === 1) {
|
||
return '自提商品'
|
||
}
|
||
else {
|
||
return '物流'
|
||
}
|
||
}, [infoObj])
|
||
|
||
// 申请退货
|
||
const handApplyGood = () => {
|
||
if (infoObj.av_return_product.length == 0) {
|
||
return alert.error('暂无货物退')
|
||
}
|
||
else {
|
||
Taro.navigateTo({
|
||
url: `/pages/applyGoods/index?orderId=${infoObj.id}`,
|
||
})
|
||
setShowMore(false)
|
||
}
|
||
}
|
||
|
||
// 申请退款
|
||
const handApplyMoney = () => {
|
||
// 三种类型的 待收货，已收货后申请退货退款，需要选择质量/非质量问题
|
||
if (infoObj?.status == 8 || infoObj?.status == 9) {
|
||
Taro.navigateTo({
|
||
url: `/pages/applyGoods/index?orderId=${infoObj.id}`,
|
||
})
|
||
}
|
||
else {
|
||
Taro.navigateTo({
|
||
url: `/pages/applyMoney/index?orderId=${infoObj.id}`,
|
||
})
|
||
}
|
||
setShowMore(false)
|
||
}
|
||
|
||
// 确认收货
|
||
const { fetchData: receveFetch } = MpSaleOrderReceive()
|
||
const handSureGoods = async() => {
|
||
Taro.showModal({
|
||
content: '确认收货吗？',
|
||
confirmText: '确认',
|
||
cancelText: '取消',
|
||
async success(res) {
|
||
if (res.confirm) {
|
||
Taro.showLoading({
|
||
title: '请稍等...',
|
||
mask: true,
|
||
})
|
||
const res = await receveFetch({ sale_order_id: Number(infoObj.id) })
|
||
if (res?.msg === 'success') {
|
||
Taro.showToast({
|
||
title: '成功',
|
||
})
|
||
Taro.hideLoading()
|
||
setShowMore(false)
|
||
getDetail()
|
||
}
|
||
else {
|
||
Taro.hideLoading()
|
||
Taro.showToast({
|
||
title: res?.msg,
|
||
icon: 'error',
|
||
})
|
||
}
|
||
}
|
||
},
|
||
})
|
||
}
|
||
|
||
const onChange = (e) => {
|
||
setInfoObj(val => ({ ...val, remark: e }))
|
||
}
|
||
// 选择支付方式
|
||
const clickItem = (item) => {
|
||
if (item.name === '扫码支付') { handScanpay() }
|
||
if (item.name === '线下汇款') { setShowOffline(true) }
|
||
payList.map((it) => {
|
||
if (item.id === it.id) {
|
||
it.checked = true
|
||
}
|
||
else {
|
||
it.checked = false
|
||
}
|
||
return it
|
||
})
|
||
setPayList([...payList])
|
||
}
|
||
useEffect(() => {
|
||
setInfoObj(infoObj)
|
||
}, [infoObj])
|
||
const showRemarkFont = useMemo(() => {
|
||
if (infoObj.status === 10 || infoObj.status == 0 || infoObj.status == 1 || infoObj.status == 2 || infoObj.status == 7) {
|
||
return `${'填写/修改备注'} >`
|
||
}
|
||
else {
|
||
return ''
|
||
}
|
||
}, [infoObj])
|
||
|
||
const BottomBtnsRef = useRef<any>()
|
||
const [showOther, setshowOther] = useState(false)
|
||
useMemo(() => {
|
||
Taro.nextTick(() => {
|
||
if (BottomBtnsRef.current?.btnList.length > 3) {
|
||
setshowOther(true)
|
||
return true
|
||
}
|
||
else {
|
||
setshowOther(false)
|
||
return false
|
||
}
|
||
})
|
||
}, [infoObj])
|
||
// 待接单、配布中、已配布状态时，叫预估金额，其他状态叫合计金额。
|
||
const payFont = useMemo(() => {
|
||
if (infoObj?.status === 0 || infoObj?.status === 1 || infoObj?.status === 2) {
|
||
return '预估金额'
|
||
}
|
||
else {
|
||
return '合计金额'
|
||
}
|
||
}, [infoObj])
|
||
|
||
const [showCodeList, setshowCodeList] = useState(false)
|
||
// 展示码单
|
||
const handShowCodeList = () => {
|
||
setshowCodeList(true)
|
||
}
|
||
|
||
// 修改订单
|
||
const handEdit = () => {
|
||
Taro.navigateTo({
|
||
url: `/pages/orderEdit/index?orderId=${infoObj.id}`,
|
||
})
|
||
}
|
||
|
||
return (
|
||
<View className={styles.mainBox}>
|
||
{(infoObj?.status != 10 && <OrderState picUrl={infoObj?.picUrl} orderInfo={infoObj} />)}
|
||
{
|
||
infoObj.status === 10 && <AdvanceOrderState orderInfo={infoObj} onRefresh={() => refresh()} />
|
||
}
|
||
<AddressDetailBox
|
||
showBtn={showBtn}
|
||
showWhatFont={showWhatFont}
|
||
navSelect={obj => handSelect(obj)}
|
||
obj={infoObj}
|
||
receivingStatus={receivingStatus}
|
||
onReceivingStatus={(e, value) => onReceivingStatus(e, value)}
|
||
></AddressDetailBox>
|
||
<DefaultBox
|
||
showMode
|
||
title="客户信息"
|
||
modeName={infoObj.sale_mode_name}
|
||
>
|
||
<View className={styles.pussBox}>
|
||
<View className={styles.pussName}>{infoObj.purchaser_name}</View>
|
||
<View className={styles.pussName}>
|
||
{
|
||
infoObj?.platform_source !== 1 && <Tag type="primary" size="normal" circle customClassName={styles.platform_name} plain>
|
||
{infoObj?.platform_source_name || '暂无'}
|
||
</Tag>
|
||
}
|
||
</View>
|
||
<View className={styles.pussPhone}>{infoObj.purchaser_phone}</View>
|
||
</View>
|
||
</DefaultBox>
|
||
<View className={styles.total}> {infoObj.total_fabrics} 种面料，{infoObj.total_colors} 个颜色，共 {infoObj.sale_mode === 0 ? infoObj.total_number : infoObj.total_number / 100} {infoObj.sale_mode === 0 ? '条' : 'm'}</View>
|
||
<View className={styles.productBox}>
|
||
<GoodsItem list={infoObj?.product_list} obj={infoObj}></GoodsItem>
|
||
<View className={styles.flexMoney}>
|
||
<View className={styles.flexTotalBox}>
|
||
<View className={styles.totalFont}>{payFont}</View>
|
||
{/* <IconFont name={'icon-tishi'} size={28} ></IconFont> */}
|
||
</View>
|
||
<View className={styles.shoudPay}>¥{formatPriceDiv(infoObj.bill_total_sale_price)}</View>
|
||
</View>
|
||
<View className={styles.flexMoney}>
|
||
<View className={styles.flexTotalBox}>
|
||
<View className={styles.totalFont}>实付金额</View>
|
||
{/* <IconFont name={'icon-tishi'} size={28} ></IconFont> */}
|
||
</View>
|
||
<View className={styles.shoudPay}>¥{formatPriceDiv(infoObj.actual_amount)}</View>
|
||
</View>
|
||
{
|
||
infoObj?.wait_pay_amount < 0 && <View className={styles.flexMoney}>
|
||
<View className={styles.flexTotalBox}>
|
||
<View className={styles.totalFont}>{infoObj?.wait_pay_amount?.toString().indexOf('-') !== -1 ? '退款金额' : '待付金额'}</View>
|
||
{/* <IconFont name={'icon-tishi'} size={28} ></IconFont> */}
|
||
</View>
|
||
<View className={styles.shoudPay}>¥{formatPriceDiv(infoObj.refund_amount)}</View>
|
||
</View>
|
||
}
|
||
{
|
||
infoObj?.wait_pay_amount > 0 && <View className={styles.flexMoney}>
|
||
<View className={styles.flexTotalBox}>
|
||
<View className={styles.totalFont}>{infoObj?.wait_pay_amount?.toString().indexOf('-') !== -1 ? '退款金额' : '待付金额'}</View>
|
||
{/* <IconFont name={'icon-tishi'} size={28} ></IconFont> */}
|
||
</View>
|
||
<View className={styles.shoudPay}>¥{formatPriceDiv(infoObj.wait_pay_amount)}</View>
|
||
</View>
|
||
}
|
||
|
||
</View>
|
||
<DefaultBox title="订单信息">
|
||
{
|
||
orderMsg.map((item, index) => {
|
||
return (
|
||
|
||
item.showFont && <View className={styles.detailBox} key={index}>
|
||
<View className={styles.detailFont}>
|
||
{item.leftTitle}
|
||
</View>
|
||
<View className={styles.detailRightFlex}>
|
||
<View className={styles.detailRight}>{item.rightTitle}</View>
|
||
{item.showBtn && <View className={styles.detailBtn} onClick={() => clipboardData()}>复制</View>}
|
||
</View>
|
||
|
||
</View>
|
||
)
|
||
})
|
||
}
|
||
|
||
</DefaultBox>
|
||
<DefaultBox title="备注信息" showMode modeName={showRemarkFont} clickNode={() => setShowDesc(showRemarkFont != '')}>
|
||
<View className={styles.remarkFont}>{infoObj.remark === '' ? '暂无' : infoObj.remark}</View>
|
||
</DefaultBox>
|
||
|
||
<Popup show={showDesc} title="填写/编辑备注" showTitle onClose={() => setShowDesc(false)}>
|
||
<View style={{ margin: '24rpx' }}>
|
||
<Remark
|
||
// onSave={(e) => getRemark(e)}
|
||
onChange={e => onChange(e)}
|
||
defaultValue={infoObj.remark}
|
||
/>
|
||
<View className={styles.order_save_address} onClick={() => getRemark()}>保存</View>
|
||
</View>
|
||
|
||
</Popup>
|
||
<View className={styles.safeBottom}></View>
|
||
<View className={styles.bottomBox}>
|
||
{
|
||
showOther
|
||
&& <>
|
||
{
|
||
!showMore && <View className={styles.moreFontBox}> <View className={styles.moreFont} onClick={() => setShowMore(true)}>更多</View></View>
|
||
}
|
||
{
|
||
showMore && <View className={styles.moreFontBox}> <View className={styles.moreFont} onClick={() => setShowMore(false)}>关闭</View></View>
|
||
}
|
||
{
|
||
showMore && <View className={styles.posssBox}>
|
||
<BottomApply
|
||
obj={infoObj}
|
||
goodsObj={infoObj}
|
||
handApplyGoods={() => handApplyGood?.()}
|
||
handApplyMoney={() => handApplyMoney?.()}
|
||
nextBuy={e => nextBuy?.(e, infoObj)}
|
||
handSureGoods={() => handSureGoods?.()}
|
||
handShowCodeList={() => handShowCodeList?.()}
|
||
cancle={e => cancle?.(e, infoObj)}
|
||
></BottomApply>
|
||
</View>
|
||
}
|
||
</>
|
||
}
|
||
|
||
<BottomBtns
|
||
ref={BottomBtnsRef}
|
||
showDetail
|
||
goodsObj={infoObj}
|
||
obj={infoObj}
|
||
showTuiGoods
|
||
cancle={e => cancle?.(e, infoObj)}
|
||
nextBuy={e => nextBuy?.(e, infoObj)}
|
||
toPay={e => toPay?.(e, infoObj)}
|
||
handShowCodeList={() => handShowCodeList?.()}
|
||
handSureGoods={() => handSureGoods?.()}
|
||
handApplyGoods={() => handApplyGood?.()}
|
||
handApplyMoney={() => handApplyMoney?.()}
|
||
handEdit={() => handEdit?.()}
|
||
></BottomBtns>
|
||
</View>
|
||
<PayPopup
|
||
list={payList}
|
||
obj={infoObj}
|
||
showPopup={showPay}
|
||
popupClose={() => setShowPay(false)}
|
||
clickItem={infoObj => clickItem(infoObj)}
|
||
handsurePay={infoObj => handsurePay(infoObj)}
|
||
showSide={showSide}
|
||
title={title}
|
||
picUrl={picUrl}
|
||
></PayPopup>
|
||
<OfflinePay showKong={false} show={showOffline} onClose={() => setShowOffline(false)} offlineInfo={infoObj}></OfflinePay>
|
||
<SaleCodeList obj={infoObj} showPopup={showCodeList} popupClose={() => setshowCodeList(false)}></SaleCodeList>
|
||
</View >
|
||
)
|
||
}
|
||
export default OrderDetails
|