2022-12-05 16:30:09 +08:00

113 lines
3.6 KiB
TypeScript

import { ScrollView, Text, View } from '@tarojs/components'
import { memo, useCallback, useEffect, useRef, useState } from 'react'
import classnames from 'classnames'
import ReasonPopup from '../reasonPopup'
import styles from './index.module.scss'
import TextareaEnhance from '@/components/textareaEnhance'
import Popup from '@/components/popup'
import { ApplyRefundApi, RefundExplainApi } from '@/api/salesAfterOrder'
import { alert } from '@/common/common'
interface Param {
show?: true | false
onClose?: () => void
orderId?: number
onSuccess?: () => void
}
const ApplyRefund = ({ show, onClose, orderId, onSuccess }: Param) => {
// 提交的数据
const submitData = useRef({
return_explain: 0,
sale_order_id: 0,
reason_describe: '',
})
// 申请退款
const { fetchData } = ApplyRefundApi()
const getApplyRefund = async() => {
if (!submitData.current.return_explain) { return alert.error('请选择说明原因') }
const res = await fetchData(submitData.current)
if (res.success) {
alert.success('申请成功')
onSuccess?.()
}
else {
alert.error('申请失败')
}
onClose?.()
}
// 获取说明数据
const [list, setList] = useState<any[]>([])
const { fetchData: refundExplainFetchdata } = RefundExplainApi()
const refundExplain = async() => {
const res = await refundExplainFetchdata()
setList(() => res.data.list)
}
// 备注
const getOtherReason = useCallback((val) => {
submitData.current.reason_describe = val
}, [])
// 显示说明
const [showReason, setShowReason] = useState(false)
const closeReason = useCallback(() => {
setShowReason(false)
}, [])
const [reason, setReason] = useState({ id: 0, name: '' })
const reasonSelect = useCallback((e) => {
setReason({ ...reason, name: e.name, id: e.id })
submitData.current.return_explain = e.id
closeReason()
}, [])
// 提交
const onSubmit = (val) => {
if (val == 2) {
getApplyRefund()
}
else {
onClose?.()
submitData.current = {
return_explain: 0,
sale_order_id: 0,
reason_describe: '',
}
}
}
useEffect(() => {
if (show && orderId) {
submitData.current.sale_order_id = orderId
refundExplain()
}
}, [orderId, show])
return (
<>
<Popup show={show} title="申请退款" onClose={onClose}>
<View className={styles.apply_after_sales_con}>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退</View>
<View className={styles.select} onClick={() => setShowReason(true)}>
<Text className={reason.name ? styles.selected : ''}>{reason.name || '请选择'}</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<TextareaEnhance onChange={getOtherReason} title="备注" placeholder="请输入退款备注" />
<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>
</View>
</Popup>
<ReasonPopup defaultValue={reason.id} show={showReason} onClose={closeReason} list={list} title="退款说明" onSelect={reasonSelect} />
</>
)
}
export default memo(ApplyRefund)