feat: 发货单对接70%

This commit is contained in:
xuan 2022-09-20 19:37:06 +08:00
parent 078f3e79b7
commit 5ae01087ab
20 changed files with 662 additions and 324 deletions

View File

@ -40,6 +40,10 @@ export default defineAppConfig({
root: 'pages/delivery', root: 'pages/delivery',
pages: ['index'], pages: ['index'],
}, },
{
root: 'pages/deliveryDetail',
pages: ['index'],
},
{ {
root: 'pages/colorRelated', root: 'pages/colorRelated',
pages: ['sampleComparison/index', 'takeColor/index', 'findColor/index'], pages: ['sampleComparison/index', 'takeColor/index', 'findColor/index'],

View File

@ -111,6 +111,7 @@ export const dataLoadingStatus = ({ list = [], total = 0, status = false }: { li
function delay(delayTime = 25): Promise<null> { function delay(delayTime = 25): Promise<null> {
return new Promise(resolve => { return new Promise(resolve => {
setTimeout(() => { setTimeout(() => {
// @ts-ignore
resolve() resolve()
}, delayTime) }, delayTime)
}) })

View File

@ -11,7 +11,7 @@ type Segment = {
type PropsType = { type PropsType = {
list: Segment[] list: Segment[]
defaultId?: number defaultId?: number
onSelect?: (val: number) => void onSelect?: (data: {id: number, name:string}) => void
} }
const segmentedControl: FC<PropsType> = (props) => { const segmentedControl: FC<PropsType> = (props) => {
@ -40,7 +40,7 @@ const segmentedControl: FC<PropsType> = (props) => {
const clickEvent = ({ item, index }: { item: any; index: number }) => { const clickEvent = ({ item, index }: { item: any; index: number }) => {
const num = index > 0 ? index - 1 : 0 const num = index > 0 ? index - 1 : 0
setSelectInfo((e) => ({ ...e, tabId: list[num].id.toString(), selected: item.id })) setSelectInfo((e) => ({ ...e, tabId: list[num].id.toString(), selected: item.id }))
onSelect?.(item.id) onSelect?.(item)
} }
return ( return (

View File

@ -57,6 +57,9 @@
} }
} }
&--text { &--text {
display: flex;
flex-flow: row nowrap;
align-items: center;
color: currentColor; color: currentColor;
} }
// active 伪类 // active 伪类

View File

@ -17,6 +17,7 @@ interface PropsType {
onClick?: Function onClick?: Function
customClassName?: string customClassName?: string
customStyles?: React.CSSProperties customStyles?: React.CSSProperties
customTextClassName?: string
} }
const NormalButton: FC<PropsType> = (props) => { const NormalButton: FC<PropsType> = (props) => {
@ -31,6 +32,7 @@ const NormalButton: FC<PropsType> = (props) => {
circle = false, circle = false,
customStyles = {}, customStyles = {},
customClassName = '', customClassName = '',
customTextClassName = ''
} = props } = props
const getClassName = () => { const getClassName = () => {
const classObject = { const classObject = {
@ -54,7 +56,7 @@ const NormalButton: FC<PropsType> = (props) => {
return ( return (
<View className={classnames(styles['button'], getClassName(), customClassName)} style={customStyles} onClick={handleClick}> <View className={classnames(styles['button'], getClassName(), customClassName)} style={customStyles} onClick={handleClick}>
<Text className={styles['button--text']}>{children}</Text> <View className={classnames(styles['button--text'], customTextClassName)}>{children}</View>
</View> </View>
) )
} }

View File

@ -1,69 +1,76 @@
.search_main{ .search_main {
display: flex;
align-items: center;
position: relative;
width: 100%;
z-index: 0;
.icon_a_sousuo1_self {
color: $color_font_two;
}
.search_con {
position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
position: relative; flex: 1 1 auto;
width: 100%; justify-content: space-between;
z-index: 0; .input_bar {
.icon_a_sousuo1_self{ border-radius: 50px;
font-size: 37px; width: 100%;
color: $color_font_two; height: 60px;
flex: 1 1 auto;
padding-left: 60px;
padding-right: 30px;
background: #eee;
box-sizing: border-box;
display: flex;
align-items: center;
} }
.search_con{ input {
position: relative; flex: 1 1 auto;
display: flex; font-size: 27px;
align-items: center; z-index: 0;
flex: 1 1 auto; &::-webkit-input-placeholder {
input{ /* WebKit browsers */
font-size: 27px; color: #999;
background: #eee; font-size: 16px;
width: 100%; }
height: 60px;
border-radius: 50px;
padding: 0 60px;
box-sizing: border-box;
z-index:0;
&::-webkit-input-placeholder { /* WebKit browsers */
color: #999;
font-size: 16px;
}
&::-moz-placeholder { /* Mozilla Firefox 19+ */ &::-moz-placeholder {
color: #999; /* Mozilla Firefox 19+ */
font-size: 16px; color: #999;
} font-size: 16px;
}
&::-ms-input-placeholder { /* Internet Explorer 10+ */
color: #999;
font-size: 16px;
}
}
.search_closeBtn{
position: absolute;
right: 10px;
}
&::-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #999;
font-size: 16px;
}
} }
.btn{ .search_closeBtn {
width: 100px; margin: 0 15px;
font-size: $font_size_medium; flex: none;
color: $color_font_two;
display: flex;
justify-content: center;
align-items: center;
} }
.icon_inner{ }
margin-right: 20px; .btn {
position: absolute; width: 100px;
left: 10px; font-size: $font_size_medium;
margin-right: 0; color: $color_font_two;
z-index: 10; display: flex;
} justify-content: center;
.icon_out{ align-items: center;
margin-right: 10px; }
} .icon_inner {
.input_out{ margin-right: 20px;
padding-left: 20px !important; position: absolute;
} left: 10px;
margin-right: 0;
z-index: 10;
}
.icon_out {
margin-right: 10px;
}
.input_out {
padding-left: 20px !important;
}
} }

View File

@ -1,110 +1,116 @@
import { Input, View } from "@tarojs/components"; import { Input, View } from '@tarojs/components'
import styles from "./index.module.scss" import styles from './index.module.scss'
import CloseBtn from "@/components/closeBtn" import CloseBtn from '@/components/closeBtn'
import classnames from "classnames"; import classnames from 'classnames'
import { debounce } from "@/common/util"; import { debounce } from '@/common/util'
import { Children, forwardRef, memo, ReactElement, ReactNode, useEffect, useImperativeHandle, useRef, useState } from "react"; import { Children, forwardRef, memo, ReactElement, ReactNode, useEffect, useImperativeHandle, useRef, useState } from 'react'
import IconFont from '../iconfont/iconfont'
type Params = { type Params = {
clickOnSearch?: (val: string) => void clickOnSearch?: (val: string) => void
disabled?: false | true, disabled?: false | true
placeholder?: string, placeholder?: string
changeOnSearch?: (any) => void, changeOnSearch?: (value: string) => void
showIcon?: false | true, showIcon?: false | true
placeIcon?: 'out' | 'inner', placeIcon?: 'out' | 'inner'
style?: Object, style?: Object
showBtn?: false | true, showBtn?: false | true
btnStyle?: Object, btnStyle?: Object
btnTitle?: string, btnTitle?: string
debounceTime?: number //防抖时间,不设默认为零 debounceTime?: number //防抖时间,不设默认为零
defaultValue?: string, defaultValue?: string
children?: ReactNode, children?: ReactNode
customRightSlot?: ReactNode customRightSlot?: ReactNode
} }
export default memo(forwardRef(({ export default memo(
clickOnSearch, //点击筛选按钮触发 forwardRef(
changeOnSearch, //输入文字触发 (
disabled = false, //是否禁用 {
placeholder = '输入搜索内容', clickOnSearch, //点击筛选按钮触发
showIcon = true, //是否显示关闭图标 changeOnSearch, //输入文字触发
showBtn = false, //是否显示搜索按钮 disabled = false, //是否禁用
btnStyle = {}, placeholder = '输入搜索内容',
placeIcon = 'inner', //搜索图标位置inner在里面out在外面 showIcon = true, //是否显示关闭图标
btnTitle = '搜索', //搜索文字 showBtn = false, //是否显示搜索按钮
debounceTime = 0, //防抖时间,不设默认为零 btnStyle = {},
defaultValue = '',//默认值 placeIcon = 'inner', //搜索图标位置inner在里面out在外面
children, btnTitle = '搜索', //搜索文字
customRightSlot debounceTime = 0, //防抖时间,不设默认为零
}: Params, ref) => { defaultValue = '', //默认值
const [inputCon, setInputCon] = useState('') children,
const debounceTimeRef = useRef(0) customRightSlot,
useEffect(() => { }: Params,
ref,
) => {
const [inputCon, setInputCon] = useState('')
const debounceTimeRef = useRef(0)
useEffect(() => {
setInputCon(defaultValue) setInputCon(defaultValue)
}, [defaultValue]) }, [defaultValue])
useEffect(() => { useEffect(() => {
debounceTimeRef.current = debounceTime debounceTimeRef.current = debounceTime
}, [debounceTime]) }, [debounceTime])
const onInputEven = (e) => { const onInputEven = (e) => {
const value = e.detail.value const value = e.detail.value
changeData(value) changeData(value)
} }
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
clearInput clearInput,
})) }))
const clearInput = () => { const clearInput = () => {
setInputCon('') setInputCon('')
changeOnSearch?.('') changeOnSearch?.('')
} }
const changeData = debounce((value) => { const changeData = debounce((value) => {
setInputCon(value) setInputCon(value)
changeOnSearch?.(value) changeOnSearch?.(value)
}, debounceTimeRef.current) }, debounceTimeRef.current)
const onSearch = () => { const onSearch = () => {
clickOnSearch?.(inputCon) clickOnSearch?.(inputCon)
} }
return ( return (
<> <>
<View className={styles.search_main}> <View className={styles.search_main}>
<View className={styles.search_con}> <View className={styles.search_con}>
{showIcon && ( {showIcon && (
<View <IconFont
className={classnames( name='icon-sousuo'
'iconfont', size={37}
'icon-sousuo', customClassName={classnames(styles.icon_a_sousuo1_self, placeIcon == 'inner' ? styles.icon_inner : styles.icon_out)}></IconFont>
styles.icon_a_sousuo1_self, )}
placeIcon == 'inner' ? styles.icon_inner : styles.icon_out, <View className={styles.input_bar}>
)}></View> <Input
)} placeholderStyle='color:#ABABAB; font-size:26rpx'
<Input onConfirm={onSearch}
placeholderStyle='color:#ABABAB; font-size:26rpx' className={classnames(placeIcon == 'out' && styles.input_out)}
onConfirm={onSearch} disabled={disabled}
className={classnames(placeIcon == 'out' && styles.input_out)} value={inputCon}
disabled={disabled} placeholder={placeholder}
value={inputCon} onInput={(e) => onInputEven(e)}
placeholder={placeholder} />
onInput={(e) => onInputEven(e)}></Input> <View className={styles.search_closeBtn}>
{!!inputCon && ( {!!inputCon && <CloseBtn onClose={() => clearInput()} styleObj={{ width: '20rpx', height: '20rpx', backgroundColor: '#fff', border: '0' }} />}
<View className={styles.search_closeBtn}> </View>
<CloseBtn onClose={() => clearInput()} styleObj={{ width: '20rpx', height: '20rpx', backgroundColor: '#fff', border: '0' }} /> <View>{customRightSlot}</View>
</View>
</View>
{showBtn && (
<View style={btnStyle} className={styles.btn} onClick={onSearch}>
{btnTitle}
</View> </View>
)} )}
{customRightSlot} {children}
</View> </View>
{showBtn && ( </>
<View style={btnStyle} className={styles.btn} onClick={onSearch}> )
{btnTitle} },
</View> ),
)} )
{children}
</View>
</>
)
}))

View File

@ -0,0 +1,42 @@
import SegmentedControl from '@/components/segmentedControl'
import { FC, memo, useCallback, useEffect, useState } from 'react'
import { EnumSaleorderStatus } from '@/api/index'
type PropsType = {
onChangeStatus?: (data: {id: number, name: string}) => void
}
const DeliveryStatusList = memo<PropsType>((props) => {
const { onChangeStatus } = props
const { fetchData } = EnumSaleorderStatus()
const [statusList, setStatusList] = useState([
{
id: -1,
name: '全部',
},
])
// 请求
const getDeliveryStatusList = async () => {
const res = await fetchData()
console.log(res.data.list);
setStatusList(
res.data.list.filter((item) => {
return item.id === 3 || item.id === 4 // 待发货 已完成
}),
)
}
useEffect(() => {
getDeliveryStatusList()
}, [])
// //状态改变
const changeStatus = useCallback(
(data: {id:number, name: string}) => {
onChangeStatus && onChangeStatus({ id: data.id, name: data.name })
},
[onChangeStatus],
)
return <SegmentedControl list={statusList} onSelect={changeStatus} defaultId={statusList[0].id} />
})
export default DeliveryStatusList

View File

@ -0,0 +1,41 @@
.filterItem {
margin: 24px 48px;
&--title {
font-size: 28px;
font-weight: 550;
line-height: 1.5;
}
&--wrapper {
margin-top: 24px;
display: grid;
grid-gap: 16px 16px;
}
}
.filter {
&--time {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
&--inputBar {
}
&--type {
grid-template-columns: 1fr 1fr;
}
}
.filterTypeButton{
padding: 0 24px;
font-size: 28px;
}
.filterTypeText{
color: #6e6e6e !important;
}
.filterTimeButton{
padding: 0 24px;
font-size: 28px;
grid-column-start: span 2;
}
.selected{
background-color: #eaf2ff;
}

View File

@ -0,0 +1,152 @@
import NormalButton from "@/components/normalButton"
import Popup from "@/components/popup"
import { View } from "@tarojs/components"
import classnames from "classnames"
import styles from './index.module.scss'
import { FC, memo, useEffect, useState } from 'react'
import Search from "@/components/search"
import IconFont from "@/components/iconfont/iconfont"
import {EnumDeliveryNoticeTypeList} from '@/api/index'
type SearchFilter = {
type?: number
}
const scanIcon = () => {
// 扫描
const handleScan = () => {}
return (
<View onClick={handleScan} className={styles.scanHandler}>
<IconFont name='icon-saomiao' size={40}></IconFont>
</View>
)
}
const DeliveryFilter: FC = memo(() => {
const {fetchData} = EnumDeliveryNoticeTypeList()
const [searchFilter, useSearchFilter] = useState<SearchFilter>({
})
const handleSelectedType = (type: string | number) => {
if (typeof type === 'string' && type === 'default') {
// setSearch((e) => ({ ...e }))
} else {
// setSearch((e) => ({ ...e, type: type as number }))
}
}
const handleSearchBarChange = () => {}
useEffect(() => {
getEnumData()
}, [])
const [typeList, setTypeList] = useState<{id: number, name: string}[]>()
const getEnumData = async () => {
const res = await fetchData()
setTypeList(res.data.list)
}
return (
<>
<View className={styles.filterItem}>
<View className={styles['filterItem--title']}></View>
<View className={classnames(styles['filterItem--wrapper'], styles['filter--type'])}>
<NormalButton
type={searchFilter.type == null ? 'primary' : 'info'}
plain={searchFilter.type === null}
circle
customClassName={classnames(styles.filterTypeButton)}
customTextClassName={searchFilter.type === null && styles.filterTypeText}
onClick={() => handleSelectedType('default')}>
</NormalButton>
{!!typeList?.length && typeList?.map(item => {
return (
<NormalButton
type={searchFilter.type === item?.id ? 'primary' : 'info'}
plain={searchFilter.type !== item?.id}
circle
customClassName={styles.filterTypeButton}
customTextClassName={searchFilter.type === item?.id && styles.filterTypeText}
onClick={() => handleSelectedType(item?.id)}>
{item.name}
</NormalButton>
)
})}
{/* <NormalButton
type={searchFilter.type === 0 ? 'primary' : 'info'}
plain={searchFilter.type !== 0}
circle
customClassName={styles.filterTypeButton}
customTextClassName={searchFilter.type === 0 && styles.filterTypeText}
onClick={() => handleSelectedType(1)}>
</NormalButton>
<NormalButton
type={searchFilter.type === 0 ? 'primary' : 'info'}
plain={searchFilter.type !== 0}
circle
customClassName={styles.filterTypeButton}
customTextClassName={searchFilter.type === 1 && styles.filterTypeText}
onClick={() => handleSelectedType(2)}>
</NormalButton>
<NormalButton
type={searchFilter.type === 0 ? 'primary' : 'info'}
plain={searchFilter.type !== 0}
circle
customClassName={styles.filterTypeButton}
customTextClassName={searchFilter.type === 2 && styles.filterTypeText}
onClick={() => handleSelectedType(3)}>
退
</NormalButton> */}
</View>
</View>
<View className={styles.filterItem}>
<View className={styles['filterItem--title']}></View>
<View className={classnames(styles['filterItem--wrapper'], styles['filter--inputBar'])}>
<Search
placeholder='请输入或扫描条形码'
showBtn={false}
changeOnSearch={handleSearchBarChange}
debounceTime={300}
customRightSlot={scanIcon()}></Search>
</View>
</View>
<View className={styles.filterItem}>
<View className={styles['filterItem--title']}></View>
<View className={classnames(styles['filterItem--wrapper'], styles['filter--time'])}>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
7
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
30
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
90
</NormalButton>
<NormalButton type='primary' circle customClassName={styles.filterTimeButton}>
{<IconFont name='icon-chakanquanbukehu' size={60}></IconFont>}
</NormalButton>
</View>
</View>
</>
)
})
export default DeliveryFilter

View File

@ -15,7 +15,12 @@
} }
&__orderStatus { &__orderStatus {
font-weight: 550; font-weight: 550;
color: #e42945; &--toBeAudited{
color: #e42945;
}
&--finish{
color: $color_main;
}
} }
} }
.content { .content {
@ -27,8 +32,10 @@
font-size: 28px; font-size: 28px;
color: rgba($color: #000000, $alpha: 0.4); color: rgba($color: #000000, $alpha: 0.4);
&__left { &__left {
min-width: 140px;
} }
&__right { &__right {
@include common_ellipsis(2);
} }
} }
} }

View File

@ -6,49 +6,87 @@ import { FC } from 'react'
import NormalButton from '@/components/normalButton' import NormalButton from '@/components/normalButton'
import styles from './index.module.scss' import styles from './index.module.scss'
import classnames from 'classnames' import classnames from 'classnames'
import { EnumSaleMode } from '@/common/Enumerate'
import { formatDateTime } from '@/common/format'
import { goLink } from '@/common/common'
import { DeliveryNoticeOrderAudit } from '@/api/index'
import Taro from '@tarojs/taro'
type PropsType = { type PropsType = {
itemData?: Record<string, any> itemData?: Record<string, any>
onSuccess?: Function
} }
const ItemList:FC<PropsType> = (props) => { const ItemList:FC<PropsType> = (props) => {
const { itemData } = props const { itemData, onSuccess } = props
// 查看详情 // 查看详情
const handleDetail = () => { const handleDetail = (id: number) => {
goLink('/pages/deliveryDetail/index', {
id
})
} }
// 确认审核
const handleAudit = () => {
const {fetchData, state} = DeliveryNoticeOrderAudit()
// 确认审核
const handleAudit = (id: number) => {
Taro.showModal({
content: '确认要审核吗?',
confirmColor: '#337FFF',
success: async (res) => {
if (res.confirm) {
const res = await fetchData({ id })
if (res.success) {
Taro.showToast({ title: '审核成功', icon: 'success' })
onSuccess?.()
}else{
Taro.showToast({ title: '审核失败', icon: 'error' })
}
}
},
})
} }
return ( return (
<LayoutBlock circle customClassName={styles.layoutBlock}> <LayoutBlock circle customClassName={styles.layoutBlock}>
<View className={styles.topBar}> <View className={styles.topBar}>
<View className={styles.topBar__orderNo}> <View className={styles.topBar__orderNo}>
<View>XS-LY-2208220092</View> <View>{itemData?.order_no}</View>
<View className={styles.topBar__orderStatus}></View> {itemData?.status === 1 && <View className={classnames(styles.topBar__orderStatus, styles['topBar__orderStatus--finish'])}></View>}
{itemData?.status === 0 && <View className={classnames(styles.topBar__orderStatus, styles['topBar__orderStatus--toBeAudited'])}></View>}
</View> </View>
<Text className={styles.topBar__orderType}></Text> <Text className={styles.topBar__orderType}>{itemData?.type_name}</Text>
</View> </View>
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider> <Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
<View className={styles.content}> <View className={styles.content}>
<View className={classnames(styles.content__row, styles.bord)}> <View className={classnames(styles.content__row, styles.bord)}>
<View className={styles.content__row__left}></View> <View className={styles.content__row__left}></View>
<View className={styles.content__row__right}> <View className={styles.content__row__right}>
<Tag type='primary' circle plain size='small' customClassName={styles.tag}> {itemData?.sale_mode === EnumSaleMode.Bulk && (
<Tag type='primary' circle plain size='small' customClassName={styles.tag}>
</Tag>
245 </Tag>
)}
{itemData?.sale_mode === EnumSaleMode.Plate && (
<Tag type='danger' circle plain size='small' customClassName={styles.tag}>
</Tag>
)}
{itemData?.sale_mode === EnumSaleMode.BulkCut && (
<Tag type='warning' circle plain size='small' customClassName={styles.tag}>
</Tag>
)}
24{itemData?.sale_mode === EnumSaleMode.Bulk ? `${itemData?.delivery_roll}` : `${itemData?.delivery_length}`}
</View> </View>
</View> </View>
<View className={styles.content__row}> <View className={styles.content__row}>
<View className={styles.content__row__left}></View> <View className={styles.content__row__left}></View>
<View className={styles.content__row__right}></View> <View className={styles.content__row__right}>{itemData?.delivery_address || '空'}</View>
</View> </View>
<View className={styles.content__row}> <View className={styles.content__row}>
<View className={styles.content__row__left}></View> <View className={styles.content__row__left}></View>
<View className={styles.content__row__right}>2022-09-01 18:32:32</View> <View className={styles.content__row__right}>{formatDateTime(itemData?.create_time) || '空'}</View>
</View> </View>
</View> </View>
<View className={styles.bottomBar}> <View className={styles.bottomBar}>
@ -57,12 +95,14 @@ const ItemList:FC<PropsType> = (props) => {
type='info' type='info'
customStyles={{ color: '#8e8e8e', borderColor: '#8e8e8e' }} customStyles={{ color: '#8e8e8e', borderColor: '#8e8e8e' }}
round round
onClick={handleDetail}> onClick={() => handleDetail(itemData?.id)}>
</NormalButton> </NormalButton>
<NormalButton customClassName={styles.bottomBar__button} type='primary' round onClick={handleAudit}> {itemData?.status === 0 && (
<NormalButton customClassName={styles.bottomBar__button} type='primary' round onClick={() => handleAudit(itemData?.id)}>
</NormalButton>
</NormalButton>
)}
</View> </View>
</LayoutBlock> </LayoutBlock>
) )

View File

@ -22,17 +22,21 @@ page {
flex: 1 1 auto; flex: 1 1 auto;
background-color: #f7f7f7; background-color: #f7f7f7;
overflow: scroll; overflow: scroll;
&--total {
display: block;
margin-top: 24px;
padding: 0 24px;
font-size: 24px;
color: #9d9d9d;
}
} }
} }
.scanHandler{ .scanHandler {
width: 40px; width: 40px;
height: 40px; height: 40px;
position: absolute;
right: 40px;
} }
.icon__filter{ .icon__filter {
padding: 0 20px; padding: 0 20px;
padding-right: 10px; padding-right: 10px;
} }

View File

@ -1,40 +1,63 @@
import { View, Text } from '@tarojs/components' import { View, Text } from '@tarojs/components'
import { useCallback, useEffect, useMemo, useRef, useState, FC } from 'react' import { useCallback, useEffect, useMemo, useRef, useState, FC, memo } from 'react'
import styles from './index.module.scss' import styles from './index.module.scss'
import classnames from 'classnames' import classnames from 'classnames'
import Search from '@/components/search' import Search from '@/components/search'
import { ClientListApi } from '@/api/order' import { DeliverNoticeOrderList, EnumSaleorderStatus } from '@/api/index'
import Taro from '@tarojs/taro' import Taro from '@tarojs/taro'
import { useRouter } from '@tarojs/taro' import { useRouter } from '@tarojs/taro'
import InfiniteScroll from '@/components/infiniteScroll' import InfiniteScroll from '@/components/infiniteScroll'
import { dataLoadingStatus, getFilterData } from '@/common/util' import { dataLoadingStatus, getFilterData } from '@/common/util'
import IconText from '@/components/iconText' import IconText from '@/components/iconText'
import SegmentedControl from '@/components/segmentedControl'
import IconFont from '@/components/iconfont/iconfont' import IconFont from '@/components/iconfont/iconfont'
import ItemList from './components/ItemList' import ItemList from './components/ItemList'
import DeliveryStatusList from './components/DeliveryStatusList'
import Popup from '@/components/popup'
import DeliveryFilter from './components/Filter'
type SearchData = {
delivery_notice_order_no?: string // 发货单号
delivery_notice_order_status?: number | string // 发货状态
date_min?: string // 开始时间
date_max?: string // 结束时间
type?: number // 发货类型
page: number
size: number
}
const scanIcon = () => {
// 扫描
const handleScan = () => {}
return (
<View onClick={handleScan} className={styles.scanHandler}>
<IconFont name='icon-saomiao' size={40}></IconFont>
</View>
)
}
// 发货列表 // 发货列表
const Delivery: FC = () => { const Delivery: FC = () => {
// const [search, setSearch] = useState({ const [search, setSearch] = useState<SearchData>({
// name: null, delivery_notice_order_status: 0, // 待发货
// page: 1, page: 1,
// size: 10, size: 10,
// }) })
// const [clentList, setClientlist] = useState<{ list: any[]; total: number }>({ list: [], total: 0 }) const [deliveryOrderList, setDeliveryOrderList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
// const { fetchData: clitentFetch, state: orderState } = ClientListApi() const { fetchData: FetchDeliveryOrderList, state: orderState } = DeliverNoticeOrderList()
// //数据加载状态 //数据加载状态
// const statusMore = useMemo(() => { const statusMore = useMemo(() => {
// return dataLoadingStatus({ list: clentList.list, total: clentList.total, status: orderState.loading }) return dataLoadingStatus({ list: deliveryOrderList.list, total: deliveryOrderList.total, status: orderState.loading })
// }, [clentList, orderState]) }, [deliveryOrderList, orderState])
// const [clientObj, setclientObj] = useState({ // const [clientObj, setclientObj] = useState({
// clientId: null, // clientId: null,
// clientName: '', // clientName: '',
// }) // })
//输入了搜索关键字 //输入搜索关键字
const getSearchData = useCallback((eq) => { const getSearchData = useCallback((searchValue: string) => {
console.log('searchValue==>', searchValue)
// pageNum.current.page = 1 // pageNum.current.page = 1
// setClientlist(() => ({ list: [], total: 0 })) // setClientlist(() => ({ list: [], total: 0 }))
// setSearch((e) => ({ ...e, name: eq, size: 10 })) // setSearch((e) => ({ ...e, name: eq, size: 10 }))
@ -42,46 +65,48 @@ const Delivery: FC = () => {
// const router = useRouter() // const router = useRouter()
// useEffect(() => { useEffect(() => {
// if (search.name === '') { console.log('useEffect ===> search', search)
// setSearch((e) => ({ ...e, name: null })) if (search.delivery_notice_order_no === '') {
// } setSearch((e) => ({ ...e, delivery_notice_order_no: undefined }))
// if (search.name !== '') getCuss() }
// }, [search]) if (search.delivery_notice_order_no !== '') getData()
}, [search])
// //上拉加载数据 //上拉加载数据
// const pageNum = useRef({ size: search.size, page: search.page }) const pageNum = useRef({ size: search.size, page: search.page })
// const getScrolltolower = useCallback(() => {
// if (clentList.list.length < clentList.total) {
// pageNum.current.page++
// const size = pageNum.current.size * pageNum.current.page
// setSearch((e) => ({ ...e, size }))
// console.log(search, 11111)
// }
// }, [clentList])
// //列表下拉刷新 const getScrollToLower = useCallback(() => {
// const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false) if (deliveryOrderList.list.length < deliveryOrderList.total) {
// const getRefresherRefresh = async () => { pageNum.current.page++
// pageNum.current.size = 1 const size = pageNum.current.size * pageNum.current.page
// setRefresherTriggeredStatus(true) setSearch((e) => ({ ...e, size }))
// setSearch((val) => ({ ...val, size: 10 })) console.log(search, 11111)
// } }
// const getCuss = async () => { }, [deliveryOrderList])
// let res = await clitentFetch({ name: search.name === null ? '' : search.name, page: search.page, size: search.size })
// if (router?.params.clientId) { //列表下拉刷新
// res.data.list.map((item) => { const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
// if (item.id == router?.params.clientId) { const getRefresherRefresh = async () => {
// item.checked = true pageNum.current.size = 1
// } else { setRefresherTriggeredStatus(true)
// item.checked = false setSearch((val) => ({ ...val, size: 10 }))
// } }
// return item const getData = async () => {
// }) const res = await FetchDeliveryOrderList(getFilterData(search))
// } // if (router?.params.clientId) {
// setClientlist((e) => ({ ...e, list: res.data?.list, total: res.data?.total })) // res.data.list.map((item) => {
// setRefresherTriggeredStatus(() => false) // if (item.id == router?.params.clientId) {
// } // item.checked = true
// } else {
// item.checked = false
// }
// return item
// })
// }
setDeliveryOrderList((e) => ({ ...e, list: res.data?.list, total: res.data?.total }))
setRefresherTriggeredStatus(() => false)
}
// //选择客户 // //选择客户
// const selectClient = (item) => { // const selectClient = (item) => {
@ -120,39 +145,35 @@ const Delivery: FC = () => {
// } // }
// }, [clientObj]) // }, [clientObj])
// 筛选列表 const handleChangeFilterData = () => {}
const onShowFilter = () => {}
const [statusList, setStatusList] = useState([ const [currentStatus, setCurrentStatus] = useState('待发货')
{
id: -1,
name: '待发货',
},
{
id: 2,
name: '已完成',
},
])
// //状态改变 const handleChangeStatus = ({ id: statusId, name: statusName }) => {
const changeStatus = useCallback((e) => { let fuckingBadCodeId: string | number = 0
// pageNum.current.page = 1 if (statusId === 3) {
// setSearchField((value) => ({ ...value, status: e, size: 10 })) fuckingBadCodeId = 0
} else if (statusId === 4) {
console.log(e, '123123') fuckingBadCodeId = '1,2'
// setOrderData(() => ({ list: [], total: 0 })) }
}, []) setCurrentStatus(statusName)
// 扫描 setSearch((e) => ({ ...e, delivery_notice_order_status: fuckingBadCodeId }))
const handleScan = () => {} getData()
const scanIcon = () => {
return (
<View onClick={handleScan} className={styles.scanHandler}>
<IconFont name='icon-saomiao' size={40}></IconFont>
</View>
)
} }
const handleAuditSuccess = () => {
getData()
}
const [showFilter, setShowFilter] = useState(false)
// 筛选列表
const onShowFilter = () => {
setShowFilter(true)
}
return ( return (
<View className={styles.delivery}> <View className={styles.delivery}>
<View className={styles.searchBox}> <View className={styles.searchBox}>
@ -163,36 +184,28 @@ const Delivery: FC = () => {
</Search> </Search>
</View> </View>
{/* 状态栏 */} {/* 状态栏 */}
<SegmentedControl list={statusList} onSelect={changeStatus} defaultId={-1} /> <DeliveryStatusList onChangeStatus={handleChangeStatus}></DeliveryStatusList>
<View className={styles.listBox}> <View className={styles.listBox}>
{/* <InfiniteScroll <InfiniteScroll
statusMore={statusMore} statusMore={statusMore}
selfonScrollToLower={getScrolltolower} selfonScrollToLower={getScrollToLower}
refresherEnabled={true} refresherEnabled={true}
refresherTriggered={refresherTriggeredStatus} refresherTriggered={refresherTriggeredStatus}
selfOnRefresherRefresh={getRefresherRefresh}> selfOnRefresherRefresh={getRefresherRefresh}>
{clentList.list.map((item, index) => { <Text className={styles['listBox--total']}>
return ( {currentStatus} {deliveryOrderList.total}
<View </Text>
className={classnames(item.checked ? styles.acticveitemBox : styles.itemBox)} {deliveryOrderList.list.map((item, index) => {
key={index} return <ItemList itemData={item} key={item.id} onSuccess={handleAuditSuccess}></ItemList>
onClick={() => {
selectClient(item)
}}>
<View className={styles.cussName}>{item.name}</View>
<View className={styles.phone}>{item.phone}</View>
<View className={styles.woker}>{item.sale_user_name}</View>
</View>
)
})} })}
</InfiniteScroll> */} </InfiniteScroll>
<ItemList></ItemList>
<ItemList></ItemList>
<ItemList></ItemList>
<ItemList></ItemList>
</View> </View>
<Popup show={showFilter} title='筛选列表'>
<DeliveryFilter />
</Popup>
</View> </View>
) )
} }
export default Delivery export default Delivery

View File

@ -0,0 +1,3 @@
export default {
navigationBarTitleText: '发货详情',
}

View File

@ -0,0 +1,3 @@
.deliveryDetail{
}

View File

@ -0,0 +1,8 @@
import { View } from "@tarojs/components"
import { FC } from "react"
import styles from './index.module.scss'
const DeliveryDetail: FC = () => {
return <View className={styles.deliveryDetail}></View>
}
export default DeliveryDetail

View File

@ -12,7 +12,7 @@ import NormalButton from '@/components/normalButton'
import ColorKindItem from '../colorKindItem' import ColorKindItem from '../colorKindItem'
import { EnumSaleMode } from '@/common/Enumerate' import { EnumSaleMode } from '@/common/Enumerate'
import { useNeedMemoCallback } from '@/use/useCommon' import { useNeedMemoCallback } from '@/use/useCommon'
import {selectList} from '../../config' import { selectList } from '../../config'
import { ShoppingContext } from '../../index' import { ShoppingContext } from '../../index'
type PropsType = { type PropsType = {
@ -138,48 +138,50 @@ export default memo<PropsType>((props) => {
<DrawerButton isOpen={openDetail} /> <DrawerButton isOpen={openDetail} />
</View> </View>
</MCheckbox> </MCheckbox>
<View className={classnames(styles.detailBox, openDetail ? styles.drawerOpen : styles.drawerClose)}> {openDetail && (
<View className={styles.orderType}> <View className={classnames(styles.detailBox, openDetail ? styles.drawerOpen : styles.drawerClose)}>
<Divider customClassName={styles.line}></Divider> <View className={styles.orderType}>
<View className={styles.orderTitle}></View> <Divider customClassName={styles.line}></Divider>
<View className={styles.orderTypeDetail}> <View className={styles.orderTitle}></View>
<NormalButton <View className={styles.orderTypeDetail}>
type={selected === EnumSaleMode.Bulk ? 'primary' : 'info'} <NormalButton
plain={selected !== EnumSaleMode.Bulk} type={selected === EnumSaleMode.Bulk ? 'primary' : 'info'}
customStyles={{ padding: '0 50rpx' }} plain={selected !== EnumSaleMode.Bulk}
circle customStyles={{ padding: '0 50rpx' }}
onClick={() => onSelectOrderType(EnumSaleMode.Bulk)}> circle
onClick={() => onSelectOrderType(EnumSaleMode.Bulk)}>
</NormalButton>
<NormalButton </NormalButton>
type={selected === EnumSaleMode.Plate ? 'primary' : 'info'} <NormalButton
plain={selected !== EnumSaleMode.Plate} type={selected === EnumSaleMode.Plate ? 'primary' : 'info'}
customStyles={{ padding: '0 50rpx' }} plain={selected !== EnumSaleMode.Plate}
circle customStyles={{ padding: '0 50rpx' }}
onClick={() => onSelectOrderType(EnumSaleMode.Plate)}> circle
onClick={() => onSelectOrderType(EnumSaleMode.Plate)}>
</NormalButton>
<NormalButton </NormalButton>
type={selected === EnumSaleMode.BulkCut ? 'primary' : 'info'} <NormalButton
plain={selected !== EnumSaleMode.BulkCut} type={selected === EnumSaleMode.BulkCut ? 'primary' : 'info'}
customStyles={{ padding: '0 50rpx' }} plain={selected !== EnumSaleMode.BulkCut}
circle customStyles={{ padding: '0 50rpx' }}
onClick={() => onSelectOrderType(EnumSaleMode.BulkCut)}> circle
onClick={() => onSelectOrderType(EnumSaleMode.BulkCut)}>
</NormalButton>
</NormalButton>
</View>
</View> </View>
</View> <View className={styles.orderColor}>
<View className={styles.orderColor}> <Divider customClassName={styles.line}></Divider>
<Divider customClassName={styles.line}></Divider> <View className={classnames(styles.orderTitle, 'justify-between')}>
<View className={classnames(styles.orderTitle, 'justify-between')}> <Text></Text>
<Text></Text> <Tag type='danger' size='normal' circle plain={false}>
<Tag type='danger' size='normal' circle plain={false}> {selectList[selected].title}{selectList[selected].unit}
{selectList[selected].title}{selectList[selected].unit} </Tag>
</Tag> </View>
</View> </View>
<View className={styles.orderContainer}>{memoList}</View>
</View> </View>
<View className={styles.orderContainer}>{memoList}</View> )}
</View>
</LayoutBlock> </LayoutBlock>
) )
}, useNeedMemoCallback()) }, useNeedMemoCallback())

View File

@ -3,7 +3,7 @@
/* Project id 3619513 */ /* Project id 3619513 */
// url('/src/styles/iconfont.ttf') format('truetype'); // url('/src/styles/iconfont.ttf') format('truetype');
src: src:
url('iconfont.ttf?t=1663556335905') format('truetype'); url('/src/styles/iconfont.ttf?t=1663556335905') format('truetype');
} }
.iconfont { .iconfont {