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

✨ feat(ID1000570 新增退款码单):

Browse Source
This commit is contained in:
czm 2022-10-19 14:52:38 +08:00
parent af34945fda
commit fe2c60c202
8 changed files with 425 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/api/onlinePay.ts
View File

@ -11,3 +11,14 @@ export const GetPayCode = () => {
method: 'post',
})
}
/**
* 获取退款码单
*/
export const GetReturnPayCode = () => {
return useRequest({
url: `/xima-caphtml/caphtml-return`,
base_url: CAP_HTML_TO_IMAGE_BASE_URL,
method: 'post',
})
}

4
src/common/constant.js
View File

@ -1,4 +1,4 @@
// export const BASE_URL = CURRENT_BASE_URL
export const BASE_URL = CURRENT_BASE_URL
// export const BASE_URL = `http://192.168.0.75:50001/lymarket`
// export const BASE_URL = `http://192.168.0.89:50001/lymarket`
// export const BASE_URL = `http://10.0.0.5:50001/lymarket`
@ -13,7 +13,7 @@
// export const BASE_URL = `https://www.zzfzyc.com/lymarket` // 正式环境
// export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞
// export const BASE_URL = `http://192.168.1.7:50001/lymarket` // 添
export const BASE_URL = `http://192.168.1.22:50002/lymarket` // 婷
// export const BASE_URL = `http://192.168.1.22:50002/lymarket` // 婷
// export const BASE_URL = `http://192.168.1.42:50002/lymarket` // 杰
// CDN

8
src/components/afterOrderBtns/index.tsx
View File

@ -76,6 +76,14 @@ export default memo(({ orderInfo, onClick, fixedBottom = true }: Param) => {
return false
},
},
{
id: 7,
label: '退款码单',
validatarFunc: (orderInfo) => {
if (ReturnStageReturned.value == orderInfo.stage && orderInfo?.sale_mode === 0) return true
return false
},
},
])
//显示的按钮数组

55
src/pages/salesAfter/components/returnPayCheck/index.module.scss Normal file
View File

@ -0,0 +1,55 @@
$top:170px;
.scanPay_main{
.scanPay_con{
padding: 20px;
background-color: #F6F6F6;
border-radius: 20px;
.miconfont_title{
transform: rotate(-180deg);
position: absolute;
left: 20px;
top: 27px;
font-size: 37px;
color: $color_font_three;
z-index: 99;
}
}
.title{
font-size: $font_size_big;
color: #000000;
text-align: center;
font-weight: 700;
position: relative;
padding: 10px 0;
}
.desc{
font-size: $font_size_min;
color: $color_main;
text-align: center;
padding: 10px 0;
.miconfont{
font-size: 25px;
}
}
.scanPay_list{
border-radius: 10px;
height: 900px;
image{
width: 100%;
}
}
.btns{
background: #007aff;
border-radius: 40px;
width: 668px;
height: 82px;
text-align: center;
line-height: 80px;
width: 100%;
color: #fff;
font-size: 32px;
margin-top: 30px;
}
}

182
src/pages/salesAfter/components/returnPayCheck/index.tsx Normal file
View File

@ -0,0 +1,182 @@
import { Image, ScrollView, Text, View } from '@tarojs/components'
import { memo, useEffect, useRef, useState } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import Popup from '@/components/popup'
import Taro from '@tarojs/taro'
import { alert } from '@/common/common'
import { formatDateTime, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/fotmat'
import useCheckAuthorize from '@/use/useCheckAuthorize'
import { GetReturnPayCode } from '@/api/onlinePay'
import LoadingCard from '@/components/loadingCard'
type Param = {
show?: true | false
onClose?: () => void
company?: string
qrcode?: string
orderInfo?: any
}
type ListParam = {
product_code: string
product_name: string
product_color_code: string
product_color_name: string
num: string
weight: string
length: string
sale_price: string
total_price: string
weight_error: string
deduction_weight: string
settle_weight: string
deduction_amount: string
}
export default memo(({ show = true, onClose, orderInfo }: Param) => {
const [detail, setDetail] = useState<any>()
useEffect(() => {
console.log('detail:::', detail)
if (show && detail) {
getCore()
}
}, [show, detail])
useEffect(() => {
if (orderInfo) {
let lists: ListParam[] = []
orderInfo.product_list?.map((pitem) => {
pitem?.product_colors?.map((citem) => {
lists.push({
product_code: formatRemoveHashTag(pitem.code),
product_name: pitem.name,
product_color_code: formatRemoveHashTag(citem.code),
product_color_name: citem.name,
num: citem.roll.toString(),
length: (citem.length / 100).toString(),
weight: formatWeightDiv(citem.actual_weight || citem.estimate_weight).toString(),
sale_price: formatPriceDiv(citem.sale_price).toString(),
total_price: formatPriceDiv(citem.total_sale_price || citem.estimate_amount).toString(), //小计
weight_error: formatWeightDiv(citem.weight_error).toString(),
deduction_weight: formatWeightDiv(citem.deductions_weight).toString(),
settle_weight: formatWeightDiv(citem.settle_weight).toString(),
deduction_amount: formatPriceDiv(citem.deductions_amount).toString(),
})
})
})
setDetail(() => ({
title: '售后确认单',
order_type: orderInfo.sale_mode_name, //类型：大货
sale_user: orderInfo.purchaser_name,
order_created_time: formatDateTime(orderInfo.create_time),
order_no: orderInfo.return_order_no,
pay_account: orderInfo.transfer_remittance_account,
bank_account_name: orderInfo.account_name,
bank_name: orderInfo.bank_of_deposit,
order_total_length: (orderInfo.total_number / 100).toString(),
order_total_price: formatPriceDiv(orderInfo.refund_amount).toString(),
order_total_num: orderInfo.total_number.toString(),
order_total_settle_weight: formatWeightDiv(orderInfo.order_total_settle_weight).toString(),
order_total_deduction_weight: formatWeightDiv(orderInfo.order_total_deduction_weight).toString(),
order_total_deduction_amount: formatPriceDiv(orderInfo.order_total_deduction_amount).toString(),
order_total_weight_error: formatWeightDiv(orderInfo.total_weight_error).toString(),
list: lists,
}))
}
}, [orderInfo])
//收货地址
const address = (addressInfo) => {
if (addressInfo?.shipment_mode == 2) {
return addressInfo?.province_name ? addressInfo.province_name + addressInfo.city_name + addressInfo.district_name + addressInfo.address_detail : ''
} else {
return addressInfo?.take_goods_address
}
}
//收件人
const userName = (addressInfo) => {
return addressInfo?.shipment_mode == 2 ? orderInfo.target_user_name : ''
}
//手机号
const userPhone = (addressInfo) => {
return addressInfo?.shipment_mode == 2 ? orderInfo.target_user_phone : orderInfo.take_goods_phone
}
//获取支付二维码
const [payCodeImage, setPayCodeImage] = useState<string>('')
const fileData = useRef({
filePath: '',
base64: '',
})
const { fetchData, state } = GetReturnPayCode()
const getCore = async () => {
let res = await fetchData(detail)
const base64 = res.data.base64
setPayCodeImage(() => base64)
const time = new Date().valueOf()
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []
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',
})
}
//检查是否开启保存图片权限
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)
},
})
}
//预览图片
const showImage = () => {
console.log('fileData.current.filePath::', fileData.current.filePath)
Taro.previewImage({
current: fileData.current.filePath, // 当前显示
urls: [fileData.current.filePath], // 需要预览的图片http链接列表
})
}
//复制功能
return (
<View className={styles.scanPay_main}>
<Popup show={show} showTitle={false} onClose={onClose}>
<View className={styles.scanPay_con}>
<View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
<View className={styles.title}>查看销售码单</View>
<View className={styles.scanPay_list}>
{(state.loading && <LoadingCard />) || (
<ScrollView scrollY className={styles.scanPay_list}>
<Image mode='widthFix' src={payCodeImage} onClick={showImage}></Image>
</ScrollView>
)}
</View>
<View className={styles.btns} onClick={saveImageCheck}>
保存码单
</View>
</View>
</Popup>
</View>
)
})

7
src/pages/salesAfter/index.tsx
View File

@ -14,6 +14,7 @@ import ContentBox from './components/contentBox'
import KindList from './components/kindList'
import OrderState from './components/orderState'
import ReturnLogistics from './components/returnLogistics'
import ReturnPayCheck from './components/returnPayCheck'
import styles from './index.module.scss'
export default () => {
@ -62,6 +63,8 @@ export default () => {
setApplyRecord(true)
} else if (val == 5) {
onShowLogistics(1)
} else if (val == 7) {
setReturnCodeShow(true)
}
},
[orderDetail],
@ -101,6 +104,9 @@ export default () => {
//显示记录
const [applyRecord, setApplyRecord] = useState(false)
//显示码单
const [returnCodeShow, setReturnCodeShow] = useState(false)
return (
<View className={styles.order_main}>
<OrderState orderInfo={orderDetail} />
@ -119,6 +125,7 @@ export default () => {
onSubmit={logisticsSuccess}
/>
<ApplyRecord show={applyRecord} id={orderDetail?.id} onClose={() => setApplyRecord(false)} />
<ReturnPayCheck orderInfo={orderDetail} show={returnCodeShow} onClose={() => setReturnCodeShow(false)} />
<View className='common_safe_area_y'></View>
</View>
)

292
src/pages/salesAfter/salesAfterList/components/order/index.tsx
View File

@ -1,153 +1,165 @@
import { goLink } from "@/common/common";
import { AFTER_ORDER_STATUS, REFUND_STATUS_ORDER } from "@/common/enum";
import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
import AfterOrderBtns from "@/components/afterOrderBtns";
import LabAndImg from "@/components/LabAndImg";
import { useSelector } from "@/reducers/hooks";
import { Image, Text, View } from "@tarojs/components"
import classnames from "classnames";
import { memo, useCallback, useMemo, useRef, useState } from "react";
import OrderStatusTag from "../orderStatusTag";
import styles from './index.module.scss'
import { goLink } from '@/common/common'
import { AFTER_ORDER_STATUS, REFUND_STATUS_ORDER } from '@/common/enum'
import { formatHashTag, formatImgUrl, formatPriceDiv } from '@/common/fotmat'
import AfterOrderBtns from '@/components/afterOrderBtns'
import LabAndImg from '@/components/LabAndImg'
import { useSelector } from '@/reducers/hooks'
import { Image, Text, View } from '@tarojs/components'
import classnames from 'classnames'
import { memo, useCallback, useMemo, useRef, useState } from 'react'
import OrderStatusTag from '../orderStatusTag'
import styles from './index.module.scss'
type Param = {
value: {
order_no: string,
return_order_no: string,
sale_mode: number,
sale_mode_name: string,
stage_name: string,
shipment_mode_name: string,
product_list: any[],
total_fabrics: number,
total_colors: number,
total_number: number,
stage: 0,
id: number,
lab: {l:number, a:number, b:number},
rgb: {r:number, g:number, b:number},
texturl_url: string,
type: number //2 退货 1 预收退款 3 销售
return_apply_order_id: number //退款申请单
refund_amount: number // 退款金额
is_quality_check: true|false,
accessory_url: string[], //物流图片
take_goods_remark: string, //物流备注
quality_check_pass_product: any[]
},
onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
value: {
order_no: string
return_order_no: string
sale_mode: number
sale_mode_name: string
stage_name: string
shipment_mode_name: string
product_list: any[]
total_fabrics: number
total_colors: number
total_number: number
stage: 0
id: number
lab: { l: number; a: number; b: number }
rgb: { r: number; g: number; b: number }
texturl_url: string
type: number //2 退货 1 预收退款 3 销售
return_apply_order_id: number //退款申请单
refund_amount: number // 退款金额
is_quality_check: true | false
accessory_url: string[] //物流图片
take_goods_remark: string //物流备注
quality_check_pass_product: any[]
}
onClickBtn?: (val: { status: number; orderInfo: Param['value'] }) => void
}
export default memo(({value, onClickBtn}: Param) => {
const userInfo = useSelector(state => state.userInfo)
//对应数量
const formatCount = useCallback((item, sale_mode) => {
return sale_mode == 0? item.roll + '条' : Number(item.length / 100) + '米'
}, [value])
//对应单价
const standardPrice = useCallback((price, sale_mode) => {
return formatPriceDiv(price).toLocaleString() + '/' + (sale_mode == 1?'m':'kg')
}, [value])
export default memo(({ value, onClickBtn }: Param) => {
const userInfo = useSelector((state) => state.userInfo)
//对应数量
const formatCount = useCallback(
(item, sale_mode) => {
return sale_mode == 0 ? item.roll + '条' : Number(item.length / 100) + '米'
},
[value],
)
//对应单价
const standardPrice = useCallback(
(price, sale_mode) => {
return formatPriceDiv(price).toLocaleString() + '/' + (sale_mode == 1 ? 'm' : 'kg')
},
[value],
)
//点击订单按钮
const orderBtnsClick = useCallback((status) => {
onClickBtn?.({status, orderInfo:value})
}, [value])
//点击订单按钮
const orderBtnsClick = useCallback(
(status) => {
onClickBtn?.({ status, orderInfo: value })
},
[value],
)
//按钮所需数据
const orderInfo = useMemo(() => {
return value
}, [value])
//按钮所需数据
const orderInfo = useMemo(() => {
return value
}, [value])
//整理颜色
const labAndRgbAndUrl = useMemo(() => {
return {lab:{...value?.lab}, rgb:{...value?.rgb}, texturl_url: value?.texturl_url}
}, [value])
//整理颜色
const labAndRgbAndUrl = useMemo(() => {
return { lab: { ...value?.lab }, rgb: { ...value?.rgb }, texturl_url: value?.texturl_url }
}, [value])
const {
ReturnApplyOrderTypeReturnForRefund, // 退货退款
} = REFUND_STATUS_ORDER
const {
ReturnApplyOrderTypeReturnForRefund, // 退货退款
} = REFUND_STATUS_ORDER
const numText = useMemo(() => {
let total_number_new = value?.sale_mode == 0? value?.total_number:(value?.total_number/100)
return `${value?.total_fabrics} 种面料，${value?.total_colors} 种颜色，共 ${total_number_new}${value?.sale_mode == 0? ' 条':' 米'}`
}, [value])
const numText = useMemo(() => {
let total_number_new = value?.sale_mode == 0 ? value?.total_number : value?.total_number / 100
return `${value?.total_fabrics} 种面料，${value?.total_colors} 种颜色，共 ${total_number_new}${value?.sale_mode == 0 ? ' 条' : ' 米'}`
}, [value])
//售后单状态
const {ReturnStageQualityCheckPendingRefund, ReturnStageServiceOrderPendingRefund, ReturnStageReturned} = AFTER_ORDER_STATUS
const stage_name = useMemo(() => {
return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value].includes(value?.stage)?'待退款':value?.stage_name
}, [value])
//售后单状态
const { ReturnStageQualityCheckPendingRefund, ReturnStageServiceOrderPendingRefund, ReturnStageReturned } = AFTER_ORDER_STATUS
const stage_name = useMemo(() => {
return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value].includes(value?.stage) ? '待退款' : value?.stage_name
}, [value])
//获取面料数组
const list = useMemo(() => {
let res = value?.is_quality_check? value?.quality_check_pass_product : value?.product_list
return res || []
}, [value])
//获取面料数组
const list = useMemo(() => {
let res = value?.is_quality_check ? value?.quality_check_pass_product : value?.product_list
return res || []
}, [value])
return (
<View className={styles.order_item}>
<View className={styles.header} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
<View className={styles.user}>
<Image src={`${userInfo?.adminUserInfo?.avatar_url}`}/>
</View>
<View className={styles.order_con}>
<Text className={styles.name}>{userInfo?.adminUserInfo?.user_name}</Text>
<View className={styles.order_num}>
<View className={styles.order_num_con}>
<Text className={styles.order_no}>售后单号：{value?.return_order_no}</Text>
<Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
</View>
<OrderStatusTag status={value?.type}/>
</View>
</View>
</View>
{list?.length > 0 && <View className={styles.product_con} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
<View className={styles.product_title}>
<View className={styles.product_tag}>{value?.sale_mode_name}</View>
<View className={styles.product_name}>{formatHashTag(list?.[0].code, list?.[0].name)}</View>
<View className={styles.product_status}>{stage_name}</View>
</View>
<View className={styles.product_list}>
<View className={styles.image}>
<LabAndImg value={labAndRgbAndUrl}/>
<View className={styles.color_num}>{list?.[0].product_colors?.[0].code}</View>
</View>
<View className={styles.color_list}>
{list?.[0].product_colors?.map((itemColor, index) => {
return (
(index <= 1)&&<View className={styles.color_item}>
<View className={styles.color_title}>{formatHashTag(itemColor.code, itemColor.name)}</View>
<View className={styles.color_price}>¥{standardPrice(itemColor.sale_price, value.sale_mode)}</View>
<View className={styles.color_num}>×{formatCount(itemColor, value.sale_mode)}</View>
</View>
)
})
}
{list?.[0].product_colors?.length > 2 && <View className={styles.color_item}>
<View className={styles.color_more}>……</View>
<View className={styles.color_more}>……</View>
<View className={styles.color_more}>……</View>
</View>}
</View>
</View>
<View className={styles.color_count_num}>
<Text>{numText}</Text>
{/* {ReturnStageReturned.value == value?.stage && <Text className={styles.refund_amount}><Text>¥</Text>{formatPriceDiv(value?.refund_amount, 100, true)}</Text>} */}
</View>
<View className={styles.order_number}>
<Text>{value?.type == ReturnApplyOrderTypeReturnForRefund.value?'已申请退货':'已申请退款'}</Text>
<Text>订单号：{value?.order_no}</Text>
</View>
</View>}
{(list?.length <= 0 && value?.is_quality_check) && <View className={styles.inspection} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
<Text className={classnames('iconfont icon-zhuyi', styles.miconfont)}></Text>
没有质检通过的商品，无法退款
</View>}
<AfterOrderBtns orderInfo={orderInfo} onClick={orderBtnsClick} fixedBottom={false}/>
return (
<View className={styles.order_item}>
<View className={styles.header} onClick={() => goLink('/pages/salesAfter/index', { id: value?.id })}>
<View className={styles.user}>
<Image src={`${userInfo?.adminUserInfo?.avatar_url}`} />
</View>
)
<View className={styles.order_con}>
<Text className={styles.name}>{userInfo?.adminUserInfo?.user_name}</Text>
<View className={styles.order_num}>
<View className={styles.order_num_con}>
<Text className={styles.order_no}>售后单号：{value?.return_order_no}</Text>
<Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
</View>
<OrderStatusTag status={value?.type} />
</View>
</View>
</View>
{list?.length > 0 && (
<View className={styles.product_con} onClick={() => goLink('/pages/salesAfter/index', { id: value?.id })}>
<View className={styles.product_title}>
<View className={styles.product_tag}>{value?.sale_mode_name}</View>
<View className={styles.product_name}>{formatHashTag(list?.[0].code, list?.[0].name)}</View>
<View className={styles.product_status}>{stage_name}</View>
</View>
<View className={styles.product_list}>
<View className={styles.image}>
<LabAndImg value={labAndRgbAndUrl} />
<View className={styles.color_num}>{list?.[0].product_colors?.[0].code}</View>
</View>
<View className={styles.color_list}>
{list?.[0].product_colors?.map((itemColor, index) => {
return (
index <= 1 && (
<View className={styles.color_item}>
<View className={styles.color_title}>{formatHashTag(itemColor.code, itemColor.name)}</View>
<View className={styles.color_price}>¥{standardPrice(itemColor.sale_price, value.sale_mode)}</View>
<View className={styles.color_num}>×{formatCount(itemColor, value.sale_mode)}</View>
</View>
)
)
})}
{list?.[0].product_colors?.length > 2 && (
<View className={styles.color_item}>
<View className={styles.color_more}>……</View>
<View className={styles.color_more}>……</View>
<View className={styles.color_more}>……</View>
</View>
)}
</View>
</View>
<View className={styles.color_count_num}>
<Text>{numText}</Text>
{/* {ReturnStageReturned.value == value?.stage && <Text className={styles.refund_amount}><Text>¥</Text>{formatPriceDiv(value?.refund_amount, 100, true)}</Text>} */}
</View>
<View className={styles.order_number}>
<Text>{value?.type == ReturnApplyOrderTypeReturnForRefund.value ? '已申请退货' : '已申请退款'}</Text>
<Text>订单号：{value?.order_no}</Text>
</View>
</View>
)}
{list?.length <= 0 && value?.is_quality_check && (
<View className={styles.inspection} onClick={() => goLink('/pages/salesAfter/index', { id: value?.id })}>
<Text className={classnames('iconfont icon-zhuyi', styles.miconfont)}></Text>
没有质检通过的商品，无法退款
</View>
)}
<AfterOrderBtns orderInfo={orderInfo} onClick={orderBtnsClick} fixedBottom={false} />
</View>
)
})

8
src/pages/salesAfter/salesAfterList/index.tsx
View File

@ -12,6 +12,7 @@ import OrderStatusList from './components/orderStatusList'
import { GetSaleOrderListApi, RefundOrderSatausApi } from '@/api/salesAfterOrder'
import ApplyRecord from '../components/applyRecord'
import ReturnLogistics from '../components/returnLogistics'
import ReturnPayCheck from '../components/returnPayCheck'
export default () => {
useLogin()
@ -101,7 +102,10 @@ export default () => {
setApplyRecord(true)
} else if (status == 5) {
onShowLogistics(() => true)
} else if (status == 7) {
setReturnCodeShow(true)
}
console.log('orderInfo::', orderInfo)
setCallBackPayOrderInfo(orderInfo)
},
[orderData],
@ -110,6 +114,9 @@ export default () => {
//显示记录
const [applyRecord, setApplyRecord] = useState(false)
//显示码单
const [returnCodeShow, setReturnCodeShow] = useState(false)
//物流显示
const [logisticsShow, setLogisticsShow] = useState(false)
const onShowLogistics = useCallback((val) => {
@ -155,6 +162,7 @@ export default () => {
onClose={onCloseLogistics}
onSubmit={logisticsSuccess}
/>
<ReturnPayCheck orderInfo={callBackOrderInfo} show={returnCodeShow} onClose={() => setReturnCodeShow(false)}></ReturnPayCheck>
</View>
)
}