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

商城测试版v8_1

Browse Source
This commit is contained in:
czm 2022-07-29 20:48:15 +08:00
parent 4a7bbf774f
commit e2b0b0c52b
18 changed files with 1821 additions and 1722 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.prettierrc.js Normal file
View File

@ -0,0 +1,10 @@
module.exports = {
printWidth: 160, // 每行代码最大长度
tabWidth: 2, //一个tab代表几个空格数，默认为80
useTabs: false, //是否使用tab进行缩进，默认为false，表示用空格进行缩减
semi: false, // 声明后带分号
singleQuote: true, // 使用单引号
jsxSingleQuote: true, // 使用单引号
jsxBracketSameLine: true, // 启用jsx语法，> 放在末尾
trailingComma: 'all',
}

20
global.d.ts vendored
View File

@ -1,15 +1,15 @@
/// <reference path="node_modules/@tarojs/plugin-platform-weapp/types/shims-weapp.d.ts" /> /// <reference path="node_modules/@tarojs/plugin-platform-weapp/types/shims-weapp.d.ts" />
declare module '*.png'; declare module '*.png'
declare module '*.gif'; declare module '*.gif'
declare module '*.jpg'; declare module '*.jpg'
declare module '*.jpeg'; declare module '*.jpeg'
declare module '*.svg'; declare module '*.svg'
declare module '*.css'; declare module '*.css'
declare module '*.less'; declare module '*.less'
declare module '*.scss'; declare module '*.scss'
declare module '*.sass'; declare module '*.sass'
declare module '*.styl'; declare module '*.styl'
declare namespace NodeJS { declare namespace NodeJS {
interface ProcessEnv { interface ProcessEnv {

7
src/api/onlinePay.ts
View File

@ -1,5 +1,5 @@
import { CAP_HTML_TO_IMAGE_BASE_URL } from "@/common/constant" import { CAP_HTML_TO_IMAGE_BASE_URL } from '@/common/constant'
import { useRequest } from "@/use/useHttp" import { useRequest } from '@/use/useHttp'
/** /**
* 获取在线支付二维码 * 获取在线支付二维码
@ -8,7 +8,6 @@ import { useRequest } from "@/use/useHttp"
return useRequest({ return useRequest({
url: `/xima-caphtml/caphtml`, url: `/xima-caphtml/caphtml`,
base_url: CAP_HTML_TO_IMAGE_BASE_URL, base_url: CAP_HTML_TO_IMAGE_BASE_URL,
method: "post", method: 'post',
}) })
} }

12
src/common/constant.js
View File

@ -21,19 +21,23 @@ export const UPLOAD_CDN_URL = `https://v0.api.upyun.com/`
// cdn // cdn
// export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com" // export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com"
export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://test.cdn.zzfzyc.com" export const IMG_CND_Prefix = CURRENT_ENV.includes('development')
? 'https://test.cdn.zzfzyc.com'
: 'https://test.cdn.zzfzyc.com'
//在线支付图片baseUrl //在线支付图片baseUrl
// export const CAP_HTML_TO_IMAGE_BASE_URL = CURRENT_ENV.includes('development')? "https://test.zzfzyc.com":"https://www.zzfzyc.com" // export const CAP_HTML_TO_IMAGE_BASE_URL = CURRENT_ENV.includes('development')? "https://test.zzfzyc.com":"https://www.zzfzyc.com"
export const CAP_HTML_TO_IMAGE_BASE_URL = CURRENT_ENV.includes('development')? "https://test.zzfzyc.com":"https://test.zzfzyc.com" export const CAP_HTML_TO_IMAGE_BASE_URL = CURRENT_ENV.includes('development')
? 'https://test.zzfzyc.com'
: 'https://test.zzfzyc.com'
// 上传图片视频 // 上传图片视频
export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`; export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`
//appid //appid
export const WX_APPID = 'wx68d92d7cbf0b6963' export const WX_APPID = 'wx68d92d7cbf0b6963'
//场景值 //场景值
export const SCENE = { export const SCENE = {
SearchScene : 0 //商城面料搜索 SearchScene: 0, //商城面料搜索
} }

79
src/common/util.ts
View File

@ -1,5 +1,5 @@
import { formatImgUrl } from "./fotmat"; import { formatImgUrl } from './fotmat'
import { analysisShortCodeApi } from "./shortCode"; import { analysisShortCodeApi } from './shortCode'
import Taro from '@tarojs/taro' import Taro from '@tarojs/taro'
/** /**
@ -9,13 +9,13 @@ import Taro from '@tarojs/taro'
* @returns * @returns
*/ */
export const debounce = (fn, delay) => { export const debounce = (fn, delay) => {
let timer:any = null; let timer: any = null
return (...param) => { return (...param) => {
if (timer) clearTimeout(timer); if (timer) clearTimeout(timer)
timer = setTimeout(() => { timer = setTimeout(() => {
fn(...param); fn(...param)
}, delay); }, delay)
}; }
} }
/** /**
@ -25,16 +25,15 @@ export const debounce = (fn, delay) => {
* @returns * @returns
*/ */
export const throttle = (fn, delay) => { export const throttle = (fn, delay) => {
let pre = 0; let pre = 0
return (...params) => { return (...params) => {
let now = new Date().getTime(); let now = new Date().getTime()
if (now - pre > delay) { if (now - pre > delay) {
fn(...params); fn(...params)
pre = now; pre = now
}
} }
};
} }
/** /**
* 批量过滤对象值为空的属性 * 批量过滤对象值为空的属性
@ -45,7 +44,12 @@ export const throttle = (fn, delay) => {
export const getFilterData = (val = {}, arr: string[] = []) => { export const getFilterData = (val = {}, arr: string[] = []) => {
let res = {} let res = {}
for (let key in val) { for (let key in val) {
if(val[key]!==undefined&&val[key]!==null&&val[key]!==''&&(!arr.includes(key))){ if (
val[key] !== undefined &&
val[key] !== null &&
val[key] !== '' &&
!arr.includes(key)
) {
if (typeof val[key] == 'number') { if (typeof val[key] == 'number') {
if (!isNaN(val[key])) { if (!isNaN(val[key])) {
res[key] = val[key] res[key] = val[key]
@ -64,18 +68,18 @@ export const throttle = (fn, delay) => {
*/ */
export const copyObject = (object) => { export const copyObject = (object) => {
if (object.constructor == Object) { if (object.constructor == Object) {
let keys = Object.keys(object); let keys = Object.keys(object)
let newObject = {}; let newObject = {}
keys.map(key=>{ keys.map((key) => {
newObject[key]= copyObject(object[key]); newObject[key] = copyObject(object[key])
}) })
return newObject; return newObject
} else if (object.constructor == Array) { } else if (object.constructor == Array) {
return object.map(item=>{ return object.map((item) => {
return copyObject(item); return copyObject(item)
}) })
} else { } else {
return object; return object
} }
} }
@ -91,12 +95,20 @@ export const throttle = (fn, delay) => {
!wh400 !wh400
!w600 !w600
*/ */
export const screenshot = (url, suffix="!w200")=>{ export const screenshot = (url, suffix = '!w200') => {
return url+suffix; return url + suffix
} }
//获取数据加载状态 //0:数据从无到有加载数据，1，没有任何数据， 2：下拉加载，3：下拉没有数据 //获取数据加载状态 //0:数据从无到有加载数据，1，没有任何数据， 2：下拉加载，3：下拉没有数据
export const dataLoadingStatus = ({list = [], total = 0, status = false}:{list:any[], total:number, status:true|false}) => { export const dataLoadingStatus = ({
list = [],
total = 0,
status = false,
}: {
list: any[]
total: number
status: true | false
}) => {
if (list.length == 0 && status) { if (list.length == 0 && status) {
return 0 return 0
} else if (list.length == 0 && !status) { } else if (list.length == 0 && !status) {
@ -120,16 +132,25 @@ export const throttle = (fn, delay) => {
let path = '' let path = ''
let title = '' let title = ''
let imageUrl = '' let imageUrl = ''
let sortCode = Taro.getStorageSync('sort_code')?JSON.parse(Taro.getStorageSync('sort_code')):'' let sortCode = Taro.getStorageSync('sort_code')
? JSON.parse(Taro.getStorageSync('sort_code'))
: ''
let pageInfo: any = page let pageInfo: any = page
if(res.from === 'button') { //商品详情分享
if (pageInfo.route === 'pages/details/index') {
path = `/pages/details/index?share=${sortCode.shareShortDetail.code}` path = `/pages/details/index?share=${sortCode.shareShortDetail.code}`
title = sortCode.shareShortDetail.title title = sortCode.shareShortDetail.title
imageUrl = sortCode.shareShortDetail.img imageUrl = sortCode.shareShortDetail.img
} else { } else {
path = (pageInfo.route === 'pages/user/index')?`/pages/user/index?share=${sortCode.shareShortPage.code}`:`/pages/index/index?share=${sortCode.shareShortPage.code}` path =
pageInfo.route === 'pages/user/index'
? `/pages/user/index?share=${sortCode.shareShortPage.code}`
: `/pages/index/index?share=${sortCode.shareShortPage.code}`
title = sortCode.shareShortPage.title title = sortCode.shareShortPage.title
imageUrl = (pageInfo.route === 'pages/user/index')?formatImgUrl('/mall/share_img_02.png') : sortCode.shareShortPage.img imageUrl =
pageInfo.route === 'pages/user/index'
? sortCode.shareShortPage.img
: formatImgUrl('/mall/share_img_02.png')
} }
return { return {
title, title,

86
src/components/InfiniteScrollPaging/index.tsx
View File

@ -1,70 +1,69 @@
import InfiniteScroll from '@/components/infiniteScroll'
import InfiniteScroll from "@/components/infiniteScroll" import { ReactNode, useEffect, useMemo, useRef, useState } from 'react'
import { ReactNode, useEffect, useMemo, useRef, useState } from "react" import { dataLoadingStatus, getFilterData } from '@/common/util'
import { dataLoadingStatus, getFilterData } from "@/common/util"; import { alert, isEmptyObject } from '@/common/common'
import { alert, isEmptyObject } from "@/common/common";
interface Params { interface Params {
children?: ReactNode, children?: ReactNode
query?: object, query?: object
fetchData: (data: object)=>any, fetchData: (data: object) => any
change?: (data: any) => void change?: (data: any) => void
} }
export default (props: Params) => { export default (props: Params) => {
const { query={} } = props; const { query = {} } = props
useEffect(() => { useEffect(() => {
refreshDataRef.current = refreshData; refreshDataRef.current = refreshData
dataRef.current = data; dataRef.current = data
getData({moreStatus: true},{moreStatus: true}); getData({ moreStatus: true }, { moreStatus: true })
}, []) }, [])
useEffect(() => { useEffect(() => {
if (!isEmptyObject(query)) { if (!isEmptyObject(query)) {
setData({list: [],total: 0}); setData({ list: [], total: 0 })
getData({moreStatus: true},{moreStatus: true}); getData({ moreStatus: true }, { moreStatus: true })
} }
}, [query]) }, [query])
const getData = async (startStatus, endStatus) => { const getData = async (startStatus, endStatus) => {
const tRefreshDataRef = refreshDataRef.current as any; const tRefreshDataRef = refreshDataRef.current as any
setRefreshData({ setRefreshData({
...tRefreshDataRef, ...tRefreshDataRef,
...startStatus, ...startStatus,
loading: true loading: true,
}) })
const result = await props.fetchData({ const result = await props.fetchData({
...query, ...query,
page: tRefreshDataRef.page, page: tRefreshDataRef.page,
size: tRefreshDataRef.size, size: tRefreshDataRef.size,
}); })
if (result.success) { if (result.success) {
// 返回数据 // 返回数据
props.change&&props.change(result); props.change && props.change(result)
if (result.data.total <= 0) { if (result.data.total <= 0) {
setRefreshData({ setRefreshData({
...tRefreshDataRef, ...tRefreshDataRef,
...endStatus, ...endStatus,
loading: false loading: false,
}) })
} else { } else {
setData({ setData({
list: result.data.list, list: result.data.list,
// list: tRefreshDataRef.page>1?(dataRef.current as any).list.concat(result.data.list):result.data.list, // list: tRefreshDataRef.page>1?(dataRef.current as any).list.concat(result.data.list):result.data.list,
total: result.data.total total: result.data.total,
}) })
setRefreshData({ setRefreshData({
...tRefreshDataRef, ...tRefreshDataRef,
refreshStatus: false, refreshStatus: false,
moreStatus: false, moreStatus: false,
loading: false loading: false,
}) })
} }
} else { } else {
alert.none(result.msg); alert.none(result.msg)
setRefreshData({ setRefreshData({
...tRefreshDataRef, ...tRefreshDataRef,
refreshStatus: false, refreshStatus: false,
moreStatus: true, moreStatus: true,
loading: false loading: false,
}) })
} }
} }
@ -74,40 +73,43 @@ export default (props: Params)=>{
moreStatus: false, moreStatus: false,
page: 1, page: 1,
size: 10, size: 10,
loading: false loading: false,
}) })
const refreshDataRef = useRef({}); const refreshDataRef = useRef({})
// 渲染（数据） // 渲染（数据）
const [data, setData] = useState({ const [data, setData] = useState({
list: [], list: [],
total: 0 total: 0,
}); })
const dataRef = useRef({}); const dataRef = useRef({})
// 下拉刷新 // 下拉刷新
const handleRefresh = async () => { const handleRefresh = async () => {
let tRefreshData = refreshDataRef.current as any; let tRefreshData = refreshDataRef.current as any
setRefreshData({ setRefreshData({
...tRefreshData, ...tRefreshData,
page: 1, page: 1,
size: 10, size: 10,
}) })
getData({refreshStatus: true,moreStatus: false},{refreshStatus: false,moreStatus: true}); getData({ refreshStatus: true, moreStatus: false }, { refreshStatus: false, moreStatus: true })
} }
// 加载更多 // 加载更多
const handleMoreLoad = async () => { const handleMoreLoad = async () => {
let t = (dataRef.current as any); let t = dataRef.current as any
let tRefreshData = refreshDataRef.current as any; let tRefreshData = refreshDataRef.current as any
if (t.list.length < t.total) { if (t.list.length < t.total) {
setRefreshData({ setRefreshData({
...tRefreshData, ...tRefreshData,
page: ++tRefreshData.page, page: ++tRefreshData.page,
size: ++tRefreshData.page * tRefreshData.size, size: ++tRefreshData.page * tRefreshData.size,
}) })
getData({ getData(
moreStatus: true {
},{ moreStatus: true,
moreStatus: true },
}); {
moreStatus: true,
},
)
} }
} }
//数据加载状态 //数据加载状态
@ -115,10 +117,14 @@ export default (props: Params)=>{
return dataLoadingStatus({ list: data.list, total: data.total, status: refreshData.loading }) return dataLoadingStatus({ list: data.list, total: data.total, status: refreshData.loading })
}, [refreshData.loading]) }, [refreshData.loading])
return ( return (
<InfiniteScroll refresherEnabled={true} refresherTriggered={refreshData.refreshStatus} moreStatus={refreshData.moreStatus} <InfiniteScroll
selfOnRefresherRefresh={handleRefresh} selfonScrollToLower={handleMoreLoad} statusMore={statusMore}> refresherEnabled={true}
refresherTriggered={refreshData.refreshStatus}
moreStatus={refreshData.moreStatus}
selfOnRefresherRefresh={handleRefresh}
selfonScrollToLower={handleMoreLoad}
statusMore={statusMore}>
{props.children} {props.children}
</InfiniteScroll> </InfiniteScroll>
) )

45
src/pages/collection/collectionClass/index.tsx
View File

@ -1,19 +1,17 @@
import { DelFavoriteProductApi, DetailFavoriteProductApi, MoveFavoriteProductApi } from "@/api/favorite"; import { DelFavoriteProductApi, DetailFavoriteProductApi, MoveFavoriteProductApi } from '@/api/favorite'
import { alert } from "@/common/common"; import { alert } from '@/common/common'
import { getFilterData } from "@/common/util"; import { getFilterData } from '@/common/util'
import Product from "../components/product"; import Product from '../components/product'
import Search from "@/components/search" import Search from '@/components/search'
import { Text, View } from "@tarojs/components" import { Text, View } from '@tarojs/components'
import Taro, { useRouter } from "@tarojs/taro"; import Taro, { useRouter } from '@tarojs/taro'
import classnames from "classnames"; import classnames from 'classnames'
import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import styles from './index.module.scss' import styles from './index.module.scss'
import MCheckbox from "@/components/checkbox"; import MCheckbox from '@/components/checkbox'
import AddCollection from "@/components/addCollection"; import AddCollection from '@/components/addCollection'
export default () => { export default () => {
const router = useRouter() const router = useRouter()
//获取收藏夹面料 //获取收藏夹面料
@ -23,7 +21,7 @@ export default () => {
let res = await fetchDataDetailFavoriteProduct(searchData) let res = await fetchDataDetailFavoriteProduct(searchData)
if (res.success) { if (res.success) {
Taro.setNavigationBarTitle({ Taro.setNavigationBarTitle({
title: res.data.name title: res.data.name,
}) })
setColorInfo(res.data) setColorInfo(res.data)
} }
@ -47,7 +45,6 @@ export default () => {
return colorInfo.product_color_list return colorInfo.product_color_list
}, [colorInfo]) }, [colorInfo])
//获取选中的id //获取选中的id
const [ids, setIds] = useState<number[]>([]) const [ids, setIds] = useState<number[]>([])
const getSelectIds = useCallback((val) => { const getSelectIds = useCallback((val) => {
@ -81,7 +78,6 @@ export default () => {
} }
}, [ids, colorInfo]) }, [ids, colorInfo])
const [collectionShow, setCollectionShow] = useState(false) const [collectionShow, setCollectionShow] = useState(false)
const closeCollection = useCallback(() => { const closeCollection = useCallback(() => {
setCollectionShow(false) setCollectionShow(false)
@ -91,7 +87,11 @@ export default () => {
const { fetchData: fetchDataMoveFavoriteProduct } = MoveFavoriteProductApi() const { fetchData: fetchDataMoveFavoriteProduct } = MoveFavoriteProductApi()
const onAdd = async (val) => { const onAdd = async (val) => {
if (ids.length == 0) return alert.none('请选择要移动面料') if (ids.length == 0) return alert.none('请选择要移动面料')
let res = await fetchDataMoveFavoriteProduct({source_favorite_id: searchData.id ,target_favorite_id: val.id, product_id:ids}) let res = await fetchDataMoveFavoriteProduct({
source_favorite_id: searchData.id,
target_favorite_id: val.id,
product_id: ids,
})
if (res.success) { if (res.success) {
getFavoriteInfo() getFavoriteInfo()
setCollectionShow(false) setCollectionShow(false)
@ -115,13 +115,12 @@ export default () => {
alert.none('已取消收藏') alert.none('已取消收藏')
} }
} }
} }
return ( return (
<View className={styles.collection_main}> <View className={styles.collection_main}>
<View className={styles.search}> <View className={styles.search}>
<Search style={{width: '100%'}} debounceTime={300} changeOnSearch={onSearch} placeholder="请输入面料关键词" /> <Search style={{ width: '100%' }} debounceTime={300} changeOnSearch={onSearch} placeholder='请输入面料关键词' />
</View> </View>
<View className={styles.operation}> <View className={styles.operation}>
<View className={styles.operation_check}> <View className={styles.operation_check}>
@ -129,8 +128,12 @@ export default () => {
<Text className={styles.allSelect}>全选</Text> <Text className={styles.allSelect}>全选</Text>
</View> </View>
<View className={styles.operation_check_right}> <View className={styles.operation_check_right}>
<Text className={styles.operation_check_move} onClick={() => setCollectionShow(true)}>移动到</Text> <Text className={styles.operation_check_move} onClick={() => setCollectionShow(true)}>
<Text className={styles.operation_check_cancel} onClick={delCollectioin}>取消收藏</Text> 移动到
</Text>
<Text className={styles.operation_check_cancel} onClick={delCollectioin}>
取消收藏
</Text>
</View> </View>
</View> </View>
<View className={styles.class_list}> <View className={styles.class_list}>

61
src/pages/depositList/index.tsx
View File

@ -1,57 +1,58 @@
import AddressList from '@/components/AddressList'
import AddressList from "@/components/AddressList" import InfiniteScrollPaging from '@/components/InfiniteScrollPaging'
import InfiniteScrollPaging from "@/components/InfiniteScrollPaging" import { Button, Canvas, ScrollView, Text, View } from '@tarojs/components'
import { Button, Canvas, ScrollView, Text, View } from "@tarojs/components" import Taro, { useReady } from '@tarojs/taro'
import Taro, { useReady } from "@tarojs/taro" import { useCallback, useEffect, useState } from 'react'
import { useCallback, useEffect, useState } from "react" import { depositListApi } from '@/api/deposit'
import { depositListApi } from "@/api/deposit" import './index.scss'
import "./index.scss" import { formatDateTime, formatPriceDiv } from '@/common/fotmat'
import { formatDateTime, formatPriceDiv } from "@/common/fotmat" import useLogin from '@/use/useLogin'
import useLogin from "@/use/useLogin"
export default () => { export default () => {
useLogin() useLogin()
const {fetchData, state} = depositListApi(); const { fetchData, state } = depositListApi()
// 渲染（数据） // 渲染（数据）
const [data, setData] = useState({ const [data, setData] = useState({
list: [], list: [],
total: 0 total: 0,
}); })
// 数据更新 // 数据更新
const handleChange = useCallback((result) => { const handleChange = useCallback((result) => {
setData({ setData({
list: result.data.list, list: result.data.list,
total: result.data.total total: result.data.total,
}) })
}, []) }, [])
return ( return (
<View className="credit-used"> <View className='credit-used'>
<InfiniteScrollPaging fetchData={fetchData} change={handleChange}> <InfiniteScrollPaging fetchData={fetchData} change={handleChange}>
{ {data.list?.map((item, index) => {
data.list?.map((item,index)=>{ let res: any = item
return ( return (
<View key={index} className="credit-used-list"> res.amount_received_this_time != 0 && (
<View className="credit-used-list-left"> <View key={index} className='credit-used-list'>
<View className="credit-used-list-type">{(item as any).type_name}</View> <View className='credit-used-list-left'>
<View className="credit-used-list-date">{formatDateTime((item as any).create_time)}</View> <View className='credit-used-list-type'>{res.type_name}</View>
<View className='credit-used-list-date'>{formatDateTime(res.create_time)}</View>
</View> </View>
<View className="credit-used-list-right"> <View className='credit-used-list-right'>
<View className="credit-used-list-right-price"> <View className='credit-used-list-right-price'>
<View className={`credit-used-list-price ${[1,2,3].includes((item as any).type as never)?'red':'green'}`}> <View
{[1,2,3].includes((item as any).type as never)?"+":"-"}{formatPriceDiv((item as any).amount_received_this_time)} 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>
{/* <View className="credit-used-list-orderno">处理中</View> */} {/* <View className="credit-used-list-orderno">处理中</View> */}
</View> </View>
<Text className="iconfont icon-a-moreback"></Text> <Text className='iconfont icon-a-moreback'></Text>
</View> </View>
</View> </View>
) )
}) )
} })}
{/* {data.length>0&&<View className="credit-used-list"></View>} */} {/* {data.length>0&&<View className="credit-used-list"></View>} */}
<View className="credit-used-list"></View> <View className='credit-used-list'></View>
</InfiniteScrollPaging> </InfiniteScrollPaging>
</View> </View>
) )

27
src/pages/index/index.tsx
View File

@ -14,7 +14,6 @@ import useLogin from '@/use/useLogin'
import { dataLoadingStatus } from '@/common/util' import { dataLoadingStatus } from '@/common/util'
export default () => { export default () => {
useLogin() useLogin()
useEffect(() => { useEffect(() => {
categoryList() categoryList()
@ -29,7 +28,6 @@ export default () => {
setKindData({ ...kindData, list: res.data.list, defaultId: res.data.list[0].id }) setKindData({ ...kindData, list: res.data.list, defaultId: res.data.list[0].id })
setFiltrate({ ...filtrate, product_kind_id: res.data.list[0].id }) setFiltrate({ ...filtrate, product_kind_id: res.data.list[0].id })
} }
} }
//获取面料列表 //获取面料列表
@ -46,17 +44,14 @@ export default () => {
} }
//监听查询条件 //监听查询条件
useEffect(() => { useEffect(() => {
if (filtrate.product_kind_id) if (filtrate.product_kind_id) getProductList()
getProductList()
}, [filtrate]) }, [filtrate])
//点击面料类型 //点击面料类型
const getProductKindId = useCallback((e) => { const getProductKindId = useCallback((e) => {
pageNum.current.page = 1 pageNum.current.page = 1
setProductData({ list: [], total: 0 }) setProductData({ list: [], total: 0 })
setFiltrate((list) => ({ ...list, size: 5, product_kind_id: e.id })) setFiltrate((list) => ({ ...list, size: 5, product_kind_id: e.id }))
// setHasMore(true)
}, []) }, [])
//上拉加载数据 //上拉加载数据
@ -70,7 +65,6 @@ export default () => {
} }
}, [productData]) }, [productData])
const [showShopCart, setShowShopCart] = useState(false) const [showShopCart, setShowShopCart] = useState(false)
//列表下拉刷新 //列表下拉刷新
@ -87,27 +81,36 @@ export default () => {
return dataLoadingStatus({ list: productData.list, total: productData.total, status: productState.loading }) return dataLoadingStatus({ list: productData.list, total: productData.total, status: productState.loading })
}, [productData, productState.loading]) }, [productData, productState.loading])
return ( return (
<MoveBtn onClick={() => setShowShopCart(!showShopCart)}> <MoveBtn onClick={() => setShowShopCart(!showShopCart)}>
<View className={styles.main}> <View className={styles.main}>
<Banner /> <Banner />
<View className={styles.search}> <View className={styles.search}>
<View className={styles.search_collect} onClick={() => goLink('/pages/collection/index')}>我的收藏</View> <View className={styles.search_collect} onClick={() => goLink('/pages/collection/index')}>
我的收藏
</View>
<View className={styles.search_input} onClick={() => goLink('/pages/searchList/search')}> <View className={styles.search_input} onClick={() => goLink('/pages/searchList/search')}>
<Search disabled={true} style={{ width: '263rpx' }} /> <Search disabled={true} style={{ width: '263rpx' }} />
</View> </View>
</View> </View>
<View className={styles.products}> <View className={styles.products}>
<SideBar list={kindData.list} height="100%" defaultValue={kindData.defaultId} hasMore={hasMore} statusMore={statusMore} selfOnScrolltolower={getScrolltolower} sideBarOnClick={getProductKindId} heightItem={150} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={() => getRefresherRefresh()}> <SideBar
list={kindData.list}
height='100%'
defaultValue={kindData.defaultId}
hasMore={hasMore}
statusMore={statusMore}
selfOnScrolltolower={getScrolltolower}
sideBarOnClick={getProductKindId}
heightItem={150}
refresherTriggered={refresherTriggeredStatus}
selfOnRefresherRefresh={() => getRefresherRefresh()}>
<Product productList={productData.list} /> <Product productList={productData.list} />
</SideBar> </SideBar>
</View> </View>
<View className='common_safe_area_y'></View> <View className='common_safe_area_y'></View>
<ShopCart show={showShopCart} onClose={() => setShowShopCart(false)} /> <ShopCart show={showShopCart} onClose={() => setShowShopCart(false)} />
</View> </View>
</MoveBtn> </MoveBtn>
) )
} }

7
src/pages/order/comfirm.module.scss
View File

@ -20,7 +20,7 @@
font-weight: 700; font-weight: 700;
} }
.order_status { .order_status {
background-color: #F0F0F0; background-color: #f0f0f0;
width: 148px; width: 148px;
height: 55px; height: 55px;
color: $color_font_three; color: $color_font_three;
@ -51,7 +51,8 @@
font-size: $font_size; font-size: $font_size;
font-weight: 700; font-weight: 700;
} }
.order_desc_text, .order_desc_text_hint{ .order_desc_text,
.order_desc_text_hint {
font-size: $font_size_medium; font-size: $font_size_medium;
margin-right: 10px; margin-right: 10px;
flex: 1; flex: 1;
@ -111,7 +112,6 @@
font-size: $font_size; font-size: $font_size;
font-weight: 700; font-weight: 700;
margin-bottom: 20px; margin-bottom: 20px;
} }
.order_num { .order_num {
display: flex; display: flex;
@ -128,6 +128,5 @@
text { text {
font-size: $font_size; font-size: $font_size;
} }
} }
} }

77
src/pages/order/comfirm.tsx
View File

@ -1,39 +1,41 @@
import { SaleOrderPreViewApi, SaleOrderApi } from "@/api/order"; import { SaleOrderPreViewApi, SaleOrderApi } from '@/api/order'
import { formatPriceDiv } from "@/common/fotmat"; import { formatPriceDiv } from '@/common/fotmat'
import Popup from "@/components/popup"; import Popup from '@/components/popup'
import { View } from "@tarojs/components" import { View } from '@tarojs/components'
import Taro, { useDidShow, usePullDownRefresh} from "@tarojs/taro"; import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro'
import classnames from "classnames"; import classnames from 'classnames'
import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import KindList from "./components/kindList"; import KindList from './components/kindList'
import Remark from "./components/remark"; import Remark from './components/remark'
import styles from './comfirm.module.scss' import styles from './comfirm.module.scss'
import { getParam } from "@/common/system"; import { getParam } from '@/common/system'
import { alert, goLink } from "@/common/common"; import { alert, goLink } from '@/common/common'
import SubmitOrderBtn from "./components/submitOrderBtn"; import SubmitOrderBtn from './components/submitOrderBtn'
import AddressInfoDetail from "./components/addressInfoDetail"; import AddressInfoDetail from './components/addressInfoDetail'
import { SubscriptionMessageApi } from "@/api/user"; import { SubscriptionMessageApi } from '@/api/user'
import { SUBSCRIPTION_MESSAGE_SCENE } from "@/common/enum"; import { SUBSCRIPTION_MESSAGE_SCENE } from '@/common/enum'
import { UseSubscriptionMessage } from "@/use/useCommon"; import { UseSubscriptionMessage } from '@/use/useCommon'
import { throttle } from "@/common/util"; import { throttle } from '@/common/util'
export default () => { export default () => {
const [showDesc, setShowDesc] = useState(false) const [showDesc, setShowDesc] = useState(false)
//下单信息 //下单信息
type OrderParams = {address_id?: number, remark?: string, sale_mode?: number, shipment_mode?: number, list?: any[]} type OrderParams = { address_id?: number; remark?: string; sale_mode?: number; shipment_mode?: number; list?: any[] }
const [submitOrderData, setSubmitOrderData] = useState<OrderParams>() const [submitOrderData, setSubmitOrderData] = useState<OrderParams>()
//获取购物车传过来的id //获取购物车传过来的id
type orderPreParam = {shopping_cart_product_color_list:{shopping_cart_product_color_id:number}[], sale_mode:number} type orderPreParam = {
shopping_cart_product_color_list: { shopping_cart_product_color_id: number }[]
sale_mode: number
}
const param = getParam() const param = getParam()
const idsAndSaleModel = useRef<orderPreParam>({ shopping_cart_product_color_list: [], sale_mode: 0 }) const idsAndSaleModel = useRef<orderPreParam>({ shopping_cart_product_color_list: [], sale_mode: 0 })
useDidShow(async () => { useDidShow(async () => {
idsAndSaleModel.current = { shopping_cart_product_color_list: [], sale_mode: 0 } //初始化 idsAndSaleModel.current = { shopping_cart_product_color_list: [], sale_mode: 0 } //初始化
idsAndSaleModel.current.sale_mode = Number(param?.sale_mode) idsAndSaleModel.current.sale_mode = Number(param?.sale_mode)
param?.ids?.split('-')?.map(item => { param?.ids?.split('-')?.map((item) => {
return idsAndSaleModel.current.shopping_cart_product_color_list?.push({ return idsAndSaleModel.current.shopping_cart_product_color_list?.push({
shopping_cart_product_color_id: Number(item) shopping_cart_product_color_id: Number(item),
}) })
}) })
getSaleOrderPreView() getSaleOrderPreView()
@ -55,7 +57,11 @@ import { throttle } from "@/common/util";
if (preViewOrder) { if (preViewOrder) {
formatData() formatData()
getDataList() getDataList()
setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id, shipment_mode:preViewOrder.shipment_mode||2})) setSubmitOrderData((val) => ({
...val,
address_id: preViewOrder.default_address.id,
shipment_mode: preViewOrder.shipment_mode || 2,
}))
} }
}, [preViewOrder]) }, [preViewOrder])
@ -72,7 +78,7 @@ import { throttle } from "@/common/util";
unit: preViewOrder.sale_mode == 0 ? '条' : 'm', //单位 unit: preViewOrder.sale_mode == 0 ? '条' : 'm', //单位
list: preViewOrder.product_list, list: preViewOrder.product_list,
total_should_collect_money: preViewOrder.total_should_collect_money, //应收金额 total_should_collect_money: preViewOrder.total_should_collect_money, //应收金额
total_sale_price: preViewOrder.total_sale_price //合计金额 total_sale_price: preViewOrder.total_sale_price, //合计金额
}) })
} }
const formatPreViewOrderMemo = useMemo(() => { const formatPreViewOrderMemo = useMemo(() => {
@ -99,8 +105,8 @@ import { throttle } from "@/common/util";
//获取提交格式数据列表 //获取提交格式数据列表
const getDataList = () => { const getDataList = () => {
let list: { shopping_cart_product_color_id: number }[] = [] let list: { shopping_cart_product_color_id: number }[] = []
preViewOrder.product_list?.map(item => { preViewOrder.product_list?.map((item) => {
item.product_colors?.map(colorItem => { item.product_colors?.map((colorItem) => {
list.push({ shopping_cart_product_color_id: colorItem.id }) list.push({ shopping_cart_product_color_id: colorItem.id })
}) })
}) })
@ -130,7 +136,7 @@ import { throttle } from "@/common/util";
//数量格式 //数量格式
const numText = useMemo(() => { const numText = useMemo(() => {
if (formatPreViewOrder) { if (formatPreViewOrder) {
let total_number = formatPreViewOrder?.sale_mode == 0?formatPreViewOrder?.total_number:(formatPreViewOrder?.total_number/100) let total_number = formatPreViewOrder?.sale_mode == 0 ? formatPreViewOrder?.total_number : formatPreViewOrder?.total_number / 100
return `${formatPreViewOrder?.total_fabrics} 种面料，${formatPreViewOrder?.total_colors} 种颜色，共 ${total_number} ${formatPreViewOrder?.unit}` return `${formatPreViewOrder?.total_fabrics} 种面料，${formatPreViewOrder?.total_colors} 种颜色，共 ${total_number} ${formatPreViewOrder?.unit}`
} }
}, [formatPreViewOrder]) }, [formatPreViewOrder])
@ -178,23 +184,26 @@ import { throttle } from "@/common/util";
<KindList order={formatPreViewOrderMemo} comfirm={true} /> <KindList order={formatPreViewOrderMemo} comfirm={true} />
<View className={styles.order_desc} onClick={() => setShowDesc(true)}> <View className={styles.order_desc} onClick={() => setShowDesc(true)}>
<View className={styles.order_desc_con}>订单备注</View> <View className={styles.order_desc_con}>订单备注</View>
{ {(submitOrderData?.remark && <View className={styles.order_desc_text}>{submitOrderData?.remark}</View>) || <View className={styles.order_desc_text_hint}>填写备注</View>}
submitOrderData?.remark&&<View className={styles.order_desc_text}>{submitOrderData?.remark}</View>||
<View className={styles.order_desc_text_hint}>填写备注</View>
}
<View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View> <View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View>
</View> </View>
<View className={styles.submit_order}> <View className={styles.submit_order}>
<View className={styles.submit_order_number}> <View className={styles.submit_order_number}>
<SubmitOrderBtn style={{color:'#007AFF'}} number={(preViewOrder?.sale_mode == 1?formatPreViewOrder?.total_should_collect_money:formatPreViewOrder?.estimate_amount)/100} priceTitle={preViewOrder?.sale_mode == 1?'合计金额':'预估金额'}/> <SubmitOrderBtn
style={{ color: '#007AFF' }}
number={(preViewOrder?.sale_mode == 1 ? formatPreViewOrder?.total_should_collect_money : formatPreViewOrder?.estimate_amount) / 100}
priceTitle={preViewOrder?.sale_mode == 1 ? '合计金额' : '预估金额'}
/>
<View className={styles.order_number_desc}>{numText}</View> <View className={styles.order_number_desc}>{numText}</View>
</View> </View>
<View className={classnames(styles.order_btn, btnStatus&&styles.ok_order_btn)} onClick={() => submitOrderEven()}>提交订单</View> <View className={classnames(styles.order_btn, btnStatus && styles.ok_order_btn)} onClick={() => submitOrderEven()}>
提交订单
</View>
</View> </View>
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}> <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
<Remark defaultValue={submitOrderData?.remark} onSave={(e) => getRemark(e)} /> <Remark defaultValue={submitOrderData?.remark} onSave={(e) => getRemark(e)} />
</Popup> </Popup>
<View className="common_safe_area_y"></View> <View className='common_safe_area_y'></View>
</View> </View>
) )
} }

147
src/pages/order/components/kindList/index.tsx
View File

@ -1,36 +1,35 @@
import { ORDER_STATUS } from "@/common/enum" import { ORDER_STATUS } from '@/common/enum'
import { formatHashTag, formatPriceDiv, formatWeightDiv } from "@/common/fotmat" import { formatHashTag, formatPriceDiv, formatWeightDiv } from '@/common/fotmat'
import EstimatedAmount from "@/components/estimatedAmount" import EstimatedAmount from '@/components/estimatedAmount'
import LabAndImg from "@/components/LabAndImg" import LabAndImg from '@/components/LabAndImg'
import { Text, View } from "@tarojs/components" import { Text, View } from '@tarojs/components'
import { memo, useCallback, useMemo, useState } from "react" import { memo, useCallback, useMemo, useState } from 'react'
import styles from './index.module.scss' import styles from './index.module.scss'
type OrderParam = { type OrderParam = {
estimate_amount: number, //预估金额 estimate_amount: number //预估金额
list: any[], list: any[]
sale_mode: number, sale_mode: number
sale_mode_name: string, sale_mode_name: string
unit: string, unit: string
total_colors: number, total_colors: number
total_fabrics: number, total_fabrics: number
total_number: number, total_number: number
status: number, //订单状态 status: number //订单状态
total_sale_price: number, //合计金额 total_sale_price: number //合计金额
total_weight_error_discount: number, //空差优惠 total_weight_error_discount: number //空差优惠
the_previous_status: number, //取消订单时的订单状态 the_previous_status: number //取消订单时的订单状态
actual_amount: number, //实付金额 actual_amount: number //实付金额
wait_pay_amount: number, //待付金额 wait_pay_amount: number //待付金额
refund_amount: number //退款金额 refund_amount: number //退款金额
} }
type Param = { type Param = {
order: OrderParam, order: OrderParam
comfirm?: boolean //是否是确认订单页面使用 comfirm?: boolean //是否是确认订单页面使用
} }
export default memo(({ order, comfirm = false }: Param) => { export default memo(({ order, comfirm = false }: Param) => {
const { const {
SaleOrderStatusBooking, // 待接单 SaleOrderStatusBooking, // 待接单
SaleOrderStatusArranging, // 配布中 SaleOrderStatusArranging, // 配布中
@ -43,11 +42,17 @@ export default memo(({order, comfirm = false}:Param) => {
SaleOrderStatusRefund, // 已退款 SaleOrderStatusRefund, // 已退款
SaleOrderStatusCancel, // 已取消 SaleOrderStatusCancel, // 已取消
SaleorderstatusWaitingPrePayment, // 预付款 SaleorderstatusWaitingPrePayment, // 预付款
SaleOrderStatusTaking //提货 SaleOrderStatusTaking, //提货
} = ORDER_STATUS } = ORDER_STATUS
//注册金额 //注册金额
type orderPriceListParams = {id: number, label: string, field: string, message: string, validatarFunc: (val: typeof order) => any} type orderPriceListParams = {
id: number
label: string
field: string
message: string
validatarFunc: (val: typeof order) => any
}
const priceList: orderPriceListParams[] = [ const priceList: orderPriceListParams[] = [
{ {
id: 1, id: 1,
@ -56,7 +61,7 @@ export default memo(({order, comfirm = false}:Param) => {
message: '预估金额按生产商定义的标准匹重计算，仅供参考。详细交易金额以出单为准！', message: '预估金额按生产商定义的标准匹重计算，仅供参考。详细交易金额以出单为准！',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['estimate_amount'] > 0 && order['total_sale_price'] <= 0 return order['estimate_amount'] > 0 && order['total_sale_price'] <= 0
} },
}, },
{ {
id: 2, id: 2,
@ -65,7 +70,7 @@ export default memo(({order, comfirm = false}:Param) => {
message: '包含空差的货款金额', message: '包含空差的货款金额',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['total_sale_price'] > 0 return order['total_sale_price'] > 0
} },
}, },
{ {
id: 3, id: 3,
@ -74,7 +79,7 @@ export default memo(({order, comfirm = false}:Param) => {
message: '扣除空差金额', message: '扣除空差金额',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['total_weight_error_discount'] > 0 return order['total_weight_error_discount'] > 0
} },
}, },
{ {
id: 5, id: 5,
@ -83,7 +88,7 @@ export default memo(({order, comfirm = false}:Param) => {
message: '本单实付总金额', message: '本单实付总金额',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['actual_amount'] > 0 return order['actual_amount'] > 0
} },
}, },
{ {
id: 4, id: 4,
@ -92,7 +97,7 @@ export default memo(({order, comfirm = false}:Param) => {
message: '扣除空差后的货款金额', message: '扣除空差后的货款金额',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['wait_pay_amount'] > 0 return order['wait_pay_amount'] > 0
} },
}, },
{ {
id: 6, id: 6,
@ -101,9 +106,8 @@ export default memo(({order, comfirm = false}:Param) => {
message: '已退款金额', message: '已退款金额',
validatarFunc: (order) => { validatarFunc: (order) => {
return order['refund_amount'] > 0 return order['refund_amount'] > 0
}
}, },
},
] ]
//订单流程金额展示 //订单流程金额展示
@ -111,28 +115,32 @@ export default memo(({order, comfirm = false}:Param) => {
if (!order) return if (!order) return
return ( return (
<> <>
{ {priceList.map((item) => {
priceList.map(item => {
return <>{item.validatarFunc(order) && <EstimatedAmount key={item.id} number={order[item.field]} title={item.label} messageTitle={item.message} />}</> return <>{item.validatarFunc(order) && <EstimatedAmount key={item.id} number={order[item.field]} title={item.label} messageTitle={item.message} />}</>
}) })}
}
</> </>
) )
}, [order]) }, [order])
//对应数量 //对应数量
const formatCount = useCallback((item) => { const formatCount = useCallback(
(item) => {
return order?.sale_mode == 0 ? item.roll : Number(item.length / 100) return order?.sale_mode == 0 ? item.roll : Number(item.length / 100)
}, [order]) },
[order],
)
//对应单价 //对应单价
const standardPrice = useCallback(price => { const standardPrice = useCallback(
(price) => {
return formatPriceDiv(price) + '/' + (order?.sale_mode == 1 ? 'm' : 'kg') return formatPriceDiv(price) + '/' + (order?.sale_mode == 1 ? 'm' : 'kg')
}, [order]) },
[order],
)
//数量格式 //数量格式
const numText = useMemo(() => { const numText = useMemo(() => {
if (order) { if (order) {
let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100) let total_number = order?.sale_mode == 0 ? order?.total_number : order?.total_number / 100
return `${order?.total_fabrics} 种面料，${order?.total_colors} 种颜色，共 ${total_number} ${order?.unit}` return `${order?.total_fabrics} 种面料，${order?.total_colors} 种颜色，共 ${total_number} ${order?.unit}`
} }
}, [order]) }, [order])
@ -150,45 +158,57 @@ export default memo(({order, comfirm = false}:Param) => {
}, [order]) }, [order])
//颜色金额小计 //颜色金额小计
const colorPrice = useCallback((item) => { const colorPrice = useCallback(
(item) => {
let res = item.total_sale_price || item.estimate_amount let res = item.total_sale_price || item.estimate_amount
return formatPriceDiv(res, 100, true) return formatPriceDiv(res, 100, true)
},[order]) },
[order],
)
//散剪大约重量 //散剪大约重量
const aboutWeight = useCallback((weight) => { const aboutWeight = useCallback(
(weight) => {
if (order.sale_mode == 2) { if (order.sale_mode == 2) {
let showWeight = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value].includes(order.status) let showWeight = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value].includes(order.status)
return showWeight?<View className={styles.order_list_item_price_dg}>; <Text>≈{formatWeightDiv(weight)}kg</Text></View>:<></> return showWeight ? (
<View className={styles.order_list_item_price_dg}>
; <Text>≈{formatWeightDiv(weight)}kg</Text>
</View>
) : (
<></>
)
} }
return <></> return <></>
}, [order]) },
[order],
)
return ( return (
<> <>
<View className={styles.orders_list_title}>{numText}</View> <View className={styles.orders_list_title}>{numText}</View>
<View className={styles.orders_list_con}> <View className={styles.orders_list_con}>
{ {order?.list?.map((item) => {
order?.list?.map(item => { return (
return <View key={item.product_code} className={styles.order_list}> <View key={item.product_code} className={styles.order_list}>
<View className={styles.order_list_title}> <View className={styles.order_list_title}>
<View className={styles.tag}>{order.sale_mode_name}</View> <View className={styles.tag}>{order.sale_mode_name}</View>
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View> <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
<View className={styles.num}>共{item?.product_colors.length}种</View> <View className={styles.num}>共{item?.product_colors.length}种</View>
</View> </View>
<View className={styles.order_list_scroll}> <View className={styles.order_list_scroll}>
{item?.product_colors?.map(colorItem => { {item?.product_colors?.map((colorItem) => {
return <View key={colorItem.id} className={styles.order_list_item}> return (
<View key={colorItem.id} className={styles.order_list_item}>
<View className={styles.order_list_item_img}> <View className={styles.order_list_item_img}>
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/> <LabAndImg value={{ lab: colorItem.lab, rgb: colorItem.rgb, texture_url: colorItem.texture_url }} showStatus={false} />
</View> </View>
<View className={styles.order_list_item_con}> <View className={styles.order_list_item_con}>
<View className={styles.order_list_item_des}> <View className={styles.order_list_item_des}>
<View className={styles.order_list_item_title}> <View className={styles.order_list_item_title}>
{colorItem.code + ' ' + colorItem.name} {colorItem.code + ' ' + colorItem.name}
{(colorItem?.return_roll > 0)&&<Text>{`已退${colorItem?.return_roll}条`}</Text>} {colorItem?.return_roll > 0 && <Text>{`已退${colorItem?.return_roll}条`}</Text>}
{(colorItem?.apply_return_roll > 0)&&<Text>{`待退${colorItem?.apply_return_roll}条`}</Text>} {colorItem?.apply_return_roll > 0 && <Text>{`待退${colorItem?.apply_return_roll}条`}</Text>}
</View> </View>
<View className={styles.order_list_item_price}> <View className={styles.order_list_item_price}>
¥{standardPrice(colorItem.sale_price)} ¥{standardPrice(colorItem.sale_price)}
@ -196,19 +216,24 @@ export default memo(({order, comfirm = false}:Param) => {
</View> </View>
</View> </View>
<View className={styles.order_list_item_count}> <View className={styles.order_list_item_count}>
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View> <View className={styles.count_num}>
<View className={styles.count_price}><text>¥</text>{colorPrice(colorItem)}</View> ×{formatCount(colorItem)}
<text>{order.unit}</text>
</View>
<View className={styles.count_price}>
<text>¥</text>
{colorPrice(colorItem)}
</View> </View>
</View> </View>
</View> </View>
</View>
)
})} })}
</View> </View>
</View> </View>
}) )
} })}
<View className={styles.order_estimated_amount}> <View className={styles.order_estimated_amount}>{showPriceConDom}</View>
{showPriceConDom}
</View>
</View> </View>
</> </>
) )

94
src/pages/order/components/scanPay/index.tsx
View File

@ -1,34 +1,33 @@
import { Image, ScrollView, Text, View } from "@tarojs/components"; import { Image, ScrollView, Text, View } from '@tarojs/components'
import { memo, useEffect, useRef, useState } from "react"; import { memo, useEffect, useRef, useState } from 'react'
import classnames from "classnames"; import classnames from 'classnames'
import styles from './index.module.scss' import styles from './index.module.scss'
import Popup from "@/components/popup"; import Popup from '@/components/popup'
import Taro from "@tarojs/taro"; import Taro from '@tarojs/taro'
import { alert } from "@/common/common"; import { alert } from '@/common/common'
import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from "@/common/fotmat"; import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/fotmat'
import useCheckAuthorize from "@/use/useCheckAuthorize"; import useCheckAuthorize from '@/use/useCheckAuthorize'
import { GetPayCode } from "@/api/onlinePay"; import { GetPayCode } from '@/api/onlinePay'
import LoadingCard from "@/components/loadingCard"; import LoadingCard from '@/components/loadingCard'
type Param = { type Param = {
show?: true|false, show?: true | false
onClose?: () => void, onClose?: () => void
company?: string, company?: string
qrcode?: string, qrcode?: string
orderInfo?: any, orderInfo?: any
} }
type ListParam = { type ListParam = {
product_code: string, product_code: string
product_name: string, product_name: string
product_color_code: string, product_color_code: string
product_color_name: string, product_color_name: string
num: string, num: string
weight: string, weight: string
length: string, length: string
sale_price: string, sale_price: string
total_price: string total_price: string
weight_error: string
} }
export default memo(({ show = true, onClose, company, orderInfo }: Param) => { export default memo(({ show = true, onClose, company, orderInfo }: Param) => {
const [detail, setDetail] = useState<any>() const [detail, setDetail] = useState<any>()
@ -36,8 +35,8 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
useEffect(() => { useEffect(() => {
if (orderInfo) { if (orderInfo) {
let lists: ListParam[] = [] let lists: ListParam[] = []
orderInfo.product_list?.map(pitem => { orderInfo.product_list?.map((pitem) => {
pitem?.product_colors?.map(citem => { pitem?.product_colors?.map((citem) => {
lists.push({ lists.push({
product_code: formatHashTag(pitem.code, '', 'name')!, product_code: formatHashTag(pitem.code, '', 'name')!,
product_name: pitem.name, product_name: pitem.name,
@ -48,11 +47,12 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
weight: formatWeightDiv(citem.actual_weight || citem.estimate_weight).toString(), weight: formatWeightDiv(citem.actual_weight || citem.estimate_weight).toString(),
sale_price: formatPriceDiv(citem.sale_price).toString(), sale_price: formatPriceDiv(citem.sale_price).toString(),
total_price: formatPriceDiv(citem.estimate_amount).toString(), total_price: formatPriceDiv(citem.estimate_amount).toString(),
weight_error: formatWeightDiv(citem.weight_error).toString(),
}) })
}) })
}) })
setDetail(() => ({ setDetail(() => ({
title: "面料销售电子确认单", title: '面料销售电子确认单',
company: orderInfo.company_name, //后端公司 company: orderInfo.company_name, //后端公司
order_type: orderInfo.sale_mode_name, //类型：大货 order_type: orderInfo.sale_mode_name, //类型：大货
sale_user: orderInfo.sale_user_name, //业务员 sale_user: orderInfo.sale_user_name, //业务员
@ -65,17 +65,16 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
pay_account: orderInfo.offline_remittance_information?.transfer_remittance_account, //专属收款账号 pay_account: orderInfo.offline_remittance_information?.transfer_remittance_account, //专属收款账号
bank_account_name: orderInfo.offline_remittance_information?.account_name, //账户名称 bank_account_name: orderInfo.offline_remittance_information?.account_name, //账户名称
bank_name: orderInfo.offline_remittance_information?.bank_of_deposit, //开户银行 bank_name: orderInfo.offline_remittance_information?.bank_of_deposit, //开户银行
pay_type:"", //支付方式, 可不传 pay_type: '', //支付方式, 可不传
client: orderInfo.purchaser_name, //客户名称 client: orderInfo.purchaser_name, //客户名称
phone: userPhone(orderInfo), //收货手机号码 phone: userPhone(orderInfo), //收货手机号码
order_total_length: (orderInfo.total_number / 100).toString(), //订单布匹长度 order_total_length: (orderInfo.total_number / 100).toString(), //订单布匹长度
order_total_price: formatPriceDiv(orderInfo.bill_total_sale_price).toString(), //订单价格 order_total_price: formatPriceDiv(orderInfo.bill_total_sale_price).toString(), //订单价格
order_total_num: (orderInfo.total_number) + '', order_total_num: orderInfo.total_number + '',
qrcode:"", //跳转链接 qrcode: '', //跳转链接
order_total_weight: formatWeightDiv(orderInfo.total_weight || orderInfo.total_estimate_weight).toString(), //订单布匹重量 order_total_weight: formatWeightDiv(orderInfo.total_weight || orderInfo.total_estimate_weight).toString(), //订单布匹重量
list: lists, list: lists,
show_qrcode: true, //是否显示码单 show_qrcode: true, //是否显示码单
estimate_amount: formatPriceDiv(orderInfo.estimate_amount).toString(), estimate_amount: formatPriceDiv(orderInfo.estimate_amount).toString(),
show_estimate_amount: orderInfo.estimate_amount > 0 && orderInfo.total_sale_price <= 0, show_estimate_amount: orderInfo.estimate_amount > 0 && orderInfo.total_sale_price <= 0,
total_sale_price: formatPriceDiv(orderInfo.total_sale_price).toString(), total_sale_price: formatPriceDiv(orderInfo.total_sale_price).toString(),
@ -86,7 +85,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
show_actual_amount: orderInfo.actual_amount > 0, show_actual_amount: orderInfo.actual_amount > 0,
wait_pay_amount: formatPriceDiv(orderInfo.wait_pay_amount).toString(), wait_pay_amount: formatPriceDiv(orderInfo.wait_pay_amount).toString(),
show_wait_pay_amount: orderInfo.wait_pay_amount > 0, show_wait_pay_amount: orderInfo.wait_pay_amount > 0,
show_barcode: true show_barcode: true,
})) }))
} }
}, [orderInfo]) }, [orderInfo])
@ -110,12 +109,11 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
return addressInfo?.shipment_mode == 2 ? orderInfo.target_user_phone : orderInfo.take_goods_phone return addressInfo?.shipment_mode == 2 ? orderInfo.target_user_phone : orderInfo.take_goods_phone
} }
//获取支付二维码 //获取支付二维码
const [payCodeImage, setPayCodeImage] = useState<string>('') const [payCodeImage, setPayCodeImage] = useState<string>('')
const fileData = useRef({ const fileData = useRef({
filePath: '', filePath: '',
base64: '' base64: '',
}) })
const { fetchData, state } = GetPayCode() const { fetchData, state } = GetPayCode()
const getCore = async () => { const getCore = async () => {
@ -123,7 +121,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
const base64 = res.data.base64 const base64 = res.data.base64
setPayCodeImage(() => base64) setPayCodeImage(() => base64)
const time = new Date().valueOf() const time = new Date().valueOf()
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []; const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []
let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format
fileData.current.filePath = filePath fileData.current.filePath = filePath
fileData.current.base64 = bodyData fileData.current.base64 = bodyData
@ -135,12 +133,14 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
}) })
} }
useEffect(() => { useEffect(() => {
if(show) if (show) getCore()
getCore()
}, [show]) }, [show])
//检查是否开启保存图片权限 //检查是否开启保存图片权限
const {check} = useCheckAuthorize({scope:'scope.writePhotosAlbum', msg:'您没授权，无法保存图片'}) const { check } = useCheckAuthorize({
scope: 'scope.writePhotosAlbum',
msg: '您没授权，无法保存图片',
})
const saveImageCheck = async () => { const saveImageCheck = async () => {
const res = await check() const res = await check()
res && saveImage() res && saveImage()
@ -156,7 +156,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
}, },
fail: function (err) { fail: function (err) {
console.log('err::', err) console.log('err::', err)
} },
}) })
} }
@ -165,7 +165,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
console.log('fileData.current.filePath::', fileData.current.filePath) console.log('fileData.current.filePath::', fileData.current.filePath)
Taro.previewImage({ Taro.previewImage({
current: fileData.current.filePath, // 当前显示 current: fileData.current.filePath, // 当前显示
urls: [fileData.current.filePath] // 需要预览的图片http链接列表 urls: [fileData.current.filePath], // 需要预览的图片http链接列表
}) })
} }
@ -181,15 +181,17 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
扫码支付成功后，自动更新状态 扫码支付成功后，自动更新状态
</View> </View>
<View className={styles.scanPay_list}> <View className={styles.scanPay_list}>
{(state.loading)&&<LoadingCard/>|| {(state.loading && <LoadingCard />) || (
<ScrollView scrollY className={styles.scanPay_list}> <ScrollView scrollY className={styles.scanPay_list}>
<Image mode="widthFix" src={payCodeImage} onClick={showImage}></Image> <Image mode='widthFix' src={payCodeImage} onClick={showImage}></Image>
</ScrollView>} </ScrollView>
)}
</View>
<View className={styles.btns} onClick={saveImageCheck}>
保存电子确认单
</View> </View>
<View className={styles.btns} onClick={saveImageCheck}>保存电子确认单</View>
</View> </View>
</Popup> </Popup>
</View> </View>
) )
}) })

83
src/pages/order/components/scanPayCheck/index.tsx
View File

@ -1,33 +1,32 @@
import { Image, ScrollView, Text, View } from "@tarojs/components"; import { Image, ScrollView, Text, View } from '@tarojs/components'
import { memo, useEffect, useRef, useState } from "react"; import { memo, useEffect, useRef, useState } from 'react'
import classnames from "classnames"; import classnames from 'classnames'
import styles from './index.module.scss' import styles from './index.module.scss'
import Popup from "@/components/popup"; import Popup from '@/components/popup'
import Taro from "@tarojs/taro"; import Taro from '@tarojs/taro'
import { alert } from "@/common/common"; import { alert } from '@/common/common'
import { formatDateTime, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from "@/common/fotmat"; import { formatDateTime, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/fotmat'
import useCheckAuthorize from "@/use/useCheckAuthorize"; import useCheckAuthorize from '@/use/useCheckAuthorize'
import { GetPayCode } from "@/api/onlinePay"; import { GetPayCode } from '@/api/onlinePay'
import LoadingCard from "@/components/loadingCard"; import LoadingCard from '@/components/loadingCard'
type Param = { type Param = {
show?: true|false, show?: true | false
onClose?: () => void, onClose?: () => void
company?: string, company?: string
qrcode?: string, qrcode?: string
orderInfo?: any, orderInfo?: any
} }
type ListParam = { type ListParam = {
product_code: string, product_code: string
product_name: string, product_name: string
product_color_code: string, product_color_code: string
product_color_name: string, product_color_name: string
num: string, num: string
weight: string, weight: string
length: string, length: string
sale_price: string, sale_price: string
total_price: string, total_price: string
weight_error: string weight_error: string
} }
export default memo(({ show = true, onClose, company, orderInfo }: Param) => { export default memo(({ show = true, onClose, company, orderInfo }: Param) => {
@ -42,8 +41,8 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
useEffect(() => { useEffect(() => {
if (orderInfo) { if (orderInfo) {
let lists: ListParam[] = [] let lists: ListParam[] = []
orderInfo.product_list?.map(pitem => { orderInfo.product_list?.map((pitem) => {
pitem?.product_colors?.map(citem => { pitem?.product_colors?.map((citem) => {
lists.push({ lists.push({
product_code: formatRemoveHashTag(pitem.code), product_code: formatRemoveHashTag(pitem.code),
product_name: pitem.name, product_name: pitem.name,
@ -54,12 +53,12 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
weight: formatWeightDiv(citem.actual_weight || citem.estimate_weight).toString(), weight: formatWeightDiv(citem.actual_weight || citem.estimate_weight).toString(),
sale_price: formatPriceDiv(citem.sale_price).toString(), sale_price: formatPriceDiv(citem.sale_price).toString(),
total_price: formatPriceDiv(citem.total_sale_price || citem.estimate_amount).toString(), total_price: formatPriceDiv(citem.total_sale_price || citem.estimate_amount).toString(),
weight_error: formatWeightDiv(citem.weight_error).toString() weight_error: formatWeightDiv(citem.weight_error).toString(),
}) })
}) })
}) })
setDetail(() => ({ setDetail(() => ({
title: "面料销售电子确认单", title: '面料销售电子确认单',
company: orderInfo.company_name, //后端公司 company: orderInfo.company_name, //后端公司
order_type: orderInfo.sale_mode_name, //类型：大货 order_type: orderInfo.sale_mode_name, //类型：大货
sale_user: orderInfo.sale_user_name, //业务员 sale_user: orderInfo.sale_user_name, //业务员
@ -72,13 +71,13 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
pay_account: orderInfo.account, //专属收款账号 pay_account: orderInfo.account, //专属收款账号
bank_account_name: orderInfo.account_name, //账户名称 bank_account_name: orderInfo.account_name, //账户名称
bank_name: orderInfo.bank_of_deposit, //开户银行 bank_name: orderInfo.bank_of_deposit, //开户银行
pay_type:"", //支付方式, 可不传 pay_type: '', //支付方式, 可不传
client: orderInfo.purchaser_name, //客户名称 client: orderInfo.purchaser_name, //客户名称
phone: userPhone(orderInfo), //收货手机号码 phone: userPhone(orderInfo), //收货手机号码
order_total_length: (orderInfo.total_number / 100).toString(), //订单布匹长度 order_total_length: (orderInfo.total_number / 100).toString(), //订单布匹长度
order_total_price: formatPriceDiv(orderInfo.bill_total_sale_price).toString(), //订单价格 order_total_price: formatPriceDiv(orderInfo.bill_total_sale_price).toString(), //订单价格
order_total_num: (orderInfo.total_number).toString(), order_total_num: orderInfo.total_number.toString(),
qrcode:"", //跳转链接 qrcode: '', //跳转链接
order_total_weight: formatWeightDiv(orderInfo.total_weight || orderInfo.total_estimate_weight).toString(), //订单布匹重量 order_total_weight: formatWeightDiv(orderInfo.total_weight || orderInfo.total_estimate_weight).toString(), //订单布匹重量
list: lists, list: lists,
@ -120,7 +119,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
const [payCodeImage, setPayCodeImage] = useState<string>('') const [payCodeImage, setPayCodeImage] = useState<string>('')
const fileData = useRef({ const fileData = useRef({
filePath: '', filePath: '',
base64: '' base64: '',
}) })
const { fetchData, state } = GetPayCode() const { fetchData, state } = GetPayCode()
const getCore = async () => { const getCore = async () => {
@ -128,7 +127,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
const base64 = res.data.base64 const base64 = res.data.base64
setPayCodeImage(() => base64) setPayCodeImage(() => base64)
const time = new Date().valueOf() const time = new Date().valueOf()
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []; const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []
let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format
fileData.current.filePath = filePath fileData.current.filePath = filePath
fileData.current.base64 = bodyData fileData.current.base64 = bodyData
@ -140,7 +139,6 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
}) })
} }
//检查是否开启保存图片权限 //检查是否开启保存图片权限
const { check } = useCheckAuthorize({ scope: 'scope.writePhotosAlbum', msg: '您没授权，无法保存图片' }) const { check } = useCheckAuthorize({ scope: 'scope.writePhotosAlbum', msg: '您没授权，无法保存图片' })
const saveImageCheck = async () => { const saveImageCheck = async () => {
@ -158,7 +156,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
}, },
fail: function (err) { fail: function (err) {
console.log('err::', err) console.log('err::', err)
} },
}) })
} }
@ -167,7 +165,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
console.log('fileData.current.filePath::', fileData.current.filePath) console.log('fileData.current.filePath::', fileData.current.filePath)
Taro.previewImage({ Taro.previewImage({
current: fileData.current.filePath, // 当前显示 current: fileData.current.filePath, // 当前显示
urls: [fileData.current.filePath] // 需要预览的图片http链接列表 urls: [fileData.current.filePath], // 需要预览的图片http链接列表
}) })
} }
@ -179,12 +177,15 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
<View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View> <View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
<View className={styles.title}>查看销售码单</View> <View className={styles.title}>查看销售码单</View>
<View className={styles.scanPay_list}> <View className={styles.scanPay_list}>
{(state.loading)&&<LoadingCard/>|| {(state.loading && <LoadingCard />) || (
<ScrollView scrollY className={styles.scanPay_list}> <ScrollView scrollY className={styles.scanPay_list}>
<Image mode="widthFix" src={payCodeImage} onClick={showImage}></Image> <Image mode='widthFix' src={payCodeImage} onClick={showImage}></Image>
</ScrollView>} </ScrollView>
)}
</View>
<View className={styles.btns} onClick={saveImageCheck}>
保存电子确认单
</View> </View>
<View className={styles.btns} onClick={saveImageCheck}>保存电子确认单</View>
</View> </View>
</Popup> </Popup>
</View> </View>

8
src/pages/order/index.module.scss
View File

@ -20,7 +20,7 @@
font-weight: 700; font-weight: 700;
} }
.order_status { .order_status {
background-color: #F0F0F0; background-color: #f0f0f0;
width: 148px; width: 148px;
height: 55px; height: 55px;
color: $color_font_three; color: $color_font_three;
@ -47,7 +47,8 @@
font-size: $font_size; font-size: $font_size;
font-weight: 700; font-weight: 700;
} }
.order_desc_text, .order_desc_text_hint{ .order_desc_text,
.order_desc_text_hint {
font-size: $font_size_medium; font-size: $font_size_medium;
margin-right: 10px; margin-right: 10px;
@ -103,7 +104,6 @@
font-size: $font_size; font-size: $font_size;
font-weight: 700; font-weight: 700;
margin-bottom: 20px; margin-bottom: 20px;
} }
.order_num { .order_num {
display: flex; display: flex;
@ -121,10 +121,8 @@
text { text {
font-size: $font_size; font-size: $font_size;
} }
} }
.weight_memo_con { .weight_memo_con {
margin-bottom: 20px; margin-bottom: 20px;
} }
} }

127
src/pages/order/index.tsx
View File

@ -1,30 +1,27 @@
import { import { GetSaleOrderDetailApi, EditSaleOrderRemarkApi } from '@/api/order'
GetSaleOrderDetailApi, import { AddShoppingCartApi } from '@/api/shopCart'
EditSaleOrderRemarkApi, import { SubscriptionMessageApi } from '@/api/user'
} from "@/api/order"; import { alert, goLink } from '@/common/common'
import { AddShoppingCartApi } from "@/api/shopCart"; import { ORDER_STATUS } from '@/common/enum'
import { SubscriptionMessageApi } from "@/api/user"; import { formatDateTime, formatImgUrl } from '@/common/fotmat'
import { alert, goLink } from "@/common/common"; import OrderBtns from '@/components/orderBtns'
import { ORDER_STATUS } from "@/common/enum"; import Popup from '@/components/popup'
import { formatDateTime, formatImgUrl } from "@/common/fotmat"; import SearchInput from '@/components/searchInput'
import OrderBtns from "@/components/orderBtns"; import ShopCart from '@/components/shopCart'
import Popup from "@/components/popup"; import useLogin from '@/use/useLogin'
import SearchInput from "@/components/searchInput"; import { Text, View } from '@tarojs/components'
import ShopCart from "@/components/shopCart"; import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro'
import useLogin from "@/use/useLogin"; import classnames from 'classnames'
import { Text, View } from "@tarojs/components" import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro"; import AddressInfoDetail from './components/addressInfoDetail'
import classnames from "classnames"; import AdvanceOrderState from './components/advanceOrderState'
import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import ApplyRefund from './components/applyRefund'
import AddressInfoDetail from "./components/addressInfoDetail"; import KindList from './components/kindList'
import AdvanceOrderState from "./components/advanceOrderState"; import OrderState from './components/orderState'
import ApplyRefund from "./components/applyRefund"; import Payment from './components/payment'
import KindList from "./components/kindList"; import Remark from './components/remark'
import OrderState from "./components/orderState"; import ReturnRecord from './components/returnRecord'
import Payment from "./components/payment"; import ScanPayCheck from './components/scanPayCheck'
import Remark from "./components/remark";
import ReturnRecord from "./components/returnRecord";
import ScanPayCheck from "./components/scanPayCheck";
import styles from './index.module.scss' import styles from './index.module.scss'
export default () => { export default () => {
@ -69,8 +66,7 @@ import styles from './index.module.scss'
//监听获取到的数据 //监听获取到的数据
useEffect(() => { useEffect(() => {
if(orderDetail) if (orderDetail) formatData()
formatData()
}, [orderDetail]) }, [orderDetail])
//格式化数据格式 //格式化数据格式
@ -93,9 +89,9 @@ import styles from './index.module.scss'
success: function (res) { success: function (res) {
Taro.showToast({ Taro.showToast({
icon: 'none', icon: 'none',
title: '复制成功' title: '复制成功',
}) })
} },
}) })
} }
@ -113,7 +109,7 @@ import styles from './index.module.scss'
sale_mode: orderDetail?.sale_mode, sale_mode: orderDetail?.sale_mode,
status: orderDetail?.status, status: orderDetail?.status,
take_goods_address: orderDetail?.take_goods_address, take_goods_address: orderDetail?.take_goods_address,
take_goods_phone: orderDetail?.take_goods_phone take_goods_phone: orderDetail?.take_goods_phone,
} }
}, [orderDetail]) }, [orderDetail])
@ -165,7 +161,8 @@ import styles from './index.module.scss'
}, [orderDetail]) }, [orderDetail])
//获取底部按钮点击, 获取按钮状态 //获取底部按钮点击, 获取按钮状态
const orderStateClick = useCallback((val) => { const orderStateClick = useCallback(
(val) => {
if (val == 1 || val == 6 || val == 8) { if (val == 1 || val == 6 || val == 8) {
getSaleOrderPreView() getSaleOrderPreView()
} else if (val == 2) { } else if (val == 2) {
@ -184,8 +181,9 @@ import styles from './index.module.scss'
} else if (val == 10) { } else if (val == 10) {
setShowScanPayCheck(true) setShowScanPayCheck(true)
} }
},
}, [orderDetail]) [orderDetail],
)
//页面下拉刷新 //页面下拉刷新
usePullDownRefresh(() => { usePullDownRefresh(() => {
@ -208,7 +206,7 @@ import styles from './index.module.scss'
const orderInfo = useMemo(() => { const orderInfo = useMemo(() => {
return { return {
orderId: orderDetail?.id, orderId: orderDetail?.id,
...orderDetail ...orderDetail,
} }
}, [orderDetail]) }, [orderDetail])
@ -227,13 +225,13 @@ import styles from './index.module.scss'
//查看物流 //查看物流
const getLogistics = useCallback(() => { const getLogistics = useCallback(() => {
if (orderDetail?.delivery_appendix_url) { if (orderDetail?.delivery_appendix_url) {
const list = orderDetail?.delivery_appendix_url?.map(item => { const list = orderDetail?.delivery_appendix_url?.map((item) => {
return formatImgUrl(item, '!w800') return formatImgUrl(item, '!w800')
}) })
if (list?.length <= 0) return alert.error('暂无图片') if (list?.length <= 0) return alert.error('暂无图片')
Taro.previewImage({ Taro.previewImage({
current: list[0], // 当前显示 current: list[0], // 当前显示
urls: list // 需要预览的图片http链接列表 urls: list, // 需要预览的图片http链接列表
}) })
} }
}, [orderDetail]) }, [orderDetail])
@ -242,9 +240,9 @@ import styles from './index.module.scss'
const [showCart, setShowCart] = useState(false) const [showCart, setShowCart] = useState(false)
const { fetchData: addFetchData } = AddShoppingCartApi() const { fetchData: addFetchData } = AddShoppingCartApi()
const addShopCart = async () => { const addShopCart = async () => {
let color_list:{product_color_id: number, roll?: number, length?: number}[] = [] let color_list: { product_color_id: number; roll?: number; length?: number }[] = []
orderDetail?.product_list.map(pitem => { orderDetail?.product_list.map((pitem) => {
pitem?.product_colors.map(citem => { pitem?.product_colors.map((citem) => {
if (orderDetail?.sale_mode == 0) { if (orderDetail?.sale_mode == 0) {
return color_list.push({ product_color_id: citem.id, roll: citem.roll }) return color_list.push({ product_color_id: citem.id, roll: citem.roll })
} else { } else {
@ -254,20 +252,19 @@ import styles from './index.module.scss'
}) })
const state = await addFetchData({ const state = await addFetchData({
sale_mode: orderDetail?.sale_mode, sale_mode: orderDetail?.sale_mode,
color_list color_list,
}) })
if (state.success) { if (state.success) {
Taro.showToast({ Taro.showToast({
title:'已加入购物车' title: '已加入购物车',
}) })
setShowCart(true) setShowCart(true)
} else { } else {
Taro.showToast({ Taro.showToast({
icon: 'none', icon: 'none',
title: state.msg title: state.msg,
}) })
} }
} }
//显示售后记录 //显示售后记录
@ -284,10 +281,17 @@ import styles from './index.module.scss'
return ( return (
<View className={styles.order_main}> <View className={styles.order_main}>
{(orderDetail?.status != SaleorderstatusWaitingPrePayment.value)&&<OrderState orderInfo={orderDetail}/>|| {(orderDetail?.status != SaleorderstatusWaitingPrePayment.value && <OrderState orderInfo={orderDetail} />) || (
<AdvanceOrderState orderInfo={orderDetail} onRefresh={refresh}/>} <AdvanceOrderState orderInfo={orderDetail} onRefresh={refresh} />
)}
<View> <View>
<AddressInfoDetail orderInfo={defaultAddress} onLogistics={getLogistics} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} /> <AddressInfoDetail
orderInfo={defaultAddress}
onLogistics={getLogistics}
onSelect={getAddress}
onChangeShipmentMode={getShipmentMode}
ref={addressRef}
/>
</View> </View>
<KindList order={formatPreViewOrderMemo} /> <KindList order={formatPreViewOrderMemo} />
<View className={styles.order_info}> <View className={styles.order_info}>
@ -295,37 +299,42 @@ import styles from './index.module.scss'
<SearchInput showBorder={false} title='单号' height='50rpx'> <SearchInput showBorder={false} title='单号' height='50rpx'>
<View className={styles.order_num}> <View className={styles.order_num}>
<Text>{orderDetail?.order_no}</Text> <Text>{orderDetail?.order_no}</Text>
<View className={styles.order_num_btn} onClick={() => clipboardData()}>复制</View> <View className={styles.order_num_btn} onClick={() => clipboardData()}>
复制
</View>
</View> </View>
</SearchInput> </SearchInput>
<SearchInput showBorder={false} title='下单时间' height='50rpx'> <SearchInput showBorder={false} title='下单时间' height='50rpx'>
<Text>{formatDateTime(orderDetail?.create_time)}</Text> <Text>{formatDateTime(orderDetail?.create_time)}</Text>
</SearchInput> </SearchInput>
{(orderDetail?.payment_time)&&<SearchInput showBorder={false} title='付款时间' height='50rpx'> {orderDetail?.payment_time && (
<SearchInput showBorder={false} title='付款时间' height='50rpx'>
<Text>{formatDateTime(orderDetail?.payment_time)}</Text> <Text>{formatDateTime(orderDetail?.payment_time)}</Text>
</SearchInput>} </SearchInput>
)}
</View> </View>
<View className={styles.order_desc} onClick={descOpen}> <View className={styles.order_desc} onClick={descOpen}>
<View className={styles.order_desc_con}>订单备注</View> <View className={styles.order_desc_con}>订单备注</View>
{ {(orderRemark && <View className={styles.order_desc_text}>{orderDetail?.remark}</View>) || (
orderRemark&&<View className={styles.order_desc_text}>{orderDetail?.remark}</View>||
<View className={styles.order_desc_text_hint}>填写备注</View> <View className={styles.order_desc_text_hint}>填写备注</View>
} )}
<View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View> <View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View>
</View> </View>
{(orderDetail?.status != SaleOrderStatusCancel.value)&&<View className={styles.submit_order_con}> {orderDetail?.status != SaleOrderStatusCancel.value && (
<View className={styles.submit_order_con}>
<OrderBtns orderInfo={orderInfo} onClick={orderStateClick} /> <OrderBtns orderInfo={orderInfo} onClick={orderStateClick} />
<View className="common_safe_area_y"></View> <View className='common_safe_area_y'></View>
</View> } </View>
)}
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}> <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
<Remark onSave={(e) => getRemark(e)} defaultValue={orderDetail?.remark} /> <Remark onSave={(e) => getRemark(e)} defaultValue={orderDetail?.remark} />
</Popup> </Popup>
<Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={orderDetail} /> <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={orderDetail} />
<ScanPayCheck show={showScanPayCheck} onClose={() => setShowScanPayCheck(false)} orderInfo={orderDetail} /> <ScanPayCheck show={showScanPayCheck} onClose={() => setShowScanPayCheck(false)} orderInfo={orderDetail} />
<ApplyRefund show={refundShow} onClose={applyRefundClose} orderId={orderDetail?.id} /> <ApplyRefund show={refundShow} onClose={applyRefundClose} orderId={orderDetail?.id} />
<ShopCart intoStatus="again" show={showCart} onClose={() => setShowCart(false)}/> <ShopCart intoStatus='again' show={showCart} onClose={() => setShowCart(false)} />
<ReturnRecord show={returnRecordShow} onClose={closeReturnRecord} id={orderDetail?.id} /> <ReturnRecord show={returnRecordShow} onClose={closeReturnRecord} id={orderDetail?.id} />
<View className="common_safe_area_y"></View> <View className='common_safe_area_y'></View>
</View> </View>
) )
} }

2
src/pages/order/orderList/index.module.scss
View File

@ -11,7 +11,7 @@
height: 160px; height: 160px;
.order_status_list { .order_status_list {
font-size: $font_size; font-size: $font_size;
color: #9E9E9E; color: #9e9e9e;
margin-top: 20px; margin-top: 20px;
.order_status_item { .order_status_item {
padding: 20px; padding: 20px;

81
src/pages/order/orderList/index.tsx
View File

@ -1,21 +1,21 @@
import Search from "@/components/search" import Search from '@/components/search'
import useLogin from "@/use/useLogin" import useLogin from '@/use/useLogin'
import {View } from "@tarojs/components" import { View } from '@tarojs/components'
import Taro, { useDidShow,} from "@tarojs/taro" import Taro, { useDidShow } from '@tarojs/taro'
import { useCallback, useEffect, useMemo, useRef, useState } from "react" import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import styles from './index.module.scss' import styles from './index.module.scss'
import Order from "./components/order" import Order from './components/order'
import InfiniteScroll from "@/components/infiniteScroll" import InfiniteScroll from '@/components/infiniteScroll'
import { GetOrderListApi, OrderStatusListApi } from '@/api/order' import { GetOrderListApi, OrderStatusListApi } from '@/api/order'
import { dataLoadingStatus, getFilterData } from "@/common/util" import { dataLoadingStatus, getFilterData } from '@/common/util'
import OrderStatusList from "./components/orderStatusList" import OrderStatusList from './components/orderStatusList'
import { AddShoppingCartApi } from "@/api/shopCart" import { AddShoppingCartApi } from '@/api/shopCart'
import ShopCart from "@/components/shopCart" import ShopCart from '@/components/shopCart'
import { alert } from "@/common/common" import { alert } from '@/common/common'
import { useRouter } from "@tarojs/runtime" import { useRouter } from '@tarojs/runtime'
import Payment from "../components/payment" import Payment from '../components/payment'
import ApplyRefund from "../components/applyRefund" import ApplyRefund from '../components/applyRefund'
import ReturnRecord from "../components/returnRecord" import ReturnRecord from '../components/returnRecord'
export default () => { export default () => {
const { checkLogin } = useLogin() const { checkLogin } = useLogin()
@ -34,11 +34,11 @@ export default () => {
}, [router]) }, [router])
//搜索参数 //搜索参数
const [searchField, setSearchField] = useState<{status: number|null, page: number, size: number, name: string}>({ const [searchField, setSearchField] = useState<{ status: number | null; page: number; size: number; name: string }>({
status: null, status: null,
page: 1, page: 1,
size: 10, size: 10,
name:'' name: '',
}) })
//获取订单状态 //获取订单状态
@ -54,7 +54,7 @@ export default () => {
//获取订单列表 //获取订单列表
const { fetchData: listFetchData, state: orderState } = GetOrderListApi() const { fetchData: listFetchData, state: orderState } = GetOrderListApi()
const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0}) const [orderData, setOrderData] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
const getOrderList = async () => { const getOrderList = async () => {
let res = await listFetchData(getFilterData(searchField)) let res = await listFetchData(getFilterData(searchField))
setOrderData((e) => ({ ...e, list: res.data?.list, total: res.data?.total })) setOrderData((e) => ({ ...e, list: res.data?.list, total: res.data?.total }))
@ -83,7 +83,6 @@ export default () => {
setOrderData(() => ({ list: [], total: 0 })) setOrderData(() => ({ list: [], total: 0 }))
}, []) }, [])
//数据加载状态 //数据加载状态
const statusMore = useMemo(() => { const statusMore = useMemo(() => {
return dataLoadingStatus({ list: orderData.list, total: orderData.total, status: orderState.loading }) return dataLoadingStatus({ list: orderData.list, total: orderData.total, status: orderState.loading })
@ -96,7 +95,6 @@ export default () => {
setSearchField((val) => ({ ...val, name: e, size: 10 })) setSearchField((val) => ({ ...val, name: e, size: 10 }))
}, []) }, [])
//列表下拉刷新 //列表下拉刷新
const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false) const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
const getRefresherRefresh = async () => { const getRefresherRefresh = async () => {
@ -106,7 +104,8 @@ export default () => {
} }
//监听点击的按钮 //监听点击的按钮
const clickOrderBtn = useCallback(({status, orderInfo}) => { const clickOrderBtn = useCallback(
({ status, orderInfo }) => {
setCallBackPayOrderInfo(() => orderInfo) setCallBackPayOrderInfo(() => orderInfo)
if (status == 1 || status == 6 || status == 8) { if (status == 1 || status == 6 || status == 8) {
getOrderList() getOrderList()
@ -125,8 +124,9 @@ export default () => {
} else if (status == 10) { } else if (status == 10) {
setShowScanPayCheck(true) setShowScanPayCheck(true)
} }
}, [orderData]) },
[orderData],
)
const [callBackOrderInfo, setCallBackPayOrderInfo] = useState<any>() const [callBackOrderInfo, setCallBackPayOrderInfo] = useState<any>()
@ -149,9 +149,9 @@ export default () => {
const [showCart, setShowCart] = useState(false) const [showCart, setShowCart] = useState(false)
const { fetchData: addFetchData } = AddShoppingCartApi() const { fetchData: addFetchData } = AddShoppingCartApi()
const addShopCart = async (item) => { const addShopCart = async (item) => {
let color_list:{product_color_id: number, roll?: number, length?: number}[] = [] let color_list: { product_color_id: number; roll?: number; length?: number }[] = []
item?.product_list.map(pitem => { item?.product_list.map((pitem) => {
pitem?.product_colors.map(citem => { pitem?.product_colors.map((citem) => {
if (item?.sale_mode == 0) { if (item?.sale_mode == 0) {
return color_list.push({ product_color_id: citem.id, roll: citem.roll }) return color_list.push({ product_color_id: citem.id, roll: citem.roll })
} else { } else {
@ -161,20 +161,19 @@ export default () => {
}) })
const state = await addFetchData({ const state = await addFetchData({
sale_mode: item?.sale_mode, sale_mode: item?.sale_mode,
color_list color_list,
}) })
if (state.success) { if (state.success) {
Taro.showToast({ Taro.showToast({
title:'已加入购物车' title: '已加入购物车',
}) })
setShowCart(true) setShowCart(true)
} else { } else {
Taro.showToast({ Taro.showToast({
icon: 'none', icon: 'none',
title: state.msg title: state.msg,
}) })
} }
} }
//申请退款 //申请退款
@ -198,18 +197,28 @@ export default () => {
return ( return (
<View className={styles.order_list_main}> <View className={styles.order_list_main}>
<View className={styles.title}> <View className={styles.title}>
<Search placeIcon="out" placeholder="搜索商品/名称/颜色/订单号" showBtn={true} changeOnSearch={getSearchData} debounceTime={300}/> <Search placeIcon='out' placeholder='搜索商品/名称/颜色/订单号' showBtn={true} changeOnSearch={getSearchData} debounceTime={300} />
<OrderStatusList list={statusList} onSelect={changeStatus} defaultId={router?.params.status as number} /> <OrderStatusList list={statusList} onSelect={changeStatus} defaultId={router?.params.status as number} />
</View> </View>
<View className={styles.order_list}> <View className={styles.order_list}>
<InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={true} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={getRefresherRefresh}> <InfiniteScroll
{orderData?.list?.map(item => { statusMore={statusMore}
return <View key={item.id} className={styles.order_item_con}> <Order value={item} onClickBtn={clickOrderBtn}/></View> selfonScrollToLower={getScrolltolower}
refresherEnabled={true}
refresherTriggered={refresherTriggeredStatus}
selfOnRefresherRefresh={getRefresherRefresh}>
{orderData?.list?.map((item) => {
return (
<View key={item.id} className={styles.order_item_con}>
{' '}
<Order value={item} onClickBtn={clickOrderBtn} />
</View>
)
})} })}
</InfiniteScroll> </InfiniteScroll>
</View> </View>
<ApplyRefund show={refundShow} onClose={applyRefundClose} orderId={callBackOrderInfo?.id} /> <ApplyRefund show={refundShow} onClose={applyRefundClose} orderId={callBackOrderInfo?.id} />
<ShopCart intoStatus="again" show={showCart} onClose={() => setShowCart(false)} default_sale_mode={callBackOrderInfo?.sale_mode}/> <ShopCart intoStatus='again' show={showCart} onClose={() => setShowCart(false)} default_sale_mode={callBackOrderInfo?.sale_mode} />
<ReturnRecord show={returnRecordShow} onClose={closeReturnRecord} id={callBackOrderInfo?.id} /> <ReturnRecord show={returnRecordShow} onClose={closeReturnRecord} id={callBackOrderInfo?.id} />
<Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={callBackOrderInfo} /> <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={callBackOrderInfo} />
</View> </View>