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

(优化):

Browse Source
This commit is contained in:
cheng
2022-10-09 17:31:56 +08:00
parent 133e6414fa
commit af34945fda
13 changed files with 768 additions and 703 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/applyAfterSales/index.tsx
+251 -240
View File
@@ -1,260 +1,271 @@
import { Image, ScrollView, Text, View } from "@tarojs/components";
import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
import classnames from "classnames";
import styles from './index.module.scss'
import ReasonPopup from "./components/reasonPopup";
import Taro, { useDidShow, useRouter } from "@tarojs/taro";
import { GetSaleOrderDetailApi } from "@/api/order";
import KindList from "./components/kindList"
import CutKindList from "./components/cutkindList"
import { ReturnApplyOrderApi, ReturnExplainApi, ReturnGoodsStatusApi, ReturnReasonApi } from "@/api/salesAfterOrder";
import { alert, goLink } from "@/common/common";
import UploadImage from "@/components/uploadImage"
import TextareaEnhance from "@/components/textareaEnhance";
import useLogin from "@/use/useLogin";
import { throttle } from "@/common/util";
import { Image, ScrollView, Text, View } from '@tarojs/components'
import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import ReasonPopup from './components/reasonPopup'
import Taro, { useDidShow, useRouter } from '@tarojs/taro'
import { GetSaleOrderDetailApi } from '@/api/order'
import KindList from './components/kindList'
import CutKindList from './components/cutkindList'
import { ReturnApplyOrderApi, ReturnExplainApi, ReturnGoodsStatusApi, ReturnReasonApi } from '@/api/salesAfterOrder'
import { alert, goLink } from '@/common/common'
import UploadImage from '@/components/uploadImage'
import TextareaEnhance from '@/components/textareaEnhance'
import useLogin from '@/use/useLogin'
import { throttle } from '@/common/util'
enum returnStatus {
return_reason = 1, //原因
goods_status = 2, //状况
return_explain = 3, //说明
return_reason = 1, //原因
goods_status = 2, //状况
return_explain = 3, //说明
}
export default () => {
useLogin()
useDidShow(() => {
getSaleOrderPreView()
useLogin()
useDidShow(() => {
getSaleOrderPreView()
})
const router = useRouter()
const orderId = useRef<number>(Number(router.params.id))
//需要提交的数据
const [submitData, setSubmitData] = useState<any>({
fabric_piece_accessory_url: [],
goods_status: '', //货物状况
reason_describe: '', //其他说明
return_explain: '', //退货说明
return_reason: '', //退货原因
roll: 0,
roll_list: [],
sale_order_id: orderId.current,
})
//获取订单数据
const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
const { fetchData: getOrderFetchData } = GetSaleOrderDetailApi()
const getSaleOrderPreView = async () => {
if (orderId.current) {
let res = await getOrderFetchData({ id: orderId.current })
setOrderDetail(res.data)
}
}
//监听获取到的数据
useEffect(() => {
if (orderDetail) {
formatData()
}
}, [orderDetail])
//格式化数据格式
const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
const formatData = () => {
setFormatDetailOrder({
...orderDetail,
unit: orderDetail.sale_mode == 0 ? '条' : 'm', //单位
list: orderDetail.product_list,
})
}
const router = useRouter()
const orderId = useRef<number>(Number(router.params.id))
//需要提交的数据
const [submitData, setSubmitData] = useState<any>({
fabric_piece_accessory_url: [],
goods_status: '', //货物状况
reason_describe: '', //其他说明
return_explain: '', //退货说明
return_reason: '', //退货原因
roll: 0,
roll_list: [],
sale_order_id: orderId.current
})
//获取订单数据
const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
const getSaleOrderPreView = async () => {
if(orderId.current) {
let res = await getOrderFetchData({id: orderId.current})
setOrderDetail(res.data)
}
//数据总量
const dataCount = useMemo(() => {
if (formatDetailOrder) {
let total_number = formatDetailOrder.sale_mode == 0 ? formatDetailOrder.av_total_number + '条' : formatDetailOrder.av_total_number / 100 + '米'
return `${formatDetailOrder.av_total_fabrics}种面料，${formatDetailOrder.av_total_colors}种颜色，共${total_number}`
}
}, [formatDetailOrder])
//监听获取到的数据
useEffect(() => {
if(orderDetail) {
formatData()
}
}, [orderDetail])
//面料数据
let roll_list = useRef({})
//格式化数据格式
const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
const formatData = () => {
setFormatDetailOrder({
...orderDetail,
unit: orderDetail.sale_mode == 0?'条':'m', //单位
list: orderDetail.product_list,
})
//大货时获取计步器数据
const getNumChange = useCallback((val) => {
if (parseInt(val.number) > 0) {
roll_list.current[val.color_id] = { product_roll: val.number, sale_order_detail_id: val.sale_order_detail_id }
} else {
delete roll_list.current[val.color_id]
}
setSubmitData((e) => ({ ...e, roll_list: Object.values(roll_list.current) }))
}, [])
//数据总量
const dataCount = useMemo(() => {
if(formatDetailOrder) {
let total_number = formatDetailOrder.sale_mode == 0?formatDetailOrder.av_total_number + '条':(formatDetailOrder.av_total_number/100) + '米'
return `${formatDetailOrder.av_total_fabrics}种面料，${formatDetailOrder.av_total_colors}种颜色，共${total_number}`
}
}, [formatDetailOrder])
//面料数据
let roll_list = useRef({})
//大货时获取计步器数据
const getNumChange = useCallback((val) => {
if(parseInt(val.number) > 0) {
roll_list.current[val.color_id] = {product_roll: val.number, sale_order_detail_id: val.sale_order_detail_id}
} else {
delete roll_list.current[val.color_id]
}
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current)}))
}, [])
//散剪和剪板
const getSelectChange = useCallback((val) => {
if(val.status) {
roll_list.current[val.color_id] = {product_roll: val.length, sale_order_detail_id: val.sale_order_detail_id}
} else {
delete roll_list.current[val.color_id]
}
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current)}))
}, [])
//获取图片列表
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.none('请选择或输入退货颜色')
console.log('submitData::',submitData)
let res = await fetchDataReturnApply(submitData)
if(res.success) {
alert.success('申请成功')
goLink('/pages/salesAfter/salesAfterList/index',{}, 'reLaunch')
} else {
alert.error(res.msg)
}
//散剪和剪板
const getSelectChange = useCallback((val) => {
if (val.status) {
roll_list.current[val.sale_order_detail_id] = { product_roll: val.length, sale_order_detail_id: val.sale_order_detail_id }
} else {
delete roll_list.current[val.sale_order_detail_id]
}
setSubmitData((e) => ({ ...e, roll_list: Object.values(roll_list.current) }))
}, [])
//底部按钮
const onSubmit = throttle((val) => {
if(val == 2) {
if(submitData.goods_status === '') return alert.error('请选择货物状况')
if(submitData.return_explain === '') return alert.error('请选择退货原因')
if(!submitData.return_explain && !submitData.reason_describe) return alert.error('请填写其他说明')
onSubmitData()
} else {
Taro.navigateBack()
}
}, 600)
//获取图片列表
const getImageList = useCallback((list) => {
setSubmitData((e) => ({ ...e, fabric_piece_accessory_url: list }))
}, [])
//退货原因选择弹窗
const [showReason, setShowReason] = useState(false)
const closeReason = useCallback(() => setShowReason(false), [])
const onShowReason = () => {
setShowReason(true)
//其他说明
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.none('请选择或输入退货颜色')
console.log('submitData::', submitData)
let res = await fetchDataReturnApply(submitData)
if (res.success) {
alert.success('申请成功')
goLink('/pages/salesAfter/salesAfterList/index', {}, 'reLaunch')
} else {
alert.error(res.msg)
}
useEffect(() => {
getReturnReason()
}, [])
}
//请求获取到的数据
const [returnGoodsInfo, setReturnGoodsInfo] = useState([])
//底部按钮
const onSubmit = throttle((val) => {
if (val == 2) {
if (submitData.goods_status === '') return alert.error('请选择货物状况')
if (submitData.return_explain === '') return alert.error('请选择退货原因')
if (!submitData.return_explain && !submitData.reason_describe) return alert.error('请填写其他说明')
onSubmitData()
} else {
Taro.navigateBack()
}
}, 600)
//退货原因
const {fetchData: fetchDataReturnReason} = ReturnReasonApi()
const getReturnReason = async () => {
let res = await fetchDataReturnReason()
setReturnGoodsInfo((e) => (res.data?.list))
}
//售后退货说明
const {fetchData: fetchDataReturnExplain} = ReturnExplainApi()
const getReturnExplain = async (id) => {
let res = await fetchDataReturnExplain({return_reason: id})
setReturnGoodsInfo((e) => (res.data?.list))
}
//退货原因选择列表返回的数据
const [returnObj, setReturnObj] = useState<any>([])
const onReturnSelect = useCallback((val) => {
let res = val.data[val.data.length - 1]
if(val.index == 1) {
getReturnExplain(res.id)
setReturnGoodsInfo(() => [])
}
if(val.index == 2) setReturnObj(val.data)
}, [])
const onHeaderSelect = useCallback((val) => {
setReturnGoodsInfo((e) => [])
if(val.index == 1) getReturnReason()
}, [])
//退货原因选择弹窗
const [showReason, setShowReason] = useState(false)
const closeReason = useCallback(() => setShowReason(false), [])
const onShowReason = () => {
setShowReason(true)
}
useEffect(() => {
getReturnReason()
}, [])
//选择货物状况
const [showStatus, setShowStatus] = useState(false)
const [statusInfo, setStatusInfo] = useState<any>()
const [statusGoodsInfo, setStatusGoodsInfo] = useState([])
const {fetchData: fetchDataGoodsStatus} = ReturnGoodsStatusApi()
const getReturnGoodsStatus = async () => {
let res = await fetchDataGoodsStatus()
setStatusGoodsInfo((e) => (res.data?.list))
}
const onShowStatus = () => {
setShowStatus(() => true)
getReturnGoodsStatus()
}
const closeStatus = useCallback(() => {
setShowStatus(() => false)
}, [])
const onStatusSelect = useCallback((val) => {
let res = val.data[val.data.length - 1]
setStatusInfo(res)
}, [])
useEffect(() => {
if(returnObj.length > 0) {
submitData.return_reason = returnObj[0].id
submitData.return_explain = returnObj[1].id
}
if(statusInfo) {
submitData.goods_status = statusInfo.id
}
setSubmitData(() => ({...submitData}))
}, [returnObj, statusInfo])
//请求获取到的数据
const [returnGoodsInfo, setReturnGoodsInfo] = useState([])
return (
<View className={styles.apply_after_sales_main}>
<View className={styles.apply_after_sales_con}>
<View className={styles.kind_number}><Text>{dataCount}</Text></View>
<ScrollView scrollY className={styles.scroll}>
<View className={styles.scroll_con}>
{(orderDetail?.sale_mode == 0)&&<KindList order={formatDetailOrder} onNumChange={getNumChange} />||
<CutKindList order={formatDetailOrder} onSelectChange={getSelectChange}/>}
<View className={styles.returnSaleInput}>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退货原因</View>
<View className={styles.select} onClick={onShowReason}>
<Text className={returnObj?.length > 0&&styles.selected}>{returnObj?.length > 0?(returnObj[0]?.name + '/' +returnObj[1]?.name):'请选择'}</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>货物状况</View>
<View className={styles.select} onClick={onShowStatus}>
<Text className={statusInfo?.name&&styles.selected}>{statusInfo?.name||'请选择'}</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>拍照上传</View>
<View className={styles.upload_image}>
<UploadImage onChange={getImageList}/>
</View>
</View>
<TextareaEnhance onChange={getOtherReason} title='其他说明'/>
</View>
</View>
</ScrollView>
<View className="common_safe_area_y"></View>
</View>
<View className={styles.btns_con}>
<View className={styles.btns_two}>
<View className={styles.rest_btn} onClick={() => onSubmit(1)}>取消</View>
<View className={styles.verify_btn } onClick={() => onSubmit(2)}>确认</View>
</View >
</View >
<ReasonPopup show={showReason} onClose={closeReason} title='退货原因' list={returnGoodsInfo} onHeaderSelect={onHeaderSelect} onSelect={onReturnSelect} dataLength={2}/>
<ReasonPopup show={showStatus} onClose={closeStatus} title='货物状况' list={statusGoodsInfo} onSelect={onStatusSelect} dataLength={1}/>
//退货原因
const { fetchData: fetchDataReturnReason } = ReturnReasonApi()
const getReturnReason = async () => {
let res = await fetchDataReturnReason()
setReturnGoodsInfo((e) => res.data?.list)
}
//售后退货说明
const { fetchData: fetchDataReturnExplain } = ReturnExplainApi()
const getReturnExplain = async (id) => {
let res = await fetchDataReturnExplain({ return_reason: id })
setReturnGoodsInfo((e) => res.data?.list)
}
//退货原因选择列表返回的数据
const [returnObj, setReturnObj] = useState<any>([])
const onReturnSelect = useCallback((val) => {
let res = val.data[val.data.length - 1]
if (val.index == 1) {
getReturnExplain(res.id)
setReturnGoodsInfo(() => [])
}
if (val.index == 2) setReturnObj(val.data)
}, [])
const onHeaderSelect = useCallback((val) => {
setReturnGoodsInfo((e) => [])
if (val.index == 1) getReturnReason()
}, [])
//选择货物状况
const [showStatus, setShowStatus] = useState(false)
const [statusInfo, setStatusInfo] = useState<any>()
const [statusGoodsInfo, setStatusGoodsInfo] = useState([])
const { fetchData: fetchDataGoodsStatus } = ReturnGoodsStatusApi()
const getReturnGoodsStatus = async () => {
let res = await fetchDataGoodsStatus()
setStatusGoodsInfo((e) => res.data?.list)
}
const onShowStatus = () => {
setShowStatus(() => true)
getReturnGoodsStatus()
}
const closeStatus = useCallback(() => {
setShowStatus(() => false)
}, [])
const onStatusSelect = useCallback((val) => {
let res = val.data[val.data.length - 1]
setStatusInfo(res)
}, [])
useEffect(() => {
if (returnObj.length > 0) {
submitData.return_reason = returnObj[0].id
submitData.return_explain = returnObj[1].id
}
if (statusInfo) {
submitData.goods_status = statusInfo.id
}
setSubmitData(() => ({ ...submitData }))
}, [returnObj, statusInfo])
return (
<View className={styles.apply_after_sales_main}>
<View className={styles.apply_after_sales_con}>
<View className={styles.kind_number}>
<Text>{dataCount}</Text>
</View>
)
}
<ScrollView scrollY className={styles.scroll}>
<View className={styles.scroll_con}>
{(orderDetail?.sale_mode == 0 && <KindList order={formatDetailOrder} onNumChange={getNumChange} />) || (
<CutKindList order={formatDetailOrder} onSelectChange={getSelectChange} />
)}
<View className={styles.returnSaleInput}>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退货原因</View>
<View className={styles.select} onClick={onShowReason}>
<Text className={returnObj?.length > 0 && styles.selected}>
{returnObj?.length > 0 ? returnObj[0]?.name + '/' + returnObj[1]?.name : '请选择'}
</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>货物状况</View>
<View className={styles.select} onClick={onShowStatus}>
<Text className={statusInfo?.name && styles.selected}>{statusInfo?.name || '请选择'}</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>拍照上传</View>
<View className={styles.upload_image}>
<UploadImage onChange={getImageList} />
</View>
</View>
<TextareaEnhance onChange={getOtherReason} title='其他说明' />
</View>
</View>
</ScrollView>
<View className='common_safe_area_y'></View>
</View>
<View className={styles.btns_con}>
<View className={styles.btns_two}>
<View className={styles.rest_btn} onClick={() => onSubmit(1)}>
取消
</View>
<View className={styles.verify_btn} onClick={() => onSubmit(2)}>
确认
</View>
</View>
</View>
<ReasonPopup
show={showReason}
onClose={closeReason}
title='退货原因'
list={returnGoodsInfo}
onHeaderSelect={onHeaderSelect}
onSelect={onReturnSelect}
dataLength={2}
/>
<ReasonPopup show={showStatus} onClose={closeStatus} title='货物状况' list={statusGoodsInfo} onSelect={onStatusSelect} dataLength={1} />
</View>
)
}
src/pages/collection/components/createPopup/index.tsx
+66 -57
View File
@@ -1,66 +1,75 @@
import Popup from "@/components/popup";
import { Input, ScrollView, Text, View } from "@tarojs/components";
import { memo, useCallback, useEffect, useMemo, useRef } from "react";
import classnames from "classnames";
import styles from './index.module.scss'
import TextareaEnhance from "@/components/textareaEnhance";
import { CreateFavoriteApi } from "@/api/favorite";
import { alert } from "@/common/common";
import Popup from '@/components/popup'
import { Input, ScrollView, Text, View } from '@tarojs/components'
import { memo, useCallback, useEffect, useMemo, useRef } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import TextareaEnhance from '@/components/textareaEnhance'
import { CreateFavoriteApi } from '@/api/favorite'
import { alert } from '@/common/common'
//原因选择
type ReasonInfoParam = {
show?: boolean, //显示
onClose?: () => void, //关闭
onSuccess?: (val:any) => void, //成功
defaultValue?: {
remark: string,
name: string
}, //默认数据
show?: boolean //显示
onClose?: () => void //关闭
onSuccess?: (val: any) => void //成功
defaultValue?: {
remark: string
name: string
} //默认数据
}
export default memo(({show = false, onClose, onSuccess, defaultValue}: ReasonInfoParam) => {
const submitData = useRef({
"name": '',
"remark": ''
})
export default memo(({ show = false, onClose, onSuccess, defaultValue }: ReasonInfoParam) => {
const submitData = useRef({
name: '',
remark: '',
})
const getOtherReason = (val) => {
submitData.current.remark = val
}
const getOtherReason = (val) => {
submitData.current.remark = val
}
const changeInput = (val) => {
submitData.current.name = val.detail.value
}
const changeInput = (val) => {
submitData.current.name = val.detail.value
}
const onSubmit = () => {
onSuccess?.(submitData.current)
}
const onSubmit = () => {
onSuccess?.(submitData.current)
}
useEffect(() => {
submitData.current = {name: defaultValue?.name!, remark: defaultValue?.remark!}
}, [defaultValue])
return (
<Popup show={show} title="新建收藏夹" onClose={onClose} >
<View className={styles.collection_con}>
<View className={styles.title_item}>
<View className={styles.title}>名称</View>
<View className={styles.select}>
<Input placeholder="请输入文件夹名称" className={styles.input} cursorSpacing={150} onInput={changeInput} value={defaultValue?.name} />
</View>
</View>
<View className={styles.desc_item}>
<View className={styles.title}>简介</View>
<View className={styles.desc}>
<TextareaEnhance defaultValue={defaultValue?.remark} onChange={getOtherReason} placeholder="请输入简介" />
</View>
</View>
<View className={styles.btns_con}>
<View className={styles.btns_two}>
<View className={styles.verify_btn } onClick={() => onSubmit()}>确认</View>
</View >
</View>
useEffect(() => {
submitData.current = { name: defaultValue?.name!, remark: defaultValue?.remark! }
}, [defaultValue])
return (
<Popup show={show} title='新建收藏夹' onClose={onClose}>
<View className={styles.collection_con}>
<View className={styles.title_item}>
<View className={styles.title}>名称</View>
<View className={styles.select}>
<Input
placeholder='请输入文件夹名称'
className={styles.input}
alwaysEmbed={true}
// adjustPosition={true}
cursorSpacing={100}
onInput={changeInput}
value={defaultValue?.name}
/>
</View>
</View>
<View className={styles.desc_item}>
<View className={styles.title}>简介</View>
<View className={styles.desc}>
<TextareaEnhance defaultValue={defaultValue?.remark} onChange={getOtherReason} placeholder='请输入简介' />
</View>
</View>
<View className={styles.btns_con}>
<View className={styles.btns_two}>
<View className={styles.verify_btn} onClick={() => onSubmit()}>
确认
</View>
</Popup>
)
})
</View>
</View>
</View>
</Popup>
)
})
src/pages/depositList/index.scss
+24 -20
View File
@@ -1,49 +1,53 @@
.credit-used{
.credit-used {
height: 100vh;
background-color: #f3f3f3;
.credit-used-list{
.credit-used-list {
background-color: white;
padding: 30px 25px;
border-bottom: 1px solid #f6f6f6;
display: flex;justify-content: space-between;
display: flex;
justify-content: space-between;
}
.credit-used-list-left{
.credit-used-list-left {
}
.credit-used-list-type{
.credit-used-list-type {
font-size: 26px;
font-weight: 400;
color: #000000;
margin-bottom: 20px;
}
.credit-used-list-price{
.credit-used-list-price {
font-size: 28px;
font-weight: 400;
}
.credit-used-list-right{
display: flex;align-items: center;
.credit-used-list-right {
display: flex;
align-items: center;
}
.credit-used-list-right-price view{
display: flex;align-items: center;
.credit-used-list-right-price view {
display: flex;
align-items: center;
justify-content: flex-end;
}
.credit-used-list-right text{
.credit-used-list-right text {
font-size: 30px;
margin-left: 10px;
}
.credit-used-list-date{
.credit-used-list-date {
font-size: 24px;
font-weight: 400;
color: #ababab;
}
.credit-used-list-orderno{
font-size: 20px;
.credit-used-list-orderno {
font-size: 25px;
font-weight: 400;
margin-top: 20px;
margin-top: 16px;
color: #ababab;
}
.green{
color: #07C160;
.green {
color: #07c160;
}
.red{
color: #FF0000;
.red {
color: #ff0000;
}
}
}
src/pages/depositList/index.tsx
+2 -3
View File
@@ -38,12 +38,11 @@ export default () => {
</View>
<View className='credit-used-list-right'>
<View className='credit-used-list-right-price'>
<View
className={`credit-used-list-price ${[1, 2, 3].includes(res.type as never) ? 'red' : 'green'}`}>
<View className={`credit-used-list-price ${[1, 2, 3].includes(res.type as never) ? 'red' : 'green'}`}>
{[1, 2, 3].includes(res.type as never) ? '+' : '-'}
{formatPriceDiv(res.amount_received_this_time)}
</View>
{/* <View className="credit-used-list-orderno">处理中</View> */}
<View className='credit-used-list-orderno'>余额：{formatPriceDiv(res.wallet_balance)}</View>
</View>
<Text className='iconfont icon-a-moreback'></Text>
</View>
src/pages/details/components/orderCount/index.tsx
+73 -56
View File
@@ -6,7 +6,7 @@ import Counter from '../counter'
import Big from 'big.js'
import classnames from 'classnames'
import styles from './index.module.scss'
import { memo, useCallback, useEffect, useRef, useState, useTransition } from 'react'
import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { useSelector } from '@/reducers/hooks'
import { GetColorList } from '@/api/materialColor'
import { AddShoppingCartApi } from '@/api/shopCart'
@@ -18,7 +18,6 @@ import LabAndImg from '@/components/LabAndImg'
import VirtualList from '@tarojs/components/virtual-list'
import useCommonData from '@/use/useCommonData'
import LabAndImgShow from '@/components/LabAndImgShow'
import InfiniteScroll from '@/components/infiniteScroll'
type param = {
show?: true | false
@@ -27,8 +26,6 @@ type param = {
productId?: number
}
export default memo(({ show = false, onClose, title = '', productId = 0 }: param) => {
const [isPending, startTransition] = useTransition()
const { adminUserInfo } = useSelector((state) => state.userInfo)
const [selectList, _] = useState([
@@ -44,15 +41,11 @@ export default memo(({ show = false, onClose, title = '', productId = 0 }: param
//重置数据
useEffect(() => {
const newList = initList(list)
startTransition(() => {
setList([...newList])
})
setList([...newList])
condition.current.code_or_name = null
setSearchShow(false)
}, [selectIndex])
useEffect(() => console.log('isPending::', isPending), [isPending])
//获取面料颜色列表
const { fetchData: colorFetchData, state: colorState } = GetColorList()
const [list, setList] = useState<any[]>([])
@@ -77,16 +70,14 @@ export default memo(({ show = false, onClose, title = '', productId = 0 }: param
}, [show])
//初始化列表数据
const initList = (list) => {
const initList = useCallback((list) => {
const newList = list.map((item) => {
item.count = 0
item.show = false
item.unit = selectList[selectIndex].unit
item.formatePrice = Number(formatPriceDiv(item[selectList[selectIndex].priceField]))
return item
})
return newList
}
}, [])
//卸载数据
useEffect(() => {
@@ -199,6 +190,21 @@ export default memo(({ show = false, onClose, title = '', productId = 0 }: param
setSearchShow(false)
}
//格式化金额
const formatPrice = useCallback(
(item) => {
const price = Number(formatPriceDiv(item[selectList[selectIndex].priceField]))
return (
<View className={styles.priceText}>
<Text>¥</Text>
{price}
<Text> /{selectList[selectIndex].eunit}</Text>
</View>
)
},
[selectIndex],
)
//显示图片弹窗
const [showLabImage, setShowLabImage] = useState(false)
const [labImageValue, setLabImageValue] = useState()
@@ -210,6 +216,47 @@ export default memo(({ show = false, onClose, title = '', productId = 0 }: param
setShowLabImage(() => false)
}, [])
//虚拟滚动
const Rows = memo(({ id, index, style, data }: any) => {
let item = data[index]
return (
<>
{(item && (
<View className={styles.item} key={item.id}>
<View className={styles.item_color}>
<LabAndImg value={{ lab: item.lab, rgb: item.rgb, texture_url: item.texture_url, title: item.code }} showStatus={false} onClick={getLabAndImg} />
</View>
<View className={styles.item_con}>
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
<View className={styles.num}>{formatPrice(item)}</View>
</View>
<View className={styles.btn_con}>
{(!item.show && (
<View className={styles.btn} onClick={() => onAdd(item)}>
添加
</View>
)) || (
<View className={styles.btn_count}>
<Counter
otherData={item}
onBlue={getInputValue}
defaultNum={item.count}
step={selectList[selectIndex].step}
digits={selectList[selectIndex].digits}
onClickBtn={getInputValue}
unit={selectList[selectIndex].unit}
minNum={selectList[selectIndex].minNum}
maxNum={selectList[selectIndex].maxNum}
/>
</View>
)}
</View>
</View>
)) || <View className={styles.item}></View>}
</>
)
})
return (
<View className={styles.shop_cart_main}>
<Popup showTitle={false} show={showPopup} onClose={() => closePopup()}>
@@ -248,49 +295,19 @@ export default memo(({ show = false, onClose, title = '', productId = 0 }: param
<View className={styles.product_color_con}>
{list.length <= 0 && colorState.loading && <LoadingCard />}
{list.length > 0 && !colorState.loading && (
<InfiniteScroll moreStatus={false}>
<View className={styles.color_con}>
{list.map((item) => {
return (
<View className={styles.item} key={item.id}>
<View className={styles.item_color}>
<LabAndImg value={{ lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }} />
</View>
<View className={styles.item_con}>
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
<View className={styles.num}>
<View className={styles.priceText}>
<Text>¥</Text>
{item.formatePrice}
<Text>/{item.unit}</Text>
</View>
</View>
</View>
<View className={styles.btn_con}>
{(!item.show && (
<View className={styles.btn} onClick={() => onAdd(item)}>
添加
</View>
)) || (
<View className={styles.btn_count}>
<Counter
onBlue={(e) => getInputValue(e, item)}
defaultNum={item.count}
step={selectList[selectIndex].step}
digits={selectList[selectIndex].digits}
onClickBtn={(e) => getInputValue(e, item)}
unit={selectList[selectIndex].unit}
minNum={selectList[selectIndex].minNum}
maxNum={selectList[selectIndex].maxNum}
/>
</View>
)}
</View>
</View>
)
})}
</View>
</InfiniteScroll>
<View className={styles.color_con}>
<VirtualList
className={styles.virtual_list}
height={400} /* 列表的高度 */
width='100%' /* 列表的宽度 */
itemData={list} /* 渲染列表的数据 */
itemCount={list.length + 1} /* 渲染列表的长度 */
itemSize={100} /* 列表单项的高度 */
overscanCount={1}>
{Rows}
</VirtualList>
<View className='common_safe_area_y'></View>
</View>
)}
{list.length <= 0 && !colorState.loading && <View className={styles.noData}>暂无此商品</View>}
</View>
src/pages/order/components/addressInfoDetail/index.tsx
+19 -6
View File
@@ -150,15 +150,24 @@ export default memo(
//根据订单状态判断是否可修改
const limitEdit = () => {
let res = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value].includes(
orderInfo?.status as number,
)
let res = [
SaleorderstatusWaitingPrePayment.value,
SaleOrderStatusBooking.value,
SaleOrderStatusArranging.value,
SaleOrderStatusArranged.value,
SaleOrderStatusWaitingPayment.value,
].includes(orderInfo?.status as number)
if (!res && status != 1) alert.none('该订单状态不能修改地址！')
return status == 1 ? true : res
}
//根据订单状态判断是否显示物流
const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value]
const logisticsShowList = [
SaleOrderStatusWaitingReceipt.value,
SaleOrderStatusAlreadyReceipt.value,
SaleOrderStatusComplete.value,
SaleOrderStatusRefund.value,
]
const logisticsShow = useMemo(() => {
return logisticsShowList.includes(orderInfo?.status as number)
}, [orderInfo])
@@ -189,10 +198,14 @@ export default memo(
{(!logisticsShow && (
<View className={styles.updateBtn}>
<View className={styles.updateBtn_list}>
<View className={classnames(styles.updateBtn_item, receivingStatus == 1 && styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1, e)}>
<View
className={classnames(styles.updateBtn_item, receivingStatus == 1 && styles.updateBtn_item_select)}
onClick={(e) => onReceivingStatus(1, e)}>
自提
</View>
<View className={classnames(styles.updateBtn_item, receivingStatus == 2 && styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2, e)}>
<View
className={classnames(styles.updateBtn_item, receivingStatus == 2 && styles.updateBtn_item_select)}
onClick={(e) => onReceivingStatus(2, e)}>
物流
</View>
</View>
src/pages/order/components/advanceOrderState/index.tsx
+58 -61
View File
@@ -1,74 +1,71 @@
import { formatImgUrl } from "@/common/fotmat";
import { Image, Text, View } from "@tarojs/components";
import { memo, useEffect, useMemo, useRef, useState } from "react";
import classnames from "classnames";
import styles from './index.module.scss'
import dayjs from "dayjs";
import { useTimeCountDown } from "@/use/useCommon";
import { ORDER_STATUS, PAYMENT_METHOD } from "@/common/enum";
import { formatImgUrl } from '@/common/fotmat'
import { Image, Text, View } from '@tarojs/components'
import { memo, useEffect, useMemo, useRef, useState } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'
import dayjs from 'dayjs'
import { useTimeCountDown } from '@/use/useCommon'
import { ORDER_STATUS, PAYMENT_METHOD } from '@/common/enum'
type List = {
status: string,
time: string,
tag: string,
desc: string,
expire_time: string
status: string
time: string
tag: string
desc: string
expire_time: string
}
type Param = {
onRefresh?: () => void,
orderInfo?: {
logistics_details:List[], //订单状态列表
payment_method: number, //支付方式
status: number, //订单状态
}
onRefresh?: () => void
orderInfo?: {
logistics_details: List[] //订单状态列表
payment_method: number //支付方式
status: number //订单状态
}
}
export default memo(({ orderInfo, onRefresh }: Param) => {
const { showTime, onStart, timeStatus } = useTimeCountDown()
export default memo(({orderInfo, onRefresh}:Param) => {
//订单状态枚举
const { SaleorderstatusWaitingPrePayment } = ORDER_STATUS
const {showTime, onStart, timeStatus} = useTimeCountDown()
//获取预付款最后时间
const endTime = useMemo(() => {
if (orderInfo?.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
return orderInfo.logistics_details[0].expire_time
}
return ''
}, [orderInfo])
//订单状态枚举
const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
useEffect(() => {
if (endTime) onStart(endTime)
}, [endTime])
//获取预付款最后时间
const endTime = useMemo(() => {
if(orderInfo?.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
return orderInfo.logistics_details[0].expire_time
}
return ''
}, [orderInfo])
useEffect(() => {
if (timeStatus == 2) onRefresh?.()
}, [timeStatus])
useEffect(() => {
if(endTime) onStart(endTime)
}, [endTime])
useEffect(() => {
if(timeStatus == 2) onRefresh?.()
}, [timeStatus])
return (
<View className={styles.advance_main}>
<View className={styles.time_con}>
<View className={styles.times}>
<Text className={styles.text}>剩</Text>
<Text className={styles.num}>{showTime.HH}</Text>
<Text className={styles.separate}>:</Text>
<Text className={styles.num}>{showTime.MM}</Text>
<Text className={styles.separate}>:</Text>
<Text className={styles.num}>{showTime.SS}</Text>
</View>
<Text>支付关闭，订单自动取消</Text>
</View>
<View className={styles.cardIcon}>
<Image className={styles.image} src={formatImgUrl("/mall/my_cart.png")}/>
</View>
<View className={styles.refresh} onClick={() => onRefresh?.()}>
<Text className={classnames(styles.mconfont, 'iconfont icon-shuaxin')}></Text>
<Text className={classnames(styles.refresh_text)}>刷新</Text>
</View>
return (
<View className={styles.advance_main}>
<View className={styles.time_con}>
<View className={styles.times}>
<Text className={styles.text}>剩</Text>
<Text className={styles.num}>{showTime.HH}</Text>
<Text className={styles.separate}>:</Text>
<Text className={styles.num}>{showTime.MM}</Text>
<Text className={styles.separate}>:</Text>
<Text className={styles.num}>{showTime.SS}</Text>
</View>
)
})
<Text>支付关闭，订单自动取消</Text>
</View>
<View className={styles.cardIcon}>
<Image className={styles.image} src={formatImgUrl('/mall/my_cart.png')} />
</View>
<View className={styles.refresh} onClick={() => onRefresh?.()}>
<Text className={classnames(styles.mconfont, 'iconfont icon-shuaxin')}></Text>
<Text className={classnames(styles.refresh_text)}>刷新</Text>
</View>
</View>
)
})
src/pages/order/orderList/index.tsx
+1 -2
View File
@@ -1,7 +1,7 @@
import Search from '@/components/search'
import useLogin from '@/use/useLogin'
import { View } from '@tarojs/components'
import Taro, { useDidShow } from '@tarojs/taro'
import Taro, { useDidShow, useRouter } from '@tarojs/taro'
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import styles from './index.module.scss'
import Order from './components/order'
@@ -12,7 +12,6 @@ import OrderStatusList from './components/orderStatusList'
import { AddShoppingCartApi } from '@/api/shopCart'
import ShopCart from '@/components/shopCart'
import { alert } from '@/common/common'
import { useRouter } from '@tarojs/runtime'
import Payment from '../components/payment'
import ApplyRefund from '../components/applyRefund'
import ReturnRecord from '../components/returnRecord'