订单售后v3

This commit is contained in:
czm 2022-06-17 20:35:04 +08:00
parent bd04a6d31b
commit 6e08416ba0
16 changed files with 189 additions and 56 deletions

View File

@ -55,3 +55,14 @@ export const GetLabProductApi = () => {
method: "get",
})
}
/**
*
* @returns
*/
// export const GetProductDetailApi = () => {
// return useRequest({
// url: `/v1/mall/product`,
// method: "get",
// })
// }

View File

@ -3,20 +3,20 @@ import { useRequest } from "@/use/useHttp"
/**
*
*/
export const GetHotSearchApi = () => {
export const GetSaleOrderListApi = () => {
return useRequest({
url: `/v1/mall/hotSearch/list`,
url: `/v1/mall/returnApplyOrder/list`,
method: "get",
})
}
/**
*
*
*/
export const ReturnApplyOrderApi = () => {
return useRequest({
url: `/v1/mall/returnApplyOrder`,
method: "get",
method: "post",
})
}

View File

@ -10,7 +10,7 @@
// export const BASE_URL = `https://dev.zzfzyc.com/lymarket` // 开发环境
// 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.224:50001/lymarket` // 添
// export const BASE_URL = `http://192.168.1.224:50002/lymarket` // 添
export const BASE_URL = `http://192.168.1.15:50001/lymarket` // 杰
// CDN
@ -21,8 +21,6 @@ export const UPLOAD_CDN_URL = `https://v0.api.upyun.com/`
// cdn
export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com"
// 上传图片视频
export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`;

View File

@ -13,7 +13,7 @@ type params = {
onClickBtn?:(val:number) => void,
unit?: string
}
export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
export default ({minNum = 0, maxNum = 10000, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
const [value, setValue] = useState<any>({count:defaultNum})
const onPlus = () => {

View File

@ -30,7 +30,8 @@ export default memo(({orderInfo, onClick}:Param) => {
SaleOrderStatusWaitingPayment,
SaleOrderStatusWaitingReceipt,
SaleOrderStatusAlreadyReceipt,
SaleorderstatusWaitingPrePayment
SaleorderstatusWaitingPrePayment,
SaleOrderStatusTaking
} = ORDER_STATUS
//订单类型
@ -42,6 +43,7 @@ export default memo(({orderInfo, onClick}:Param) => {
//订单按钮按订单状态归类, value是该订单状态可能该按钮会出现
const orderBtnsList = useRef([
{
id: 1,
value: [SaleOrderStatusBooking.value,
@ -51,11 +53,6 @@ export default memo(({orderInfo, onClick}:Param) => {
SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应: 待接单,配布中,已配布, 待付款, 待发货
label: '取消订单'
},
{
id: 2,
value: [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应:待付款, 待发货, 待收货, 已收货, 已完成
label: '去付款'
},
{
id: 3,
value: [SaleOrderStatusWaitingDelivery.value], //申请退款按钮对应: 待发货
@ -86,6 +83,11 @@ export default memo(({orderInfo, onClick}:Param) => {
value: [SaleOrderStatusBooking.value], //按钮对应: 待接单
label: '退款'
},
{
id: 2,
value: [SaleOrderStatusTaking.value, SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应:待付款, 待发货, 待收货, 已收货, 已完成
label: '去付款'
},
])
@ -124,8 +126,6 @@ export default memo(({orderInfo, onClick}:Param) => {
//点击按钮操作
const submitBtns = (val, index) => {
(val == 1)&&cancelOrder(); //取消订单按钮
(val == 6)&&receiveOrder(); //确认收货
if (val == 1) {
cancelOrder()
} else if (val == 6) {

View File

@ -23,7 +23,7 @@
.color_item{
display: flex;
align-items: center;
margin: 20px 0;
margin: 30px 0;
}
.image{
width: 70px;

View File

@ -1,7 +1,8 @@
import { formatHashTag, formatImgUrl } from "@/common/fotmat";
import Counter from "@/components/counter";
import MCheckbox from "@/components/checkbox";
import { Image, Text, View } from "@tarojs/components";
import { memo, useCallback } from "react";
import { FC, memo, useCallback } from "react";
import styles from './index.module.scss'
type OrderParam = {
@ -15,12 +16,36 @@ type OrderParam = {
status?: number, //订单状态
}
export default memo(({order}:{order:OrderParam}) => {
type Param = {
order: OrderParam,
onNumChange?: (val:any) => void
onSelectChange?: (val: {color_id:number, length: number, status: true|false}) => void
}
const kindeList:FC<Param> = memo(({order, onNumChange, onSelectChange}) => {
//对应数量
const formatCount = useCallback((item) => {
return (order?.sale_mode == 0? item.roll : Number(item.length / 100)) + order?.unit
}, [order])
//计步器失返回值
const getCounterChange = useCallback((colorItem) => {
return (number) => {
onNumChange?.({number, color_id: colorItem.id})
}
}, [])
//checkbox选中回调
const selectCallBack = (colorItem) => {
console.log('colorItem::',colorItem)
onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: true})
}
//checkbox关闭回调
const colseCallBack = (colorItem) => {
onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: false})
}
return (
<View className={styles.apply_after_sales_list}>
{order?.list?.map(item => <View className={styles.apply_after_sales_item}>
@ -32,12 +57,15 @@ export default memo(({order}:{order:OrderParam}) => {
{item.product_colors.map(colorItem => <View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>{colorItem.code + ' ' + colorItem.name}</Text><Text>x {formatCount(colorItem)}</Text></View>
<View className={styles.btn_count}>
<Counter/>
</View>
{(order.sale_mode == 0)&&<View className={styles.btn_count}>
<Counter maxNum={colorItem.roll} onChange={getCounterChange(colorItem)}/>
</View>||
<MCheckbox status={item.select} onSelect={() => selectCallBack(colorItem)} onClose={() => colseCallBack(colorItem)}/>}
</View>)}
</View>
</View>)}
</View>
)
})
export default kindeList

View File

@ -4,7 +4,10 @@ import styles from './index.module.scss'
import classnames from "classnames";
//其他说明
export default memo(() => {
type Param = {
onChange: (val: string) => void
}
export default memo(({onChange}:Param) => {
const [descData, setDescData] = useState({
number: 0,
value: '',
@ -18,6 +21,7 @@ export default memo(() => {
res = value.slice(0, descData.count)
}
setDescData({...descData, number:res.length, value: res})
onChange?.(res)
}
const toggleShowRealTextarea = (show) => {

View File

@ -36,7 +36,7 @@
.returnSaleInput_item{
display: flex;
align-items: center;
padding-bottom: 20px;
padding-bottom: 30px;
flex-wrap: wrap;
.title{
font-size: $font_size;
@ -101,16 +101,17 @@
border-radius: 10px;
}
.miconfont_close{
width: 30px;
height: 30px;
width: 43px;
height: 43px;
background-color: #ccc;
border-radius: 50%;
position: absolute;
right: -10px;
top: -10px;
text-align: center;
line-height: 30px;
line-height: 43px;
color: #fff;
font-size: 30px;
}
}
}

View File

@ -1,5 +1,5 @@
import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components";
import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
import classnames from "classnames";
import styles from './index.module.scss'
import { formatHashTag, formatImgUrl } from "@/common/fotmat";
@ -10,17 +10,33 @@ import Taro, { useDidShow, useRouter } from "@tarojs/taro";
import useUploadCDNImg from "@/use/useUploadImage";
import { GetSaleOrderDetailApi } from "@/api/order";
import KindList from "./components/kindList"
import { ReturnApplyOrderApi } from "@/api/salesAfterOrder";
import { alert } from "@/common/common";
type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明
export default () => {
const router = useRouter()
const orderId = useRef<number>(Number(router.params.id))
useDidShow(() => {
getSaleOrderPreView()
})
const router = useRouter()
const orderId = useRef<number>(Number(router.params.id))
//需要提交的数据
const [submitData, setSubmitData] = useState<any>({
fabric_piece_accessory_url: [],
goods_status: 0,
reason_describe: '',
return_explain: 0,
return_reason: 1,
roll: 0,
roll_list: [],
sale_order_id: orderId.current
})
//获取订单数据
const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
@ -33,8 +49,9 @@ export default () => {
//监听获取到的数据
useEffect(() => {
if(orderDetail)
if(orderDetail) {
formatData()
}
}, [orderDetail])
//格式化数据格式
@ -60,21 +77,73 @@ export default () => {
}
}, [formatDetailOrder])
//对应数量
const formatCount = useCallback((item) => {
return (formatDetailOrder?.sale_mode == 0? item.roll : Number(item.length / 100)) + formatDetailOrder?.unit
}, [formatDetailOrder])
//退货选择弹窗
const [showReason, setShowReason] = useState<{show:true|false, status:ReasonParam}>({show:false, status:1})
const closeReason = useCallback(() => setShowReason({...showReason, show:false}), [])
const onShowReason = (status) => setShowReason({...showReason, status, show:true})
//面料数据
let roll_list = useRef({})
//大货时获取计步器数据
const getNumChange = useCallback((val) => {
if(parseInt(val.number) > 0) {
roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.number}
} else {
delete roll_list.current[val.color_id]
}
let count = 0
Object.values(roll_list.current).map((item: any) => {
count += item.product_roll
})
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
}, [])
//散剪和剪板
const getSelectChange = useCallback((val) => {
console.log('val::', val)
if(val.status) {
roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.length}
} else {
delete roll_list.current[val.color_id]
}
let count = 0
Object.values(roll_list.current).map((item: any) => {
count += item.product_roll
})
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
}, [])
//获取图片列表
const getImageList = useCallback((list) => {
setSubmitData((e) => ({...e, fabric_piece_accessory_url:list}))
}, [])
//其他说明
const getOtherReason = useCallback((val) => {
setSubmitData((e) => ({...e, reason_describe: val}))
}, [])
//提交数据
const {fetchData: fetchDataReturnApply} = ReturnApplyOrderApi()
const onSubmitData = async () => {
if(submitData.roll_list.length <= 0) return alert.error('请选择退货颜色')
let res = await fetchDataReturnApply(submitData)
if(res.success) {
alert.success('申请成功')
} else {
alert.error('申请失败')
}
console.log('提交::',submitData)
}
//底部按钮
const onSubmit = (val) => {
if(val == 2) {
onSubmitData()
}
}
return (
@ -83,7 +152,7 @@ export default () => {
<View className={styles.kind_number}><Text>{dataCount}</Text></View>
<ScrollView scrollY className={styles.scroll}>
<View className={styles.scroll_con}>
<KindList order={formatDetailOrder}/>
<KindList order={formatDetailOrder} onNumChange={getNumChange} onSelectChange={getSelectChange}/>
<View className={styles.returnSaleInput}>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退</View>
@ -108,11 +177,11 @@ export default () => {
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}></View>
<PictureItem/>
<PictureItem onChange={getImageList}/>
</View>
</View>
<OtherReason/>
<OtherReason onChange={getOtherReason}/>
</View>
</ScrollView>
<View className="common_safe_area_y"></View>
@ -129,10 +198,13 @@ export default () => {
}
//图片列表
const PictureItem = memo(() => {
type ImageParam = {
onChange?:(val: string[]) => void
}
const PictureItem:FC<ImageParam> = memo(({onChange}) => {
const {getWxPhoto} = useUploadCDNImg()
const [imageList, setImageLise] = useState<string[]>([])
//上传图片
const uploadImage = async () => {
let res:any = await getWxPhoto('after-sale')
if(res.code == 200) {
@ -142,8 +214,15 @@ const PictureItem = memo(() => {
//删除图片
const delImage = (index) => {
imageList.splice(index,1)
setImageLise(() => [...imageList])
}
//监听上传的图片变化
useEffect(() => {
onChange?.(imageList||[])
}, [imageList])
return (
<>
{imageList.map((item, index) =>

View File

@ -100,7 +100,10 @@ export default memo(({order, comfirm = false}:Param) => {
if (item.id == 2) {
//合计金额 (剪板特殊请情况)
return (item.value.includes(order.status)|| order.sale_mode == 1)
} else {
} else if (item.id == 3) {
//空差优惠只有大货才有
return (item.value.includes(order.status) && order.sale_mode == 1 )
} else {
return (item.value.includes(order.status) && order.sale_mode != 1 )
}

View File

@ -25,6 +25,7 @@ type OrderInfo = {
pre_collect_order_id?: number, //预付单id
status?: number, //订单状态
payment_method?: 0|PAYMENT_METHOD_PARAM //支付方式
sale_mode?: number //订单类型 0大货 1剪板 2散剪
}
type PayStatus = 1|2|3|4|5|null //1:预存款, 2:账期3线下汇款 4扫码支付, 5:货到付款
@ -122,6 +123,8 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
//是否显示七天账期
const show_account_payment = useMemo(() => {
console.log('orderInfo?.status::',orderInfo)
//剪板合散剪不显示
if(orderInfo?.sale_mode != 0) return false
//支付方式是账期支付,不显示
if(orderInfo?.payment_method == PaymentMethodAccountPeriod.value) return false
//支付方式是货到付款,不显示

View File

@ -14,6 +14,8 @@
font-weight: 700;
margin-left: 15px;
font-size: $font_size;
width: 100px;
@include common_ellipsis();
}
image{
width: 70px;
@ -26,7 +28,7 @@
font-size: $font_size_medium;
color: $color_font_one;
text-align: right;
padding-right: 30px;
padding-right: 10px;
display: flex;
justify-content: flex-end;
align-items: center;
@ -123,7 +125,7 @@
display: flex;
background-color: #F6F6F6;
padding: 20px;
margin-top: 20px;
margin: 20px 0;
align-items: center;
font-size: $font_size_medium;
border-radius: 10px;

View File

@ -11,6 +11,7 @@ import styles from './index.module.scss'
type Param = {
value: {
order_no: string,
return_order_no: string,
sale_mode: number,
sale_mode_name: string,
status_name: string,
@ -23,8 +24,9 @@ type Param = {
id: number,
payment_method: number, //支付方式
actual_amount: number, //实付金额
wait_pay_amount: number //待付金额
should_collect_order_id: number //应付单id
wait_pay_amount: number, //待付金额
should_collect_order_id: number, //应付单id
type: number //1 退货 2退款
},
onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
}
@ -51,6 +53,7 @@ export default memo(({value, onClickBtn}: Param) => {
orderId: value?.id,
actual_amount: value?.actual_amount, //实付金额
wait_pay_amount: value?.wait_pay_amount, //待付金额
sale_mode: value?.sale_mode //订单类型
}
}, [value])
@ -62,10 +65,10 @@ export default memo(({value, onClickBtn}: Param) => {
<Text className={styles.name}>{userInfo?.adminUserInfo?.user_name}</Text>
</View>
<View className={styles.order_num}>
<Text>{value?.order_no}</Text>
<Text>{value?.return_order_no}</Text>
<Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
</View>
<OrderStatusTag status={1}/>
<OrderStatusTag status={value?.type}/>
</View>
<View className={styles.product_con} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
<View className={styles.product_title}>
@ -99,7 +102,7 @@ export default memo(({value, onClickBtn}: Param) => {
<View className={styles.color_count_num}>{`${value?.total_fabrics}种面料,${value?.total_colors}种颜色,共${value?.total_number}`}</View>
<View className={styles.order_number}>
<Text>退</Text>
<Text>LY2278204399678</Text>
<Text>{value?.order_no}</Text>
</View>
</View>
<OrderBtns orderInfo={orderInfo} onClick={orderBtnsClick}/>

View File

@ -12,6 +12,7 @@ import { dataLoadingStatus, getFilterData } from "@/common/util"
import OrderStatusList from "./components/orderStatusList"
import Payment from "../order/components/payment"
import { AFTER_ORDER_STATUS } from "@/common/enum"
import { GetSaleOrderListApi } from "@/api/salesAfterOrder"
export default () => {
const {checkLogin} = useLogin()
@ -40,7 +41,7 @@ export default () => {
}, [])
//获取订单列表
const {fetchData: listFetchData, state:orderState} = GetOrderListApi()
const {fetchData: listFetchData, state:orderState} = GetSaleOrderListApi()
const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0})
const getOrderList = async () => {
let res = await listFetchData(getFilterData(searchField))

View File

@ -67,7 +67,7 @@ const Header = memo((props:any) => {
const {data} = props;
let menu = [{ text: "待配布", icon: "icon-daipeibu", url: "/pages/orderList/index" }, { text: "待付款", icon: "icon-daifukuan", url: "/pages/orderList/index" },
{ text: "待发货", icon: "icon-daifahuo", url: "/pages/orderList/index" }, { text: "已发货", icon: "icon-yifahuo", url: "/pages/orderList/index" },
{ text: "退款/售后", icon: "icon-a-tuikuanshouhou", url: "/pages/orderList/index" }];
{ text: "退款/售后", icon: "icon-a-tuikuanshouhou", url: "/pages/salesAfterList/index" }];
const { getPhoneNumber } = useLogin();
const mGetPhoneNumber = (ev)=>{
if(ev.detail?.code){