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

电子商城测试版v4

Browse Source
This commit is contained in:
cheng
2022-07-06 20:29:48 +08:00
parent bbc485ee3f
commit f05389ced7
48 changed files with 358 additions and 545 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/afterOrderBtns/index.tsx
+22 -11
View File
@@ -1,12 +1,13 @@
import { CancelOrderApi, ReceiveOrderApi } from "@/api/order"
import { alert } from "@/common/common"
import { AFTER_ORDER_STATUS, ORDER_STATUS, SALE_MODE } from "@/common/enum"
import { AFTER_ORDER_STATUS, ORDER_STATUS, REFUND_STATUS_ORDER, SALE_MODE } from "@/common/enum"
import {Text, View } from "@tarojs/components"
import Taro from "@tarojs/taro"
import {useRef, memo, useState, useMemo } from "react"
import classnames from "classnames";
import styles from './index.module.scss'
import { ReturnApplyOrderCancelApi } from "@/api/salesAfterOrder"
import { throttle } from "@/common/util"
type Param = {
orderInfo: {
@@ -31,6 +32,12 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
ReturnStageServiceOrderPendingRefund,
} = AFTER_ORDER_STATUS
const {
ReturnApplyOrderTypeAdvanceReceiptRefund, // 预收退款
ReturnApplyOrderTypeReturnForRefund, // 退货退款
ReturnApplyOrderTypeSalesRefund // 销售退款
} = REFUND_STATUS_ORDER
//订单类型
// const {
// SaLeModeBulk,
@@ -50,7 +57,7 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
{
id: 1,
big_value: [ReturnStageApplying.value, ReturnStageWaitCheck.value],
cut_value: [],
cut_value: [ReturnStageApplying.value, ReturnStageWaitCheck.value, ],
model_value: [],
label: '取消退货'
},
@@ -77,13 +84,17 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
let key = ['big_value', 'model_value', 'cut_value']
if(item.id == 1) {
//取消退货
return (orderInfo.type == 1)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
return (orderInfo.type == ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
} else if (item.id == 6) {
//取消退款
return (orderInfo.type == 2)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
if(orderInfo?.sale_mode == 0) {
return (orderInfo.type != ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
} else {
return item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
}
} else if (item.id == 4) {
//质检结果
return (orderInfo?.type == 1)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage) //退货才有
return (orderInfo?.type == ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage) //退货才有
} else {
return item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
}
@@ -99,19 +110,19 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
//点击按钮操作
const submitBtns = (val, index) => {
const submitBtns = throttle((val, index) => {
if (val == 1) {
cancelOrder({title:'要取消退货吗？'})
cancelOrder({title:'要取消退货吗？', val})
} else if (val == 6) {
cancelOrder({title:'要取消退款吗？'})
cancelOrder({title:'要取消退款吗？', val})
} else {
onClick?.(val)
}
}
}, 600)
//取消退货/退款
const {fetchData: returnApplyOrderCancelFetchData} = ReturnApplyOrderCancelApi()
const cancelOrder = ({title = ''}) => {
const cancelOrder = ({title = '', val}) => {
Taro.showModal({
title,
success: async function (res) {
@@ -119,7 +130,7 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
let res = await returnApplyOrderCancelFetchData({id: orderInfo?.return_apply_order_id})
if(res.success) {
alert.success('取消成功')
onClick?.(1)
onClick?.(val)
} else {
alert.none(res.msg)
}
src/components/orderBtns/index.tsx
+18 -4
View File
@@ -9,6 +9,7 @@ import styles from './index.module.scss'
import { AddShoppingCartApi } from "@/api/shopCart"
import { ApplyRefundApi } from "@/api/salesAfterOrder"
import { UseSubscriptionMessage } from "@/use/useCommonData"
import { throttle } from "@/common/util"
type Param = {
orderInfo: {
@@ -132,7 +133,7 @@ export default memo(({orderInfo, onClick}:Param) => {
const {openSubscriptionMessage} = UseSubscriptionMessage()
//点击按钮操作
const submitBtns = async (val, index) => {
const submitBtns = throttle(async (val, index) => {
if (val == 1) {
cancelOrder()
} else if (val == 6) {
@@ -142,14 +143,27 @@ export default memo(({orderInfo, onClick}:Param) => {
await openSubscriptionMessage({orderId: orderInfo?.orderId, scenes: ApplyGoods.value})
goLink('/pages/applyAfterSales/index',{id:orderInfo?.orderId})
} else if (val == 3) {
await openSubscriptionMessage({orderId: orderInfo?.orderId, scenes: ApplyGoods.value})
onClick?.(val)
bigApplyRefurn()
} else if(val == 8) {
applyRefund()
} else {
onClick?.(val)
}
}, 600)
//大货申请退款
const bigApplyRefurn = () => {
Taro.showModal({
title: '要申请退款吗？',
success: async function (res) {
if(res.confirm) {
await openSubscriptionMessage({orderId: orderInfo?.orderId, scenes: ApplyGoods.value})
onClick?.(3)
} else {
console.log('用户点击取消')
}
}
})
}
//取消订单
src/components/shopCart/index copy.tsx
-352
View File
@@ -1,352 +0,0 @@
import {Image, ScrollView, View } from "@tarojs/components"
import Popup from "@/components/popup"
import classnames from "classnames";
import MCheckbox from "@/components/checkbox";
import LoadingCard from "@/components/loadingCard";
import InfiniteScroll from "@/components/infiniteScroll";
import styles from "./index.module.scss"
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import Taro from "@tarojs/taro";
import { alert, goLink } from "@/common/common";
import {GetShoppingCartApi, DelShoppingCartApi, UpdateShoppingCartApi} from "@/api/shopCart"
import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
import { setParam } from "@/common/system";
import { debounce } from "@/common/util";
import Counter from "../counter";
import { ApplyOrderAccessApi, GetAdminUserInfoApi, SubscriptionMessageApi } from "@/api/user";
type param = {
show?: true|false,
onClose?: () => void
}
export default ({show = false, onClose}: param) => {
const selectList = [
{value:0, title:'大货', unit:'条', eunit:'kg', step:1, digits:0, minNum:1, maxNum:100000, defaultNum:1},
{value:1,title:'剪板', unit:'米', eunit:'m', step:1, digits:2, minNum:0.5, maxNum:9.99, defaultNum:1},
{value:2,title:'散剪', unit:'米', eunit:'kg', step:1, digits:2, minNum:5, maxNum:100000, defaultNum:10},
]
const [selectIndex, setSelectIndex] = useState(0)
const selectProduct = (index:number) => {
setSelectIndex(index)
}
useEffect(() => {
resetList()
setSelectStatus(true)
}, [selectIndex])
//重置勾选数据
const resetList = () => {
list?.map(item => {
if(selectIndex == item.sale_mode || selectIndex == -1) {
item.select = true
} else {
item.select = false
}
})
setList([...list])
}
//获取数据
const [list, setList] = useState<any[]>([])
const [loading, setLoading] = useState(false)
const {fetchData} = GetShoppingCartApi()
const getShoppingCart = async () => {
const {data} = await fetchData()
let color_list = data.color_list||[]
initList(color_list)
setLoading(false)
}
//初始化勾选数据
const [selectData, setSelectData] = useState<{id: number, checked: true|false}[]>([])
const initSelectData = (data:{id:number}[] = []) => {
let res = data?.map(item => {
return {id: item.id, checked: true}
})
setSelectData(() => res)
}
//初始化全部数据
const initList = (color_list) => {
color_list?.map(item => {
if(selectIndex == item.sale_mode) item.select = true
item.count = formatCount(item)
})
setList(color_list)
}
//显示是展示数据
useEffect(() => {
if(!show) {
setList([])
setSelectIndex(0)
} else {
setLoading(true)
getShoppingCart()
}
}, [show])
useEffect(() => {
return () => {
setList([])
}
}, [])
const [showPopup, setShowPopup] = useState(false)
useEffect(() => {
setShowPopup(show)
}, [show])
//全选反选
const [selectStatus, setSelectStatus] = useState(false)
const selectAll = () => {
list.map(item => {
if(selectIndex == item.sale_mode || selectIndex == -1)
item.select = !selectStatus
})
setSelectStatus(!selectStatus)
setList([...list])
}
//checkbox选中回调
const selectCallBack = (item) => {
item.select = true
checkSelect()
setList([...list])
}
//checkbox选中判断是否全部选中，全部选中后是全选，否则反选
const checkSelect = () => {
let list_count = 0
let select_count = 0
list?.map(item => {
if(selectIndex == -1 || selectIndex == item.sale_mode) {
list_count ++
if(item.select) select_count++
}
})
setSelectStatus(select_count == list_count)
}
//checkbox关闭回调
const colseCallBack = (item) => {
item.select = false
checkSelect()
setList([...list])
}
//popup关闭
const closePopup = () => {
onClose?.()
setShowPopup(false)
}
//删除购物车内容
const {fetchData:delShopFetchData} = DelShoppingCartApi()
const delSelect = () => {
getSelectId()
if(selectIds.current.length <= 0) return alert.none('请选择要删除的面料!')
Taro.showModal({
content: '删除所选商品？',
success: async function (res) {
if (res.confirm) {
const res = await delShopFetchData({id:selectIds.current})
if(res.success) {
getShoppingCart()
Taro.showToast({
title: '成功',
icon: 'success',
})
} else {
Taro.showToast({
title: res.msg,
icon: 'none',
})
}
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}
//获取面料选中的id
const selectIds = useRef<number[]>([])
const getSelectId = () => {
selectIds.current = []
list?.map(item => {
if(selectIndex == -1 || selectIndex == item.sale_mode) {
item.select&&selectIds.current.push(item.id)
}
})
}
//格式化金额
const formatPirce = useCallback((price) => {
return Number(formatPriceDiv(price))
}, [])
//格式化数量
const formatCount = useCallback((item) => {
console.log('item:::',item)
return item.sale_mode == 0? item.roll : (item.length/100)
}, [])
//格式化单位
const formatUnit = useCallback((item) => {
return item.sale_mode == 0? '条':'米'
}, [])
//预估金额和总条数
const estimatePrice = useMemo(() => {
let estimate_amount = 0
let product_list = new Set() //面料
let color_count = 0 //颜色数量
let all_count = 0 //总数量
list.map(item => {
if(item.select) {
estimate_amount += item.estimate_amount
product_list.add(item.product_id)
color_count++
all_count += item.sale_mode == 0?item.roll: (item.length)
}
})
let all_count_text = selectIndex == 0?all_count + '条': (all_count/100) + '米'
return {price: Number(formatPriceDiv(estimate_amount)).toFixed(2), countText: `已选${product_list.size}种面料，${color_count}个颜色，共${all_count_text}`, color_count}
},[list])
//去结算
const {fetchData: useFetchData} = GetAdminUserInfoApi()
const {fetchData: applyOrderAccessFetchData} = ApplyOrderAccessApi()
const orderDetail = debounce( async () => {
let res = await useFetchData()
if(res.data.order_access_status !== 3) {
if(res.data.order_access_status == 1) applyOrderAccessFetchData()
Taro.showModal({
title: '提示',
content: '暂未开通下单权限功能，稍后有客服联系您，请注意接受电话。',
cancelText: '联系客服',
confirmText: '我知道',
success: function (res) {
if (res.confirm) {
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
return false
}
getSelectId()
if(selectIds.current.length == 0) {
alert.error('请选择面料')
} else {
let ids = selectIds.current.join('-')
setParam({ids, sale_mode:selectIndex}) //临时存储
closePopup()
goLink('/pages/order/comfirm')
}
}, 500)
//计数组件-当后端修改完成才修改前端显示
const {fetchData: fetchDataUpdateShoppingCart} = UpdateShoppingCartApi()
const [UpdateShoppingCartLoading, setUpdateShoppingCartLoading] = useState(false)
const getInputValue = debounce(async (num, item) => {
let roll = item.sale_mode == 0?parseFloat(num):0
let length = item.sale_mode != 0?(parseFloat(num)*100):0
setUpdateShoppingCartLoading(() => true)
let res = await fetchDataUpdateShoppingCart({id: item.id, roll, length})
setUpdateShoppingCartLoading(() => false)
if(res.success) {
getShoppingCart()
}
}, 300)
return (
<View className={styles.shop_cart_main}>
<Popup showTitle={false} show={showPopup} onClose={() => closePopup()} >
<View className={styles.popup_con}>
<View className={styles.header}>
<View onClick={selectAll}>{!selectStatus?'全选':'反选'}</View>
<View onClick={delSelect}>
<text className={classnames('iconfont', 'icon-shanchu', styles.miconfont)}></text>
删除所选
</View>
</View>
<View className={styles.count_all}>{estimatePrice.countText}</View>
<View className={styles.search}>
{selectList.map((item) => {
return <View key={item.value} onClick={() => selectProduct(item.value)} className={classnames(styles.search_item, (selectIndex==item.value)&&styles.search_item_select)}>{item.title}</View>
})}
</View>
<View className={styles.con}>
{loading&&<LoadingCard/>}
{!loading&&list?.length > 0&&<InfiniteScroll moreStatus={false} >
<View className={styles.product_list}>
{list?.map((item, index) => {
return <View key={index} className={classnames(styles.product_item, (selectIndex!=-1&&selectIndex!= item.sale_mode)&&styles.no_product_item_select)}>
<View className={styles.checkbox}>
<MCheckbox disabled={selectIndex!=-1&&selectIndex!=item.sale_mode} status={item.select} onSelect={() => selectCallBack(item)} onClose={() => colseCallBack(item)}/>
</View>
<View className={styles.img}>
<Image mode="aspectFill" src={formatImgUrl(item.texture_url)}/>
</View>
<View className={styles.des}>
<View className={styles.title}>{formatHashTag(item.product_code, item.product_name)}</View>
<View className={styles.subtitle}>{item.product_color_code +' ' + item.product_color_name}</View>
<View className={styles.tag}>{item.sale_mode_name}</View>
</View>
<View className={styles.count}>
<View className={styles.price}><text>￥</text>{formatPirce(item.sale_price)}<text>/{selectList[selectIndex].eunit}</text></View>
{/* <View className={styles.long}>×{formatCount(item)}{selectList[selectIndex].unit}</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={formatUnit(item)}
minNum={selectList[selectIndex].minNum}
maxNum={selectList[selectIndex].maxNum}
disable={UpdateShoppingCartLoading}
/>
</View>
</View>
</View>
})}
</View>
</InfiniteScroll>}
{!loading&&list?.length == 0 &&<View className={styles.empty}>
<View className={styles.title}>暂未选择商品</View>
<View className={styles.btn}>去选购</View>
</View>}
</View>
<View className={styles.buy_btn}>
<View className={styles.buy_con}>
<View className={styles.icon}>
<View className={classnames('iconfont', 'icon-gouwuche', styles.miconfont)}></View>
</View>
<View className={styles.price_con}>
<View className={styles.price_real}><text>￥</text>{estimatePrice.price}</View>
<View className={styles.price_forecast}>预估金额</View>
</View>
<View className={styles.goPay} onClick={() => orderDetail()}>
去结算({estimatePrice.color_count})
</View>
</View>
</View>
</View>
</Popup>
</View>
)
}
src/components/shopCart/index.tsx
+1 -1
View File
@@ -302,7 +302,7 @@ export default ({show = false, onClose}: param) => {
<View className={styles.tag}>{item.sale_mode_name}</View>
</View>
<View className={styles.count}>
<View className={styles.price}><text>￥</text>{formatPirce(item.sale_price)}<text>/{selectList[selectIndex].eunit}</text></View>
<View className={styles.price}><text>￥</text>{formatPirce(item.sale_price)}<text>/{selectList[item.sale_mode].eunit}</text></View>
{/* <View className={styles.long}>×{formatCount(item)}{selectList[selectIndex].unit}</View> */}
<View className={styles.btn_count}>
<Counter
src/components/textareaEnhance/index.tsx
+4 -3
View File
@@ -8,9 +8,10 @@ type Param = {
title?: string,
onChange?: (val: string) => void,
placeholder?: string,
defaultValue?: string
defaultValue?: string,
onlyRead?: false|true
}
export default memo(({onChange, title = '', placeholder = '请输入', defaultValue}:Param) => {
export default memo(({onChange, title = '', placeholder = '请输入', defaultValue, onlyRead = false}:Param) => {
const [descData, setDescData] = useState({
number: 0,
value: '',
@@ -37,7 +38,7 @@ export default memo(({onChange, title = '', placeholder = '请输入', defaultVa
<View className={styles.other_desc}>
<View className={styles.title}>{title}</View>
<View className={styles.textarea}>
{descData.show&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e.detail.value)}></Textarea>||
{(descData.show && !onlyRead)&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e.detail.value)}></Textarea>||
<View className={classnames(styles.textarea_con_pretend, descData.value&&styles.textarea_con_pretend_ed)} onClick={() => toggleShowRealTextarea(true)}>{descData.value||placeholder}</View>
}
<View className={styles.descDataNum}>{descData.number +'/'+ descData.count}</View>
src/components/uploadImage/index.tsx
+6 -5
View File
@@ -9,9 +9,10 @@ import styles from './index.module.scss'
//图片列表
type ImageParam = {
onChange?:(val: string[]) => void,
defaultList?: string[]
defaultList?: string[],
onlyRead?: false|true
}
const PictureItem:FC<ImageParam> = memo(({onChange, defaultList}) => {
const PictureItem:FC<ImageParam> = memo(({onChange, defaultList, onlyRead = false}) => {
const {getWxPhoto} = useUploadCDNImg()
const [imageList, setImageLise] = useState<string[]>([])
@@ -54,12 +55,12 @@ const PictureItem:FC<ImageParam> = memo(({onChange, defaultList}) => {
{imageList.map((item, index) =>
<View className={styles.ImgItem}>
<Image mode="aspectFill" src={formatImgUrl(item)} onClick={showImage}></Image>
<View onClick={() => delImage(index)} className={classnames(styles.miconfont_close, 'iconfont icon-qingkong')}></View>
{!onlyRead && <View onClick={() => delImage(index)} className={classnames(styles.miconfont_close, 'iconfont icon-qingkong')}></View>}
</View>)}
<View className={styles.uploadImg } onClick={uploadImage}>
{!onlyRead && <View className={styles.uploadImg } onClick={uploadImage}>
<Text className={classnames(styles.miconfont, 'iconfont icon-saomazhifu')}></Text>
<Text className={styles.uploadText}>上传照片</Text>
</View>
</View>}
</View>
)
})