🐞 fix:【ID1000610】

新版内部商城测试bug-2
This commit is contained in:
Haiyi
2022-10-12 17:54:43 +08:00
parent ffa2cf377d
commit 498d8515cb
15 changed files with 648 additions and 57 deletions
+272
View File
@@ -1,5 +1,277 @@
.main {}
.bgBox {
margin: 24px;
background: #FFFFFF;
border-radius: 16px;
overflow: hidden;
}
.goodsBox {
margin-top: 24px;
overflow: hidden;
border-bottom: 8px solid #F7F7F7;
.goodsProduct {
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
margin-left: 32px;
}
.goodsLine {
width: 638px;
height: 1px;
background: #000000;
opacity: 0.1;
margin-left: 32px;
margin-top: 24px;
}
.itemGoods {
margin-top: 24px;
display: flex;
.itemPic {
margin-left: 32px;
margin-right: 42px;
width: 108px;
height: 108px;
background: #322F2F;
border-radius: 8px;
}
.itemRight {
padding-bottom: 24px;
width: 495px;
border-bottom: 1px solid #f7f7f7;
.item_right_top {
margin-bottom: 41px;
display: flex;
align-items: center;
justify-content: space-between;
.itemName {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.itemNums {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.item_right_Bottom {
display: flex;
align-items: center;
justify-content: space-between;
.itemMoney {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.itemMoneyOne {
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
}
.btn {
width: 120px;
height: 64px;
border-radius: 8px;
border: 1px solid #337FFF;
font-size: 28px;
font-weight: 400;
color: #337FFF;
text-align: center;
line-height: 64px;
}
.btnOne {
width: 204px;
height: 64px;
border-radius: 8px;
border: 1px solid #337FFF;
font-size: 28px;
font-weight: 400;
color: #337FFF;
text-align: center;
line-height: 64px;
}
.inputBox {
width: 189px;
height: 64px;
border-radius: 8px;
border: 1px solid #337FFF;
display: flex;
.redceBox {
width: 64px;
height: 64px;
border-radius: 8px 0px 0px 8px;
border-right: 1px solid #337FFF;
display: flex;
align-items: center;
justify-content: center;
.reduce {
width: 20px;
height: 2px;
background: #337FFF;
}
}
.inputBig {
width: 61px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 24px;
font-weight: 400;
color: #337FFF;
}
.addBox {
width: 64px;
height: 64px;
border-left: 1px solid #337FFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 40px;
color: #337FFF;
}
}
}
}
}
.itemGoods:last-child {
margin-top: 24px;
display: flex;
.itemPic {
margin-left: 32px;
margin-right: 42px;
width: 108px;
height: 108px;
background: #322F2F;
border-radius: 8px;
}
.itemRight {
padding-bottom: 24px;
width: 495px;
border-bottom: none;
.item_right_top {
margin-bottom: 41px;
display: flex;
align-items: center;
justify-content: space-between;
.itemName {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.itemNums {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.item_right_Bottom {
display: flex;
align-items: center;
justify-content: space-between;
.itemMoney {
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.itemMoneyOne {
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
}
.btn {
width: 120px;
height: 64px;
border-radius: 8px;
border: 1px solid #337FFF;
font-size: 28px;
font-weight: 400;
color: #337FFF;
text-align: center;
line-height: 64px;
}
.btnOne {
width: 204px;
height: 64px;
border-radius: 8px;
border: 1px solid #337FFF;
font-size: 28px;
font-weight: 400;
color: #337FFF;
text-align: center;
line-height: 64px;
}
}
}
}
}
.goodsBox {
border-bottom: none;
}
.hasSelect {
margin-left: 32px;
margin-right: 32px;
height: 54px;
background: #FEF9F4;
border-radius: 8px;
display: flex;
align-items: center;
font-size: 24px;
font-weight: 600;
color: #F79B31;
padding-left: 20px;
margin-bottom: 24px;
}
.resonBig {
overflow: hidden;
margin: 24px;
+289 -4
View File
@@ -5,6 +5,7 @@ import classnames from "classnames";
import Taro, { faceVerifyForPay, useDidShow, useRouter } from '@tarojs/taro'
import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/format'
import {
mpsaleOrder,
mpreturnApplyOrder,
mpenumrefundExplainone,
} from "@/api/order"
@@ -14,9 +15,116 @@ import Popup from '@/components/popup'
export default () => {
useEffect(() => {
getDetail()
getEnum()
}, [])
const Router = useRouter()
const { fetchData: infoFetch } = mpsaleOrder()
const [ListArr, setListArr] = useState<any[]>([])
const [infoObj, setInfoObj] = useState<any>({})
//获取订单详情
const getDetail = async () => {
Taro.showLoading({
title: '请稍等...',
mask: true
})
const res = await infoFetch({ id: Router.params.orderId })
if (res.data) {
res.data.av_return_product.forEach(item => {
item.av_product_color.map(it => {
it.isTui = false
it.nums = 1
})
return item
})
setInfoObj(res.data)
setListArr(res.data.av_return_product)
Taro.hideLoading()
}
}
//点击退货
const handTui = (val) => {
let res = ListArr
res.forEach(item => {
item.av_product_color?.map(it => {
if (it.sale_order_detail_id == val.sale_order_detail_id) {
it.isTui = true
}
return it
})
})
setListArr([...res])
}
//点击取消退货
const handCancel = (val) => {
ListArr.forEach(item => {
item.av_product_color.map(it => {
if (it.sale_order_detail_id === val.sale_order_detail_id) {
it.isTui = false
}
return it
})
})
setListArr([...ListArr])
}
//点击减
const handReduce = (val) => {
ListArr.forEach(item => {
item.av_product_color.map(it => {
if (it.sale_order_detail_id === val.sale_order_detail_id) {
if (val.nums === 1) {
it.isTui = false
it.nums = 1
} else {
it.nums--
}
}
return it
})
})
setListArr([...ListArr])
}
const onInputEven = (e, val) => {
ListArr.forEach(item => {
item.av_product_color.map(it => {
if (it.sale_order_detail_id === val.sale_order_detail_id) {
if (Number(e.detail.value) < 1) {
it.nums = 1
} else {
it.nums = Number(e.detail.value)
}
if (Number(e.detail.value) > it.roll) {
it.nums = 1
}
}
return it
})
})
setListArr([...ListArr])
}
//点击加
const handAdd = (val) => {
ListArr.forEach(item => {
item.av_product_color.map(it => {
if (it.sale_order_detail_id === val.sale_order_detail_id) {
if (it.nums < it.roll) {
it.nums++
} else {
return
}
}
return it
})
})
setListArr([...ListArr])
}
//获取枚举
const [List, setList] = useState<any[]>([])
@@ -74,6 +182,18 @@ export default () => {
setshowPopup(false)
}
const totalNums = useMemo(() => {
const arr: any[] = []
ListArr.forEach(item => {
item.av_product_color.forEach(it => {
if (it.isTui) {
arr.push(it)
}
})
})
return arr.length
}, [ListArr])
//重置
const handReset = () => {
setQuery(({ reasonId: '', reasonName: '请选择' }))
@@ -91,6 +211,26 @@ export default () => {
}
}, [Query])
//判断是否允许提交
const canTui = useMemo(() => {
if (totalNums > 0 && Query.reasonId !== '') {
return false
} else {
return true
}
}, [Query, totalNums])
const noGoods = useMemo(() => {
if (Query.reasonId !== '') {
return false
} else {
return true
}
}, [Query])
//数组重置
const resetArr = (arr) => {
arr.map(it => {
@@ -102,15 +242,47 @@ export default () => {
//确认退款
const { fetchData: sureFetch } = mpreturnApplyOrder()
const handSure = () => {
let arr: any = [];
if (infoObj.sale_mode == 0 && infoObj.status == 9) {
ListArr.forEach((item) => {
item.av_product_color.forEach((it) => {
if (it.isTui) {
arr.push({
product_color_id: it.sale_mode == 0 ? it.product_color_id : '',
product_id: it.sale_mode == 0 ? it.product_id : '',
product_roll: it.sale_mode == 0 ? it.nums : 0,
sale_order_detail_id: it.sale_order_detail_id,
});
}
});
});
}
if ((infoObj.sale_mode == 1 && infoObj.status == 9) || (infoObj.sale_mode == 2 && infoObj.status == 9)) {
ListArr.forEach((item) => {
item.av_product_color.forEach((it) => {
if (it.isTui) {
arr.push({
product_color_id: it.product_color_id,
product_id: it.product_id,
product_roll: 0,
sale_order_detail_id: it.sale_order_detail_id,
});
}
});
});
}
const query = {
reason_describe: TextareaValue,
fabric_piece_accessory_url: [],
goods_status: 100,
return_explain: Query.reasonId,
roll: 0,
roll_list: [],
roll_list: arr,
sale_order_id: Number(Router.params.orderId),
};
console.log(query, 888)
Taro.showModal({
content: "确认退款吗?",
confirmText: "确认",
@@ -141,12 +313,38 @@ export default () => {
})
}
const showItem = useMemo(() => {
if ((infoObj.sale_mode == 0 && infoObj.status == 9) || (infoObj.sale_mode == 1 && infoObj.status == 9) || (infoObj.sale_mode == 2 && infoObj.status == 9)) {
return true
} else {
return false
}
}, [infoObj])
return (
<View className={styles.main}>
{
showItem && <View className={styles.bgBox}>
<GoodsItem
list={ListArr}
obj={infoObj}
handTui={(item) => handTui(item)}
handCancel={(item) => handCancel(item)}
// onBlur={(e, item) => onBlur(e, item)}
handReduce={(item) => handReduce(item)}
handAdd={(item) => handAdd(item)}
onInputEven={(e, item) => onInputEven(e, item)}
></GoodsItem>
<View className={styles.hasSelect}>汇总:已选{totalNums}种商品</View>
</View>
}
<View className={styles.resonBig}>
<View className={styles.reasonItem} onClick={() => { setshowPopup(true) }}>
<View className={styles.reasonLeft}>
<View className={styles.reasonFont}>退货原因</View>
<View className={styles.reasonFont}>退款原因</View>
<Text className={styles.xing}>*</Text>
{
Query.reasonName === '请选择' && <View className={styles.selectFont}>请选择</View>
@@ -175,7 +373,14 @@ export default () => {
<View className={styles.bottomBox}>
<Button className={styles.resetBox} onClick={() => { handCancl() }}> 取消</Button >
<Button className={classnames(isDisabled ? styles.button : styles.activeButton)} disabled={isDisabled} onClick={() => handSure()}> 确认退款</Button >
{
showItem && <Button className={classnames(canTui ? styles.button : styles.activeButton)} disabled={canTui} onClick={() => handSure()}> 确认退款</Button >
}
{
!showItem && <Button className={classnames(noGoods ? styles.button : styles.activeButton)} disabled={noGoods} onClick={() => handSure()}> 确认退款</Button >
}
</View>
</View>
<Popup title={'筛选情况'} show={showPopup} onClose={() => { setshowPopup?.(false) }}>
@@ -203,4 +408,84 @@ export default () => {
</Popup>
</View>
)
}
}
//产品商品元素
interface PropGoods {
list: any[],
obj: {
sale_mode?: number | string
},
handTui?: (any) => void,
handCancel?: (any) => void,
onBlur?: (e: any, obj: any) => void,
onInputEven?: (e: any, obj: any) => void,
handReduce?: (any) => void,
handAdd?: (any) => void,
}
const GoodsItem = memo((porps: PropGoods) => {
const { list = [], obj = {}, handTui, handCancel, onBlur, handReduce, handAdd, onInputEven } = porps
// const [value, setValue] = useState<any>({ count: 1 })
// const onInputEven = (e) => {
// let res = Number(e.detail.value)
// if (res < 1) {
// setValue({ count: 1 })
// } else {
// setValue({ count: res })
// }
// }
return (
<>
{
list.map((item, index) => {
return (
<View className={styles.goodsBox} key={index}>
<View className={styles.goodsProduct}>{item.product_code}# {item.product_name}</View>
<View className={styles.goodsLine}></View>
{
item.av_product_color.map((it, inx) => {
return (
<View className={styles.itemGoods} key={inx}>
<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}>{it.product_color_code} {it.product_color_name}</View>
</View>
<View className={styles.item_right_Bottom}>
<View className={styles.itemMoney}>x{obj?.sale_mode === 0 ? it.roll : it.length / 100}{obj?.sale_mode === 0 ? '条' : 'm'}</View>
{
!it.isTui && <View className={styles.btn} onClick={() => handTui?.(it)}>退货</View>
}
{
(it.sale_mode != 0 && it.isTui) && <View className={styles.btnOne} onClick={() => handCancel?.(it)}>已选择退货</View>
}
{
(it.sale_mode == 0 && it.isTui) && <View className={styles.inputBox} >
<View className={styles.redceBox} onClick={() => handReduce?.(it)}>
<View className={styles.reduce}></View>
</View>
<View className={styles.inputBig}>
<Input type={'number'} value={it.nums} onInput={(e) => onInputEven?.(e, it)} maxlength={it.roll} onBlur={(e) => onBlur?.(e, it)}></Input>
</View>
<View className={styles.addBox} onClick={() => handAdd?.(it)}>
+
</View>
</View>
}
</View>
</View>
</View>
)
})
}
</View>
)
})
}
</>
)
})