From 55cbaac8f5bdca9f50dca9163af83af3684049f9 Mon Sep 17 00:00:00 2001
From: czm <2192718639@qq.com>
Date: Mon, 30 May 2022 20:32:47 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8=E5=AF=B9?=
=?UTF-8?q?=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/orderBtns/index.tsx | 14 ++-
src/pages/details/index.tsx | 4 +-
src/pages/order/components/payment/index.tsx | 23 ++--
src/pages/order/components/remark/index.tsx | 2 +-
src/pages/order/index.module.scss | 1 +
src/pages/order/index.tsx | 13 ++-
.../orderStatusList/index.module.scss | 18 +++
.../components/orderStatusList/index.tsx | 46 ++++++++
src/pages/orderList/index.tsx | 17 +--
src/use/useCheckAuthorize.tsx | 2 +-
src/use/useHttp.ts | 7 +-
src/use/useLogin.ts | 69 +++---------
src/use/useLoginRequest.ts | 106 ++++++++++++++++++
src/use/useManualPullDownRefresh.ts | 24 ----
14 files changed, 239 insertions(+), 107 deletions(-)
create mode 100644 src/pages/orderList/components/orderStatusList/index.module.scss
create mode 100644 src/pages/orderList/components/orderStatusList/index.tsx
create mode 100644 src/use/useLoginRequest.ts
delete mode 100644 src/use/useManualPullDownRefresh.ts
diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx
index 3cc4690..efd97b1 100644
--- a/src/components/orderBtns/index.tsx
+++ b/src/components/orderBtns/index.tsx
@@ -8,9 +8,12 @@ import styles from './index.module.scss'
type Param = {
status?: number, //订单状态
orderId: number, //订单id
+ payModel: number, //支付方式
+ realPayPrice: number, //实付金额
+ pendingPayPrice: number, //待付金额
onClick?: (val: number) => void //点击后触发的事件,返回订单状态
}
-export default memo(({status = 0, orderId = 0, onClick}:Param) => {
+export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendingPayPrice = 0}:Param) => {
//订单按钮按订单状态归类
const orderBtnsList = useRef([
{
@@ -49,15 +52,22 @@ export default memo(({status = 0, orderId = 0, onClick}:Param) => {
label: '再次购买'
}
])
+ //判断是否显示该按钮
const orderBtnsShow = useCallback((item, status) => {
+ if(item.id == 1) {
+ return( realPayPrice == 0 && status <= 4) //在代发货之前没有付过款
+ }
+ if(item.id == 2) {
+ return( pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款
+ }
return item.value.includes(status)
+
},[])
//点击按钮操作
const submitBtns = (val) => {
(val == 1)&&cancelOrder(); //取消订单按钮
(val == 2)&&onClick?.(val); //去付款按钮
-
}
//取消订单
diff --git a/src/pages/details/index.tsx b/src/pages/details/index.tsx
index 75f1899..c845f9e 100644
--- a/src/pages/details/index.tsx
+++ b/src/pages/details/index.tsx
@@ -8,7 +8,7 @@ import ShopCart from '@/components/shopCart';
import Preview,{colorItem} from './components/preview';
import styles from './index.module.scss'
import { useEffect, useMemo, useState } from 'react';
-import {formatHashTag} from '@/common/fotmat'
+import {formatHashTag, formatImgUrl} from '@/common/fotmat'
import useManualPullDownRefresh from '@/use/useManualPullDownRefresh';
import { goLink } from '@/common/common';
import useUserInfo from '@/use/useUserInfo';
@@ -147,7 +147,7 @@ export default (props:params) => {
{productInfo?.product_color_list?.map(item => {
return getColorItem(item)}>
-
+
{item.code}
diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx
index a354b1f..3d6f42a 100644
--- a/src/pages/order/components/payment/index.tsx
+++ b/src/pages/order/components/payment/index.tsx
@@ -1,5 +1,5 @@
import { Text, View } from "@tarojs/components";
-import { memo, useEffect, useState } from "react";
+import { memo, useEffect, useMemo, useState } from "react";
import AmountShow from "../amountShow";
import classnames from "classnames";
import styles from './index.module.scss'
@@ -15,7 +15,8 @@ import {alert} from "@/common/common"
type Param = {
show?: true|false,
onClose?: () => void,
- orderId?: number //应付单id
+ orderId?: number, //应付单id
+ onSubmitSuccess?: () => void //支付成功
}
type PayInfo = {
@@ -23,7 +24,7 @@ type PayInfo = {
}
type PayStatus = 0|1|2|3|4|null //0:预存款, 1:账期,2:线下汇款, 3:扫码支付, 4:货到付款
-export default memo(({show = false, onClose, orderId = 0}:Param) => {
+export default memo(({show = false, onClose, orderId = 0, onSubmitSuccess}:Param) => {
//提交参数
const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({
@@ -78,11 +79,19 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
let res = await submitFetchData(submitData)
if(res.success) {
alert.success('支付成功')
+ onSubmitSuccess?.()
} else {
alert.none(res.msg)
}
}
+ const advance_payment = useMemo(() => {
+ const price = formatPriceDiv(payInfo?.should_collect_money - payInfo?.amount_paid)
+ return (
+ {(payInfo?.advance_deposit_balance < price)&&'余额不足,' }剩余 ¥{payInfo?.advance_deposit_balance}
+ )
+ }, [payInfo])
+
return (
@@ -90,7 +99,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
订单支付
-
+
@@ -99,11 +108,11 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
订单金额
- ¥6,001.00
+ ¥{formatPriceDiv(payInfo?.should_collect_money)}
已付金额
- ¥1,801.00
+ ¥{formatPriceDiv(payInfo?.amount_paid)}
@@ -114,7 +123,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => {
预存款
- 金额不足,剩余 ¥{payInfo?.advance_deposit_balance}
+ {advance_payment}
advanceSelectData(0)} onClose={() => advanceSelectData(null)}/>
diff --git a/src/pages/order/components/remark/index.tsx b/src/pages/order/components/remark/index.tsx
index 67d6bb6..14d981b 100644
--- a/src/pages/order/components/remark/index.tsx
+++ b/src/pages/order/components/remark/index.tsx
@@ -27,7 +27,7 @@ export default ({onBlur, onSave}:Param) => {
}
return (
- 添加备注
+ 编辑备注
{descData.number}/{descData.count}
diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss
index 662cb6e..a032fbe 100644
--- a/src/pages/order/index.module.scss
+++ b/src/pages/order/index.module.scss
@@ -52,6 +52,7 @@
color: $color_font_two;
margin-right: 10px;
flex:1;
+ word-break:break-all;
}
.order_desc_text_hint{
text-align: right;
diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx
index 5c9d498..c5043d5 100644
--- a/src/pages/order/index.tsx
+++ b/src/pages/order/index.tsx
@@ -151,6 +151,17 @@ import styles from './index.module.scss'
getSaleOrderPreView()
})
+ //支付成功
+ const onPaySuccess = useCallback(() => {
+ getSaleOrderPreView()
+ closePayShow()
+ }, [orderDetail])
+
+ //关闭支付弹窗
+ const closePayShow = useCallback(() => {
+ setPayMentShow(() => false)
+ }, [orderDetail])
+
return (
{/*
@@ -191,7 +202,7 @@ import styles from './index.module.scss'
setShowDesc(false)} >
getRemark(e)}/>
- setPayMentShow(false)} orderId={orderDetail?.should_collect_order_id}/>
+
)
diff --git a/src/pages/orderList/components/orderStatusList/index.module.scss b/src/pages/orderList/components/orderStatusList/index.module.scss
new file mode 100644
index 0000000..47de83d
--- /dev/null
+++ b/src/pages/orderList/components/orderStatusList/index.module.scss
@@ -0,0 +1,18 @@
+.order_status_list{
+ font-size: $font_size;
+ color: #9E9E9E;
+ margin-top: 20px;
+ .order_status_item{
+ padding: 20px;
+ box-sizing: border-box;
+ }
+ .selected{
+ font-weight: 700;
+ color: #000;
+ border-bottom: 4px solid #707070;
+ }
+ .order_list_scroll{
+ white-space: nowrap;
+ display: flex;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/orderList/components/orderStatusList/index.tsx b/src/pages/orderList/components/orderStatusList/index.tsx
new file mode 100644
index 0000000..3e12f6f
--- /dev/null
+++ b/src/pages/orderList/components/orderStatusList/index.tsx
@@ -0,0 +1,46 @@
+import { ScrollView, View } from "@tarojs/components"
+import { memo, useEffect, useState } from "react"
+import styles from './index.module.scss'
+import classnames from "classnames";
+
+type Param = {
+ list: {id: number, name: string}[],
+ defaultId?: number|null,
+ onSelect?: (val: number) => void
+}
+export default memo(({list = [], defaultId = null, onSelect}: Param) => {
+ const [selectInfo, setSelectInfo] = useState({
+ selected: -1, //当前选中的id
+ tabId: '', //需要滚动到的id
+ })
+ useEffect(() => {
+ if(defaultId) {
+ const index = list?.findIndex(item => {
+ console.log(item.id, defaultId)
+ return item.id == defaultId
+ })
+ if(index !== -1) {
+ const num = index > 0?( index - 1) : 0
+ setSelectInfo((e) => ({...e, tabId:list[num].id.toString()}))
+ }
+ }
+ }, [defaultId])
+ const clickEvent = ({item, index}: {item:any, index:number}) => {
+ const num = index > 0?( index - 1) : 0
+ setSelectInfo((e) => ({...e, tabId:list[num].id.toString(), selected: item.id}))
+ onSelect?.(item.id)
+ }
+
+ return (
+
+
+
+ {list.map((item, index) => {
+ return clickEvent({item, index})} className={classnames(styles.order_status_item, (selectInfo.selected==item.id)&&styles.selected)}>{item.name}
+ })}
+
+
+
+ )
+})
+
diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx
index 04aedfe..866597b 100644
--- a/src/pages/orderList/index.tsx
+++ b/src/pages/orderList/index.tsx
@@ -3,14 +3,13 @@ import useLogin from "@/use/useLogin"
import { Image, ScrollView, Text, View } from "@tarojs/components"
import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro"
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
-import {ORDER_STATUS} from '@/common/enum'
import styles from './index.module.scss'
import classnames from "classnames";
import Order from "./components/order"
import InfiniteScroll from "@/components/infiniteScroll"
import {GetOrderStatusListApi, GetOrderListApi} from '@/api/order'
import { dataLoadingStatus, getFilterData } from "@/common/util"
-import Tabs from "@/components/tabs"
+import OrderStatusList from "./components/orderStatusList"
export default () => {
const {checkLogin} = useLogin()
@@ -44,6 +43,7 @@ export default () => {
const getOrderList = async () => {
let res = await listFetchData(getFilterData(searchField))
setOrderData({list: res.data.list, total: res.data.total})
+ setRefresherTriggeredStatus(() => false)
}
@@ -91,24 +91,17 @@ export default () => {
const getRefresherRefresh = async () => {
pageNum.current.size = 1
setRefresherTriggeredStatus(true)
+ setSearchField((val) => ({...val, size:10}))
}
return (
-
-
-
- {statusList.map(item => {
- return changeStatus(item.id)} className={classnames(styles.order_status_item, (searchField.status==item.id)&&styles.selected)}>{item.name}
- })}
-
-
-
+
-
+
{orderData?.list.map(item => {
return
})}
diff --git a/src/use/useCheckAuthorize.tsx b/src/use/useCheckAuthorize.tsx
index 05ae81f..d0ece73 100644
--- a/src/use/useCheckAuthorize.tsx
+++ b/src/use/useCheckAuthorize.tsx
@@ -8,7 +8,7 @@ type Param = {
msg: string //检查不通过时警告
}
export default ({scope, msg}: Param) => {
- //检查授权
+ //这个hook微信授权检查授权
const check = useCallback(() => {
return new Promise((reslove, reject) => {
Taro.getSetting({
diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts
index 74ee064..ead24a2 100644
--- a/src/use/useHttp.ts
+++ b/src/use/useHttp.ts
@@ -5,6 +5,8 @@ import { useEffect, useRef, useState } from 'react'
import {BASE_URL, WX_APPID} from '@/common/constant'
import useUserInfo from "./useUserInfo"
import qs from 'qs';
+import useLogin from './useLogin';
+import useLoginRequest from './useLoginRequest';
type Params = {
@@ -122,6 +124,7 @@ export const useRequest = (options:option = {
const stateRef = useRef({...params})
const [state, setState] = useState({...stateRef.current})
const {removeToken, removeSessionKey} = useUserInfo()
+ const {login} = useLoginRequest()
useEffect(() => {
console.log('变化::', state.loading)
@@ -176,9 +179,7 @@ export const useRequest = (options:option = {
if (statusCode === 401) {
removeToken()
removeSessionKey()
- // Taro.reLaunch({
- // url: router.path +'?' + qs.stringify(router.params)
- // })
+ login()
} else {
Taro.showToast({
title: `错误:${showStatus(statusCode)}`,
diff --git a/src/use/useLogin.ts b/src/use/useLogin.ts
index 45847ef..aa662d7 100644
--- a/src/use/useLogin.ts
+++ b/src/use/useLogin.ts
@@ -1,69 +1,31 @@
import { useEffect, useState } from "react"
-import { WX_APPID } from "@/common/constant"
+import {BASE_URL, WX_APPID } from "@/common/constant"
import useUserInfo from "./useUserInfo"
import Taro, { useRouter } from "@tarojs/taro"
import { LoginApi } from "@/api/login"
import { GetWxUserInfoApi, GetAdminUserInfoApi, GetPhoneNumberApi } from "@/api/user"
import qs from 'qs';
+import useLoginRequest from "./useLoginRequest"
export default () => {
- const {setToken, setSessionKey, setUserInfo, setAdminUserInfo, userInfo} = useUserInfo()
+ const {setUserInfo, setAdminUserInfo, userInfo} = useUserInfo()
useEffect(() => {
console.log('userInfo::',userInfo.token)
}, [userInfo])
- const router = useRouter()
- //登录请求
- const {fetchData} = LoginApi()
-
- //微信登录
- const wxLogin = () => {
- return new Promise((reslove, reject) => {
- Taro.login({
- success: async (res) => {
- if (res.code) {
- const {data, success, msg} = await fetchData({js_code: res.code})
- if(success) {
- console.log('token::',data.token)
- setToken(data.token)
- setSessionKey(data.session_key)
- reslove(data)
- let params = router.params
- delete params.$taroTimestamp
- console.log('params::',params)
- if(router.path === '/pages/index/index' || router.path === '/pages/user/index') {
- Taro.reLaunch({
- url: router.path +'?' + qs.stringify(params)
- })
- } else {
- Taro.redirectTo({
- url: router.path +'?' + qs.stringify(params)
- })
- }
- getAdminUserInfo()
+ //登录请求 (调用这个就不能再useHttp中使用,当前这个hook, 否则会死循环内存溢出)
+ // const {fetchData} = LoginApi()
- //todo 删除本地授权用户信息,获取最新授权信息
-
- } else {
- Taro.showToast({
- title:'登录失败',
- icon:"none"
- })
- reject(msg)
- }
- } else {
- console.log('登录失败!' + res.errMsg)
- reject(res.errMsg)
- }
- },
- fail: function(e) {
- console.log('登录失败!::',e)
- reject(e)
- }
- })
- })
-
+ //登录请求
+ const {login} = useLoginRequest()
+ const wxLogin = async () => {
+ try {
+ await login()
+ getAdminUserInfo()
+ } catch(e) {
+ console.log('登录失败::',e)
+ }
}
//获取用户信息
@@ -83,6 +45,7 @@ export default () => {
Taro.checkSession({
success: async () => {
reslove(true)
+ if(!userInfo.adminUserInfo) getAdminUserInfo()
},
fail: async () => {
await wxLogin()
@@ -91,8 +54,6 @@ export default () => {
})
}
})
-
-
}
//获取用户头像等信息数据
diff --git a/src/use/useLoginRequest.ts b/src/use/useLoginRequest.ts
new file mode 100644
index 0000000..dc7d55e
--- /dev/null
+++ b/src/use/useLoginRequest.ts
@@ -0,0 +1,106 @@
+import {BASE_URL, WX_APPID } from "@/common/constant"
+import Taro, { useRouter } from "@tarojs/taro"
+import { useRef, useState } from "react"
+import qs from 'qs'
+import useUserInfo from "./useUserInfo"
+
+//开这个hook 主要是为了让useHttp 能够调用
+
+type Param = {success: true|false, data: any, msg: string, code: null|number, loading: false|true}
+export default () => {
+ let initData = {
+ success: false,
+ data: null,
+ msg: '',
+ code: null,
+ loading: false
+ }
+ let loginData = useRef(initData)
+ const {setToken, setSessionKey} = useUserInfo()
+ const router = useRouter()
+ //微信登录请求v2
+ const fetchData = async (login_code) => {
+ const q = {
+ url: BASE_URL + '/v1/mall/login',
+ header: {
+ "Platform": 6,
+ "Appid": WX_APPID,
+ },
+ method: 'post',
+ data:{js_code: login_code}
+ }
+ try{
+ const result = await Taro.request(q as any)
+ const {code, data, msg} = result.data
+ if(result.statusCode === 200) {
+ loginData.current.success = (code === 0 ? true : false)
+ loginData.current.code = code
+ loginData.current.msg = msg
+ loginData.current.data = data
+ } else {
+ Taro.showToast({
+ title: `错误:登录失败`,
+ icon: 'none'
+ })
+ console.log('登录错误:', result.errMsg)
+
+ }
+ }catch(e) {
+ Taro.showToast({
+ title: `错误:登录失败`,
+ icon: 'none'
+ })
+ console.log('登录错误:', e.errMsg)
+ }
+ return loginData.current
+ }
+
+ //微信登录
+ const login = () => {
+ return new Promise((reslove, reject) => {
+ Taro.login({
+ success: async (res) => {
+ if (res.code) {
+ const {data, success, msg} = await fetchData(res.code)
+ if(success) {
+ setToken(data.token)
+ setSessionKey(data.session_key)
+ reslove(data)
+ let params = router.params
+ delete params.$taroTimestamp
+ if(router.path === '/pages/index/index' || router.path === '/pages/user/index') {
+ Taro.reLaunch({
+ url: router.path +'?' + qs.stringify(params)
+ })
+ } else {
+ Taro.redirectTo({
+ url: router.path +'?' + qs.stringify(params)
+ })
+ }
+ } else {
+ Taro.showToast({
+ title:'登录失败',
+ icon:"none"
+ })
+ reject(msg)
+ }
+ } else {
+ console.log('登录失败!' + res.errMsg)
+ reject(res.errMsg)
+ }
+ },
+ fail: function(e) {
+ console.log('登录失败!::',e)
+ reject(e)
+ }
+ })
+ })
+
+ }
+
+ return {
+ login
+ }
+
+}
+
diff --git a/src/use/useManualPullDownRefresh.ts b/src/use/useManualPullDownRefresh.ts
deleted file mode 100644
index 4ff1ff3..0000000
--- a/src/use/useManualPullDownRefresh.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import Taro, { usePullDownRefresh } from "@tarojs/taro"
-import { useCallback, useState } from "react"
-
-type Arg = {[index:string]:any}
-export default (fn?:(val:Arg) => any, arg?:Arg) => {
- const [data, setData] = useState({})
-
- usePullDownRefresh(() => {
- getData()
- })
-
- const getData = useCallback(() => {
- setTimeout(() => {
- const res = fn?.({...arg})
- setData((e) => ({...e, res}))
- Taro.stopPullDownRefresh()
- }, 1000)
- }, [])
-
- return {
- getData,
- data
- }
-}
\ No newline at end of file